UserAdd.vue

<template>
  <section class="content">
    <div class="box box-primary">
      <div class="box-header">
        <h3 class="box-title">用户信息</h3>
      </div>
      <div class="box-body">
        <form class="form-horizontal">
          <div class="row">
            <div class="col-md-6">
              <FormGroup label="归属公司" :required="true">
                <div class="input-group">
                  <input type="text" class="form-control" v-model="obj.sysOffice.name" v-validate="'required'" name="归属公司" readonly/>
                  <span class="input-group-btn">
                    <button class="btn btn-info" type="button" @click="companyTreeModalConfig.show = true">选择</button>
                  </span>
                </div>
                <SelectOfficeModal :config="companyTreeModalConfig" v-model="obj.sysOffice"></SelectOfficeModal>
              </FormGroup>
            </div>
          </div>
          <!-- <div class="row">
            <div class="col-md-6">
              <FormGroup label="主管" :required="true">
                <UserElSelect v-model="obj.leader" v-validate="'required'" data-vv-value-path="innerValue" data-vv-name="主管"></UserElSelect>
              </FormGroup>
            </div>
          </div> -->
          <div class="row">
            <div class="col-md-6">
              <FormGroup label="工号">
                <input type="text" class="form-control" v-model="obj.workNumber" name="工号" maxlength="50" />
              </FormGroup>
            </div>
          </div>
          <div class="row">
            <div class="col-md-6">
              <FormGroup label="姓名" :required="true">
                <input type="text" class="form-control" v-model="obj.userInfo.name" v-validate="'required'" name="姓名" maxlength="50"/>
              </FormGroup>
            </div>
          </div>
          <div class="row">
            <div class="col-md-6">
              <FormGroup label="登录账号" :required="true">
                <input type="text" class="form-control" v-model="obj.userInfo.account" v-validate="'required'" name="登录账号" maxlength="20"/>
              </FormGroup>
            </div>
          </div>
          <div class="row">
            <div class="col-md-6">
              <FormGroup label="登录密码" :required="true">
                <input type="password" class="form-control" v-model="obj.password" v-validate="'required|password'" name="登录密码" maxlength="20"/>

                <div class="row">
                  <div class="col-md-12">
                    <PasswordStrength :password="obj.password"></PasswordStrength>
                  </div>
                </div>
              </FormGroup>
            </div>
            <div class="col-md-6" v-if="obj.userId">
              <span class="help-block">请输入6-20位字母加数字或符号!</span>
            </div>
          </div>
          <div class="row">
            <div class="col-md-6">
              <FormGroup label="邮箱">
                <input type="text" class="form-control" v-model="obj.userInfo.userContactInfo.email" v-validate="'email'" name="邮箱" maxlength="50"/>
              </FormGroup>
            </div>
          </div>
          <div class="row">
            <div class="col-md-6">
              <FormGroup label="电话">
                <input type="text" class="form-control" v-model="obj.userInfo.userContactInfo.phone" max="20"/>
              </FormGroup>
            </div>
          </div>
          <div class="row">
            <div class="col-md-6">
              <FormGroup label="手机">
                <input type="text" class="form-control" v-model="obj.userInfo.userContactInfo.mobile"v-validate="'mobile'" name="手机"  maxlength="11"/>
              </FormGroup>
            </div>
          </div>
          <div class="row">
            <div class="col-md-12">
              <FormGroup label="角色" :required="true" width="2">
                <div class="checkbox-inline margin-left-10" style="min-width: 165px" v-for="role of roleList">
                  <label>
                    <input type="checkbox" :value="role.id" v-model="obj.roleIdList" v-validate="'required'" name="角色"> {{ role.name }}
                  </label>
                </div>
              </FormGroup>
            </div>
          </div>
          <div class="row">
            <div class="col-md-6">
              <FormGroup label="备注">
                <textarea type="text" class="form-control" v-model="obj.remark" maxlength="200"></textarea>
              </FormGroup>
            </div>
          </div>
        </form>
      </div>
      <div class="box-footer">
        <div class="row">
          <div class="col-md-2 col-md-offset-2">
            <a class="btn btn-block btn-primary" @click="validAndSave()">保存</a>
          </div>
          <div class="col-md-2">
            <a class="btn btn-block btn-default" @click="$router.go(-1)">返回</a>
          </div>
        </div>
      </div>
    </div>
  </section>
</template>

<script>
import UserMixin from './UserMixin.js'

export default {
  mixins: [UserMixin]
}
</script>