优化

zhanghua

2024-01-21 e1aa0ecffbabd618c71e4ad94370fb8dffe6ee1c

 src/views/systemSetting/baseSetting/department/updateUser/index.vue

@@ -33,18 +33,24 @@
                      item.leader ? 'leader' : '',
                    ]"></i>
                  </div>
                  <label style="font-size: 12px" :class="[item.leader ? 'leader' : '']">{{ item.username }}</label>
                  <label style="font-size: 12px" :class="[item.leader ? 'leader' : 'theMasses']">{{ item.username }}</label>
                </div>
              </li>
              <li class="li-btn" v-if="updateFlag">
                <i class="el-icon-plus" @click="openUser = true"></i>
              </li>
              <li class="li-btn" v-if="updateFlag">
                <el-tooltip class="item" effect="light" content="清除选中人员" placement="top" :enterable="false">
                  <i class="el-icon-minus" @click="clrarUser"></i>
                </el-tooltip>

              </li>
            </ul>
            <div class="card" v-if="openUser">
              <el-card class="box-card">
                <div slot="header" class="myclear">
                  <span>工作人员</span>
                  <div @click="addUser">确认</div>
                  <div class="department-sub" @click="addUser">确认</div>
                </div>
                <div class="scrollWrap">
                  <el-checkbox-group v-model="checkedUser">
@@ -87,21 +93,7 @@
        callback();
      }
    };
    const validateId = (rule, value, callback) => {
      if (!value) {
        callback(new Error("请填写部门id"));
      } else {
        callback();
      }
    };
    const validatePass = (rule, value, callback) => {
      if (!value) {
        callback();
      } else {
        callback();
      }
    };
    const validatePhone = (rule, value, callback) => {
      if (!value) {
        callback();
      } else {
@@ -117,7 +109,6 @@
        departType: "",
      },
      createUserRules: {
        id: [{ required: true, trigger: "blur", validator: validateId }],
        departName: [
          { required: true, trigger: "blur", validator: validateNickname },
        ],
@@ -140,18 +131,18 @@
    this.user = JSON.parse(JSON.stringify(that.userInfo));
    console.log(this.user);
    this.user.parentId = this.user.parentId === 0 ? '暂无上级部门' : this.user.parentId;
    console.log(this.user.parentId);
    this.checkedList = this.user.userInfoDTOS;
    this.checkedList.forEach((e) => {
      this.checkedUser.push(e.userId);
    });
    console.log(this.checkedUser)
    this.$axios({
      method: "get",
      url: "sccg/depart/tree",
    }).then((res) => {
      that.departList = res.data;
    });
    this.getUserList();
    this.getUserList(this.user.id);
    // 获取部门类型
    this.getDepartType();
  },
@@ -162,25 +153,32 @@
          const { user, checkedList } = this;
          const arr = [];
          checkedList.forEach((item) => {
            arr.push({ leader: item.leader, userId: item.userId });
            arr.push({ leader: item.leader, userId: item.id ? item.id : item.userId });
          });
          console.log(arr);
          this.$axios
            .post("sccg/depart/update", {
              id: user.id,
              departName: user.departName,
              parentId: user.parentId,
              departDes: user.departDes,
              departManagerList: arr,
            })
            .then((res) => {
              this.$message({
                message: res.message,
                type: res.code === 200 ? "success" : "warning",
          // if (arr.length === 0) {
          //   this.$message({
          //     type: 'warning',
          //     message: '请选择部门人员',
          //   })
          // } else {
            this.$axios
              .post("sccg/depart/update", {
                id: user.id,
                departName: user.departName,
                parentId: user.parentId === '暂无上级部门' ? 0 : user.parentId,
                departDes: user.departDes,
                departManagerList: arr,
                departType: user.departType
              })
              .then((res) => {
                this.$message({
                  message: res.message,
                  type: res.code === 200 ? "success" : "warning",
                });
                this.$emit("changeDialog", { flag: false });
                this.getDepartList();
              });
              this.$emit("changeDialog", { flag: false });
              this.getDepartList();
            });
          // }
        } else {
          return false;
        }
@@ -201,14 +199,19 @@
    },

    // 获取所有用户信息
    getUserList() {
    getUserList(id) {
      // 获取所有用户信息、用户查询(暂时支持电话号码)
      this.$axios.get(`sccg/admin/list`).then((res) => {
      this.$axios.get(`/sccg/depart/query_surplus_exist_user?id=`+id).then((res) => {
        if (res.code === 200) {
          this.userList = res.data.records;
          this.userList = res.data;
        }
      });
    },
    // 清除选中用户
    clrarUser(){
      this.checkedList=[]
    },

    addUser() {
      this.checkedList = [];
      this.userList.forEach((item) => {
@@ -222,7 +225,8 @@
          }
        });
      });
      this.checkedList[0].leader = true;
      // this.checkedList[0].leader = true;
      console.log(this.checkedList);
      this.openUser = false;
    },
  },
@@ -232,13 +236,13 @@
<style lang="scss" scoped>
.updateUser {
  border-radius: 1px;
  background-color: #09152f;
  // background-color: #09152f;

  main {
    // border: 1px solid #fff;
    text-align: left;
    padding: 0 55px;
    background-color: #09152f;
    // background-color: #09152f;
    padding-bottom: 50px;

    // .mainTitle {
@@ -287,12 +291,12 @@
}

.updateUser::v-deep .el-form-item__label {
  color: #4b9bb7;
  // color: #4b9bb7;
}

.updateUser::v-deep .el-input__inner {
  background-color: #09152f;
  border: 1px solid #17324c;
  // background-color: #09152f;
  // border: 1px solid #17324c;
}

.addPerson {
@@ -323,6 +327,12 @@
  width: 36px;
  height: 36px;
  border-radius: 50%;
  .el-icon-plus{
    cursor: pointer;
  }
  .el-icon-minus{
    cursor: pointer;
  }
}

.card {
@@ -331,15 +341,16 @@
  right: 0;

  .box-card {
    max-height: 200px;
    min-height: 240px;
    max-height: 260px;
    overflow: hidden;
    background-color: #09152f;
    // background-color: #09152f;
    position: relative;
    max-width: 220px;

    .scrollWrap {
      overflow: scroll;
      height: 160px;
      height: 180px;
      position: relative;
      color: #4b9bb7;

@@ -359,6 +370,11 @@
      color: #4b9bb7;
      display: flex;
      justify-content: space-between;
      .department-sub{
        cursor: pointer;
        margin-left: 5px;
        color: #2f54eb;
      }
    }

    .hidebar {
@@ -366,8 +382,8 @@
      top: 77px;
      right: 20px;
      width: 20px;
      height: 160px;
      background-color: #09152f;
      height: 180px;
      // background-color: #09152f;
    }

    .item {
@@ -379,8 +395,10 @@
.leader {
  color: red;
}

.theMasses{
  color: #2f54eb;
}
.el-input {
  width: 280px !important;
}
</style>
</style>