wangyizhe/his
3
3
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

Revert "```"

Browse Source 
This reverts commit abc0674531.
This commit is contained in:
chenqi
2025-12-26 22:21:21 +08:00
parent ae6c486114
commit 3115e38cc4
920 changed files with 14452 additions and 107025 deletions
Download Patch File Download Diff File Expand all files Collapse all files

725
openhis-ui-vue3/src/views/hospitalRecord/components/admissionRecord.vue
View File

@@ -1,725 +0,0 @@
<template>
<div style="padding: 20px; max-width: 1200px; margin: 0 auto" ref="bodyRef">
<!-- 标题区域 - 居中加粗，增加层次感 -->
<div style="text-align: center; margin-bottom: 30px">
<div style="font-size: 22px; color: #333; letter-spacing: 1px">长春市朝阳区中医院</div>
<div
style="
font-size: 32px;
font-weight: 700;
color: #222;
padding: 12px 0;
border-bottom: 2px solid #333;
display: inline-block;
"
>
入院记录
</div>
<div style="margin-top: 8px; font-size: 14px; color: #666">（第 1 页，共 1 页）</div>
</div>
<!-- 基本信息模块 - 卡片式布局，优化间距和对齐 -->
<div
style="
border: 1px solid #ddd;
border-radius: 8px;
padding: 25px;
margin-bottom: 25px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.03);
"
>
<div
style="
font-size: 18px;
font-weight: 600;
color: #333;
margin-bottom: 20px;
padding-bottom: 10px;
border-bottom: 1px solid #eee;
"
>
基本信息
</div>
<div
style="
display: grid;
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
gap: 18px;
"
>
<!-- 第一列 -->
<div>
<div style="display: flex; align-items: flex-start; margin-bottom: 16px">
<span style="font-weight: 500; color: #333; min-width: 80px; font-size: 15px"
>姓名：</span
>
<span style="font-size: 14px; color: #666; line-height: 1.5">{{
formData.patientName
}}</span>
</div>
<div style="display: flex; align-items: flex-start; margin-bottom: 16px">
<span style="font-weight: 500; color: #333; min-width: 80px; font-size: 15px"
>性别：</span
>
<span style="font-size: 14px; color: #666; line-height: 1.5">{{
formData.gender
}}</span>
</div>
<div style="display: flex; align-items: flex-start; margin-bottom: 16px">
<span style="font-weight: 500; color: #333; min-width: 80px; font-size: 15px"
>民族：</span
>
<span style="font-size: 14px; color: #666; line-height: 1.5">{{
formData.nation || '汉族'
}}</span>
</div>
<div style="display: flex; align-items: flex-start; margin-bottom: 16px">
<span style="font-weight: 500; color: #333; min-width: 80px; font-size: 15px"
>婚姻状况：</span
>
<span style="font-size: 14px; color: #666; line-height: 1.5">{{
formData.marriage || ''
}}</span>
</div>
<div style="display: flex; align-items: flex-start; margin-bottom: 16px">
<span style="font-weight: 500; color: #333; min-width: 80px; font-size: 15px"
>入院时间：</span
>
<span style="font-size: 14px; color: #666; line-height: 1.5">{{
formData.admissionTime || ''
}}</span>
</div>
<div style="display: flex; align-items: flex-start">
<span style="font-weight: 500; color: #333; min-width: 80px; font-size: 15px"
>病史陈述：</span
>
<span style="font-size: 14px; color: #666; line-height: 1.5">{{
formData.historyReporter || ''
}}</span>
</div>
</div>
<!-- 第二列 -->
<div>
<div style="display: flex; align-items: flex-start; margin-bottom: 16px">
<span style="font-weight: 500; color: #333; min-width: 80px; font-size: 15px"
>住院号：</span
>
<span style="font-size: 14px; color: #666; line-height: 1.5">{{
formData.hospitalNo || '123456'
}}</span>
</div>
<div style="display: flex; align-items: flex-start; margin-bottom: 16px">
<span style="font-weight: 500; color: #333; min-width: 80px; font-size: 15px"
>年龄：</span
>
<span style="font-size: 14px; color: #666; line-height: 1.5">{{
formData.age || '16 岁'
}}</span>
</div>
<div style="display: flex; align-items: flex-start; margin-bottom: 16px">
<span style="font-weight: 500; color: #333; min-width: 80px; font-size: 15px"
>职业：</span
>
<span style="font-size: 14px; color: #666; line-height: 1.5">{{
formData.occupation || '中医'
}}</span>
</div>
<div style="display: flex; align-items: flex-start; margin-bottom: 16px">
<span style="font-weight: 500; color: #333; min-width: 80px; font-size: 15px"
>出生地：</span
>
<span style="font-size: 14px; color: #666; line-height: 1.5">{{
formData.birthplace || '阿拉善'
}}</span>
</div>
<div style="display: flex; align-items: flex-start; margin-bottom: 16px">
<span style="font-weight: 500; color: #333; min-width: 80px; font-size: 15px"
>记录时间：</span
>
<span style="font-size: 14px; color: #666; line-height: 1.5">{{
formData.recordTime || '2025-12-18 14:04:00'
}}</span>
</div>
<div style="display: flex; align-items: flex-start">
<span style="font-weight: 500; color: #333; min-width: 80px; font-size: 15px"
>可靠程度：</span
>
<span style="font-size: 14px; color: #666; line-height: 1.5">{{
formData.reliability
}}</span>
</div>
</div>
</div>
</div>
<!-- 病史信息模块 - 优化布局，内容可换行 -->
<div
style="
border: 1px solid #ddd;
border-radius: 8px;
padding: 25px;
margin-bottom: 25px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.03);
"
>
<div
style="
font-size: 18px;
font-weight: 600;
color: #333;
margin-bottom: 20px;
padding-bottom: 10px;
border-bottom: 1px solid #eee;
"
>
病史信息
</div>
<div
style="
display: grid;
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
gap: 18px;
"
>
<!-- 第一列 -->
<div>
<div style="display: flex; align-items: flex-start; margin-bottom: 16px">
<span style="font-weight: 500; color: #333; min-width: 80px; font-size: 15px"
>家族史：</span
>
<span style="font-size: 14px; color: #666; line-height: 1.6">{{
formData.familyHistory || ''
}}</span>
</div>
<div style="display: flex; align-items: flex-start; margin-bottom: 16px">
<span style="font-weight: 500; color: #333; min-width: 80px; font-size: 15px"
>现病史：</span
>
<span style="font-size: 14px; color: #666; line-height: 1.6">{{
formData.presentIllness || ''
}}</span>
</div>
<div style="display: flex; align-items: flex-start; margin-bottom: 16px">
<span style="font-weight: 500; color: #333; min-width: 80px; font-size: 15px"
>既往史：</span
>
<span style="font-size: 14px; color: #666; line-height: 1.6">{{
formData.pastIllness || formData.pastHistory || ''
}}</span>
</div>
<div style="display: flex; align-items: flex-start">
<span style="font-weight: 500; color: #333; min-width: 80px; font-size: 15px"
>主诉：</span
>
<span style="font-size: 14px; color: #666; line-height: 1.6">{{
formData.complaint || ''
}}</span>
</div>
</div>
<!-- 第二列 -->
<div>
<div style="display: flex; align-items: flex-start; margin-bottom: 16px">
<span style="font-weight: 500; color: #333; min-width: 80px; font-size: 15px"
>婚育史：</span
>
<span style="font-size: 14px; color: #666; line-height: 1.6">{{
formData.maritalHistory || ''
}}</span>
</div>
<div style="display: flex; align-items: flex-start; margin-bottom: 16px">
<span style="font-weight: 500; color: #333; min-width: 80px; font-size: 15px"
>月经史：</span
>
<span style="font-size: 14px; color: #666; line-height: 1.6">{{
formData.menstrualHistory || ''
}}</span>
</div>
<div style="display: flex; align-items: flex-start">
<span style="font-weight: 500; color: #333; min-width: 80px; font-size: 15px"
>个人史：</span
>
<span style="font-size: 14px; color: #666; line-height: 1.6">{{
formData.personalHistory || ''
}}</span>
</div>
</div>
</div>
</div>
<!-- 中医望闻问切模块 -->
<div
style="
border: 1px solid #ddd;
border-radius: 8px;
padding: 25px;
margin-bottom: 25px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.03);
"
>
<div
style="
font-size: 18px;
font-weight: 600;
color: #333;
margin-bottom: 20px;
padding-bottom: 10px;
border-bottom: 1px solid #eee;
"
>
中医望闻问切
</div>
<div style="display: flex; align-items: flex-start">
<span style="font-weight: 500; color: #333; min-width: 120px; font-size: 15px"
>详细记录：</span
>
<span style="font-size: 14px; color: #666; line-height: 1.8">{{
formData.tcmInfo || ''
}}</span>
</div>
</div>
<!-- 体格检查模块 - 优化两列布局，信息对齐 -->
<div
style="
border: 1px solid #ddd;
border-radius: 8px;
padding: 25px;
margin-bottom: 25px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.03);
"
>
<div
style="
font-size: 18px;
font-weight: 600;
color: #333;
margin-bottom: 20px;
padding-bottom: 10px;
border-bottom: 1px solid #eee;
"
>
体格检查
</div>
<div
style="
display: grid;
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
gap: 25px;
"
>
<!-- 第一列：生命体征 -->
<div>
<div
style="
font-size: 16px;
font-weight: 500;
color: #333;
margin-bottom: 15px;
padding-bottom: 8px;
border-bottom: 1px solid #f0f0f0;
"
>
生命体征
</div>
<div style="display: grid; grid-template-columns: 1fr 1fr; gap: 12px">
<div style="padding: 10px; background: #f8f8f8; border-radius: 4px; text-align: center">
<div style="font-size: 13px; color: #666; margin-bottom: 4px">体温</div>
<div style="font-size: 14px; color: #333; font-weight: 500">
{{ formData.temp || '' }}
</div>
</div>
<div style="padding: 10px; background: #f8f8f8; border-radius: 4px; text-align: center">
<div style="font-size: 13px; color: #666; margin-bottom: 4px">脉搏</div>
<div style="font-size: 14px; color: #333; font-weight: 500">
{{ formData.pulse || '' }}
</div>
</div>
<div style="padding: 10px; background: #f8f8f8; border-radius: 4px; text-align: center">
<div style="font-size: 13px; color: #666; margin-bottom: 4px">呼吸</div>
<div style="font-size: 14px; color: #333; font-weight: 500">
{{ formData.respiration || '' }}
</div>
</div>
<div style="padding: 10px; background: #f8f8f8; border-radius: 4px; text-align: center">
<div style="font-size: 13px; color: #666; margin-bottom: 4px">血压</div>
<div style="font-size: 14px; color: #333; font-weight: 500">
{{ formData.bp || '' }}
</div>
</div>
<div style="padding: 10px; background: #f8f8f8; border-radius: 4px; text-align: center">
<div style="font-size: 13px; color: #666; margin-bottom: 4px">身高</div>
<div style="font-size: 14px; color: #333; font-weight: 500">
{{ formData.height || '' }}
</div>
</div>
<div style="padding: 10px; background: #f8f8f8; border-radius: 4px; text-align: center">
<div style="font-size: 13px; color: #666; margin-bottom: 4px">体重</div>
<div style="font-size: 14px; color: #333; font-weight: 500">
{{ formData.weight || '' }}
</div>
</div>
<div
style="
padding: 10px;
background: #f8f8f8;
border-radius: 4px;
text-align: center;
grid-column: 1/3;
"
>
<div style="font-size: 13px; color: #666; margin-bottom: 4px">BMI</div>
<div style="font-size: 14px; color: #333; font-weight: 500">
{{ formData.bmi || '' }}
</div>
</div>
</div>
</div>
<!-- 第二列：检查详情 -->
<div>
<div
style="
font-size: 16px;
font-weight: 500;
color: #333;
margin-bottom: 15px;
padding-bottom: 8px;
border-bottom: 1px solid #f0f0f0;
"
>
检查详情
</div>
<div style="display: flex; align-items: flex-start; margin-bottom: 14px">
<span style="font-weight: 500; color: #333; min-width: 100px; font-size: 14px"
>皮肤粘膜：</span
>
<span style="font-size: 13px; color: #666; line-height: 1.5">{{
formData.skin || ''
}}</span>
</div>
<div style="display: flex; align-items: flex-start; margin-bottom: 14px">
<span style="font-weight: 500; color: #333; min-width: 100px; font-size: 14px"
>胸部：</span
>
<span style="font-size: 13px; color: #666; line-height: 1.5">{{
formData.chest || ''
}}</span>
</div>
<div style="display: flex; align-items: flex-start; margin-bottom: 14px">
<span style="font-weight: 500; color: #333; min-width: 100px; font-size: 14px"
>腹部：</span
>
<span style="font-size: 13px; color: #666; line-height: 1.5">{{
formData.abdomen || ''
}}</span>
</div>
<div style="display: flex; align-items: flex-start; margin-bottom: 14px">
<span style="font-weight: 500; color: #333; min-width: 100px; font-size: 14px"
>一般情况：</span
>
<span style="font-size: 13px; color: #666; line-height: 1.5">{{
formData.general || ''
}}</span>
</div>
<div style="display: flex; align-items: flex-start">
<span style="font-weight: 500; color: #333; min-width: 100px; font-size: 14px"
>四肢/神经：</span
>
<span style="font-size: 13px; color: #666; line-height: 1.5">{{
formData.limbsNervous || ''
}}</span>
</div>
</div>
</div>
</div>
<!-- 辅助检查模块 - 合并重复模块，优化显示 -->
<div
style="
border: 1px solid #ddd;
border-radius: 8px;
padding: 25px;
margin-bottom: 25px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.03);
"
>
<div
style="
font-size: 18px;
font-weight: 600;
color: #333;
margin-bottom: 20px;
padding-bottom: 10px;
border-bottom: 1px solid #eee;
"
>
辅助检查
</div>
<div
style="
display: grid;
grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
gap: 20px;
"
>
<div style="padding: 15px; background: #f8f8f8; border-radius: 6px">
<div style="font-weight: 500; color: #333; font-size: 15px; margin-bottom: 8px">
检查结果：
</div>
<div style="font-size: 14px; color: #666; line-height: 1.6">
{{ formData.auxExam || '' }}
</div>
</div>
</div>
</div>
<!-- 诊断信息模块 - 修正分类，优化布局 -->
<div
style="
border: 1px solid #ddd;
border-radius: 8px;
padding: 25px;
margin-bottom: 25px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.03);
"
>
<div
style="
font-size: 18px;
font-weight: 600;
color: #333;
margin-bottom: 20px;
padding-bottom: 10px;
border-bottom: 1px solid #eee;
"
>
诊断信息
</div>
<div
style="
display: grid;
grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
gap: 20px;
"
>
<div style="padding: 18px; background: #f8f8f8; border-radius: 6px">
<div style="font-weight: 500; color: #333; font-size: 15px; margin-bottom: 10px">
中医诊断：
</div>
<div style="font-size: 14px; color: #666; line-height: 1.8">
{{ formData.tcmDiagnosis || '' }}
</div>
</div>
<div style="padding: 18px; background: #f8f8f8; border-radius: 6px">
<div style="font-weight: 500; color: #333; font-size: 15px; margin-bottom: 10px">
西医诊断：
</div>
<div style="font-size: 14px; color: #666; line-height: 1.8">
{{ formData.westernDiagnosis || '' }}
</div>
</div>
</div>
</div>
<!-- 签名信息模块 -->
<div
style="
border: 1px solid #ddd;
border-radius: 8px;
padding: 25px;
margin-bottom: 30px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.03);
"
>
<div
style="
font-size: 18px;
font-weight: 600;
color: #333;
margin-bottom: 20px;
padding-bottom: 10px;
border-bottom: 1px solid #eee;
"
>
签名信息
</div>
<div
style="
display: grid;
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
gap: 30px;
max-width: 800px;
margin: 0 auto;
"
>
<div style="text-align: center">
<div
style="
font-weight: 500;
color: #333;
font-size: 15px;
margin-bottom: 40px;
border-bottom: 1px solid #333;
padding-bottom: 2px;
display: inline-block;
"
>
医师签名
</div>
<div style="font-size: 14px; color: #666">{{ formData.doctorSign || '' }}</div>
</div>
<div style="text-align: center">
<div
style="
font-weight: 500;
color: #333;
font-size: 15px;
margin-bottom: 40px;
border-bottom: 1px solid #333;
padding-bottom: 2px;
display: inline-block;
"
>
上级医师
</div>
<div style="font-size: 14px; color: #666">{{ formData.superiorSign || '' }}</div>
</div>
<div style="text-align: center">
<div
style="
font-weight: 500;
color: #333;
font-size: 15px;
margin-bottom: 40px;
border-bottom: 1px solid #333;
padding-bottom: 2px;
display: inline-block;
"
>
记录日期
</div>
<div style="font-size: 14px; color: #666">{{ formData.signDate || '' }}</div>
</div>
</div>
</div>
<!-- 底部备注 -->
<div
style="
text-align: center;
font-size: 13px;
color: #888;
margin-bottom: 20px;
padding-top: 10px;
border-top: 1px solid #eee;
"
>
本记录由长春市朝阳区中医院医师根据患者病情如实记录，仅供临床诊疗参考 |
地址：长春市朝阳区XX街XX号 | 联系电话：0431-XXXXXXX
</div>
<!-- 打印按钮 - 优化样式，居中显示 -->
<!-- <div style="text-align: center; margin-bottom: 30px">
<el-button type="primary" @click="onPrint" style="padding: 10px 30px; font-size: 15px"
>打印预览</el-button
>
</div> -->
</div>
</template>
<script setup>
import { ref, reactive } from 'vue';
import { previewPrint } from '../../../utils/printUtils';
const bodyRef = ref();
// 响应式表单数据
const formData = reactive({
// 基础信息
patientName: '', // 原patient?.name
hospitalNo: '', // 原patient?.busNo
gender: '', // 原patient?.genderEnum_enumText
age: '',
nation: '',
occupation: '', // 职业
marriage: '', // 婚姻状况
birthplace: '', // 出生地
admissionTime: '', // 入院时间
recordTime: '', // 记录时间
historyReporter: '', // 病史陈述者
reliability: '可靠', // 可靠程度
// 病史信息
complaint: '', // 主诉
presentIllness: '', // 现病史
pastIllness: '', // 既往史
personalHistory: '', // 个人史
allergyHistory: '', // 过敏史
pastHistory: '', // 既往史（重复字段，保留兼容）
familyHistory: '', // 家族史
maritalHistory: '', // 婚姻史
menstrualHistory: '', // 月经史
// 中医信息
tcmInfo: '',
// 体格检查
temp: '',
pulse: '',
respiration: '',
bp: '',
height: '',
weight: '',
bmi: '',
general: '',
skin: '',
chest: '',
abdomen: '',
limbsNervous: '',
// 辅助检查
auxExam: '',
// 诊断信息
tcmDiagnosis: '',
westernDiagnosis: '',
// 签名信息
doctorSign: '',
superiorSign: '',
signDate: '',
});
// 打印方法
const onPrint = () => {
// previewPrint(bodyRef.value);
};
const getDom = () => {
return bodyRef.value;
};
const setData = (data) => {
console.log('设置数据=========>', JSON.stringify(data));
Object.assign(formData, data);
};
defineExpose({
setData,
getDom,
});
</script>
<style scoped>
/* 打印样式优化，隐藏不必要元素 */
@media print {
.el-button {
display: none !important;
}
body {
print-color-adjust: exact;
-webkit-print-color-adjust: exact;
}
div[style*='box-shadow'] {
box-shadow: none !important;
}
}
</style>

