feat: 系统消息 - 支持导出

project/src/components/assembly/screen/chatGroupOptions.vue

@@ -258,6 +258,26 @@ export default {
 
       this.dialogVisible = false
     },
+
+    // 详情 => 回显群聊名称
+    async handleSetChatGroupsName(chat_groups) {
+      try {
+        const { data: res = {} } = await this.$axios.get(this.URL.BASEURL + this.URL.groupCode_chatGroupList, {
+          params: { keyword: '', owner: '' }
+        })
+        if (res && res.errno == 0 && Array.isArray(res.rst)) {
+          chat_groups.forEach((item, idx) => {
+            const isFound = res.rst.find(chat => chat.chat_id === item.chat_id)
+            if (isFound) chat_groups[idx].name = isFound.name
+          })
+          return Promise.resolve([...chat_groups])
+        } else {
+          return Promise.resolve([...chat_groups])
+        }
+      } catch (error) {
+        return Promise.resolve([...chat_groups])
+      }
+    },
   },
 };
 </script>

project/src/components/groupTransfer/configDrawer.vue

@@ -35,7 +35,7 @@
 
         <div v-show="form.filter_type == 1" class="form-item">
           <span class="lable required">群聊</span>
-          <selfChatGroupOptions v-if="isShowService" ref="chatGroupOptionsMain" width="300px" :isHasRoomId="true" :chatListResult="form.chat_ids" @change="onChangeGlobalChatGroup" />
+          <selfChatGroupOptions v-if="isShowService" ref="selfChatGroupOptions" width="300px" :isHasRoomId="true" :chatListResult="form.chat_ids" @change="onChangeGlobalChatGroup" />
         </div>
 
         <div v-show="form.filter_type == 2" class="form-item">
@@ -157,19 +157,21 @@ export default {
           this.form.title = title
           this.form.type = type || 1
           this.form.filter_type = filter_type || 1
-          if (this.form.filter_type == 1) {
-            this.form.chat_ids = JSON.parse(condition).chat_ids.map(c => ({ chat_id: c, name: '' }))
-            // 回显"群聊"数据
-            this.handleSetChatGroups(this.form.chat_ids)
-          } else if (this.form.filter_type == 2) {
-            this.form.old_owners = JSON.parse(condition).owner_list
-          }
           this.form.new_owner = new_owner
           this.form.transfer_type = transfer_type || 1
           if (this.form.transfer_type == 2) {
             this.form.transfer_at = transfer_at
           }
+          if (this.form.filter_type == 2) {
+            this.form.old_owners = JSON.parse(condition).owner_list
+          }
+          if (this.form.filter_type == 1) {
+            // 回显"群聊"数据
+            this.form.chat_ids = JSON.parse(condition).chat_ids.map(c => ({ chat_id: c, name: '' }))
+          }
           this.isShowService = true
+          await this.$nextTick()
+          this.form.chat_ids = await this.$refs.selfChatGroupOptions.handleSetChatGroupsName([...this.form.chat_ids]) // 调用组件方法回显群聊名称
         } else if (res.errno != 4002) {
           this.$message.warning(res.err || '获取失败')
         }
@@ -178,7 +180,6 @@ export default {
       } finally {
         this.loading = false
       }
-
     },
     async onClickSave() {
       try {
@@ -284,19 +285,6 @@ export default {
         this.form.chat_ids = []
       }
     },
-    // 详情 => 回显群聊名称
-    async handleSetChatGroups(chat_groups) {
-      const { data: res = {} } = await this.$axios.get(this.URL.BASEURL + this.URL.groupCode_chatGroupList, {
-        params: { keyword: '', owner: '' }
-      })
-      if (res && res.errno == 0 && Array.isArray(res.rst)) {
-        chat_groups.forEach((item, idx) => {
-          const isFound = res.rst.find(chat => chat.chat_id === item.chat_id)
-          if (isFound) chat_groups[idx].name = isFound.name
-        })
-        this.form.chat_ids = [...chat_groups]
-      }
-    },
   },
 };
 </script>

project/src/components/manage/systemMsg.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="customerStaff-wrap" v-loading="pageLoading">
     <!-- S 筛选区 -->
