石广澎
2024-01-05 b2429057ae17e9f5b357435b0bff5f6cc0040b69
admin-web/src/views/foundation/store/person.vue
@@ -1,5 +1,5 @@
<template>
  <win-md :title="setting.title" @close="close" :width="'800px'">
  <win-md :title="setting.title" @close="close" :width="'800px'" :loading="loading">
    <div class="section-container">
      <div class="section-left">
        <div class="header-row"><span class="title">选择人员:</span></div>
@@ -7,8 +7,10 @@
          <el-tree ref="tree" :data="treeData" node-key="id" :props="defaultProps" default-expand-all>
            <template slot-scope="{ node, data }">
              <div v-if="data.type != 'user'">{{ data.name }}</div>
              <div v-else class="leaf-node" :class="data.checked ? 'checked' : ''" @click="handleCheckItem(node, data)">
                {{ data.name }}
              <div v-else class="leaf-node" :class="data.checked ? 'checked' : ''" @click="handleCheckItem(data)">
                <div>{{ data.name }}</div>
                <i style="font-size: 18px;font-weight: bold;color: #0d997c;margin-right: 10px"
                   class="el-icon-check"></i>
              </div>
            </template>
          </el-tree>
@@ -28,30 +30,31 @@
      </div>
    </div>
    <div slot="footer" align="center" class="dialog-footer">
      <my-button name="取消" site="form" @click="close" />
      <my-button name="保存" site="form" @click="save" />
      <my-button name="取消" site="form" @click="close"/>
      <my-button name="保存" site="form" @click="save"/>
    </div>
  </win-md>
</template>
<script>
import { departmentListAll } from '@/api/system/deptment';
import { userSelectDepartment, warehouseManagerAdd, warehouseManagerList } from '@/api/foudation/store';
import {userSelectDepartment, warehouseManagerList, warehouseManagerAdd} from '@/api/foudation/store';
import winMd from '@/components/win/win-md';
import myButton from '@/components/myButton/myButton';
import * as finsystenant from '@/api/baseSetting/finsystenant';
export default {
  name: 'person',
  components: { winMd, myButton },
  components: {winMd, myButton},
  props: {
    setting: {
      type: Object,
      default: () => {},
      default: () => {
      },
    },
  },
  data() {
    return {
      loading: true,
      loadingText: '加载中',
      selectdSections: [],
      treeData: [],
      formData: {},
@@ -59,6 +62,7 @@
        children: 'children',
        label: 'name',
      },
      key: Math.random(),
    };
  },
  computed: {
@@ -67,43 +71,60 @@
    },
  },
  created() {
    console.log(this.setting);
    if (this.setting.info) {
      this.formData = Object.assign({}, JSON.parse(this.setting.info));
    }
    this.initTree();
    warehouseManagerList({ warehouseId: this.formData.id }).then((res) => {
      console.log(res);
    });
    this.init();
  },
  methods: {
    initTree() {
      userSelectDepartment({ agencyId: this.formData.agencyId }).then((res) => {
        this.treeData = [res];
    async init() {
      let managerRes = await warehouseManagerList({warehouseId: this.formData.id});
      this.selectdSections = managerRes.map((item) => {
        item.name = item.managerName;
        item.id = item.managerId;
        item.checked = true
        return item;
      });
      const res = await userSelectDepartment({agencyId: this.formData.agencyId});
      this.treeData = this.deepList([res]);
      this.key = Math.random();
      this.loading = false
    },
    deepList(list) {
      return list.map((item) => {
        if (item.children && item.children.length) {
          this.deepList(item.children);
        } else {
          item.checked = this.selectdSections.some(s=>item.id===s.id)
        }
        return item;
      });
    },
    handleCheckItem(node, data) {
      this.selectdSections = [];
    handleCheckItem(data) {
      if (!data.checked) {
        this.selectdSections.push(data);
      } else {
        let idx = this.selectdSections.findIndex(item => item.id === data.id)
        if (idx !== -1) {
          this.selectdSections.splice(idx, 1)
        }
      }
      this.treeData[0].children.forEach((item, index) => {
        if (item.children) {
          item.children.forEach((child, childIndex) => {
            if (child.id == data.id) {
              this.$set(this.treeData[0].children[index].children[childIndex], 'checked', !child.checked);
            }
            if (child.checked) {
              this.selectdSections.push(child);
            }
          });
        }
      });
      console.log(this.treeData);
    },
    handleDel(item) {
      this.handleCheckItem({}, item);
      this.handleCheckItem(item);
    },
    handleClear() {
      this.selectdSections.forEach((item) => {
        this.handleCheckItem({}, item);
        this.handleCheckItem(item);
      });
      this.selectdSections = [];
    },
@@ -111,23 +132,24 @@
      this.$emit('close');
    },
    save() {
      let params = [];
      if(this.selectdSections.length===0){
        this.$message.error('请选择库管员!');
        return
      }
      let params = {
        warehouseId: this.setting.id,
        warehouseManagerInfoList: [],
      };
      this.selectdSections.forEach((item) => {
        params.push({
        params.warehouseManagerInfoList.push({
          managerId: item.id,
          managerName: item.name,
          baseWarehouseId: this.setting.id,
        });
      });
      debugger;
      warehouseManagerAdd(params).then((res) => {
        if (res) {
          this.$message.success('保存成功!');
          this.close();
          this.$emit('search');
        } else {
          this.$message.error('保存失败');
        }
        this.$message.success('保存成功!');
        this.close();
        this.$emit('search');
      });
    },
  },
@@ -138,12 +160,14 @@
  height: 400px;
  display: flex;
  justify-content: space-between;
  ::v-deep {
    .el-tree-node__expand-icon.is-leaf {
      display: none;
    }
  }
}
.section-left,
.section-right {
  width: calc((100% - 20px) / 2);
@@ -154,10 +178,12 @@
  border-radius: 4px;
  overflow-y: auto;
}
.header-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  .title {
    color: #3d3d3d;
    font-size: 14px;
@@ -165,9 +191,11 @@
    font-weight: 400;
  }
}
.section-body {
  margin-top: 20px;
}
.section-right {
  .btn {
    display: inline-block;
@@ -182,11 +210,13 @@
    background: rgba($color: #0d997c, $alpha: 0.1);
    cursor: pointer;
  }
  .del-btn {
    color: #f9675b;
    border: 1px solid #f9675b;
    background: rgba($color: #f9675b, $alpha: 0.1);
  }
  .section-item {
    width: 44%;
    margin: 0 auto;
@@ -196,20 +226,24 @@
    margin-bottom: 10px;
  }
}
.leaf-node {
  width: 100%;
  height: 26px;
  line-height: 26px;
  padding-left: 10px;
  &:hover {
    background: #f5f7fa;
  display: flex;
  justify-content: space-between;
  align-items: center;
  i {
    display: none;
  }
}
.checked {
  width: 100%;
  background: #f5f7fa;
  height: 26px;
  line-height: 26px;
  box-sizing: border-box;
  i {
    display: inline-flex;
  }
}
</style>