临时提交

src/views/adweb/enterprise/modules/EnterpriseUserModal.vue

@@ -19,7 +19,7 @@
     </template>
 
     <a-spin :spinning="confirmLoading">
-      <a-form :form="form">
+      <a-form :ref="formRef" :model="model">
         <a-form-item label="用户账号" :labelCol="labelCol" :wrapperCol="wrapperCol">
           <a-input placeholder="请输入用户账号" v-decorator.trim="['username', validatorRules.username]" :disabled="!!model.id" />
         </a-form-item>
@@ -91,22 +91,26 @@
   import { addEnterpriseUser, queryEnterpriseAll } from '../EnterpriseUserManage.api';
   import { duplicateCheck } from '@/views/system/user/user.api';
   import JImageUpload from '/@/components/Form/src/jeecg/components/JImageUpload.vue';
-  import {onBeforeMount, reactive, ref} from 'vue';
+  import { nextTick, onBeforeMount, reactive, ref } from 'vue';
+  import { useUserStore } from '/@/store/modules/user';
+  import pick from 'lodash.pick';
 
+  const userStore = useUserStore();
   const isMasterAccount = ref(false);
   const departDisabled = ref(false);
   const roleDisabled = ref(false);
   const modaltoggleFlag = ref(true);
   const confirmDirty = ref(false);
   const modalWidth = ref(800);
-  const drawerWidth = ref(700);
-  const queryParam = ref({});
-  const selectedDepartKeys = reactive([]);
-  const checkedDepartKeys = reactive([]);
-  const checkedDepartNames = reactive([]);
-  const checkedDepartNameString = ref('');
-  const resultDepartOptions = reactive([]);
-  const userId = ref('');
+  let drawerWidth = ref(700);
+  const formRef = ref();
+  const queryParam = reactive({ username: userStore.getUserInfo.username });
+  let selectedDepartKeys = reactive([]);
+  let checkedDepartKeys = reactive([]);
+  let checkedDepartNames = reactive([]);
+  let checkedDepartNameString = ref('');
+  let resultDepartOptions = reactive([]);
+  let userId = ref('');
   const disableSubmit = ref(false);
   const userDepartModel = reactive({ userId: '', departIdList: [] }); // 保存SysUserDepart的用户部门中间表数据需要的对象
   const dateFormat = ref('YYYY-MM-DD');
@@ -118,7 +122,7 @@
           message: '请输入用户账号!',
         },
         {
-          validator: this.validateUsername,
+          validator: validateUsername,
         },
       ],
     },
@@ -130,7 +134,7 @@
           message: '密码由8位数字、大小写字母和特殊符号组成!',
         },
         {
-          validator: this.validateToNextPassword,
+          validator: validateToNextPassword,
         },
       ],
     },
@@ -141,25 +145,25 @@
           message: '请重新输入登录密码!',
         },
         {
-          validator: this.compareToFirstPassword,
+          validator: compareToFirstPassword,
         },
       ],
     },
     realname: { rules: [{ required: true, message: '请输入用户名称!' }] },
-    phone: { rules: [{ validator: this.validatePhone }] },
+    phone: { rules: [{ validator: validatePhone }] },
     email: {
       rules: [
         {
-          validator: this.validateEmail,
+          validator: validateEmail,
         },
       ],
     },
     roles: {},
-    //  sex:{initialValue:((!this.model.sex)?"": (this.model.sex+""))}
+    //  sex:{initialValue:((!model.sex)?"": (model.sex+""))}
     // workNo: {
     //   rules: [
     //     { required: true, message: '请输入工号' },
-    //     { validator: this.validateWorkNo }
+    //     { validator: validateWorkNo }
     //   ]
     // },
     telephone: {
@@ -167,12 +171,12 @@
     },
   });
 
-  const departIdShow = ref(false);
+  let departIdShow = ref(false);
   const departIds = reactive([]);
   const title = '操作';
   const visible = ref(false);
