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.
427 lines
15 KiB
427 lines
15 KiB
3 years ago
|
|
||
|
<template>
|
||
|
<!-- 随访记录 -->
|
||
|
<div class="follow-up-record">
|
||
|
<div style="display: flex">
|
||
|
<!-- 随访内容 -->
|
||
|
<div class="content-left">
|
||
|
<div class="buttonBackground">
|
||
|
<el-button type="primary" plain size="small" icon="el-icon-plus" class="addfollow" @click="addFollowHandle">新增随访</el-button>
|
||
|
</div>
|
||
|
<time-line-follow-up ref="timeline" :time-axis-data="timeAxisData" class="time-line" @refreshDataList="childInit" />
|
||
|
</div>
|
||
|
<div class="content-right">
|
||
|
<div class="buttons">
|
||
|
<el-button type="primary" size="small" @click="addOrUpdateHandle(dataForm,'put')">修改</el-button>
|
||
|
<el-button type="danger" size="small" @click="deleteHandle">删除</el-button>
|
||
|
<el-button size="small" @click="printerHandle">打印</el-button>
|
||
|
</div>
|
||
|
</div>
|
||
|
<!-- 没有随访数据 -->
|
||
|
<div v-show="timeAxisData.length <= 0 && loading==false" class="no-follow-up-father">
|
||
|
<div class="no-follow-up">
|
||
|
<img src="@/assets/img/nodata.png" alt="">
|
||
|
<div class="no-follow-up-content">
|
||
|
<p class="title-one">暂无随访记录</p>
|
||
|
<p class="title-two">你可以点击新增记录按钮,新增随访记录</p>
|
||
|
<el-button type="primary" icon="el-icon-plus" round @click="addFollowHandle">新增记录</el-button>
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
<!-- 新增随访记录 -->
|
||
|
<add-follow-record v-if="followRecordVisible" ref="followRecordRef" @getTimeAxisData="getTimeAxisData('add',$event)" @closeDialog="followRecordVisible=false" />
|
||
|
<!-- 弹窗, 新增 / 修改 -->
|
||
|
<follow-up v-if="followUpVisible" ref="followUp" updata-file="getTimeAxisData" :is-sign="true" :is-close-refresh="isCloseRefresh" @refreshDataList="childInit()" @getTimeAxisData="getTimeAxisData" @closeDialog="followUpVisible=false" />
|
||
|
</div>
|
||
|
</template>
|
||
|
|
||
|
<script>
|
||
|
import eventBus from '@/page-subspecialty/utils/eventBus'
|
||
|
import timeLineFollowUp from '@/components/360View/time-line-follow-up'
|
||
|
import followUp from '@/components/hm-crf/followUp.vue'
|
||
|
import editFullCaseTemplate from '@/components/hm-crf/edit-full-case-template.vue'
|
||
|
import intelligentFull from '@/components/hm-crf/intelligent-full.vue'
|
||
|
import addFollowRecord from './add-follow-record.vue'
|
||
|
import IntelligentFill from '@/mixins/IntelligentFill'
|
||
|
const Base64 = require('js-base64').Base64
|
||
|
export default {
|
||
|
components: {
|
||
|
timeLineFollowUp,
|
||
|
addFollowRecord,
|
||
|
followUp,
|
||
|
editFullCaseTemplate,
|
||
|
intelligentFull
|
||
|
},
|
||
|
mixins: [IntelligentFill],
|
||
|
props: {
|
||
|
patientIdNumber: {
|
||
|
type: String,
|
||
|
default: ''
|
||
|
},
|
||
|
patientCentreId: {
|
||
|
type: String,
|
||
|
default: ''
|
||
|
},
|
||
|
patientId: {
|
||
|
type: String,
|
||
|
default: ''
|
||
|
}
|
||
|
},
|
||
|
inject: ['refresh'],
|
||
|
data() {
|
||
|
return {
|
||
|
visible: true,
|
||
|
timeAxisData: [], // 左侧时间轴数据
|
||
|
followRecordVisible: false,
|
||
|
crfVisible: false,
|
||
|
followUpVisible: false,
|
||
|
editFullCaseTemplateVisible: false,
|
||
|
intelligentFullVisible: false,
|
||
|
jsArr: [],
|
||
|
dataForm: {},
|
||
|
name: '',
|
||
|
formDate: '',
|
||
|
callList: [{
|
||
|
date: '2021--4-12 12:53:21',
|
||
|
recordFile: '',
|
||
|
recordLength: '10:12:12',
|
||
|
flag: 1
|
||
|
}, {
|
||
|
date: '2021--4-12 13:53:21',
|
||
|
recordFile: '',
|
||
|
recordLength: '10:12:12',
|
||
|
flag: 1
|
||
|
}, {
|
||
|
date: '2021--4-12 14:53:21',
|
||
|
recordFile: '',
|
||
|
recordLength: '10:12:12',
|
||
|
flag: 0
|
||
|
}],
|
||
|
followFormList: [],
|
||
|
loading: true,
|
||
|
isCloseRefresh: false
|
||
|
}
|
||
|
},
|
||
|
methods: {
|
||
|
init() {
|
||
|
this.visible = true
|
||
|
this.$nextTick(() => {
|
||
|
this.getTimeAxisData()
|
||
|
// 根据类型获取随访表单列表
|
||
|
this.getFollowFormList()
|
||
|
})
|
||
|
},
|
||
|
// 打印
|
||
|
printerHandle() {
|
||
|
this.$refs.crfComponent.$el.contentWindow.print()
|
||
|
},
|
||
|
// 根据类型获取随访表单列表
|
||
|
async getFollowFormList() {
|
||
|
const { data: res } = await this.$http.get('/crf/template/getListByType/随访')
|
||
|
if (res.code === 0) {
|
||
|
this.followFormList = res.data
|
||
|
} else {
|
||
|
this.$message.error(res.msg)
|
||
|
}
|
||
|
},
|
||
|
// 点击新增随访记录 时间+选择随访表单
|
||
|
addFollowHandle() {
|
||
|
this.followRecordVisible = true
|
||
|
this.isCloseRefresh = true
|
||
|
this.$nextTick(() => {
|
||
|
this.$refs.followRecordRef.followFormList = this.followFormList
|
||
|
this.$refs.followRecordRef.dataForm.patientIdNumber = this.patientIdNumber
|
||
|
this.$refs.followRecordRef.dataForm.patientCentreId = this.patientCentreId
|
||
|
this.$refs.followRecordRef.init()
|
||
|
})
|
||
|
},
|
||
|
// 新增修改填写CRF
|
||
|
addOrUpdateHandle(data, flag) {
|
||
|
this.isCloseRefresh = flag !== 'put'
|
||
|
// console.log(data)
|
||
|
this.$store.commit('destroyPlugin')
|
||
|
if (data.crfDescription === '病历模板') {
|
||
|
this.editFullCaseTemplateVisible = true
|
||
|
this.$nextTick(() => {
|
||
|
this.$refs.editFullCaseTemplateRef.dataForm.id = flag === 'post' ? data.id : data.formId
|
||
|
this.$refs.editFullCaseTemplateRef.dataForm.description = data.crfDescription
|
||
|
this.$refs.editFullCaseTemplateRef.dataForm.patientIdNumber = data.patientIdNumber
|
||
|
this.$refs.editFullCaseTemplateRef.dataForm.patientCentreId = data.patientCentreId
|
||
|
this.$refs.editFullCaseTemplateRef.init()
|
||
|
})
|
||
|
} else if (data.crfDescription === '智能填充') {
|
||
|
this.intelligentFullVisible = true
|
||
|
this.$nextTick(() => {
|
||
|
this.$refs.intelligentFullRef.dataForm.crfId = data.crfId
|
||
|
this.$refs.intelligentFullRef.dataForm.formId = flag === 'post' ? data.id : data.formId
|
||
|
this.$refs.intelligentFullRef.dataForm.isWrite = data.isWrite
|
||
|
this.$refs.intelligentFullRef.init()
|
||
|
})
|
||
|
} else {
|
||
|
this.followUpVisible = true
|
||
|
this.$nextTick(() => {
|
||
|
this.$refs.followUp.dataForm.crfId = data.crfId
|
||
|
this.$refs.followUp.dataForm.formId = flag === 'post' ? data.id : data.formId
|
||
|
this.$refs.followUp.dataForm.isWrite = data.isWrite
|
||
|
this.$refs.followUp.init()
|
||
|
})
|
||
|
}
|
||
|
},
|
||
|
// 显示当前随访表单
|
||
|
childInit(item) {
|
||
|
console.log(item)
|
||
|
item ? this.dataForm = { ...this.dataForm, ...item } : ''
|
||
|
this.crfVisible = false
|
||
|
this.$nextTick(() => {
|
||
|
this.$http.get(`/visit/record/${this.dataForm.formId}`)
|
||
|
.then(({ data: res }) => {
|
||
|
if (res.code !== 0) {
|
||
|
return this.$message.error(res.msg)
|
||
|
}
|
||
|
if (res.data) {
|
||
|
res.data.formId = res.data.id
|
||
|
delete res.data.id
|
||
|
this.dataForm = { ...this.dataForm, ...res.data }
|
||
|
// console.log(this.dataForm)
|
||
|
this.dataForm.content = Base64.decode(res.data.formContent)
|
||
|
// console.log(this.dataForm)
|
||
|
this.crfVisible = true
|
||
|
console.log(this.dataForm)
|
||
|
this.dataForm.isWrite === 0 && (this.dataForm.crfDescription === '智能填充' || this.dataForm.crfDescription === '病历模板') ? this.getFirstFeedbackData('智能填充', this.dataForm.formId) : this.CRFLoading = false
|
||
|
}
|
||
|
}).catch(() => { })
|
||
|
})
|
||
|
},
|
||
|
// 获取时间轴数据--左侧时间轴
|
||
|
async getTimeAxisData(flag, data, del) {
|
||
|
this.loading = true
|
||
|
const addFromData = data
|
||
|
data ? this.dataForm = data : ''
|
||
|
const { data: res } = await this.$http.get(`/visit/record/${this.patientCentreId}/${this.patientIdNumber}`)
|
||
|
if (res.code === 0) {
|
||
|
if (res.data.length > 0) {
|
||
|
res.data.forEach(item => {
|
||
|
item.active = false
|
||
|
})
|
||
|
this.timeAxisData = res.data
|
||
|
// 刚新增随访添加日期完成后定位当前所在序列位置高亮
|
||
|
data ? this.timeAxisData.forEach((item, index) => {
|
||
|
// console.log('data', data)
|
||
|
// console.log('item', item)
|
||
|
// console.log('this.dataForm', this.dataForm)
|
||
|
if (item.dateStr === this.dataForm.formDate) {
|
||
|
this.$refs.timeline.itemCurrentIndex = index
|
||
|
item.dataList.forEach((iten, itenIndex) => {
|
||
|
if (iten.formId === this.dataForm.id) {
|
||
|
this.$refs.timeline.itemListCurrentIndex = itenIndex
|
||
|
window.sessionStorage.setItem('itemCurrentIndex', index)
|
||
|
window.sessionStorage.setItem('itemListIndex', itenIndex)
|
||
|
}
|
||
|
})
|
||
|
}
|
||
|
}) : ''
|
||
|
// 如果是新增修改调取随访表单弹框
|
||
|
flag === 'add' ? this.addOrUpdateHandle(addFromData, 'post') : ''
|
||
|
// 如果是删除操作设置高亮区域及dataform和随访表单回显
|
||
|
if (del && !flag) {
|
||
|
// 判断当前日期是否还存在
|
||
|
const Isdate = this.timeAxisData.some(item => item.dateStr === this.dataForm.formDate)
|
||
|
// 获取当前所在序列
|
||
|
const itemCurrentIndex = this.$refs.timeline.itemCurrentIndex
|
||
|
const itemListCurrentIndex = this.$refs.timeline.itemListCurrentIndex
|
||
|
// 如果当前日期存在获取当前日期下的随访dataform
|
||
|
if (Isdate) {
|
||
|
const itemListIndex = itemListCurrentIndex == 0 ? 0 : itemListCurrentIndex - 1
|
||
|
this.$refs.timeline.itemListCurrentIndex = itemListIndex
|
||
|
this.dataForm = this.timeAxisData[itemCurrentIndex].dataList[itemListIndex]
|
||
|
window.sessionStorage.setItem('itemCurrentIndex', itemCurrentIndex)
|
||
|
window.sessionStorage.setItem('itemListIndex', itemListIndex)
|
||
|
this.childInit()
|
||
|
} else {
|
||
|
// 如果不存在获取上一日期的第一个序列的随访dataform
|
||
|
const itemIndex = itemCurrentIndex == 0 ? 0 : itemCurrentIndex - 1
|
||
|
this.$refs.timeline.itemCurrentIndex = itemIndex
|
||
|
this.$refs.timeline.itemListCurrentIndex = 0
|
||
|
this.dataForm = this.timeAxisData[itemIndex].dataList[0]
|
||
|
window.sessionStorage.setItem('itemCurrentIndex', itemIndex)
|
||
|
window.sessionStorage.setItem('itemListIndex', 0)
|
||
|
// console.log(123)
|
||
|
this.childInit()
|
||
|
}
|
||
|
} else if (!del && !flag) {
|
||
|
// console.log(123)
|
||
|
const getItemListCurrentIndex = window.sessionStorage.getItem('itemListIndex') ? window.sessionStorage.getItem('itemListIndex') : 0
|
||
|
const getItemCurrentIndex = window.sessionStorage.getItem('itemCurrentIndex') ? window.sessionStorage.getItem('itemCurrentIndex') : 0
|
||
|
// console.log(this.timeAxisData)
|
||
|
this.dataForm = this.timeAxisData[getItemCurrentIndex].dataList[getItemListCurrentIndex]
|
||
|
// console.log(this.dataForm)
|
||
|
this.childInit()
|
||
|
}
|
||
|
} else {
|
||
|
this.dataForm = {}
|
||
|
this.timeAxisData = []
|
||
|
del ? this.$emit('refreshFollow') : ''
|
||
|
}
|
||
|
this.loading = false
|
||
|
} else {
|
||
|
this.$message.error(res.msg)
|
||
|
}
|
||
|
},
|
||
|
// 删除
|
||
|
async deleteHandle() {
|
||
|
this.$confirmFun('你确定要删除此随访记录吗?').then(async() => {
|
||
|
const { data: res } = await this.$http.delete(`/visit/record/${this.dataForm.id}`)
|
||
|
if (res.code === 0) {
|
||
|
this.$message({
|
||
|
message: this.$t('prompt.success'),
|
||
|
type: 'success',
|
||
|
duration: 500,
|
||
|
onClose: () => {
|
||
|
this.getTimeAxisData('', '', 'delete')
|
||
|
}
|
||
|
})
|
||
|
} else {
|
||
|
this.$message.error(res.msg)
|
||
|
}
|
||
|
})
|
||
|
},
|
||
|
// 关闭弹框
|
||
|
closeDialog() {
|
||
|
// 调用档案兄弟组件事件
|
||
|
// eventBus.$emit('getArchiveCaseList')
|
||
|
this.$emit('closeDialog', false)
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
</script>
|
||
|
<style lang="scss" scoped>
|
||
|
.follow-up-record {
|
||
|
width: 100%;
|
||
|
height: 100%;
|
||
|
.no-follow-up-father {
|
||
|
width: 100%;
|
||
|
text-align: center;
|
||
|
margin-top: 10vh;
|
||
|
.title-one {
|
||
|
font-size: 14px;
|
||
|
color: rgba(0, 0, 0, 0.85);
|
||
|
margin-bottom: 8px;
|
||
|
font-weight: 700;
|
||
|
}
|
||
|
.title-two {
|
||
|
font-size: 12px;
|
||
|
color: rgba(0, 0, 0, 0.45);
|
||
|
margin-bottom: 8px;
|
||
|
}
|
||
|
}
|
||
|
.follow-up-content {
|
||
|
display: flex;
|
||
|
.content-left {
|
||
|
width: 180px;
|
||
|
.el-button {
|
||
|
width: 90%;
|
||
|
}
|
||
|
.buttonBackground {
|
||
|
background: #fff;
|
||
|
padding-bottom: 20px;
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
|
||
|
.content-right {
|
||
|
flex: 1;
|
||
|
//overflow:hidden;
|
||
|
//position: relatiave;
|
||
|
//text-align: center;
|
||
|
.buttons {
|
||
|
width: 100%;
|
||
|
//height: 50px;
|
||
|
//line-height: 50px;
|
||
|
//background: rgba(0, 0, 0, 0.5);
|
||
|
//position: absolute;
|
||
|
//top:0;
|
||
|
padding-right: 10px;
|
||
|
text-align: right;
|
||
|
}
|
||
|
.make-call {
|
||
|
position: absolute;
|
||
|
width: 255px;
|
||
|
top: 50px;
|
||
|
right: 10px;
|
||
|
}
|
||
|
.make-call-head,.make-call-record-list {
|
||
|
background: #F4F8FB;
|
||
|
border-radius: 6px;
|
||
|
width: 100%;
|
||
|
}
|
||
|
.make-call-head {
|
||
|
height: 68px;
|
||
|
display: flex;
|
||
|
justify-content: space-between;
|
||
|
padding: 12px;
|
||
|
.patient-info {
|
||
|
text-align: left;
|
||
|
border-right:1px solid #ccc;
|
||
|
padding-right: 12px;
|
||
|
}
|
||
|
.patient-info-head {
|
||
|
display: inline-block;
|
||
|
width:58px;
|
||
|
}
|
||
|
.patient-call {
|
||
|
color: #00820D;
|
||
|
cursor: pointer;
|
||
|
}
|
||
|
}
|
||
|
.make-call-record-list {
|
||
|
margin-top: 16px;
|
||
|
height: calc(88vh - 220px);
|
||
|
overflow-y: auto;
|
||
|
text-align: left;
|
||
|
padding:16px;
|
||
|
.text {
|
||
|
font-weight: 700;
|
||
|
font-size: 16px;
|
||
|
color: #1D2129;
|
||
|
margin-bottom: 16px;
|
||
|
}
|
||
|
.call-list {
|
||
|
margin-bottom: 16px;
|
||
|
}
|
||
|
.call-date {
|
||
|
padding-bottom: 2px;
|
||
|
color: #8E8E8E;
|
||
|
}
|
||
|
.call-file {
|
||
|
margin-left: 10px;
|
||
|
span:nth-child(1) {
|
||
|
padding-right: 10px;
|
||
|
}
|
||
|
span:nth-child(2) {
|
||
|
cursor: pointer;
|
||
|
color: #1e79ff;
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
.content-right-padding {
|
||
|
padding-right: 0;
|
||
|
}
|
||
|
}
|
||
|
</style>
|
||
|
<style lang="scss">
|
||
|
.follow-up-record {
|
||
|
.el-dialog {
|
||
|
height: 88vh;
|
||
|
margin-top: 7vh !important;
|
||
|
}
|
||
|
.microphone-blue {
|
||
|
color: #1e79ff;
|
||
|
}
|
||
|
.call-green {
|
||
|
color: #00820D;
|
||
|
}
|
||
|
}
|
||
|
</style>
|