319 lines
10 KiB
Vue
319 lines
10 KiB
Vue
<template>
|
||
<div class="app-container">
|
||
<el-card>
|
||
<h2 style="margin-bottom: 20px">创建推送任务</h2>
|
||
<el-form :model="form" ref="form" label-width="120px" :rules="rules">
|
||
<el-form-item label="任务名称" prop="manageRouteName">
|
||
<el-input
|
||
v-model="form.manageRouteName"
|
||
placeholder="请输入任务名称"
|
||
style="width: 200px"
|
||
/>
|
||
</el-form-item>
|
||
<!-- <el-form-item label="指定时间" prop="nodePlanTime">
|
||
<el-date-picker
|
||
v-model="form.nodePlanTime"
|
||
type="datetime"
|
||
value-format="yyyy-MM-dd HH:mm:ss"
|
||
placeholder="请选择指定时间"
|
||
:picker-options="pickerOptions"
|
||
style="width: 200px"
|
||
/>
|
||
</el-form-item> -->
|
||
<el-form-item label="任务节点类型" prop="batchTaskSource">
|
||
<el-radio-group v-model="form.batchTaskSource">
|
||
<el-radio label="telephone">电话外呼</el-radio>
|
||
<el-radio label="message">短信推送</el-radio>
|
||
</el-radio-group>
|
||
</el-form-item>
|
||
|
||
<!-- 电话外呼部分 -->
|
||
<template v-if="form.batchTaskSource === 'telephone'">
|
||
<el-form-item label="话术模板" prop="phoneTemplate">
|
||
<scripts
|
||
@on-template="handlePhoneTemplateSelect"
|
||
:templateId="form.phoneTemplateId"
|
||
:node="form.phoneDialMethod"
|
||
:templateName="form.phoneTemplate"
|
||
></scripts>
|
||
</el-form-item>
|
||
<el-form-item label="话术简介" prop="phoneDesc">
|
||
<el-input
|
||
v-model="form.phoneNodeContent"
|
||
type="textarea"
|
||
placeholder="话术简介"
|
||
autosize
|
||
disabled
|
||
/>
|
||
</el-form-item>
|
||
<!-- <el-form-item label="话术变量" prop="phoneVars">
|
||
<el-input
|
||
v-model="form.phoneVars"
|
||
type="textarea"
|
||
placeholder="请输入话术变量（如有多个请用逗号分隔）"
|
||
/>
|
||
</el-form-item> -->
|
||
<el-form-item label="重播次数" prop="phoneRedialTimes">
|
||
<el-select v-model="form.phoneRedialTimes" style="width: 200px">
|
||
<el-option
|
||
v-for="item in optionslisttime"
|
||
:key="item.dictValue"
|
||
:label="item.dictLabel"
|
||
:value="item.dictValue"
|
||
>
|
||
</el-option>
|
||
</el-select>
|
||
</el-form-item>
|
||
<el-form-item label="时间间隔(分)" prop="phoneTimeInterval">
|
||
<el-input
|
||
v-model.number="form.phoneTimeInterval"
|
||
oninput="value=value.replace(/[^\d]/g,'')"
|
||
style="width: 200px"
|
||
/>
|
||
</el-form-item>
|
||
</template>
|
||
|
||
<!-- 短信推送部分 -->
|
||
<template v-if="form.batchTaskSource === 'message'">
|
||
<el-form-item label="短信模板" prop="smsTemplate">
|
||
<message
|
||
@on-template="handleSmsTemplateSelect"
|
||
:templateId="form.smsTemplateId"
|
||
:templateName="form.smsTemplate"
|
||
></message>
|
||
</el-form-item>
|
||
<el-form-item label="短信简介" prop="messageNodeContent">
|
||
<el-input
|
||
v-model="form.messageNodeContent"
|
||
type="textarea"
|
||
placeholder="短信简介"
|
||
autosize
|
||
disabled
|
||
/>
|
||
</el-form-item>
|
||
<el-form-item label="短信变量" v-if="smsVarsVisible">
|
||
<div
|
||
style="
|
||
display: flex;
|
||
gap: 12px;
|
||
align-items: center;
|
||
flex-wrap: wrap;
|
||
"
|
||
>
|
||
<div
|
||
v-for="key in smsVarKeys"
|
||
:key="key"
|
||
style="display: flex; align-items: center; gap: 8px"
|
||
>
|
||
<el-form-item :label="key">
|
||
<el-input
|
||
v-model="form.vars[key]"
|
||
:placeholder="'请输入' + key"
|
||
style="width: 200px"
|
||
/>
|
||
</el-form-item>
|
||
</div>
|
||
</div>
|
||
</el-form-item>
|
||
</template>
|
||
|
||
<el-form-item>
|
||
<el-button type="primary" @click="handleSubmit">保存</el-button>
|
||
</el-form-item>
|
||
</el-form>
|
||
</el-card>
|
||
</div>
|
||
</template>
|
||
|
||
<script>
|
||
import scripts from "../components/script.vue";
|
||
import message from "../components/message.vue";
|
||
import { getAgencytype } from "@/api/system/agency";
|
||
import {
|
||
AllBatchSendTaskInfo,
|
||
generatePushTask,
|
||
} from "@/api/system/batchSendTaskInfo";
|
||
|
||
export default {
|
||
name: "CreatePushTask",
|
||
components: { scripts, message },
|
||
data() {
|
||
return {
|
||
rules: {
|
||
manageRouteName: [
|
||
{ required: true, message: "任务名称不能为空", trigger: "blur" },
|
||
],
|
||
// nodePlanTime: [
|
||
// { required: true, message: "指定时间不能为空", trigger: "change" },
|
||
// ],
|
||
batchTaskSource: [
|
||
{
|
||
required: true,
|
||
message: "任务节点类型不能为空",
|
||
trigger: "change",
|
||
},
|
||
],
|
||
},
|
||
pickerOptions: {
|
||
disabledDate(time) {
|
||
return time.getTime() < Date.now() - 8.64e7;
|
||
},
|
||
},
|
||
optionslisttime: [],
|
||
smsVarsVisible: false,
|
||
smsVarKeys: [],
|
||
form: {
|
||
manageRouteName: "",
|
||
nodePlanTime: "",
|
||
batchTaskSource: "",
|
||
phoneDialMethod: "AI",
|
||
phoneTemplateId: "",
|
||
phoneTemplate: "",
|
||
phoneNodeContent: "",
|
||
scriptInfoId: "",
|
||
robotPublishId: "",
|
||
phoneTemplateName: "",
|
||
phoneDesc: "",
|
||
phoneVars: "",
|
||
phoneRedialTimes: "",
|
||
phoneTimeInterval: "",
|
||
smsTemplateId: "",
|
||
smsTemplate: "",
|
||
messageTemplateId: "",
|
||
messageTemplateCode: "",
|
||
messageTemplateName: "",
|
||
messageNodeContent: "",
|
||
physicalExaminationLabel: "",
|
||
vars: {},
|
||
list: [],
|
||
},
|
||
};
|
||
},
|
||
created() {
|
||
this.infolistMESSAGE();
|
||
this.form.physicalExaminationLabel =
|
||
this.$route.query.physicalExaminationLabel || "";
|
||
AllBatchSendTaskInfo(this.$route.query).then((res) => {
|
||
this.form.list = res || [];
|
||
});
|
||
},
|
||
mounted() {},
|
||
methods: {
|
||
infolistMESSAGE() {
|
||
const dictType = "redial_times";
|
||
getAgencytype(dictType).then((res) => {
|
||
this.optionslisttime = res.data || [];
|
||
});
|
||
},
|
||
handlePhoneTemplateSelect(item) {
|
||
this.form.phoneTemplateId = item.phoneTemplateId || "";
|
||
this.form.phoneTemplate = item.templateName || "";
|
||
this.form.phoneNodeContent = item.templateContent || "";
|
||
this.form.robotPublishId = item.robotPublishId || "";
|
||
this.form.phoneTemplateName = item.templateName || "";
|
||
this.form.scriptInfoId = item.scriptInfoId || "";
|
||
},
|
||
handleSmsTemplateSelect(item) {
|
||
this.form.smsTemplateId = item.templateId || "";
|
||
this.form.smsTemplate = item.templateName || "";
|
||
this.form.messageTemplateId = item.templateId || "";
|
||
this.form.messageTemplateCode = item.messageTemplateCode || "";
|
||
this.form.messageTemplateName = item.templateName || "";
|
||
this.form.messageNodeContent = item.templateContent || "";
|
||
const variablesStr = item.variables;
|
||
if (variablesStr && String(variablesStr).trim() !== "") {
|
||
const keys = String(variablesStr)
|
||
.split("|")
|
||
.map((s) => s.trim())
|
||
.filter(Boolean);
|
||
|
||
this.smsVarsVisible = keys.length > 0;
|
||
this.smsVarKeys = keys;
|
||
|
||
const keySet = new Set(keys);
|
||
|
||
// 写入模板变量占位符（例如 month|day）
|
||
keys.forEach((key) => {
|
||
if (this.form.vars[key] === undefined)
|
||
this.$set(this.form.vars, key, "");
|
||
});
|
||
|
||
// 清理不在模板变量里的旧值，避免沿用旧模板变量
|
||
Object.keys(this.form.vars).forEach((existingKey) => {
|
||
if (!keySet.has(existingKey))
|
||
this.$delete(this.form.vars, existingKey);
|
||
});
|
||
} else {
|
||
this.smsVarsVisible = false;
|
||
this.smsVarKeys = [];
|
||
Object.keys(this.form.vars).forEach((existingKey) => {
|
||
this.$delete(this.form.vars, existingKey);
|
||
});
|
||
}
|
||
},
|
||
handleSubmit() {
|
||
this.$refs.form.validate((valid) => {
|
||
if (valid) {
|
||
if (
|
||
this.form.batchTaskSource == "message" &&
|
||
!this.form.messageTemplateName
|
||
) {
|
||
this.$message.error("请选择短信模板");
|
||
return;
|
||
}
|
||
if (
|
||
this.form.batchTaskSource == "telephone" &&
|
||
!this.form.phoneTemplateName
|
||
) {
|
||
this.$message.error("请选择话术模板");
|
||
return;
|
||
}
|
||
const loading = this.$loading({
|
||
lock: true,
|
||
text: "加载中",
|
||
spinner: "el-icon-loading",
|
||
background: "rgba(0, 0, 0, 0.7)",
|
||
});
|
||
// 获取此时时间，并格式化为 yyyy-MM-dd HH:mm:ss
|
||
const now = new Date();
|
||
const pad = (value) => String(value).padStart(2, "0");
|
||
this.form.nodePlanTime = `${now.getFullYear()}-${pad(
|
||
now.getMonth() + 1
|
||
)}-${pad(now.getDate())} ${pad(now.getHours())}:${pad(
|
||
now.getMinutes()
|
||
)}:${pad(now.getSeconds())}`;
|
||
|
||
generatePushTask(this.form).then((res) => {
|
||
loading.close();
|
||
if (res.code == 200) {
|
||
this.$message.success(res.msg);
|
||
// 延迟2秒后关闭当前页面并刷新上一个页面的标签页
|
||
setTimeout(() => {
|
||
this.$store
|
||
.dispatch("tagsView/delView", this.$route)
|
||
.then(() => {
|
||
this.$router.go(-1);
|
||
});
|
||
}, 2000);
|
||
}
|
||
});
|
||
}
|
||
});
|
||
},
|
||
},
|
||
};
|
||
</script>
|
||
|
||
<style scoped>
|
||
.app-container {
|
||
padding: 24px;
|
||
}
|
||
|
||
::v-deep .el-form-item__label {
|
||
font-size: 16px !important;
|
||
}
|
||
.el-textarea {
|
||
font-size: 16px;
|
||
}
|
||
</style>
|