-  const model = reactive({});
-  const roleList = reactive([]);
+  let model = reactive({ userIdentity: '' });
+  let roleList = reactive([]);
   const selectedRole = ref([]);
   const labelCol = reactive({
     xs: { span: 24 },
@@ -190,11 +194,11 @@
   const headers = reactive({});
   const picUrl = ref('');
   const identity = ref('1');
-  const fileList = reactive([]);
-  const tenantList = reactive([]);
-  const currentTenant = reactive([]);
-  const siteCode = ref('');
-  const dictSiteCode = ref('');
+  let fileList = reactive([]);
+  let tenantList = reactive([]);
+  let currentTenant = reactive([]);
+  let siteCode = ref('');
+  let dictSiteCode = ref('');
   const url = {
     fileUpload: window._CONFIG['domianURL'] + '/sys/common/upload',
     userId: '/sys/user/generateUserId', // 引入生成添加用户情况下的url
@@ -204,131 +208,133 @@
 
   onBeforeMount(() => {
     initTenantList();
-    siteCode.value = <string>localStorage.getItem('siteCode');
+    siteCode.value = localStorage.getItem('siteCode') ?? '';
     getTurnInquiryCode();
   });
 
-  function isDisabledAuth(code) {
-    return disabledAuthFilter(code);
-  }
-  function  initTenantList() {
-    getAction(this.url.queryTenantList).then((res) => {
+  function initTenantList() {
+    getAction(url.queryTenantList, {}).then((res) => {
       if (res.success) {
-        this.tenantList = res.result;
+        tenantList = res.result;
       }
     });
   }
+
   //窗口最大化切换
   function toggleScreen() {
-    if (this.modaltoggleFlag) {
-      this.modalWidth = window.innerWidth;
+    if (modaltoggleFlag.value) {
+      modalWidth.value = window.innerWidth;
     } else {
-      this.modalWidth = 800;
+      modalWidth.value = 800;
     }
-    this.modaltoggleFlag = !this.modaltoggleFlag;
+    modaltoggleFlag.value = !modaltoggleFlag.value;
   }
+
   function initialRoleList() {
-    queryEnterpriseAll({ username: this.queryParam.username }).then((res) => {
+    queryEnterpriseAll({ username: queryParam.username }).then((res) => {
       if (res.success) {
-        this.roleList = res.result;
+        roleList = res.result;
       } else {
         console.log(res.message);
       }
     });
   }
+
   function loadUserRoles(userid) {
     queryUserRole({ userid: userid }).then((res) => {
       if (res.success) {
-        this.selectedRole = res.result;
+        selectedRole.value = res.result;
       } else {
         console.log(res.message);
       }
     });
   }
+
   function refresh() {
-    this.selectedDepartKeys = [];
-    this.checkedDepartKeys = [];
-    this.checkedDepartNames = [];
-    this.checkedDepartNameString = '';
-    this.userId = '';
-    this.resultDepartOptions = [];
-    this.departId = [];
-    this.departIdShow = false;
-    this.currentTenant = [];
-  },
+    selectedDepartKeys = [];
+    checkedDepartKeys = [];
+    checkedDepartNames = [];
+    checkedDepartNameString.value = '';
+    userId.value = '';
+    resultDepartOptions = [];
+    departIdShow.value = false;
+    currentTenant = [];
+  }
+
   function add() {
-    this.picUrl = '';
-    this.refresh();
-    this.edit({ activitiSync: '1' });
-  },
+    picUrl.value = '';
+    refresh();
+    edit({ activitiSync: '1' });
+  }
+
   function edit(record) {
-    this.resetScreenSize(); // 调用此方法,根据屏幕宽度自适应调整抽屉的宽度
-    let that = this;
-    that.initialRoleList();
-    that.checkedDepartNameString = '';
-    that.form.resetFields();
+    resetScreenSize(); // 调用此方法,根据屏幕宽度自适应调整抽屉的宽度
+
+    initialRoleList();
+    checkedDepartNameString.value = '';
+
+    formRef.value.resetFields();
     if (record.hasOwnProperty('id')) {
-      that.loadUserRoles(record.id);
+      loadUserRoles(record.id);
       setTimeout(() => {
-        this.fileList = record.avatar;
+        fileList = record.avatar;
       }, 5);
     }
-    that.userId = record.id;
-    that.model = Object.assign({}, record);
-    that.$nextTick(() => {
-      that.form.setFieldsValue(pick(this.model, 'username', 'sex', 'realname', 'email', 'phone', 'activitiSync', 'telephone', 'post'));
+    userId.value = record.id;
+    model = Object.assign({}, record);
+    nextTick(() => {
+      formRef.value.setFieldsValue(pick(model, 'username', 'sex', 'realname', 'email', 'phone', 'activitiSync', 'telephone', 'post'));
     });
-    that.visible = true;
+    visible.value = true;
     //身份为上级显示负责部门，否则不显示
-    if (this.model.userIdentity == '2') {
-      this.identity = '2';
-      this.departIdShow = true;
+    if (model.userIdentity == '2') {
+      identity.value = '2';
+      departIdShow.value = true;
     } else {
-      this.identity = '1';
-      this.departIdShow = false;
+      identity.value = '1';
+      departIdShow.value = false;
     }
     // 调用查询用户对应的部门信息的方法
-    that.checkedDepartKeys = [];
+    checkedDepartKeys = [];
     //update-begin-author:taoyan date:2020710 for:多租户配置
     if (!record.relTenantIds || record.relTenantIds.length == 0) {
-      this.currentTenant = [];
+      currentTenant = [];
     } else {
-      this.currentTenant = record.relTenantIds.split(',').map(Number);
+      currentTenant = record.relTenantIds.split(',').map(Number);
     }
-    //update-end-author:taoyan date:2020710 for:多租户配置
   }
 
-  close() {
-    this.$emit('close');
-    this.visible = false;
-    this.disableSubmit = false;
-    this.selectedRole = [];
-    this.userDepartModel = { userId: '', departIdList: [] };
-    this.checkedDepartNames = [];
-    this.checkedDepartNameString = '';
-    this.checkedDepartKeys = [];
-    this.selectedDepartKeys = [];
-    this.resultDepartOptions = [];
-    this.departIds = [];
-    this.departIdShow = false;
-    this.identity = '1';
-    this.fileList = [];
+  function close() {
+    $emit('close');
+    visible.value = false;
+    disableSubmit.value = false;
+    selectedRole.value = [];
+    userDepartModel = { userId: '', departIdList: [] };
+    checkedDepartNames = [];
+    checkedDepartNameString.value = '';
+    checkedDepartKeys = [];
+    selectedDepartKeys = [];
+    resultDepartOptions = [];
+    departIds = [];
+    departIdShow.value = false;
+    identity.value = '1';
+    fileList = [];
   }
 
   function handleSubmit() {
     const that = this;
     // 触发表单验证
-    this.form.validateFields((err, values) => {
+    form.validateFields((err, values) => {
       if (!err) {
-        that.confirmLoading = true;
+        confirmLoading = true;
         if (!values.birthday) {
           values.birthday = '';
         } else {
-          values.birthday = values.birthday.format(this.dateFormat);
+          values.birthday = values.birthday.format(dateFormat);
         }
-        let formData = Object.assign(this.model, values);
-        if (that.fileList != '') {
-          formData.avatar = that.fileList;
+        let formData = Object.assign(model, values);
+        if (fileList != '') {
+          formData.avatar = fileList;
         } else {
           formData.avatar = null;
         }
@@ -336,71 +342,74 @@
           formData.email = null;
         }
         //update-begin-author:taoyan date:2020710 for:多租户配置
-        formData.relTenantIds = this.currentTenant.length > 0 ? this.currentTenant.join(',') : '';
+        formData.relTenantIds = currentTenant.length > 0 ? currentTenant.join(',') : '';
         //update-end-author:taoyan date:2020710 for:多租户配置
-        formData.selectedroles = this.selectedRole.length > 0 ? this.selectedRole.join(',') : '';
-        formData.selecteddeparts = this.userDepartModel.departIdList.length > 0 ? this.userDepartModel.departIdList.join(',') : '';
-        formData.userIdentity = this.identity;
+        formData.selectedroles = selectedRole.value.length > 0 ? selectedRole.value.join(',') : '';
+        formData.selecteddeparts = userDepartModel.departIdList.length > 0 ? userDepartModel.departIdList.join(',') : '';
+        formData.userIdentity = identity;
         //如果是上级择传入departIds,否则为空
-        if (this.identity === '2') {
-          formData.departIds = this.departIds.join(',');
+        if (identity.value === '2') {
+          formData.departIds = departIds.join(',');
         } else {
           formData.departIds = '';
         }
-        // that.addDepartsToUser(that,formData); // 调用根据当前用户添加部门信息的方法
+        // addDepartsToUser(that,formData); // 调用根据当前用户添加部门信息的方法
         let obj;
         formData.masterId = store.getters.userInfo.id;
         formData.masterName = store.getters.userInfo.username;
-        if (!this.model.id) {
-          formData.id = this.userId;
-          formData.siteCode = this.siteCode;
+        if (!model.id) {
+          formData.id = userId;
+          formData.siteCode = siteCode;
           obj = addEnterpriseUser(formData);
         } else {
           formData.masterEmail = store.getters.userInfo.email;
-          formData.siteCode = this.siteCode;
+          formData.siteCode = siteCode;
           obj = postAction('/enterprise/user/edit', formData);
         }
         obj
           .then((res) => {
             if (res.success) {
-              that.$message.success(res.message);
-              that.$emit('ok');
-              that.confirmLoading = false;
-              that.checkedDepartNames = [];
-              that.userDepartModel.departIdList = { userId: '', departIdList: [] };
-              that.close();
+              $message.success(res.message);
+              $emit('ok');
+              confirmLoading = false;
+              checkedDepartNames = [];
+              userDepartModel.departIdList = { userId: '', departIdList: [] };
+              close();
             } else {
-              that.confirmLoading = false;
-              that.$message.warning(res.message);
+              confirmLoading = false;
+              $message.warning(res.message);
             }
           })
           .finally(() => {});
       }
     });
   }
+
   function handleCancel() {
-    this.close();
+    close();
   }
   function validateToNextPassword(rule, value, callback) {
-    const form = this.form;
+    const form = form;
     const confirmpassword = form.getFieldValue('confirmpassword');
 
     if (value && confirmpassword && value !== confirmpassword) {
       callback('两次输入的密码不一样！');
     }
-    if (value && this.confirmDirty) {
+    if (value && confirmDirty) {
       form.validateFields(['confirm'], { force: true });
     }
     callback();
   }
+
   function compareToFirstPassword(rule, value, callback) {
-    const form = this.form;
+    const form = form;
     if (value && value !== form.getFieldValue('password')) {
       callback('两次输入的密码不一样！');
     } else {
       callback();
     }
   }
+
   function validatePhone(rule, value, callback) {
     if (!value) {
       callback();
@@ -413,7 +422,7 @@
           tableName: 'sys_user',
           fieldName: 'phone',
           fieldVal: value,
-          dataId: this.userId,
+          dataId: userId,
         };
         duplicateCheck(params).then((res) => {
           if (res.success) {
@@ -427,6 +436,7 @@
       }
     }
   }
+
   function validateEmail(rule, value, callback) {
     if (!value) {
       callback();
@@ -440,7 +450,7 @@
           tableName: 'sys_user',
           fieldName: 'email',
           fieldVal: value,
-          dataId: this.userId,
+          dataId: userId,
         };
         duplicateCheck(params).then((res) => {
           console.log(res);
@@ -455,12 +465,13 @@
       }
     }
   }
+
   function validateUsername(rule, value, callback) {
     var params = {
       tableName: 'sys_user',
       fieldName: 'username',
       fieldVal: value,
-      dataId: this.userId,
+      dataId: userId,
     };
     duplicateCheck(params).then((res) => {
       if (res.success) {
@@ -470,12 +481,13 @@
       }
     });
   }
+
   // validateWorkNo(rule, value, callback){
   //   var params = {
   //     tableName: 'sys_user',
   //     fieldName: 'work_no',
   //     fieldVal: value,
-  //     dataId: this.userId
+  //     dataId: userId
   //   };
   //   duplicateCheck(params).then((res) => {
   //     if (res.success) {
@@ -487,7 +499,7 @@
   // },
   function handleConfirmBlur(e) {
     const value = e.target.value;
-    this.confirmDirty = this.confirmDirty || !!value;
+    confirmDirty.value = confirmDirty.value || !!value;
   }
 
   function normFile(e) {
@@ -497,87 +509,95 @@
     }
     return e && e.fileList;
   }
-  beforeUpload: function (file) {
+
+  function beforeUpload(file) {
     var fileType = file.type;
     if (fileType.indexOf('image') < 0) {
-      this.$message.warning('请上传图片');
+      $message.warning('请上传图片');
       return false;
     }
     //TODO 验证文件大小
   }
+
   function handleChange(info) {
-    this.picUrl = '';
+    picUrl.value = '';
     if (info.file.status === 'uploading') {
-      this.uploadLoading = true;
+      uploadLoading = true;
       return;
     }
     if (info.file.status === 'done') {
       var response = info.file.response;
-      this.uploadLoading = false;
+      uploadLoading = false;
       console.log(response);
       if (response.success) {
-        this.model.avatar = response.message;
-        this.picUrl = 'Has no pic url yet';
+        model.avatar = response.message;
+        picUrl.value = 'Has no pic url yet';
       } else {
-        this.$message.warning(response.message);
+        $message.warning(response.message);
       }
     }
   }
+
   // 搜索用户对应的部门API
   function onSearch() {
-    this.$refs.enterpriseDepartWindow.add(this.checkedDepartKeys, this.userId);
+    $refs.enterpriseDepartWindow.add(checkedDepartKeys, userId);
   }
 
   // 获取用户对应部门弹出框提交给返回的数据
   function modalFormOk(formData) {
-    this.checkedDepartNames = [];
-    this.selectedDepartKeys = [];
-    this.checkedDepartNameString = '';
-    this.userId = formData.userId;
-    this.userDepartModel.userId = formData.userId;
-    this.departIds = [];
-    this.resultDepartOptions = [];
+    checkedDepartNames = [];
+    selectedDepartKeys = [];
+    checkedDepartNameString.value = '';
+    userId.value = formData.userId;
+    userDepartModel.userId = formData.userId;
+    departIds = [];
+    resultDepartOptions = [];
     var depart = [];
     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(',');
+      selectedDepartKeys.push(formData.departIdList[i].key);
+      checkedDepartNames.push(formData.departIdList[i].title);
+      checkedDepartNameString.value = checkedDepartNames.join(',');
       //新增部门选择，如果上面部门选择后不为空直接付给负责部门
       depart.push({
         key: formData.departIdList[i].key,
         title: formData.departIdList[i].title,
       });
-      this.departIds.push(formData.departIdList[i].key);
+      departIds.push(formData.departIdList[i].key);
     }
-    this.resultDepartOptions = depart;
-    this.userDepartModel.departIdList = this.selectedDepartKeys;
-    this.checkedDepartKeys = this.selectedDepartKeys; //更新当前的选择keys
+    resultDepartOptions = depart;
+    userDepartModel.departIdList = selectedDepartKeys;
+    checkedDepartKeys = selectedDepartKeys; //更新当前的选择keys
   }
   // 根据屏幕变化,设置抽屉尺寸
   function resetScreenSize() {
     let screenWidth = document.body.clientWidth;
     if (screenWidth < 500) {
-      this.drawerWidth = screenWidth;
+      drawerWidth.value = screenWidth;
     } else {
-      this.drawerWidth = 700;
+      drawerWidth.value = 700;
     }
   }
+
   function identityChange(e) {
     if (e.target.value === '1') {
-      this.departIdShow = false;
+      departIdShow.value = false;
     } else {
-      this.departIdShow = true;
+      departIdShow.value = true;
     }
   }
+
   //获取需要轮流询盘的站点code
   function getTurnInquiryCode() {
-    getAction('/adweb/adwebEnquiry/getTurnInquiryCode').then((res) => {
+    getAction('/adweb/adwebEnquiry/getTurnInquiryCode', {}).then((res) => {
       if (res.code === 200) {
-        this.dictSiteCode = res.result[0].value;
+        dictSiteCode.value = res.result[0].value;
       }
     });
   }
 
+  defineExpose({
+    add,
+  });
 </script>
 
 <style scoped>