WXL
2025-03-04 57a7537f38f78499218c2d23f4c09a26add08c5a
src/views/system/user/index.vue
@@ -2,7 +2,7 @@
  <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"
@@ -26,9 +26,9 @@
            @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"
@@ -37,10 +37,19 @@
          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"
@@ -70,7 +79,8 @@
              />
            </el-select>
          </el-form-item>
          <el-form-item label="创建时间">
          <!-- <el-form-item label="创建时间">
            <el-date-picker
              v-model="dateRange"
              style="width: 240px"
@@ -80,7 +90,7 @@
              start-placeholder="开始日期"
              end-placeholder="结束日期"
            ></el-date-picker>
          </el-form-item>
          </el-form-item> -->
          <el-form-item>
            <el-button
              type="primary"
@@ -174,7 +184,7 @@
            v-if="columns[0].visible"
          />
          <el-table-column
            label="用户名称"
            label="用户工号"
            align="center"
            key="userName"
            prop="userName"
@@ -189,14 +199,14 @@
            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"
@@ -228,7 +238,7 @@
            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
@@ -305,17 +315,54 @@
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="归属部门" prop="deptId">
              <treeselect
                v-model="form.depts"
                :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">
@@ -340,12 +387,12 @@
          <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>
@@ -392,6 +439,7 @@
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="岗位">
@@ -498,12 +546,15 @@
  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",
@@ -528,7 +579,8 @@
      // 弹出层标题
      title: "",
      // 部门树选项
      deptOptions: undefined,
      deptOptionsks: undefined,
      deptOptionsbq: undefined,
      // 是否显示弹出层
      open: false,
      // 部门名称
@@ -548,6 +600,7 @@
        children: "children",
        label: "label",
      },
      props: { multiple: true, value: "deptCode", label: "label" },
      // 用户导入参数
      upload: {
        // 是否显示弹出层(用户导入)
@@ -572,24 +625,31 @@
        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",
          },
        ],
@@ -635,6 +695,14 @@
      this.initPassword = response.msg;
    });
  },
  mounted() {
    this.$nextTick(() => {
      const menuWrap = document.querySelector('.el-cascader-menu__wrap');
      if (menuWrap) {
        menuWrap.style.height = '404px';
      }
    });
  },
  methods: {
    /** 查询用户列表 */
    getList() {
@@ -650,9 +718,17 @@
    },
    /** 查询部门下拉树结构 */
    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) {
@@ -699,6 +775,8 @@
        remark: undefined,
        postIds: [],
        roleIds: [],
        deptCodes: [],
        wardCodes: [],
      };
      this.resetForm("form");
    },
@@ -737,14 +815,15 @@
    /** 新增按钮操作 */
    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.form.depts = [];
      });
      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) {
@@ -753,6 +832,20 @@
      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;
@@ -761,6 +854,16 @@
        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) {
        }
      });
    },
    /** 重置密码按钮操作 */
@@ -786,23 +889,83 @@
    },
    /** 提交按钮 */
    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) => {
          const 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) => {
          const 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) {
@@ -836,7 +999,7 @@
    /** 下载模板操作 */
    importTemplate() {
      this.download(
        "system/user/importTemplate",
        "smartor/import/getImportPatTemplate",
        {},
        `user_template_${new Date().getTime()}.xlsx`
      );
@@ -866,3 +1029,12 @@
  },
};
</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>