714 lines
20 KiB
Vue
714 lines
20 KiB
Vue
<template>
|
||
<div>
|
||
<div class="title">
|
||
<div slot="footer" class="dialog-footer">
|
||
<el-button type="primary" @click="upload">保存</el-button>
|
||
</div>
|
||
<el-descriptions title="手动创建任务"> </el-descriptions>
|
||
<el-form
|
||
:inline="true"
|
||
:model="updata"
|
||
class="demo-form-inline"
|
||
ref="updata"
|
||
>
|
||
<el-form-item label="任务名称">
|
||
<el-input v-model="updata.routeName"></el-input>
|
||
</el-form-item>
|
||
<el-form-item label="适用范围">
|
||
<el-select v-model="updata.suitRange" @change="changeoptions">
|
||
<el-option
|
||
v-for="item in options"
|
||
:key="item.dictValue"
|
||
:label="item.dictLabel"
|
||
:value="item.dictValue"
|
||
>
|
||
</el-option>
|
||
</el-select>
|
||
</el-form-item>
|
||
</el-form>
|
||
<div class="chufatitle">
|
||
<span>触发条件</span>
|
||
<el-button type="primary" plain size="mini" @click="addtriggerCondition"
|
||
>添加触发条件</el-button
|
||
>
|
||
</div>
|
||
<el-form ref="updata" :model="updata" label-width="80px">
|
||
<div
|
||
class="node"
|
||
v-for="(item, index) in updata.triggerConditionList"
|
||
:key="index"
|
||
:style="updata.triggerConditionList.length > 1 ? '' : 'margin:0'"
|
||
>
|
||
<div
|
||
style="display: inline-block; margin-right: 20px; font-size: 14px"
|
||
>
|
||
触发条件{{ index + 1 }}
|
||
</div>
|
||
<el-select v-model="item.triggerConditionName" style="width: 120px">
|
||
<el-option label="诊断" value="DIAGNOSIS" />
|
||
<el-option label="换药日期" value="DRESSING_CHANGE_DATE" />
|
||
<el-option label="治疗方式" value="TREATMENT_METHOD" />
|
||
<el-option label="手术名称" value="SURGICAL_NAME" />
|
||
<el-option label="药品名称" value="DRUG_NAME" />
|
||
</el-select>
|
||
<el-select
|
||
v-model="item.triggerConditionOperator"
|
||
style="width: 100px"
|
||
>
|
||
<el-option label="包含" value="CONTAIN" />
|
||
<el-option label="不包含" value="NOT_CONTAIN" />
|
||
<el-option label="等于" value="EQUAL_TO" />
|
||
<el-option label="不等于" value="NOT_EQUAL_TO" />
|
||
</el-select>
|
||
<el-input
|
||
v-model="item.triggerConditionValue"
|
||
style="width: 300px"
|
||
placeholder="请输入触发条件"
|
||
></el-input>
|
||
<i
|
||
class="el-icon-delete"
|
||
@click="delitem(item, index, updata.triggerConditionList)"
|
||
></i>
|
||
</div>
|
||
</el-form>
|
||
</div>
|
||
<div class="nodes">
|
||
<div class="nodenames">
|
||
<div class="timetitle">
|
||
管理路径节点({{ list.length }})
|
||
<i class="el-icon-circle-plus-outline" @click="additem"></i>
|
||
</div>
|
||
<el-timeline>
|
||
<el-timeline-item
|
||
v-for="(item, index) in list"
|
||
:key="index"
|
||
:color="listindex == index ? '#409EFF' : ''"
|
||
@click.native="clicktimelineitem(item, index)"
|
||
>
|
||
<div class="top">
|
||
<div class="toptop">
|
||
<el-select style="width: 100px" v-model="item.routeNodeName">
|
||
<el-option
|
||
v-for="item in parentDictCodelist"
|
||
:key="item.dictValue"
|
||
:label="item.dictLabel"
|
||
:value="item.dictValue"
|
||
>
|
||
</el-option>
|
||
</el-select>
|
||
<el-input
|
||
style="width: 90px"
|
||
v-model="item.routeNodeDay"
|
||
type="number"
|
||
></el-input>
|
||
<span>天</span>
|
||
</div>
|
||
<div>
|
||
<i
|
||
class="el-icon-delete"
|
||
@click="delitem(item, index, list)"
|
||
></i>
|
||
</div>
|
||
</div>
|
||
<el-card :class="listindex == index ? 'cards' : ''">
|
||
<h3 style="height: 20px">
|
||
{{ item.taskType == "PHONE_OUTBOUND" ? "电话外呼" : "" }}
|
||
{{ item.taskType == "QUESTIONNAIRE_SCALE" ? "问卷量表" : "" }}
|
||
{{ item.taskType == "PROPAGANDA_ARTICLE" ? "宣教文案" : "" }}
|
||
{{ item.taskType == "TEXT_REMIND" ? "文字提醒" : "" }}
|
||
{{ item.taskType == "ARTIFICIAL_FOLLOW_UP" ? "人工随访" : "" }}
|
||
</h3>
|
||
</el-card>
|
||
</el-timeline-item>
|
||
</el-timeline>
|
||
</div>
|
||
<div class="nodetexts">
|
||
<div
|
||
style="background-color: #fff; border-radius: 10px; padding: 20px"
|
||
:style="formInline.taskType == 'TEXT_REMIND' ? '' : 'height:160px'"
|
||
>
|
||
<el-form :model="formInline" class="demo-form-inline">
|
||
<el-form-item label="任务内容">
|
||
<el-radio-group v-model="formInline.taskType">
|
||
<el-radio label="PHONE_OUTBOUND">电话外呼</el-radio>
|
||
<el-radio label="QUESTIONNAIRE_SCALE">问卷量表</el-radio>
|
||
<el-radio label="PROPAGANDA_ARTICLE">宣教文案</el-radio>
|
||
<el-radio label="TEXT_REMIND">文字提醒</el-radio>
|
||
<el-radio label="ARTIFICIAL_FOLLOW_UP">人工随访</el-radio>
|
||
</el-radio-group>
|
||
</el-form-item>
|
||
<!-- <el-form-item
|
||
label="电话模板"
|
||
v-if="formInline.taskType == 'PHONE_OUTBOUND'"
|
||
>
|
||
<scriptphone @on-template="scriptphoneontemplate"></scriptphone>
|
||
</el-form-item> -->
|
||
<el-form-item
|
||
label="宣教模板"
|
||
v-if="formInline.taskType == 'PROPAGANDA_ARTICLE'"
|
||
>
|
||
<propaganda @on-template="propagandaontemplate"></propaganda>
|
||
</el-form-item>
|
||
<el-form-item
|
||
label="提醒内容"
|
||
v-if="formInline.taskType == 'TEXT_REMIND'"
|
||
>
|
||
<el-input
|
||
type="textarea"
|
||
v-model="formInline.textRemindContent"
|
||
:rows="6"
|
||
placeholder="请输入内容"
|
||
/>
|
||
</el-form-item>
|
||
<el-form-item
|
||
label="人工随访模板"
|
||
v-if="formInline.taskType == 'ARTIFICIAL_FOLLOW_UP'"
|
||
>
|
||
<question @on-template="questionontemplate"></question>
|
||
</el-form-item>
|
||
</el-form>
|
||
<el-form
|
||
:model="formInline"
|
||
class="demo-form-inline"
|
||
:inline="true"
|
||
v-if="formInline.taskType == 'QUESTIONNAIRE_SCALE'"
|
||
>
|
||
<el-form-item label="问卷模板">
|
||
<question @on-template="questionontemplate"></question>
|
||
</el-form-item>
|
||
<el-form-item label="问卷有效期">
|
||
<el-input-number
|
||
v-model="formInline.questionExpirationDate"
|
||
:min="1"
|
||
:max="99"
|
||
label="描述文字"
|
||
></el-input-number>
|
||
天
|
||
</el-form-item>
|
||
</el-form>
|
||
</div>
|
||
<div
|
||
v-if="
|
||
formInline.taskType == 'TEXT_REMIND' ||
|
||
formInline.taskType == 'PROPAGANDA_ARTICLE' ||
|
||
formInline.taskType == 'QUESTIONNAIRE_SCALE'
|
||
"
|
||
>
|
||
<div class="PushMethod">
|
||
<span>推送方式：短信</span>
|
||
<el-switch
|
||
v-model="formInline.messagePushSign"
|
||
active-color="#13ce66"
|
||
active-value="1"
|
||
inactive-value="0"
|
||
>
|
||
</el-switch>
|
||
</div>
|
||
<div class="PushMethod">
|
||
<span>推送方式：公众号</span>
|
||
<el-switch
|
||
v-model="formInline.officialPushSign"
|
||
active-color="#13ce66"
|
||
active-value="1"
|
||
inactive-value="0"
|
||
>
|
||
</el-switch>
|
||
</div>
|
||
<div class="PushMethod">
|
||
<span>推送方式：小程序</span>
|
||
<el-switch
|
||
v-model="formInline.appletPushSign"
|
||
active-color="#13ce66"
|
||
active-value="1"
|
||
inactive-value="0"
|
||
>
|
||
</el-switch>
|
||
</div>
|
||
</div>
|
||
<div
|
||
class="PushMethodrg"
|
||
v-if="formInline.taskType == 'PHONE_OUTBOUND'"
|
||
>
|
||
<div class="flex">
|
||
<div class="itemlist">
|
||
推送方式：
|
||
<span> 人工电话 </span>
|
||
</div>
|
||
<div class="itemlist">
|
||
模板：
|
||
<scripts
|
||
@on-template="messageontemplateword"
|
||
:templateId="formInline.phoneId"
|
||
:templateName="formInline.phoneTemplateName"
|
||
></scripts>
|
||
</div>
|
||
<div class="itemlist">
|
||
<el-switch
|
||
v-model="formInline.phonePushSign"
|
||
active-color="#13ce66"
|
||
active-value="1"
|
||
inactive-value="0"
|
||
>
|
||
</el-switch>
|
||
</div>
|
||
</div>
|
||
<div class="flex">
|
||
<div class="itemlist">
|
||
重播次数：
|
||
<span>
|
||
<el-select
|
||
v-model="formInline.phoneRedialTimes"
|
||
style="width: 100px"
|
||
>
|
||
<el-option
|
||
v-for="item in optionslistS"
|
||
:key="item.dictValue"
|
||
:label="item.dictLabel"
|
||
:value="item.dictValue"
|
||
>
|
||
</el-option>
|
||
</el-select>
|
||
</span>
|
||
</div>
|
||
<div class="itemlist">
|
||
时间间隔:
|
||
<span>
|
||
<el-input
|
||
v-model.number="formInline.phoneTimeInterval"
|
||
oninput="value=value.replace(/[^\d]/g,'')"
|
||
style="width: 100px"
|
||
>
|
||
</el-input>
|
||
</span>
|
||
</div>
|
||
<div class="itemlist">
|
||
短信提醒：
|
||
<el-select
|
||
v-model="formInline.phoneMessageRemind"
|
||
style="width: 150px"
|
||
>
|
||
<el-option
|
||
v-for="item in optionslist"
|
||
:key="item.dictValue"
|
||
:label="item.dictLabel"
|
||
:value="item.dictValue"
|
||
>
|
||
</el-option>
|
||
</el-select>
|
||
</div>
|
||
<div class="itemlist">
|
||
短信模板：
|
||
<span
|
||
class="spanname"
|
||
v-if="formInline.phoneMessageRemind == 'NOT_SEND_MESSAGE'"
|
||
>
|
||
<message
|
||
style="width: 200px"
|
||
@on-template="messageontemplateMESSAGE"
|
||
:templateId="formInline.phoneMessageTemplateId"
|
||
:templateName="formInline.phoneMessageTemplateName"
|
||
></message>
|
||
</span>
|
||
<span v-else>
|
||
<message
|
||
style="width: 200px"
|
||
@on-template="messageontemplateMESSAGE"
|
||
:templateId="formInline.phoneMessageTemplateId"
|
||
:templateName="formInline.phoneMessageTemplateName"
|
||
></message>
|
||
</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
|
||
</div>
|
||
</div>
|
||
</template>
|
||
|
||
<script>
|
||
import propaganda from "../components/propaganda.vue";
|
||
import scriptphone from "../components/script.vue";
|
||
import scripts from '../components/script.vue'
|
||
import message from '../components/message.vue'
|
||
import question from "../components/question.vue";
|
||
import { signrouteadd } from "@/api/system/ManuallyCreatingTasks";
|
||
import { getAgencytype } from "@/api/system/agency";
|
||
import { list } from "@/api/system/specialDiseaseNode";
|
||
|
||
export default {
|
||
components: { scriptphone, question, propaganda, scripts, message },
|
||
name: "ManuallyCreatingTasks",
|
||
data() {
|
||
return {
|
||
options: [],
|
||
optionslist: [],
|
||
optionslistS: [],
|
||
parentDictCodelist: [],
|
||
updata: {
|
||
signPatientRecordId: "",
|
||
patientId: "",
|
||
patientName: "",
|
||
departmentId: "",
|
||
departmentName: "",
|
||
routeName: "",
|
||
suitRange: "",
|
||
routeNodeList: [],
|
||
triggerConditionList: [
|
||
{
|
||
routeId: "",
|
||
routeName: "",
|
||
triggerConditionName: "",
|
||
triggerConditionOperator: "",
|
||
triggerConditionValue: "",
|
||
},
|
||
],
|
||
},
|
||
formInline: {
|
||
routeNodeDay: "",
|
||
taskType: "",
|
||
routeNodeName: "",
|
||
questionExpirationDate: 7,
|
||
questionInfoId: "",
|
||
questionnaireName: "",
|
||
phoneId: "",
|
||
phoneTemplateName: "",
|
||
propagandaInfoId: "",
|
||
propagandaTitle: "",
|
||
textRemindContent: "",
|
||
officialPushSign: "0",
|
||
messagePushSign: "0",
|
||
appletPushSign: "0",
|
||
phonePushSign: "0",
|
||
},
|
||
list: [
|
||
{
|
||
routeNodeDay: "",
|
||
taskType: "",
|
||
routeNodeName: "",
|
||
questionExpirationDate: 7,
|
||
questionInfoId: "",
|
||
questionnaireName: "",
|
||
phoneId: "",
|
||
phoneTemplateName: "",
|
||
propagandaInfoId: "",
|
||
propagandaTitle: "",
|
||
textRemindContent: "",
|
||
officialPushSign: "0",
|
||
messagePushSign: "0",
|
||
appletPushSign: "0",
|
||
phonePushSign: "0",
|
||
},
|
||
],
|
||
listindex: 0,
|
||
};
|
||
},
|
||
created() {
|
||
this.infolist();
|
||
this.infolistword();
|
||
this.infolistMESSAGE();
|
||
this.formInline = this.list[0];
|
||
this.updata.signPatientRecordId = this.$route.query.signPatientRecordId;
|
||
this.updata.patientId = this.$route.query.patientId;
|
||
this.updata.patientName = this.$route.query.patientName;
|
||
this.updata.departmentId = this.$route.query.departmentId;
|
||
this.updata.departmentName = this.$route.query.departmentName;
|
||
},
|
||
methods: {
|
||
infolist() {
|
||
var dictType = "suit_range";
|
||
getAgencytype(dictType).then((res) => {
|
||
this.options = res.data;
|
||
});
|
||
},
|
||
infolistword() {
|
||
var dictType = "text_message_remind";
|
||
getAgencytype(dictType).then((res) => {
|
||
this.optionslist = res.data;
|
||
// this.taskinfo();
|
||
});
|
||
},
|
||
infolistMESSAGE() {
|
||
var dictType = "redial_times";
|
||
getAgencytype(dictType).then((res) => {
|
||
this.optionslistS = res.data;
|
||
// this.taskinfo();
|
||
});
|
||
},
|
||
changeoptions(e) {
|
||
this.parentDictCode = this.options.find((el) => el.dictValue == e).dictCode;
|
||
this.changelisy();
|
||
},
|
||
changelisy() {
|
||
list(this.parentDictCode).then((res) => {
|
||
this.parentDictCodelist = res.rows;
|
||
});
|
||
},
|
||
addtriggerCondition() {
|
||
this.updata.triggerConditionList.push({
|
||
routeId: "",
|
||
routeName: "",
|
||
triggerConditionName: "",
|
||
triggerConditionOperator: "",
|
||
triggerConditionValue: "",
|
||
});
|
||
},
|
||
//宣教传值
|
||
propagandaontemplate(item) {
|
||
this.formInline.propagandaInfoId = item.templateId;
|
||
this.formInline.propagandaTitle = item.templateName;
|
||
},
|
||
//问卷传值
|
||
questionontemplate(item) {
|
||
if (this.formInline.taskType == "ARTIFICIAL_FOLLOW_UP") {
|
||
this.formInline.followTemplateId = item.templateId;
|
||
this.formInline.followTemplateName = item.templateName;
|
||
} else {
|
||
this.formInline.questionInfoId = item.templateId;
|
||
this.formInline.questionnaireName = item.templateName;
|
||
}
|
||
},
|
||
//话术传值
|
||
scriptphoneontemplate(item) {
|
||
this.formInline.phoneId = item.templateId;
|
||
this.formInline.phoneTemplateName = item.templateName;
|
||
},
|
||
// 短信
|
||
messageontemplateMESSAGE(item) {
|
||
this.formInline.phoneMessageTemplateId = item.templateId;
|
||
this.formInline.phoneMessageTemplateName = item.templateName;
|
||
this.formInline.messagePreview = item.templateContent;
|
||
},
|
||
// 话术
|
||
messageontemplateword(item) {
|
||
this.formInline.phoneId = item.templateId;
|
||
this.formInline.phoneTemplateName = item.templateName;
|
||
// this.form.messagePreview = item.templateContent;
|
||
},
|
||
clicktimelineitem(item, index) {
|
||
this.formInline = item;
|
||
this.listindex = index;
|
||
},
|
||
additem(item) {
|
||
list(this.parentDictCode).then((res) => {
|
||
res.rows.forEach((e) => {
|
||
this.list.forEach((el) => {
|
||
el.routeNodeName = e.dictLabel;
|
||
});
|
||
});
|
||
});
|
||
this.list.push({
|
||
routeNodeDay: "",
|
||
taskType: "",
|
||
routeNodeName: "",
|
||
questionExpirationDate: 7,
|
||
questionInfoId: "",
|
||
questionnaireName: "",
|
||
phoneId: "",
|
||
phoneTemplateName: "",
|
||
propagandaInfoId: "",
|
||
propagandaTitle: "",
|
||
textRemindContent: "",
|
||
officialPushSign: "0",
|
||
messagePushSign: "0",
|
||
appletPushSign: "0",
|
||
phonePushSign: "0",
|
||
});
|
||
},
|
||
delitem(item, index, list) {
|
||
list.splice(index, 1);
|
||
},
|
||
upload() {
|
||
this.updata.routeNodeList = this.list;
|
||
// console.log(this.updata,'this.updata')
|
||
// return
|
||
signrouteadd(this.updata).then((res) => {
|
||
this.$notify({
|
||
type: "success",
|
||
title: "提示",
|
||
message: "保存成功,即将返回签约患者列表",
|
||
duration: 3000,
|
||
});
|
||
setTimeout(() => {
|
||
this.$store
|
||
.dispatch("tagsView/delView", this.$route)
|
||
.then(({ visitedViews }) => {
|
||
this.$router.push({
|
||
path: "/patient/signRecord",
|
||
});
|
||
});
|
||
}, 3000);
|
||
});
|
||
},
|
||
},
|
||
};
|
||
</script>
|
||
<style lang="scss" scoped>
|
||
.chufatitle {
|
||
display: flex;
|
||
align-items: center;
|
||
margin-bottom: 20px;
|
||
|
||
span {
|
||
margin-right: 30px;
|
||
font-size: 16px;
|
||
font-weight: bold;
|
||
}
|
||
}
|
||
.PushMethodrg {
|
||
background-color: #fff;
|
||
width: 100%;
|
||
height: 200px;
|
||
margin: 20px 0 0;
|
||
padding: 20px 50px 0px 20px;
|
||
border-radius: 10px;
|
||
|
||
|
||
|
||
.flex {
|
||
display: flex;
|
||
width: 100%;
|
||
align-items: center;
|
||
// background: red;
|
||
justify-content: space-between;
|
||
|
||
.itemlist {
|
||
height: 30px;
|
||
margin-top: 30px;
|
||
line-height: 30px;
|
||
font-size: 13px;
|
||
color: #64666a;
|
||
.spanname {
|
||
pointer-events: none;
|
||
}
|
||
::v-deep .el-input__inner {
|
||
color: black;
|
||
font-size: 13px;
|
||
}
|
||
|
||
span {
|
||
color: black;
|
||
font-size: 13px;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.node {
|
||
margin-bottom: 10px;
|
||
|
||
.el-icon-delete {
|
||
padding-left: 10px;
|
||
}
|
||
}
|
||
|
||
.PushMethod {
|
||
height: 100px;
|
||
padding: 20px;
|
||
line-height: 60px;
|
||
margin-top: 10px;
|
||
border-radius: 10px;
|
||
background-color: #fff;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
}
|
||
|
||
.title {
|
||
padding: 20px;
|
||
}
|
||
|
||
.nodes {
|
||
background-color: #f1f3f5;
|
||
// height: 700px;
|
||
height: calc(100vh - 308px);
|
||
display: flex;
|
||
justify-content: space-between;
|
||
padding-top: 20px;
|
||
|
||
.nodenames {
|
||
border-radius: 10px;
|
||
background-color: #fff;
|
||
height: calc(100vh - 308px);
|
||
width: 25%;
|
||
padding: 0 40px 20px 40px;
|
||
background-color: #fff;
|
||
overflow: scroll;
|
||
|
||
.timetitle {
|
||
height: 60px;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
}
|
||
|
||
::v-deep .el-timeline {
|
||
width: 100%;
|
||
padding: 15px 0 0 !important;
|
||
}
|
||
}
|
||
|
||
.nodetexts {
|
||
padding-bottom: 20px;
|
||
overflow: scroll;
|
||
border-radius: 10px;
|
||
width: 73%;
|
||
height: calc(100vh - 308px);
|
||
}
|
||
}
|
||
|
||
.top {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
|
||
.toptop {
|
||
display: flex;
|
||
align-items: center;
|
||
}
|
||
|
||
span {
|
||
padding: 0 4px;
|
||
}
|
||
|
||
i {
|
||
font-size: 17px;
|
||
}
|
||
|
||
i:nth-child(2) {
|
||
padding-left: 12px;
|
||
}
|
||
}
|
||
|
||
::v-deep .el-timeline-item__timestamp {
|
||
margin: 0 !important;
|
||
padding: 0 !important;
|
||
}
|
||
|
||
.cards {
|
||
border: 1px solid #409eff;
|
||
border-left: 5px solid #409eff;
|
||
}
|
||
|
||
::v-deep .el-timeline-item__wrapper {
|
||
padding-left: 20px !important;
|
||
}
|
||
|
||
::v-deep .el-timeline-item__content {
|
||
transform: translateY(-2%);
|
||
}
|
||
|
||
::v-deep .el-card {
|
||
margin-top: 20px !important;
|
||
}
|
||
|
||
.dialog-footer {
|
||
display: inline-block;
|
||
float: right;
|
||
}
|
||
::v-deep .el-form-item__content{
|
||
display: inline-block !important;
|
||
}
|
||
</style>
|