JeecgBoot低代码平台 2.4.5 版本发布，钉钉与企业微信集成版本

ant-design-vue-jeecg/src/components/jeecgbiz/modal/JSelectUserByDepModal.vue

@@ -56,8 +56,9 @@
 </template>
 
 <script>
-  import {filterObj} from '@/utils/util'
+  import { pushIfNotExist, filterObj } from '@/utils/util'
   import {queryDepartTreeList, getUserList, queryUserByDepId} from '@/api/api'
+  import { getAction } from '@/api/manage'
 
   export default {
     name: 'JSelectUserByDepModal',
@@ -106,6 +107,7 @@
         ],
         scrollTrigger: {},
         dataSource: [],
+        selectionRows: [],
         selectedRowKeys: [],
         selectUserRows: [],
         selectUserIds: [],
@@ -163,11 +165,13 @@
             pageSize: values.length
           }).then((res) => {
             if (res.success) {
+              this.selectionRows = []
               let selectedRowKeys = []
               let realNames = []
               res.result.records.forEach(user => {
                 realNames.push(user['realname'])
                 selectedRowKeys.push(user['id'])
+                this.selectionRows.push(user)
               })
               this.selectedRowKeys = selectedRowKeys
               this.$emit('initComp', realNames.join(','))
@@ -182,20 +186,16 @@
         if (arg === 1) {
           this.ipagination.current = 1;
         }
-        if (this.selectedDepIds && this.selectedDepIds.length > 0) {
-          await this.initQueryUserByDepId(this.selectedDepIds)
-        } else {
-          this.loading = true
-          let params = this.getQueryParams()//查询条件
-          await getUserList(params).then((res) => {
-            if (res.success) {
-              this.dataSource = res.result.records
-              this.ipagination.total = res.result.total
-            }
-          }).finally(() => {
-            this.loading = false
-          })
-        }
+        let params = this.getQueryParams()//查询条件
+        this.loading = true
+        getAction('/sys/user/queryUserComponentData', params).then(res=>{
+          if (res.success) {
+            this.dataSource = res.result.records
+            this.ipagination.total = res.result.total
+          }
+        }).finally(() => {
+          this.loading = false
+        })
       },
       // 触发屏幕自适应
       resetScreenSize() {
@@ -218,6 +218,7 @@
         param.field = this.getQueryField();
         param.pageNo = this.ipagination.current;
         param.pageSize = this.ipagination.pageSize;
+        param.departId = this.selectedDepIds.join(',')
         return filterObj(param);
       },
       getQueryField() {
@@ -229,13 +230,13 @@
       },
       searchReset(num) {
         let that = this;
+        that.selectedRowKeys = [];
+        that.selectUserIds = [];
+        that.selectedDepIds = [];
         if (num !== 0) {
           that.queryParam = {};
           that.loadData(1);
         }
-        that.selectedRowKeys = [];
-        that.selectUserIds = [];
-        that.selectedDepIds = [];
       },
       close() {
         this.searchReset(0);
@@ -258,30 +259,27 @@
         that.close();
       },
       //获取选择用户信息
-      getSelectUserRows(rowId) {
-        let dataSource = this.dataSource;
-        let userIds = "";
-        this.selectUserRows = [];
-        for (let i = 0, len = dataSource.length; i < len; i++) {
-          if (this.selectedRowKeys.includes(dataSource[i].id)) {
-            this.selectUserRows.push(dataSource[i]);
-            userIds = userIds + "," + dataSource[i].username
+      getSelectUserRows() {
+        this.selectUserRows = []
+        for (let row of this.selectionRows) {
+          if (this.selectedRowKeys.includes(row.id)) {
+            this.selectUserRows.push(row)
           }
         }
-        this.selectUserIds = userIds.substring(1);
+        this.selectUserIds = this.selectUserRows.map(row => row.username).join(',')
       },
       // 点击树节点,筛选出对应的用户
       onDepSelect(selectedDepIds) {
         if (selectedDepIds[0] != null) {
-          this.initQueryUserByDepId(selectedDepIds); // 调用方法根据选选择的id查询用户信息
           if (this.selectedDepIds[0] !== selectedDepIds[0]) {
             this.selectedDepIds = [selectedDepIds[0]];
           }
+          this.loadData(1);
         }
       },
       onSelectChange(selectedRowKeys, selectionRows) {
         this.selectedRowKeys = selectedRowKeys;
-        this.selectionRows = selectionRows;
+        selectionRows.forEach(row => pushIfNotExist(this.selectionRows, row, 'id'))
       },
       onSearch() {
         this.loadData(1);

ant-design-vue-jeecg/src/components/jeecgbiz/thirdApp/JThirdAppButton.vue

@@ -0,0 +1,214 @@
+<template>
+  <span v-if="syncToApp || syncToLocal">
+    <j-third-app-dropdown v-if="enabledTypes.wechatEnterprise" type="wechatEnterprise" name="企微" v-bind="bindAttrs" v-on="bindEvents"/>
+    <j-third-app-dropdown v-if="enabledTypes.dingtalk" type="dingtalk" name="钉钉" v-bind="bindAttrs" v-on="bindEvents"/>
+  </span>
+  <span v-else>未设置任何同步方向</span>
+</template>
+
+<script>
+import { getAction } from '@/api/manage'
+import { cloneObject } from '@/utils/util'
+import JThirdAppDropdown from './JThirdAppDropdown'
+
+const backEndUrl = {
+  // 获取启用的第三方App
+  getEnabledType: '/sys/thirdApp/getEnabledType',
+  // 企业微信
+  wechatEnterprise: {
+    user: '/sys/thirdApp/sync/wechatEnterprise/user',
+    depart: '/sys/thirdApp/sync/wechatEnterprise/depart',
+  },
+  // 钉钉
+  dingtalk: {
+    user: '/sys/thirdApp/sync/dingtalk/user',
+    depart: '/sys/thirdApp/sync/dingtalk/depart',
+  }
+}
+
+export default {
+  name: 'JThirdAppButton',
+  components: {JThirdAppDropdown},
+  props: {
+    // 同步类型，可以是 user、depart
+    bizType: {
+      type: String,
+      required: true,
+    },
+    // 是否允许同步到第三方APP
+    syncToApp: Boolean,
+    // 是否允许第三方APP同步到本地
+    syncToLocal: Boolean,
+    // 选择的行
+    selectedRowKeys: Array,
+  },
+  data() {
+    return {
+      enabledTypes: {},
+      attrs: {
+        dingtalk: {},
+      },
+    }
+  },
+  computed: {
+    bindAttrs() {
+      return {
+        syncToApp: this.syncToApp,
+        syncToLocal: this.syncToLocal
+      }
+    },
+    bindEvents() {
+      return {
+        'to-app': this.onToApp,
+        'to-local': this.onToLocal,
+      }
+    },
+  },
+  created() {
+    this.loadEnabledTypes()
+  },
+  methods: {
+    handleMenuClick() {
+      console.log(arguments)
+    },
+    onToApp(e) {
+      this.doSync(e.type, '/toApp')
+    },
+    onToLocal(e) {
+      this.doSync(e.type, '/toLocal')
+    },
+    // 获取启用的第三方App
+    async loadEnabledTypes() {
+      this.enabledTypes = await loadEnabledTypes()
+    },
+    // 开始同步第三方App
+    doSync(type, direction) {
+      let urls = backEndUrl[type]
+      if (!(urls && urls[this.bizType])) {
+        console.warn('配置出错')
+        return
+      }
+      let url = urls[this.bizType] + direction
+
+      let selectedRowKeys = this.selectedRowKeys
+      let content = '确定要开始同步全部数据吗？可能花费较长时间！'
+      if (Array.isArray(selectedRowKeys) && selectedRowKeys.length > 0) {
+        content = `确定要开始同步这 ${selectedRowKeys.length} 项吗？`
+      } else {
+        selectedRowKeys = []
+      }
+      return new Promise((resolve, reject) => {
+        let model = this.$confirm({
+          title: '同步',
+          content,
+          onOk: () => {
+            model.update({
+              keyboard: false,
+              okText: '同步中…',
+              cancelButtonProps: {props: {disabled: true}}
+            })
+            return getAction(url, {
+              ids: selectedRowKeys.join(',')
+            }).then(res => {
+              let options = null
+              if (res.result) {
+                options = {
+                  width: 600,
+                  title: res.message,
+                  content: (h) => {
+                    let nodes
+                    let successInfo = [
+                      `成功信息如下：`,
+                      this.renderTextarea(h, res.result.successInfo.map((v, i) => `${i + 1}. ${v}`).join('\n')),
+                    ]
+                    if (res.success) {
+                      nodes = [
+                        ...successInfo,
+                        h('br'),
+                        `无失败信息！`,
+                      ]
+                    } else {
+                      nodes = [
+                        `失败信息如下：`,
+                        this.renderTextarea(h, res.result.failInfo.map((v, i) => `${i + 1}. ${v}`).join('\n')),
+                        h('br'),
+                        ...successInfo,
+                      ]
+                    }
+                    return nodes
+                  }
+                }
+              }
+              if (res.success) {
+                if (options != null) {
+                  this.$success(options)
+                } else {
+                  this.$message.success(res.message)
+                }
+                this.$emit('sync-ok')
+              } else {
+                if (options != null) {
+                  this.$warning(options)
+                } else {
+                  this.$message.warning(res.message)
+                }
+                this.$emit('sync-error')
+              }
+            }).catch(() => model.destroy()).finally(() => {
+              resolve()
+              this.$emit('sync-finally', {
+                type,
+                direction,
+                isToApp: direction === '/toApp',
+                isToLocal: direction === '/toLocal',
+              })
+            })
+          },
+          onCancel() {
+            resolve()
+          },
+        })
+      })
+    },
+    renderTextarea(h, value) {
+      return h('a-textarea', {
+        props: {
+          value: value,
+          readOnly: true,
+          autosize: {minRows: 5, maxRows: 10},
+        },
+        style: {
+          // 关闭textarea的自动换行，使其可以左右滚动
+          whiteSpace: 'pre',
+          overflow: 'auto',
+        }
+      })
+    }
+  },
+}
+
+// 启用了哪些第三方App（在此缓存）
+let enabledTypes = null
+
+// 获取启用的第三方App
+export async function loadEnabledTypes() {
+  // 获取缓存
+  if (enabledTypes != null) {
+    return cloneObject(enabledTypes)
+  } else {
+    let {success, result} = await getAction(backEndUrl.getEnabledType)
+    if (success) {
+      // 在此缓存
+      enabledTypes = cloneObject(result)
+      return result
+    } else {
+      console.warn('getEnabledType查询失败：', res)
+    }
+  }
+  return {}
+}
+</script>
+
+<style scoped>
+
+</style>

ant-design-vue-jeecg/src/components/jeecgbiz/thirdApp/JThirdAppDropdown.vue

@@ -0,0 +1,34 @@
+<template>
+  <a-dropdown v-if="syncToApp && syncToLocal">
+    <a-button type="primary" icon="sync">同步{{name}}</a-button>
+    <a-menu slot="overlay" @click="handleMenuClick">
+      <a-menu-item v-if="syncToApp" key="to-app">同步到{{name}}</a-menu-item>
+      <a-menu-item v-if="syncToLocal" key="to-local">同步到本地</a-menu-item>
+    </a-menu>
+  </a-dropdown>
+  <a-button v-else-if="syncToApp" type="primary" icon="sync" @click="handleMenuClick({key:'to-app'})">同步{{name}}</a-button>
+  <a-button v-else type="primary" icon="sync" @click="handleMenuClick({key:'to-local'})">同步{{name}}到本地</a-button>
+</template>
+
+<script>
+
+/* JThirdAppButton 的子组件，不可单独使用 */
+export default {
+  name: 'JThirdAppDropdown',
+  props: {
+    type: String,
+    name: String,
+    syncToApp: Boolean,
+    syncToLocal: Boolean,
+  },
+  methods: {
+    handleMenuClick(event) {
+      this.$emit(event.key, {type: this.type})
+    },
+  },
+}
+</script>
+
+<style scoped>
+
+</style>