Blame view

ant-design-vue-jeecg/src/views/system/modules/UserModal.vue 24.8 KB
1
<template>
2
3
4
5
6
7
8
  <a-drawer
    :title="title"
    :maskClosable="true"
    :width="drawerWidth"
    placement="right"
    :closable="true"
    @close="handleCancel"
9
    :visible="visible"
10
    style="height: 100%;overflow: auto;padding-bottom: 53px;">
11
12
13
14

    <template slot="title">
      <div style="width: 100%;">
        <span>{{ title }}</span>
15
16
        <span style="display:inline-block;width:calc(100% - 51px);padding-right:10px;text-align: right">
          <a-button @click="toggleScreen" icon="appstore" style="height:20px;width:20px;border:0px"></a-button>
17
18
19
20
21
22
23
24
        </span>
      </div>

    </template>

    <a-spin :spinning="confirmLoading">
      <a-form :form="form">
25
        <a-form-item label="用户账号" :labelCol="labelCol" :wrapperCol="wrapperCol">
26
          <a-input placeholder="请输入用户账号" v-decorator.trim="[ 'username', validatorRules.username]" :readOnly="!!model.id"/>
27
28
29
        </a-form-item>

        <template v-if="!model.id">
30
          <a-form-item label="登录密码" :labelCol="labelCol" :wrapperCol="wrapperCol" >
31
            <a-input type="password" placeholder="请输入登录密码" v-decorator="[ 'password',validatorRules.password]" />
32
33
          </a-form-item>
34
          <a-form-item label="确认密码" :labelCol="labelCol" :wrapperCol="wrapperCol" >
35
            <a-input type="password" @blur="handleConfirmBlur" placeholder="请重新输入登录密码" v-decorator="[ 'confirmpassword', validatorRules.confirmpassword]"/>
36
37
38
          </a-form-item>
        </template>
39
        <a-form-item label="用户姓名" :labelCol="labelCol" :wrapperCol="wrapperCol" >
40
          <a-input placeholder="请输入用户姓名" v-decorator.trim="[ 'realname', validatorRules.realname]" />
41
        </a-form-item>
42
43
        <a-form-item label="工号" :labelCol="labelCol" :wrapperCol="wrapperCol">
44
          <a-input placeholder="请输入工号" v-decorator.trim="[ 'workNo', validatorRules.workNo]" />
45
46
47
48
49
50
        </a-form-item>

        <a-form-item label="职务" :labelCol="labelCol" :wrapperCol="wrapperCol">
          <j-select-position placeholder="请选择职务" :multiple="false" v-decorator="['post', {}]"/>
        </a-form-item>
51
        <a-form-item label="角色分配" :labelCol="labelCol" :wrapperCol="wrapperCol" v-show="!roleDisabled" >
52
53
          <a-select
            mode="multiple"
54
            :disabled="departDisabled"
55
56
            style="width: 100%"
            placeholder="请选择用户角色"
57
            optionFilterProp = "children"
58
59
            v-model="selectedRole"
            :getPopupContainer= "(target) => target.parentNode">
60
61
62
63
64
            <a-select-option v-for="(role,roleindex) in roleList" :key="roleindex.toString()" :value="role.id">
              {{ role.roleName }}
            </a-select-option>
          </a-select>
        </a-form-item>
65
66
        <!--部门分配-->
67
        <a-form-item label="部门分配" :labelCol="labelCol" :wrapperCol="wrapperCol" v-show="!departDisabled">
68
          <a-input-search
69
            placeholder="点击选择部门"
70
            v-model="checkedDepartNameString"
71
            readOnly
72
73
74
75
            @search="onSearch">
            <a-button slot="enterButton" icon="search">选择</a-button>
          </a-input-search>
        </a-form-item>
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91

        <!--租户分配-->
        <a-form-item label="租户分配" :labelCol="labelCol" :wrapperCol="wrapperCol" v-show="!departDisabled">

          <a-select
            mode="multiple"
            style="width: 100%"
            placeholder="请选择租户分配"
            :disabled="disableSubmit"
            v-model="currentTenant">
            <a-select-option v-for="(item, index) in tenantList" :key="index" :value="item.id">
              {{ item.name }}
            </a-select-option>
          </a-select>
        </a-form-item>
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
       <!-- update--begin--autor:wangshuai-----date:20200108------for:新增身份和负责部门------ -->
        <a-form-item label="身份" :labelCol="labelCol" :wrapperCol="wrapperCol">
          <a-radio-group
            v-model="identity"
            @change="identityChange">
            <a-radio value="1">普通用户</a-radio>
            <a-radio value="2">上级</a-radio>
          </a-radio-group>
        </a-form-item>
        <a-form-item label="负责部门" :labelCol="labelCol" :wrapperCol="wrapperCol"  v-if="departIdShow==true">
          <a-select
            mode="multiple"
            style="width: 100%"
            placeholder="请选择负责部门"
            v-model="departIds"
            optionFilterProp = "children"
            :getPopupContainer = "(target) => target.parentNode"
            :dropdownStyle="{maxHeight:'200px',overflow:'auto'}"