543
openhis-ui-vue3/src/views/hospitalRecord/components/disDiagnMedicalRecord.vue
View File

@@ -1,543 +0,0 @@
<template>
<div
ref="bodyRef"
style="
padding: 30px 20px;
max-width: 1200px;
margin: 0 auto;
min-height: 100vh;
background: #f8f9fa;
font-family: 'Microsoft YaHei', 'PingFang SC', sans-serif;
"
>
<!-- 标题区域 - 强化正式感与层次感 -->
<div style="text-align: center; margin-bottom: 35px; padding: 20px 0">
<div
style="
font-size: 24px;
color: #2c3e50;
letter-spacing: 2px;
font-weight: 500;
margin-bottom: 8px;
"
>
长春市朝阳区中医院
</div>
<div
style="
font-size: 32px;
font-weight: 700;
color: #1a2b48;
padding: 12px 0;
border-bottom: 2px solid #2c3e50;
display: inline-block;
letter-spacing: 1px;
"
>
出院诊断病历
</div>
</div>
<!-- 基础信息卡片 -->
<div
style="
border: 1px solid #e5e8eb;
border-radius: 12px;
padding: 25px;
margin-bottom: 25px;
background: #ffffff;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.03);
"
>
<div
style="
font-size: 18px;
font-weight: 600;
color: #2c3e50;
margin-bottom: 20px;
padding-bottom: 10px;
border-bottom: 1px solid #f0f2f5;
position: relative;
"
>
基础信息
</div>
<div
style="
display: grid;
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
gap: 18px;
"
>
<div
style="
display: flex;
align-items: flex-start;
margin-bottom: 16px;
line-height: 1.6;
word-wrap: break-word;
"
>
<span
style="
font-weight: 500;
color: #34495e;
min-width: 80px;
font-size: 15px;
flex-shrink: 0;
word-wrap: break-word;
"
>姓名：</span
>
<span
style="
font-size: 14px;
color: #606266;
flex: 1;
word-wrap: break-word;
word-break: break-all;
white-space: normal;
"
>{{ formData.patientName }}</span
>
</div>
<div
style="
display: flex;
align-items: flex-start;
margin-bottom: 16px;
line-height: 1.6;
word-wrap: break-word;
"
>
<span
style="
font-weight: 500;
color: #34495e;
min-width: 80px;
font-size: 15px;
flex-shrink: 0;
word-wrap: break-word;
"
>性别：</span
>
<span
style="
font-size: 14px;
color: #606266;
flex: 1;
word-wrap: break-word;
word-break: break-all;
white-space: normal;
"
>{{ formData.gender }}</span
>
</div>
<div
style="
display: flex;
align-items: flex-start;
margin-bottom: 16px;
line-height: 1.6;
word-wrap: break-word;
"
>
<span
style="
font-weight: 500;
color: #34495e;
min-width: 80px;
font-size: 15px;
flex-shrink: 0;
word-wrap: break-word;
"
>年龄：</span
>
<span
style="
font-size: 14px;
color: #606266;
flex: 1;
word-wrap: break-word;
word-break: break-all;
white-space: normal;
"
>{{ formData.age }}</span
>
</div>
<div
style="
display: flex;
align-items: flex-start;
margin-bottom: 16px;
line-height: 1.6;
word-wrap: break-word;
"
>
<span
style="
font-weight: 500;
color: #34495e;
min-width: 80px;
font-size: 15px;
flex-shrink: 0;
word-wrap: break-word;
"
>住院号：</span
>
<span
style="
font-size: 14px;
color: #606266;
flex: 1;
word-wrap: break-word;
word-break: break-all;
white-space: normal;
"
>{{ formData.busNo }}</span
>
</div>
<div
style="
display: flex;
align-items: flex-start;
margin-bottom: 16px;
line-height: 1.6;
word-wrap: break-word;
"
>
<span
style="
font-weight: 500;
color: #34495e;
min-width: 80px;
font-size: 15px;
flex-shrink: 0;
word-wrap: break-word;
"
>职业：</span
>
<span
style="
font-size: 14px;
color: #606266;
flex: 1;
word-wrap: break-word;
word-break: break-all;
white-space: normal;
"
>{{ formData.temperature }}</span
>
</div>
<div
style="
display: flex;
align-items: flex-start;
margin-bottom: 16px;
line-height: 1.6;
word-wrap: break-word;
"
>
<span
style="
font-weight: 500;
color: #34495e;
min-width: 80px;
font-size: 15px;
flex-shrink: 0;
word-wrap: break-word;
"
>入院时间：</span
>
<span
style="
font-size: 14px;
color: #606266;
flex: 1;
word-wrap: break-word;
word-break: break-all;
white-space: normal;
"
>{{ formData.admissionDate }}</span
>
</div>
<div
style="
display: flex;
align-items: flex-start;
margin-bottom: 16px;
line-height: 1.6;
word-wrap: break-word;
"
>
<span
style="
font-weight: 500;
color: #34495e;
min-width: 80px;
font-size: 15px;
flex-shrink: 0;
word-wrap: break-word;
"
>出院时间：</span
>
<span
style="
font-size: 14px;
color: #606266;
flex: 1;
word-wrap: break-word;
word-break: break-all;
white-space: normal;
"
>{{ formData.dischargeDate }}</span
>
</div>
<div
style="
display: flex;
align-items: flex-start;
margin-bottom: 16px;
line-height: 1.6;
word-wrap: break-word;
"
>
<span
style="
font-weight: 500;
color: #34495e;
min-width: 80px;
font-size: 15px;
flex-shrink: 0;
word-wrap: break-word;
"
>住院天数：</span
>
<span
style="
font-size: 14px;
color: #606266;
flex: 1;
word-wrap: break-word;
word-break: break-all;
white-space: normal;
"
>{{ formData.hospitalDays }}</span
>
</div>
</div>
</div>
<!-- 诊断信息卡片 -->
<div
style="
border: 1px solid #e5e8eb;
border-radius: 12px;
padding: 25px;
margin-bottom: 25px;
background: #ffffff;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.03);
"
>
<div
style="
font-size: 18px;
font-weight: 600;
color: #2c3e50;
margin-bottom: 20px;
padding-bottom: 10px;
border-bottom: 1px solid #f0f2f5;
position: relative;
"
>
诊断
</div>
<div
style="
display: grid;
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
gap: 18px;
"
>
<div
style="
display: flex;
align-items: flex-start;
margin-bottom: 16px;
line-height: 1.6;
word-wrap: break-word;
"
>
<span
style="
font-weight: 500;
color: #34495e;
min-width: 80px;
font-size: 15px;
flex-shrink: 0;
word-wrap: break-word;
"
>出诊诊断：</span
>
<span
style="
font-size: 14px;
color: #606266;
flex: 1;
word-wrap: break-word;
word-break: break-all;
white-space: normal;
"
>{{ formData.DischargeDiagnosis }}</span
>
</div>
<div
style="
display: flex;
align-items: flex-start;
margin-bottom: 16px;
line-height: 1.6;
word-wrap: break-word;
grid-column: 1 / -1;
padding: 4px 0;
"
>
<span
style="
font-weight: 500;
color: #34495e;
min-width: 80px;
font-size: 15px;
flex-shrink: 0;
word-wrap: break-word;
"
>出院病情摘要：</span
>
<span
style="
font-size: 14px;
color: #606266;
flex: 1;
word-wrap: break-word;
word-break: break-all;
white-space: normal;
"
>{{ formData.SummaryAndDiagnosisAndTreatmentProcess }}</span
>
</div>
<div
style="
display: flex;
align-items: flex-start;
margin-bottom: 16px;
line-height: 1.6;
word-wrap: break-word;
grid-column: 1 / -1;
padding: 4px 0;
"
>
<span
style="
font-weight: 500;
color: #34495e;
min-width: 80px;
font-size: 15px;
flex-shrink: 0;
word-wrap: break-word;
"
>出院后要求及注意事项：</span
>
<span
style="
font-size: 14px;
color: #606266;
flex: 1;
word-wrap: break-word;
word-break: break-all;
white-space: normal;
"
>{{ formData.RequirementsAndPrecautionsAfterDischarge }}</span
>
</div>
<div
style="
display: flex;
align-items: flex-start;
margin-bottom: 16px;
line-height: 1.6;
word-wrap: break-word;
grid-column: 1 / -1;
padding: 4px 0;
"
>
<span
style="
font-weight: 500;
color: #34495e;
min-width: 80px;
font-size: 15px;
flex-shrink: 0;
word-wrap: break-word;
"
>中医调护：</span
>
<span
style="
font-size: 14px;
color: #606266;
flex: 1;
word-wrap: break-word;
word-break: break-all;
white-space: normal;
"
>{{ formData.TraditionalChineseMedicineNursing }}</span
>
</div>
</div>
</div>
</div>
</template>
<script setup>
import { ref, reactive } from 'vue'; // 补充缺失的reactive导入
const bodyRef = ref(null);
const showPrintPreview = ref(false); // 控制弹窗显隐
// 表单数据
const formData = reactive({
patientName: '', // 姓名
age: '', // 年龄
gender: '', // 性别
busNo: '', // 住院号
admissionDate: '', // 入院日期
dischargeDate: '', // 出院日期
hospitalDays: '', // 住院天数
DischargeDiagnosis: '', // 出院诊断
SummaryAndDiagnosisAndTreatmentProcess: '', // 出院病情摘要及诊疗经过
RequirementsAndPrecautionsAfterDischarge: '', // 出院后要求及注意事项
TraditionalChineseMedicineNursing: '', // 中医调护
});
const getDom = () => {
return bodyRef.value;
};
const setData = (data) => {
console.log('设置数据=========>', JSON.stringify(data));
Object.assign(formData, data);
};
defineExpose({
setData,
getDom,
});
</script>
<style scoped>
/* 以下是内联样式无法实现的样式（保留说明） */
/* 1. 伪元素样式（card-title::after）：内联样式不支持伪元素 */
/* 2. hover效果：内联样式不支持:hover伪类 */
/* 3. 媒体查询响应式：内联样式无法编写@media规则 */
/* 4. 打印预览相关样式：若需要打印功能，需单独处理 */
</style>

