<template>
|
<div class="assessment-detail">
|
<el-card class="basic-info-card">
|
<div slot="header" class="clearfix">
|
<span>案例基本信息</span>
|
<el-button
|
style="float: right; padding: 3px 0"
|
type="text"
|
@click="handleAttachmentPreview"
|
>
|
<i class="el-icon-folder-opened"></i> 查看附件
|
</el-button>
|
</div>
|
|
<el-descriptions :column="2" border>
|
<el-descriptions-item label="住院号">{{
|
assessmentData.caseNo
|
}}</el-descriptions-item>
|
<el-descriptions-item label="潜在捐献者姓名">{{
|
assessmentData.donorName
|
}}</el-descriptions-item>
|
<el-descriptions-item label="性别">
|
<dict-tag :options="genderOptions" :value="assessmentData.gender" />
|
</el-descriptions-item>
|
<el-descriptions-item label="年龄"
|
>{{ assessmentData.age }}岁</el-descriptions-item
|
>
|
<el-descriptions-item label="血型">
|
<dict-tag
|
:options="bloodTypeOptions"
|
:value="assessmentData.bloodType"
|
/>
|
</el-descriptions-item>
|
<el-descriptions-item label="证件号码">{{
|
assessmentData.idCardNo
|
}}</el-descriptions-item>
|
<el-descriptions-item label="疾病诊断">{{
|
assessmentData.diagnosis
|
}}</el-descriptions-item>
|
<el-descriptions-item label="所在医疗机构">{{
|
assessmentData.hospitalName
|
}}</el-descriptions-item>
|
<el-descriptions-item label="主治医生">{{
|
assessmentData.doctorName
|
}}</el-descriptions-item>
|
<el-descriptions-item label="申请评估时间">{{
|
assessmentData.applyTime
|
}}</el-descriptions-item>
|
<el-descriptions-item label="评估类型">
|
<dict-tag
|
:options="assessmentTypeOptions"
|
:value="assessmentData.assessmentType"
|
/>
|
</el-descriptions-item>
|
<el-descriptions-item label="评估状态">
|
<el-tag :type="statusFilter(assessmentData.assessmentStatus)">
|
{{ statusTextFilter(assessmentData.assessmentStatus) }}
|
</el-tag>
|
</el-descriptions-item>
|
</el-descriptions>
|
</el-card>
|
|
<el-card class="organ-assessment-card">
|
<div slot="header" class="clearfix">
|
<span>器官评估表</span>
|
<el-button
|
v-if="isCoordinator && allOrgansAssessed"
|
style="float: right; margin-left: 10px"
|
type="primary"
|
size="mini"
|
@click="handleCompleteAssessment"
|
>
|
确认完成评估
|
</el-button>
|
<span v-if="!isCoordinator" class="jstitle">
|
当前角色：{{ currentDepartment }}评估人员
|
</span>
|
</div>
|
|
<el-table
|
:data="organAssessmentList"
|
v-loading="assessmentLoading"
|
style="width: 100%"
|
:row-class-name="getRowClassName"
|
>
|
<el-table-column
|
label="器官类型"
|
align="center"
|
prop="organType"
|
width="120"
|
>
|
<template slot-scope="scope">
|
<dict-tag
|
:options="organTypeOptions"
|
:value="scope.row.organType"
|
/>
|
</template>
|
</el-table-column>
|
<el-table-column
|
label="评估科室"
|
align="center"
|
prop="department"
|
width="120"
|
/>
|
<el-table-column
|
label="评估人员"
|
align="center"
|
prop="assessor"
|
|
/>
|
<!-- 新增：第一次评估状态 -->
|
<el-table-column label="第一次评估" align="center" >
|
<template slot-scope="scope">
|
<el-tag
|
:type="getAssessmentTagType(scope.row.firstAssessment.status)"
|
size="small"
|
>
|
{{ getAssessmentStatusText(scope.row.firstAssessment.status) }}
|
</el-tag>
|
</template>
|
</el-table-column>
|
<!-- 新增：第二次评估状态 -->
|
<el-table-column label="第二次评估" align="center" >
|
<template slot-scope="scope">
|
<el-tag
|
:type="getAssessmentTagType(scope.row.secondAssessment.status)"
|
size="small"
|
>
|
{{ getAssessmentStatusText(scope.row.secondAssessment.status) }}
|
</el-tag>
|
</template>
|
</el-table-column>
|
<el-table-column label="整体状态" align="center" >
|
<template slot-scope="scope">
|
<el-tag
|
:type="scope.row.assessmentStatus === '1' ? 'success' : 'warning'"
|
size="small"
|
>
|
{{ scope.row.assessmentStatus === "1" ? "已评估" : "待评估" }}
|
</el-tag>
|
</template>
|
</el-table-column>
|
<el-table-column
|
label="操作"
|
align="center"
|
width="180"
|
class-name="small-padding fixed-width"
|
>
|
<template slot-scope="scope">
|
<el-button
|
v-if="canAssessOrgan(scope.row)"
|
size="mini"
|
type="text"
|
@click="handleOrganAssess(scope.row)"
|
>
|
评估
|
</el-button>
|
<el-button v-else size="mini" type="text" disabled
|
>无权限</el-button
|
>
|
<el-button
|
size="mini"
|
type="text"
|
@click="handleViewOrganDetail(scope.row)"
|
>
|
详情
|
</el-button>
|
</template>
|
</el-table-column>
|
</el-table>
|
|
<!-- 器官评估详情 - 改为Tab页形式 -->
|
<el-dialog
|
:title="`${currentOrgan.organName}评估详情`"
|
:visible.sync="organDetailVisible"
|
width="90%"
|
top="5vh"
|
class="organ-detail-dialog"
|
>
|
<el-tabs v-model="activeAssessmentTab" type="card">
|
<!-- 第一次评估Tab -->
|
<el-tab-pane label="第一次评估" name="first">
|
<organ-assessment-form
|
:organ-data="currentOrgan"
|
:assessment-data="currentOrgan.firstAssessment"
|
assessment-type="first"
|
:readonly="!canAssessOrgan(currentOrgan)"
|
@save="handleSaveOrganAssessment"
|
/>
|
</el-tab-pane>
|
|
<!-- 第二次评估Tab -->
|
<el-tab-pane label="第二次评估" name="second">
|
<organ-assessment-form
|
:organ-data="currentOrgan"
|
:assessment-data="currentOrgan.secondAssessment"
|
assessment-type="second"
|
:readonly="!canAssessOrgan(currentOrgan)"
|
@save="handleSaveOrganAssessment"
|
/>
|
</el-tab-pane>
|
|
<!-- 评估汇总Tab -->
|
<el-tab-pane label="评估汇总" name="summary">
|
<div class="assessment-summary">
|
<el-descriptions title="评估结果汇总" :column="2" border>
|
<el-descriptions-item label="器官类型">
|
{{ currentOrgan.organName }}
|
</el-descriptions-item>
|
<el-descriptions-item label="评估科室">
|
{{ currentOrgan.department }}
|
</el-descriptions-item>
|
<el-descriptions-item label="第一次评估状态">
|
<el-tag :type="getAssessmentTagType(currentOrgan.firstAssessment.status)">
|
{{ getAssessmentStatusText(currentOrgan.firstAssessment.status) }}
|
</el-tag>
|
</el-descriptions-item>
|
<el-descriptions-item label="第二次评估状态">
|
<el-tag :type="getAssessmentTagType(currentOrgan.secondAssessment.status)">
|
{{ getAssessmentStatusText(currentOrgan.secondAssessment.status) }}
|
</el-tag>
|
</el-descriptions-item>
|
<el-descriptions-item label="第一次评估时间" :span="2">
|
{{ currentOrgan.firstAssessment.assessmentTime || '-' }}
|
</el-descriptions-item>
|
<el-descriptions-item label="第二次评估时间" :span="2">
|
{{ currentOrgan.secondAssessment.assessmentTime || '-' }}
|
</el-descriptions-item>
|
</el-descriptions>
|
|
<!-- 附件汇总 -->
|
<el-card header="评估附件" style="margin-top: 20px;">
|
<el-table :data="getAllAttachments(currentOrgan)" size="small">
|
<el-table-column label="附件名称" prop="fileName" />
|
<el-table-column label="评估阶段" >
|
<template slot-scope="{row}">
|
{{ row.assessmentType === 'first' ? '第一次评估' : '第二次评估' }}
|
</template>
|
</el-table-column>
|
<el-table-column label="上传时间" prop="uploadTime" width="180" />
|
<el-table-column label="操作" width="120">
|
<template slot-scope="{row}">
|
<el-button type="text" @click="handlePreviewAttachment(row)">预览</el-button>
|
</template>
|
</el-table-column>
|
</el-table>
|
</el-card>
|
</div>
|
</el-tab-pane>
|
</el-tabs>
|
|
<div slot="footer" class="dialog-footer">
|
<el-button @click="organDetailVisible = false">关闭</el-button>
|
<el-button
|
v-if="canAssessOrgan(currentOrgan)"
|
type="primary"
|
@click="handleSaveAllAssessments"
|
>
|
保存所有评估
|
</el-button>
|
</div>
|
</el-dialog>
|
</el-card>
|
|
<!-- 附件预览弹窗 -->
|
<!-- <attachment-preview
|
:visible="attachmentVisible"
|
:attachment-list="attachmentList"
|
@close="attachmentVisible = false"
|
/> -->
|
<FilePreviewDialog
|
:visible="attachmentVisible"
|
:file="attachmentList"
|
@close="attachmentVisible = false"
|
/>
|
</div>
|
</template>
|
|
<script>
|
import { getAssessment, updateOrganAssessment, completeAssessment } from "./mockAssessmentApi";
|
import FilePreviewDialog from "@/components/FilePreviewDialog";
|
import OrganAssessmentForm from "./components/OrganAssessmentForm.vue";
|
|
export default {
|
name: "AssessmentDetail",
|
components: { OrganAssessmentForm, FilePreviewDialog },
|
data() {
|
return {
|
assessmentId: undefined,
|
assessmentData: {},
|
organAssessmentList: [],
|
attachmentList: [],
|
assessmentLoading: false,
|
|
// 器官详情相关数据
|
organDetailVisible: false,
|
currentOrgan: {
|
organType: '',
|
organName: '',
|
department: '',
|
firstAssessment: this.getDefaultAssessment(),
|
secondAssessment: this.getDefaultAssessment()
|
},
|
activeAssessmentTab: 'first',
|
|
currentUser: {
|
id: "001",
|
name: "张医生",
|
department: "心脏外科",
|
role: "department"
|
},
|
|
attachmentVisible: false,
|
|
// 字典选项
|
genderOptions: [
|
{ value: "0", label: "男" },
|
{ value: "1", label: "女" }
|
],
|
bloodTypeOptions: [
|
{ value: "A", label: "A型" },
|
{ value: "B", label: "B型" },
|
{ value: "O", label: "O型" },
|
{ value: "AB", label: "AB型" }
|
],
|
assessmentTypeOptions: [
|
{ value: "1", label: "初次评估" },
|
{ value: "2", label: "最终评估" }
|
],
|
organTypeOptions: [
|
{ value: "heart", label: "心脏" },
|
{ value: "liver", label: "肝脏" },
|
{ value: "kidney", label: "肾脏" },
|
{ value: "lung", label: "肺脏" },
|
{ value: "pancreas", label: "胰腺" },
|
{ value: "intestine", label: "肠道" },
|
{ value: "cornea", label: "角膜" },
|
{ value: "skin", label: "皮肤" }
|
]
|
};
|
},
|
computed: {
|
isCoordinator() {
|
return this.currentUser.role === "coordinator";
|
},
|
currentDepartment() {
|
return this.currentUser.department;
|
},
|
allOrgansAssessed() {
|
return this.organAssessmentList.every(organ =>
|
organ.firstAssessment.status === 'assessed' &&
|
organ.secondAssessment.status === 'assessed'
|
);
|
}
|
},
|
created() {
|
this.assessmentId = this.$route.query.id;
|
this.getAssessmentDetail();
|
},
|
methods: {
|
// 获取默认评估数据结构
|
getDefaultAssessment() {
|
return {
|
status: 'pending', // pending, assessing, assessed
|
assessmentTime: '',
|
assessor: '',
|
functionStatus: '',
|
assessmentOpinion: '',
|
attachments: [],
|
clinicalData: {},
|
labResults: {}
|
};
|
},
|
|
// 获取评估详情
|
getAssessmentDetail() {
|
this.assessmentLoading = true;
|
getAssessment(this.assessmentId)
|
.then(response => {
|
if (response.code === 200) {
|
this.assessmentData = response.data.caseInfo;
|
this.organAssessmentList = this.transformOrganData(response.data.organAssessments || []);
|
}
|
this.assessmentLoading = false;
|
})
|
.catch(error => {
|
console.error("获取评估详情失败:", error);
|
this.assessmentLoading = false;
|
});
|
},
|
|
// 转换器官数据格式，支持两次评估
|
transformOrganData(organList) {
|
return organList.map(organ => {
|
const organName = this.getOrganName(organ.organType);
|
|
// 确保有两次评估的数据结构
|
if (!organ.firstAssessment) {
|
organ.firstAssessment = this.getDefaultAssessment();
|
}
|
if (!organ.secondAssessment) {
|
organ.secondAssessment = this.getDefaultAssessment();
|
}
|
|
// 设置器官名称
|
organ.organName = organName;
|
|
// 计算整体评估状态
|
organ.assessmentStatus = this.calculateOverallStatus(organ);
|
|
return organ;
|
});
|
},
|
|
// 计算整体评估状态
|
calculateOverallStatus(organ) {
|
const firstDone = organ.firstAssessment.status === 'assessed';
|
const secondDone = organ.secondAssessment.status === 'assessed';
|
|
if (firstDone && secondDone) return '1'; // 已完成
|
if (firstDone || secondDone) return '2'; // 部分完成
|
return '0'; // 未开始
|
},
|
|
// 获取评估状态标签类型
|
getAssessmentTagType(status) {
|
const typeMap = {
|
'pending': 'info',
|
'assessing': 'warning',
|
'assessed': 'success'
|
};
|
return typeMap[status] || 'info';
|
},
|
|
// 获取评估状态文本
|
getAssessmentStatusText(status) {
|
const textMap = {
|
'pending': '待评估',
|
'assessing': '评估中',
|
'assessed': '已评估'
|
};
|
return textMap[status] || '未知';
|
},
|
|
// 获取功能状态类型
|
getFunctionStatusType(status) {
|
const typeMap = {
|
"1": "success", // 正常
|
"2": "warning", // 轻度异常
|
"3": "danger", // 重度异常
|
"4": "info" // 无法评估
|
};
|
return typeMap[status] || "info";
|
},
|
|
// 获取功能状态文本
|
getFunctionStatusText(status) {
|
const textMap = {
|
"1": "正常",
|
"2": "轻度异常",
|
"3": "重度异常",
|
"4": "无法评估"
|
};
|
return textMap[status] || "未知";
|
},
|
|
// 获取器官名称
|
getOrganName(organType) {
|
const organ = this.organTypeOptions.find(opt => opt.value === organType);
|
return organ ? organ.label : organType;
|
},
|
|
// 检查评估权限
|
canAssessOrgan(organ) {
|
if (this.isCoordinator) return true;
|
return organ.department === this.currentDepartment;
|
},
|
|
// 获取行类名
|
getRowClassName({ row }) {
|
return this.canAssessOrgan(row) ? "assessable-row" : "non-assessable-row";
|
},
|
|
// 格式化时间
|
formatTime(time) {
|
if (!time) return '';
|
return new Date(time).toLocaleString();
|
},
|
|
// 查看器官详情
|
handleViewOrganDetail(organ) {
|
this.currentOrgan = JSON.parse(JSON.stringify(organ));
|
this.activeAssessmentTab = 'first';
|
this.organDetailVisible = true;
|
},
|
|
// 器官评估
|
handleOrganAssess(organ) {
|
this.currentOrgan = JSON.parse(JSON.stringify(organ));
|
this.activeAssessmentTab = 'first';
|
this.organDetailVisible = true;
|
},
|
|
// 保存单个评估
|
handleSaveOrganAssessment(assessmentData, assessmentType) {
|
const organToUpdate = {
|
...this.currentOrgan,
|
[assessmentType === 'first' ? 'firstAssessment' : 'secondAssessment']: {
|
...assessmentData,
|
status: 'assessed',
|
assessmentTime: new Date().toISOString(),
|
assessor: this.currentUser.name
|
}
|
};
|
|
// 更新整体状态
|
organToUpdate.assessmentStatus = this.calculateOverallStatus(organToUpdate);
|
|
updateOrganAssessment(organToUpdate)
|
.then(response => {
|
if (response.code === 200) {
|
this.$message.success(`${assessmentType === 'first' ? '第一次' : '第二次'}评估保存成功`);
|
this.getAssessmentDetail();
|
// 自动切换到下一个未完成的评估或汇总页
|
this.autoSwitchTab(assessmentType);
|
}
|
})
|
.catch(error => {
|
console.error("保存评估失败:", error);
|
this.$message.error("保存失败");
|
});
|
},
|
|
// 自动切换Tab页
|
autoSwitchTab(currentType) {
|
if (currentType === 'first' && this.currentOrgan.secondAssessment.status === 'pending') {
|
this.activeAssessmentTab = 'second';
|
} else if (currentType === 'second' ||
|
(currentType === 'first' && this.currentOrgan.secondAssessment.status === 'assessed')) {
|
this.activeAssessmentTab = 'summary';
|
}
|
},
|
|
// 保存所有评估
|
handleSaveAllAssessments() {
|
this.$confirm("确认保存所有评估数据吗？", "确认保存", {
|
confirmButtonText: "确定",
|
cancelButtonText: "取消",
|
type: "warning"
|
}).then(() => {
|
const organToUpdate = JSON.parse(JSON.stringify(this.currentOrgan));
|
|
// 更新整体状态
|
organToUpdate.assessmentStatus = this.calculateOverallStatus(organToUpdate);
|
|
updateOrganAssessment(organToUpdate)
|
.then(response => {
|
if (response.code === 200) {
|
this.$message.success("所有评估数据保存成功");
|
this.getAssessmentDetail();
|
this.organDetailVisible = false;
|
}
|
})
|
.catch(error => {
|
console.error("保存评估失败:", error);
|
this.$message.error("保存失败");
|
});
|
});
|
},
|
|
// 获取所有附件
|
getAllAttachments(organ) {
|
const attachments = [];
|
|
if (organ.firstAssessment.attachments) {
|
organ.firstAssessment.attachments.forEach(att => {
|
attachments.push({
|
...att,
|
assessmentType: 'first'
|
});
|
});
|
}
|
|
if (organ.secondAssessment.attachments) {
|
organ.secondAssessment.attachments.forEach(att => {
|
attachments.push({
|
...att,
|
assessmentType: 'second'
|
});
|
});
|
}
|
|
return attachments;
|
},
|
|
// 预览附件
|
handlePreviewAttachment(attachment) {
|
// 实现附件预览逻辑
|
console.log('预览附件:', attachment);
|
this.$message.info('附件预览功能待实现');
|
},
|
|
// 状态过滤器
|
statusFilter(status) {
|
const statusMap = {
|
"0": "warning",
|
"1": "primary",
|
"2": "success",
|
"3": "danger"
|
};
|
return statusMap[status] || "info";
|
},
|
|
statusTextFilter(status) {
|
const statusMap = {
|
"0": "待评估",
|
"1": "评估中",
|
"2": "已完成",
|
"3": "已关闭"
|
};
|
return statusMap[status] || "未知";
|
},
|
|
handleAttachmentPreview() {
|
this.attachmentVisible = true;
|
},
|
|
handleCompleteAssessment() {
|
this.$confirm("确认完成所有器官评估吗？完成后将无法修改", "确认操作", {
|
confirmButtonText: "确定",
|
cancelButtonText: "取消",
|
type: "warning"
|
}).then(() => {
|
completeAssessment(this.assessmentId)
|
.then(response => {
|
if (response.code === 200) {
|
this.$message.success("评估完成确认成功");
|
this.getAssessmentDetail();
|
}
|
})
|
.catch(error => {
|
console.error("完成评估失败:", error);
|
this.$message.error("操作失败");
|
});
|
});
|
}
|
}
|
};
|
</script>
|
|
<style scoped>
|
.assessment-detail {
|
padding: 20px;
|
}
|
|
.basic-info-card {
|
margin-bottom: 20px;
|
}
|
|
.organ-assessment-card {
|
margin-bottom: 20px;
|
}
|
|
.assessment-time {
|
font-size: 12px;
|
color: #909399;
|
margin-top: 4px;
|
}
|
|
/* Tab页样式优化 */
|
.organ-detail-dialog ::v-deep .el-dialog__body {
|
padding: 20px;
|
max-height: 70vh;
|
overflow-y: auto;
|
}
|
|
.organ-detail-dialog ::v-deep .el-tabs__content {
|
padding: 20px 0;
|
min-height: 400px;
|
}
|
|
.assessment-summary {
|
padding: 10px;
|
}
|
|
.dialog-footer {
|
text-align: right;
|
padding-top: 20px;
|
border-top: 1px solid #ebeef5;
|
}
|
|
/* 响应式设计 */
|
@media (max-width: 768px) {
|
.organ-detail-dialog {
|
width: 95% !important;
|
}
|
|
.assessment-detail {
|
padding: 10px;
|
}
|
}
|
|
::v-deep .assessable-row {
|
background-color: #f0f9ff;
|
}
|
|
::v-deep .non-assessable-row {
|
background-color: #fafafa;
|
}
|
|
::v-deep .el-descriptions__label {
|
width: 120px;
|
background-color: #f5f7fa;
|
font-weight: bold;
|
}
|
|
.fixed-width .el-button {
|
margin: 0 2px;
|
}
|
|
.jstitle {
|
float: right;
|
font-size: 18px !important;
|
font-weight: 600;
|
color: #2645f7;
|
font-size: 12px;
|
}
|
|
/* Tab页激活状态样式 */
|
::v-deep .el-tabs__item.is-active {
|
color: #409EFF;
|
font-weight: bold;
|
}
|
|
/* 评估表单样式 */
|
.assessment-form-section {
|
margin-bottom: 20px;
|
}
|
|
.assessment-form-section h3 {
|
margin-bottom: 15px;
|
color: #303133;
|
border-left: 4px solid #409EFF;
|
padding-left: 10px;
|
}
|
</style>
|
