增加替换接口的参数

ui/packages/common/AiUserSelecter.vue

@@ -83,7 +83,9 @@
           <el-scrollbar class="AiWechatSelecter-list">
             <div class="user-wrapper">
               <el-checkbox-group v-model="userIds" @change="onCheckboxChange">
-                <el-checkbox v-for="item in list" :label="item[props.id]" :key="item[props.id]" @change="e => onboxChange(item[props.id], e)">{{ item.name }}</el-checkbox>
+                <el-checkbox v-for="item in list" :label="item[props.id]" :key="item[props.id]"
+                             @change="e => onboxChange(item[props.id], e)">{{ item.name }}
+                </el-checkbox>
               </el-checkbox-group>
             </div>
             <AiEmpty v-if="!list.length"></AiEmpty>
@@ -99,7 +101,9 @@
                 @size-change="getList"
                 @current-change="getList">
               <div class="paginationPre" v-if="isMultiple">
-                <el-checkbox :disabled="!list.length" :indeterminate="isIndeterminate" @change="onAllChange" v-model="isCheckAll">全选</el-checkbox>
+                <el-checkbox :disabled="!list.length" :indeterminate="isIndeterminate" @change="onAllChange"
+                             v-model="isCheckAll">全选
+                </el-checkbox>
               </div>
             </el-pagination>
           </el-scrollbar>
@@ -129,7 +133,7 @@
 </template>
 
 <script>
