<template>
|
<base-stage :stage-data="stageData" :case-info="caseInfo">
|
<template #header>
|
<el-alert
|
:title="`捐献确认 - ${getStatusText()}`"
|
:type="getAlertType()"
|
:description="getAlertDescription()"
|
show-icon
|
:closable="false"
|
/>
|
</template>
|
|
<el-row :gutter="20" style="margin-top: 20px;">
|
<el-col :span="8">
|
<el-card>
|
<div slot="header" class="card-header">
|
<span>确认信息概览</span>
|
</div>
|
<div class="confirm-overview">
|
<div class="overview-item">
|
<span class="label">确认状态:</span>
|
<el-tag :type="getStatusTag(confirmationDetails.status)">
|
{{ getStatusText(confirmationDetails.status) }}
|
</el-tag>
|
</div>
|
<div class="overview-item">
|
<span class="label">确认时间:</span>
|
<span>{{ formatTime(confirmationDetails.confirmTime) }}</span>
|
</div>
|
<div class="overview-item">
|
<span class="label">确认方式:</span>
|
<span>{{ confirmationDetails.method }}</span>
|
</div>
|
<div class="overview-item">
|
<span class="label">协调员:</span>
|
<span>{{ confirmationDetails.coordinator }}</span>
|
</div>
|
</div>
|
</el-card>
|
</el-col>
|
|
<el-col :span="8">
|
<el-card>
|
<div slot="header" class="card-header">
|
<span>家属同意情况</span>
|
</div>
|
<el-descriptions :column="1" size="small">
|
<el-descriptions-item label="主要家属">
|
{{ familyConsent.mainRelative }}
|
</el-descriptions-item>
|
<el-descriptions-item label="同意状态">
|
<el-tag :type="familyConsent.consented ? 'success' : 'warning'">
|
{{ familyConsent.consented ? '已同意' : '待确认' }}
|
</el-tag>
|
</el-descriptions-item>
|
<el-descriptions-item label="签字时间">
|
{{ formatTime(familyConsent.signTime) }}
|
</el-descriptions-item>
|
<el-descriptions-item label="关系证明">
|
{{ familyConsent.relationshipProof }}
|
</el-descriptions-item>
|
</el-descriptions>
|
</el-card>
|
</el-col>
|
|
<el-col :span="8">
|
<el-card>
|
<div slot="header" class="card-header">
|
<span>法律文件</span>
|
</div>
|
<div class="document-list">
|
<div v-for="doc in legalDocuments" :key="doc.name" class="document-item">
|
<div class="doc-info">
|
<i :class="doc.icon" style="color: #409EFF; margin-right: 8px;"></i>
|
<span>{{ doc.name }}</span>
|
</div>
|
<el-tag :type="doc.status === 'completed' ? 'success' : 'warning'" size="small">
|
{{ doc.status === 'completed' ? '已签署' : '待签署' }}
|
</el-tag>
|
</div>
|
</div>
|
</el-card>
|
</el-col>
|
</el-row>
|
|
<el-card style="margin-top: 20px;">
|
<div slot="header" class="card-header">
|
<span>捐献意愿确认书</span>
|
</div>
|
<div class="consent-content">
|
<p>本人/家属确认，在充分了解器官捐献的相关信息后，自愿同意进行器官捐献。</p>
|
<el-divider />
|
<el-descriptions :column="2" border>
|
<el-descriptions-item label="捐献者姓名">{{ caseInfo.donorName }}</el-descriptions-item>
|
<el-descriptions-item label="捐献者身份证号">{{ confirmationDetails.idNumber }}</el-descriptions-item>
|
<el-descriptions-item label="捐献器官类型">{{ confirmationDetails.organs }}</el-descriptions-item>
|
<el-descriptions-item label="捐献用途">{{ confirmationDetails.purpose }}</el-descriptions-item>
|
<el-descriptions-item label="签字人">{{ familyConsent.mainRelative }}</el-descriptions-item>
|
<el-descriptions-item label="签字日期">{{ formatTime(familyConsent.signTime) }}</el-descriptions-item>
|
</el-descriptions>
|
</div>
|
</el-card>
|
</base-stage>
|
</template>
|
|
<script>
|
import BaseStage from './BaseStage.vue';
|
|
export default {
|
name: 'DonationConfirmStage',
|
components: { BaseStage },
|
props: {
|
stageData: {
|
type: Object,
|
default: () => ({})
|
},
|
caseInfo: {
|
type: Object,
|
default: () => ({})
|
}
|
},
|
data() {
|
return {
|
confirmationDetails: {
|
status: 'completed',
|
confirmTime: '2023-12-03 11:00:00',
|
method: '家属书面同意',
|
coordinator: '赵协调员',
|
idNumber: '110101199001011234',
|
organs: '心脏、肝脏、肾脏、角膜',
|
purpose: '临床移植'
|
},
|
familyConsent: {
|
mainRelative: '张三父亲',
|
consented: true,
|
signTime: '2023-12-03 10:45:00',
|
relationshipProof: '户口本关系证明'
|
},
|
legalDocuments: [
|
{ name: '器官捐献同意书', icon: 'el-icon-document', status: 'completed' },
|
{ name: '家属关系证明', icon: 'el-icon-document', status: 'completed' },
|
{ name: '医疗免责声明', icon: 'el-icon-document', status: 'completed' },
|
{ name: '隐私保护协议', icon: 'el-icon-document', status: 'completed' }
|
]
|
};
|
},
|
methods: {
|
getStatusText() {
|
const status = this.stageData.status;
|
return status === 'completed' ? '已完成' :
|
status === 'in_progress' ? '进行中' : '未开始';
|
},
|
getAlertType() {
|
const status = this.stageData.status;
|
return status === 'completed' ? 'success' :
|
status === 'in_progress' ? 'warning' : 'info';
|
},
|
getAlertDescription() {
|
const status = this.stageData.status;
|
return status === 'completed' ? '捐献确认流程已完成，所有法律文件已签署' :
|
status === 'in_progress' ? '捐献确认流程正在进行中' : '等待开始捐献确认流程';
|
},
|
getStatusTag(status) {
|
const map = {
|
'completed': 'success',
|
'in_progress': 'warning',
|
'pending': 'info'
|
};
|
return map[status] || 'info';
|
}
|
}
|
};
|
</script>
|
|
<style scoped>
|
.confirm-overview {
|
padding: 10px 0;
|
}
|
|
.overview-item {
|
display: flex;
|
justify-content: space-between;
|
align-items: center;
|
margin-bottom: 15px;
|
padding: 8px 0;
|
border-bottom: 1px solid #f0f0f0;
|
}
|
|
.overview-item .label {
|
color: #606266;
|
font-weight: 500;
|
}
|
|
.document-list {
|
padding: 10px 0;
|
}
|
|
.document-item {
|
display: flex;
|
justify-content: space-between;
|
align-items: center;
|
margin-bottom: 12px;
|
padding: 8px 12px;
|
border: 1px solid #e4e7ed;
|
border-radius: 4px;
|
}
|
|
.doc-info {
|
display: flex;
|
align-items: center;
|
}
|
|
.consent-content {
|
padding: 20px;
|
line-height: 1.6;
|
}
|
</style>
|
