postdischarge-ui/src/views/system/record/record.vue
2024-06-19 09:11:52 +08:00

859 lines
27 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<div class="header">
<div class="topheader">
<div class="user">
<img class="headsculpture" src="../../../assets/manage/touxiang.png" alt="" v-if="list.sex == 'MALE'" />
<img class="headsculpture" src="../../../assets/manage/nvtouxiang.png" alt="" v-if="list.sex == 'FEMALE'" />
<div class="name">
{{ list.patientName }}
</div>
<div class="gender">
{{ list.sex == "MALE" ? "男" : list.sex == "FEMALE" ? "女" : "" }}
</div>
<div class="age">
{{ list.age }}
</div>
<div class="source">
<div class="item" style="color: #00e06e; border-color: #00e06e"
v-if="list.patientSource == 'WE_CHAT_OFFICIAL_ACCOUNT'">
<img src="../../../assets/manage/gzh.png" alt="" style="width: 24px" />
<div>公众号</div>
</div>
<div class="item" style="color: #339de5; border-color: #339de5" v-if="list.patientSource == 'WE_CHAT_APPLET'">
<img src="../../../assets/manage/xcx.png" alt="" />
<div>小程序</div>
</div>
<div class="item" style="color: #f4881f; border-color: #f4881f" v-if="list.patientSource == 'MANAGE_END'">
<img src="../../../assets/manage/gld.png" alt="" />
<div>管理端</div>
</div>
</div>
</div>
<div class="information">
<div class="top">
<div>身份证号:{{ list.cardNo }}</div>
<div>患者电话:{{ list.patientPhone }}</div>
<div style="width: 50%">出生日期:{{ list.birthDate }}</div>
</div>
<div class="bottom">
<!-- <div>注册时间:{{ $route.query.createTime }}</div> -->
<div>家属电话:{{ list.familyMemberPhone }}</div>
<div style="width: 50%">住址:{{ list.address }}</div>
</div>
</div>
</div>
<div class="bottomheader">
<!-- 运动指导 -->
<!-- <div class="sport">运动指导</div>
<div class="sports">抗阻运动</div>
<div class="word">
抗阳运动可以加强心脏功能,改善血液循环,有效降低脑梗风,险您每周进行2次每次30分钟抗阳运动。在运动时心率维持,指导如下:
</div> -->
<!-- <div class="videoleft"><video src=""></video></div>
<div class="attention">运动注意事项</div>
<div class="attention">
1、每次运动前需做热身运动5分钟运动后需做放松运动5分钟主要以低强度的有运动如慢步走为主
</div>
<div class="attention">
2、劳逸结合:注意控制锻炼时间注意劳逸结合运动后无明显的疲倦感3、循序渐进:循序渐进地进行锻炼,初始以简单、低强度的运动为主,随后可逐渐增加强度和锻炼时间
</div>
<div class="attention">
3、循序渐进:循序渐进地进行锻炼,初始以简单、低强度的运动为主,随后可逐渐增加强度和锻炼时间。
</div> -->
<!-- 复诊提醒 -->
<!-- <div>
<div class="sport">复诊提醒</div>
<div class="time">
<span class="number">1</span>
复诊时间
</div>
<div class="nexttime">您的下次复诊时间为2024-03-26</div>
<div class="images">
<image src="../assets/images/profile.jpg"></image>
</div>
</div> -->
<div style="display: flex">
<!-- 出院记录 -->
<div style="width: 30%; overflow: auto">
<el-tabs v-model="activeName" @tab-click="handleClick">
<el-tab-pane label="入院记录" name="first">
<div v-html="list.inHospitalInfo"></div>
</el-tab-pane>
<el-tab-pane label="手术记录" name="second">
<div v-html="list.surgicalRecord"></div>
</el-tab-pane>
<el-tab-pane label="出院记录" name="third">
<div v-html="list.outHospitalInfo"></div>
</el-tab-pane>
</el-tabs>
</div>
<!-- 文章模板 -->
<div class="right" v-if="$route.query.taskType == 'PROPAGANDA_ARTICLE'">
<div class="sport">文章模板:{{ formview.propagandaTitle }}</div>
<div class="bodytop">
<div>
<div class="know">{{ formview.propagandaTitle }}</div>
<div class="knowlist">
<Editorxj
v-model="formview.propagandaContent"
:min-height="192"
/>
</div>
<!-- <div class="knowlist">
{{ formview.propagandaContent }}
</div> -->
<img :src="baseUrl + formview.propagandaCoverPath" alt="" />
<video v-if="materialsType == 'VIDEO'" ref="myVideo" :src="baseUrl + materialsFilePath" controls></video>
</div>
</div>
</div>
<!-- 问卷模板 -->
<div class="right" v-if="$route.query.taskType == 'QUESTIONNAIRE_SCALE' ||
$route.query.taskType == 'ARTIFICIAL_FOLLOW_UP'
">
<div style="float: right; margin-top: 20px" v-if="$route.query.taskType == 'QUESTIONNAIRE_SCALE' ||
$route.query.taskType == 'ARTIFICIAL_FOLLOW_UP'
">
<el-form :inline="true" class="demo-form-inline" :model="questiondata" ref="questiondata">
<el-form-item label="任务处理信息" prop="routeHandleRemark">
<el-input type="textarea" disabled placeholder="请输入任务处理信息" v-model="questiondata.routeHandleRemark" />
</el-form-item>
</el-form>
</div>
<div class="sport" v-if="$route.query.taskType == 'QUESTIONNAIRE_SCALE'">
问卷模板: Barthel指数评定问卷
</div>
<div class="words" v-if="$route.query.taskType == 'QUESTIONNAIRE_SCALE'">
您好!本问卷用于评估日常生活能力,请根据自身日常实际表现选择合适的选项。
</div>
<div class="sport" v-if="$route.query.taskType == 'ARTIFICIAL_FOLLOW_UP'">
人工随访模板: 神经内科人工随访
</div>
<div class="words" v-if="$route.query.taskType == 'ARTIFICIAL_FOLLOW_UP'">
**您好!
</div>
<div class="words" v-if="$route.query.taskType == 'ARTIFICIAL_FOLLOW_UP'">
我是✕✕医院的工作人员,今天给您打电话想要了解一下您的恢复情况。
</div>
<div class="words" v-for="(item, index) in questiondata.subjectResultList" :key="index">
{{ index + 1 }}.{{ item.questionName }}
<span v-if="item.questionType == 'MULTIPLE_CHOICE'">(单选题)</span>
<span v-if="item.questionType == 'MULTIPLE_CHOICE_QUESTIONS'">(多选题)</span>
<span v-if="item.questionType == 'SCORING_QUESTIONS'">(打分题)</span>
<span v-if="item.questionType == 'COMBINATION_RADIO_SUBJECT'">(组合单选题)</span>
<span v-if="item.questionType == 'COMBINATION_MULTIPLE_SUBJECT'">(组合多选题)</span>
<span v-if="item.questionType == 'COMBINATION_BLANKS_SUBJECT'">(组合填空题)</span>
<span v-if="item.questionType == 'FILL_IN_THE_BLANKS'">(填空题)</span>
<span v-if="item.questionType == 'COMBINATION_SCORING_SUBJECT'">(组合打分题)</span>
<span v-if="item.questionType == 'DATE_BLANKS_SUBJECT'">(日期填空题)</span>
<span v-if="item.questionType == 'TIME_BLANKS_SUBJECT'">(时间填空题)</span>
<el-radio-group v-if="item.questionType == 'MULTIPLE_CHOICE' ||
item.questionType == 'COMBINATION_RADIO_SUBJECT' ||
item.questionType == 'SCORING_QUESTIONS' ||
item.questionType == 'COMBINATION_SCORING_SUBJECT'
" v-model="item.checked" class="custom-radio-group" @change="radioGroupChange($event, item)">
<el-radio disabled class="custom" v-for="(aitem, aindex) in item.optionResults" :key="aindex"
:label="aitem.id" @change="radioChange($event, aitem, index)">{{ aitem.optionName }}</el-radio>
</el-radio-group>
<!-- 多选、组合多选 -->
<el-checkbox-group v-model="checkeddata" @change="radioGroupChange($event, item, 'checkbox')" v-if="item.questionType == 'MULTIPLE_CHOICE_QUESTIONS' ||
item.questionType == 'COMBINATION_MULTIPLE_SUBJECT'
">
<el-checkbox disabled v-for="(aitem, aindex) in item.optionResults" :key="aindex" :label="aitem.id"
@change="radioChangecheck($event, aitem, index, aindex)">{{ aitem.optionName }}</el-checkbox>
</el-checkbox-group>
<!-- 填空题、组合填空 -->
<div v-if="item.questionType == 'FILL_IN_THE_BLANKS' ||
item.questionType == 'COMBINATION_BLANKS_SUBJECT'
" class="tk">
<el-input disabled v-model="item.fillBlanksAnswer" placeholder="请输入答案" type="textarea" />
<!-- <el-input></el-input> -->
</div>
<!-- 日期填空题、 -->
<div v-if="item.questionType == 'DATE_BLANKS_SUBJECT'" style="margin: 20px 0 10px 30px">
<el-date-picker disabled @change="timepicker($event, index)" clearable v-model="item.fillBlanksAnswer"
type="date" value-format="yyyy-MM-dd" placeholder="选择日期">
</el-date-picker>
</div>
<!-- 时间填空题 -->
<div style="margin: 20px 0 10px 30px" v-if="item.questionType == 'TIME_BLANKS_SUBJECT'">
<el-time-select disabled @change="timepickerselect($event, index)" clearable
v-model="item.fillBlanksAnswer" :picker-options="{
start: '08:30',
step: '00:30',
end: '23:30',
}" placeholder="选择时间">
</el-time-select>
</div>
</div>
</div>
<!-- 电话外呼 -->
<!-- <div v-if="$route.query.taskType == 'PHONE_OUTBOUND'">
<div class="sport">电话外呼</div> -->
<div v-if="$route.query.taskType == 'PHONE_OUTBOUND'">
<div class="sport">电话外呼</div>
<div class="nexttime">
<el-form
ref="formlist"
:model="formlist"
label-width="110px"
:inline="true"
>
<!-- <br/> -->
<el-form-item label="是否接通" prop="phone">
<el-radio v-model="formlist.phoneConnectStatus" label="CONNECTED"
>已接通</el-radio
>
<el-radio v-model="formlist.phoneConnectStatus" label="NOTCONNECTED"
>未接通</el-radio
>
</el-form-item>
<br />
<el-form-item label="任务处理信息" prop="routeHandleRemark">
<el-input
v-model="formlist.routeHandleRemark"
placeholder="请输入任务处理信息"
/>
</el-form-item>
<br />
<!-- <el-form-item label="话术名称" prop="scriptName">
<el-input
disabled
v-model="formlist.scriptName"
placeholder="请输入话术名称"
/>
</el-form-item> -->
<!-- <br /> -->
<el-form-item label="通用话术名称" prop="phoneTemplateName">
<el-input
disabled
v-model="formlist.phoneTemplateName"
placeholder="请输入通用话术名称"
/>
</el-form-item>
<br />
<!-- <el-form-item label="话术简介" prop="scriptIntroduction">
<el-input
disabled
type="textarea"
v-model="formlist.scriptIntroduction"
placeholder="请输入话术简介"
/>
</el-form-item>
<el-form-item label="任务处理信息" prop="routeHandleRemark">
<el-input
type="textarea"
v-model="formlist.routeHandleRemark"
placeholder="请输入任务处理信息"
/>
</el-form-item> -->
<!-- <br /> -->
<el-form-item label="电话推送" prop="phonePushSign">
<!-- <el-input
type="textarea"
v-model="formlist.routeHandleRemark"
placeholder="请输入任务处理信息"
/> -->
<!-- <el-switch
disabled
v-model="formlist.phonePushSign"
active-color="#13ce66"
active-value="1"
inactive-value="0"
>
</el-switch> -->
<el-radio disabled v-model="formlist.phonePushSign" label="1"
>已开启</el-radio
>
<el-radio disabled v-model="formlist.phonePushSign" label="0"
>未开启</el-radio
>
</el-form-item>
<br />
<el-form-item label="电话" prop="patientPhone">
<el-input
disabled
v-model="formlist.patientPhone"
placeholder="请输入电话"
/>
</el-form-item>
<br />
<!-- <div style="background:red;width:200px;height:1600px"> -->
<el-form-item label="重复次数" prop="phoneRedialTimes">
<el-select
v-model="formlist.phoneRedialTimes"
disabled
style="width: 200px"
>
<el-option
v-for="item in optionslistS"
:key="item.dictValue"
:label="item.dictLabel"
:value="item.dictValue"
>
</el-option>
</el-select>
</el-form-item>
<br />
<el-form-item label="发送短信" prop="phone">
<el-select
disabled
v-model="formlist.phoneMessageRemind"
style="width: 200px"
>
<el-option
v-for="item in optionslist"
:key="item.dictValue"
:label="item.dictLabel"
:value="item.dictValue"
>
</el-option>
</el-select>
<!-- <el-input
style="width: 200px"
v-model="formlist.phoneMessageRemind"
placeholder="请输入电话"
/> -->
</el-form-item>
<br />
<div class="pushMethod">
<el-form-item label="短信模板:" prop="phone">
<span class="spanname">
<message
style="width: 200px;height: 10px;"
@on-template="messageontemplateMESSAGE"
:templateId="formlist.phoneMessageTemplateId"
:templateName="formlist.phoneMessageTemplateName"
></message>
</span>
</el-form-item>
</div>
<br/>
<el-form-item label="话术图" prop="phone">
<img
:src="formlist.scriptFilePath"
style="width: 250px; height: 200px"
/>
</el-form-item>
<br />
</el-form>
</div>
<!-- <div class="nexttime">
<el-form ref="form" :model="formlist" label-width="110px" :inline="true">
<el-form-item label="话术名称" prop="scriptName">
<el-input disabled v-model="formlist.scriptName" placeholder="请输入话术名称" />
</el-form-item>
<br />
<el-form-item label="通用话术名称" prop="commonScriptName">
<el-input disabled v-model="formlist.commonScriptName" placeholder="请输入通用话术名称" />
</el-form-item>
<br />
<el-form-item label="话术简介" prop="scriptIntroduction">
<el-input disabled type="textarea" v-model="formlist.scriptIntroduction" placeholder="请输入话术简介" />
</el-form-item>
<el-form-item label="任务处理信息" prop="routeHandleRemark">
<el-input type="textarea" disabled placeholder="请输入任务处理信息" v-model="formlist.routeHandleRemark" />
</el-form-item>
</el-form>
</div> -->
</div>
<!-- 文字提醒 -->
<div v-if="$route.query.taskType == 'TEXT_REMIND'">
<div class="sport">文字提醒</div>
<div class="nexttime">
<el-form ref="form" :model="formlists" label-width="110px" :inline="true">
<el-form-item label="提醒内容" prop="textRemindContent">
<el-input disabled type="textarea" style="width: 500px" v-model="formlists.textRemindContent"
placeholder="请输入提醒内容" />
</el-form-item>
</el-form>
</div>
</div>
</div>
</div>
</div>
</template>
<script>
import { getPropaganda } from "@/api/manage/propaganda";
import Editorxj from "../../system/Editorxj/index.vue";
import message from "../components/message.vue";
import {
selectPhonePush,
} from "@/api/system/followupsee";
import {
selectVisitRecord,
selectPatientQuestionSubmit,
} from "@/api/system/taskExecuteRecord";
import { getScript } from "@/api/manage/script";
import { getAgencytype } from "@/api/system/agency";
export default {
components: {
message,
Editorxj
},
name: "patientdetails",
// components: { },
data() {
return {
checkeddata: [],
formlists: {},
baseUrl: process.env.VUE_APP_BASE_API,
radio: "1",
activeName: "first",
id: "",
list: [],
questiondata: {
totalScore: 0, //总分
routeHandlePerson: null,
routeHandleId: null,
},
formview: [],
// 电话外呼
formlist: {},
materialsFilePath: "",
materialsType: "",
optionslistS:[],
optionslist:[],
};
},
created() {
console.log(this.$route.query);
this.info();
this.infolistMESSAGE();
this.infolistword()
// 文字提醒
if (this.$route.query.textRemindContent) {
this.formlists.textRemindContent = this.$route.query.textRemindContent;
}
if (this.$route.query.routeHandleRemark) {
this.formlist.routeHandleRemark = this.$route.query.routeHandleRemark;
}
// 文章末班
if (this.$route.query.taskType == "PROPAGANDA_ARTICLE") {
this.getPropagandaLIST();
} else if (
// 人工随访和问卷
this.$route.query.taskType == "ARTIFICIAL_FOLLOW_UP" ||
this.$route.query.taskType == "QUESTIONNAIRE_SCALE"
) {
this.selectlist();
} else if (this.$route.query.taskType == "PHONE_OUTBOUND") {
// 电话外呼
selectPhonePush(this.$route.query.manageRouteNodeId).then((response) => {
if (response.data) {
this.formlist = response.data;
if(this.formlist.phonePushSign==0){
this.formlist.phonePushSign='0'
}else if(this.formlist.phonePushSign==1){
this.formlist.phonePushSign='1'
}
}
});
}
},
methods: {
// 发送短信
infolistword() {
var dictType = "text_message_remind";
getAgencytype(dictType).then((res) => {
this.optionslist = res.data;
// this.taskinfo();
});
},
// 短信
messageontemplateMESSAGE(item) {
console.log(item, "2222222");
this.formlist.phoneMessageTemplateId = item.templateId;
this.formlist.phoneMessageTemplateName = item.templateName;
// this.form.messagePreview = item.templateContent;
},
// 重复次数
infolistMESSAGE() {
var dictType = "redial_times";
getAgencytype(dictType).then((res) => {
this.optionslistS = res.data;
});
},
// 宣教
getPropagandaLIST() {
getPropaganda(this.$route.query.templateId).then((response) => {
this.formview = response.data;
this.formview.materialsInfoList.forEach((e) => {
this.materialsType = e.materialsType;
this.materialsFilePath = e.materialsFilePath;
});
});
},
// 问卷和随访
selectlist() {
selectPatientQuestionSubmit(this.$route.query.patientId).then((res) => {
console.log(res, "res");
this.questiondata = res.data;
if (this.$route.query.routeHandleRemark) {
this.questiondata.routeHandleRemark =
this.$route.query.routeHandleRemark;
}
this.questiondata.subjectResultList.forEach((e) => {
e.optionResults.forEach((el) => {
// console.log(el, "el");
if (
(el.optionChooseSign == "0" &&
e.questionType == "MULTIPLE_CHOICE") ||
e.questionType == "COMBINATION_RADIO_SUBJECT"
) {
e.checked = el.id;
} else if (
el.optionChooseSign == "0" &&
e.questionType == "MULTIPLE_CHOICE_QUESTIONS"
) {
this.checkeddata.push(el.id);
} else if (
el.optionChooseSign == "0" &&
e.questionType == "SCORING_QUESTIONS"
) {
e.checked = el.id;
} else if (
e.questionType == "COMBINATION_MULTIPLE_SUBJECT" &&
el.optionChooseSign == "0"
) {
this.checkeddata.push(el.id);
}
});
});
});
},
// 日期填空题
timepicker(e, index) {
this.questiondata.questionSubjectList[index].optionAnswer = e;
},
// 时间填空题
timepickerselect(e, index) {
console.log(e);
this.questiondata.questionSubjectList[index].optionAnswer = e;
},
radioGroupChange(e, item) { },
// 选中某个单选框时由radio时触发
radioChange(e, item, index) {
console.log(e, item, index, "选中某个单选框时");
this.questiondata.questionSubjectList[
index
].questionSubjectOptionList.forEach((el) => {
if (el.id == item.id) {
el.optionChooseSign = "0";
} else {
el.optionChooseSign = "1";
}
});
},
// 复选框
radioChangecheck(e, item, index, aindex) {
console.log(e, item, index, "选中某个复选框时");
if (e == true) {
this.questiondata.questionSubjectList[index].questionSubjectOptionList[
aindex
].optionChooseSign = "0";
} else {
this.questiondata.questionSubjectList[index].questionSubjectOptionList[
aindex
].optionChooseSign = "1";
}
console.log(this.questiondata, "11111111复选框");
},
info() {
selectVisitRecord(this.$route.query.patientId).then((res) => {
console.log(res);
this.list = res.data;
});
},
handleClick(tab, event) {
console.log(tab, event);
},
},
};
</script>
<style lang="scss" scoped>
::v-deep iframe{
width:100%;
height: 500px;
}
.tk {
::v-deep .el-textarea__inner {
margin: 20px 0 10px 30px;
}
}
::v-deep .el-radio {
padding: 10px;
}
::v-deep .el-checkbox-group {
display: flex;
flex-direction: column;
padding: 10px 0px 10px 24px;
}
::v-deep .el-checkbox {
padding: 10px 0 10px 0px;
// padding: 10px;
}
.custom-radio-group {
display: flex;
flex-direction: column;
padding: 10px 0 10px 10px;
.custom {
padding: 10px 0 10px 10px;
}
}
.custom-radio-group {
display: flex;
flex-direction: column;
padding: 10px 0 10px 10px;
.custom {
padding: 10px 0 10px 10px;
}
}
.bodytop {
position: relative;
top: 20px;
height: 500px;
width: 600px;
margin: 0 auto;
// background: red;f
overflow: auto;
border: 1px solid #e2e2e2;
.titledata {
margin: 30px 0px 15px 30px;
top: 14px;
font-size: 20px;
}
.audiotop {
margin: 10px 0px 10px 30px;
}
img {
// width: 362px;
// height: 127px;
margin: 0px 0px 0px 30px;
}
video {
margin: 0px 0px 0px 30px;
}
.know {
margin: 11px 0px 10px 30px;
font-size: 20px;
font-weight: 550;
}
.knowlist {
margin: 10px 0px 10px 30px;
font-size: 16px;
}
}
.right {
width: 70%;
height: 500px;
// background: yellow;
}
.header {
background-color: #f1f3f5;
padding-top: 10px;
::v-deep .el-tabs__header {
margin: 0 !important;
width: 100%;
// overflow: auto;
// height: 500px;
// background: red;
}
.bottomheader {
overflow-y: scroll;
width: 99%;
height: 67vh;
background-color: #fff;
margin: 10px auto;
padding: 10px 20px;
.sport {
padding: 10px 50px 10px 10px;
font-size: 20px;
font-weight: 600;
}
.words {
font-size: 15px;
padding: 10px 50px 10px 10px;
}
.sports {
position: absolute;
left: 50%;
transform: translate(-50%);
font-size: 18px;
font-weight: 600;
}
.word {
font-size: 14px;
font-weight: 550;
padding: 50px 50px 10px 10px;
}
.videoleft {
width: 40%;
height: 200px;
background: red;
}
.time {
font-size: 20px;
font-weight: 550;
padding: 10px 50px 10px 10px;
}
.number {
width: 25px;
height: 25px;
text-align: center;
display: inline-block;
color: white;
background: blue;
border-radius: 50%;
}
.nexttime {
font-size: 15px;
padding: 10px 50px 10px 10px;
}
.images {
width: 53%;
height: 241px;
margin: 0 auto;
background: red;
}
.attention {
font-size: 14px;
font-weight: 550;
padding: 10px 50px 10px 10px;
}
// .videobottom
// {
// font-size: 14px;
// font-weight: 550;
// padding: 10px 50px 10px 10px;
// }
}
.topheader {
width: 99%;
background-color: #fff;
margin: 0 auto;
.information {
display: flex;
flex-wrap: wrap;
padding: 10px 20px;
height: 110px;
.top,
.bottom {
color: #666666;
width: 100%;
display: flex;
div {
width: 25%;
}
}
}
.user {
width: 100%;
padding: 0 20px;
display: flex;
height: 80px;
align-items: center;
line-height: 80px;
.source {
display: flex;
.item {
line-height: 30px;
font-size: 14px;
margin-left: 20px;
border: 1px solid #c7c7c7;
width: 100px;
border-radius: 5px;
justify-content: center;
height: 30px;
display: flex;
align-items: center;
img {
margin-right: 10px;
width: 20px;
height: 20px;
}
}
}
.name {
font-size: 20px;
padding-left: 12px;
}
.gender {
padding-left: 10px;
}
.age {
padding-left: 10px;
}
.headsculpture {
border-radius: 50%;
width: 40px;
height: 40px;
}
}
}
}
</style>