-  export default {
+export default {
   name: 'AiUserSelecter',
   model: {
     prop: 'value',
@@ -171,7 +175,8 @@
           id: 'id'
         }
       }
-      }
+    },
+    actions: {default: () => ({})}
   },
 
   data() {
@@ -204,33 +209,26 @@
   },
 
   computed: {
-      isHasOptionSlot () {
+    isHasOptionSlot() {
       return this.$slots.option
     },
 
-      isHasSlot () {
+    isHasSlot() {
       return this.$slots.default
     },
 
-      isIndeterminate () {
+    isIndeterminate() {
       const arr = this.chooseUser.filter(v => {
         return this.list.map(v => v.id).includes(v.id)
       })
-
+      this.isCheckAll = !!(arr.length === this.list.length && this.list.length);
-        if (arr.length === this.list.length && this.list.length) {
-          this.isCheckAll = true
-        } else {
-          this.isCheckAll = false
-        }
-
       return arr.length !== 0 && arr.length < this.list.length
     },
 
-      defaultChecked () {
+    defaultChecked() {
       if (!this.value) {
         return []
       }
-
       this.chooseUser = JSON.parse(JSON.stringify(this.value.map(item => {
         return {
           ...item,
@@ -242,15 +240,20 @@
       })))
 
       return this.value.map(v => v[this.props.id])
-      }
+    },
+    action: v => ({
+      tree: "/app/wxcp/wxdepartment/listAll",
+      users: `/app/wxcp/wxuser/list`,
+      ...v.actions
+    })
   },
 
   watch: {
-      unitName (val) {
+    unitName(val) {
       this.$refs.tree.filter(val)
     },
 
-      isShow (val) {
+    isShow(val) {
       if (val) {
         this.chooseUser = JSON.parse(JSON.stringify(this.value.map(item => {
           return {
@@ -266,14 +269,14 @@
     },
 
     disabledList: {
-        handler () {
+      handler() {
         this.getList()
       },
       deep: true
     }
   },
 
-    mounted () {
+  mounted() {
     this.getTree()
     this.getList()
 
@@ -302,12 +305,12 @@
   },
 
   methods: {
-      clearAll () {
+    clearAll() {
       this.userIds = []
       this.chooseUser = []
     },
 
-      onAllChange (e) {
+    onAllChange(e) {
       if (e) {
         if (!this.chooseUser.length) {
           this.chooseUser = [
@@ -329,13 +332,13 @@
       this.userIds = this.chooseUser.map(v => v[this.props.id])
     },
 
-      showSelecter () {
+    showSelecter() {
       if (this.disabled) return
 
       this.isShow = true
     },
 
-      onTreeChange (e) {
+    onTreeChange(e) {
       this.search.departmentId = e.id || ''
       this.search.current = 1
 
@@ -344,7 +347,7 @@
       })
     },
 
-      reset () {
+    reset() {
       this.isReeset = false
 
       this.$nextTick(() => {
@@ -352,7 +355,7 @@
       })
     },
 
-      onboxChange (id, v) {
+    onboxChange(id, v) {
       if (!this.isMultiple) {
         const checked = this.list.filter(v => v[this.props.id] === id)
         if (v) {
@@ -369,7 +372,7 @@
       }
     },
 
-      onCheckboxChange (ids) {
+    onCheckboxChange(ids) {
       this.$nextTick(() => {
         const checked = this.list.filter(v => ids.includes(v[this.props.id]))
         const unChecked = this.list.filter(v => !ids.includes(v[this.props.id]))
@@ -392,22 +395,16 @@
       })
     },
 
-      arrDeduplication (arr) {
+    arrDeduplication(arr) {
-        var hash = {}
+      const hash = {};
-        arr = arr.reduce(function(item, next) {
+      arr = arr.reduce(function (item, next) {
-          hash[next.id] ? '' : hash[next.id] = true && item.push(next)
+        hash[next.id] = hash[next.id] || item.push(next)
         return item
       }, [])
 
       return arr
     },
-
+    removeUser(index, item) {
-      onCheckChange (e, isChoosed, isSunChoosed) {
-        this.$nextTick(() => {
-        })
-      },
-
-      removeUser (index, item) {
       this.chooseUser.splice(index, 1)
       this.userIds.splice(this.userIds.findIndex(v => v === item.id), 1)
 
@@ -438,7 +435,7 @@
 
     getList() {
       this.loading = true
-        this.instance.post(`/app/wxcp/wxuser/list`, null, {
+      this.instance.post(this.action.users, null, {
         params: {
           ...this.search,
           departmentId: this.search.departmentId,
@@ -471,27 +468,20 @@
       })
     },
 
-      getTree () {
+    getTree() {
-        this.instance.post(`/app/wxcp/wxdepartment/listAll?unitName=${this.unitName}`).then(res => {
+      this.instance.post(this.action.tree, null, {
-          if (res.code === 0) {
+        params: {unitName: this.unitName}
-            let parent = res.data.map(v => {
+      }).then(res => {
-              v.label = v.name
+        if (res?.data) {
-              v.children = []
+          this.unitList = this.$arr2tree(res.data)
-
+          const defaultRoot = this.unitList.at(0)?.id
-              return v
+          this.defaultExpanded = [defaultRoot].filter(Boolean) || []
-            }).filter(e => !e.parentid)[0]
+          this.search.departmentId = defaultRoot
-
-            if (!this.defaultExpanded.length) {
-              this.defaultExpanded = [parent.id]
-            }
-            this.search.departmentId = parent.id
-            this.addChild(parent, res.data)
-            this.unitList = [parent]
         }
       })
     },
 
-      onClose (item, index) {
+    onClose(item, index) {
       this.chooseUser.splice(index, 1)
 
       this.userIds.splice(this.userIds.findIndex(v => v === item.id), 1)
@@ -506,7 +496,7 @@
       return data.name.indexOf(value) !== -1
     },
 
-      onConfirm () {
+    onConfirm() {
       if (!this.isMultiple && this.chooseUser.length > 1) {
         return this.$message.error('不能多选')
       }
@@ -524,11 +514,11 @@
       this.isShow = false
     }
   }
-  }
+}
 </script>
 
 <style lang="scss" scoped>
-  .AiWechatSelecter {
+.AiWechatSelecter {
   box-sizing: border-box;
 
   .AiWechatSelecter-userlist {
@@ -615,9 +605,9 @@
       }
     }
   }
-  }
+}
 
-  .AiWechatSelecter-container {
+.AiWechatSelecter-container {
   display: flex;
   height: 480px;
 
@@ -636,6 +626,7 @@
         margin-bottom: 0;
       }
     }
+
     img {
       width: 27px;
       height: 27px;
@@ -643,7 +634,7 @@
     }
   }
 
-    :deep( .el-tree ){
+  :deep( .el-tree ) {
     width: fit-content;
     min-width: 100%;
     background: transparent;
@@ -711,7 +702,7 @@
     cursor: pointer;
     user-select: none;
 
-      :deep( .el-checkbox__label ){
+    :deep( .el-checkbox__label ) {
       display: none;
     }
 
@@ -742,8 +733,8 @@
     height: calc(100% - 40px);
     padding: 8px 0;
 
-      :deep( .el-scrollbar__wrap ){
+    :deep( .el-scrollbar__wrap ) {
-        margin-bottom: 0!important;
+      margin-bottom: 0 !important;
       overflow-x: hidden;
     }
   }
@@ -751,7 +742,7 @@
   .AiWechatSelecter-container__left {
     flex: 1;
 
-      :deep( .el-scrollbar__wrap ){
+    :deep( .el-scrollbar__wrap ) {
       overflow-x: auto;
     }
   }
@@ -764,10 +755,10 @@
 
     .user-wrapper {
       position: relative;
-        padding-bottom: 40px!important;
+      padding-bottom: 40px !important;
     }
 
-      :deep( .el-pagination ){
+    :deep( .el-pagination ) {
       position: absolute;
       bottom: 0px;
       left: 0;
@@ -779,6 +770,7 @@
       justify-content: flex-end;
       background: #fcfcfc;
       padding: 10px 10px;
+
       .paginationPre {
         display: flex;
         align-items: center;
@@ -824,7 +816,7 @@
     .user-wrapper {
       padding: 0 10px;
 
-        :deep( .el-checkbox ){
+      :deep( .el-checkbox ) {
         display: block;
         margin-right: 0;
       }
@@ -839,6 +831,7 @@
       .tags-wrapper {
         padding: 0 8px;
       }
+
       .el-tag {
         margin: 0 8px 8px 0px;
         color: #222222;
@@ -896,5 +889,5 @@
       text-align: center;
     }
   }
-  }
+}
 </style>