诊疗详情

acupuncture-前台/src/views/medicalFile/details.vue

@@ -1,6 +1,16 @@
 <template>
   <div class="app-container">
-    <div style="padding: 0 16px">
+    <div class="div-left">
+      <el-steps direction="vertical" :active="stepActive">
+        <el-step v-for="(item, index) in stepArr" :key="index">
+          <div slot="title" @click="stepActive = index" style="cursor: pointer">
+            <a :href="`#${index}`">{{ item }}</a>
+          </div>
+        </el-step>
+      </el-steps>
+    </div>
+    <div class="div-right" style="padding: 0 16px">
+      <a name="0"></a>
       <div class="div-title1">基本信息</div>
       <div class="div-border div-bot20">
         <el-descriptions class="margin-top" :column="3">
@@ -36,6 +46,7 @@
 
       <!-- 档案详情-->
       <el-form ref="detailsForm" :model="detailsForm" class="formStep">
+        <a name="1"></a>
         <div class="div-title1">主要诊断</div>
         <el-form-item
           class="form-item-zd div-border div-pad20"
@@ -48,8 +59,9 @@
           <el-input v-model="detailsForm['JBXX_ZYZD_QT']" placeholder="其他" />
         </el-form-item>
         <div>
+          <a name="2"></a>
           <div class="div-title1">评估信息</div>
-          <div class="div-title2">人体成分（基本参数）</div>
+          <div class="div-title2" id="#2">人体成分（基本参数）</div>
         </div>
         <div class="human-body div-border div-bot20">
           <el-form-item label="体重" prop="PG_RTCF_TZ">
@@ -158,6 +170,7 @@
             />
           </el-form-item>
         </div>
+        <a name="3"></a>
         <div class="div-title1">中医体质辨识</div>
         <div class="div-title2">主要体质</div>
         <div class="div-border div-bot20">
@@ -184,6 +197,7 @@
           </el-form-item>
         </div>
         <!-- 体态评估 -->
+        <a name="4"></a>
         <div class="div-border div-bot20">
           <div class="div-title2">体态评估</div>
           <div class="human-body">
@@ -267,7 +281,7 @@
             </el-form-item>
           </div>
         </div>
-
+        <a name="5"></a>
         <div class="div-title1">治疗类型</div>
         <el-form-item prop="ZLFA_ZLLX" class="div-border div-pad10">
           <el-radio-group v-model="detailsForm['ZLFA_ZLLX']">
@@ -275,7 +289,7 @@
             <el-radio label="单纯中医治疗"> </el-radio>
           </el-radio-group>
         </el-form-item>
-
+        <a name="6"></a>
         <div style="font-size: 22px; margin-bottom: 14px" class="div-title1">
           诊疗方法
         </div>
@@ -338,6 +352,7 @@
         </div>
         <!--  -->
         <div class="human-body"></div>
+        <a name="7"></a>
         <div class="div-title1">治疗类型</div>
         <div class="div-border div-bot20">
           <el-form-item prop="ZLFA_ZLXG" class="div-border div-pad10">
@@ -348,6 +363,7 @@
               <el-radio label="无效"> </el-radio>
             </el-radio-group>
           </el-form-item>
+          <a name="8"></a>
           <div class="div-title2">诊疗费用</div>
           <el-form-item label="总体费用按照区间进行选择" prop="ZLFA_ZTFY">
             <el-radio-group v-model="detailsForm['ZLFA_ZTFY']">
@@ -400,22 +416,23 @@
 </template>
 
 <script>
-import {
+import { queryRecord, saveAidRecord } from "@/api/medicalFile";
-  treatmentQuery,
-  treatmentAdd,
-  treatmentUpd,
-  treatmentDel,
-  queryRecord,
-  saveAidRecord,
-  queueAdd,
-} from "@/api/medicalFile";
-import { getToken } from "@/utils/auth";
-import { followupQuery } from "@/api/followupFile";
 export default {
   name: "Notice",
-  dicts: ["sys_normal_disable", "sys_user_sex"],
   data() {
     return {
+      stepActive: 0,
+      stepArr: [
+        "基本信息",
+        "主要诊断",
+        "人体成分（基本参数）",
+        "中医体质辨识",
+        "评估",
+        "治疗类型",
+        "诊疗方法",
+        "治疗类型",
+        "诊疗费用",
+      ],
       // 现病史
       medicalHistory: [
         "肥胖症",
@@ -978,6 +995,20 @@ export default {
 <style scoped src="@/assets/styles/common.css"></style>
 
 <style scoped>
+.app-container {
+  display: flex;
+}
+.app-container .div-left {
+  width: 210px;
+  margin-right: 20px;
+  flex-shrink: 0;
+  border-right: 1px solid #d8d8d8;
+}
+.app-container .div-right {
+  flex: 1;
+  height: calc(100vh - 100px);
+  overflow: scroll;
+}
 .div-border {
   border-bottom: 1px solid #d8d8d8;
 }