Skip to content

M
marketing-opeartion
Commit d323e265 by liuchenxi
Options

update: 短信管理

parent 3b17e79a
Showing with 189 additions and 22 deletions
src/styles/component.less
......@@ -34,4 +34,91 @@
}
.mb20 {
margin-bottom: 20px;
}
[class^="dm-status--"]::before {
display: inline-block;
width: 6px;
height: 6px;
margin-right: 7px;
vertical-align: middle;
content: ' ';
background-color: #D9D9D9;
border-radius: 50%;
}
/* 已发送/成功/已完成… */
.dm-status--success::before {
background-color: #52c41a;
}
/* 失败/异常… */
.dm-status--error::before {
background-color: #F5222D;
}
/* 默认 */
.dm-status--info::before {
background-color: #D9D9D9;
}
/* 告警… */
.dm-status--warning::before {
background-color: #FAAD14;
}
/* 进行中 无闪动 */
.dm-status--primary::before {
background-color: #1890FF;
}
/* 进行中 闪动效果 */
.dm-status--primary--flash {
position: relative;
display: inline-block;
vertical-align: middle;
border-radius: 50%;
background: #1890FF;
width: 6px;
height: 6px;
margin-right: 7px;
}
.dm-status--primary--flash::before {
content: ' ';
display: inline-block;
position: absolute;
left: -1px;
top: -1px;
width: 6px;
height: 6px;
background:none;
vertical-align: middle;
border-radius: 50%;
border: 1px solid #1890FF;
-webkit-animation: antStatusProcessing 1.2s ease-in-out infinite;
animation: antStatusProcessing 1.2s ease-in-out infinite;
}
@-webkit-keyframes antStatusProcessing {
0% {
-webkit-transform: scale(.8);
transform: scale(.8);
opacity: 0.5
}
to {
-webkit-transform: scale(2.4);
transform: scale(2.4);
opacity: 0.5
}
}
@keyframes antStatusProcessing {
0% {
-webkit-transform: scale(.8);
transform: scale(.8);
opacity: 1
}
to {
-webkit-transform: scale(1.4);
transform: scale(1.4);
opacity: 0.5
}
}
\ No newline at end of file
src/views/message/component/detail-table.vue
......@@ -2,11 +2,11 @@
<div class="detail-table">
<div class="top">
<div class="left">
<el-input v-model="search.searchKey" placeholder="请输入GIC短信模板ID/模板名称/模板内容" prefix-icon="el-icon-search" style="width: 260px" />
<el-select v-model="search.smsType" placeholder="请选择模板类型" class="w148 ml10">
<el-input v-model="search.searchKey" @change="getTableData" placeholder="请输入GIC短信模板ID/模板名称/模板内容" prefix-icon="el-icon-search" style="width: 260px" />
<el-select v-model="search.smsType" @change="getTableData" placeholder="请选择模板类型" class="w148 ml10">
<el-option v-for="item in smsList" :key="item.value" :value="item.value" :label="item.label" />
</el-select>
<el-select v-model="search.auditStatus" placeholder="商户后台状态" class="w148 ml10">
<el-select v-model="search.auditStatus" @change="getTableData" placeholder="商户后台状态" class="w148 ml10">
<el-option v-for="item in auditStatusList" :key="item.value" :value="item.value" :label="item.label" />
</el-select>
<el-select v-model="search.channelType" placeholder="通道类型" class="w148 ml10">
......@@ -22,20 +22,50 @@
</div>
<div class="content mt20">
<el-table :data="tableData.data" element-loading-text="拼命加载中">
<el-table-column v-for="(v, i) in tableData.header" :key="i" :prop="v.prop" :min-width="v.minWidth" :label="v.label" :formatter="v.formatter" :fixed="v.fixed" show-overflow-tooltip>
<el-table-column v-for="(v, i) in tableData.header" :key="i" :prop="v.prop" :min-width="v.minWidth" :label="v.label" :formatter="v.formatter" :fixed="v.fixed" :show-overflow-tooltip="v.showTooltip">
<template slot-scope="scope">
<span v-if="v.formatter" v-html="v.formatter(scope.row)"></span>
<span v-else>{{ scope.row[v.prop] || '--' }}</span>
</template>
</el-table-column>
<el-table-column label="操作">
<!-- <template slot-scope="{ row }">
<el-button type="text">操作</el-button>
</template> -->
<template slot-scope="{ row }">
<el-button type="text" @click="showAllChannel(row)">查看所有通道</el-button>
</template>
</el-table-column>
</el-table>
<dm-pagination background class="dm-pagination" @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="tableData.currentPage" :page-sizes="tableData.pageSizeList" :page-size="tableData.pageSize" layout="total, sizes, prev, pager, next" :total="tableData.total" hide-on-single-page />
</div>
<el-dialog :visible.sync="dialogData.visible" :title="dialogData.title" append-to-body width="600px">
<el-table :data="dialogData.list" max-height="500">
<el-table-column label="短信通道" prop="sendSmsType">
<template slot-scope="{ row }">{{ channelList.find((el) => el.channelId == row.sendSmsType).channelName }}</template>
</el-table-column>
<el-table-column label="模板ID" prop="templateId"></el-table-column>
<el-table-column label="状态" prop="status">
<template slot-scope="{ row }">
<span v-if="!row.status && row.status != 0">--</span>
<span v-else-if="row.status == 0" class="dm-status--success">已通过</span>
<span v-else-if="row.status == 1" class="dm-status--info">审核中</span>
<span v-else-if="row.status == 2" class="dm-status--error">
未通过
<el-tooltip :content="row.auditResult" placement="top">
<i class="el-icon-info icon"></i>
</el-tooltip>
</span>
</template>
</el-table-column>
<el-table-column label="反馈时间">
<template slot-scope="{ row }">
<p v-if="!row.updateTime">--</p>
<template v-else>
<p>{{ getTime(row.updateTime) }}</p>
<p>{{ getSeconds(row.updateTime) }}</p>
</template>
</template>
</el-table-column>
</el-table>
</el-dialog>
</div>
</template>
......@@ -45,7 +75,6 @@ import utils from '@/filters/index';
const { getTemplateDetailList, sendExamine, getAllChannel } = requestApi;
const { getTime, getSeconds } = utils;
export default {
components: {},
props: {
tableChannelType: Number || String
},
......@@ -57,20 +86,21 @@ export default {
],
auditStatusList: [
{ label: '已通过', value: 0 },
{ label: '待审核', value: 1 },
{ label: '已拒绝', value: 2 }
{ label: '审核中', value: 1 },
{ label: '未通过', value: 2 }
],
channelList: [],
channelStatusList: [
{ label: '已通过', value: 1 },
{ label: '已通过', value: 0 },
{ label: '未通过', value: 2 },
{ label: '审核中', value: 3 }
{ label: '审核中', value: 1 },
{ label: '全部', value: null }
],
search: {
searchKey: '',
smsType: null, // 0-普通短信 1-营销短信
auditStatus: null, // 状态：0：已通过；1：待审核；2：已拒绝
channelType: '', // 前端自定义筛选
channelType: '', // 前端自定义筛选
channelStatus: null // 前端自定义筛选
},
tableData: {
......@@ -80,7 +110,14 @@ export default {
pageSize: 20,
header: [],
total: 0
}
},
dialogData: {
visible: false,
title: '查看所有通道',
list: []
},
getTime,
getSeconds
};
},
created() {
......@@ -106,13 +143,14 @@ export default {
auditStatus
};
const result = await getTemplateDetailList(para);
console.log(result);
this.tableData.data = result.result.result || [];
this.tableData.total = result.result.totalCount;
},
getTableHeader() {
this.tableData.header = [
{ label: 'GIC短信模板ID', prop: 'gicSmsTemplateId' },
{ label: '模板名称', prop: 'smsTitle' },
{ label: '模板内容', prop: 'smsContent' },
{ label: '模板内容', prop: 'smsContent', showTooltip: true },
{
label: '模板类型',
prop: 'smsType',
......@@ -131,10 +169,35 @@ export default {
label: '商户后台状态',
prop: 'auditStatus',
formatter(row) {
return row.auditResult == 0 ? '已通过' : row.auditStatus == 1 ? '待审核' : '已拒绝';
if (!row.auditStatus && row.auditStatus != 0) return '--';
return row.auditStatus == 0 ? '<span class="dm-status--success">已通过</span>' : row.auditStatus == 1 ? '<span class="dm-status--info">审核中</span>' : '<span class="dm-status--error">未通过</span>';
}
},
{ label: '通道审核状态', prop: 'auditResult' }
{
label: '通道审核状态',
prop: 'auditResult',
minWidth: 190,
formatter: (row) => {
const tempalte = row.channelTemplate || [];
const data =
tempalte.find((el) => {
const channelStatus = this.search.channelStatus;
const isTypeEquels = el.sendSmsType == this.search.channelType;
return channelStatus != null ? isTypeEquels && el.status == channelStatus : isTypeEquels;
}) || {};
let status;
if (!data.status && data.status != 0) status = '--';
else {
status = data.status == 0 ? '<span class="dm-status--success">已通过</span>' : data.status == 1 ? '<span class="dm-status--info">审核中</span>' : '<span class="dm-status--error">未通过</span>';
}
return `
<p>模板ID：${data.templateId || '--'}</p>
<p>状态：${status}</p>
${data.status == 2 ? '<p>原因：<span style="color:red">' + data.auditResult + '</span></p>' : ''}
<p>反馈时间：${data.updateTime ? getTime(data.updateTime) + ' ' + getSeconds(data.updateTime) : '--'}</p>
`;
}
}
];
},
handleSizeChange(val) {
......@@ -148,8 +211,15 @@ export default {
},
// 提交审核
async submitExamine(row) {
await sendExamine({ enterpriseId: this.$route.query.id });
this.$message.success('提交成功');
try {
await this.$confirm('确认要全量提交审核吗？', '', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
});
await sendExamine({ enterpriseId: this.$route.query.id });
this.$message.success('提交成功');
} catch(err) {}
},
async getChannelList() {
const { result } = await getAllChannel();
......@@ -158,11 +228,16 @@ export default {
},
// 设置通道类型的初始化
initChannelType(val) {
if(val == 0) {
this.search.channelType = this.channelList.find(el => el.channelName == '腾讯云').channelId;
if (val == 0) {
this.search.channelType = this.channelList.find((el) => el.channelName == '腾讯云').channelId;
} else {
this.search.channelType = val;
}
},
// 查看所有通道
showAllChannel(row) {
this.dialogData.visible = true;
this.dialogData.list = row.channelTemplate;
}
},
computed: {
......@@ -186,4 +261,8 @@ export default {
justify-content: space-between;
align-items: center;
}
.icon {
color: #2f54eb;
margin-left: 6px;
}
</style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment