feat(template): 添加股骨头坏死门诊病历模板

新增了一个名为“股骨头坏死(模板1)”的门诊病历模板文件，包含完整的主诉、现病史、既往史、体格检查、辅助检查、诊断和治疗方案等内容，便于医生快速调用和填写。

该模板位于 `src/template/股骨头坏死(模板1).vue`，采用 Vue 单文件组件格式编写，并定义了相应的结构与样式。

openhis-ui-vue3/src/template/nursingRecordSheet.vue

@@ -5,11 +5,13 @@
 -->
 <template>
   <div class="container">
+    <!-- 页面头部标题 -->
     <div class="header">
       <h2 class="title">乾安县人民医院</h2>
       <h3 class="subtitle">患者护理记录单</h3>
     </div>
 
+    <!-- 护理记录表单 -->
     <el-form :model="state.formData" label-position="top" class="nursing-form">
       <!-- 患者基本信息 -->
       <div class="patient-info">
@@ -58,9 +60,11 @@
         </el-row>
       </div>
 
-      <!-- 基本信息记录表格 -->
+      <!-- 生命体征记录表格 -->
       <div class="vital-signs-table">
+        <!-- 护理记录详细信息表格 -->
         <el-table :data="state.formData.vitalSigns" border style="width: 100%">
+          <!-- 记录日期列 -->
           <el-table-column label="日期" width="100">
             <template #default="scope">
               <el-date-picker
@@ -73,6 +77,7 @@
               ></el-date-picker>
             </template>
           </el-table-column>
+          <!-- 记录时间列 -->
           <el-table-column label="时间" width="100">
             <template #default="scope">
               <el-time-picker
@@ -84,7 +89,9 @@
               ></el-time-picker>
             </template>
           </el-table-column>
+          <!-- 基本信息列组 -->
           <el-table-column label="基本信息">
+            <!-- 意识状态 -->
             <el-table-column label="意识" width="80">
               <template #default="scope">
                 <el-select v-model="scope.row.consciousness" placeholder="选择">
@@ -94,38 +101,46 @@
                 </el-select>
               </template>
             </el-table-column>
+            <!-- 体温测量值 -->
             <el-table-column label="体温℃" width="80">
               <template #default="scope">
                 <el-input v-model="scope.row.temperature" placeholder="体温"></el-input>
               </template>
             </el-table-column>
+            <!-- 心率测量值 -->
             <el-table-column label="心率次/分" width="100">
               <template #default="scope">
                 <el-input v-model="scope.row.heartRate" placeholder="心率"></el-input>
               </template>
             </el-table-column>
-              <el-table-column label="脉搏次/分" width="100">
+            <!-- 脉搏测量值 -->
+            <el-table-column label="脉搏次/分" width="100">
               <template #default="scope">
                 <el-input v-model="scope.row.heartRate" placeholder="心率"></el-input>
               </template>
             </el-table-column>
+            <!-- 呼吸频率 -->
             <el-table-column label="呼吸次/分" width="100">
               <template #default="scope">
                 <el-input v-model="scope.row.respiratoryRate" placeholder="呼吸"></el-input>
               </template>
             </el-table-column>
+            <!-- 血压测量值 -->
             <el-table-column label="血压mmHg" width="120">
               <template #default="scope">
                 <el-input v-model="scope.row.bloodPressure" placeholder="血压"></el-input>
               </template>
             </el-table-column>
-             <el-table-column label="血氧饱和度" width="120">
+            <!-- 血氧饱和度 -->
+            <el-table-column label="血氧饱和度" width="120">
               <template #default="scope">
                 <el-input v-model="scope.row.bloodPressure" placeholder="血压"></el-input>
               </template>
             </el-table-column>
           </el-table-column>
+          <!-- 氧疗相关信息 -->
           <el-table-column label="氧疗L/min" width="200">
+            <!-- 氧疗方式 -->
             <el-table-column label="方式" >
               <template #default="scope">
                 <el-select v-model="scope.row.intake" placeholder="选择">
@@ -135,13 +150,16 @@
                 </el-select>
               </template>
             </el-table-column>
