席位管理

project/xbot/AppSeatManagement/AppSeatManagement.vue

@@ -1,224 +1,66 @@
 <template>
-  <section class="AppSeatManagement">
-    <ai-list>
-      <template slot="title">
-        <ai-title title="席位管理" isShowBottomBorder></ai-title>
-      </template>
-      <template #content>
-        <ai-search-bar>
-          <template #left>
-            <el-select v-model="configInfo.id" filterable placeholder="请选择机位" size="small" @change="configChange">
-              <el-option
-                v-for="item in configList"
-                :key="item.value"
-                :label="item.label"
-                :value="item.value">
-              </el-option>
-            </el-select>
-            <span class="tips">当前机位1有效期为：{{configInfo.validity}}&nbsp;&nbsp;&nbsp;&nbsp;ip地址为：{{configInfo.xbotIp}}</span>
-          </template>
-          <template #right>
-            <el-button size="small" :type="configInfo.status != 1 ? 'info' : 'primary'" @click="openWechat()" :disabled="configInfo.status != 1">{{configInfo.status != 1 ? '已启动' : '启动'}}</el-button>
-          </template>
-        </ai-search-bar>
-        <ai-table :tableData="tableData" :total="total" :current.sync="search.current" :size.sync="search.size"
-                  @getList="getTableData()" :col-configs="colConfigs">
-          <el-table-column slot="groupCount" label="监控群聊"  align="center">
-            <template slot-scope="{ row }">
-              <div @click="showDialog(row)" style="cursor: pointer;color:#26f">{{row.groupCount}}</div>
-            </template>
-          </el-table-column>
-        </ai-table>
-      </template>
-    </ai-list>
-    <ai-dialog
-      title="监控群聊"
-      :visible.sync="dialog"
-      :destroyOnClose="true"
-      width="720px"
-      :customFooter="true">
-        <ai-table :tableData="tableDataGroup" :isShowPagination="false"
-          @getList="getTableDataGroup()" :col-configs="colConfigsGroup">
-          <el-table-column slot="avatar" label="群聊头像"  align="left">
-            <template slot-scope="{ row }">
-              <img :src="row.avatar" alt="" class="group-avatar">
-            </template>
-          </el-table-column>
-        </ai-table>
-        <div class="dialog-footer" slot="footer">
-          <el-button @click="dialog=false">关闭</el-button>
-        </div>
-    </ai-dialog>
-  </section>
-
+  <div class="AppSeatManagement">
+    <keep-alive :include="['List']">
+      <component
+        ref="component"
+        :is="component"
+        @change="onChange"
+        :params="params"
+        :instance="instance"
+        :dict="dict"
+      ></component>
+    </keep-alive>
+  </div>
 </template>
 
 <script>
-import { mapState } from "vuex";
+import List from "./components/List";
+import GroupList from "./components/GroupList";
+
 export default {
   name: "AppSeatManagement",
-  label: '席位管理',
+  label: "席位管理",
   props: {
     instance: Function,
     dict: Object,
-    permissions: Function,
-    menuName:String
   },
   data() {
     return {
-      search: {
-        current: 1,
-        size: 10,
-      },
-      tableData: [],
-      total: 0,
-      dialog: false,
-      configList: [],
-      configId: '',
-      configInfo: {id: ''},
-      groupInfo: {},
-      searchGroup: {
-        current: 1,
-        size: 10,
-      },
-      tableDataGroup: [],
-      totalGroup: 0,
-    }
+      component: "List",
+      params: {},
+      include: [],
+
+    };
   },
