chenqi
abc0674531
docs(release-notes): 添加住院护士站划价功能说明和发版记录 - 新增住院护士站划价服务流程说明文档，详细描述了从参数预处理到结果响应的五大阶段流程 - 包含耗材类医嘱和诊疗活动类医嘱的差异化处理逻辑 - 添加完整的发版内容记录，涵盖新增菜单功能和各模块优化点 - 记录了住院相关功能的新增和门诊业务流程的修复 ```
347 lines
11 KiB
Vue
347 lines
11 KiB
Vue
<template>
|
||
<div style="padding: 20px; background: #f8f9fa; min-height: 100vh;" ref="bodyRef">
|
||
<!-- 标题区域 - 强化正式感 -->
|
||
<div
|
||
style="text-align: center; margin-bottom: 30px; padding: 20px; background: #fff; border-radius: 12px; box-shadow: 0 2px 6px rgba(0,0,0,0.03);">
|
||
<div style="font-size: 22px; color: #2d3748; letter-spacing: 1px;">长春市朝阳区中医院</div>
|
||
<div
|
||
style="font-size: 28px; font-weight: 700; margin: 12px 0; padding: 8px 0; border-bottom: 2px solid #e8f4f8; display: inline-block;">
|
||
住院患者入院沟通记录单</div>
|
||
<div style="display: flex; justify-content: center; align-items: center; gap: 10px; font-size: 15px; ">
|
||
<span style="font-weight: 500;">住院号：</span>
|
||
<span style="font-weight: 600; text-decoration: underline;">20210001</span>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 基本信息模块 -->
|
||
<div class="card-container">
|
||
<div class="card-header">
|
||
<span class="card-title">基本信息</span>
|
||
</div>
|
||
<div class="card-content grid-2col">
|
||
<div class="info-item">
|
||
<span class="info-label">姓名：</span>
|
||
<span class="info-value">张三</span>
|
||
</div>
|
||
<div class="info-item">
|
||
<span class="info-label">性别：</span>
|
||
<span class="info-value">男</span>
|
||
</div>
|
||
<div class="info-item">
|
||
<span class="info-label">年龄：</span>
|
||
<span class="info-value">34 岁</span>
|
||
</div>
|
||
<div class="info-item">
|
||
<span class="info-label">科室/病区：</span>
|
||
<span class="info-value">中医科</span>
|
||
</div>
|
||
<div class="info-item">
|
||
<span class="info-label">病房/床号：</span>
|
||
<span class="info-value">305-2</span>
|
||
</div>
|
||
<div class="info-item">
|
||
<span class="info-label">入院日期：</span>
|
||
<span class="info-value">2025-02-14</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 团队信息模块 -->
|
||
<div class="card-container">
|
||
<div class="card-header">
|
||
<span class="card-title">团队信息</span>
|
||
</div>
|
||
<div class="card-content grid-2col">
|
||
<div class="info-item">
|
||
<span class="info-label">经治医生：</span>
|
||
<span class="info-value">华佗</span>
|
||
</div>
|
||
<div class="info-item">
|
||
<span class="info-label">主治医生：</span>
|
||
<span class="info-value">王海明</span>
|
||
</div>
|
||
<div class="info-item">
|
||
<span class="info-label">科主任：</span>
|
||
<span class="info-value">特斯拉</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 病情与诊断模块 -->
|
||
<div class="card-container">
|
||
<div class="card-header">
|
||
<span class="card-title">病情与诊断</span>
|
||
</div>
|
||
<div class="card-content grid-2col">
|
||
<div class="info-item">
|
||
<span class="info-label">病情状况：</span>
|
||
<div class="info-value multi-line">
|
||
1111111111111111111111111111111111111111111111111111111111111111111111111111</div>
|
||
</div>
|
||
<div class="info-item">
|
||
<span class="info-label">中医诊断：</span>
|
||
<div class="info-value multi-line">
|
||
1111111111111111111111111111111111111111111111111111111111111111111111111111</div>
|
||
</div>
|
||
<div class="info-item">
|
||
<span class="info-label">西医诊断：</span>
|
||
<div class="info-value multi-line">
|
||
1111111111111111111111111111111111111111111111111111111111111111111111111111</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 治疗与检查计划模块 -->
|
||
<div class="card-container">
|
||
<div class="card-header">
|
||
<span class="card-title">治疗与检查计划</span>
|
||
</div>
|
||
<div class="card-content grid-2col">
|
||
<div class="info-item">
|
||
<span class="info-label">治疗方案：</span>
|
||
<div class="info-value multi-line">
|
||
1111111111111111111111111111111111111111111111111111111111111111111111111111</div>
|
||
</div>
|
||
<div class="info-item">
|
||
<span class="info-label">进一步检查项目：</span>
|
||
<div class="info-value multi-line">血常规、肝肾功能、腹部B超、心电图、中医辨证分型检查、肿瘤标志物筛查</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 风险告知模块 -->
|
||
<div class="card-container">
|
||
<div class="card-header">
|
||
<span class="card-title">风险告知</span>
|
||
</div>
|
||
<div class="card-content">
|
||
<div class="info-item full-width">
|
||
<span class="info-label">告知内容：</span>
|
||
<div class="info-value multi-line">
|
||
1. 治疗过程中可能出现药物不良反应（如过敏、胃肠道不适等），若出现不适需及时告知医护人员；<br />
|
||
2. 检查项目存在一定的操作风险（如穿刺出血、感染等），医护人员将严格按照规范操作；<br />
|
||
3. 病情可能因个体差异出现变化，需根据实际情况调整治疗方案；<br />
|
||
4. 若患者存在隐瞒病史、不配合治疗等情况，可能影响治疗效果，相关风险由患者自行承担。
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 签署确认模块 -->
|
||
<div class="card-container">
|
||
<div class="card-header">
|
||
<span class="card-title">签署确认</span>
|
||
</div>
|
||
<div class="card-content grid-2col">
|
||
<div class="info-item">
|
||
<span class="info-label">患者或家属：</span>
|
||
<span class="info-value">张三</span>
|
||
</div>
|
||
<div class="info-item">
|
||
<span class="info-label">与患者关系：</span>
|
||
<span class="info-value">妻子</span>
|
||
</div>
|
||
<div class="info-item">
|
||
<span class="info-label">签字日期：</span>
|
||
<span class="info-value">2025-02-14</span>
|
||
</div>
|
||
<div class="info-item">
|
||
<span class="info-label">沟通医师签字：</span>
|
||
<span class="info-value">华佗</span>
|
||
</div>
|
||
<div class="info-item">
|
||
<span class="info-label">沟通日期：</span>
|
||
<span class="info-value">2025-02-14</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</template>
|
||
|
||
<style scoped>
|
||
/* 全局卡片容器统一样式 */
|
||
.card-container {
|
||
border: 1px solid #e0e0e0;
|
||
border-radius: 8px;
|
||
overflow: hidden;
|
||
box-shadow: 0 1px 4px rgba(0, 0, 0, 0.05);
|
||
margin-bottom: 20px;
|
||
background: #fff;
|
||
transition: box-shadow 0.3s ease, transform 0.2s ease;
|
||
}
|
||
|
||
/* 卡片hover效果 */
|
||
.card-container:hover {
|
||
box-shadow: 0 3px 10px rgba(0, 0, 0, 0.08);
|
||
transform: translateY(-1px);
|
||
}
|
||
|
||
/* 卡片头部样式 */
|
||
.card-header {
|
||
padding: 14px 20px;
|
||
border-bottom: 1px solid #f0f0f0;
|
||
background-color: #f5fafe;
|
||
display: flex;
|
||
align-items: center;
|
||
}
|
||
|
||
/* 卡片标题样式 */
|
||
.card-title {
|
||
font-size: 18px;
|
||
font-weight: 600;
|
||
letter-spacing: 0.5px;
|
||
}
|
||
|
||
/* 卡片内容区统一样式 */
|
||
.card-content {
|
||
padding: 22px;
|
||
gap: 20px;
|
||
}
|
||
|
||
/* 2列网格布局（桌面端） */
|
||
.grid-2col {
|
||
display: grid;
|
||
grid-template-columns: repeat(2, 1fr);
|
||
}
|
||
|
||
/* 信息项统一样式 */
|
||
.info-item {
|
||
display: flex;
|
||
align-items: flex-start;
|
||
/* 改为顶端对齐，适配多行文本 */
|
||
padding: 9px 0;
|
||
gap: 8px;
|
||
}
|
||
|
||
/* 信息标签样式 */
|
||
.info-label {
|
||
font-weight: 500;
|
||
color: #333;
|
||
min-width: 110px;
|
||
font-size: 15px;
|
||
padding-top: 5px;
|
||
/* 对齐多行文本的顶部 */
|
||
}
|
||
|
||
/* 信息值样式（单行） */
|
||
.info-value {
|
||
font-size: 15px;
|
||
color: #222;
|
||
padding: 5px 12px;
|
||
background: #f9f9f9;
|
||
border-radius: 4px;
|
||
flex: 1;
|
||
border: 1px solid #f0f0f0;
|
||
transition: all 0.2s ease;
|
||
min-height: 28px;
|
||
/* 确保单行和多行高度一致 */
|
||
display: flex;
|
||
align-items: center;
|
||
}
|
||
|
||
/* 多行文本样式（适配长内容） */
|
||
.info-value.multi-line {
|
||
align-items: flex-start;
|
||
padding: 10px 12px;
|
||
line-height: 1.6;
|
||
min-height: 80px;
|
||
/* 最小高度，避免内容过少时显得空旷 */
|
||
white-space: pre-line;
|
||
/* 支持换行符和空格 */
|
||
}
|
||
|
||
/* 全屏宽度信息项（如风险告知） */
|
||
.info-item.full-width {
|
||
width: 100%;
|
||
}
|
||
|
||
/* 信息值hover效果 */
|
||
.info-value:hover {
|
||
background: #f2f2f2;
|
||
border-color: #e0e0e0;
|
||
}
|
||
|
||
/* 响应式适配（移动端1列布局） */
|
||
@media (max-width: 768px) {
|
||
.grid-2col {
|
||
grid-template-columns: 1fr;
|
||
}
|
||
|
||
.card-content {
|
||
padding: 16px;
|
||
gap: 16px;
|
||
}
|
||
|
||
.card-header {
|
||
padding: 12px 16px;
|
||
}
|
||
|
||
.card-title {
|
||
font-size: 16px;
|
||
}
|
||
|
||
.info-item {
|
||
padding: 10px 0;
|
||
}
|
||
|
||
.info-label {
|
||
min-width: 90px;
|
||
font-size: 14px;
|
||
padding-top: 4px;
|
||
}
|
||
|
||
.info-value {
|
||
font-size: 14px;
|
||
padding: 4px 10px;
|
||
min-height: 24px;
|
||
}
|
||
|
||
.info-value.multi-line {
|
||
padding: 8px 10px;
|
||
min-height: 60px;
|
||
line-height: 1.5;
|
||
}
|
||
|
||
/* 标题区域适配移动端 */
|
||
div[style*="font-size: 28px"] {
|
||
font-size: 24px !important;
|
||
}
|
||
|
||
div[style*="font-size: 22px"] {
|
||
font-size: 20px !important;
|
||
}
|
||
}
|
||
|
||
/* 打印样式优化 */
|
||
@media print {
|
||
body {
|
||
print-color-adjust: exact;
|
||
-webkit-print-color-adjust: exact;
|
||
background: #fff !important;
|
||
}
|
||
|
||
.card-container {
|
||
box-shadow: none !important;
|
||
border: 1px solid #ddd !important;
|
||
margin-bottom: 15px !important;
|
||
transform: none !important;
|
||
}
|
||
|
||
.card-header {
|
||
background: #f8f8f8 !important;
|
||
border-bottom: 1px solid #ddd !important;
|
||
}
|
||
|
||
.info-value {
|
||
background: #fff !important;
|
||
border: 1px dashed #eee !important;
|
||
}
|
||
|
||
.card-container:hover {
|
||
box-shadow: none !important;
|
||
}
|
||
}
|
||
</style>
|
||
<script setup>
|
||
|
||
</script> |