postdischarge-ui/src/views/manage/components/signingRecords.vue
2024-08-08 15:03:57 +08:00

286 lines
8.1 KiB
Vue

<template>
<div class="header">
<div class="leftheader" v-if="categorylist.length > 0">
<div
class="item"
v-for="(item, index) in categorylist"
:key="item.id"
@click="clickcategory(item, index)"
:class="index == categoryindex ? 'selectitem' : ''"
>
<div class="time">{{ item.signTime }}</div>
<div class="name">{{ item.packageName }}</div>
<el-tag class="type" size="mini">服务中</el-tag>
<!-- <el-tag class="type" size="mini" type="success">门诊</el-tag> -->
</div>
</div>
<div class="rightheader" v-if="categorylist.length > 0">
<!-- 248px -->
<div class="richtext" :style="!fold ? 'height:calc(100vh - 254px)':'height:calc(100vh - 365px)'">
<el-descriptions title="基本信息" style="margin-top: 20px">
<el-descriptions-item label="医院">{{
ByRecord.hospitalAgencyName
}}</el-descriptions-item>
<el-descriptions-item label="科室">{{
ByRecord.departmentName
}}</el-descriptions-item>
<el-descriptions-item label="签约时诊断">{{
ByRecord.signDiagnosis
}}</el-descriptions-item>
<el-descriptions-item label="院区">{{
ByRecord.campusAgencyName
}}</el-descriptions-item>
<el-descriptions-item label="病区">{{
ByRecord.wardName
}}</el-descriptions-item>
<el-descriptions-item label="审核后诊断">{{
ByRecord.reviewDiagnosis
}}</el-descriptions-item>
</el-descriptions>
<el-descriptions title="签约信息" style="margin-top: 40px">
<el-descriptions-item label="服务包">{{
ByRecord.packageName
}}</el-descriptions-item>
<el-descriptions-item label="服务包缴费状态">{{
ByRecord.packagePaymentStatus == "PAID"
? "已缴费"
: ByRecord.packagePaymentStatus == "UNPAID_FEES"
? "未缴费"
: ""
}}</el-descriptions-item>
<el-descriptions-item label="到期时间">{{
ByRecord.serviceEndTime
}}</el-descriptions-item>
<el-descriptions-item label="服务包价格">{{
ByRecord.packagePrice
}}</el-descriptions-item>
<el-descriptions-item label="服务时间">{{
ByRecord.serviceStartTime
}}</el-descriptions-item>
<el-descriptions-item label="服务周期"
>{{ ByRecord.packageTerm }}{{ ByRecord.packageTermUnit }}
</el-descriptions-item>
<el-descriptions-item label="签约时间">{{
ByRecord.signTime
}}</el-descriptions-item>
</el-descriptions>
<el-descriptions title="专病管理路径" style="margin-top: 20px">
<el-descriptions-item label="路径名称">{{
ByRecord.routeName
}}</el-descriptions-item>
</el-descriptions>
<el-descriptions
title="硬件信息"
style="margin-top: 20px"
class="descriptions"
>
<el-descriptions-item>
<el-table :data="ByRecord.signDevices" style="width: 100%">
<el-table-column
label="序号"
type="index"
width="55"
align="center"
/>
<el-table-column
prop="hardwareType"
label="硬件类型"
width="180"
align="center"
>
<template slot-scope="scope">
{{
scope.row.hardwareType == "BLOOD_PRESSURE" ? "血压仪" : ""
}}
{{
scope.row.hardwareType == "GLUCOSE_METER" ? "血糖仪" : ""
}}
{{
scope.row.hardwareType == "ELECTROCARDIOGRA" ? "心电仪" : ""
}}
</template>
</el-table-column>
<el-table-column
prop="snCode"
label="SN码"
width="180"
align="center"
/>
<el-table-column
prop="hardwarePrice"
label="硬件金额(元)"
align="center"
/>
<el-table-column
prop="hardwareStatus"
label="硬件状态"
align="center"
/>
</el-table>
</el-descriptions-item>
</el-descriptions>
<el-descriptions
title="其他材料"
style="margin-top: 20px"
class="descriptions"
>
<el-descriptions-item>
<el-image
v-for="item in ByRecord.signPatientInformeds"
:key="item.signPatientRecordId"
class="img"
:src="item.informedFilePath"
:preview-src-list="srcList"
/>
</el-descriptions-item>
</el-descriptions>
</div>
</div>
<el-empty description="暂无" v-else style="width: 100%"></el-empty>
</div>
</template>
<script>
import {
getByPatient,
getByRecordId
} from '@/api/manage/signingRecords'
export default {
name: "signingRecords",
props:['fold'],//接收
data() {
return {
srcList: [],
//左侧类型选中
categoryindex: 0,
//左侧选中的item
categoryItem: {},
//左侧list
categorylist: [],
ByRecord: { signDevices: [], },
};
},
watch: {
fold(newvalue, oldvalue) {
if (newvalue) {
console.log(newvalue, "newvalue");
// this.signPatientRecordld = newvalue;
// this.info();
}
},
},
created() {
console.log(this.fold,'fold')
this.info();
},
methods: {
info() {
getByPatient(this.$route.query.patientId).then(res => {
if (res.data.length > 0) {
this.categorylist = res.data
this.categoryItem = this.categorylist[0]
this.getByRecordIdinfo();
}
})
},
getByRecordIdinfo() {
getByRecordId(this.categoryItem.id).then(res => {
this.ByRecord = res.data
this.ByRecord.signPatientInformeds.forEach(e => {
e.informedFilePath = process.env.VUE_APP_BASE_API + e.informedFilePath
this.srcList.push(e.informedFilePath)
})
})
},
clickcategory(item, index) {
this.categoryindex = index
this.categoryItem = item
this.getByRecordIdinfo();
}
}
};
</script>
<style lang="scss" scoped>
.img {
width: 100px;
height: 100px;
}
.header {
height: calc(100vh - 84px);
background-color: #fff !important;
padding: 0 !important;
display: flex;
.descriptions {
::v-deep .el-descriptions-item__label.has-colon::after {
display: none;
}
}
.rightheader {
// height: calc(100vh - 352px);
width: 75%;
padding-top: 20px;
// overflow-y: auto;
/* overflow-y: auto; */
border-left: 3px solid #dfe4ed;
.richtext {
height: calc(100vh - 352px);
width: 94%;
margin: 0 auto;
// height: 450px;
overflow: auto;
// 隐藏表头的滚动条
overflow-x: hidden !important;
}
}
.leftheader {
height: calc(100vh - 352px);
margin-top: 20px;
width: 25%;
/* height: 450px; */
overflow: auto;
overflow-x: hidden !important;
.selectitem {
background-color: #d2e9fc;
border-left: 2px solid #1890ff !important;
border-bottom: 1px solid #fff !important;
}
.item {
height: 100px;
padding: 25px 10px;
position: relative;
border-left: 2px solid #fff;
border-bottom: 1px solid #e7e7e7;
.type {
position: absolute;
right: 10px;
top: 20px;
font-size: 12px;
}
.name {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
height: 30px;
line-height: 30px;
font-size: 18px;
font-weight: 600;
}
.time {
line-height: 20px;
height: 20px;
font-size: 14px;
}
}
}
}
</style>