-  created() {
-    this.dict.load('yesOrNo').then(() => {
-      this.getConfigList()
-    })
-  },
-  computed: {
-    ...mapState(['user']),
-    colConfigs() {
-      return [
-        { slot: "loginUserId", label: '用户id'},
-        { prop: "loginUserName", label: '姓名', align: "left"},
-        { prop: "phone", label: '手机号'},
-        { prop: "girdNames", label: '管辖区域'},
-        { slot: "groupCount", label: '监控群聊'},
-        // { prop: "status", label: '状态'},
-      ]
-    },
-    colConfigsGroup() {
-      return [
-        { slot: "avatar", label: '群聊头像'},
-        { prop: "nickname", label: '群聊名称', align: 'center'},
-        { prop: "is_manager", label: '是否管理员', dict: 'yesOrNo', align: 'center'},
-        { prop: "num", label: '群聊成员（人数）', align: 'center'},
-        // { prop: "phone", label: '群主'},
-      ]
-    },
+  components: {
+    GroupList,
+    List,
   },
   methods: {
-    getConfigList() {
-      this.instance.post(`/app/appxbotconfig/list?size=1000`).then(res => {
-        if(res?.data) {
-          res.data.records.map((item) => {
-            item.label = item.xbotName
-            item.value = item.id
-          })
-          this.configList = res.data.records
-          this.configInfo = this.configList[0]
-          this.getTableData()
-        }
-      })
-    },
-    configChange(e) {
-      this.configInfo = this.configList.filter(item => item.id == e)[0]
-      this.search.current = 1
-      this.getTableData()
-    },
-    openWechat() {
-      this.instance.post(`/app/appxbotconfig/openWechat?id=${this.configInfo.id}`).then(res => {
-        if(res.code === 0) {
-          this.configInfo.status = 0
-          this.$message.success('启动成功!')
-        }
-      })
-    },
-    getTableData() {
-      this.instance.post(`/app/xbotCallback/list`,null,{
-        params: {
-          ...this.search,
-          xbotId: this.configInfo.id
-        }
-      }).then(res => {
-        if(res?.data) {
-          this.tableData = res.data.records
-          this.total = res.data.total
-        }
-      })
-    },
-    showDialog(row) {
-      this.dialog = true
-      this.groupInfo = row
-      this.getTableDataGroup()
-    },
-    getTableDataGroup() {
-      this.instance.post(`/app/xbotCallback/groupList`,null,{
-        params: {
-          // ...this.searchGroup,
-          current: 1,
-          managerWxid: this.groupInfo.loginUserId
-        }
-      }).then(res => {
-        if(res?.data) {
-          this.tableDataGroup = JSON.parse(res.data)
-          this.tableDataGroup.map((item) => {
-            item.num = item.member_list.length
-          })
-          // this.totalGroup = res.data.total
-        }
-      })
-      
+    onChange(data) {
+      if (data.type === "GroupList") {
+        this.component = "GroupList";
+        this.params = data.params;
+      }
+      if (data.type === "List") {
+        this.component = "List";
+        this.params = data.params;
+
+        this.$nextTick(() => {
+          if (data.isRefresh) {
+            this.$refs.component.getTableData();
+          }
+        });
+      }
     },
   },
-}
+};
 </script>
 
-<style lang="scss" scoped>
+<style lang="scss">
 .AppSeatManagement {
   height: 100%;
-
-  .time-select {
-    padding: 0 16px;
-    height: 32px;
-    line-height: 32px;
-    border: 1px solid #d0d4dc;
-    border-radius: 4px;
-    display: flex;
-    justify-content: space-between;
-    cursor: pointer;
-    .el-icon-arrow-down {
-      line-height: 32px;
-    }
-  }
-
-  :deep .is-error {
-    .time-select {
-      border: 1px solid #f46!important;
-    }
-  }
-  .tips {
-    display: inline-block;
-    color: #999;
-    font-size: 14px;
-    margin-left: 16px;
-  }
-  .group-avatar {
-    width: 50px;
-    height: 50px;
-    border-radius: 50%;
-  }
-  :deep .ai-dialog__content--wrapper {
-    // height: 1000px;
-    // overflow-y: scroll;
-    .ai-table {
-      // height: 1000px;
-    }
-  }
+  background: #f3f6f9;
+  overflow: auto;
 }
 </style>

project/xbot/AppSeatManagement/components/GroupList.vue

