From 9ed397ab8b75de465fbcb11531f16f629ddf0c2b Mon Sep 17 00:00:00 2001
From: chenyc <501753378@qq.com>
Date: 星期一, 07 七月 2025 17:36:20 +0800
Subject: [PATCH] 1741 营养评估SGA表单修改

---
 src/views/home/index.vue |   37 ++++++++++++++++++++++++++++---------
 1 files changed, 28 insertions(+), 9 deletions(-)

diff --git a/src/views/home/index.vue b/src/views/home/index.vue
index e877662..6995068 100644
--- a/src/views/home/index.vue
+++ b/src/views/home/index.vue
@@ -1,7 +1,7 @@
 <template>
     <div class="home-container layout-pd ">
         <div class="container">
-            <div class="container-left">
+            <div class="container-left" v-if="isLeftVisible">
                 <div class="patTabel">
                     <el-table :data="state.filterTableData" stripe :height="state.tableHeight.left" size="default"
                         highlight-current-row @current-change="handleCurrentChange" style="width: 300px">
@@ -11,7 +11,7 @@
                                     <el-avatar shape="square"
                                         style="width: 16px; height: 16px;background-color: #ffffff;margin-right: 10px;margin-left: 10px;"
                                         fit="contain" :src="huanzheliebiao" />
-                                    <div class="titleHome">患者列表</div>
+                                    <div class="titleHome">患者列表 <span style="color: blue;" v-if="state.filterTableData.length"> &numsp; 共({{state.filterTableData.length}})人</span></div>
                                 </div>
                                 <el-input size="default" @change="getPatients" v-model="state.search" placeholder="支持模糊查询"
                                     :prefix-icon="Search" />
@@ -35,7 +35,7 @@
                     </el-table>
                 </div>
             </div>
-            <div class="right" style="width: 100%;">
+            <div class="right" :class="{'full-width': !isLeftVisible}" style="width: 100%;">
                 <div style="width: 100%;">
                     <el-tabs v-model="state.activeName" class="demo-tabs" @tab-click="handleClick">
                         <el-tab-pane label="患者档案" name="患者档案">
@@ -153,9 +153,11 @@
                 </div>
             </div>
         </div>
-        <div class="fixed-div" v-show="patientsInfo.patientName">
+        <div class="fixed-div" v-show="patientsInfo.patientName" @click="toggleVisibility">
             <el-avatar :size="80" :src="patientsInfo.patientAvatarIcon" />
             <div>{{ patientsInfo.patientName }}</div>
+            <el-icon size="20" v-if="isLeftVisible"><Fold /></el-icon>
+            <el-icon size="20" v-else><Expand /></el-icon>
         </div>
     </div>
 </template>
@@ -207,7 +209,9 @@
 const fangAnRef=ref()
 const suifangjiluRef=ref()
 const jilubiaoRef=ref()
+const isLeftVisible=ref(true)
 const state = reactive({
+    
     global: {
         homeChartOne: null,
         homeChartTwo: null,
@@ -227,6 +231,10 @@
     setTableHeight()
     getPatients()
 })
+// 定义一个方法来切换左边div的显示状态
+const toggleVisibility = () => {
+  isLeftVisible.value = !isLeftVisible.value;
+};
 const handleCurrentChange = (val: any | undefined) => {
     if (val) {
         console.log(val)
@@ -347,11 +355,14 @@
 
 .container-left {
     width: 300px; /* 右边div的固定宽度 */
-.right {
-    background-color: #409EFF;
-    flex-grow: 1; /* 让这个div扩展以填充可用空间 */
-    margin-left: 20px; /* 如果需要的话,可以给右边的div留出一些间距 */
+    transition: all 0.3s ease; /* 添加过渡效果,使宽度变化更加平滑 */
 }
+.right {
+    flex-grow: 1; /* 让这个div扩展以填充可用空间 */
+    transition: all 0.3s ease; /* 添加过渡效果,使宽度变化更加平滑 */
+}
+.full-width {
+    width: 100%; /* 当左边div隐藏时,右边div占据全部宽度 */
 }
 .home-container {
     overflow: hidden;
@@ -406,7 +417,7 @@
     align-items: center;
     bottom: 10px;
     right: 30px;
-    width: 200px;
+    width: 220px;
     height: 100px;
     color: rgb(16, 3, 3);
     padding: 10px;
@@ -418,5 +429,13 @@
         font-size: 20px;
     }
 }
+.el-tabs__nav-scroll {
+  overflow-x: auto;
+  -webkit-overflow-scrolling: touch; /* 确保在 iOS 上平滑滚动 */
+}
 
+.el-tabs__item {
+  cursor: pointer;
+  user-select: none;
+}
 </style>

--
Gitblit v1.8.0