提交 c9247715 编写于 作者: yi.li's avatar yi.li

新增子组件

上级 6359172f
<template>
<div>
<el-form :ref="timeForm.formRef" :model="timeForm" :rules="timeFormRules" label-suffix=":" label-width="140px" :inline-message="true" size="small">
<el-form-item label="本次随访时间" required>
<div style="display: flex;">
<el-form-item prop="followupTime">
<el-select v-model="timeForm.followupTime" placeholder="请选择">
<el-option
v-for="item in indexOptions"
:key="item.value"
:label="item.label"
:value="item.label">
</el-option>
</el-select>
</el-form-item>
<el-form-item prop="followupMark" class="ml20">
<el-select v-model="timeForm.followupMark" placeholder="请选择" :disabled="timeForm.isDisabled">
<el-option
v-for="item in markOptions"
:key="item.value"
:label="item.label"
:value="item.label">
</el-option>
</el-select>
</el-form-item>
</div>
</el-form-item>
<el-form-item label="随访方式" prop="followupWay">
<el-radio-group v-model="timeForm.followupWay" size="small">
<el-radio :label="1">门诊随访</el-radio>
<el-radio :label="2">上门随访</el-radio>
<el-radio :label="3">电话随访</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="提醒医生预约居民">
<el-select
v-model="timeForm.remindTime"
multiple
:multiple-limit=3
placeholder="请选择">
<el-option
v-for="item in remindOptions"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="推送患教">
<div style="display: flex">
<el-select v-model="timeForm.pushTime" placeholder="选择推送时间" clearable>
<el-option
v-for="item in pushTimeOptions"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
<el-button plain class="ml20" @click="goSelectCartoon" v-if="!timeForm.hasSelected">选择健康漫画</el-button>
<div class="selected-div ml20" v-if="timeForm.hasSelected">
<span>《健康漫画名称》</span>
<el-button type="text" @click="goSelectCartoon">重选</el-button>
<el-button type="text" @click="deleteClick">删除</el-button>
</div>
</div>
</el-form-item>
<div class="tips-contnt" v-if="timeForm.hasSelected">
<p class="yellow-font">当前计划中共500位居民(微信:300位,短信:200位),本次定时推送任务在发送当日预计需要200条短信额度(微信推送不消耗额度,建议您让居民关注云鹊健康微信公众号),务必提前确保短信额度的充足。</p>
<p>需要更多额度,请前往「云鹊医App-个人中心-啾啾币中心」兑换短信额度后再进行预约,您也可以联系云鹊医客服购买短信额度,客服电话:400-920-8877</p>
</div>
<el-form-item label="随访登记表">
<el-select
v-model="timeForm.followupForm"
multiple
:multiple-limit=2
placeholder="请选择">
<el-option
v-for="item in formOptions"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
</el-form>
<select-cartoon :isSelectCartoon="isSelectCartoon" @closeSelectCartoon="closeSelectCartoon"></select-cartoon>
</div>
</template>
<script>
import _ from 'lodash';
import SelectCartoon from '@/views/followup/plan-manage/dialog/select-cartoon';
const timeFormInit = {
formRef: '',
followupTime: '',
followupMark: '',
followupWay: '',
pushTime: '',
remindTime: [],
followupForm: [],
hasSelected: '',
};
export default {
components: {
SelectCartoon},
data() {
return {
isSelectCartoon: false,
indexOptions: [
{
value: '0',
label: '0'
}, {
value: '1',
label: '1'
}, {
value: '2',
label: '2'
}, {
value: '3',
label: '3'
},
],
markOptions: [
{
value: '0',
label: '天'
}, {
value: '1',
label: '周'
},
{
value: '2',
label: '月'
}, {
value: '3',
label: '年'
}
],
remindOptions: [
{
value: '0',
label: '开始前30天'
}, {
value: '1',
label: '开始前20天'
},
{
value: '2',
label: '开始前10天'
},
],
pushTimeOptions: [
{
value: '0',
label: '开始前7天'
}, {
value: '1',
label: '开始前3天'
},
{
value: '2',
label: '当天'
},
],
formOptions: [
{
value: '0',
label: '随访登记表1'
}, {
value: '1',
label: '随访登记表2'
},
{
value: '2',
label: '随访登记表3'
},
],
timeFormRules: {
followupTime: [{ required: true, message: '请添加随访时间', trigger: 'change' }],
followupMark: [{ required: true, message: '请添加随访时间', trigger: 'change' }],
followupWay: [{ required: true, message: '请选择随访方式', trigger: 'change' }],
},
}
},
props: {
timeForm: {
type: Object,
},
valBegin: Boolean,
checkCallback: Function
},
watch: {
// valBegin(val){
// console.log(val)
// if(val){
// console.log('开始校验')
// this.$emit('getRefForm',this.timeForm.formRef)
// // console.log(this.checkCallback)
// // this.checkCallback(this.timeForm.formRef)
// }
// }
},
methods: {
getNowTime() {
const date = new Date();
const year = date.getFullYear();
const month = date.getMonth() + 1;
const day = date.getDate();
const hour = date.getHours();
const minute = date.getMinutes();
const second = date.getSeconds();
let formName = `form${year}${month}${day}${hour}${minute}${second}`;
return formName;
},
goSelectCartoon() {
this.isSelectCartoon = true;
},
closeSelectCartoon(val) {
this.isSelectCartoon = val.closeStatus;
this.timeForm.hasSelected = val.hasSelected;
},
deleteClick() {
this.timeForm.hasSelected = '';
},
},
}
</script>
<style scoped lang="scss">
.form-div{
padding-top: 30px;
.tips-contnt{
margin-top: -10px;
padding-left: 140px;
padding-bottom: 30px;
font-size: 12px;
color: #9B9997;
width: 55%;
p{
line-height: 18px;
&.yellow-font{
color: #e6a23c;
padding-bottom: 10px;
}
}
}
}
.ml20{
margin-left: 20px;
}
</style>
...@@ -12,93 +12,12 @@ ...@@ -12,93 +12,12 @@
<div class="form-div" v-if="activeTab != 'setNewRef'"> <div class="form-div" v-if="activeTab != 'setNewRef'">
<div :key="timeFormHas.formRef" v-for="(timeFormHas, index) in setTimeNodeList1" :label="index"> <div :key="timeFormHas.formRef" v-for="(timeFormHas, index) in setTimeNodeList1" :label="index">
<el-form v-if="index == activeTab" :ref="timeFormHas.formRef" :model="timeFormHas" :rules="timeFormRules" label-suffix=":" label-width="140px" :inline-message="true" size="small"> <set-time-form v-if="index == activeTab" :timeForm="timeFormHas"></set-time-form>
<el-form-item label="本次随访时间" required>
<div style="display: flex;">
<el-form-item prop="followupTime">
<el-select v-model="timeFormHas.followupTime" placeholder="请选择">
<el-option
v-for="item in indexOptions"
:key="item.value"
:label="item.label"
:value="item.label">
</el-option>
</el-select>
</el-form-item>
<el-form-item prop="followupMark" class="ml20">
<el-select v-model="timeFormHas.followupMark" placeholder="请选择" :disabled="timeFormHas.isDisabled">
<el-option
v-for="item in markOptions"
:key="item.value"
:label="item.label"
:value="item.label">
</el-option>
</el-select>
</el-form-item>
</div>
</el-form-item>
<el-form-item label="随访方式" prop="followupWay">
<el-radio-group v-model="timeFormHas.followupWay" size="small">
<el-radio :label="1">门诊随访</el-radio>
<el-radio :label="2">上门随访</el-radio>
<el-radio :label="3">电话随访</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="提醒医生预约居民">
<el-select
v-model="timeFormHas.remindTime"
multiple
:multiple-limit=3
placeholder="请选择">
<el-option
v-for="item in remindOptions"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="推送患教">
<div style="display: flex">
<el-select v-model="timeFormHas.pushTime" placeholder="选择推送时间" clearable>
<el-option
v-for="item in pushTimeOptions"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
<el-button plain class="ml20" @click="goSelectCartoon" v-if="!timeFormHas.hasSelected">选择健康漫画</el-button>
<div class="selected-div ml20" v-if="timeFormHas.hasSelected">
<span>《健康漫画名称》</span>
<el-button type="text" @click="goSelectCartoon">重选</el-button>
<el-button type="text" @click="deleteClick">删除</el-button>
</div>
</div>
</el-form-item>
<div class="tips-contnt" v-if="timeFormHas.hasSelected">
<p class="yellow-font">当前计划中共500位居民(微信:300位,短信:200位),本次定时推送任务在发送当日预计需要200条短信额度(微信推送不消耗额度,建议您让居民关注云鹊健康微信公众号),务必提前确保短信额度的充足。</p>
<p>需要更多额度,请前往「云鹊医App-个人中心-啾啾币中心」兑换短信额度后再进行预约,您也可以联系云鹊医客服购买短信额度,客服电话:400-920-8877</p>
</div>
<el-form-item label="随访登记表">
<el-select
v-model="timeFormHas.followupForm"
multiple
:multiple-limit=3
placeholder="请选择">
<el-option
v-for="item in formOptions"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
</el-form>
</div> </div>
</div> </div>
<div class="form-div" v-if="activeTab == 'setNewRef'"> <div class="form-div" v-if="activeTab == 'setNewRef'">
<!--<set-time-form :timeForm="timeForm" :valBegin="valBegin" :checkCallback="checkCallback" />-->
<el-form :ref="timeForm.formRef" :model="timeForm" :rules="timeFormRules" label-suffix=":" label-width="140px" :inline-message="true" size="small"> <el-form :ref="timeForm.formRef" :model="timeForm" :rules="timeFormRules" label-suffix=":" label-width="140px" :inline-message="true" size="small">
<el-form-item label="本次随访时间" required> <el-form-item label="本次随访时间" required>
<div style="display: flex;"> <div style="display: flex;">
...@@ -192,6 +111,7 @@ ...@@ -192,6 +111,7 @@
<script> <script>
import _ from 'lodash'; import _ from 'lodash';
import SelectCartoon from '@/views/followup/plan-manage/dialog/select-cartoon'; import SelectCartoon from '@/views/followup/plan-manage/dialog/select-cartoon';
import SetTimeForm from '@/views/followup/plan-manage/dialog/set-time-form';
import { mapState } from 'vuex' import { mapState } from 'vuex'
const timeFormInit = { const timeFormInit = {
formRef: '', formRef: '',
...@@ -203,14 +123,18 @@ ...@@ -203,14 +123,18 @@
followupForm: [], followupForm: [],
hasSelected: '', hasSelected: '',
isDisabled: false, isDisabled: false,
}; };
export default { export default {
components: { components: {
SelectCartoon SelectCartoon,
SetTimeForm
}, },
data() { data() {
return { return {
// checkCallback:null,
// valBegin: false,
isSelectCartoon: false, isSelectCartoon: false,
activeTab: null, activeTab: null,
currentFormRef: 1, currentFormRef: 1,
...@@ -319,6 +243,25 @@ ...@@ -319,6 +243,25 @@
} }
}, },
watch: { watch: {
// valBegin(val){
// if(val){
// this.checkCallback = (formName)=>{
// console.log()
// this.$refs[formName].validate((valid) => {
// console.log(valid,'||||')
// if (valid) {
// this.setTimeNodeList.push(this.timeForm);
// this.timeForm = _.cloneDeep(timeFormInit);
// this.timeForm.formRef = this.getNowTime();
// this.timeForm.isDisabled = true;
// } else {
// return;
// }
// });
//
// }
// }
// },
timeForm(newVal, oldVal) { timeForm(newVal, oldVal) {
if(this.setTimeNodeList.length>0) { if(this.setTimeNodeList.length>0) {
this.timeForm.isDisabled = true; this.timeForm.isDisabled = true;
...@@ -349,14 +292,14 @@ ...@@ -349,14 +292,14 @@
this.timeForm.formRef = this.getNowTime(); this.timeForm.formRef = this.getNowTime();
}else { }else {
this.$refs[formName].validate((valid) => { this.$refs[formName].validate((valid) => {
if (valid) { if (valid) {
this.setTimeNodeList.push(this.timeForm); this.setTimeNodeList.push(this.timeForm);
this.timeForm = _.cloneDeep(timeFormInit); this.timeForm = _.cloneDeep(timeFormInit);
this.timeForm.formRef = this.getNowTime(); //新增一个form this.timeForm.formRef = this.getNowTime();
this.timeForm.isDisabled = true; //新增一个form this.timeForm.isDisabled = true;
} else { } else {
return; return;
} }
}); });
} }
}, },
......
Markdown 格式
0% or
您添加了 0 到此讨论。请谨慎行事。
先完成此消息的编辑!
想要评论请 注册