代码提交

jinhui.wang
Commit 6d6332795e628ba953a419258c3bd9f4b2fedb0d 6d633279 1 parent a6879f56
Showing 1 changed file with 40 additions and 120 deletions
src/views/systemConfig/userConfig/drawer.vue
--- a/src/views/systemConfig/userConfig/drawer.vue
View file @6d63327
+++ b/src/views/systemConfig/userConfig/drawer.vue
View file @6d63327
 <template>
   <div class="userDrawer">
-    <el-drawer
+    <el-drawer :title="drawerTitle" :visible.sync="drawer" direction="rtl" size="40%" :close-on-click-modal="false"
-      :title="drawerTitle"
+      :wrapperClosable="false" :show-close="false">
-      :visible.sync="drawer"
+      <el-form ref="userForm" :model="userForm" label-width="auto" :rules="rules" style="margin: 10px">
-      direction="rtl"
-      size="40%"
-      :close-on-click-modal="false"
-      :wrapperClosable="false"
-      :show-close="false"
-    >
-      <el-form
-        ref="userForm"
-        :model="userForm"
-        label-width="auto"
-        :rules="rules"
-        style="margin: 10px"
-      >
         <el-row :gutter="10">
           <el-col :span="12">
             <el-form-item label="员工号:" prop="loginName">
-              <el-input
+              <el-input placeholder="请输入员工号" v-model.trim="userForm.loginName" v-if="!userFormDisabled"
-                placeholder="请输入员工号"
+                :disabled="drawerTitle != '新增用户'" size="small" clearable></el-input>
-                v-model.trim="userForm.loginName"
-                v-if="!userFormDisabled"
-                :disabled="drawerTitle != '新增用户'"
-                size="small"
-                clearable
-              ></el-input>
               <div v-else>{{ userForm.loginName }}</div>
             </el-form-item>
           </el-col>
           <el-col :span="12">
             <el-form-item label="用户姓名:" prop="username">
-              <el-input
+              <el-input placeholder="请输入用户姓名" :disabled="userFormDisabled" v-model.trim="userForm.username"
-                placeholder="请输入用户姓名"
+                v-if="!userFormDisabled" size="small" clearable></el-input>
-                :disabled="userFormDisabled"
-                v-model.trim="userForm.username"
-                v-if="!userFormDisabled"
-                size="small"
-                clearable
-              ></el-input>
               <div v-else>{{ userForm.username }}</div>
             </el-form-item>
           </el-col>
           <el-col :span="24">
-            <el-alert
+            <el-alert title="注意:员工号一但设置就无法更改，请谨慎填写！" type="warning" show-icon size="mini" :closable="false"
-              title="注意:员工号一但设置就无法更改，请谨慎填写！"
+              style="width: 400px">
-              type="warning"
-              show-icon
-              size="mini"
-              :closable="false"
-              style="width: 400px"
-            >
             </el-alert>
           </el-col>
           <el-col :span="12">
             <el-form-item label="手机号:" prop="phone">
-              <el-input
+              <el-input placeholder="请输入手机号" type="phone" v-model.trim="userForm.phone" :disabled="userFormDisabled"
-                placeholder="请输入手机号"
+                v-if="!userFormDisabled" size="small" clearable></el-input>
-                type="phone"
-                v-model.trim="userForm.phone"
-                :disabled="userFormDisabled"
-                v-if="!userFormDisabled"
-                size="small"
-                clearable
-              ></el-input>
               <div v-else>{{ userForm.phone }}</div>
             </el-form-item>
           </el-col>
           <el-col :span="12">
             <el-form-item label="电子邮箱:" prop="email">
-              <el-input
+              <el-input placeholder="请输入电子邮箱" type="email" v-model.trim="userForm.email" :disabled="userFormDisabled"
-                placeholder="请输入电子邮箱"
+                v-if="!userFormDisabled" size="small" clearable></el-input>
-                type="email"
-                v-model.trim="userForm.email"
-                :disabled="userFormDisabled"
-                v-if="!userFormDisabled"
-                size="small"
-                clearable
-              ></el-input>
               <div v-else>{{ userForm.email }}</div>
             </el-form-item>
           </el-col>
@@ -104,68 +59,33 @@
           </el-col> -->
           <el-col :span="24">
             <el-form-item label="所属口岸:" prop="portName">