-    <div class="screenBox" style="padding-right: 100px;">
+    <div class="screenBox" style="padding-right: 100px;min-height: 85px;">
       <!-- 日期 -->
       <datePicker :reset="reset" title="自定义" :quickFlag="true" :afferent_time="default_time" :clearFlag="false" @changeTime="onChangeTime" />
       <!-- 企微主体 -->
@@ -10,6 +10,7 @@
       <selfInputV2 style="margin-left: -20px;"  :labelWidth="true" v-model="filter.user_name" label_name="成员" placeholder="请输入" @change="onChangeUserName" />
       <selfChannelV2 v-model="filter.msg_type" title="消息类型" type="msgType" labelWidth :clearable="false" @change="onChangeMsgType" />
       <div class="reset" @click="onClickReset">重置</div>
+      <el-button class="export-btn" type="primary" size="mini" @click="onClickExport">导出Excel</el-button>
     </div>
     <!-- E 筛选区 -->
     <!-- S 明细表 detailsTable -->
@@ -71,6 +72,38 @@
         <detailRuleKHPYQ v-if="isShowRuleKHPYQ" :is_copy='false' title="朋友圈详情" :rule_id='currentRuleId' :sysMsgCorpid="currentCorpid" @close="detailClose" />
       </el-drawer>
       <!-- E 详情 - 客户朋友圈 -->
+
+      <el-dialog
+        :visible.sync="msgExport.visible"
+        :before-close="handleCancelExport"
+        class="export-dialog"
+        title="系统消息导出"
+        width="530px"
+        :close-on-click-modal="false"
+      >
+        <div class="form-wrap" v-loading="msgExport.loading">
+          <div class="form-item">
+            <span class="tips">注：根据当前消息列表筛选条件导出，日期范围最多可选2天</span>
+          </div>
+          <div class="form-item">
+            <span class="lable required">导出日期:</span>
+            <el-date-picker
+              v-model="msgExport.time"
+              type="daterange"
+              range-separator="至"
+              start-placeholder="开始日期"
+              end-placeholder="结束日期"
+              size="mini"
+              style="width: 350px;"
+              :picker-options="msgExport.pickerOptions"
+            />
+          </div>
+        </div>
+        <div slot="footer" class="dialog-footer">
+          <el-button size="mini" @click="handleCancelExport" :disabled="msgExport.loading">取 消</el-button>
+          <el-button size="mini" type="primary" @click="handleConfirmExport" :disabled="msgExport.loading">确 定</el-button>
+        </div>
+      </el-dialog>
     </div>
     <!-- E 明细表 detailsTable -->
   </div>
@@ -92,6 +125,7 @@ import detailRuleZNQF from '@/components/smartPushV3/createMassMsg.vue' // 智
 
 import detailRuleKHPYQ from '@/components/customOperate/createFriendsCircle.vue' // 客户朋友圈-规则详情
 
+
 export default {
   components: {
     selfInputV2,
@@ -136,6 +170,17 @@ export default {
         msg_type: 1,
       },
 
+      msgExport: {
+        loading: false,
+        visible: false,
+        time: [],
+        pickerOptions: {
+          disabledDate (time) {
+            return time > Date.now()
+          }
+        },
+      },
+
       currentCorpid: '',
       currentRuleId: '',
       currentGroupId: '',
@@ -219,6 +264,86 @@ export default {
       this.pagination.page = 1
       this.handleGetData()
     },
+
+    // 监听点击"导出"按钮
+    async onClickExport() {
+      this.msgExport.visible = true
+    },
+    handleExport(list) {
+      console.log('list => ', list)
+      let tHeader = []
+      let filterVal = []
+      let tableDatas = []
+
+      const col = this.detailsTableCol.filter(c => c.column !== 'handler')
+
+      tHeader = [
+        ...col.map(d => `${d.name}`),
+      ]
+
+      filterVal = [
+        ...col.map(d => `${d.column}`),
+      ]
+
+      tableDatas = [
+        ...list,
+      ]
+
+      const excelDatas = [
+        {
+          tHeader, // sheet表一头部
+          filterVal, // 表一的数据字段
+          tableDatas, // 表一的整体json数据
+          sheetName: ''// 表一的sheet名字
+        }
+      ]
+      this.$exportOrder({ excelDatas, name: `系统消息（导出时间：${this.$getDay(0)}）` })
+    },
+    handleGetDays() {
+      const st = this.$moment(this.msgExport.time[0])
+      const et = this.$moment(this.msgExport.time[1])
+      return et.diff(st, 'days')
+    },
+    async handleConfirmExport() {
+      if (!this.msgExport.time || !this.msgExport.time.length) {
+        return this.$message.warning('请选择导出日期')
+      }
+      const days = this.handleGetDays()
+      if (days > 1) {
+        return this.$message.warning('日期范围最多可选2天')
+      }
+
+      this.msgExport.loading = true
+      try {
+        const params = {
+          sys_group_id: this.filter.sys_group_id,
+          start_date: this.msgExport.time[0],
+          end_date: this.msgExport.time[1],
+          corp_id: this.filter.corpid,
+          user_name: this.filter.user_name,
+          msg_type: this.filter.msg_type,
+          page: 1,
+          page_size: -1, // -1 后端不限制条数
+        }
+        const url = `${this.URL.BASEURL}${this.URL.system_sendNoticeListNew}`
+        const { data: res = {} } = await this.$axios.get(url, { params })
+        if (res && res.errno == 0) {
+          this.handleExport(res.rst.data)
+          this.msgExport.visible = false
+          this.msgExport.time = []
+        } else if (res.errno != 4002) {
+          this.$message.warning(res.err)
+        }
+      } catch (error) {
+        console.log('error => ', error)
+      } finally {
+        this.msgExport.loading = false
+      }
+    },
+    handleCancelExport() {
+      this.msgExport.visible = false
+    },
+
     // 监听点击"重置"按钮
     onClickReset() {
       this.reset = !this.reset
@@ -287,12 +412,61 @@ export default {
       this.isShowDetailZNQF = false
       this.isShowRuleKHPYQ = false
     },
+
+
   },
 }
 </script>
 
 <style lang="scss" scoped>
 @import "@/style/list.scss";
+.export-dialog {
+  /deep/ .el-dialog__body {
+    max-height: 380px;
+    overflow-y: auto;
+  }
+  .form-wrap {
+    padding-right: 20px;
+    .form-item {
+      display: flex;
+      align-items: center;
+      margin-top: 20px;
+      &.flex-align-start {
+        align-items: flex-start;
+      }
+      &:first-child {
+        margin-top: 0;
+      }
+      .tips {
+        font-size: 13px;
+        color: #FFB055;
+        margin-left: 10px;
+      }
+      .lable {
+        width: 80px;
+        font-weight: 500;
+        flex-shrink: 0;
+        text-align: right;
+        margin-right: 20px;
+
+        &.required {
+          &::before {
+            position: relative;
+            right: 2px;
+            content: "*";
+            color: #f56c6c;
+          }
+        }
+      }
+      .el-select {
+        width: 430px;
+      }
+    }
+  }
+  .dialog-footer {
+    text-align: center;
+  }
+}
 .customerStaff-wrap {
   position: relative;
   min-height: calc(100vh - 70px);
@@ -306,6 +480,7 @@ export default {
     background: #fff;
     padding: 5px 20px 10px;
     position: relative;
+    align-items: flex-start;
     .common-screen-item {
       width: auto;
     }
@@ -365,5 +540,6 @@ export default {
       }
     }
   }
+
 }
 </style>

project/src/router/allRouter.js

@@ -37,7 +37,7 @@ const warningListInstall = () => import(/* webpackChunkName: 'warningListInstall
 const permissionManage = () => import(/* webpackChunkName: 'permissionManage' */ '@/components/manage/permissionManage.vue')
 const roleManage = () => import(/* webpackChunkName: 'roleManage' */ '@/components/manage/roleManage.vue')
 const menuManage = () => import(/* webpackChunkName: 'menuManage' */ '@/components/manage/menuManage.vue')
-const systemMsg = () => import(/* webpackChunkName: 'systemMsg' */ '@/components/manage/systemMsg.vue')
+const systemMsg = () => import(/* webpackChunkName: 'systemMsg' */ '@/components/manage/systemMsg/index.vue')
 const feedback = () => import(/* webpackChunkName: 'feedback' */ '@/components/feedback/index.vue')
 const orderPercent = () => import(/* webpackChunkName: 'orderPercent' */ '@/components/manage/orderPercent/index.vue')
 const thePublic = () => import(/* webpackChunkName: 'thePublic' */ '@/components/dataBoard/thePublic.vue')