You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
305 lines
8.8 KiB
305 lines
8.8 KiB
<template>
|
|
<div style="margin:20px;padding:20px;background-color: #fff;">
|
|
<el-form :model="form" :rules="rules" ref="form" label-position="right" :label-width="formLabelWidth">
|
|
|
|
<el-row>
|
|
<el-col :span="24">
|
|
<div class="table-tree tableswidth">
|
|
<div style="display: flex;justify-content: space-between;margin-right: 20px;margin-bottom: 10px;">
|
|
<div style="font-size: 18px;color: #303133;">短信模板</div>
|
|
</div>
|
|
</div>
|
|
</el-col>
|
|
<el-col :span="24">
|
|
<el-form-item label="短信模板" prop="template_id">
|
|
<el-select v-model="form.template_id" placeholder="请选择短信模板" style="width:100%">
|
|
<el-option v-for="item in templateList" :key="item.value" :label="item.value" :value="item.id">
|
|
</el-option>
|
|
</el-select>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="24">
|
|
<div class="table-tree tableswidth">
|
|
<div style="display: flex;justify-content: space-between;margin-right: 20px;margin-bottom: 10px;">
|
|
<div style="font-size: 18px;color: #303133;">联系人手机号</div>
|
|
<Button type="primary" @click="mobileList.push({mobile:''})" size="small" style="margin-left: 10px;"
|
|
ghost>新增</Button>
|
|
</div>
|
|
<el-table :data="mobileList" height="200" class="v-table" style="width: 100%;margin-bottom: 20px;">
|
|
<el-table-column type="index" align="center">
|
|
</el-table-column>
|
|
<el-table-column prop="mobiles" label="手机号">
|
|
<template slot-scope="scope">
|
|
<el-input v-model="scope.row.mobile" placeholder="请填写接收短信联系人手机号" autocomplete="off"></el-input>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="操作" width="120px" align="center">
|
|
<template slot-scope="scope">
|
|
<!-- <el-input style="display: none;" type="hidden" v-model="scope.row.mobile"></el-input> -->
|
|
<Button type="error" @click="mobileList.splice(scope.$index,1)" size="small"
|
|
style="margin-left: 10px;" ghost>删除</Button>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table>
|
|
</div>
|
|
</el-col>
|
|
<el-col :span="24">
|
|
<div class="table-tree tableswidth">
|
|
<div style="display: flex;justify-content: space-between;margin-right: 20px;margin-bottom: 10px;">
|
|
<div style="font-size: 18px;color: #303133;">信息模板内容</div>
|
|
</div>
|
|
</div>
|
|
</el-col>
|
|
<el-col :span="24">
|
|
<el-form-item prop="name" label="活动/参观名称">
|
|
<el-input v-model="paramesObj.name" placeholder="请填写活动/参观名称" autocomplete="off"></el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="24">
|
|
<el-form-item prop="time" label="活动/参观时间">
|
|
<!-- <el-date-picker style="width:100%" v-model="form.parames.time" type="datetime"
|
|
value-format="yyyy-MM-dd HH:mm:ss" placeholder="选择活动/参观时间">
|
|
</el-date-picker> -->
|
|
<el-input v-model="paramesObj.time" placeholder="请填写活动/参观时间" autocomplete="off"></el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="24">
|
|
<el-form-item prop="address" label="活动/参观地址">
|
|
<el-input v-model="paramesObj.address" placeholder="请填写活动/参观地址" autocomplete="off"></el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
|
|
</el-row>
|
|
</el-form>
|
|
<div slot="footer" class="dialog-footer">
|
|
<el-button @click="resetForm('form')">取 消</el-button>
|
|
<el-button type="primary" @click="submitForm('form')">发 送</el-button>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import {
|
|
sendMessage
|
|
} from '@/api/order/message.js'
|
|
export default {
|
|
data() {
|
|
return {
|
|
form: {
|
|
mobile: [],
|
|
template_id: '',
|
|
parames: {}
|
|
},
|
|
mobileList: [{
|
|
mobile: '18936139616'
|
|
},
|
|
{
|
|
mobile: '18936139616'
|
|
},
|
|
{
|
|
mobile: '13913553385'
|
|
},
|
|
{
|
|
mobile: '15606250566'
|
|
},
|
|
{
|
|
mobile: '18936139616'
|
|
},
|
|
{
|
|
mobile: '18936139616'
|
|
},
|
|
{
|
|
mobile: '18896803717'
|
|
},
|
|
{
|
|
mobile: '13862131217'
|
|
},
|
|
{
|
|
mobile: '13771928980'
|
|
},
|
|
{
|
|
mobile: '13806212507'
|
|
},
|
|
{
|
|
mobile: '18012744431'
|
|
},
|
|
{
|
|
mobile: '18012744431'
|
|
},
|
|
{
|
|
mobile: '18012744431'
|
|
},
|
|
{
|
|
mobile: '18051218702'
|
|
},
|
|
{
|
|
mobile: '15850056828'
|
|
},
|
|
{
|
|
mobile: '15850056828'
|
|
},
|
|
{
|
|
mobile: '13915557940'
|
|
},
|
|
{
|
|
mobile: '15995808679'
|
|
},
|
|
{
|
|
mobile: '18626109888'
|
|
},
|
|
{
|
|
mobile: '15250505058'
|
|
},
|
|
{
|
|
mobile: '15250505058'
|
|
},
|
|
{
|
|
mobile: '13776110523'
|
|
},
|
|
{
|
|
mobile: '13776110523'
|
|
},
|
|
{
|
|
mobile: '13776034799'
|
|
},
|
|
{
|
|
mobile: '15895464925'
|
|
},
|
|
{
|
|
mobile: '17715140912'
|
|
},
|
|
{
|
|
mobile: '17751654868'
|
|
},
|
|
{
|
|
mobile: '13913171771'
|
|
},
|
|
{
|
|
mobile: '13913171771'
|
|
},
|
|
{
|
|
mobile: '13913171771'
|
|
},
|
|
{
|
|
mobile: '13664165211'
|
|
},
|
|
{
|
|
mobile: '13915572008'
|
|
},
|
|
{
|
|
mobile: '13915572008'
|
|
},
|
|
{
|
|
mobile: '15895360418'
|
|
},
|
|
{
|
|
mobile: '13861794258'
|
|
},
|
|
{
|
|
mobile: '15006195598'
|
|
},
|
|
{
|
|
mobile: '13814889016'
|
|
},
|
|
{
|
|
mobile: '15995892928'
|
|
},
|
|
{
|
|
mobile: '13913516430'
|
|
},
|
|
{
|
|
mobile: '15370072868'
|
|
},
|
|
{
|
|
mobile: '18852675993'
|
|
},
|
|
{
|
|
mobile: '18251371032'
|
|
},
|
|
{
|
|
mobile: '15962454958'
|
|
},
|
|
{
|
|
mobile: '13915422122'
|
|
},
|
|
{
|
|
mobile: '18896716581'
|
|
},
|
|
{
|
|
mobile: '15962180796'
|
|
},
|
|
{
|
|
mobile: '13913056555'
|
|
},
|
|
{
|
|
mobile: '13906222159'
|
|
},
|
|
{
|
|
mobile: '18915580967'
|
|
}
|
|
],
|
|
paramesObj: {
|
|
name: "乐益大讲堂”第二讲《中国载人航天》",
|
|
time: "5月2日(本周二)14:00-16:00",
|
|
address: "中共苏州独立支部旧址(体育场路4号)一楼报告厅"
|
|
},
|
|
rules: {
|
|
|
|
},
|
|
formLabelWidth: '120px',
|
|
templateList: [{
|
|
id: "8S8Pq1",
|
|
value: '活动短信0512-65166121'
|
|
},
|
|
{
|
|
id: 'L3Ewb3',
|
|
value: '活动短信0512-67701925'
|
|
}
|
|
]
|
|
|
|
}
|
|
},
|
|
methods: {
|
|
submitForm(formName) {
|
|
let that = this
|
|
console.log(this.form)
|
|
if (!this.form.template_id) {
|
|
that.$message.error('请选择短信模版');
|
|
return
|
|
}
|
|
if (this.mobileList.length < 1) {
|
|
that.$message.error('请填写联系人手机号');
|
|
return
|
|
}
|
|
for (var k of this.mobileList) {
|
|
this.form.mobile.push(k.mobile)
|
|
}
|
|
this.form.parames = this.paramesObj
|
|
console.log(this.form)
|
|
this.$refs[formName].validate((valid) => {
|
|
if (valid) {
|
|
sendMessage(that.form).then(response => {
|
|
this.$Message.success('发送成功');
|
|
that.resetForm('form')
|
|
}).catch(error => {})
|
|
|
|
} else {
|
|
this.$Message.error('数据校验失败');
|
|
return false;
|
|
}
|
|
});
|
|
|
|
|
|
|
|
},
|
|
resetForm(formName) {
|
|
this.mobileList = []
|
|
this.paramesObj = {}
|
|
this.$refs[formName].resetFields();
|
|
}
|
|
},
|
|
}
|
|
</script>
|
|
|
|
<style>
|
|
</style> |