<template>
|
<page-header-wrapper :breadcrumb="false" :tab-list="tabList" :tab-active-key="tabActiveKey" :tab-change="(key) => {
|
this.tabActiveKey = key
|
}">
|
<a-card :bordered="false">
|
<template v-if="this.tabActiveKey == 'template'">
|
<div>
|
<a-button style="margin-bottom: 10px;" type="primary" @click="handleShow">新建模板</a-button>
|
</div>
|
<a-table rowKey="id" ref="table" size="default" :columns="columns" :data-source="data" :loading="loading"
|
:pagination="pagination">
|
<span slot="action" slot-scope="text, record">
|
<a @click="updateTemplate(record)">修改</a>
|
|
|
<a-popconfirm title="是否确认删除?" ok-text="是" cancel-text="否" @confirm="delTemplate(record)">
|
<a>删除</a>
|
</a-popconfirm>
|
</span>
|
</a-table>
|
</template>
|
<template v-else>
|
<!--模板类型-->
|
<div>
|
<a-button style="margin-bottom: 10px;" type="primary" @click="typeShow">新建类型</a-button>
|
</div>
|
<a-table rowKey="id" ref="table" :pagination="false" size="default" :columns="typecolumns" :data-source="templateTypeList"
|
:loading="loading">
|
<span slot="typeaction" slot-scope="text, typerecord">
|
<a @click="updateType(typerecord)">修改</a>
|
|
|
<a-popconfirm title="是否确认删除?" ok-text="是" cancel-text="否" @confirm="delType(typerecord)">
|
<a>删除</a>
|
</a-popconfirm>
|
</span>
|
</a-table>
|
</template>
|
</a-card>
|
<SmsTemplateForm ref="smstemplateform" :classList="templateTypeList" :visible="visible" :model="mdl"
|
:loading="loading" @cancel="handleCancel" @ok="editTmplate" />
|
|
<TemplateTypeFrom ref="templatetypeform" :visible="typevisible" :model="typemdl" :loading="loading"
|
@cancel="typeCancel" @ok="editTmplateType" />
|
</page-header-wrapper>
|
</template>
|
|
<script>
|
import { ref } from 'vue'
|
import SmsTemplateForm from './modules/updatesmstemplateForm'
|
import TemplateTypeFrom from './modules/templateTypeForm'
|
import { GetTempleteForTempleteId, GetTempleteType, AddTemplete, UpdateTemplete, DeleteTempleteContent, AddTempleteType, UpdateTempleteType, DeleteTempleteType } from '@/api/smsapi'
|
const columns = [
|
{
|
title: '模板内容',
|
dataIndex: 'templetecontent',
|
ellipsis: true,
|
},
|
{
|
title: '分类',
|
dataIndex: 'templatetype'
|
},
|
|
{
|
title: '创建时间',
|
dataIndex: 'createtime'
|
},
|
|
{
|
title: '操作',
|
dataIndex: 'action',
|
scopedSlots: { customRender: 'action' }
|
}
|
]
|
|
const typecolumns = [
|
{
|
title: '类型名称',
|
dataIndex: 'typename'
|
},
|
{
|
title: '创建时间',
|
dataIndex: 'createtime'
|
},
|
|
{
|
title: '操作',
|
dataIndex: 'action',
|
scopedSlots: { customRender: 'typeaction' }
|
}
|
]
|
export default {
|
name: 'smstemplate',
|
components: {
|
SmsTemplateForm,
|
TemplateTypeFrom
|
},
|
data() {
|
return {
|
typevisible: false,
|
typemdl: {},
|
queryParam: {},
|
columns,
|
typecolumns,
|
mdl: {},
|
visible: false,
|
loading: false,
|
data: [],
|
templateTypeList: [],
|
tabList: [
|
{ key: 'template', tab: '模板管理' },
|
{ key: 'templatetype', tab: '模板类型' }
|
],
|
tabActiveKey: 'template',
|
pagination: {
|
current: 1,
|
pageSize: 10,
|
total: 0,
|
pageSizeOptions: ['10', '20'],
|
onChange: this.onPageChange,
|
onShowSizeChange: this.onPageChange
|
}
|
|
}
|
},
|
created() {
|
this.getTempleteType();
|
},
|
methods: {
|
typeCancel() {
|
this.typemdl = {};
|
this.typevisible = false;
|
},
|
delType(record) {
|
this.loading = true
|
const parameter = {
|
id: record.id
|
}
|
DeleteTempleteType(parameter).then(res => {
|
if (res.result) {
|
this.$message.success(`删除成功！`)
|
this.getTempleteType()
|
}
|
}).finally(() => {
|
this.loading = false
|
})
|
},
|
typeShow() {
|
this.typemdl = {};
|
this.typevisible = true;
|
},
|
//获取模板分类
|
getTempleteType() {
|
GetTempleteType({}).then(res => {
|
if (res.result) {
|
this.templateTypeList = res.result;
|
this.onSearch();
|
}
|
}).finally(() => {
|
})
|
},
|
handleCancel() {
|
this.mdl = {};
|
this.visible = false;
|
},
|
handleShow() {
|
this.mdl = {
|
templetecontent: ''
|
};
|
this.visible = true;
|
},
|
//删除
|
delTemplate(record) {
|
this.loading = true
|
const parameter = {
|
id: record.id
|
}
|
DeleteTempleteContent(parameter).then(res => {
|
if (res.result) {
|
this.$message.success(`删除成功！`)
|
this.onSearch()
|
}
|
}).finally(() => {
|
this.loading = false
|
})
|
},
|
updateType(record) {
|
this.typemdl = JSON.parse(JSON.stringify(record));
|
this.typevisible = true;
|
},
|
//修改
|
updateTemplate(record) {
|
this.mdl= JSON.parse(JSON.stringify(record));
|
this.visible = true;
|
},
|
editTmplateType() {
|
const form = this.$refs.templatetypeform.form
|
const data = this.$refs.templatetypeform.model
|
form.validateFields((errors, values) => {
|
if (!errors) {
|
this.loading = true
|
const parameter = {
|
typename: values.typename
|
}
|
if (this.mdl.id) {//修改
|
parameter.id = this.mdl.id;
|
UpdateTempleteType(parameter).then(res => {
|
if (res.result) {
|
this.$message.success(`修改成功！`)
|
this.typeCancel()
|
this.getTempleteType()
|
}
|
}).finally(() => {
|
this.loading = false
|
})
|
}
|
else {//新建
|
AddTempleteType(parameter).then(res => {
|
if (res.result) {
|
this.$message.success(`新建成功！`)
|
this.typeCancel()
|
this.getTempleteType()
|
}
|
}).finally(() => {
|
this.loading = false
|
})
|
}
|
|
}
|
})
|
},
|
//新建/修改模板
|
editTmplate() {
|
const form = this.$refs.smstemplateform.form
|
const data = this.$refs.smstemplateform.model
|
form.validateFields((errors, values) => {
|
if (!errors) {
|
this.loading = true
|
const parameter = {
|
templeteid: values.templeteid,
|
templetecontent: values.templetecontent
|
}
|
if (this.mdl.id) {//修改
|
parameter.id = this.mdl.id;
|
UpdateTemplete(parameter).then(res => {
|
if (res.result) {
|
this.$message.success(`修改成功！`)
|
this.handleCancel()
|
this.onSearch()
|
}
|
}).finally(() => {
|
this.loading = false
|
})
|
}
|
else {//新建
|
AddTemplete(parameter).then(res => {
|
if (res.result) {
|
this.$message.success(`新建成功！`)
|
this.handleCancel()
|
this.onSearch()
|
}
|
}).finally(() => {
|
this.loading = false
|
})
|
}
|
|
}
|
})
|
},
|
onSearch() {
|
this.loading = true
|
var parameter = {
|
TempleteId: '',
|
PageNo: this.pagination.current,
|
PageSize: this.pagination.pageSize,
|
}
|
GetTempleteForTempleteId(parameter).then(res => {
|
if (res.result.totalCount > 0) {
|
res.result.data.forEach(item => {
|
let cur = this.templateTypeList.filter(t => t.id == item.templeteid);
|
|
item.templatetype = cur && cur.length > 0 ? cur[0].typename : '未知';
|
})
|
}
|
this.data = res.result.data;
|
this.pagination.total = res.result.totalCount
|
|
}).finally(() => {
|
this.loading = false
|
})
|
}
|
|
}
|
}
|
</script>
|
|
