feat: 群发任务停止 - 客户群发&客户群群发&智能推送v3

project/src/components/assembly/cancelSendListDialog.vue

@@ -0,0 +1,174 @@
+<template>
+  <el-dialog
+    :visible.sync="dialogVisible"
+    :before-close="handleCancel"
+    class="list-dialog"
+    :title="dialogTitle"
+    width="900px"
+  >
+    <div class="form-wrap" v-loading="loading">
+      <el-table ref="tableDom" :height="height" :data="list" tooltip-effect="dark" style="width: 100%;">
+        <el-table-column label="群发标题" prop="title" min-width="160" align="center" fixed="left" />
+        <el-table-column label="创建人" align="center" min-width="140">
+          <template slot-scope="{ row }">
+            <div class="customerServiceTagBox">
+              <div class="customerServiceTag"><i class="el-icon-user-solid"></i> {{ row.creator }}</div>
+            </div>
+          </template>
+        </el-table-column>
+        <el-table-column label="创建时间" prop="created_at" min-width="160" align="center" />
+        <el-table-column label="状态" min-width="160" align="center">
+          <template slot-scope="{ row }">
+            <span :class="['status', handleGetStatusDesc(row.status).tColor]">
+              {{ handleGetStatusDesc(row.status).label }}
+            </span>
+          </template>
+        </el-table-column>
+      </el-table>
+      <div class="pagination" v-show="pagination.total > 0">
+        <el-pagination background :current-page="pagination.page" @current-change="handleCurrentChange" layout="prev, pager, next" :page-count="Number(pagination.pages)" />
+      </div>
+    </div>
+    <div slot="footer" class="dialog-footer">
+      <!-- <el-button size="mini" @click="handleCancel">关 闭</el-button> -->
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+import selfInput from '@/components/assembly/screen/input.vue'
+
+const statusMap = new Map([
+  [-1, { label: '停止失败', tColor: 'c-666' }],
+  [0, { label: '禁用', tColor: 'c-F03F5C' }],
+  [1, { label: '待停止', tColor: 'c-FFB055' }],
+  [2, { label: '执行中', tColor: 'c-448AFF' }],
+  [3, { label: '已完成', tColor: 'c-58BCA6' }],
+])
+
+export default {
+  components: {
+    selfInput,
+  },
+  props: {
+    // 控制弹框是否显示
+    dialogVisible: {
+      type: Boolean,
+      default: () => false
+    },
+    // 群发消息类型。1正常群发 2智能群发 3客户群群发
+    listType: {
+      type: Number | String,
+      default: () => ''
+    },
+  },
+  data() {
+    return {
+      height: 500,
+      loading: false,
+      pagination: {
+        page: 1,
+        page_size: 20,
+        pages: 0,
+        total: 0,
+      },
+      filter: {
+        type: '',
+      },
+      list: [],
+    }
+  },
+  computed: {
+    // 弹框标题
+    dialogTitle() {
+      return '停止群发记录'
+    }
+  },
+  watch: {
+    dialogVisible(isShow) {
+      // 弹框显示 => 初始化表单数据
+      if (isShow) {
+        this.pagination.page = 1
+        this.filter.type = this.listType
+        this.handleInitList()
+        this.handleGetList()
+      }
+    },
+  },
+  methods: {
+    // 获取列表数据
+    async handleGetList() {
+      try {
+        this.loading = true
+        const url = `${this.URL.BASEURL}${this.URL.massMsgCancel_taskList}`
+        const params = {
+          type: this.filter.type,
+          page: this.pagination.page,
+          page_size: this.pagination.page_size,
+        }
+        const { data: res = {} } = await this.$axios.get(url, { params })
+        if (res && res.errno == 0 && Array.isArray(res.rst.data)) {
+          this.list = res.rst.data;
+          this.pagination.total = res.rst.pageInfo.total;
+          this.pagination.pages = res.rst.pageInfo.pages;
+          this.$refs.tableDom.bodyWrapper.scrollTop = 0
+        } else if (res.errno != 4002) {
+          this.$message.warning(res.err)
+          this.handleInitList()
+        }
+      } catch (error) {
+        console.log(error)
+        this.handleInitList()
+      } finally {
+        this.loading = false
+      }
+    },
+    // 监听当前页数变化
+    handleCurrentChange(currentPage) {
+      this.pagination.page = currentPage
+      this.handleGetList()
+    },
+    // 初始化列表数据
+    handleInitList() {
+      this.list = [];
+      this.pagination.total = 0;
+      this.pagination.pages = 0;
+    },
+    handleCancel() {
+      this.$emit('close')
+    },
+    handleGetStatusDesc(status) {
+      return statusMap.get(Number(status)) || {}
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.list-dialog {
+  .status {
+    margin: 2px auto;
+    padding: 0 6px;
+  }
+  .form-wrap {
+    padding: 0 10px;
+  }
+  .dialog-footer {
+    text-align: center;
+  }
+  /deep/ .el-dialog {
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    margin: 0 !important;
+    transform: translate(-50%, -50%);
+  }
+
+  /deep/ .el-dialog__body {
+    padding: 0 10px 10px;
+  }
+  /deep/ .el-dialog__footer {
+    padding: 0;
+  }
+}
+</style>

project/src/components/customOperate/chatGroup/index.vue

@@ -24,6 +24,7 @@
       </div>
       <div class="flex">
         <el-button type="primary" size="mini" @click="createdMassMsg">新建群发</el-button>
+        <el-button type="primary" plain size="mini" @click="onClickCancelSendList">停止群发记录</el-button>
         <el-button type="primary" plain size="mini" @click="init(1, 'export')">导出Excel</el-button>
       </div>
     </div>
@@ -88,9 +89,9 @@
           <span v-if="scope.row.enable == 4" class="c-58BCA6">发送完成</span>
         </template>
       </el-table-column>
-      <el-table-column min-width="120" label="操作" align="center">
+      <el-table-column min-width="150" label="操作" align="center" fixed="right">
         <template slot-scope="scope">
-          <div class="flex" style="justify-content:center">
+          <div class="flex" style="justify-content:center;flex-wrap:wrap;">
             <el-popconfirm :disabled="scope.row.enable == 3 ? false : true" @confirm="remind_send(scope.row)"
               :title="'猎羽将提醒未发送的群主发送消息，是否确认提醒 ?'">
               <div slot="reference" class="table_button" v-if="scope.row.enable == 3"
@@ -105,6 +106,9 @@
             <el-popconfirm @confirm="copyDetail(scope.row)" :title="`确定复制【${scope.row.name}】群发消息？`">
               <div slot="reference" class="c-00B38A pointer table_button">复制</div>
             </el-popconfirm>
+            <div v-if="scope.row.enable == 4" class="pointer table_button c-FF604D" @click="onClickCancelSend(scope.row)">
+              停止群发
+            </div>
           </div>
         </template>
       </el-table-column>
@@ -120,6 +124,14 @@
     <el-drawer size="1200px" :visible.sync="detialFlag" :with-header="false">
       <detail v-if="detialFlag" title="群发详情" :rule_id='detail_rule_id' @close="detailClose" />
     </el-drawer>
+
+    <!-- S 停止群发记录 -->
+    <cancelSendListDialog
+      :dialogVisible="cancelSendDialogVisible"
+      :listType="cancelSendListType"
+      @close="onCloseCancelSendDialog"
+    />
+    <!-- E 停止群发记录 -->
   </div>
 </template>
 <script>
@@ -129,8 +141,16 @@ import createMsg from './createMsg.vue'
 import detail from './createMsgDetail.vue'
 import selfChannel from '@/components/assembly/screen/channel.vue'
 import selfInput from '@/components/assembly/screen/input.vue'
+import cancelSendListDialog from '@/components/assembly/cancelSendListDialog.vue'
 export default {
-  components: { datePicker, createMsg, detail, selfChannel, selfInput },
+  components: {
+    datePicker,
+    createMsg,
+    detail,
+    selfChannel,
+    selfInput,
+    cancelSendListDialog,
+  },
   data () {
     return {
       detialFlag: false,
@@ -152,7 +172,10 @@ export default {
       is_copy: false,
       sort_field: 'send_time',
       circleCreate_val: '',
-      input_keyword: ''
+      input_keyword: '',
+
+      cancelSendDialogVisible: false,
+      cancelSendListType: 3, // 停止群发任务 群发消息类型。1正常群发 2智能群发 3客户群群发
     }
   },
   created () {
@@ -336,7 +359,48 @@ export default {
         }
       ]
       this.$exportOrder({ excelDatas, name: `客户群群发（导出时间：${this.$getDay(0)}）` })
-    }
+    },
+
+    // 监听点击“停止群发”
+    async onClickCancelSend({ name, rule_id }) {
+      try {
+        await this.$confirm(`确定停止当前群发任务吗？`, `${ name }`, {
+          confirmButtonText: '确定',
+          cancelButtonText: '取消',
+          type: 'warning'
+        })
+        this.handleCancelSend(rule_id)
+      } catch (error) {
+        console.log('error => ', error)
+      }
+    },
+    async handleCancelSend(rule_id) {
+      try {
+        this.loading = true
+        const url = `${this.URL.BASEURL}${this.URL.massMsgCancel_setConfig}`
+        const params = {
+          rule_id,
+          type: this.cancelSendListType,
+        }
+        const { data: res = {} } = await this.$axios.post(url, params)
+        if (res && res.errno == 0) {
+          this.$message.success('操作成功')
+          this.init(this.page)
+        } else if (res.errno != 4002) {
+          this.$message.warning(res.err)
+        }
+      } catch (error) {
+        console.log(error)
+      } finally {
+        this.loading = false
+      }
+    },
+    onClickCancelSendList() {
+      this.cancelSendDialogVisible = true
+    },
+    onCloseCancelSendDialog() {
+      this.cancelSendDialogVisible = false
+    },
   }
 }
 </script>

project/src/components/customOperate/employee_bulk_messaging_log.vue

@@ -20,6 +20,7 @@
         </div>
       </div>
       <div class="flex">
+        <el-button type="primary" plain size="mini" @click="onClickCancelSendList">停止群发记录</el-button>
         <el-button type="primary" plain size="mini" @click="init(1,'export')">导出Excel</el-button>
         <!-- 使用说明 -->
         <instructions style="margin-left: 20px;" doc="employee_bulk_messaging_log"></instructions>
@@ -101,9 +102,9 @@
           </div>
         </template>
       </el-table-column>
-      <el-table-column min-width="140" label="操作" align="center" fixed="right">
+      <el-table-column min-width="150" label="操作" align="center" fixed="right">
         <template slot-scope="scope">
-          <div class="flex" style="justify-content:center">
+          <div class="flex" style="justify-content:center;flex-wrap:wrap;">
             <el-popconfirm :disabled="scope.row.enable==1||scope.row.enable==2?false:true" @confirm="remind_send(scope.row)" :title="'猎羽将提醒未发送的客户发送消息，是否确认提醒 ?'">
               <div slot="reference" class="table_button" v-if="scope.row.enable==1||scope.row.enable==2" :class="scope.row.enable==1||scope.row.enable==2?'c-00B38A pointer':'pointer-drop c-999'">提醒</div>
             </el-popconfirm>
@@ -131,6 +132,14 @@
     <el-drawer size="1200px" :visible.sync="detialFlag" :with-header="false">
       <massMsgDetail v-if="detialFlag" title="群发详情" :rule_id='detail_rule_id' @close="detailClose"></massMsgDetail>
     </el-drawer>
+
+    <!-- S 停止群发记录 -->
+    <cancelSendListDialog
+      :dialogVisible="cancelSendDialogVisible"
+      :listType="cancelSendListType"
+      @close="onCloseCancelSendDialog"
+    />
+    <!-- E 停止群发记录 -->
   </div>
 </template>
 <script>
@@ -141,8 +150,16 @@ import massMsgDetail from './massMsgDetail/index.vue'
 import selfChannel from '@/components/assembly/screen/channel.vue'
 import { pageFromType } from '@/assets/js/staticTypes'
 import selfInput from '@/components/assembly/screen/input.vue'
+import cancelSendListDialog from '@/components/assembly/cancelSendListDialog.vue'
 export default {
-  components: { selfInput, datePicker, createMassMsg, massMsgDetail, selfChannel },
+  components: {
+    selfInput,
+    datePicker,
+    createMassMsg,
+    massMsgDetail,
+    selfChannel,
+    cancelSendListDialog,
+  },
   data () {
     return {
       detialFlag: false,
@@ -163,6 +180,9 @@ export default {
       is_copy: false,
       sort_field: 'send_time',
       circleCreate_val: '',
+
+      cancelSendDialogVisible: false,
+      cancelSendListType: 1, // 停止群发任务 群发消息类型。1正常群发 2智能群发 3客户群群发
     }
   },
   created () {
@@ -436,27 +456,33 @@ export default {
         console.log('error => ', error)
       }
     },
-    // async handleCancelSend(rule_id) {
-    //   try {
-    //     this.loading = true
-    //     const url = `${this.URL.BASEURL}${this.URL.massMsgCancel_setConfig}`
-    //     const params = {
-    //       rule_id,
-    //       type: 1, // 群发消息类型。1正常群发 2智能群发 3客户群群发
-    //     }
-    //     const { data: res = {} } = await this.$axios.post(url, params)
-    //     if (res && res.errno == 0) {
-    //       this.$message.success('操作成功')
-    //       this.resetEvent()
-    //     } else if (res.errno != 4002) {
-    //       this.$message.warning(res.err)
-    //     }
-    //   } catch (error) {
-    //     console.log(error)
-    //   } finally {
-    //     this.loading = false
-    //   }
-    // },
+    async handleCancelSend(rule_id) {
+      try {
+        this.loading = true
+        const url = `${this.URL.BASEURL}${this.URL.massMsgCancel_setConfig}`
+        const params = {
+          rule_id,
+          type: this.cancelSendListType,
+        }
+        const { data: res = {} } = await this.$axios.post(url, params)
+        if (res && res.errno == 0) {
+          this.$message.success('操作成功')
+          this.init(this.page)
+        } else if (res.errno != 4002) {
+          this.$message.warning(res.err)
+        }
+      } catch (error) {
+        console.log(error)
+      } finally {
+        this.loading = false
+      }
+    },
+    onClickCancelSendList() {
+      this.cancelSendDialogVisible = true
+    },
+    onCloseCancelSendDialog() {
+      this.cancelSendDialogVisible = false
+    },
   }
 }
 </script>

project/src/components/smartPushV3/detailList.vue

@@ -25,6 +25,7 @@
       <div class="flex">
         <el-button type="primary" size="mini" @click="onClickCreatedRule">新建智能推送</el-button>
         <el-button type="primary" plain size="mini" @click="onClickBatchGroup">批量设置分组</el-button>
+        <el-button type="primary" plain size="mini" @click="onClickCancelSendList">停止群发记录</el-button>
         <el-button type="primary" plain size="mini" @click="init(1,'export')">导出Excel</el-button>
       </div>
     </div>
@@ -46,6 +47,11 @@
       </el-table-column>
       <el-table-column prop="desc" label="规则" align="center" min-width="200" />
       <el-table-column label="创建时间" prop="created_at" min-width="120" show-overflow-tooltip align="center" />
+      <el-table-column label="推送记录" align="center" min-width="100">
+        <template slot-scope="{ row }">
+          <div class="c-00B38A pointer table_button" @click="onClickPushRecords(row)">查看</div>
+        </template>
+      </el-table-column>
       <el-table-column label="状态" show-overflow-tooltip align="center" min-width="120">
         <template slot-scope="{ row }">
           <el-switch v-model="row.status" :active-value="1" :inactive-value="0" disabled @click.native="onClickStatus(row)" />
@@ -59,14 +65,15 @@
               <div slot="reference" class="c-00B38A pointer table_button">复制</div>
             </el-popconfirm>
             <div class="c-FF604D pointer table_button" @click="onClickDelRule(scope.row)">删除</div>
-            <div class="c-00B38A pointer table_button" @click="onClickPushRecords(scope.row)">推送记录</div>
+            <div v-if="scope.row.status==1" class="pointer table_button c-FF604D" @click="onClickCancelSend(scope.row)">
+              停止群发
+            </div>
           </div>
         </template>
       </el-table-column>
     </el-table>
     <div class="pagination" v-show="total>0">
-      <el-pagination background :current-page="page" @current-change="handleCurrentChange" layout="prev, pager, next" :page-count='Number(pages)'>
-      </el-pagination>
+      <el-pagination background :current-page="page" @current-change="handleCurrentChange" layout="prev, pager, next" :page-count='Number(pages)' />
     </div>
     <!-- S 新建/编辑智能推送 -->
     <el-drawer size="1200px" :visible.sync="massMsgFlag" :with-header="false">
@@ -90,6 +97,14 @@
     />
     <!-- E 批量分组 -->
 
+    <!-- S 停止群发记录 -->
+    <cancelSendListDialog
+      :dialogVisible="cancelSendDialogVisible"
+      :listType="cancelSendListType"
+      @close="onCloseCancelSendDialog"
+    />
+    <!-- E 停止群发记录 -->
+
   </div>
 </template>
 <script>
@@ -98,8 +113,17 @@ import selfChannel from '@/components/assembly/screen/channel.vue'
 import selfInputV2 from '@/components/assembly/screen/inputV2.vue'
 import createMassMsg from './createMassMsg.vue'
 import batchGroupDialog from './batchGroupDialog.vue'
+import cancelSendListDialog from '@/components/assembly/cancelSendListDialog.vue'
+
 export default {
-  components: { datePicker, selfChannel, selfInputV2, createMassMsg, batchGroupDialog, },
+  components: {
+    datePicker,
+    selfChannel,
+    selfInputV2,
+    createMassMsg,
+    batchGroupDialog,
+    cancelSendListDialog,
+  },
   data () {
     return {
       massMsgFlag: false,
@@ -123,6 +147,9 @@ export default {
       multipleSelection: [],
       currentSelectedRules: '',
       batchGroupVisible: false,
+
+      cancelSendDialogVisible: false,
+      cancelSendListType: 2, // 停止群发任务 群发消息类型。1正常群发 2智能群发 3客户群群发
     }
   },
   created () {
@@ -369,6 +396,47 @@ export default {
     onCancelBatchGroup() {
       this.batchGroupVisible = false
     },
+
+    // 监听点击“停止群发”
+    async onClickCancelSend({ name, rule_id }) {
+      try {
+        await this.$confirm(`确定停止当前群发任务吗？`, `${ name }`, {
+          confirmButtonText: '确定',
+          cancelButtonText: '取消',
+          type: 'warning'
+        })
+        this.handleCancelSend(rule_id)
+      } catch (error) {
+        console.log('error => ', error)
+      }
+    },
+    async handleCancelSend(rule_id) {
+      try {
+        this.loading = true
+        const url = `${this.URL.BASEURL}${this.URL.massMsgCancel_setConfig}`
+        const params = {
+          rule_id,
+          type: this.cancelSendListType,
+        }
+        const { data: res = {} } = await this.$axios.post(url, params)
+        if (res && res.errno == 0) {
+          this.$message.success('操作成功')
+          this.init(this.page)
+        } else if (res.errno != 4002) {
+          this.$message.warning(res.err)
+        }
+      } catch (error) {
+        console.log(error)
+      } finally {
+        this.loading = false
+      }
+    },
+    onClickCancelSendList() {
+      this.cancelSendDialogVisible = true
+    },
+    onCloseCancelSendDialog() {
+      this.cancelSendDialogVisible = false
+    },
   }
 }
 </script>