+            <!-- 氧流量 -->
             <el-table-column label="流量" width="80">
               <template #default="scope">
                 <el-input v-model="scope.row.flowRate" placeholder="流量"></el-input>
               </template>
             </el-table-column>
           </el-table-column>
-           <el-table-column label="入量" width="200">
+          <!-- 入量记录 -->
+          <el-table-column label="入量" width="200">
+            <!-- 入量名称 -->
             <el-table-column label="名称" >
               <template #default="scope">
                 <el-select v-model="scope.row.intake" placeholder="选择">
@@ -151,18 +169,22 @@
                 </el-select>
               </template>
             </el-table-column>
+            <!-- 入量毫升数 -->
             <el-table-column label="ml" width="80">
               <template #default="scope">
                 <el-input v-model="scope.row.flowRate" placeholder="流量"></el-input>
               </template>
             </el-table-column>
-                <el-table-column label="途径" width="80">
+            <!-- 入量途径 -->
+            <el-table-column label="途径" width="80">
               <template #default="scope">
                 <el-input v-model="scope.row.flowRate" placeholder="流量"></el-input>
               </template>
             </el-table-column>
           </el-table-column>
-             <el-table-column label="出量" width="200">
+          <!-- 出量记录 -->
+          <el-table-column label="出量" width="200">
+            <!-- 出量名称 -->
             <el-table-column label="名称" >
               <template #default="scope">
                 <el-select v-model="scope.row.intake" placeholder="选择">
@@ -172,32 +194,38 @@
                 </el-select>
               </template>
             </el-table-column>
+            <!-- 出量毫升数 -->
             <el-table-column label="ml" width="80">
               <template #default="scope">
                 <el-input v-model="scope.row.flowRate" placeholder="流量"></el-input>
               </template>
             </el-table-column>
           </el-table-column>
-            <el-table-column label="皮肤情况" width="80">
-              <template #default="scope">
-                <el-input v-model="scope.row.flowRate" placeholder="流量"></el-input>
+          <!-- 皮肤情况记录 -->
+          <el-table-column label="皮肤情况" width="80">
+            <template #default="scope">
+              <el-input v-model="scope.row.flowRate" placeholder="流量"></el-input>
               </template>
-            </el-table-column>
-                 <el-table-column label="管路护理" width="80">
-              <template #default="scope">
-                <el-input v-model="scope.row.flowRate" placeholder="流量"></el-input>
-              </template>
-            </el-table-column>
-                 <el-table-column label="病情与措施" width="80">
-              <template #default="scope">
-                <el-input v-model="scope.row.flowRate" placeholder="流量"></el-input>
-              </template>
-            </el-table-column>
+          </el-table-column>
+          <!-- 管路护理记录 -->
+          <el-table-column label="管路护理" width="80">
+            <template #default="scope">
+              <el-input v-model="scope.row.flowRate" placeholder="流量"></el-input>
+            </template>
+          </el-table-column>
+          <!-- 病情与措施记录 -->
+          <el-table-column label="病情与措施" width="80">
+            <template #default="scope">
+              <el-input v-model="scope.row.flowRate" placeholder="流量"></el-input>
+            </template>
+          </el-table-column>
+          <!-- 护士签名 -->
           <el-table-column label="护士签名" width="100">
             <template #default="scope">
               <el-input v-model="scope.row.nurseSignature" placeholder="签名"></el-input>
             </template>
           </el-table-column>
+          <!-- 操作列：提供删除功能 -->
           <el-table-column label="操作" width="120" fixed="right">
             <template #default="scope">
               <el-button type="danger" size="small" @click="removeVitalSign(scope.$index)"
@@ -206,12 +234,13 @@
             </template>
           </el-table-column>
         </el-table>
+        <!-- 添加新记录按钮 -->
         <div class="add-row">
           <el-button type="primary" @click="addVitalSign">添加记录</el-button>
         </div>
       </div>
 
-      <!-- 表单底部按钮 -->
+      <!-- 表单底部说明信息 -->
       <div class="form-actions">
         <div>
           一、意识:①清醒；②嗜睡；③意识模糊；④昏睡；⑤谗妄；⑥浅昏迷；⑦中度昏迷；⑧深昏迷；⑨全麻未醒；⑩镇静。
