From cc2d13d77f52c698aa3a96e72aef6ec337f0a7da Mon Sep 17 00:00:00 2001
From: "zyx.net" <zyx>
Date: Thu, 1 Sep 2022 15:27:26 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9bug?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../PersonnelSelectionAll/index.vue           | 318 ++++++++++++++++++
 1 file changed, 318 insertions(+)
 create mode 100644 jero-web/src/components/PersonnelSelectionAll/index.vue

diff --git a/jero-web/src/components/PersonnelSelectionAll/index.vue b/jero-web/src/components/PersonnelSelectionAll/index.vue
new file mode 100644
index 000000000..9a050d228
--- /dev/null
+++ b/jero-web/src/components/PersonnelSelectionAll/index.vue
@@ -0,0 +1,318 @@
+<template>
+  <div>
+    <div class="box-title-text" v-if="!isInput">
+      <a-input class="box-input" :value="value" @input="indexclick($event)"
+               :disabled="true"
+               :title="value"
+               :placeholder="$t('PleaseSelect')+query.db_field_txt"/>
+      <a-button type="primary" class="button-box" :disabled="disabled" @click="standardClick">
+        {{this.$t('PersonnelSelection')}}
+      </a-button>
+      <a-button type="primary" v-if='isDelete' class="button-box" @click="standardDelete">
+        {{this.$t('delete')}}
+      </a-button>
+    </div>
+    <div class="box-title-text" v-if="isInput">
+      <a-input :class="{'box-input':!isClass}" :value="value"
+               readonly
+               :title="value"
+               @click.native="standardClick"
+               :placeholder="$t('PleaseSelect')+query.db_field_txt"/>
+    </div>
+    <a-drawer
+      :title="$t('PersonnelSelection')"
+      :maskClosable="false"
+      :width="600"
+      placement="right"
+      :closable="true"
+      @close="handleCancel"
+      :visible="visible"
+      style="height: 100%;overflow: auto;padding-bottom: 53px;">
+      <a-input-search style="margin-bottom: 8px" :placeholder="$t('NodeQuickLookup')"
+                      v-model="searchModel" @search="onSearch"/>
+      <div class="drawer-content">
+<!--        checkStrictly-->
+        <a-tree
+          style="margin-bottom: 60px;height: 600px"
+          v-if="treeVisible"
+          checkable
+
+          :loading="loading"
+          :tree-data="gData"
+          @check="onCheck"
+          @expand="onExpand"
+          v-model:checkedKeys="defaultCheckedKeys"
+          :defaultExpandedKeys="defaultExpandedKeys"
+        >
+        </a-tree>
+      </div>
+
+      <div class="drawer-bootom-button">
+        <a-button @click="handleCancel" type="danger" style="margin-right: 16px">{{$t('cancel')}}</a-button>
+        <a-button @click="handleSubmit" type="primary">{{$t('submit')}}</a-button>
+      </div>
+    </a-drawer>
+  </div>
+</template>
+
+<script>
+import { getAction, postAction } from '@/api/manage'
+
+export default {
+  name: 'index',
+  props: ['query', 'value', 'personneQuery', 'isSingleChoice', 'isInput', 'isClass', 'isDelete', 'disabled'],
+  data() {
+    return {
+      loading: true,
+      gData: [],
+      autoExpandParent: true,
+      expandedKeys: [],
+      visible: false,
+      treeVisible: false,
+      confirmLoading: false,
+      departId: '',
+      selectedKey: [],
+      userIds: [],
+      searchModel: '',
+      defaultExpandedKeys: [],
+      defaultCheckedKeys: [],
+      defaultCheckedKeysName: [],
+      content: []
+    }
+  },
+  mounted() {
+
+  },
+  methods: {
+    standardClick() {
+      this.treeVisible = false
+      this.departId = ''
+      this.searchModel = ''
+      this.userIds = []
+      this.userName = []
+      this.queryDepartUserTreeList(1)
+      this.visible = true
+    },
+    standardDelete() {
+      this.$emit('input', null)
+      this.$forceUpdate()
+      this.$emit('deleteData', this.query.db_field_name)
+    },
+    // onSelect(selectedKeys, info) {
+    //   console.log(selectedKeys)
+    //   this.selectedKey = selectedKeys
+    // },
+
+    onCheck(checkedKeys, info) {
+      console.log(checkedKeys, info)
+      this.userIds = checkedKeys
+      this.userName = []
+      if (this.userIds.length > 0) {
+        for (let i = 0; i < this.userIds.length; i++) {
+          for (let j = 0; j < this.defaultCheckedKeysName.length; j++) {
+            if (this.userIds[i] == this.defaultCheckedKeysName[j].id) {
+              this.userName.push(this.defaultCheckedKeysName[j].name)
+            }
+          }
+        }
+      }
+      if (info.checkedNodes && info.checkedNodes.length > 0) {
+        info.checkedNodes.forEach(res => {
+          if (res.data.props.dataRef.key) {
+            this.content.push({
+              id: res.data.props.dataRef.key,
+              title: res.data.props.dataRef.title
+            })
+          } else {
+            this.content.push({
+              id: res.data.props.id,
+              title: res.data.props.title
+            })
+          }
+        })
+      }
+      if (this.content && this.content.length > 0) {
+        for (let i = 0; i < this.content.length; i++) {
+          for (let j = i + 1; j < this.content.length; j++) {
+            if (this.content[i].id == this.content[j].id) {
+              this.content.splice(j, 1)
+              j--
+            }
+          }
+        }
+        this.userIds.forEach(res => {
+          this.content.forEach(val => {
+            if (res == val.id) {
+              this.userName.push(val.title)
+            }
+          })
+        })
+      }
+      if (this.userName.length > 0) {
+        for (let i = 0; i < this.userName.length; i++) {
+          for (let j = i + 1; j < this.userName.length; j++) {
+            if (this.userName[i] == this.userName[j]) {
+              this.userName.splice(j, 1)
+              j--
+            }
+          }
+        }
+      }
+    },
+    handleCancel() {
+      this.visible = false
+      this.treeVisible = false
+    },
+    handleSubmit() {
+      // if (this.userIds && this.userIds.length > 0) {
+      if (this.isSingleChoice) {
+        if (this.userIds.length > 1) {
+          this.$message.warning(this.$t('onlyOnePersonCanBeSelected'))
+          return
+        }
+      }
+      console.log(this,userIds)
+      console.log(this,userName)
+      let userIds = JSON.parse(JSON.stringify(this.userIds))
+      let userName = JSON.parse(JSON.stringify(this.userName))
+      this.$emit('input', userName.join(','))
+      this.$emit('change', this.query.db_field_name, userIds.join(','), this.query.subscript)
+      this.visible = false
+      this.treeVisible = false
+      // } else {
+      //   this.$message.warning(this.$t('pleaseSelectPersonFirst'))
+      // }
+    },
+    indexclick(event) {
+      this.$emit('input', event.target.value)
+      this.departId = ''
+      this.searchModel = ''
+      this.userIds = []
+      this.userName = []
+      this.defaultCheckedKeys = []
+    },
+    onSearch(e) {
+      this.gData = []
+      this.departId = ''
+      this.visibleTree = false
+      if (e) {
+        this.getUserAndDepart()
+      } else {
+        this.treeVisible = false
+        this.queryDepartUserTreeList(2)
+      }
+    },
+    getUserAndDepart() {
+      getAction('sys/user/getUserAndDepart', { name: this.searchModel }).then((res) => {
+        if (res) {
+          this.gData = res.filter(ele => ele.flag === 'DEPART')
+        } else {
+          this.gData = []
+        }
+        this.visibleTree = true
+      })
+    },
+    onExpand(selectedKeys, val) {
+      if (this.searchModel == '' || !this.searchModel) {
+        if (val.expanded) {
+          if (this.departId == val.node.value) {
+          } else {
+            this.departId = val.node.value
+            this.queryDepartUserTreeList(2)
+          }
+        }
+      }
+    },
+    queryDepartUserTreeList(num) {
+      let gData = JSON.parse(JSON.stringify(this.gData))
+      if (gData && gData.length > 0) {
+        gData = JSON.stringify(gData)
+      } else {
+        gData = ''
+      }
+      this.confirmLoading = true
+      postAction('sys/user/queryDepartUserTreeList', {
+        departId: this.departId,
+        json: gData,
+      }).then((res) => {
+        this.confirmLoading = false
+        if (res.success) {
+          this.gData = res.result
+          this.defaultExpandedKeys = [this.departId]
+          if (num == 1) {
+            if (this.userName && this.userName.length == 0) {
+              if (this.personneQuery[this.query.db_field_name + 'Name']) {
+                this.userName = this.personneQuery[this.query.db_field_name + 'Name'].split(',')
+              } else if (this.personneQuery[this.query.db_field_name]) {
+                this.userName = this.personneQuery[this.query.db_field_name].split(',')
+              } else {
+                this.userName = []
+              }
+            }
+            if (this.userIds && this.userIds.length == 0) {
+              if (this.personneQuery[this.query.db_field_name + '_id']) {
+                this.userIds = this.personneQuery[this.query.db_field_name + '_id'].split(',')
+              } else if (this.personneQuery[this.query.db_field_name]) {
+                this.userIds = this.personneQuery[this.query.db_field_name].split(',')
+              } else {
+                this.userIds = []
+              }
+            }
+            this.defaultCheckedKeys = this.userIds
+            this.defaultCheckedKeysName = []
+            if (this.defaultCheckedKeys.length > 0) {
+              for (let i = 0; i < this.defaultCheckedKeys.length; i++) {
+                this.defaultCheckedKeysName.push({
+                  id: this.defaultCheckedKeys[i],
+                  name: this.userName[i]
+                })
+              }
+            }
+          }
+          this.treeVisible = true
+        } else {
+          this.gData = []
+        }
+      })
+    }
+  }
+}
+</script>
+
+<style scoped>
+.box-title-text {
+  line-height: 1.4;
+  display: flex;
+}
+
+.box-input {
+  display: inline-block;
+  height: 38px;
+  width: 100%;
+}
+
+.button-box {
+  margin-left: 10px;
+  height: 38px;
+  line-height: 38px;
+
+}
+
+.drawer-bootom-button {
+  position: absolute;
+  bottom: 0;
+  width: 100%;
+  z-index: 100;
+  border-top: 1px solid #e8e8e8;
+  padding: 10px 16px;
+  text-align: right;
+  left: 0;
+  background: #fff;
+  border-radius: 0 0 2px 2px;
+}
+
+.drawer-content {
+  height: calc(100% - 60px);
+  overflow: auto;
+}
+</style>
\ No newline at end of file