1429
openhis-ui-vue3/src/views/hospitalRecord/components/inAssessmentForm.vue
View File

File diff suppressed because it is too large Load Diff

347
openhis-ui-vue3/src/views/hospitalRecord/components/inCommunicatePrint.vue
View File

@@ -1,347 +0,0 @@
<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>

877
openhis-ui-vue3/src/views/hospitalRecord/components/intOperRecordSheet.vue
View File

@@ -1,877 +0,0 @@
<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;
color: #4a5568;
"
>
<span style="font-weight: 500">住院号：</span>
<span style="font-weight: 600; text-decoration: underline">{{ formData.busNo }}</span>
</div>
</div>
<!-- 基本信息模块（统一为card样式） -->
<div
style="
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;
"
>
<div
style="
padding: 14px 20px;
border-bottom: 1px solid #f0f0f0;
display: flex;
align-items: center;
"
>
<span style="font-size: 18px; font-weight: 600; letter-spacing: 0.5px">基本信息</span>
</div>
<div style="padding: 22px; gap: 20px; display: grid; grid-template-columns: repeat(2, 1fr)">
<div style="display: flex; align-items: center; padding: 9px 0">
<span
style="
font-weight: 500;
color: #333;
min-width: 100px;
font-size: 15px;
margin-right: 10px;
"
>姓名：</span
>
<span
style="
font-size: 15px;
color: #222;
padding: 5px 12px;
background: #f9f9f9;
border-radius: 4px;
flex: 1;
border: 1px solid #f0f0f0;
transition: all 0.2s ease;
"
>{{ formData.patientName }}</span
>
</div>
<div style="display: flex; align-items: center; padding: 9px 0">
<span
style="
font-weight: 500;
color: #333;
min-width: 100px;
font-size: 15px;
margin-right: 10px;
"
>性别：</span
>
<span
style="
font-size: 15px;
color: #222;
padding: 5px 12px;
background: #f9f9f9;
border-radius: 4px;
flex: 1;
border: 1px solid #f0f0f0;
transition: all 0.2s ease;
"
>{{ formData.gender }}</span
>
</div>
<div style="display: flex; align-items: center; padding: 9px 0">
<span
style="
font-weight: 500;
color: #333;
min-width: 100px;
font-size: 15px;
margin-right: 10px;
"
>年龄：</span
>
<span
style="
font-size: 15px;
color: #222;
padding: 5px 12px;
background: #f9f9f9;
border-radius: 4px;
flex: 1;
border: 1px solid #f0f0f0;
transition: all 0.2s ease;
"
>{{ formData.age }}岁</span
>
</div>
<div style="display: flex; align-items: center; padding: 9px 0">
<span
style="
font-weight: 500;
color: #333;
min-width: 100px;
font-size: 15px;
margin-right: 10px;
"
>科室：</span
>
<span
style="
font-size: 15px;
color: #222;
padding: 5px 12px;
background: #f9f9f9;
border-radius: 4px;
flex: 1;
border: 1px solid #f0f0f0;
transition: all 0.2s ease;
"
>{{ formData.department }}</span
>
</div>
<div style="display: flex; align-items: center; padding: 9px 0">
<span
style="
font-weight: 500;
color: #333;
min-width: 100px;
font-size: 15px;
margin-right: 10px;
"
>病房/床号：</span
>
<span
style="
font-size: 15px;
color: #222;
padding: 5px 12px;
background: #f9f9f9;
border-radius: 4px;
flex: 1;
border: 1px solid #f0f0f0;
transition: all 0.2s ease;
"
>{{ formData.bedNo }}</span
>
</div>
<div style="display: flex; align-items: center; padding: 9px 0">
<span
style="
font-weight: 500;
color: #333;
min-width: 100px;
font-size: 15px;
margin-right: 10px;
"
>手术日期：</span
>
<span
style="
font-size: 15px;
color: #222;
padding: 5px 12px;
background: #f9f9f9;
border-radius: 4px;
flex: 1;
border: 1px solid #f0f0f0;
transition: all 0.2s ease;
"
>{{ formData.operationDateTime }}</span
>
</div>
</div>
</div>
<!-- 手术团队信息模块 -->
<div
style="
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;
"
>
<div
style="
padding: 14px 20px;
border-bottom: 1px solid #f0f0f0;
display: flex;
align-items: center;
"
>
<span style="font-size: 18px; font-weight: 600; letter-spacing: 0.5px">手术团队信息</span>
</div>
<div style="padding: 22px; gap: 20px; display: grid; grid-template-columns: repeat(2, 1fr)">
<div style="display: flex; align-items: center; padding: 9px 0">
<span
style="
font-weight: 500;
color: #333;
min-width: 100px;
font-size: 15px;
margin-right: 10px;
"
>手术者：</span
>
<span
style="
font-size: 15px;
color: #222;
padding: 5px 12px;
background: #f9f9f9;
border-radius: 4px;
flex: 1;
border: 1px solid #f0f0f0;
transition: all 0.2s ease;
"
>{{ formData.surgeon }}</span
>
</div>
<div style="display: flex; align-items: center; padding: 9px 0">
<span
style="
font-weight: 500;
color: #333;
min-width: 100px;
font-size: 15px;
margin-right: 10px;
"
>第一助手：</span
>
<span
style="
font-size: 15px;
color: #222;
padding: 5px 12px;
background: #f9f9f9;
border-radius: 4px;
flex: 1;
border: 1px solid #f0f0f0;
transition: all 0.2s ease;
"
>{{ formData.firstAssistant }}</span
>
</div>
<div style="display: flex; align-items: center; padding: 9px 0">
<span
style="
font-weight: 500;
color: #333;
min-width: 100px;
font-size: 15px;
margin-right: 10px;
"
>第二助手：</span
>
<span
style="
font-size: 15px;
color: #222;
padding: 5px 12px;
background: #f9f9f9;
border-radius: 4px;
flex: 1;
border: 1px solid #f0f0f0;
transition: all 0.2s ease;
"
>{{ formData.secondAssistant }}</span
>
</div>
<div style="display: flex; align-items: center; padding: 9px 0">
<span
style="
font-weight: 500;
color: #333;
min-width: 100px;
font-size: 15px;
margin-right: 10px;
"
>器械护士：</span
>
<span
style="
font-size: 15px;
color: #222;
padding: 5px 12px;
background: #f9f9f9;
border-radius: 4px;
flex: 1;
border: 1px solid #f0f0f0;
transition: all 0.2s ease;
"
>{{ formData.scrubNurse }}</span
>
</div>
<div style="display: flex; align-items: center; padding: 9px 0">
<span
style="
font-weight: 500;
color: #333;
min-width: 100px;
font-size: 15px;
margin-right: 10px;
"
>麻醉医师：</span
>
<span
style="
font-size: 15px;
color: #222;
padding: 5px 12px;
background: #f9f9f9;
border-radius: 4px;
flex: 1;
border: 1px solid #f0f0f0;
transition: all 0.2s ease;
"
>{{ formData.anesthesiologist }}</span
>
</div>
<div style="display: flex; align-items: center; padding: 9px 0">
<span
style="
font-weight: 500;
color: #333;
min-width: 100px;
font-size: 15px;
margin-right: 10px;
"
>巡逻护士：</span
>
<span
style="
font-size: 15px;
color: #222;
padding: 5px 12px;
background: #f9f9f9;
border-radius: 4px;
flex: 1;
border: 1px solid #f0f0f0;
transition: all 0.2s ease;
"
>{{ formData.circulatingNurse }}</span
>
</div>
</div>
</div>
<!-- 手术详情模块 -->
<div
style="
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;
"
>
<div
style="
padding: 14px 20px;
border-bottom: 1px solid #f0f0f0;
display: flex;
align-items: center;
"
>
<span style="font-size: 18px; font-weight: 600; letter-spacing: 0.5px">手术详情</span>
</div>
<div style="padding: 22px; gap: 20px; display: grid; grid-template-columns: repeat(2, 1fr)">
<div style="display: flex; align-items: center; padding: 9px 0">
<span
style="
font-weight: 500;
color: #333;
min-width: 100px;
font-size: 15px;
margin-right: 10px;
"
>手术名称：</span
>
<span
style="
font-size: 15px;
color: #222;
padding: 5px 12px;
background: #f9f9f9;
border-radius: 4px;
flex: 1;
border: 1px solid #f0f0f0;
transition: all 0.2s ease;
"
>{{ formData.operationName }}</span
>
</div>
<div style="display: flex; align-items: center; padding: 9px 0">
<span
style="
font-weight: 500;
color: #333;
min-width: 100px;
font-size: 15px;
margin-right: 10px;
"
>手术方式：</span
>
<span
style="
font-size: 15px;
color: #222;
padding: 5px 12px;
background: #f9f9f9;
border-radius: 4px;
flex: 1;
border: 1px solid #f0f0f0;
transition: all 0.2s ease;
"
>{{ formData.operationMethod }}</span
>
</div>
<div style="display: flex; align-items: center; padding: 9px 0">
<span
style="
font-weight: 500;
color: #333;
min-width: 100px;
font-size: 15px;
margin-right: 10px;
"
>手术入路：</span
>
<span
style="
font-size: 15px;
color: #222;
padding: 5px 12px;
background: #f9f9f9;
border-radius: 4px;
flex: 1;
border: 1px solid #f0f0f0;
transition: all 0.2s ease;
"
>{{ formData.surgicalApproach }}</span
>
</div>
<div style="display: flex; align-items: center; padding: 9px 0">
<span
style="
font-weight: 500;
color: #333;
min-width: 100px;
font-size: 15px;
margin-right: 10px;
"
>术中发现：</span
>
<span
style="
font-size: 15px;
color: #222;
padding: 5px 12px;
background: #f9f9f9;
border-radius: 4px;
flex: 1;
border: 1px solid #f0f0f0;
transition: all 0.2s ease;
"
>{{ formData.intraoperativeFindings }}</span
>
</div>
<div style="display: flex; align-items: center; padding: 9px 0">
<span
style="
font-weight: 500;
color: #333;
min-width: 100px;
font-size: 15px;
margin-right: 10px;
"
>手术过程：</span
>
<span
style="
font-size: 15px;
color: #222;
padding: 5px 12px;
background: #f9f9f9;
border-radius: 4px;
flex: 1;
border: 1px solid #f0f0f0;
transition: all 0.2s ease;
"
>{{ formData.operationProcess }}</span
>
</div>
</div>
</div>
<!-- 术后情况模块 -->
<div
style="
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;
"
>
<div
style="
padding: 14px 20px;
border-bottom: 1px solid #f0f0f0;
display: flex;
align-items: center;
"
>
<span style="font-size: 18px; font-weight: 600; letter-spacing: 0.5px">术后情况</span>
</div>
<div style="padding: 22px; gap: 20px; display: grid; grid-template-columns: repeat(2, 1fr)">
<div style="display: flex; align-items: center; padding: 9px 0">
<span
style="
font-weight: 500;
color: #333;
min-width: 100px;
font-size: 15px;
margin-right: 10px;
"
>术中出血量：</span
>
<span
style="
font-size: 15px;
color: #222;
padding: 5px 12px;
background: #f9f9f9;
border-radius: 4px;
flex: 1;
border: 1px solid #f0f0f0;
transition: all 0.2s ease;
"
>{{ formData.bloodLoss }}ml</span
>
</div>
<div style="display: flex; align-items: center; padding: 9px 0">
<span
style="
font-weight: 500;
color: #333;
min-width: 100px;
font-size: 15px;
margin-right: 10px;
"
>输血情况：</span
>
<span
style="
font-size: 15px;
color: #222;
padding: 5px 12px;
background: #f9f9f9;
border-radius: 4px;
flex: 1;
border: 1px solid #f0f0f0;
transition: all 0.2s ease;
"
>{{ formData.bloodTransfusion }}</span
>
</div>
<div style="display: flex; align-items: center; padding: 9px 0">
<span
style="
font-weight: 500;
color: #333;
min-width: 100px;
font-size: 15px;
margin-right: 10px;
"
>引流管放置：</span
>
<span
style="
font-size: 15px;
color: #222;
padding: 5px 12px;
background: #f9f9f9;
border-radius: 4px;
flex: 1;
border: 1px solid #f0f0f0;
transition: all 0.2s ease;
"
>{{ formData.drainageTube }}</span
>
</div>
<div style="display: flex; align-items: center; padding: 9px 0">
<span
style="
font-weight: 500;
color: #333;
min-width: 100px;
font-size: 15px;
margin-right: 10px;
"
>标本处理：</span
>
<span
style="
font-size: 15px;
color: #222;
padding: 5px 12px;
background: #f9f9f9;
border-radius: 4px;
flex: 1;
border: 1px solid #f0f0f0;
transition: all 0.2s ease;
"
>{{ formData.specimenDisposal }}</span
>
</div>
<div style="display: flex; align-items: center; padding: 9px 0">
<span
style="
font-weight: 500;
color: #333;
min-width: 100px;
font-size: 15px;
margin-right: 10px;
"
>手术结束时间：</span
>
<span
style="
font-size: 15px;
color: #222;
padding: 5px 12px;
background: #f9f9f9;
border-radius: 4px;
flex: 1;
border: 1px solid #f0f0f0;
transition: all 0.2s ease;
"
>{{ formData.operationEndTime }}</span
>
</div>
<div style="display: flex; align-items: center; padding: 9px 0">
<span
style="
font-weight: 500;
color: #333;
min-width: 100px;
font-size: 15px;
margin-right: 10px;
"
>患者去向：</span
>
<span
style="
font-size: 15px;
color: #222;
padding: 5px 12px;
background: #f9f9f9;
border-radius: 4px;
flex: 1;
border: 1px solid #f0f0f0;
transition: all 0.2s ease;
"
>{{ formData.patientDestination }}</span
>
</div>
</div>
</div>
<!-- 签署确认模块 -->
<div
style="
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;
"
>
<div
style="
padding: 14px 20px;
border-bottom: 1px solid #f0f0f0;
display: flex;
align-items: center;
"
>
<span style="font-size: 18px; font-weight: 600; letter-spacing: 0.5px">签署确认</span>
</div>
<div style="padding: 22px; gap: 20px; display: grid; grid-template-columns: repeat(2, 1fr)">
<div style="display: flex; align-items: center; padding: 9px 0">
<span
style="
font-weight: 500;
color: #333;
min-width: 100px;
font-size: 15px;
margin-right: 10px;
"
>手术者签名：</span
>
<span
style="
font-size: 15px;
color: #222;
padding: 5px 12px;
background: #f9f9f9;
border-radius: 4px;
flex: 1;
border: 1px solid #f0f0f0;
transition: all 0.2s ease;
"
>{{ formData.surgeonSignature }}</span
>
</div>
<div style="display: flex; align-items: center; padding: 9px 0">
<span
style="
font-weight: 500;
color: #333;
min-width: 100px;
font-size: 15px;
margin-right: 10px;
"
>记录者签名：</span
>
<span
style="
font-size: 15px;
color: #222;
padding: 5px 12px;
background: #f9f9f9;
border-radius: 4px;
flex: 1;
border: 1px solid #f0f0f0;
transition: all 0.2s ease;
"
>{{ formData.recorderSignature }}</span
>
</div>
<div style="display: flex; align-items: center; padding: 9px 0">
<span
style="
font-weight: 500;
color: #333;
min-width: 100px;
font-size: 15px;
margin-right: 10px;
"
>记录日期：</span
>
<span
style="
font-size: 15px;
color: #222;
padding: 5px 12px;
background: #f9f9f9;
border-radius: 4px;
flex: 1;
border: 1px solid #f0f0f0;
transition: all 0.2s ease;
"
>{{ formData.recordDate }}</span
>
</div>
</div>
</div>
</div>
</template>
<script setup>
import { ref, reactive, defineExpose } from 'vue';
const bodyRef = ref();
// 响应式表单数据
const formData = reactive({
// 患者与手术基础信息
busNo: '',
patientName: '',
gender: '',
age: '',
department: '',
bedNo: '',
operationDateTime: '', // 手术日期时间
// 手术团队信息
surgeon: '', // 主刀医师
firstAssistant: '', // 第一助手
secondAssistant: '', // 第二助手
anesthesiologist: '', // 麻醉医师
circulatingNurse: '', // 巡回护士
scrubNurse: '', // 器械护士
// 手术详情
operationName: '', // 规范手术名称
operationMethod: '', // 手术方式
surgicalApproach: '', // 手术入路
intraoperativeFindings: '', // 术中发现
operationProcess: '', // 手术过程
// 术后情况
bloodLoss: '', // 术中出血量
bloodTransfusion: '', // 输血情况
drainageTube: '', // 引流管放置
specimenDisposal: '', // 标本处理
operationEndTime: '', // 手术结束时间
patientDestination: '', // 患者去向
// 签署信息
surgeonSignature: '', // 手术者签名
recorderSignature: '', // 记录者签名
recordDate: '', // 记录日期
});
const getDom = () => {
return bodyRef.value;
};
const setData = (data) => {
console.log('设置数据=========>', JSON.stringify(data));
Object.assign(formData, data);
};
defineExpose({
setData,
getDom,
});
</script>

4
openhis-ui-vue3/src/views/hospitalRecord/components/medicalRecordFirstPrint.json
View File

File diff suppressed because one or more lines are too long

3104
openhis-ui-vue3/src/views/hospitalRecord/components/medicalRecordPrint.vue
View File

File diff suppressed because it is too large Load Diff