110
          >
111
112
113
114
115
116
117
118
            <a-select-option v-for="item in resultDepartOptions" :key="item.key" :value="item.key"
            >{{item.title}}</a-select-option
            >
          </a-select>
        </a-form-item>
        <!-- update--end--autor:wangshuai-----date:20200108------for:新增身份和负责部门------ -->
        <a-form-item label="头像" :labelCol="labelCol" :wrapperCol="wrapperCol">
          <j-image-upload class="avatar-uploader" text="上传" v-model="fileList" ></j-image-upload>
119
120
        </a-form-item>
121
        <a-form-item label="生日" :labelCol="labelCol" :wrapperCol="wrapperCol">
122
123
124
          <a-date-picker
            style="width: 100%"
            placeholder="请选择生日"
125
126
            v-decorator="['birthday', {initialValue:!model.birthday?null:moment(model.birthday,dateFormat)}]"
            :getCalendarContainer="node => node.parentNode"/>
127
128
        </a-form-item>
129
        <a-form-item label="性别" :labelCol="labelCol" :wrapperCol="wrapperCol">
130
          <a-select v-decorator="[ 'sex', {}]" placeholder="请选择性别" :getPopupContainer= "(target) => target.parentNode">
131
132
            <a-select-option :value="1">男</a-select-option>
            <a-select-option :value="2">女</a-select-option>
133
134
135
          </a-select>
        </a-form-item>
136
        <a-form-item label="邮箱" :labelCol="labelCol" :wrapperCol="wrapperCol">
137
138
139
          <a-input placeholder="请输入邮箱" v-decorator="[ 'email', validatorRules.email]" />
        </a-form-item>
140
        <a-form-item label="手机号码" :labelCol="labelCol" :wrapperCol="wrapperCol">
141
          <a-input placeholder="请输入手机号码" :disabled="isDisabledAuth('user:form:phone')" v-decorator="[ 'phone', validatorRules.phone]" />
142
143
        </a-form-item>
144
145
146
147
        <a-form-item label="座机" :labelCol="labelCol" :wrapperCol="wrapperCol">
          <a-input placeholder="请输入座机" v-decorator="[ 'telephone', validatorRules.telephone]"/>
        </a-form-item>
148
149
        <a-form-item label="工作流引擎" :labelCol="labelCol" :wrapperCol="wrapperCol">
          <j-dict-select-tag  v-decorator="['activitiSync', {}]" placeholder="请选择是否同步工作流引擎" :type="'radio'" :triggerChange="true" dictCode="activiti_sync"/>
150
151
152
153
        </a-form-item>

      </a-form>
    </a-spin>
154
155
156
157
158
159
160
161
162
    <depart-window ref="departWindow" @ok="modalFormOk"></depart-window>

    <div class="drawer-bootom-button" v-show="!disableSubmit">
      <a-popconfirm title="确定放弃编辑?" @confirm="handleCancel" okText="确定" cancelText="取消">
        <a-button style="margin-right: .8rem">取消</a-button>
      </a-popconfirm>
      <a-button @click="handleSubmit" type="primary" :loading="confirmLoading">提交</a-button>
    </div>
  </a-drawer>
163
164
165
166
167
168
</template>

<script>
  import pick from 'lodash.pick'
  import moment from 'moment'
  import Vue from 'vue'
169
170
  // 引入搜索部门弹出框的组件
  import departWindow from './DepartWindow'
171
  import JSelectPosition from '@/components/jeecgbiz/JSelectPosition'
172
  import { ACCESS_TOKEN } from "@/store/mutation-types"
173
174
  import { getAction } from '@/api/manage'
  import {addUser,editUser,queryUserRole,queryall } from '@/api/api'
175
  import { disabledAuthFilter } from "@/utils/authFilter"
176
  import {duplicateCheck } from '@/api/api'
