qgb-process 0.1.52 → 0.1.53

package/src/components/public/MemberSelection.vue

@@ -1,487 +0,0 @@
-<template>
-  <el-dialog
-    :title="title"
-    :visible.sync="dialogVisible"
-    width="600px"
-    append-to-body
-    :before-close="handleClose"
-  >
-    <div class="wrapper">
-      <div class="plan">
-        <div class="plan-title">选择：</div>
-        <div class="tab">
-          <div class="tab-title" v-if="onlyType == ''">
-            <span
-              :class="type == 1 ? 'active' : ''"
-              @click="changeList('type', 1)"
-              >角色</span
-            >
-            <span
-              :class="type == 2 ? 'active' : ''"
-              @click="changeList('type', 2)"
-              >成员</span
-            >
-          </div>
-          <div class="approvers">
-            <div>
-              <el-input
-                v-show="type == 1"
-                placeholder="输入角色名"
-                v-model="filterApprovers"
-                clearable
-              ></el-input>
-              <el-input
-                v-show="type == 2"
-                placeholder="输入姓名"
-                v-model="filterNotifiers"
-                clearable
-              ></el-input>
-              <el-tree
-                :load="loadNode"
-                lazy
-                :class="onlyType != '' ? 'filter-tree' : ''"
-                :props="defaultProps"
-                default-expand-all
-                show-checkbox
-                node-key="id"
-                :default-checked-keys="defaultCheck"
-                :filter-node-method="filterNode"
-                @check="handleCheckChange1"
-                ref="approvers"
-              ></el-tree>
-            </div>
-          </div>
-        </div>
-      </div>
-      <div :span="11" class="plan">
-        <div class="plan-title">已选：</div>
-        <div>
-          <div class="checklist">
-            <el-row v-if="roleList.length > 0">
-              <el-col :span="6">
-                <span>角色:</span>
-              </el-col>
-              <el-col :span="16">
-                <div
-                  class="check-list"
-                  v-for="(item, index) in roleList"
-                  :key="index"
-                >
-                  <span>{{ item.name }}</span>
-                  <i
-                    class="el-icon-circle-close"
-                    @click="removeList('roleList', item)"
-                  ></i>
-                </div>
-              </el-col>
-            </el-row>
-            <el-row v-if="userList.length > 0">
-              <el-col :span="6">
-                <span>成员:</span>
-              </el-col>
-              <el-col :span="16">
-                <!-- {{userList}} -->
-                <div
-                  class="check-list"
-                  v-for="(item, index) in userList"
-                  :key="index"
-                >
-                  <span>{{ item.name || item.userName }}</span>
-                  <!-- <span>{{ item.id }}</span> -->
-                  <i
-                    class="el-icon-circle-close"
-                    @click="removeList('userList', item)"
-                  ></i>
-                </div>
-              </el-col>
-            </el-row>
-          </div>
-        </div>
-      </div>
-    </div>
-    <div>
-      <slot></slot>
-    </div>
-    <span slot="footer" class="dialog-footer">
-      <el-button @click="handleClose">取 消</el-button>
-      <el-button type="primary" @click="save">保 存</el-button>
-    </span>
-  </el-dialog>
-</template>
-
-<script>
-// import api from "@/api/apiSystem/index";
-import api from "@/api/apiMemberSelection";
-export default {
-  name: "",
-  mixins: [],
-  extends: {},
-  components: {},
-  props: {
-    // 题目
-    title: {
-      type: String,
-      default: "选择"
-    },
-    // 已选成员或角色
-    formData: {
-      type: Object,
-      default: () => {
-        return {
-          roleList: [],
-          userList: []
-        };
-      }
-    },
-    // 只展示角色 1; 只展示成员 2;  两个都显示 ''
-    onlyType: {
-      type: String,
-      default: "2"
-    },
-    isRadio: {
-      type: Boolean,
-      default: false
-    },
-    memberNo: {
-      type: Array,
-      default: () => {
-        return [];
-      }
-    },
-    directClose: {
-      type: Boolean,
-      default: true
-    }
-  },
-  data() {
-    return {
-      editChekcId: "",
-      dialogVisible: true,
-      filterNotifiers: "",
-      filterApprovers: "",
-      type: "1",
-      defaultProps: {
-        children: "children",
-        label: "name"
-      },
-      roleList: [],
-      userList: [],
-      defaultCheck: []
-    };
-  },
-  filters: {
-    // 处理函数
-    addPriceIcon(value) {
-      // console.log(value); //200
-      // return "¥" + value;
-    }
-  },
-  watch: {
-    filterApprovers(val) {
-      this.$refs.approvers.filter(val);
-    },
-    filterNotifiers(val) {
-      this.$refs.approvers.filter(val);
-    },
-    formData: {
-      immediate: true,
-      deep: true,
-      handler: function(newVal, oldVal) {
-        this.userList = newVal.userList;
-        // this.roleList = newVal.roleList;
-        this.userList = newVal.userList ?  this.userList : [];
-        var obj = {};
-
-        // console.log( newVal.roleList," newVal.userList;");
-        // for (var i = 0; i < newVal.userList.length; i++) {
-        //   if (!obj[newVal.userList[i].id]) {
-        //     this.userList.push(newVal.userList[i]);
-        //     obj[newVal.userList[i].id] = true;
-        //   }
-        // }
-        var obj2 = {};
-        for (var i = 0; i < newVal.roleList.length; i++) {
-          if (!obj2[newVal.roleList[i].id]) {
-            this.roleList.push(newVal.roleList[i]);
-            obj2[newVal.roleList[i].id] = true;
-          }
-        }
-        console.log(this.roleList, " newVal.roleList;");
-        this.$nextTick(() => {
-          if (this.onlyType == "2") {
-            this.defaultCheck =
-              this.userList.length > 0
-                ? this.userList.map((item) => item.id)
-                : [];
-          } else {
-            this.defaultCheck =
-              this.roleList.length > 0
-                ? this.roleList.map((item) => item.id)
-                : [];
-          }
-        });
-      }
-    },
-    onlyType: {
-      immediate: true,
-      handler: function(newVal, oldVal) {
-        if (newVal == "") {
-          return;
-        } else {
-          this.type = newVal;
-        }
-      }
-    }
-  },
-  computed: {},
-  methods: {
-    handleClose() {
-      this.roleList = [];
-      this.userList = [];
-      this.$emit("close");
-    },
-    save() {
-      const json = {
-        roleList: this.roleList,
-        userList: []
-      };
-      // console.log(this.roleList);
-      // console.log(json);
-      var obj2 = {};
-      for (var i = 0; i < this.userList.length; i++) {
-        if (!obj2[this.userList[i].id]) {
-          json.userList.push(this.userList[i]);
-          obj2[this.userList[i].id] = true;
-        }
-      }
-      this.$emit("save", json);
-      this.directClose && this.handleClose();
-    },
-    filterNode(value, data) {
-      if (!value) return true;
-      return data.name.indexOf(value) !== -1;
-    },
-    handleCheckChange1(data, checked) {
-      if (this.type == 1) {
-        if (this.isRadio) {
-          const flg = checked.checkedKeys.indexOf(data.id) > -1;
-          this.roleList = !flg ? [] : [data];
-          this.$refs.approvers.setCheckedNodes(this.roleList);
-        } else {
-          const list = this.$refs.approvers
-            .getCheckedNodes()
-            .filter(
-              (item, index) =>
-                !!(item.type == undefined && item.children == undefined)
-            );
-          this.roleList = list;
-        }
-      } else {
-        if (this.isRadio) {
-          const flg = checked.checkedKeys.indexOf(data.id) > -1;
-          this.userList = !flg ? [] : [data];
-          this.$refs.approvers.setCheckedNodes(this.userList);
-        } else {
-          const list = this.$refs.approvers
-            .getCheckedNodes()
-            .filter(
-              (item, index) =>
-                !!(item.type == undefined && item.children == undefined)
-            );
-          this.userList = list;
-        }
-      }
-    },
-    changeList(type, num) {
-      this[type] = num;
-      if (num == 1) {
-        this.$refs.approvers.setCheckedNodes(this.roleList);
-      } else {
-        this.$refs.approvers.setCheckedNodes(this.userList);
-      }
-    },
-    func(arr) {
-      arr.forEach((v) => {
-        if (v.contacts) {
-          if (v.contacts.length !== 0) {
-            v.contacts.forEach((val) => {
-              v.children.push(val);
-              // this.func(v.children);
-              this.treeData = arr;
-            });
-          }
-        }
-      });
-    },
-    async loadNode(node, resolve) {
-      const _this = this
-      if (node.level === 0) {
-        const res = await api.getOrgsData();
-        const data = [];
-        data.push(res.data.data);
-        if (data[0] && data[0].contacts && data[0].contacts.length > 0) {
-          const contacts = data[0].contacts.map(j => {
-            // j.disabled = j.imAccount == _this.$store.state.user.imAccount || !j.imAccount
-            j.disabled = j.imAccount == !j.imAccount
-            return j
-          })
-          data[0].children = data[0].children.concat(contacts)
-          data[0].imAccount = "account" + data[0].id
-        }
-        return resolve(data);
-      } else {
-        if (node.data.children) {
-          const data = node.data.children
-          data.forEach(item => {
-            if (item.contacts && item.contacts.length > 0) {
-              const contacts = item.contacts.map(j => {
-                // j.disabled = j.imAccount == _this.$store.state.user.imAccount || !j.imAccount
-                return j
-              })
-              item.children = item.children.concat(contacts)
-            }
-            // item.disabled = !!(item.imAccount == _this.$store.state.user.imAccount || item.disabled)
-            item.imAccount = item.imAccount ? item.imAccount : "account" + item.id
-          })
-          return resolve(data)
-        } else {
-          return resolve([])
-        }
-      }
-    },
-    removeList(type, obj) {
-      this[type] = this[type].filter((item) => item.memberNo !== obj.memberNo);
-      if (this[type].length > 0) {
-        this.$refs.approvers.setCheckedNodes(this[type]);
-      } else {
-        this.$refs.approvers.setCheckedKeys([]);
-      }
-    }
-  },
-  created() {},
-  mounted() {}
-};
-</script>
-<style lang="scss" scoped>
-.wrapper {
-  display: flex;
-  .plan {
-    .plan-title {
-      height: 44px;
-      line-height: 44px;
-      padding-left: 10px;
-      color: #666666;
-      border-bottom: 1px solid #e4e7ed;
-    }
-    flex: 1;
-    height: 420px;
-    border: 1px solid #ccc;
-    border-radius: 4px;
-    width: 50%;
-    &:nth-of-type(2) {
-      margin-left: 10px;
-    }
-    .tab-title {
-      display: flex;
-      justify-content: center;
-      padding: 20px 0 10px 0;
-      span {
-        display: block;
-        text-align: center;
-        line-height: 30px;
-        width: 50px;
-        cursor: pointer;
-        border: 1px solid #e4e7ed;
-        &:nth-of-type(1) {
-          border-radius: 4px 0 0 4px;
-        }
-        &:nth-of-type(2) {
-          border-radius: 0 4px 4px 0;
-        }
-        &.active {
-          border-color: #0286df;
-        }
-      }
-    }
-    .tab-title-app {
-      height: 30px;
-      margin-bottom: 10px;
-      display: flex;
-      justify-content: center;
-      span {
-        display: block;
-        border: 1px solid #ccc;
-        width: 60px;
-        line-height: 30px;
-        text-align: center;
-        cursor: pointer;
-        &:nth-of-type(1) {
-          border-radius: 4px 0 0 4px;
-        }
-        &:nth-of-type(2) {
-          border-radius: 0 4px 4px 0;
-        }
-        &.active {
-          border-color: #0b9dfe;
-        }
-      }
-    }
-    .approvers {
-      padding: 10px;
-    }
-    .notifiers {
-      padding: 10px;
-    }
-    .checklist {
-      padding: 10px;
-      height: 356px;
-      overflow: auto;
-    }
-  }
-  .approver-type {
-    display: flex;
-    padding: 20px 0;
-    span {
-      width: 90px;
-      &:before {
-        content: "*";
-        color: #f56c6c;
-        margin-right: 4px;
-      }
-    }
-    div {
-      flex: 1;
-      /deep/.el-radio {
-        display: block;
-        margin-bottom: 10px;
-      }
-    }
-  }
-  .check-list {
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-    margin-bottom: 4px;
-    .el-icon-circle-close {
-      cursor: pointer;
-    }
-  }
-  /deep/ .el-tree-node__loading-icon .el-icon-loading {
-    font-size: 16px;
-  }
-  /deep/ .el-tree {
-    margin-top: 8px;
-    height: 240px;
-    overflow-y: auto;
-  }
-  /deep/ .el-tree-node__loading-icon {
-    font-size: 20px;
-  }
-  .filter-tree {
-    height: 300px !important;
-  }
-}
-/deep/ .el-dialog__body {
-  padding: 10px 20px;
-}
-</style>