<template>
|
<page-header-wrapper :breadcrumb="false">
|
<a-card :bordered="false">
|
|
<div>
|
<a-button style="margin-bottom: 10px;" type="primary" @click="handleShow">新建充值包</a-button>
|
</div>
|
<a-table rowKey="id" ref="table" size="default" :columns="columns" :pagination="false" :data-source="data" :loading="loading">
|
<span slot="action" slot-scope="text, record">
|
<a @click="updatePackage(record)">修改</a>
|
|
|
<a-popconfirm title="是否确认删除?" ok-text="是" cancel-text="否" @confirm="delSmsPackage(record)">
|
<a>删除</a>
|
</a-popconfirm>
|
</span>
|
</a-table>
|
</a-card>
|
<PackageForm ref="packageModal" :visible="visible" :model="mdl" :loading="loading" @cancel="handleCancel"
|
@ok="addPackage" />
|
</page-header-wrapper>
|
</template>
|
|
<script>
|
import { ref } from 'vue'
|
import PackageForm from './modules/packageForm'
|
import { GetSmsPackage, AddSmsPackage, UpdateSmsPackage, DelSmsPackage } from '@/api/smsapi'
|
const columns = [
|
{
|
title: '充值金额(元)',
|
dataIndex: 'rechargeamount'
|
},
|
{
|
title: '充值条数',
|
dataIndex: 'rechargecount'
|
},
|
|
{
|
title: '创建时间',
|
dataIndex: 'createtime'
|
},
|
|
{
|
title: '操作',
|
dataIndex: 'action',
|
scopedSlots: { customRender: 'action' }
|
}
|
]
|
export default {
|
name: 'packagelist',
|
components: {
|
PackageForm
|
},
|
data() {
|
return {
|
queryParam: {},
|
columns,
|
mdl: {},
|
visible: false,
|
loading: false,
|
data: [],
|
|
}
|
},
|
setup() {
|
|
},
|
created() {
|
this.onSearch()
|
},
|
methods: {
|
handleCancel() {
|
this.mdl = {};
|
this.visible = false;
|
},
|
handleShow() {
|
this.visible = true;
|
},
|
//删除充值包
|
delSmsPackage(record) {
|
this.loading = true
|
const parameter = {
|
id: record.id
|
}
|
DelSmsPackage(parameter).then(res => {
|
if (res.result) {
|
this.$message.success(`删除成功！`)
|
this.onSearch()
|
}
|
}).finally(() => {
|
this.loading = false
|
})
|
},
|
//修改充值包
|
updatePackage(record) {
|
this.mdl = record;
|
this.handleShow();
|
},
|
//新建/修改充值包
|
addPackage() {
|
const form = this.$refs.packageModal.form
|
const data = this.$refs.packageModal.model
|
form.validateFields((errors, values) => {
|
if (!errors) {
|
if (this.checkPrice(values.rechargeamount)) {
|
this.$message.error(`请输入正确的金额,最多两位小数`)
|
return
|
}
|
this.loading = true
|
const parameter = {
|
rechargecount: values.rechargecount,
|
rechargeamount: values.rechargeamount
|
}
|
if (this.mdl.id) {//修改
|
parameter.id = this.mdl.id;
|
UpdateSmsPackage(parameter).then(res => {
|
if (res.result) {
|
this.$message.success(`修改成功！`)
|
this.handleCancel()
|
this.onSearch()
|
}
|
}).finally(() => {
|
this.loading = false
|
})
|
}
|
else {//新建
|
AddSmsPackage(parameter).then(res => {
|
if (res.result) {
|
this.$message.success(`新建成功！`)
|
this.handleCancel()
|
this.onSearch()
|
}
|
}).finally(() => {
|
this.loading = false
|
})
|
}
|
|
}
|
})
|
},
|
// 价格格式
|
checkPrice(price) {
|
return !/^(([1-9]{1}\d*)|(0{1}))(\.\d{1,2})?$/.test(price)
|
},
|
onSearch() {
|
this.loading = true
|
var parameter = {}
|
GetSmsPackage(parameter).then(res => {
|
this.data = res.result
|
//this.pagination.total = res.result.totalCount
|
}).finally(() => {
|
this.loading = false
|
})
|
}
|
|
}
|
}
|
</script>
|
|