@@ -0,0 +1,243 @@
+<template>
+  <section class="GroupList">
+    <ai-list>
+      <template slot="title">
+        <ai-title title="群匹配" isShowBottomBorder isShowBack @onBackClick="cancel(false)"></ai-title>
+      </template>
+      <template #content>
+        <ai-search-bar>
+          <template #left>
+            <ai-select v-model="search.matchStatus" :selectList="dict.getDict('xbotGroupMatchStatus')" placeholder="请选择是否匹配" @change="search.current = 1, getTableData()"/>
+            <ai-select v-model="search.status" :selectList="dict.getDict('xbotGroupStatus')" placeholder="请选择群状态" @change="search.current = 1, getTableData()"/>
+            <el-button type="primary" @click="match">自动匹配</el-button>
+          </template>
+          <template #right>
+            <el-input
+              v-model="search.nickname"
+              size="small"
+              placeholder="群名称"
+              clearable
+              v-throttle="() => {search.current = 1, getTableData()}"
+              @clear="search.current = 1, search.nickname = '', getTableData()"
+              suffix-icon="iconfont iconSearch">
+            </el-input>
+          </template>
+        </ai-search-bar>
+        <ai-table :tableData="tableData" :total="total" :current.sync="search.current" :size.sync="search.size"
+                  @getList="getTableData()" :col-configs="colConfigs">
+          <el-table-column slot="avatar" label="群聊头像"  align="left">
+            <template slot-scope="{ row }">
+              <img :src="row.avatar" alt="" class="group-avatar">
+            </template>
+          </el-table-column>
+          <el-table-column slot="option" label="操作"  align="center">
+            <template slot-scope="{ row }">
+              <div class="table-options">
+                <el-button type="text" @click="edit(row)">编辑</el-button>
+              </div>
+            </template>
+          </el-table-column>
+        </ai-table>
+      </template>
+    </ai-list>
+    <ai-dialog
+      :visible.sync="dialog"
+      width="800px"
+      @close="dialog=false"
+      title="事件指派"
+      @onConfirm="onConfirm">
+      <el-form class="ai-form" label-width="120px" :model="editInfo" ref="editInfo">
+        <el-form-item label="群名称" style="width: 100%;">
+          <div>{{editInfo.nickname}}</div>
+        </el-form-item>
+        <el-form-item label="群主ID" style="width: 100%;">
+          <div>{{editInfo.managerWxid}}</div>
+        </el-form-item>
+        <el-form-item label="人员关联" prop="managerTpUserName" style="width: 100%;" :rules="[{ required: true, message: '请选择人员' }]">
+          <el-input disabled size="small" v-model="editInfo.managerTpUserName" clearable placeholder="请选择人员">
+            <template slot="append">
+              <ai-user-selecter refs="addTags" :isMultiple="false" :instance="instance" v-model="editInfo.user" @change="onChooseUser">
+                <el-button size="small">选择人员</el-button>
+              </ai-user-selecter>
+            </template>
+          </el-input>
+        </el-form-item>
+      </el-form>
+    </ai-dialog>
+  </section>
+
+</template>
+
+<script>
+import { mapState } from "vuex";
+export default {
+  name: "GroupList",
+  props: {
+    instance: Function,
+    dict: Object,
+    params: Object
+  },
+  data() {
+    return {
+      search: {
+        current: 1,
+        size: 10,
+        matchStatus: '',
+        status: '',
+        nickname: ''
+      },
+      tableData: [],
+      total: 0,
+      dialog: false,
+      editInfo: {}
+    }
+  },
+  created() {
+    this.dict.load('xbotGroupMatchStatus', 'xbotGroupStatus').then(() => {
+      this.getTableData()
+    })
+  },
+  computed: {
+    ...mapState(['user']),
+    colConfigs() {
+      return [
+       { slot: "avatar", label: '群聊头像'},
+        { prop: "nickname", label: '群名称', align: 'center'},
+        { prop: "managerNickname", label: '群主昵称', align: 'center'},
+        { prop: "xbotGroupStatus", label: '群状态', align: 'center', dict: 'xbotGroupStatus'},
+        { prop: "managerTpUserName", label: '关联人员', align: 'center'},
+        { prop: "managerTpUserDeptName", label: '主部门', align: 'center'},
+        { slot: "option"},
+        // { prop: "status", label: '状态'},
+      ]
+    },
+  },
+  methods: {
+    getTableData() {
+      this.instance.post(`/app/xbotCallback/groupMatchList`,null,{
+        params: {
+          ...this.search,
+          managerWxid: this.params.loginUserId
+        }
+      }).then(res => {
+        if(res?.data) {
+          this.tableData = res.data.records
+          this.total = res.data.total
+        }
+      })
+    },
+    showDialog(row) {
+      this.dialog = true
+      this.groupInfo = row
+      this.getTableDataGroup()
+    },
+    getTableDataGroup() {
+      this.instance.post(`/app/xbotCallback/groupList`,null,{
+        params: {
+          // ...this.searchGroup,
+          current: 1,
+          managerWxid: this.groupInfo.loginUserId
+        }
+      }).then(res => {
+        if(res?.data) {
+          this.tableDataGroup = JSON.parse(res.data)
+          this.tableDataGroup.map((item) => {
+            item.num = item.member_list.length
+          })
+          // this.totalGroup = res.data.total
+        }
+      })
+    },
+    cancel(isRefresh) {
+      this.$emit('change', {
+        type: 'List',
+        isRefresh: !!isRefresh
+      })
+    },
+    match() {
+      this.instance.post(`/app/xbotCallback/automaticMatch`,null,{
+        params: {
+          managerWxid: this.params.loginUserId
+        }
+      }).then(res => {
+        if(res.code == 0) {
+          this.$message.success('匹配成功!')
+          this.getTableData()
+        }
+      })
+    },
+    edit(row) {
+      this.dialog = true
+      this.editInfo = {...row}
+      this.editInfo.user = [{id: row.managerTpwxid, name: row.managerTpUserName}]
+    },
+    onChooseUser(v) {
+      this.editInfo.wxUserId = v[0].id
+      this.editInfo.managerTpUserName = v[0].name
+      this.editInfo.user = v
+    },
+    onConfirm() {
+      this.$refs.editInfo.validate(v => {
+        if (v) {
+          this.instance.post('/app/xbotCallback/manualMatch', null, {
+            params: {
+              wxUserId: this.editInfo.wxUserId,
+              wxid: this.editInfo.wxid
+            }
+          }).then(res => {
+            if (res?.code == 0) {
+              this.dialog = false
+              this.getTableData()
+              this.$message.success('编辑成功!')
+            }
+          })
+        }
+      })
+    }
+  },
+}
+</script>
+
+<style lang="scss" scoped>
+.GroupList {
+  height: 100%;
+
+  .time-select {
+    padding: 0 16px;
+    height: 32px;
+    line-height: 32px;
+    border: 1px solid #d0d4dc;
+    border-radius: 4px;
+    display: flex;
+    justify-content: space-between;
+    cursor: pointer;
+    .el-icon-arrow-down {
+      line-height: 32px;
+    }
+  }
+
+  :deep .is-error {
+    .time-select {
+      border: 1px solid #f46!important;
+    }
+  }
+  .tips {
+    display: inline-block;
+    color: #999;
+    font-size: 14px;
+    margin-left: 16px;
+  }
+  .group-avatar {
+    width: 50px;
+    height: 50px;
+    border-radius: 50%;
+  }
+  :deep .ai-dialog__content--wrapper {
+    // height: 1000px;
+    // overflow-y: scroll;
+    .ai-table {
+      // height: 1000px;
+    }
+  }
+}
+</style>