177
  import JImageUpload from '../../../components/jeecg/JImageUpload'
178
179
  export default {
180
    name: "UserModal",
181
    components: {
182
      JImageUpload,
183
      departWindow,
184
      JSelectPosition
185
    },
186
187
    data () {
      return {
188
189
        departDisabled: false, //是否是我的部门调用该页面
        roleDisabled: false, //是否是角色维护调用该页面
190
        modalWidth:800,
191
        drawerWidth:700,
192
193
        modaltoggleFlag:true,
        confirmDirty: false,
194
195
196
197
        selectedDepartKeys:[], //保存用户选择部门id
        checkedDepartKeys:[],
        checkedDepartNames:[], // 保存部门的名称 =>title
        checkedDepartNameString:"", // 保存部门的名称 =>title
198
        resultDepartOptions:[],
199
        userId:"", //保存用户id
200
        disableSubmit:false,
201
        userDepartModel:{userId:'',departIdList:[]}, // 保存SysUserDepart的用户部门中间表数据需要的对象
202
203
204
205
206
207
208
209
210
211
212
        dateFormat:"YYYY-MM-DD",
        validatorRules:{
          username:{
            rules: [{
              required: true, message: '请输入用户账号!'
            },{
              validator: this.validateUsername,
            }]
          },
          password:{
            rules: [{
213
214
215
              required: true,
              pattern:/^(?=.*[a-zA-Z])(?=.*\d)(?=.*[~!@#$%^&*()_+`\-={}:";'<>?,./]).{8,}$/,
              message: '密码由8位数字、大小写字母和特殊符号组成!'
216
217
218
219
220
221
            }, {
              validator: this.validateToNextPassword,
            }],
          },
          confirmpassword:{
            rules: [{
222
              required: true, message: '请重新输入登录密码!',
223
224
225
226
227
228
            }, {
              validator: this.compareToFirstPassword,
            }],
          },
          realname:{rules: [{ required: true, message: '请输入用户名称!' }]},
          phone:{rules: [{validator: this.validatePhone}]},
229
230
231
232
233
          email:{
            rules: [{
              validator: this.validateEmail
            }],
          },
234
          roles:{},
235
          //  sex:{initialValue:((!this.model.sex)?"": (this.model.sex+""))}
236
237
238
239
240
241
242
243
244
245
246
          workNo: {
            rules: [
              { required: true, message: '请输入工号' },
              { validator: this.validateWorkNo }
            ]
          },
          telephone: {
            rules: [
              { pattern: /^0\d{2,3}-[1-9]\d{6,7}$/, message: '请输入正确的座机号码' },
            ]
          }
247
        },
248
249
        departIdShow:false,
        departIds:[], //负责部门id
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
        title:"操作",
        visible: false,
        model: {},
        roleList:[],
        selectedRole:[],
        labelCol: {
          xs: { span: 24 },
          sm: { span: 5 },
        },
        wrapperCol: {
          xs: { span: 24 },
          sm: { span: 16 },
        },
        uploadLoading:false,
        confirmLoading: false,
        headers:{},
        form:this.$form.createForm(this),
267
        picUrl: "",
268
        url: {
269
270
          fileUpload: window._CONFIG['domianURL']+"/sys/common/upload",
          userWithDepart: "/sys/user/userDepartList", // 引入为指定用户查看部门信息需要的url
271
          userId:"/sys/user/generateUserId", // 引入生成添加用户情况下的url
272
          syncUserByUserName:"/act/process/extActProcess/doSyncUserByUserName",//同步用户到工作流
273
          queryTenantList: '/sys/tenant/queryList'
274
        },
275
276
        identity:"1",
        fileList:[],
277
278
        tenantList: [],
        currentTenant:[]
279
280
281
282
283
      }
    },
    created () {
      const token = Vue.ls.get(ACCESS_TOKEN);
      this.headers = {"X-Access-Token":token}
284
      this.initTenantList()
285
286
287
288
289
290
291
292

    },
    computed:{
      uploadAction:function () {
        return this.url.fileUpload;
      }
    },
    methods: {
293
      isDisabledAuth(code){
294
295
        return disabledAuthFilter(code);
      },
296
297
298
299
300
301
302
      initTenantList(){
        getAction(this.url.queryTenantList).then(res=>{
          if(res.success){
            this.tenantList = res.result
          }
        })
      },
303
304
      //窗口最大化切换
      toggleScreen(){
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
        if(this.modaltoggleFlag){
          this.modalWidth = window.innerWidth;
        }else{
          this.modalWidth = 800;
        }
        this.modaltoggleFlag = !this.modaltoggleFlag;
      },
      initialRoleList(){
        queryall().then((res)=>{
          if(res.success){
            this.roleList = res.result;
          }else{
            console.log(res.message);
          }
        });
      },
      loadUserRoles(userid){
        queryUserRole({userid:userid}).then((res)=>{
          if(res.success){
            this.selectedRole = res.result;
          }else{
            console.log(res.message);
          }
        });
      },
330
      refresh () {
331
332
333
334
          this.selectedDepartKeys=[];
          this.checkedDepartKeys=[];
          this.checkedDepartNames=[];
          this.checkedDepartNameString = "";
335
          this.userId=""
336
337
338
          this.resultDepartOptions=[];
          this.departId=[];
          this.departIdShow=false;
339
          this.currentTenant = []
340
      },
341
      add () {
342
        this.picUrl = "";
343
        this.refresh();
344
        this.edit({activitiSync:'1'});
345
346
      },
      edit (record) {
347
348
349
350
351
        this.resetScreenSize(); // 调用此方法,根据屏幕宽度自适应调整抽屉的宽度
        let that = this;
        that.initialRoleList();
        that.checkedDepartNameString = "";
        that.form.resetFields();
352
        if(record.hasOwnProperty("id")){
353
          that.loadUserRoles(record.id);
354
355
356
          setTimeout(() => {
            this.fileList = record.avatar;
          }, 5)
357
        }
358
359
360
361
        that.userId = record.id;
        that.visible = true;
        that.model = Object.assign({}, record);
        that.$nextTick(() => {
362
          that.form.setFieldsValue(pick(this.model,'username','sex','realname','email','phone','activitiSync','workNo','telephone','post'))
363
        });
364
        //身份为上级显示负责部门,否则不显示
365
        if(this.model.userIdentity=="2"){
366
367
368
369
370
371
            this.identity="2";
            this.departIdShow=true;
        }else{
            this.identity="1";
            this.departIdShow=false;
        }
372
373
374
        // 调用查询用户对应的部门信息的方法
        that.checkedDepartKeys = [];
        that.loadCheckedDeparts();
375
376
377
378
379
380
381
382

        //update-begin-author:taoyan date:2020710 for:多租户配置
        if(!record.relTenantIds || record.relTenantIds.length==0){
          this.currentTenant = []
        }else{
          this.currentTenant = record.relTenantIds.split(',').map(Number);
        }
        //update-end-author:taoyan date:2020710 for:多租户配置
383
384
385
386
      },
      //
      loadCheckedDeparts(){
        let that = this;
387
        if(!that.userId){return}
388
389
390
        getAction(that.url.userWithDepart,{userId:that.userId}).then((res)=>{
          that.checkedDepartNames = [];
          if(res.success){
391
392
            var depart=[];
            var departId=[];
393
394
395
396
            for (let i = 0; i < res.result.length; i++) {
              that.checkedDepartNames.push(res.result[i].title);
              this.checkedDepartNameString = this.checkedDepartNames.join(",");
              that.checkedDepartKeys.push(res.result[i].key);
397
398
399
400
401
402
403
404
405
406
407
408
409
              //新增负责部门选择下拉框
              depart.push({
                  key:res.result[i].key,
                  title:res.result[i].title
              })
              departId.push(res.result[i].key)
            }
            that.resultDepartOptions=depart;
            //判断部门id是否存在,不存在择直接默认当前所在部门
            if(this.model.departIds){
                this.departIds=this.model.departIds.split(",");
            }else{
                this.departIds=departId;
410
            }
411
            that.userDepartModel.departIdList = that.checkedDepartKeys
412
413
414
415
          }else{
            console.log(res.message);
          }
        })
416
417
418
419
420
421
      },
      close () {
        this.$emit('close');
        this.visible = false;
        this.disableSubmit = false;
        this.selectedRole = [];
422
        this.userDepartModel = {userId:'',departIdList:[]};
423
        this.checkedDepartNames = [];
424
425
426
        this.checkedDepartNameString='';
        this.checkedDepartKeys = [];
        this.selectedDepartKeys = [];
427
428
429
430
431
        this.resultDepartOptions=[];
        this.departIds=[];
        this.departIdShow=false;
        this.identity="1";
        this.fileList=[];
432
433
434
      },
      moment,
      handleSubmit () {
435
436
437
438
439
440
441
442
443
444
445
446
        const that = this;
        // 触发表单验证
        this.form.validateFields((err, values) => {
          if (!err) {
            that.confirmLoading = true;
            if(!values.birthday){
              values.birthday = '';
            }else{
              values.birthday = values.birthday.format(this.dateFormat);
            }
            let formData = Object.assign(this.model, values);
447
448
449
450
451
            if(that.fileList != ''){
              formData.avatar = that.fileList;
            }else{
              formData.avatar = null;
            }
452
453
454
            //update-begin-author:taoyan date:2020710 for:多租户配置
            formData.relTenantIds = this.currentTenant.length>0?this.currentTenant.join(','):''
            //update-end-author:taoyan date:2020710 for:多租户配置
455
            formData.selectedroles = this.selectedRole.length>0?this.selectedRole.join(","):'';
456
            formData.selecteddeparts = this.userDepartModel.departIdList.length>0?this.userDepartModel.departIdList.join(","):'';
457
            formData.userIdentity=this.identity;
458
459
460
461
462
463
            //如果是上级择传入departIds,否则为空
            if(this.identity==="2"){
              formData.departIds=this.departIds.join(",");
            }else{
              formData.departIds="";
            }
464
            // that.addDepartsToUser(that,formData); // 调用根据当前用户添加部门信息的方法
465
466
            let obj;
            if(!this.model.id){
467
              formData.id = this.userId;
468
469
470
471
472
473
474
475
              obj=addUser(formData);
            }else{
              obj=editUser(formData);
            }
            obj.then((res)=>{
              if(res.success){
                that.$message.success(res.message);
                that.$emit('ok');
476
477
478
479
480
481
              }else{
                that.$message.warning(res.message);
              }
            }).finally(() => {
              that.confirmLoading = false;
              that.checkedDepartNames = [];
482
              that.userDepartModel.departIdList = {userId:'',departIdList:[]};
483
484
485
486
487
488
489
490
491
492
493
              that.close();
            })

          }
        })
      },
      handleCancel () {
        this.close()
      },
      validateToNextPassword  (rule, value, callback) {
        const form = this.form;
494
        const confirmpassword=form.getFieldValue('confirmpassword');
495
496
497
498
        if (value && confirmpassword && value !== confirmpassword) {
          callback('两次输入的密码不一样!');
        }
499
500
501
502
503
504
505
506
507
508
509
510
511
512
        if (value && this.confirmDirty) {
          form.validateFields(['confirm'], { force: true })
        }
        callback();
      },
      compareToFirstPassword  (rule, value, callback) {
        const form = this.form;
        if (value && value !== form.getFieldValue('password')) {
          callback('两次输入的密码不一样!');
        } else {
          callback()
        }
      },
      validatePhone(rule, value, callback){
513
514
        if(!value){
          callback()
515
        }else{
516
517
518
519
          //update-begin--Author:kangxiaolin  Date:20190826 for:[05] 手机号不支持199号码段--------------------
          if(new RegExp(/^1[3|4|5|7|8|9][0-9]\d{8}$/).test(value)){
            //update-end--Author:kangxiaolin  Date:20190826 for:[05] 手机号不支持199号码段--------------------
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
            var params = {
              tableName: 'sys_user',
              fieldName: 'phone',
              fieldVal: value,
              dataId: this.userId
            };
            duplicateCheck(params).then((res) => {
              if (res.success) {
                callback()
              } else {
                callback("手机号已存在!")
              }
            })
          }else{
            callback("请输入正确格式的手机号码!");
          }
        }
      },
      validateEmail(rule, value, callback){
        if(!value){
          callback()
        }else{
542
          if(new RegExp(/^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/).test(value)){
543
544
545
546
547
548
549
550
551
552
553
554
555
556
557
558
559
            var params = {
              tableName: 'sys_user',
              fieldName: 'email',
              fieldVal: value,
              dataId: this.userId
            };
            duplicateCheck(params).then((res) => {
              console.log(res)
              if (res.success) {
                callback()
              } else {
                callback("邮箱已存在!")
              }
            })
          }else{
            callback("请输入正确格式的邮箱!")
          }
560
561
562
563
        }
      },
      validateUsername(rule, value, callback){
        var params = {
564
565
566
567
          tableName: 'sys_user',
          fieldName: 'username',
          fieldVal: value,
          dataId: this.userId
568
        };
569
570
571
572
573
574
575
        duplicateCheck(params).then((res) => {
          if (res.success) {
          callback()
        } else {
          callback("用户名已存在!")
        }
      })
576
      },
577
578
579
580
581
582
583
584
585
586
587
588
589
590
591
      validateWorkNo(rule, value, callback){
        var params = {
          tableName: 'sys_user',
          fieldName: 'work_no',
          fieldVal: value,
          dataId: this.userId
        };
        duplicateCheck(params).then((res) => {
          if (res.success) {
            callback()
          } else {
            callback("工号已存在!")
          }
        })
      },
592
      handleConfirmBlur  (e) {
593
        const value = e.target.value;
594
595
596
597
        this.confirmDirty = this.confirmDirty || !!value
      },

      normFile  (e) {
598
        console.log('Upload event:', e);
599
600
601
602
603
604
605
606
607
608
609
610
611
612
        if (Array.isArray(e)) {
          return e
        }
        return e && e.fileList
      },
      beforeUpload: function(file){
        var fileType = file.type;
        if(fileType.indexOf('image')<0){
          this.$message.warning('请上传图片');
          return false;
        }
        //TODO 验证文件大小
      },
      handleChange (info) {
613
        this.picUrl = "";
614
        if (info.file.status === 'uploading') {
615
          this.uploadLoading = true;
616
617
618
619
620
621
622
623
          return
        }
        if (info.file.status === 'done') {
          var response = info.file.response;
          this.uploadLoading = false;
          console.log(response);
          if(response.success){
            this.model.avatar = response.message;
624
            this.picUrl = "Has no pic url yet";
625
626
627
628
629
          }else{
            this.$message.warning(response.message);
          }
        }
      },
630
631
632
633
      // 搜索用户对应的部门API
      onSearch(){
        this.$refs.departWindow.add(this.checkedDepartKeys,this.userId);
      },
634
635
636
637
638
      // 获取用户对应部门弹出框提交给返回的数据
      modalFormOk (formData) {
        this.checkedDepartNames = [];
        this.selectedDepartKeys = [];
639
        this.checkedDepartNameString = '';
640
641
        this.userId = formData.userId;
        this.userDepartModel.userId = formData.userId;
642
643
644
        this.departIds=[];
        this.resultDepartOptions=[];
        var depart=[];
645
646
647
648
        for (let i = 0; i < formData.departIdList.length; i++) {
          this.selectedDepartKeys.push(formData.departIdList[i].key);
          this.checkedDepartNames.push(formData.departIdList[i].title);
          this.checkedDepartNameString = this.checkedDepartNames.join(",");
649
650
651
652
653
654
          //新增部门选择,如果上面部门选择后不为空直接付给负责部门
          depart.push({
              key:formData.departIdList[i].key,
              title:formData.departIdList[i].title
          })
          this.departIds.push(formData.departIdList[i].key)
655
        }
656
        this.resultDepartOptions=depart;
657
        this.userDepartModel.departIdList = this.selectedDepartKeys;
658
        this.checkedDepartKeys = this.selectedDepartKeys  //更新当前的选择keys
659
660
661
662
663
664
665
666
667
668
       },
      // 根据屏幕变化,设置抽屉尺寸
      resetScreenSize(){
        let screenWidth = document.body.clientWidth;
        if(screenWidth < 500){
          this.drawerWidth = screenWidth;
        }else{
          this.drawerWidth = 700;
        }
      },
669
670
671
672
673
674
675
      identityChange(e){
        if(e.target.value==="1"){
            this.departIdShow=false;
        }else{
            this.departIdShow=true;
        }
      }
676
677
678
679
680
681
682
683
684
685
686
687
688
689
690
691
692
693
694
695
696
697
698
699
    }
  }
</script>

<style scoped>
  .avatar-uploader > .ant-upload {
    width:104px;
    height:104px;
  }
  .ant-upload-select-picture-card i {
    font-size: 49px;
    color: #999;
  }

  .ant-upload-select-picture-card .ant-upload-text {
    margin-top: 8px;
    color: #666;
  }

  .ant-table-tbody .ant-table-row td{
    padding-top:10px;
    padding-bottom:10px;
  }
700
701
702
703
704
705
706
707
708
709
710
  .drawer-bootom-button {
    position: absolute;
    bottom: -8px;
    width: 100%;
    border-top: 1px solid #e8e8e8;
    padding: 10px 16px;
    text-align: right;
    left: 0;
    background: #fff;
    border-radius: 0 0 2px 2px;
  }
711
</style>