人员选择下拉框修改

src/views/archives/packages/index.vue

@@ -166,7 +166,6 @@
           </el-image>
         </template>
       </el-table-column>
-      <!-- <el-table-column label="条码值" align="center" prop="codeValue" /> -->
       <el-table-column label="装册数量" align="center" prop="packageNum" />
       <el-table-column label="备注" align="center" prop="remark" />
       <el-table-column
@@ -277,29 +276,26 @@
             </el-form-item>
           </el-col>
         </el-row>
-        <!-- <el-form-item label="状态待装册，已装册" prop="status">
-          <el-radio-group v-model="form.status">
-            <el-radio label="1">请选择字典生成</el-radio>
-          </el-radio-group>
-        </el-form-item> -->
         <el-row>
           <el-col :span="8">
             <el-form-item label="负责人" prop="manegeName">
-              <el-select
+              <el-input
                 v-model="form.manegeName"
-                filterable
+                placeholder="请选择负责人"
-                placeholder="负责人"
+                readonly
-                value-key="id"
-                @change="handleSelectUser"
-              >
-                <el-option
-                  v-for="item in userOptions"
-                  :key="item.id"
-                  :value="item"
-                  :label="item.username"
               >
-                </el-option>
+                <el-button
-              </el-select>
+                  slot="append"
+                  @click="handleSelectUser"
+                  icon="el-icon-search"
+                  style="
+                    border-color: #46a6ff;
+                    background-color: #46a6ff;
+                    color: white;
+                  "
+                ></el-button>
+              </el-input>
+              <UserSelect ref="UserSelect" @onSelected="onUserSelected" />
             </el-form-item>
             <el-form-item label="装册时间" prop="packageTime">
               <el-date-picker
@@ -347,14 +343,13 @@ import {
   exportPackagesExcel,
 } from "@/api/archives/packages";
 import ArchivesSelect from "@/components/ArchivesSelect/single.vue";