@@ -231,12 +260,21 @@
 </template>
 
 <script setup>
+// 定义组件选项
 defineOptions({
   name: 'NursingRecordSheet',
 });
-import { getCurrentInstance, onBeforeMount, onMounted, reactive } from 'vue';
+
+// 导入所需Vue功能
+import { getCurrentInstance, onBeforeMount, onMounted, reactive, ref } from 'vue';
+
+// 获取组件实例代理
 const { proxy } = getCurrentInstance();
+
+// 定义组件发射事件
 const emits = defineEmits([]);
+
+// 定义组件接收的属性
 const props = defineProps({
   patientId: {
     type: String,
@@ -244,28 +282,28 @@ const props = defineProps({
   },
 });
 
-// 表单数据
+// 表单数据状态管理
 const state = ref({
   formData: {
-    name: '',
-    age: '',
-    gender: '',
-    ward: '',
-    bedNumber: '',
-    hospitalNumber: '',
-    diagnosis: '',
-    vitalSigns: [
+    name: '',               // 患者姓名
+    age: '',                // 年龄
+    gender: '',             // 性别
+    ward: '',               // 病区
+    bedNumber: '',          // 床号
+    hospitalNumber: '',     // 住院号
+    diagnosis: '',          // 入院诊断
+    vitalSigns: [           // 生命体征记录数组
     {
-      date: new Date().toISOString().split('T')[0],
-      time: new Date().toTimeString().slice(0, 5),
-      consciousness: '清醒',
-      temperature: '',
-      heartRate: '',
-      respiratoryRate: '',
-      bloodPressure: '',
-      intake: '',
-      flowRate: '',
-      nurseSignature: '',
+      date: new Date().toISOString().split('T')[0],       // 默认当天日期
+      time: new Date().toTimeString().slice(0, 5),        // 默认当前时间
+      consciousness: '清醒',                               // 意识状态默认值
+      temperature: '',                                    // 体温
+      heartRate: '',                                      // 心率
+      respiratoryRate: '',                                // 呼吸频率
+      bloodPressure: '',                                  // 血压
+      intake: '',                                         // 入量
+      flowRate: '',                                       // 流量
+      nurseSignature: '',                                 // 护士签名
     },
   ],
   },
@@ -273,7 +311,7 @@ const state = ref({
   
 });
 
-// 添加生命体征记录
+// 添加生命体征记录方法
 const addVitalSign = () => {
   state.value.formData.vitalSigns.push({
     date: new Date().toISOString().split('T')[0],
@@ -290,17 +328,16 @@ const addVitalSign = () => {
   });
 };
 
-// 删除生命体征记录
+// 删除指定索引的生命体征记录
 const removeVitalSign = (index) => {
   state.value.formData.vitalSigns.splice(index, 1);
+  // 如果删除后没有记录，则自动添加一条空记录
   if (state.value.formData.vitalSigns.length === 0) {
     addVitalSign();
   }
 };
 
-
-
-// 重置表单
+// 重置整个表单数据
 const resetForm = () => {
   state.value.formData = {
     name: '',
@@ -315,34 +352,44 @@ const resetForm = () => {
  
 };
 
+// 组件挂载前执行的逻辑
 onBeforeMount(() => {
-  // 如果有patientId，可以在这里加载患者数据
+  // 如果有传入患者ID，则可以在此处加载患者数据
   if (props.patientId) {
     // 加载患者数据的逻辑
   }
 });
 
+// 组件挂载完成后执行的逻辑
 onMounted(() => {
   // 组件挂载后的逻辑
 });
+
+// 表单提交方法
 const submit = () => {
-  // ElMessage.success('提交成功');
+  // 触发submitOk事件，传递表单数据给父组件
   emits('submitOk', state.formData);
 };
+
+// 设置表单数据方法（供父组件调用）
 const setFormData = (data) => {
   if (data) {
     state.value.formData = data;
   }
 };
+
+// 暴露组件内部属性和方法给父组件使用
 defineExpose({ state, submit, setFormData });
 </script>
 
 <style lang="scss" scoped>
+// 容器样式
 .container {
   padding: 20px;
   background-color: #fff;
 }
 
+// 头部标题样式
 .header {
   text-align: center;
   margin-bottom: 20px;
@@ -359,6 +406,7 @@ defineExpose({ state, submit, setFormData });
   }
 }
 
+// 护理表单样式
 .nursing-form {
   .patient-info {
     padding: 15px; 

openhis-ui-vue3/src/template/outpatientMedicalRecord.vue

@@ -1,15 +1,19 @@
 <template>
+  <!-- 门诊病历表单主容器 -->
   <div class="medical-form">
+    <!-- 患者基本信息展示区域 -->
     <div class="patient-name">
       患者姓名：{{ patient?.patientName || '未知' }} &nbsp;&nbsp; 病历号：{{
         patient?.busNo || '未知'
       }}
     </div>
+    <!-- 医院名称和标题 -->
     <h2 style="text-align: center">{{ userStore.hospitalName }}</h2>
     <h2 style="text-align: center">门诊病历</h2>
 
     <!-- 滚动内容区域 -->
     <div class="form-scroll-container">
+      <!-- Element Plus表单组件 -->
       <el-form
         ref="formRef"
         :model="formData"
@@ -18,34 +22,40 @@
         label-align="left"
         class="medical-full-form"
       >
+        <!-- 基础信息区域标题 -->
         <h4 class="section-title">基础信息</h4>
         <!-- 1. 基础信息：单行自适应排列 -->
         <el-form-item class="form-section">
           <div class="single-row-layout">
+            <!-- 身高输入项 -->
             <el-form-item label="身高" prop="height" class="row-item">
               <div class="input-with-unit">
                 <el-input v-model="formData.height" type="text" placeholder="请输入" />
                 <span class="unit">cm</span>
               </div>
             </el-form-item>
+            <!-- 体重输入项 -->
             <el-form-item label="体重" prop="weight" class="row-item">
               <div class="input-with-unit">
                 <el-input v-model="formData.weight" type="text" placeholder="请输入" />
                 <span class="unit">kg</span>
               </div>
             </el-form-item>
+            <!-- 体温输入项 -->
             <el-form-item label="体温" prop="temperature" class="row-item">
               <div class="input-with-unit">
                 <el-input v-model="formData.temperature" type="text" placeholder="请输入" />
                 <span class="unit">℃</span>
               </div>
             </el-form-item>
+            <!-- 脉搏输入项 -->
             <el-form-item label="脉搏" prop="pulse" class="row-item">
               <div class="input-with-unit">
                 <el-input v-model="formData.pulse" type="text" placeholder="请输入" />
                 <span class="unit">次/分</span>
               </div>
             </el-form-item>
+            <!-- 发病日期选择项 -->
             <el-form-item label="发病日期" prop="onsetDate" class="row-item">
               <el-date-picker
                 v-model="formData.onsetDate"
@@ -54,14 +64,16 @@
                 value-format="YYYY-MM-DD"
                 style="width: 100%"
               />
-              <!-- <el-input v-model="formData.onsetDate" type="date" /> -->
             </el-form-item>
           </div>
         </el-form-item>
+        
+        <!-- 病史信息区域标题 -->
         <h4 class="section-title">病史信息</h4>
-        <!-- 2. 病史信息：单行自适应排列（新增调整） -->
+        <!-- 2. 病史信息：单行自适应排列 -->
         <el-form-item class="form-section">
           <div class="single-row-layout">
+            <!-- 现病史输入项 -->
             <el-form-item label="现病史" prop="presentIllness" class="row-item history-item">
               <el-input
                 v-model="formData.presentIllness"
@@ -70,9 +82,11 @@
                 autosize
               />
             </el-form-item>
+            <!-- 既往史输入项 -->
             <el-form-item label="既往史" prop="pastIllness" class="row-item history-item">
               <el-input v-model="formData.pastIllness" type="textarea" placeholder="无" autosize />
             </el-form-item>
+            <!-- 个人史输入项 -->
             <el-form-item label="个人史" prop="personalHistory" class="row-item history-item">
               <el-input
                 v-model="formData.personalHistory"
@@ -81,6 +95,7 @@
                 autosize
               />
             </el-form-item>
+            <!-- 过敏史输入项 -->
             <el-form-item label="过敏史" prop="allergyHistory" class="row-item history-item">
               <el-input
                 v-model="formData.allergyHistory"
@@ -89,6 +104,7 @@
                 autosize
               />
             </el-form-item>
+            <!-- 家族史输入项 -->
             <el-form-item label="家族史" prop="familyHistory" class="row-item history-item">
               <el-input
                 v-model="formData.familyHistory"
@@ -99,6 +115,8 @@
             </el-form-item>
           </div>
         </el-form-item>
+        
+        <!-- 主诉、查体(治疗)、处置、辅助检查区域标题 -->
         <h4 class="section-title">主诉、查体(治疗)、处置、辅助检查</h4>
         <!-- 3. 主诉（必填） -->
         <el-form-item label="主诉" prop="complaint" class="required form-item-single">
@@ -111,6 +129,7 @@
           />
         </el-form-item>
         <!-- 4. 查体、处理、辅助检查 -->
+        <!-- 查体(治疗)输入项 -->
         <el-form-item label="查体(治疗)" prop="physicalExam" class="form-item-single">
           <el-input
             v-model="formData.physicalExam"
@@ -121,6 +140,7 @@
           />
         </el-form-item>
 
+        <!-- 处置输入项 -->
         <el-form-item label="处置" prop="treatment" class="form-item-single">
           <el-input
             v-model="formData.treatment"
@@ -131,6 +151,7 @@
           />
         </el-form-item>
 
+        <!-- 辅助检查输入项 -->
         <el-form-item label="辅助检查" prop="auxiliaryExam" class="form-item-single">
           <el-input
             v-model="formData.auxiliaryExam"
@@ -146,51 +167,54 @@
 </template>
 
 <script setup>
+// 导入Vue相关功能和组件
 import { reactive, ref, onBeforeMount, onMounted, watch } from 'vue';
 import useUserStore from '../store/modules/user';
 import { ElInput, ElMessage, ElForm, ElFormItem } from 'element-plus';
 import { patientInfo } from '../views/doctorstation/components/store/patient';
 import { pa } from 'element-plus/es/locales.mjs';
 
+// 定义组件选项
 defineOptions({
   name: 'OutpatientMedicalRecord',
   components: { ElInput, ElMessage, ElForm, ElFormItem },
 });
 
-// // Props与事件,去掉props.patientInfo改为直接从store获取
-// const props = defineProps({
-//   patientInfo: {
-//     type: Object,
-//     required: true,
-//   },
-// });
+// 定义组件接收的属性（目前为空）
 const props = defineProps({});
+
+// 定义组件触发的事件
 const emits = defineEmits(['submitOk']);
 
 // 数据初始化
+// 获取用户store实例，用于获取医院名称等全局信息
 const userStore = useUserStore();
+// 患者信息引用，存储当前就诊患者的基本信息
 const patient = ref(null);
+// 表单引用，用于访问表单实例进行验证等操作
 const formRef = ref(null);
 
 // 表单数据（全部字符类型）
+// 存储门诊病历表单的所有字段数据
 const formData = reactive({
-  height: '', // 身高
-  weight: '', // 体重
-  temperature: '', // 体温
-  pulse: '', // 脉搏
-  onsetDate: '', // 发病日期
-  complaint: '', // 主诉（必填）
-  presentIllness: '', // 现病史
-  pastIllness: '', // 既往史
-  personalHistory: '', // 个人史
-  allergyHistory: '', // 过敏史
-  physicalExam: '', // 查体
-  treatment: '', // 处理
-  auxiliaryExam: '', // 辅助检查
-  familyHistory: '', // 家族史
+  height: '',              // 身高(cm)
+  weight: '',              // 体重(kg)
+  temperature: '',         // 体温(℃)
+  pulse: '',               // 脉搏(次/分)
+  onsetDate: '',           // 发病日期
+  complaint: '',           // 主诉（必填项）
+  presentIllness: '',      // 现病史
+  pastIllness: '',         // 既往史
+  personalHistory: '',     // 个人史
+  allergyHistory: '',      // 过敏史
+  physicalExam: '',        // 查体结果
+  treatment: '',           // 处理方案
+  auxiliaryExam: '',       // 辅助检查结果
+  familyHistory: '',       // 家族史
 });
 
 // 表单校验规则
+// 定义表单字段的验证规则，目前仅主诉为必填项
 const rules = reactive({
   complaint: [
     {
@@ -202,15 +226,21 @@ const rules = reactive({
 });
 
 // 提交函数
+// 用于触发表单验证并提交数据到父组件
 const submit = () => {
+  // 表单验证
   formRef.value.validate((isValid) => {
     if (isValid) {
+      // 触发submitOk事件，传递表单数据
       emits('submitOk', formData);
+      // 显示成功消息
       ElMessage.success('提交成功');
     }
   });
 };
-// 日期格式化工具
+
+// 日期格式化工具函数
+// 将Date对象格式化为 YYYY-MM-DD HH:mm 格式的字符串
 const formatDateTime = (date) => {
   const year = date.getFullYear();
   const month = String(date.getMonth() + 1).padStart(2, '0');
@@ -219,17 +249,23 @@ const formatDateTime = (date) => {
   const minute = String(date.getMinutes()).padStart(2, '0');
   return `${year}-${month}-${day} ${hour}:${minute}`;
 };
-// 表单数据赋值
+
+// 表单数据赋值函数
+// 用于外部组件向表单填充已有数据
 const setFormData = (data) => {
   if (data) {
+    // 将传入的数据合并到表单数据中
     Object.assign(formData, data);
   }
 };
 
-// 生命周期
+// 生命周期钩子 - 组件挂载前
 onBeforeMount(() => {});
+
+// 生命周期钩子 - 组件挂载后
 onMounted(() => {
   console.log('当前患者信息:', patientInfo);
+  // 从store获取患者信息
   patient.value = patientInfo.value;
   // 初始化发病日期为当前时间
   if (!formData.onsetDate) {
@@ -238,6 +274,7 @@ onMounted(() => {
 });
 
 // 监听患者信息变化，实现联动显示
+// 当patientInfo发生变化时更新本地patient引用
 watch(
   () => patientInfo.value,
   (newPatientInfo) => {
@@ -246,7 +283,8 @@ watch(
   { deep: true }
 );
 
-// 暴露接口
+// 暴露接口供父组件调用
+// 将formData、submit方法和setFormData方法暴露给父组件使用
 defineExpose({ formData, submit, setFormData });
 </script>
 

openhis-ui-vue3/src/template/股骨头坏死(模板1).vue

@@ -0,0 +1,44 @@
+<template>
+  <div class="template-content">
+    <div class="template-header">
+      <h3>股骨头坏死(模板1)</h3>
+    </div>
+    <div class="template-body">
+      <p>主诉：左侧髋部疼痛X个月，加重1周。</p>
+      <p>现病史：患者X个月前无明显诱因出现左侧髋部疼痛，活动后加重，休息后减轻，未予重视。1周前疼痛加重，行走困难，遂来我院就诊。</p>
+      <p>既往史：否认高血压、糖尿病、冠心病等慢性病史，否认手术、外伤史，否认药物过敏史。</p>
+      <p>体格检查：左侧髋关节压痛(+)，活动受限，左下肢肌力下降。</p>
+      <p>辅助检查：DR示左侧股骨头坏死。</p>
+      <p>诊断：左侧股骨头坏死。</p>
+      <p>治疗方案：1. 避免负重；2. 药物治疗；3. 必要时手术治疗。</p>
+    </div>
+  </div>
+</template>
+
+<script setup>
+defineOptions({
+  name: 'Template1'
+})
+// 可以在这里添加组件逻辑
+</script>
+
+<style scoped>
+.template-content {
+  background-color: white;
+  border: 1px solid #ddd;
+  border-radius: 4px;
+  padding: 15px;
+  min-height: 300px;
+}
+
+.template-header {
+  border-bottom: 1px solid #eee;
+  padding-bottom: 10px;
+  margin-bottom: 15px;
+}
+
+.template-body p {
+  margin-bottom: 10px;
+  line-height: 1.5;
+}
+</style>