project/xbot/AppSeatManagement/components/List.vue

@@ -0,0 +1,243 @@
+<template>
+  <section class="List">
+    <ai-list>
+      <template slot="title">
+        <ai-title title="席位管理" isShowBottomBorder></ai-title>
+      </template>
+      <template #content>
+        <ai-search-bar>
+          <template #left>
+            <el-select v-model="configInfo.id" filterable placeholder="请选择机位" size="small" @change="configChange">
+              <el-option
+                v-for="item in configList"
+                :key="item.value"
+                :label="item.label"
+                :value="item.value">
+              </el-option>
+            </el-select>
+            <span class="tips">当前机位1有效期为：{{configInfo.validity}}&nbsp;&nbsp;&nbsp;&nbsp;ip地址为：{{configInfo.xbotIp}}</span>
+          </template>
+          <template #right>
+            <el-button size="small" :type="configInfo.status != 1 ? 'info' : 'primary'" @click="openWechat()" :disabled="configInfo.status != 1">{{configInfo.status != 1 ? '已启动' : '启动'}}</el-button>
+          </template>
+        </ai-search-bar>
+        <ai-table :tableData="tableData" :total="total" :current.sync="search.current" :size.sync="search.size"
+                  @getList="getTableData()" :col-configs="colConfigs">
+          <el-table-column slot="avatar" label="头像 "  align="left" width="200">
+            <template slot-scope="{ row }">
+              <img :src="row.avatar" alt="" class="group-avatar">
+            </template>
+          </el-table-column>
+          <el-table-column slot="groupCount" label="监控群聊"  align="center">
+            <template slot-scope="{ row }">
+              <div @click="showDialog(row)" style="cursor: pointer;color:#26f">{{row.groupCount}}</div>
+            </template>
+          </el-table-column>
+          <el-table-column slot="num" label="群匹配"  align="center">
+            <template slot-scope="{ row }">
+              <div>{{row.matchGroupCount}}/{{row.groupCount}}</div>
+            </template>
+          </el-table-column>
+          <el-table-column slot="options" label="操作"  align="center">
+            <template slot-scope="{ row }">
+              <el-button type="text" @click="toGroup(row)">群匹配</el-button>
+            </template>
+          </el-table-column>
+        </ai-table>
+      </template>
+    </ai-list>
+    <ai-dialog
+      title="监控群聊"
+      :visible.sync="dialog"
+      :destroyOnClose="true"
+      width="720px"
+      :customFooter="true">
+        <ai-table :tableData="tableDataGroup" :isShowPagination="false"
+          @getList="getTableDataGroup()" :col-configs="colConfigsGroup">
+          <el-table-column slot="avatar" label="群聊头像"  align="left">
+            <template slot-scope="{ row }">
+              <img :src="row.avatar" alt="" class="group-avatar">
+            </template>
+          </el-table-column>
+        </ai-table>
+        <div class="dialog-footer" slot="footer">
+          <el-button @click="dialog=false">关闭</el-button>
+        </div>
+    </ai-dialog>
+  </section>
+
+</template>
+
+<script>
+import { mapState } from "vuex";
+export default {
+  name: "List",
+  props: {
+    instance: Function,
+    dict: Object
+  },
+  data() {
+    return {
+      search: {
+        current: 1,
+        size: 10,
+      },
+      tableData: [],
+      total: 0,
+      dialog: false,
+      configList: [],
+      configId: '',
+      configInfo: {id: ''},
+      groupInfo: {},
+      searchGroup: {
+        current: 1,
+        size: 10,
+      },
+      tableDataGroup: [],
+      totalGroup: 0,
+    }
+  },
+  created() {
+    this.dict.load('yesOrNo').then(() => {
+      this.getConfigList()
+    })
+  },
+  computed: {
+    ...mapState(['user']),
+    colConfigs() {
+      return [
+        { slot: "avatar"},
+        { slot: "loginUserId", label: '用户id'},
+        { prop: "loginUserName", label: '姓名', align: "left"},
+        { prop: "phone", label: '手机号'},
+        // { prop: "girdNames", label: '管辖区域'},
+        { slot: "groupCount", label: '监控群聊'},
+        { slot: "num", label: '群匹配'},
+        { slot: "option"},
+      ]
+    },
+    colConfigsGroup() {
+      return [
+        { slot: "avatar", label: '群聊头像'},
+        { prop: "nickname", label: '群聊名称', align: 'center'},
+        { prop: "is_manager", label: '是否管理员', dict: 'yesOrNo', align: 'center'},
+        { prop: "num", label: '群聊成员（人数）', align: 'center'},
+        // { prop: "phone", label: '群主'},
+      ]
+    },
+  },
+  methods: {
+    getConfigList() {
+      this.instance.post(`/app/appxbotconfig/list?size=1000`).then(res => {
+        if(res?.data) {
+          res.data.records.map((item) => {
+            item.label = item.xbotName
+            item.value = item.id
+          })
+          this.configList = res.data.records
+          this.configInfo = this.configList[0]
+          this.getTableData()
+        }
+      })
+    },
+    configChange(e) {
+      this.configInfo = this.configList.filter(item => item.id == e)[0]
+      this.search.current = 1
+      this.getTableData()
+    },
+    openWechat() {
+      this.instance.post(`/app/appxbotconfig/openWechat?id=${this.configInfo.id}`).then(res => {
+        if(res.code === 0) {
+          this.configInfo.status = 0
+          this.$message.success('启动成功!')
+        }
+      })
+    },
+    getTableData() {
+      this.instance.post(`/app/xbotCallback/list`,null,{
+        params: {
+          ...this.search,
+          xbotId: this.configInfo.id
+        }
+      }).then(res => {
+        if(res?.data) {
+          this.tableData = res.data.records
+          this.total = res.data.total
+        }
+      })
+    },
+    showDialog(row) {
+      this.dialog = true
+      this.groupInfo = row
+      this.getTableDataGroup()
+    },
+    getTableDataGroup() {
+      this.instance.post(`/app/xbotCallback/groupList`,null,{
+        params: {
+          // ...this.searchGroup,
+          current: 1,
+          managerWxid: this.groupInfo.loginUserId
+        }
+      }).then(res => {
+        if(res?.data) {
+          this.tableDataGroup = JSON.parse(res.data)
+          this.tableDataGroup.map((item) => {
+            item.num = item.member_list.length
+          })
+          // this.totalGroup = res.data.total
+        }
+      })
+    },
+    toGroup(row) {
+      this.$emit('change', {
+        type: 'GroupList',
+        params:row
+      })
+    }
+  },
+}
+</script>
+
+<style lang="scss" scoped>
+.List {
+  height: 100%;
+
+  .time-select {
+    padding: 0 16px;
+    height: 32px;
+    line-height: 32px;
+    border: 1px solid #d0d4dc;
+    border-radius: 4px;
+    display: flex;
+    justify-content: space-between;
+    cursor: pointer;
+    .el-icon-arrow-down {
+      line-height: 32px;
+    }
+  }
+
+  :deep .is-error {
+    .time-select {
+      border: 1px solid #f46!important;
+    }
+  }
+  .tips {
+    display: inline-block;
+    color: #999;
+    font-size: 14px;
+    margin-left: 16px;
+  }
+  .group-avatar {
+    width: 50px;
+    height: 50px;
+    border-radius: 50%;
+  }
+  :deep .ai-dialog__content--wrapper {
+    // height: 1000px;
+    // overflow-y: scroll;
+    .ai-table {
+      // height: 1000px;
+    }
+  }
+}
+</style>

project/xbot/AppWorkOrder/components/Detail.vue

@@ -129,7 +129,7 @@
           :visible.sync="isShowEdit"
           width="800px"
           @close="onCloseEdit"
-          title="编辑工单信息"
+          title="编辑事件"
           @onConfirm="onConfirmEdit">
         <el-form class="ai-form" label-width="120px" :model="editInfo" ref="editInfo">
           <el-form-item label="事件描述" prop="content" style="width: 100%;" :rules="[{ required: true, message: '请输入事件描述' }]">