-import { listUser } from "@/api/system/user";
+import UserSelect from "@/components/UserSelect/single.vue";
 
 export default {
   name: "Packages",
-  components: { ArchivesSelect },
+  components: { ArchivesSelect, UserSelect },
   data() {
     return {
-      userOptions: [], //用户数据
       // 遮罩层
       loading: true,
       // 导出遮罩层
@@ -407,18 +402,8 @@ export default {
   },
   created() {
     this.getList();
-    this.getUserList();
   },
   methods: {
-    //获取用户
-    getUserList() {
-      listUser().then((response) => {
-        this.userOptions = response.data.list;
-      });
-    },
-    handleSelectUser(val) {
-      this.form.manegeName = val.username;
-    },
     /** 查询列表 */
     getList() {
       this.loading = true;
@@ -566,6 +551,17 @@ export default {
         this.form.flowId = obj.flowId;
       }
     },
+    // 人员选择弹窗
+    handleSelectUser() {
+      this.$refs.UserSelect.showFlag = true;
+    },
+    // 负责人选择
+    onUserSelected(obj) {
+      console.log(obj);
+      if (obj != undefined && obj != null) {
+        this.form.manegeName = obj.username;
+      }
+    },
   },
 };
 </script>

src/views/archives/turnOver/index.vue

@@ -253,40 +253,44 @@
         <el-row>
           <el-col :span="8">
             <el-form-item label="移交人" prop="outputName">
-              <el-select
+              <el-input
-                v-model="outputName"
+                v-model="form.outputName"
-                filterable
                 placeholder="请选择移交人"
-                value-key="id"
+                readonly
-                @change="handleSelectUser1"
-              >
-                <el-option
-                  v-for="item in userOptions"
-                  :key="item.id"
-                  :value="item"
-                  :label="item.username"
               >
-                </el-option>
+                <el-button
-              </el-select>
+                  slot="append"
+                  @click="handleSelectUser1"
+                  icon="el-icon-search"
+                  style="
+                    border-color: #46a6ff;
+                    background-color: #46a6ff;
+                    color: white;
+                  "
+                ></el-button>
+              </el-input>
+              <UserSelect ref="UserSelect1" @onSelected="onUserSelected1" />
             </el-form-item>
           </el-col>
           <el-col :span="8">
             <el-form-item label="签收人" prop="inputName">
-              <el-select
+              <el-input
-                v-model="inputName"
+                v-model="form.inputName"
-                filterable
                 placeholder="请选择签收人"
-                value-key="id"
+                readonly
-                @change="handleSelectUser2"
-              >
-                <el-option
-                  v-for="item in userOptions"
-                  :key="item.id"
-                  :value="item"
-                  :label="item.username"
               >
-                </el-option>
+                <el-button
-              </el-select>
+                  slot="append"
+                  @click="handleSelectUser2"
+                  icon="el-icon-search"
+                  style="
+                    border-color: #46a6ff;
+                    background-color: #46a6ff;
+                    color: white;
+                  "
+                ></el-button>
+              </el-input>
+              <UserSelect ref="UserSelect2" @onSelected="onUserSelected2" />
             </el-form-item>
           </el-col>
         </el-row>
@@ -361,15 +365,14 @@ import {
   getTurnOverPage,
   exportTurnOverExcel,
 } from "@/api/archives/turnOver";
-import { getOrganizationPage } from "@/api/setting/organization";
-import { listUser } from "@/api/system/user";
 import { createWS } from "@/api/archives/record";
 import { getSiteTree } from "@/api/setting/organization";
 import FileSelect from "@/components/FileSelect/single.vue";
+import UserSelect from "@/components/UserSelect/single.vue";
 
 export default {
   name: "TurnOver",
-  components: { FileSelect },
+  components: { FileSelect, UserSelect },
   data() {
     return {
       propName: {
@@ -464,20 +467,6 @@ export default {
         this.form.applyNo = response.data;
       });
     },
-    //获取用户
-    getUserList() {
-      listUser().then((response) => {
-        this.userOptions = response.data.list;
-      });
-    },
-    handleSelectUser1(val) {
-      this.form.outputNameId = val.id;
-      this.form.outputName = val.username;
-    },
-    handleSelectUser2(val) {
-      this.form.inputNameId = val.id;
-      this.form.inputName = val.username;
-    },
     //获取归档位置
     getSiteList() {
       getSiteTree().then((response) => {
@@ -657,6 +646,28 @@ export default {
         this.createWS(obj.id);
       }
     },
+    // 人员选择弹窗
+    handleSelectUser1() {
+      this.$refs.UserSelect1.showFlag = true;
+    },
+    // 移交人选择
+    onUserSelected1(obj) {
+      console.log(obj);
+      if (obj != undefined && obj != null) {
+        this.form.outputName = obj.username;
+      }
+    },
+    // 人员选择弹窗
+    handleSelectUser2() {
+      this.$refs.UserSelect2.showFlag = true;
+    },
+    // 签收人选择
+    onUserSelected2(obj) {
+      console.log(obj);
+      if (obj != undefined && obj != null) {
+        this.form.inputName = obj.username;
+      }
+    },
   },
 };
 </script>

src/views/borrow/apply/index.vue

@@ -104,7 +104,6 @@
           <dict-tag :type="DICT_TYPE.ARCHIVES_MEDIA" :value="scope.row.media" />
         </template>
       </el-table-column>
-      <!-- <el-table-column label="业务实体名称" align="center" prop="company" /> -->
       <el-table-column label="借阅描述" align="center" prop="describes" />
       <el-table-column
         label="创建日期"
@@ -187,19 +186,23 @@
           </el-col>
           <el-col :span="8">
             <el-form-item label="借阅人" prop="userName">
-              <el-select
+              <el-input
                 v-model="form.userName"
-                filterable
                 placeholder="请选择借阅人"
+                readonly
               >
-                <el-option
+                <el-button
-                  v-for="item in userOptions"
+                  slot="append"
-                  :key="item.id"
+                  @click="handleSelectUser"
-                  :value="item.username"
+                  icon="el-icon-search"
-                  :label="item.username"
+                  style="
-                >
+                    border-color: #46a6ff;
-                </el-option>
+                    background-color: #46a6ff;
-              </el-select>
+                    color: white;
+                  "
+                ></el-button>
+              </el-input>
+              <UserSelect ref="UserSelect" @onSelected="onUserSelected" />
             </el-form-item>
           </el-col>
           <el-col :span="8">
@@ -300,13 +303,6 @@
             </el-form-item>
           </el-col>
         </el-row>
-        <!-- <el-form-item label="备注" prop="remark">
-          <el-input
-            v-model="form.remark"
-            type="textarea"
-            placeholder="请输入备注"
-          />
-        </el-form-item> -->
       </el-form>
       <div slot="footer" class="dialog-footer">
         <el-button type="primary" @click="submitForm">确 定</el-button>
@@ -326,12 +322,12 @@ import {
   exportBorrowApplyExcel,
 } from "@/api/borrow/apply";
 import { listData } from "@/api/system/dict/data";
-import { listUser } from "@/api/system/user";
 import { getRecordPage } from "@/api/archives/record";
+import UserSelect from "@/components/UserSelect/single.vue";
 
 export default {
   name: "BorrowApply",
-  components: {},
+  components: { UserSelect },
   data() {
     return {
       // 遮罩层
@@ -377,7 +373,6 @@ export default {
       borrowStateOptions: [],
       wayOptions: [],
       mediaOptions: [],
-      userOptions: [], //用户数据
       filesNumOptions: [], //借阅档案数据
       fileTypeOptions: [], //档案类型
     };
@@ -385,7 +380,6 @@ export default {
   created() {
     this.getList();
     this.handleInitList();
-    this.getUserList();
     this.getFilesNum();
   },
   methods: {
@@ -440,12 +434,6 @@ export default {
         this.fileTypeOptions = res.data.list || [];
       });
     },
-    //获取用户
-    getUserList() {
-      listUser().then((response) => {
-        this.userOptions = response.data.list;
-      });
-    },
     /** 取消按钮 */
     cancel() {
       this.open = false;
@@ -571,6 +559,17 @@ export default {
         })
         .catch(() => {});
     },
+    // 人员选择弹窗
+    handleSelectUser() {
+      this.$refs.UserSelect.showFlag = true;
+    },
+    // 借阅人选择
+    onUserSelected(obj) {
+      console.log(obj);
+      if (obj != undefined && obj != null) {
+        this.form.userName = obj.username;
+      }
+    },
   },
 };
 </script>

src/views/ea/electronicConsultation/index.vue

@@ -443,8 +443,24 @@
             </el-form-item>
           </el-col>
           <el-col :span="8">
-            <el-form-item label="处理人员	" prop="handler">
+            <el-form-item label="处理人" prop="handler">
-              <el-input v-model="form.handler" placeholder="请输入处理人员	" />
+              <el-input
+                v-model="form.handler"
+                placeholder="请选择处理人"
+                readonly
+              >
+                <el-button
+                  slot="append"
+                  @click="handleSelectUser"
+                  icon="el-icon-search"
+                  style="
+                    border-color: #46a6ff;
+                    background-color: #46a6ff;
+                    color: white;
+                  "
+                ></el-button>
+              </el-input>
+              <UserSelect ref="UserSelect" @onSelected="onUserSelected" />
             </el-form-item>
           </el-col>
         </el-row>
@@ -547,6 +563,7 @@ import { listSimplePosts } from "@/api/system/post";
 import Treeselect from "@riophae/vue-treeselect";
 import "@riophae/vue-treeselect/dist/vue-treeselect.css";
 import { getAccessToken, getTenantId } from "@/utils/auth";
+import UserSelect from "@/components/UserSelect/single.vue";
 
 export default {
   name: "ElectronicConsultation",
@@ -554,6 +571,7 @@ export default {
     ScrollPane,
     Editor,
     Treeselect,
+    UserSelect,
   },
   data() {
     return {
@@ -626,6 +644,7 @@ export default {
       rules: {},
       siteOptions: [], //归档位置数据
       siteArray: [], //归档位置选中值
+      organizationList: [],
     };
   },
   created() {
@@ -863,6 +882,17 @@ export default {
         })
         .catch(() => {});
     },
+    // 人员选择弹窗
+    handleSelectUser() {
+      this.$refs.UserSelect.showFlag = true;
+    },
+    // 审核人选择
+    onUserSelected(obj) {
+      console.log(obj);
+      if (obj != undefined && obj != null) {
+        this.form.handler = obj.username;
+      }
+    },
   },
 };
 </script>

src/views/ea/electronicCustomerComplaint/index.vue

@@ -452,19 +452,23 @@
           </el-col>
           <el-col :span="8">
             <el-form-item label="处理人" prop="handler">
-              <el-select
+              <el-input
                 v-model="form.handler"
-                filterable
                 placeholder="请选择处理人"
+                readonly
               >
-                <el-option
+                <el-button
-                  v-for="item in userOptions"
+                  slot="append"
-                  :key="item.id"
+                  @click="handleSelectUser"
-                  :value="item.username"
+                  icon="el-icon-search"
-                  :label="item.username"
+                  style="
-                >
+                    border-color: #46a6ff;
-                </el-option>
+                    background-color: #46a6ff;
-              </el-select>
+                    color: white;
+                  "
+                ></el-button>
+              </el-input>
+              <UserSelect ref="UserSelect" @onSelected="onUserSelected" />
             </el-form-item>
           </el-col>
         </el-row>
@@ -567,12 +571,14 @@ import { listSimplePosts } from "@/api/system/post";
 import Treeselect from "@riophae/vue-treeselect";
 import "@riophae/vue-treeselect/dist/vue-treeselect.css";
 import { getAccessToken, getTenantId } from "@/utils/auth";
+import UserSelect from "@/components/UserSelect/single.vue";
 
 export default {
   name: "ElectronicCustomerComplaint",
   components: {
     Editor,
     Treeselect,
+    UserSelect,
   },
   data() {
     return {
@@ -891,6 +897,17 @@ export default {
         })
         .catch(() => {});
     },
+    // 人员选择弹窗
+    handleSelectUser() {
+      this.$refs.UserSelect.showFlag = true;
+    },
+    // 处理人选择
+    onUserSelected(obj) {
+      console.log(obj);
+      if (obj != undefined && obj != null) {
+        this.form.handler = obj.username;
+      }
+    },
   },
 };
 </script>

src/views/fileAuth/authenticate/index.vue

@@ -91,21 +91,23 @@
         <el-row>
           <el-col :span="14">
             <el-form-item label="鉴定人" prop="userName">
-              <el-select
+              <el-input
-                v-model="userName"
+                v-model="form.userName"
-                filterable
                 placeholder="请选择鉴定人"
-                value-key="id"
+                readonly
-                @change="handleSelectUser"
               >
-                <el-option
+                <el-button
-                  v-for="item in userOptions"
+                  slot="append"
-                  :key="item.id"
+                  @click="handleSelectUser"
-                  :value="item"
+                  icon="el-icon-search"
-                  :label="item.username"
+                  style="
-                >
+                    border-color: #46a6ff;
-                </el-option>
+                    background-color: #46a6ff;
-              </el-select>
+                    color: white;
+                  "
+                ></el-button>
+              </el-input>
+              <UserSelect ref="UserSelect" @onSelected="onUserSelected" />
             </el-form-item>
           </el-col>
         </el-row>
@@ -150,13 +152,13 @@
 
 <script>
 import { listData } from "@/api/system/dict/data";
-import { listUser } from "@/api/system/user";
 import { createAuthenticateApply } from "@/api/fileAuth/authenticate";
 import { getRecordPage } from "@/api/archives/record";
+import UserSelect from "@/components/UserSelect/single.vue";
 
 export default {
   name: "FileAuth",
-  components: {},
+  components: { UserSelect },
   data() {
     return {
       // 遮罩层
@@ -190,7 +192,6 @@ export default {
       fileStatusOptions: [], //归档状态
       catalogNumOptions: [], //目录号
       caseNumOptions: [], //全宗号
-      userOptions: [], //用户数据
       userName: null,
       options: [
         {
@@ -252,16 +253,6 @@ export default {
         this.fileTypeOptions = res.data.list || [];
       });
     },
-    //获取用户
-    getUserList() {
-      listUser().then((response) => {
-        this.userOptions = response.data.list;
-      });
-    },
-    handleSelectUser(val) {
-      this.form.userId = val.id;
-      this.form.userName = val.username;
-    },
     /** 取消按钮 */
     cancel() {
       this.open = false;
@@ -314,6 +305,18 @@ export default {
         return;
       });
     },
+    // 人员选择弹窗
+    handleSelectUser() {
+      this.$refs.UserSelect.showFlag = true;
+    },
+    // 鉴定人选择
+    onUserSelected(obj) {
+      console.log(obj);
+      if (obj != undefined && obj != null) {
+        this.form.userName = obj.username;
+        this.form.userId = obj.id;
+      }
+    },
   },
 };
 </script>

src/views/setting/depot/index.vue

@@ -45,14 +45,6 @@
           :default-time="['00:00:00', '23:59:59']"
         />
       </el-form-item>
-      <!-- <el-form-item label="立档单位名称" prop="organizationName">
-        <el-input
-          v-model="queryParams.organizationName"
-          placeholder="请输入立档单位名称"
-          clearable
-          @keyup.enter.native="handleQuery"
-        />
-      </el-form-item> -->
       <el-form-item>
         <el-button type="primary" icon="el-icon-search" @click="handleQuery"
           >搜索</el-button
@@ -94,7 +86,6 @@
 
     <!-- 列表 -->
     <el-table v-loading="loading" :data="list">
-      <!-- <el-table-column label="主键ID" align="center" prop="id" /> -->
       <el-table-column label="库房名称" align="center" prop="name" />
       <el-table-column label="库房编号" align="center" prop="code" />
       <el-table-column label="库房地址" align="center" prop="address" />
@@ -179,21 +170,23 @@
         <el-row>
           <el-col :span="8">
             <el-form-item label="管理者姓名" prop="manegerName">
-              <el-select
+              <el-input
-                v-model="manegerName"
+                v-model="form.manegerName"
-                filterable
                 placeholder="请选择管理者"
-                value-key="id"
+                readonly
-                @change="handleSelectUser"
-              >
-                <el-option
-                  v-for="item in userOptions"
-                  :key="item.id"
-                  :value="item"
-                  :label="item.username"
               >
-                </el-option>
+                <el-button
-              </el-select>
+                  slot="append"
+                  @click="handleSelectUser"
+                  icon="el-icon-search"
+                  style="
+                    border-color: #46a6ff;
+                    background-color: #46a6ff;
+                    color: white;
+                  "
+                ></el-button>
+              </el-input>
+              <UserSelect ref="UserSelect" @onSelected="onUserSelected" />
             </el-form-item>
           </el-col>
           <el-col :span="8">
@@ -242,11 +235,11 @@ import {
   exportDepotExcel,
 } from "@/api/setting/depot";
 import { getOrganizationPage } from "@/api/setting/organization";
-import { listUser } from "@/api/system/user";
+import UserSelect from "@/components/UserSelect/single.vue";
 
 export default {
   name: "Depot",
-  components: {},
+  components: { UserSelect },
   data() {
     return {
       // 遮罩层
@@ -280,9 +273,7 @@ export default {
       // 表单校验
       rules: {},
       organizationList: [], //立档单位数据
-      userOptions: [], //用户数据
       organizationName: null,
-      manegerName: null,
     };
   },
   created() {
@@ -312,17 +303,6 @@ export default {
       this.form.organizationId = val.id;
       this.form.organizationName = val.organizationName;
     },
-    //获取用户
-    getUserList() {
-      listUser().then((response) => {
-        this.userOptions = response.data.list;
-      });
-    },
-    handleSelectUser(val) {
-      console.log(val);
-      this.form.manegerId = val.id;
-      this.form.manegerName = val.username;
-    },
     /** 取消按钮 */
     cancel() {
       this.open = false;
@@ -346,7 +326,6 @@ export default {
         company: undefined,
         remark: undefined,
       };
-      this.manegerName = undefined;
       this.organizationName = undefined;
       this.resetForm("form");
     },
@@ -373,7 +352,6 @@ export default {
       getDepot(id).then((response) => {
         this.form = response.data;
         this.organizationName = response.data.organizationName;
-        this.manegerName = response.data.manegerName;
         this.open = true;
         this.title = "修改库房管理";
       });
@@ -433,6 +411,17 @@ export default {
         })
         .catch(() => {});
     },
+    // 人员选择弹窗
+    handleSelectUser() {
+      this.$refs.UserSelect.showFlag = true;
+    },
+    // 管理人选择
+    onUserSelected(obj) {
+      console.log(obj);
+      if (obj != undefined && obj != null) {
+        this.form.manegerName = obj.username;
+      }
+    },
   },
 };
 </script>

src/views/setting/depotCabinet/index.vue

@@ -45,15 +45,6 @@
           :default-time="['00:00:00', '23:59:59']"
         />
       </el-form-item>
-      <!-- <el-form-item label="管理者姓名" prop="manegerName">
-        <el-input
-          v-model="queryParams.manegerName"
-          placeholder="请输入管理者姓名"
-          clearable
-          @keyup.enter.native="handleQuery"
-        />
-      </el-form-item> -->
-
       <el-form-item>
         <el-button type="primary" icon="el-icon-search" @click="handleQuery"
           >搜索</el-button
@@ -95,7 +86,6 @@
 
     <!-- 列表 -->
     <el-table v-loading="loading" :data="list">
-      <!-- <el-table-column label="所属库房ID" align="center" prop="depotId" /> -->
       <el-table-column label="柜子名称" align="center" prop="name" />
       <el-table-column label="柜子编号" align="center" prop="code" />
       <el-table-column label="库房地址" align="center" prop="address" />
@@ -191,21 +181,23 @@
           </el-col>
           <el-col :span="8">
             <el-form-item label="管理者姓名" prop="manegerName">
-              <el-select
+              <el-input
-                v-model="manegerName"
+                v-model="form.manegerName"
-                filterable
                 placeholder="请选择管理者"
-                value-key="id"
+                readonly
-                @change="handleSelectUser"
               >
-                <el-option
+                <el-button
-                  v-for="item in userOptions"
+                  slot="append"
-                  :key="item.id"
+                  @click="handleSelectUser"
-                  :value="item"
+                  icon="el-icon-search"
-                  :label="item.username"
+                  style="
-                >
+                    border-color: #46a6ff;
-                </el-option>
+                    background-color: #46a6ff;
-              </el-select>
+                    color: white;
+                  "
+                ></el-button>
+              </el-input>
+              <UserSelect ref="UserSelect" @onSelected="onUserSelected" />
             </el-form-item>
           </el-col>
         </el-row>
@@ -235,11 +227,11 @@ import {
   exportDepotCabinetExcel,
 } from "@/api/setting/depotCabinet";
 import { getDepotPage } from "@/api/setting/depot";
-import { listUser } from "@/api/system/user";
+import UserSelect from "@/components/UserSelect/single.vue";
 
 export default {
   name: "DepotCabinet",
-  components: {},
+  components: { UserSelect },
   data() {
     return {
       // 遮罩层
@@ -278,15 +270,12 @@ export default {
       form: {},
       // 表单校验
       rules: {},
-      userOptions: [], //用户数据
       addressList: [], //库房数据
-      manegerName: null,
     };
   },
   created() {
     this.getList();
     this.getAddressList();
-    this.getUserList();
   },
   methods: {
     /** 查询列表 */
@@ -299,28 +288,12 @@ export default {
         this.loading = false;
       });
     },
-    //获取用户
-    getUserList() {
-      listUser().then((response) => {
-        this.userOptions = response.data.list;
-      });
-    },
     // 获取库房
     getAddressList() {
       getDepotPage().then((response) => {
         this.addressList = response.data.list;
       });
     },
-    // handleSelectAddress(val) {
-    //   console.log(val);
-    //   this.form.depotId = val.id;
-    //   this.form.depotName = val.name;
-    // },
-    handleSelectUser(val) {
-      console.log(val);
-      this.form.manegerId = val.id;
-      this.form.manegerName = val.username;
-    },
     /** 取消按钮 */
     cancel() {
       this.open = false;
@@ -344,7 +317,6 @@ export default {
         remark: undefined,
         cabinetNum: undefined,
       };
-      this.manegerName = undefined;
       this.resetForm("form");
     },
     /** 搜索按钮操作 */
@@ -369,7 +341,6 @@ export default {
       const id = row.id;
       getDepotCabinet(id).then((response) => {
         this.form = response.data;
-        this.manegerName = response.data.manegerName;
         this.open = true;
         this.title = "修改档案柜管理";
       });
@@ -429,6 +400,17 @@ export default {
         })
         .catch(() => {});
     },
+    // 人员选择弹窗
+    handleSelectUser() {
+      this.$refs.UserSelect.showFlag = true;
+    },
+    // 管理人选择
+    onUserSelected(obj) {
+      console.log(obj);
+      if (obj != undefined && obj != null) {
+        this.form.manegerName = obj.username;
+      }
+    },
   },
 };
 </script>