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

前端最新版本同步

Browse Source
This commit is contained in:
Zhang.WH
2025-09-25 10:36:07 +08:00
parent a3a06d6f3c
commit 1276dc4adb
117 changed files with 11964 additions and 2466 deletions
Download Patch File Download Diff File Expand all files Collapse all files

695
openhis-ui-vue3/src/template/surgicalPatientHandover.vue Normal file
View File

@@ -0,0 +1,695 @@
<!--
* @Author: sjjh
* @Date: 2025-09-19 13:04:49
* @Description: 手术患者移交
-->
<template>
<div class="surgicalPatientHandover-container">
<div class="handover-form">
<div class="form-header">
<h1 class="hospital-name">**医院</h1>
<h2 class="form-title">手术患者交接单</h2>
</div>
<div class="patient-info">
<el-row :gutter="20">
<el-col :span="6">
<div class="info-item">日期：{{ state.formData.date }}</div>
</el-col>
<el-col :span="6">
<div class="info-item">姓名：{{ state.formData.patientName }}</div>
</el-col>
<el-col :span="6">
<div class="info-item">性别：{{ state.formData.gender }}</div>
</el-col>
<el-col :span="6">
<div class="info-item">年龄：{{ state.formData.age }}岁</div>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="6">
<div class="info-item">科室：{{ state.formData.department }}</div>
</el-col>
<el-col :span="6">
<div class="info-item">床号：{{ state.formData.bedNumber }}</div>
</el-col>
<el-col :span="6">
<div class="info-item">住院号：{{ state.formData.hospitalNumber }}</div>
</el-col>
<el-col :span="6">
<div class="info-item">术前诊断：{{ state.formData.preDiagnosis }}</div>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="24">
<div class="info-item">拟行手术方式：{{ state.formData.surgeryMethod }}</div>
</el-col>
</el-row>
</div>
<el-form :model="state.formData" label-width="0" class="handover-form-content">
<!-- 一、病房护士与手术室护士交接记录 -->
<div class="form-section">
<div class="section-title">一、病房护士与手术室护士交接记录</div>
<el-row :gutter="20">
<el-col :span="12">
<div class="form-item">
<span class="item-label">药物过敏史</span>
<el-radio-group v-model="state.formData.drugAllergy">
<el-radio :label="1">无</el-radio>
<el-radio :label="2">有</el-radio>
</el-radio-group>
</div>
</el-col>
<el-col :span="12">
<div class="form-item">
<span v-if="state.formData.drugAllergy === 2"
>药物名称：
<el-input v-model="state.formData.allergyDrugName" class="inline-input"
/></span>
</div>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="24">
<div class="form-item">
<span class="item-label">身份确认</span>
<el-checkbox-group v-model="state.formData.identityConfirm">
<el-checkbox :label="1">患者姓名核实</el-checkbox>
<el-checkbox :label="2">病例核实</el-checkbox>
<el-checkbox :label="3">腕带核</el-checkbox>
</el-checkbox-group>
</div>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="24">
<div class="form-item">
<span class="item-label">手术标识</span>
<el-radio-group v-model="state.formData.surgeryMark">
<el-radio :label="1">无</el-radio>
<el-radio :label="2">有</el-radio>
</el-radio-group>
</div>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="24">
<div class="form-item">
<span class="item-label">生命体征</span>
<span>
<el-input v-model="state.formData.temperature" class="inline-input">
<template #prepend>T</template>
<template #append>℃</template>
</el-input>
</span>
<span class="ml-20"
><el-input v-model="state.formData.pulse" class="inline-input">
<template #prepend>P</template>
<template #append>次/分</template>
</el-input></span
>
<span class="ml-20"
><el-input v-model="state.formData.respiration" class="inline-input">
<template #prepend>R</template>
<template #append>次/分</template>
</el-input></span
>
<span class="ml-20"
><el-input v-model="state.formData.respiration" class="inline-input">
<template #prepend>BP</template>
<template #append>mmHg</template>
</el-input></span
>
</div>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="24">
<div class="form-item">
<span class="item-label">意识状态</span>
<el-checkbox-group v-model="state.formData.consciousness">
<el-checkbox :label="1">清醒</el-checkbox>
<el-checkbox :label="2">嗜睡</el-checkbox>
<el-checkbox :label="3">意识模糊</el-checkbox>
<el-checkbox :label="4">躁动</el-checkbox>
<el-checkbox :label="5">偏瘫</el-checkbox>
<el-checkbox :label="6">昏迷</el-checkbox>
</el-checkbox-group>
</div>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="24">
<div class="form-item">
<span class="item-label">皮肤情况</span>
<el-checkbox-group v-model="state.formData.skinCondition">
<el-checkbox :label="1">正常</el-checkbox>
<el-checkbox :label="2">破损</el-checkbox>
<el-checkbox :label="3">压力性损伤</el-checkbox>
<el-checkbox :label="4">其他</el-checkbox>
</el-checkbox-group>
<span v-if="state.formData.skinCondition.includes(4)"
>其他： <el-input v-model="state.formData.skinOther" class="inline-input"
/></span>
</div>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12">
<div class="form-item">
<span class="item-label">皮肤情况</span>
<span>部位</span>
<el-input v-model="state.formData.skinPosition1" class="inline-input" style="width: 50px" />
<span>面积</span>
<el-input
v-model="state.formData.skinArea1"
class="inline-input"
style="width: 50px"
/>
<span>×</span>
<el-input
v-model="state.formData.skinArea2"
class="inline-input"
style="width: 50px"
/>
</div>
</el-col>
<el-col :span="12">
<div class="form-item">
<span>部位</span>
<el-input v-model="state.formData.skinPosition2" class="inline-input" style="width: 50px" />
<span>面积</span>
<el-input
v-model="state.formData.skinArea3"
class="inline-input"
style="width: 50px"
/>
<span>×</span>
<el-input
v-model="state.formData.skinArea4"
class="inline-input"
style="width: 50px"
/>
</div>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="24">
<div class="form-item">
<span class="item-label">留置管路</span>
<el-checkbox-group v-model="state.formData.preOperativePipeline">
<el-checkbox :label="1">无</el-checkbox>
<el-checkbox :label="2">中心静脉置管</el-checkbox>
<el-checkbox :label="3">动脉置管</el-checkbox>
<el-checkbox :label="4">气管插管</el-checkbox>
<el-checkbox :label="5">胃管</el-checkbox>
<el-checkbox :label="6">尿管</el-checkbox>
<el-checkbox :label="7">引流管</el-checkbox>
</el-checkbox-group>
</div>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="24">
<div class="form-item">
<span class="item-label">外周静脉通路</span>
<el-input
v-model="state.formData.peripheralVein"
class="inline-input"
style="width: 50px"
/>
<span>条</span>
<el-checkbox-group v-model="state.formData.veinPosition" class="ml-20">
<el-checkbox :label="1">右上肢</el-checkbox>
<el-checkbox :label="2">右下肢</el-checkbox>
<el-checkbox :label="3">左上肢</el-checkbox>
<el-checkbox :label="4">左下肢</el-checkbox>
</el-checkbox-group>
</div>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="24">
<div class="form-item">
<span class="item-label">确认事项</span>
<el-checkbox-group v-model="state.formData.confirmItems">
<el-checkbox :label="1">禁食水</el-checkbox>
<el-checkbox :label="2">备皮</el-checkbox>
<el-checkbox :label="3">无活动义齿</el-checkbox>
<el-checkbox :label="4">无随形眼镜</el-checkbox>
<el-checkbox :label="5">摘首饰</el-checkbox>
<el-checkbox :label="6">非月经期</el-checkbox>
<el-checkbox :label="7">病员服</el-checkbox>
</el-checkbox-group>
</div>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="24">
<div class="form-item">
<span class="item-label">携带物品</span>
<el-checkbox-group v-model="state.formData.carryItems">
<el-checkbox :label="1">病例</el-checkbox>
<el-checkbox :label="2">药物</el-checkbox>
<el-checkbox :label="3">影像资料</el-checkbox>
<el-checkbox :label="4">胸/腹带</el-checkbox>
<el-checkbox :label="5">血制品</el-checkbox>
</el-checkbox-group>
</div>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="8">
<div class="form-item">
<span class="item-label">病房护士签名</span>
<el-input v-model="state.formData.wardNurseName" class="inline-input" />
</div>
</el-col>
<el-col :span="8">
<div class="form-item">
<span class="item-label">手术护士签名</span>
<el-input v-model="state.formData.surgeryNurseName" class="inline-input" />
</div>
</el-col>
<el-col :span="8">
<div class="form-item">
<span class="item-label">交接时间</span>
<el-input v-model="state.formData.handoverTime" class="inline-input" />
</div>
</el-col>
</el-row>
</div>
<!-- 二、手术室护士与麻醉复苏室护士/病房护士交接记录 -->
<div class="form-section">
<div class="section-title">二、手术室护士与麻醉复苏室护士/病房护士交接记录</div>
<el-row :gutter="20">
<el-col :span="24">
<div class="form-item">
<span class="item-label">生命体征</span>
<span>P</span>
<el-input
v-model="state.formData.postPulse"
class="inline-input"
style="width: 50px"
/>
<span>次/分</span>
<span class="ml-20">R</span>
<el-input
v-model="state.formData.postRespiration"
class="inline-input"
style="width: 50px"
/>
<span>次/分</span>
<span class="ml-20">BP</span>
<el-input v-model="state.formData.postBloodPressure" class="inline-input" />
<span>mmHg</span>
</div>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="24">
<div class="form-item">
<span class="item-label">意识状态</span>
<el-checkbox-group v-model="state.formData.postConsciousness">
<el-checkbox :label="1">清醒</el-checkbox>
<el-checkbox :label="2">未清醒</el-checkbox>
<el-checkbox :label="3">其他</el-checkbox>
</el-checkbox-group>
<span v-if="state.formData.postConsciousness.includes(3)"
>其他：
<el-input v-model="state.formData.postConsciousnessOther" class="inline-input"
/></span>
</div>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="24">
<div class="form-item">
<span class="item-label">皮肤情况</span>
<el-checkbox-group v-model="state.formData.postSkinCondition">
<el-checkbox :label="1">正常</el-checkbox>
<el-checkbox :label="2">破损</el-checkbox>
<el-checkbox :label="3">压力性损伤</el-checkbox>
<el-checkbox :label="4">其他</el-checkbox>
</el-checkbox-group>
<span v-if="state.formData.postSkinCondition.includes(4)"
>其他： <el-input v-model="state.formData.postSkinOther" class="inline-input"
/></span>
</div>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12">
<div class="form-item">
<span class="item-label">皮肤情况</span>
<span>部位</span>
<el-input v-model="state.formData.postSkinPosition1" class="inline-input" style="width: 50px" />
<span>面积</span>
<el-input
v-model="state.formData.postSkinArea1"
class="inline-input"
style="width: 50px"
/>
<span>×</span>
<el-input
v-model="state.formData.postSkinArea2"
class="inline-input"
style="width: 50px"
/>
</div>
</el-col>
<el-col :span="12">
<div class="form-item">
<span>部位</span>
<el-input v-model="state.formData.postSkinPosition2" class="inline-input" style="width: 50px" />
<span>面积</span>
<el-input
v-model="state.formData.postSkinArea3"
class="inline-input"
style="width: 50px"
/>
<span>×</span>
<el-input
v-model="state.formData.postSkinArea4"
class="inline-input"
style="width: 50px"
/>
</div>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="24">
<div class="form-item">
<span class="item-label">术后管路</span>
<el-checkbox-group v-model="state.formData.postOperativePipeline">
<el-checkbox :label="1">无</el-checkbox>
<el-checkbox :label="2">中心静脉置管</el-checkbox>
<el-checkbox :label="3">动脉置管</el-checkbox>
<el-checkbox :label="4">气管插管</el-checkbox>
<el-checkbox :label="5">胃管</el-checkbox>
<el-checkbox :label="6">尿管</el-checkbox>
<el-checkbox :label="7">引流管</el-checkbox>
</el-checkbox-group>
</div>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="24">
<div class="form-item">
<span class="item-label">外周静脉通路</span>
<el-input
v-model="state.formData.postPeripheralVein"
class="inline-input"
style="width: 50px"
/>
<span>条</span>
<el-checkbox-group v-model="state.formData.postVeinPosition" class="ml-20">
<el-checkbox :label="1">右上肢</el-checkbox>
<el-checkbox :label="2">右下肢</el-checkbox>
<el-checkbox :label="3">左上肢</el-checkbox>
<el-checkbox :label="4">左下肢</el-checkbox>
</el-checkbox-group>
</div>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="24">
<div class="form-item">
<span class="item-label">携带物品</span>
<el-checkbox-group v-model="state.formData.postCarryItems">
<el-checkbox :label="1">病历</el-checkbox>
<el-checkbox :label="2">药物</el-checkbox>
<el-checkbox :label="3">影像资料</el-checkbox>
<el-checkbox :label="4">胸/腹带</el-checkbox>
<el-checkbox :label="5">血制品</el-checkbox>
</el-checkbox-group>
</div>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="24">
<div class="form-item">
<span class="item-label">镇痛泵</span>
<el-radio-group v-model="state.formData.painPump">
<el-radio :label="1">无</el-radio>
<el-radio :label="2">有</el-radio>
</el-radio-group>
</div>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12">
<div class="form-item">
<span class="item-label" style="width: 220px;">手术室/麻醉复苏室护士签名</span>
<el-input v-model="state.formData.surgeryRecoveryNurseName" class="inline-input" />
</div>
</el-col>
<el-col :span="12">
<div class="form-item">
<span class="item-label">病房护士签名</span>
<el-input v-model="state.formData.postWardNurseName" class="inline-input" />
</div>
</el-col>
<el-col :span="12">
<div class="form-item">
<span class="item-label">病房护士填写</span>
<span>P</span>
<el-input
v-model="state.formData.wardNursePulse"
class="inline-input"
style="width: 50px"
/>
<span>次/分</span>
<span class="ml-10">BP</span>
<el-input
v-model="state.formData.wardNurseBloodPressure"
class="inline-input"
style="width: 80px"
/>
<span>mmHg</span>
</div>
</el-col>
<el-col :span="12">
<div class="form-item">
<span class="item-label">交接时间</span>
<el-input v-model="state.formData.postHandoverTime" class="inline-input" />
</div>
</el-col>
</el-row>
</div>
<!-- 其他 -->
<div class="form-section">
<div class="section-title">其他</div>
<el-row :gutter="20">
<el-col :span="24">
<div class="form-item">
<el-checkbox-group v-model="state.formData.otherItems">
<el-checkbox :label="1">离院</el-checkbox>
<el-checkbox :label="2">死亡</el-checkbox>
</el-checkbox-group>
</div>
</el-col>
</el-row>
</div>
</el-form>
</div>
</div>
</template>
<script setup>
defineOptions({
name: 'SurgicalPatientHandover',
});
import { getCurrentInstance, onBeforeMount, onMounted, reactive } from 'vue';
import { ElMessageBox, ElMessage, ElLoading, ElTree } from 'element-plus';
const { proxy } = getCurrentInstance();
const emits = defineEmits(['submitOk']);
const props = defineProps({});
const state = reactive({
formData: {
// 患者基本信息
date: '2025/8/13 13:36:41',
patientName: '于学斌',
gender: '男',
age: '46',
department: '普外科门诊区',
bedNumber: '035',
hospitalNumber: '2508000328',
preDiagnosis: '胆囊结石',
surgeryMethod: '腹腔镜胆囊切除术',
// 术前交接记录
drugAllergy: 1, // 1-无, 2-有
allergyDrugName: '',
identityConfirm: [1, 2, 3], // 1-患者姓名核实, 2-病例核实, 3-腕带核
surgeryMark: 1, // 1-无, 2-有
temperature: '37.5',
pulse: '78',
respiration: '19',
bloodPressure: '124/76',
consciousness: [1], // 1-清醒, 2-嗜睡, 3-意识模糊, 4-躁动, 5-偏瘫, 6-昏迷
skinCondition: [1], // 1-正常, 2-破损, 3-压力性损伤, 4-其他
skinOther: '',
skinPosition1: '',
skinArea1: '',
skinPosition2: '',
skinArea2: '',
preOperativePipeline: [1], // 1-无, 2-中心静脉置管, 3-动脉置管, 4-气管插管, 5-胃管, 6-尿管, 7-引流管
peripheralVein: '1',
veinPosition: [1], // 1-右上肢, 2-右下肢, 3-左上肢, 4-左下肢
confirmItems: [1, 2], // 1-禁食水, 2-备皮, 3-无活动义齿, 4-无随形眼镜, 5-摘首饰, 6-非月经期, 7-病员服
carryItems: [1, 2], // 1-病例, 2-药物, 3-影像资料, 4-胸/腹带, 5-血制品
wardNurseName: '周春贺',
surgeryNurseName: '',
handoverTime: '2025/8/13 13:40:37',
// 术后交接记录
postPulse: '',
postRespiration: '',
postBloodPressure: '',
postConsciousness: [], // 1-清醒, 2-未清醒, 3-其他
postConsciousnessOther: '',
postSkinCondition: [], // 1-正常, 2-破损, 3-压力性损伤, 4-其他
postSkinOther: '',
postSkinPosition1: '',
postSkinArea1: '',
postSkinPosition2: '',
postSkinArea2: '',
postOperativePipeline: [], // 1-无, 2-中心静脉置管, 3-动脉置管, 4-气管插管, 5-胃管, 6-尿管, 7-引流管
postPeripheralVein: '',
postVeinPosition: [], // 1-右上肢, 2-右下肢, 3-左上肢, 4-左下肢
postCarryItems: [], // 1-病历, 2-药物, 3-影像资料, 4-胸/腹带, 5-血制品
painPump: 1, // 1-无, 2-有
surgeryRecoveryNurseName: '',
postWardNurseName: '',
wardNursePulse: '',
wardNurseBloodPressure: '',
postHandoverTime: '',
// 其他
otherItems: [], // 1-离院, 2-死亡
},
});
const submit = ()=> {
// ElMessage.success('提交成功');
emits('submitOk',state.formData)
}
const setFormData = (data) => {
if (data) {
state.formData = data;
}
}
onBeforeMount(() => {});
onMounted(() => {});
defineExpose({ state, submit,setFormData });
</script>
<style lang="scss" scoped>
.surgicalPatientHandover-container {
padding: 20px;
.handover-form {
width: 100%;
max-width: 900px;
margin: 0 auto;
border: 1px solid #ccc;
padding: 20px;
background-color: #fff;
.form-header {
text-align: center;
margin-bottom: 20px;
.hospital-name {
font-size: 24px;
font-weight: bold;
margin-bottom: 10px;
}
.form-title {
font-size: 20px;
font-weight: bold;
}
}
.patient-info {
margin-bottom: 20px;
.info-item {
line-height: 30px;
}
}
.handover-form-content {
.form-section {
margin-bottom: 20px;
border: 1px solid #ddd;
.section-title {
font-weight: bold;
padding: 10px;
background-color: #f5f5f5;
border-bottom: 1px solid #ddd;
}
.form-item {
padding: 10px;
border-bottom: 1px solid #eee;
display: flex;
align-items: center;
&:last-child {
border-bottom: none;
}
.item-label {
display: inline-block;
width: 120px;
font-weight: bold;
}
.inline-input {
width: 150px;
margin: 0 5px;
}
.ml-10 {
margin-left: 10px;
}
.ml-20 {
margin-left: 20px;
}
}
}
}
:deep(.el-input-group__prepend){
padding: 0 8px;
}
:deep(.el-input-group__append){
padding: 0 8px;
}
}
}
</style>