-              <el-select
+              <el-select placeholder="请选择口岸" v-model="port" :disabled="userFormDisabled" size="small"
-                placeholder="请选择口岸"
+                style="width: 100%" multiple clearable>
-                v-model="port"
+                <el-option v-for="item in portNameList" :label="item.englishName" :value="item.englishName"
-                :disabled="userFormDisabled"
+                  :key="item.id">
-                size="small"
-                style="width: 100%"
-                multiple
-                clearable
-              >
-                <el-option
-                  v-for="item in portNameList"
-                  :label="item.englishName"
-                  :value="item.englishName"
-                  :key="item.id"
-                >
                 </el-option>
               </el-select>
             </el-form-item>
           </el-col>
           <el-col :span="24">
             <el-form-item label="所属角色:" prop="roleIds">
-              <el-checkbox-group
+              <el-checkbox-group v-model="roleid" :disabled="userFormDisabled" @change="change">
-                v-model="roleid"
+                <el-checkbox v-for="item in roleList" :label="item.id" :key="item.id">{{ item.name }}</el-checkbox>
-                :disabled="userFormDisabled"
-                @change="change"
-              >
-                <el-checkbox
-                  v-for="item in roleList"
-                  :label="item.id"
-                  :key="item.id"
-                  >{{ item.name }}</el-checkbox
-                >
               </el-checkbox-group>
             </el-form-item>
           </el-col>
           <el-col :span="24">
             <el-form-item label="备注:" prop="remark">
-              <el-input
+              <el-input type="textarea" v-model="userForm.remark" placeholder="备注" :disabled="userFormDisabled"
-                type="textarea"
+                v-if="!userFormDisabled" size="small" clearable></el-input>
-                v-model="userForm.remark"
-                placeholder="备注"
-                :disabled="userFormDisabled"
-                v-if="!userFormDisabled"
-                size="small"
-                clearable
-              ></el-input>
               <div v-else>{{ userForm.remark }}</div>
             </el-form-item>
           </el-col>
         </el-row>
         <el-form-item>
-          <el-button
+          <el-button type="primary" size="mini" v-if="!userFormDisabled" :loading="loading" @click="submit">提交
-            type="primary"
+          </el-button>
-            size="mini"
+          <el-button type="primary" size="mini" @click="handleClose">取消</el-button>
-            v-if="!userFormDisabled"
-            :loading="loading"
-            @click="submit"
-            >提交</el-button
-          >
-          <el-button type="primary" size="mini" @click="handleClose"
-            >取消</el-button
-          >
         </el-form-item>
       </el-form>
     </el-drawer>
@@ -231,22 +151,22 @@ export default {
             trigger: "blur",
           },
         ],
-        phone:[
+        phone: [
           {
-            min:11,
+            min: 11,
-            max:11,
+            max: 11,
-            message:"请输入11位手机号码",
+            message: "请输入11位手机号码",
-            trigger:"blur"
+            trigger: "blur"
           },
           {
-            pattern:/^(13[0-9]|14[579]|15[0-3,5-9]|16[6]|17[0135678]|18[0-9]|19[89])\d{8}$/,
+            pattern: /^(13[0-9]|14[579]|15[0-3,5-9]|16[6]|17[0135678]|18[0-9]|19[89])\d{8}$/,
-            message:"请输入正确得手机号码"
+            message: "请输入正确得手机号码"
           }
         ],
-        email:[
+        email: [
           {
-            pattern:/^(([^<>()\[\]\\.,;:\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,}))$/,
+            pattern: /^(([^<>()\[\]\\.,;:\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,}))$/,
-            message:"请输入正确得电子邮箱"
+            message: "请输入正确得电子邮箱"
           }
         ]
       },
@@ -266,13 +186,13 @@ export default {
         if (this.userForm.portName) {
           this.port = this.userForm.portName;
         }
-      }else{
+      } else {
         this.loading = false;
       }
     },
   },
   methods: {
-    clearValidate(formName){
+    clearValidate(formName) {
       this.$refs[formName].clearValidate();
     },
     change(val) {
@@ -354,11 +274,11 @@ export default {
             this.loading = false;
             console.log(err);
           });
-      }else{
+      } else {
         this.$message({
-                message: "口岸不能为空",
+          message: "口岸不能为空",
-                type: "warning",
+          type: "warning",
-              });
+        });
       }
     },
   },