|  |  | 
 |  |  |   <div class="app-container"> | 
 |  |  |     <el-row :gutter="20"> | 
 |  |  |       <!--部门数据--> | 
 |  |  |       <el-col :span="4" :xs="24"> | 
 |  |  |       <!-- <el-col :span="4" :xs="24"> | 
 |  |  |         <div class="head-container"> | 
 |  |  |           <el-input | 
 |  |  |             v-model="deptName" | 
 |  |  | 
 |  |  |             @node-click="handleNodeClick" | 
 |  |  |           /> | 
 |  |  |         </div> | 
 |  |  |       </el-col> | 
 |  |  |       </el-col> --> | 
 |  |  |       <!--用户数据--> | 
 |  |  |       <el-col :span="20" :xs="24"> | 
 |  |  |       <el-col :span="24" :xs="24"> | 
 |  |  |         <el-form | 
 |  |  |           :model="queryParams" | 
 |  |  |           ref="queryForm" | 
 |  |  | 
 |  |  |           v-show="showSearch" | 
 |  |  |           label-width="68px" | 
 |  |  |         > | 
 |  |  |           <el-form-item label="用户名称" prop="userName"> | 
 |  |  |           <el-form-item label="用户工号" prop="userName"> | 
 |  |  |             <el-input | 
 |  |  |               v-model="queryParams.userName" | 
 |  |  |               placeholder="请输入用户名称" | 
 |  |  |               placeholder="请输入用户工号" | 
 |  |  |               clearable | 
 |  |  |               style="width: 240px" | 
 |  |  |               @keyup.enter.native="handleQuery" | 
 |  |  |             /> | 
 |  |  |           </el-form-item> | 
 |  |  |           <el-form-item label="用户昵称" prop="nickName"> | 
 |  |  |             <el-input | 
 |  |  |               v-model="queryParams.nickName" | 
 |  |  |               placeholder="请输入用户昵称" | 
 |  |  |               clearable | 
 |  |  |               style="width: 240px" | 
 |  |  |               @keyup.enter.native="handleQuery" | 
 |  |  | 
 |  |  |               /> | 
 |  |  |             </el-select> | 
 |  |  |           </el-form-item> | 
 |  |  |           <el-form-item label="创建时间"> | 
 |  |  |  | 
 |  |  |           <!-- <el-form-item label="创建时间"> | 
 |  |  |             <el-date-picker | 
 |  |  |               v-model="dateRange" | 
 |  |  |               style="width: 240px" | 
 |  |  | 
 |  |  |               start-placeholder="开始日期" | 
 |  |  |               end-placeholder="结束日期" | 
 |  |  |             ></el-date-picker> | 
 |  |  |           </el-form-item> | 
 |  |  |           </el-form-item> --> | 
 |  |  |           <el-form-item> | 
 |  |  |             <el-button | 
 |  |  |               type="primary" | 
 |  |  | 
 |  |  |             v-if="columns[0].visible" | 
 |  |  |           /> | 
 |  |  |           <el-table-column | 
 |  |  |             label="用户名称" | 
 |  |  |             label="用户工号" | 
 |  |  |             align="center" | 
 |  |  |             key="userName" | 
 |  |  |             prop="userName" | 
 |  |  | 
 |  |  |             v-if="columns[2].visible" | 
 |  |  |             :show-overflow-tooltip="true" | 
 |  |  |           /> | 
 |  |  |           <el-table-column | 
 |  |  |           <!-- <el-table-column | 
 |  |  |             label="部门" | 
 |  |  |             align="center" | 
 |  |  |             key="deptName" | 
 |  |  |             prop="dept.deptName" | 
 |  |  |             v-if="columns[3].visible" | 
 |  |  |             :show-overflow-tooltip="true" | 
 |  |  |           /> | 
 |  |  |           /> --> | 
 |  |  |           <el-table-column | 
 |  |  |             label="手机号码" | 
 |  |  |             align="center" | 
 |  |  | 
 |  |  |             width="160" | 
 |  |  |           > | 
 |  |  |             <template slot-scope="scope"> | 
 |  |  |               <span>{{ parseTime(scope.row.createTime) }}</span> | 
 |  |  |               <span>{{ formatTime(scope.row.createTime) }}</span> | 
 |  |  |             </template> | 
 |  |  |           </el-table-column> | 
 |  |  |           <el-table-column | 
 |  |  | 
 |  |  |             </el-form-item> | 
 |  |  |           </el-col> | 
 |  |  |           <el-col :span="12"> | 
 |  |  |             <el-form-item label="归属部门" prop="deptId"> | 
 |  |  |               <treeselect | 
 |  |  |                 v-model="deptIds" | 
 |  |  |                 :options="deptOptions" | 
 |  |  |                 :multiple="true" | 
 |  |  |                 :show-count="true" | 
 |  |  |                 placeholder="请选择归属部门" | 
 |  |  |               /> | 
 |  |  |             <el-form-item label="患者范围" prop="status"> | 
 |  |  |               <el-select | 
 |  |  |                 v-model="form.searchscope" | 
 |  |  |                 placeholder="患者范围" | 
 |  |  |                 clearable | 
 |  |  |               > | 
 |  |  |                 <el-option | 
 |  |  |                   v-for="dict in searchscopelist" | 
 |  |  |                   :key="dict.value" | 
 |  |  |                   :label="dict.label" | 
 |  |  |                   :value="dict.value" | 
 |  |  |                 /> | 
 |  |  |               </el-select> | 
 |  |  |             </el-form-item> | 
 |  |  |           </el-col> | 
 |  |  |         </el-row> | 
 |  |  |         <el-form-item label="适用科室" prop="region"> | 
 |  |  |             <el-cascader | 
 |  |  |               style="width: 478px" | 
 |  |  |               v-model="form.deptCodes" | 
 |  |  |               @remove-tag="removehpsp" | 
 |  |  |               :options="deptOptionsks" | 
 |  |  |               :props="props" | 
 |  |  |               filterable | 
 |  |  |               clearable | 
 |  |  |             > | 
 |  |  |               <template slot-scope="{ node, data }"> | 
 |  |  |                 <span>{{ data.label }}</span> | 
 |  |  |                 <span v-if="!node.isLeaf"> ({{ data.children.length }}) </span> | 
 |  |  |               </template> | 
 |  |  |             </el-cascader> | 
 |  |  |         </el-form-item> | 
 |  |  |         <el-form-item label="适用病区" prop="region"> | 
 |  |  |             <el-cascader | 
 |  |  |               style="width: 478px" | 
 |  |  |               @remove-tag="removehpsp" | 
 |  |  |               v-model="form.wardCodes" | 
 |  |  |               :options="deptOptionsbq" | 
 |  |  |               :props="props" | 
 |  |  |               filterable | 
 |  |  |               clearable | 
 |  |  |             > | 
 |  |  |               <template slot-scope="{ node, data }"> | 
 |  |  |                 <span>{{ data.label }}</span> | 
 |  |  |                 <span v-if="!node.isLeaf"> ({{ data.children.length }}) </span> | 
 |  |  |               </template> | 
 |  |  |             </el-cascader> | 
 |  |  |         </el-form-item> | 
 |  |  |         <el-row> | 
 |  |  |           <el-col :span="12"> | 
 |  |  |             <el-form-item label="手机号码" prop="phonenumber"> | 
 |  |  | 
 |  |  |           <el-col :span="12"> | 
 |  |  |             <el-form-item | 
 |  |  |               v-if="form.userId == undefined" | 
 |  |  |               label="用户名称" | 
 |  |  |               label="用户工号" | 
 |  |  |               prop="userName" | 
 |  |  |             > | 
 |  |  |               <el-input | 
 |  |  |                 v-model="form.userName" | 
 |  |  |                 placeholder="请输入用户名称" | 
 |  |  |                 placeholder="请输入用户工号" | 
 |  |  |                 maxlength="30" | 
 |  |  |               /> | 
 |  |  |             </el-form-item> | 
 |  |  | 
 |  |  |             </el-form-item> | 
 |  |  |           </el-col> | 
 |  |  |         </el-row> | 
 |  |  |  | 
 |  |  |         <el-row> | 
 |  |  |           <el-col :span="12"> | 
 |  |  |             <el-form-item label="岗位"> | 
 |  |  | 
 |  |  |   addUser, | 
 |  |  |   updateUser, | 
 |  |  |   resetUserPwd, | 
 |  |  |   adduserdept, | 
 |  |  |   removeusertd, | 
 |  |  |   changeUserStatus, | 
 |  |  |   deptTreeSelect, | 
 |  |  | } from "@/api/system/user"; | 
 |  |  | import { getToken } from "@/utils/auth"; | 
 |  |  | import Treeselect from "@riophae/vue-treeselect"; | 
 |  |  | import "@riophae/vue-treeselect/dist/vue-treeselect.css"; | 
 |  |  | import { type } from "jquery"; | 
 |  |  |  | 
 |  |  | export default { | 
 |  |  |   name: "User", | 
 |  |  | 
 |  |  |       // 弹出层标题 | 
 |  |  |       title: "", | 
 |  |  |       // 部门树选项 | 
 |  |  |       deptOptions: undefined, | 
 |  |  |       deptOptionsks: undefined, | 
 |  |  |       deptOptionsbq: undefined, | 
 |  |  |       // 是否显示弹出层 | 
 |  |  |       open: false, | 
 |  |  |       // 部门名称 | 
 |  |  | 
 |  |  |         children: "children", | 
 |  |  |         label: "label", | 
 |  |  |       }, | 
 |  |  |       props: { multiple: true, value: "deptCode", label: "label" }, | 
 |  |  |       // 用户导入参数 | 
 |  |  |       upload: { | 
 |  |  |         // 是否显示弹出层(用户导入) | 
 |  |  | 
 |  |  |         status: undefined, | 
 |  |  |         deptId: undefined, | 
 |  |  |       }, | 
 |  |  |       searchscopelist: [ | 
 |  |  |         { value: "1", label: "科室" }, | 
 |  |  |         { value: "2", label: "病区" }, | 
 |  |  |         { value: "0", label: "全部" }, | 
 |  |  |         { value: "9", label: "无" }, | 
 |  |  |       ], | 
 |  |  |       // 列信息 | 
 |  |  |       columns: [ | 
 |  |  |         { key: 0, label: `用户编号`, visible: true }, | 
 |  |  |         { key: 1, label: `用户名称`, visible: true }, | 
 |  |  |         { key: 1, label: `用户工号`, visible: true }, | 
 |  |  |         { key: 2, label: `用户昵称`, visible: true }, | 
 |  |  |         { key: 3, label: `部门`, visible: true }, | 
 |  |  |         { key: 4, label: `手机号码`, visible: true }, | 
 |  |  |         { key: 5, label: `状态`, visible: true }, | 
 |  |  |         { key: 6, label: `创建时间`, visible: true }, | 
 |  |  |       ], | 
 |  |  |  | 
 |  |  |       // 表单校验 | 
 |  |  |       rules: { | 
 |  |  |         userName: [ | 
 |  |  |           { required: true, message: "用户名称不能为空", trigger: "blur" }, | 
 |  |  |           { required: true, message: "用户工号不能为空", trigger: "blur" }, | 
 |  |  |           { | 
 |  |  |             min: 2, | 
 |  |  |             max: 20, | 
 |  |  |             message: "用户名称长度必须介于 2 和 20 之间", | 
 |  |  |             message: "用户工号长度必须介于 2 和 20 之间", | 
 |  |  |             trigger: "blur", | 
 |  |  |           }, | 
 |  |  |         ], | 
 |  |  | 
 |  |  |       this.initPassword = response.msg; | 
 |  |  |     }); | 
 |  |  |   }, | 
 |  |  |   mounted() { | 
 |  |  |     this.$nextTick(() => { | 
 |  |  |       const menuWrap = document.querySelector('.el-cascader-menu__wrap'); | 
 |  |  |       if (menuWrap) { | 
 |  |  |         menuWrap.style.height = '404px'; | 
 |  |  |       } | 
 |  |  |     }); | 
 |  |  |   }, | 
 |  |  |   methods: { | 
 |  |  |     /** 查询用户列表 */ | 
 |  |  |     getList() { | 
 |  |  | 
 |  |  |     }, | 
 |  |  |     /** 查询部门下拉树结构 */ | 
 |  |  |     getDeptTree() { | 
 |  |  |       deptTreeSelect().then((response) => { | 
 |  |  |         this.deptOptions = response.data; | 
 |  |  |       // 科室列表 | 
 |  |  |       deptTreeSelect(1).then((response) => { | 
 |  |  |         this.deptOptionsks = response.data; | 
 |  |  |       }); | 
 |  |  |       deptTreeSelect(2).then((response) => { | 
 |  |  |         this.deptOptionsbq = response.data; | 
 |  |  |       }); | 
 |  |  |       // 院区列表 | 
 |  |  |       //  deptTreeSelect().then((response) => { | 
 |  |  |       //   this.deptOptions = response.data; | 
 |  |  |       // }); | 
 |  |  |     }, | 
 |  |  |     // 筛选节点 | 
 |  |  |     filterNode(value, data) { | 
 |  |  | 
 |  |  |         remark: undefined, | 
 |  |  |         postIds: [], | 
 |  |  |         roleIds: [], | 
 |  |  |         deptCodes: [], | 
 |  |  |         wardCodes: [], | 
 |  |  |       }; | 
 |  |  |       this.resetForm("form"); | 
 |  |  |     }, | 
 |  |  | 
 |  |  |     /** 新增按钮操作 */ | 
 |  |  |     handleAdd() { | 
 |  |  |       this.reset(); | 
 |  |  |       getUser().then((response) => { | 
 |  |  |         this.postOptions = response.posts; | 
 |  |  |         this.roleOptions = response.roles; | 
 |  |  |         this.open = true; | 
 |  |  |         this.title = "添加用户"; | 
 |  |  |         this.form.password = this.initPassword; | 
 |  |  |       }); | 
 |  |  |       this.open = true; | 
 |  |  |       this.title = "添加用户"; | 
 |  |  |       this.form.password = this.initPassword; | 
 |  |  |       this.form.depts = []; | 
 |  |  |       // getUser().then((response) => { | 
 |  |  |       //   this.postOptions = response.posts; | 
 |  |  |       //   this.roleOptions = response.roles; | 
 |  |  |  | 
 |  |  |       // }); | 
 |  |  |     }, | 
 |  |  |     /** 修改按钮操作 */ | 
 |  |  |     handleUpdate(row) { | 
 |  |  | 
 |  |  |       const userId = row.userId || this.ids; | 
 |  |  |       getUser(userId).then((response) => { | 
 |  |  |         this.form = response.data; | 
 |  |  |  | 
 |  |  |         this.belongDepts = response.belongDepts; | 
 |  |  |         this.belongWards = response.belongWards; | 
 |  |  |         if (this.form.hospInfo) { | 
 |  |  |           this.form.deptCodes = JSON.parse(this.form.hospInfo); | 
 |  |  |         } else { | 
 |  |  |           this.form.deptCodes = []; | 
 |  |  |         } | 
 |  |  |         if (this.form.deptInfo) { | 
 |  |  |           this.form.wardCodes = JSON.parse(this.form.deptInfo); | 
 |  |  |         } else { | 
 |  |  |           this.form.wardCodes = []; | 
 |  |  |         } | 
 |  |  |         console.log(this.form.wardCodes, "wardCodes"); | 
 |  |  |         console.log(this.form.deptCodes, "deptCodes"); | 
 |  |  |         this.postOptions = response.posts; | 
 |  |  |         this.roleOptions = response.roles; | 
 |  |  |         this.$set(this.form, "postIds", response.postIds); | 
 |  |  | 
 |  |  |         this.open = true; | 
 |  |  |         this.title = "修改用户"; | 
 |  |  |         this.form.password = ""; | 
 |  |  |       }); | 
 |  |  |     }, | 
 |  |  |     // 删除科室 | 
 |  |  |     removehpsp(valueArray) { | 
 |  |  |       console.log(valueArray, "删除科室"); | 
 |  |  |       console.log(this.form.userId, "删除"); | 
 |  |  |       let code = valueArray[valueArray.length - 1]; | 
 |  |  |       removeusertd(this.form.userId, code).then((res) => { | 
 |  |  |         if (res.code) { | 
 |  |  |         } | 
 |  |  |       }); | 
 |  |  |     }, | 
 |  |  |     /** 重置密码按钮操作 */ | 
 |  |  | 
 |  |  |     }, | 
 |  |  |     /** 提交按钮 */ | 
 |  |  |     submitForm: function () { | 
 |  |  |       this.form.hospInfo = JSON.stringify(this.form.deptCodes); | 
 |  |  |       this.form.deptInfo = JSON.stringify(this.form.wardCodes); | 
 |  |  |       if (this.form.deptCodes.length) | 
 |  |  |         this.form.deptCodes = this.form.deptCodes.map( | 
 |  |  |           (subArr) => subArr[subArr.length - 1] | 
 |  |  |         ); | 
 |  |  |       if (this.form.wardCodes.length) | 
 |  |  |         this.form.wardCodes = this.form.wardCodes.map( | 
 |  |  |           (subArr) => subArr[subArr.length - 1] | 
 |  |  |         ); | 
 |  |  |       console.log(this.form.wardCodes, "wardCodes"); | 
 |  |  |       console.log(this.form.deptCodes, "deptCodes"); | 
 |  |  |  | 
 |  |  |       this.$refs["form"].validate((valid) => { | 
 |  |  |         if (valid) { | 
 |  |  |           if (this.form.userId != undefined) { | 
 |  |  |             updateUser(this.form).then((response) => { | 
 |  |  |               this.$modal.msgSuccess("修改成功"); | 
 |  |  |               this.open = false; | 
 |  |  |               this.getList(); | 
 |  |  |               this.adduserdept(); | 
 |  |  |             }); | 
 |  |  |           } else { | 
 |  |  |             addUser(this.form).then((response) => { | 
 |  |  |               this.$modal.msgSuccess("新增成功"); | 
 |  |  |               this.open = false; | 
 |  |  |               this.getList(); | 
 |  |  |               this.form.userId = response.data; | 
 |  |  |               console.log("开始加部门"); | 
 |  |  |  | 
 |  |  |               this.adduserdept(); | 
 |  |  |             }); | 
 |  |  |           } | 
 |  |  |         } | 
 |  |  |       }); | 
 |  |  |     }, | 
 |  |  |     // 新增数据 | 
 |  |  |     adduserdept() { | 
 |  |  |       if (this.form.wardCodes[0]) { | 
 |  |  |         this.form.wardCodes.forEach((dept) => { | 
 |  |  |           let containsId8 = null; | 
 |  |  |           if (this.belongWards) { | 
 |  |  |             containsId8 = this.belongWards.some( | 
 |  |  |               (item) => item.deptCode == dept | 
 |  |  |             ); | 
 |  |  |           } | 
 |  |  |  | 
 |  |  |           if (!containsId8) { | 
 |  |  |             adduserdept({ | 
 |  |  |               deptCode: dept, | 
 |  |  |               deptType: 2, | 
 |  |  |               userId: this.form.userId, | 
 |  |  |             }).then((response) => { | 
 |  |  |               this.open = false; | 
 |  |  |               this.getList(); | 
 |  |  |             }); | 
 |  |  |           } | 
 |  |  |         }); | 
 |  |  |       } | 
 |  |  |       if (this.form.deptCodes[0]) { | 
 |  |  |         this.form.deptCodes.forEach((dept) => { | 
 |  |  |           let containsId8 = null; | 
 |  |  |           if (this.belongDepts) { | 
 |  |  |             containsId8 = this.belongDepts.some( | 
 |  |  |               (item) => item.deptCode == dept | 
 |  |  |             ); | 
 |  |  |           } | 
 |  |  |           if (!containsId8) { | 
 |  |  |             adduserdept({ | 
 |  |  |               deptCode: dept, | 
 |  |  |               deptType: 1, | 
 |  |  |               userId: this.form.userId, | 
 |  |  |             }).then((response) => { | 
 |  |  |               this.open = false; | 
 |  |  |               this.getList(); | 
 |  |  |             }); | 
 |  |  |           } | 
 |  |  |         }); | 
 |  |  |       } | 
 |  |  |     }, | 
 |  |  |     /** 删除按钮操作 */ | 
 |  |  |     handleDelete(row) { | 
 |  |  | 
 |  |  |     /** 下载模板操作 */ | 
 |  |  |     importTemplate() { | 
 |  |  |       this.download( | 
 |  |  |         "system/user/importTemplate", | 
 |  |  |         "smartor/import/getImportPatTemplate", | 
 |  |  |         {}, | 
 |  |  |         `user_template_${new Date().getTime()}.xlsx` | 
 |  |  |       ); | 
 |  |  | 
 |  |  |   }, | 
 |  |  | }; | 
 |  |  | </script> | 
 |  |  | <style lang="scss" > | 
 |  |  | // ::v-deep .el-cascader-menu__wrap{ | 
 |  |  | //   min-height: 404px ; | 
 |  |  | // } | 
 |  |  | // ::v-deep.el-cascader-panel .el-cascader-menu__wrap { | 
 |  |  | //   height: 404px !important; | 
 |  |  | // } | 
 |  |  |  | 
 |  |  | </style> |