|
@@ -6,23 +6,23 @@
|
|
|
</a-form-item>
|
|
|
<a-form-item label="社交账号">
|
|
|
<a-select v-model:value="filters.socialAccount" placeholder="请选择" class="select-style">
|
|
|
- <a-select-option value="account1">账号1</a-select-option>
|
|
|
- <a-select-option value="account2">账号2</a-select-option>
|
|
|
+ <a-select-option value="1">好友</a-select-option>
|
|
|
+ <a-select-option value="2">群组</a-select-option>
|
|
|
</a-select>
|
|
|
</a-form-item>
|
|
|
<a-form-item label="类型">
|
|
|
<a-select v-model:value="filters.type" placeholder="请选择" class="select-style">
|
|
|
- <a-select-option value="personal">个人微信</a-select-option>
|
|
|
- <a-select-option value="enterprise">企业微信</a-select-option>
|
|
|
+ <a-select-option value="1">好友</a-select-option>
|
|
|
+ <a-select-option value="2">群组</a-select-option>
|
|
|
</a-select>
|
|
|
</a-form-item>
|
|
|
- <a-form-item label="执行结果">
|
|
|
+ <!-- <a-form-item label="执行结果">
|
|
|
<a-select v-model:value="filters.result" placeholder="请选择" class="select-style">
|
|
|
<a-select-option value="notSend">未发送</a-select-option>
|
|
|
<a-select-option value="success">成功</a-select-option>
|
|
|
<a-select-option value="failure">失败</a-select-option>
|
|
|
</a-select>
|
|
|
- </a-form-item>
|
|
|
+ </a-form-item> -->
|
|
|
<a-form-item>
|
|
|
<a-button type="primary" @click="onSearch">查询</a-button>
|
|
|
</a-form-item>
|
|
@@ -30,7 +30,13 @@
|
|
|
<a-button @click="onReset">重置</a-button>
|
|
|
</a-form-item>
|
|
|
</a-form>
|
|
|
- <a-table :columns="columns" :dataSource="data" :pagination="pagination" class="table-style">
|
|
|
+ <a-table
|
|
|
+ :columns="columns"
|
|
|
+ :dataSource="data"
|
|
|
+ :pagination="pagination"
|
|
|
+ :loading="loading.spinning"
|
|
|
+ class="table-style"
|
|
|
+ >
|
|
|
<template #action="{ record }">
|
|
|
<a @click="viewRecord(record)">发送记录</a>
|
|
|
</template>
|
|
@@ -39,117 +45,150 @@
|
|
|
</template>
|
|
|
|
|
|
<script lang="ts">
|
|
|
-import { defineComponent, reactive,onMounted } from 'vue';
|
|
|
-import { Form, Input, Select, Button, Table, Pagination } from 'ant-design-vue';
|
|
|
-import { useRoute } from 'vue-router';
|
|
|
-import { getSopTaskRecordMsg } from '@/api/wechat/sopTask'
|
|
|
-import dayjs from 'dayjs';
|
|
|
+ import { defineComponent, reactive, onMounted } from 'vue';
|
|
|
+ import { Form, Input, Select, Button, Table, Pagination } from 'ant-design-vue';
|
|
|
+ import { useRoute } from 'vue-router';
|
|
|
+ import { getSopTaskRecordMsg } from '@/api/wechat/sopTask';
|
|
|
+ import dayjs from 'dayjs';
|
|
|
|
|
|
-export default defineComponent({
|
|
|
- name: 'SendTasks',
|
|
|
- components: {
|
|
|
- 'a-form': Form,
|
|
|
- 'a-form-item': Form.Item,
|
|
|
- 'a-input': Input,
|
|
|
- 'a-select': Select,
|
|
|
- 'a-select-option': Select.Option,
|
|
|
- 'a-button': Button,
|
|
|
- 'a-table': Table,
|
|
|
- 'a-pagination': Pagination,
|
|
|
- },
|
|
|
- setup() {
|
|
|
- const filters = reactive({
|
|
|
- customer: '',
|
|
|
- socialAccount: '',
|
|
|
- type: '',
|
|
|
- result: '',
|
|
|
- });
|
|
|
- const route = useRoute();
|
|
|
- const data = reactive([
|
|
|
- ]);
|
|
|
+ export default defineComponent({
|
|
|
+ name: 'SendTasks',
|
|
|
+ components: {
|
|
|
+ 'a-form': Form,
|
|
|
+ 'a-form-item': Form.Item,
|
|
|
+ 'a-input': Input,
|
|
|
+ 'a-select': Select,
|
|
|
+ 'a-select-option': Select.Option,
|
|
|
+ 'a-button': Button,
|
|
|
+ 'a-table': Table,
|
|
|
+ 'a-pagination': Pagination,
|
|
|
+ },
|
|
|
+ setup() {
|
|
|
+ const filters = reactive({
|
|
|
+ customer: '',
|
|
|
+ socialAccount: '',
|
|
|
+ type: '',
|
|
|
+ result: '',
|
|
|
+ });
|
|
|
+ const route = useRoute();
|
|
|
+ const data = reactive([]);
|
|
|
+ const loading = reactive({
|
|
|
+ spinning: true,
|
|
|
+ });
|
|
|
|
|
|
- const columns = reactive([
|
|
|
- { title: '序号', dataIndex: 'index', key: 'index' },
|
|
|
- { title: '社交账号', dataIndex: 'botWxid', key: 'botWxid' },
|
|
|
- { title: '客户', dataIndex: 'contactWxid', key: 'contactWxid' },
|
|
|
- { title: 'SOP任务节点名称', dataIndex: 'content', key: 'content' },
|
|
|
- { title: '执行状态', dataIndex: 'result', key: 'result' },
|
|
|
- { title: '异常原因', dataIndex: 'errorDetail', key: 'errorDetail' },
|
|
|
- { title: '最新执行时间', dataIndex: 'sendTime', key: 'sendTime', customRender: ({ text }) => dayjs(text).format('YY-MM-DD HH:mm:ss')},
|
|
|
- // { title: '操作', key: 'action', slots: { customRender: 'action' } },
|
|
|
- ]);
|
|
|
+ const columns = reactive([
|
|
|
+ { title: '序号', dataIndex: 'index', key: 'index' },
|
|
|
+ { title: '微信ID', dataIndex: 'botWxid', key: 'botWxid' },
|
|
|
+ { title: '联系人微信ID', dataIndex: 'contactWxid', key: 'contactWxid' },
|
|
|
+ {
|
|
|
+ title: '联系人类型',
|
|
|
+ dataIndex: 'contactType',
|
|
|
+ key: 'contactType',
|
|
|
+ customRender: ({ record }) => {
|
|
|
+ return record.contactType == 1 ? '好友' : '群组';
|
|
|
+ },
|
|
|
+ },
|
|
|
+ { title: '内容', dataIndex: 'content', key: 'content' },
|
|
|
+ {
|
|
|
+ title: '内容类型',
|
|
|
+ dataIndex: 'contentType',
|
|
|
+ key: 'contentType',
|
|
|
+ customRender: ({ record }) => {
|
|
|
+ return record.contentType == 1 ? '文本' : '文件';
|
|
|
+ },
|
|
|
+ },
|
|
|
+ { title: '错误信息', dataIndex: 'errorDetail', key: 'errorDetail' },
|
|
|
+ {
|
|
|
+ title: '发送时间',
|
|
|
+ dataIndex: 'sendTime',
|
|
|
+ key: 'sendTime',
|
|
|
+ customRender: ({ text }) => dayjs(text).format('YY-MM-DD HH:mm:ss'),
|
|
|
+ },
|
|
|
+ // { title: '操作', key: 'action', slots: { customRender: 'action' } },
|
|
|
+ ]);
|
|
|
|
|
|
- onMounted(async () => {
|
|
|
- const sourceId = route.query.sourceId;
|
|
|
- const sourceType = route.query.sourceType;
|
|
|
- let res = await getSopTaskRecordMsg({ sourceId: Number(sourceId) ,sourceType: Number(sourceType),page:1,pageSize:50});
|
|
|
- console.log(res)
|
|
|
- if (res && Array.isArray(res.data.data)) {
|
|
|
- res.data.data.forEach((item, index) => {
|
|
|
- item.index = index + 1; // 为每条记录添加序号
|
|
|
+ onMounted(async () => {
|
|
|
+ const sourceId = route.query.sourceId;
|
|
|
+ const sourceType = route.query.sourceType;
|
|
|
+ try {
|
|
|
+ const res = await getSopTaskRecordMsg({
|
|
|
+ sourceId: Number(sourceId),
|
|
|
+ sourceType: Number(sourceType),
|
|
|
+ page: 1,
|
|
|
+ pageSize: 50,
|
|
|
});
|
|
|
- data.splice(0, data.length, ...res.data.data); // 更新 data
|
|
|
- pagination.total = res.data.total;
|
|
|
+ if (res && Array.isArray(res.data.data)) {
|
|
|
+ res.data.data.forEach((item, index) => {
|
|
|
+ item.index = index + 1; // 为每条记录添加序号
|
|
|
+ });
|
|
|
+ data.splice(0, data.length, ...res.data.data); // 更新 data
|
|
|
+ pagination.total = res.data.total;
|
|
|
+ }
|
|
|
+ } catch (error) {
|
|
|
+ console.error('数据加载失败', error);
|
|
|
+ } finally {
|
|
|
+ loading.spinning = false; // 数据加载完成后关闭加载指示器
|
|
|
}
|
|
|
- });
|
|
|
+ });
|
|
|
|
|
|
- const pagination = reactive({
|
|
|
- total: 0,
|
|
|
- pageSize: 10,
|
|
|
- current: 1,
|
|
|
- showTotal: (total) => `共 ${total} 条`,
|
|
|
- });
|
|
|
+ const pagination = reactive({
|
|
|
+ total: 0,
|
|
|
+ pageSize: 10,
|
|
|
+ current: 1,
|
|
|
+ showTotal: (total) => `共 ${total} 条`,
|
|
|
+ });
|
|
|
|
|
|
- const onSearch = () => {
|
|
|
- console.log('查询条件', filters);
|
|
|
- // 在这里添加查询逻辑
|
|
|
- };
|
|
|
+ const onSearch = () => {
|
|
|
+ console.log('查询条件', filters);
|
|
|
+ // 在这里添加查询逻辑
|
|
|
+ };
|
|
|
|
|
|
- const onReset = () => {
|
|
|
- filters.customer = '';
|
|
|
- filters.socialAccount = '';
|
|
|
- filters.type = '';
|
|
|
- filters.result = '';
|
|
|
- };
|
|
|
+ const onReset = () => {
|
|
|
+ filters.customer = '';
|
|
|
+ filters.socialAccount = '';
|
|
|
+ filters.type = '';
|
|
|
+ filters.result = '';
|
|
|
+ };
|
|
|
|
|
|
- const viewRecord = (record) => {
|
|
|
- console.log('查看发送记录', record);
|
|
|
- // 在这里添加你的逻辑,比如跳转到发送记录页面或显示模态框
|
|
|
- };
|
|
|
+ const viewRecord = (record) => {
|
|
|
+ console.log('查看发送记录', record);
|
|
|
+ // 在这里添加你的逻辑,比如跳转到发送记录页面或显示模态框
|
|
|
+ };
|
|
|
|
|
|
- return {
|
|
|
- filters,
|
|
|
- data,
|
|
|
- columns,
|
|
|
- pagination,
|
|
|
- onSearch,
|
|
|
- onReset,
|
|
|
- viewRecord,
|
|
|
- };
|
|
|
- },
|
|
|
-});
|
|
|
+ return {
|
|
|
+ filters,
|
|
|
+ data,
|
|
|
+ columns,
|
|
|
+ pagination,
|
|
|
+ onSearch,
|
|
|
+ onReset,
|
|
|
+ viewRecord,
|
|
|
+ loading,
|
|
|
+ };
|
|
|
+ },
|
|
|
+ });
|
|
|
</script>
|
|
|
|
|
|
<style scoped>
|
|
|
-.container{
|
|
|
- background-color: #fff;
|
|
|
- margin: 20px;
|
|
|
- border-radius: 4px;
|
|
|
- height: calc(100vh - 40px);
|
|
|
- width: calc(100% - 40px);
|
|
|
-}
|
|
|
-.ant-table-cell {
|
|
|
- text-align: center;
|
|
|
-}
|
|
|
-.table-style{
|
|
|
- padding: 16px;
|
|
|
-}
|
|
|
-.form-style{
|
|
|
- /* width: ; */
|
|
|
- height: 55px;
|
|
|
- padding: 16px;
|
|
|
-}
|
|
|
-.select-style{
|
|
|
- width: 180px;
|
|
|
-}
|
|
|
+ .container {
|
|
|
+ background-color: #fff;
|
|
|
+ margin: 20px;
|
|
|
+ border-radius: 4px;
|
|
|
+ height: calc(100vh - 40px);
|
|
|
+ width: calc(100% - 40px);
|
|
|
+ }
|
|
|
+ .ant-table-cell {
|
|
|
+ text-align: center;
|
|
|
+ }
|
|
|
+ .table-style {
|
|
|
+ padding: 16px;
|
|
|
+ }
|
|
|
+ .form-style {
|
|
|
+ /* width: ; */
|
|
|
+ height: 55px;
|
|
|
+ padding: 16px;
|
|
|
+ }
|
|
|
+ .select-style {
|
|
|
+ width: 180px;
|
|
|
+ }
|
|
|
</style>
|