vue2-client 1.16.63 → 1.16.65

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vue2-client",
-  "version": "1.16.63",
+  "version": "1.16.65",
   "private": false,
   "scripts": {
     "serve": "SET NODE_OPTIONS=--openssl-legacy-provider && vue-cli-service serve --no-eslint",
@@ -109,4 +109,4 @@
     "not dead",
     "not ie 11"
   ]
-}
+}

package/src/base-client/components/common/XCollapse/XCollapse.vue

@@ -330,14 +330,14 @@ export default {
             })
             this.$forceUpdate()
           }
-          // 默认展开当前页的所有面板
-          this.activeKey = (this.config.showData || []).map((_, i) => i.toString())
-          // 初始化关闭所有折叠面板
+          // 根据配置决定是否展开面板
           const shouldCollapseAll = this.config.collapseAllByDefault || false
           if (shouldCollapseAll) {
-            setTimeout(() => {
-              this.activeKey = [] // 关闭所有面板
-            }, 0.00001)
+            // 如果配置为默认关闭，直接设置为空数组，避免展开动画
+            this.activeKey = []
+          } else {
+            // 默认展开当前页的所有面板
+            this.activeKey = (this.config.showData || []).map((_, i) => i.toString())
           }
         })
       })
@@ -429,11 +429,10 @@ export default {
 :deep(.ant-collapse-header) {
   display: flex;
   position: relative;
-  border-bottom: v-bind('config.showLine ? "1px solid #000000" : "none"');
+  // border-bottom: v-bind('config.showLine ? "1px solid #000000" : "none"');
   align-items: center !important;
   background-color: #ffffff;
   padding: 12px 16px !important; /* 确保头部有足够的内边距 */
-  min-height: 50px; /* 设置头部最小高度 */
 }
 
 :deep(.ant-collapse-header-text) {
@@ -466,7 +465,9 @@ export default {
   height: 12px;
   border-radius: 6px;
   background: #3362DA;
-  margin: 6px;
+  margin-top: 15px;
+  margin-left: 11px;
+  margin-bottom: 12px;
   flex-shrink: 0;
 }
 
@@ -620,9 +621,14 @@ export default {
 
 /* 当前页码样式 */
 :deep(.ant-pagination .ant-pagination-item-active) {
-  background: #FFFFFF;
+  background: #0057FE !important;
   border: 1px solid #1890ff;
-  color: #1890ff;
+  color: #FFFFFF !important;
+}
+
+/* 确保选中页码文字颜色生效 */
+:deep(.ant-pagination .ant-pagination-item-active a) {
+  color: #FFFFFF !important;
 }
 
 /* 禁用状态样式 */
@@ -642,14 +648,15 @@ export default {
   &.xcollapse-style1 {
     height: auto; /* 允许根据内容自适应高度，避免滚动被限制 */
     min-height: 600px;
-    .blue-circle-icon { margin: 0 !important; }
     .header-text {
       font-family: "Source Han Sans";
       font-size: 16px;
       font-weight: 700;
-      line-height: normal;
+      line-height: 23px;
       letter-spacing: 0em;
       color: #313131;
+      margin-top: 8px;
+      margin-bottom: 8px;
       margin-right: 0 !important;
     }
 
@@ -657,9 +664,11 @@ export default {
       font-family: "Source Han Sans";
       font-size: 16px;
       font-weight: 700;
-      line-height: normal;
+      line-height: 23px;
       text-align: right;
       color: #313131;
+      margin-top: 9px;
+      margin-bottom: 7px;
       margin-left: 28.14px;
       letter-spacing: 0em
     }
@@ -668,8 +677,10 @@ export default {
       font-family: "Source Han Sans";
       font-size: 16px;
       font-weight: 400;
-      line-height: normal;
+      line-height: 23px;
       text-align: right;
+      margin-top: 9px;
+      margin-bottom: 7px;
       color: #313131;
       letter-spacing: 0em;
     }
@@ -684,7 +695,7 @@ export default {
       width: 564px;
       min-height: auto;
       height: auto;
-      margin: 3px 10px 26px 12px;  // 面板之间留白
+      margin-bottom:10px;
       background: #FFFFFF;         // 独立白底
       box-sizing: border-box;
       border: 1px solid #E5E9F0;   // 每个面板自身边框
@@ -693,15 +704,18 @@ export default {
     :deep(.ant-collapse > .ant-collapse-item:first-child) { margin-top: 0; }
     :deep(.ant-collapse > .ant-collapse-item:last-child) { margin-bottom: 0; }
 
-    :deep(.ant-collapse-content > .ant-collapse-content-box) { background: #FFFFFF; }
+    :deep(.ant-collapse-content > .ant-collapse-content-box) {
+      background: #FFFFFF;
+      padding: 0px !important; /* 自定义边距：上9px 右12px 下10px 左11px */
+    }
 
     // 表头：恢复合适的上下内边距，去掉顶部额外空白
     :deep(.ant-collapse-header) {
       background: #FFFFFF;
-      padding: 0px 0px;
-      align-items: center;
-      height: 39px;
+      padding: 0px 0px !important;
+      height: 41px !important;
       border-bottom: none !important; // 移除标题处下边线，避免与外边框连为一体
+      border: 1px solid #E5E9F0;   // 每个面板自身边框
     }
   }
 }

package/src/base-client/components/common/XForm/XFormItem.vue

@@ -93,7 +93,7 @@
       <a-select
         v-if="!attr.lazyLoad || attr.lazyLoad === 'false'"
         v-model="form[attr.model]"
-        :disabled="disabled"
+        :disabled="disabled || readOnly"
         @change="handleSelectChange"
         :filter-option="filterOption"
         :getPopupContainer="getPopupContainer"
@@ -166,7 +166,7 @@
       <a-select
         v-else
         v-model="form[attr.model]"
-        :disabled="disabled"
+        :disabled="disabled || readOnly"
         @change="handleSelectChange"
         :filter-option="filterOption"
         :getPopupContainer="getPopupContainer"
@@ -193,6 +193,7 @@
       </a-select>
     </a-form-model-item>
     <a-form-model-item
+      :disabled="disabled || readOnly"
       v-bind="bindOther"
       :rules="rules"
       v-else-if="attr.showMode === 'radioGroup'"

package/src/base-client/components/his/XHDescriptions/XHDescriptions.vue

@@ -13,7 +13,7 @@
       </div>
 
       <!-- 当有 layout 配置时使用 a-descriptions -->
-      <template v-if="config && config.layout">
+      <template v-if="config && config.layout && !wrapperClassObject['xhdesc-medical-history']">
         <a-descriptions
           :column="config.layout"
           :size="(config && config.style && config.style.size)"
@@ -37,7 +37,24 @@
                   <span class="label-text">{{ item.label }}</span>
                 </div>
               </template>
-              <div class="content-wrapper">
+              <a-tooltip
+                v-if="isContentOverflow(data[item.field])"
+                :title="data[item.field]"
+                placement="topLeft"
+                :overlay-style="{ maxWidth: '400px' }"
+              >
+                <div
+                  class="content-wrapper ellipsis"
+                  :data-full-text="data[item.field]"
+                >
+                  {{ data[item.field] }}
+                </div>
+              </a-tooltip>
+              <div
+                v-else
+                class="content-wrapper"
+                :data-full-text="data[item.field]"
+              >
                 {{ data[item.field] }}
               </div>
             </a-descriptions-item>
@@ -59,7 +76,11 @@
                     <span class="label-text">{{ item.label }}</span>
                   </div>
                 </template>
-                <div class="content-wrapper">
+                <div
+                  class="content-wrapper"
+                  :class="{ 'ellipsis': isContentOverflow(data[item.field]) }"
+                  :data-full-text="data[item.field]"
+                >
                   {{ data[item.field] }}
                 </div>
               </a-descriptions-item>
@@ -68,6 +89,67 @@
         </a-descriptions>
       </template>
 
+      <!-- 医疗病史模式：使用自定义HTML结构实现文本环绕 -->
+      <template v-else-if="config && config.layout && wrapperClassObject['xhdesc-medical-history']">
+        <div class="medical-history-descriptions">
+          <template v-if="data">
+            <!-- 显示前N个标签 -->
+            <div
+              v-for="(item) in visibleItemsFiltered"
+              :key="item.field"
+              :class="['medical-history-item', { 'with-divider': item.isLine }]"
+            >
+              <div class="medical-history-content">
+                <a-tooltip
+                  v-if="isContentOverflow(data[item.field])"
+                  :title="data[item.field]"
+                  placement="topLeft"
+                  :overlay-style="{ maxWidth: '400px' }"
+                >
+                  <div class="medical-history-text ellipsis">
+                    <span class="medical-history-label">{{ item.label }}：</span>{{ data[item.field] }}
+                  </div>
+                </a-tooltip>
+                <div
+                  v-else
+                  class="medical-history-text"
+                >
+                  <span class="medical-history-label">{{ item.label }}：</span>{{ data[item.field] }}
+                </div>
+              </div>
+            </div>
+
+            <!-- 展开后显示剩余标签 -->
+            <template v-if="showAllItems">
+              <div
+                v-for="item in hiddenItemsFiltered"
+                :key="item.field"
+                class="medical-history-item"
+              >
+                <div class="medical-history-content">
+                  <a-tooltip
+                    v-if="isContentOverflow(data[item.field])"
+                    :title="data[item.field]"
+                    placement="topLeft"
+                    :overlay-style="{ maxWidth: '400px' }"
+                  >
+                    <div class="medical-history-text ellipsis">
+                      <span class="medical-history-label">{{ item.label }}：</span>{{ data[item.field] }}
+                    </div>
+                  </a-tooltip>
+                  <div
+                    v-else
+                    class="medical-history-text"
+                  >
+                    <span class="medical-history-label">{{ item.label }}：</span>{{ data[item.field] }}
+                  </div>
+                </div>
+              </div>
+            </template>
+          </template>
+        </div>
+      </template>
+
       <!-- 当没有 layout 配置时使用自适应布局 -->
       <template v-else>
         <div class="flex-descriptions">
@@ -87,7 +169,24 @@
                 />
                 <span class="label-text">{{ item.label }}：</span>
               </div>
-              <div class="content-wrapper">
+              <a-tooltip
+                v-if="isContentOverflow(data[item.field])"
+                :title="data[item.field]"
+                placement="topLeft"
+                :overlay-style="{ maxWidth: '400px' }"
+              >
+                <div
+                  class="content-wrapper ellipsis"
+                  :data-full-text="data[item.field]"
+                >
+                  {{ data[item.field] }}
+                </div>
+              </a-tooltip>
+              <div
+                v-else
+                class="content-wrapper"
+                :data-full-text="data[item.field]"
+              >
                 {{ data[item.field] }}
               </div>
             </div>
@@ -108,7 +207,11 @@
                   />
                   <span class="label-text">{{ item.label }}：</span>
                 </div>
-                <div class="content-wrapper">
+                <div
+                  class="content-wrapper"
+                  :class="{ 'ellipsis': isContentOverflow(data[item.field]) }"
+                  :data-full-text="data[item.field]"
+                >
                   {{ data[item.field] }}
                 </div>
               </div>
@@ -120,25 +223,79 @@
       <!-- 可选：底部区域（分割线 + 三列内容） -->
       <div v-if="config && config.footer && Array.isArray(config.footer.items) && data" class="xhdesc-footer">
         <div class="xhdesc-divider" />
-        <div class="footer-grid">
+        <!-- 医疗病史模式下的footer结构 -->
+        <div v-if="wrapperClassObject['xhdesc-medical-history']" class="medical-history-footer">
+          <div
+            v-for="(item, idx) in config.footer.items"
+            :key="item.field || idx"
+            class="medical-history-item">
+            <div class="medical-history-content">
+              <a-tooltip
+                v-if="isContentOverflow(data[item.field])"
+                :title="data[item.field]"
+                placement="topLeft"
+                :overlay-style="{ maxWidth: '400px' }"
+              >
+                <div class="medical-history-text ellipsis">
+                  <span class="medical-history-label">{{ item.label }}：</span>{{ data[item.field] }}
+                </div>
+              </a-tooltip>
+              <div
+                v-else
+                class="medical-history-text"
+              >
+                <span class="medical-history-label">{{ item.label }}：</span>{{ data[item.field] }}
+              </div>
+            </div>
+          </div>
+          <!-- 右侧信息：换到下一行并靠右对齐（如 医生 / 医嘱日期） -->
+          <div
+            v-if="Array.isArray(config.footer.rightItems) && config.footer.rightItems.length"
+            class="footer-right">
+            <div
+              v-for="(item, ridx) in config.footer.rightItems"
+              :key="item.field || ridx"
+              class="footer-right-item">
+              <div class="label-wrapper"><span class="label-text">{{ item.label }}：</span></div>
+              <div
+                class="content-wrapper"
+                :class="{ 'ellipsis': isContentOverflow(data[item.field]) }"
+                :data-full-text="data[item.field]"
+              >{{ data[item.field] }}
+              </div>
+            </div>
+          </div>
+        </div>
+        <!-- 非医疗病史模式下的footer结构 -->
+        <div v-else class="footer-grid">
           <div
             v-for="(item, idx) in config.footer.items"
             :key="item.field || idx"
             class="description-item">
             <div class="label-wrapper"><span class="label-text">{{ item.label }}：</span></div>
-            <div class="content-wrapper">{{ data[item.field] }}</div>
+            <div
+              class="content-wrapper"
+              :class="{ 'ellipsis': isContentOverflow(data[item.field]) }"
+              :data-full-text="data[item.field]"
+            >{{ data[item.field] }}
+            </div>
           </div>
         </div>
         <!-- 右侧信息：换到下一行并靠右对齐（如 医生 / 医嘱日期） -->
         <div
-          v-if="Array.isArray(config.footer.rightItems) && config.footer.rightItems.length"
+          v-if="!wrapperClassObject['xhdesc-medical-history'] && Array.isArray(config.footer.rightItems) && config.footer.rightItems.length"
           class="footer-right">
           <div
             v-for="(item, ridx) in config.footer.rightItems"
             :key="item.field || ridx"
             class="footer-right-item">
             <div class="label-wrapper"><span class="label-text">{{ item.label }}：</span></div>
-            <div class="content-wrapper">{{ data[item.field] }}</div>
+            <div
+              class="content-wrapper"
+              :class="{ 'ellipsis': isContentOverflow(data[item.field]) }"
+              :data-full-text="data[item.field]"
+            >{{ data[item.field] }}
+            </div>
           </div>
         </div>
       </div>
@@ -265,6 +422,11 @@ export default {
     },
     toggleDetails () {
       this.showAllItems = !this.showAllItems
+    },
+    // 判断内容是否超过三行
+    isContentOverflow (content) {
+      if (!content || typeof content !== 'string') return false
+      return content.length > 150
     }
   },
   watch: {
@@ -333,10 +495,6 @@ export default {
   white-space: nowrap;
 }
 
-.label-wrapper.with-avatar {
-  gap: 8px;
-}
-
 .label-text {
   white-space: nowrap;
   color: #313131; // 统一深灰
@@ -357,8 +515,7 @@ export default {
 }
 
 /* 强制移除任何链接样式（如接口返回含 <a>） */
-::v-deep a,
-::deep a {
+::v-deep a {
   color: #313131 !important;
   text-decoration: none !important;
 }
@@ -379,10 +536,17 @@ export default {
 }
 
 .xhdesc-divider {
-  width: 100%;
+  width: calc(100% + 24px); /* 扩展到左右内边距之外 */
   height: 0;
-  border-bottom: 1px dashed rgba(0, 0, 0, 0.15);
-  margin: 8px 0 12px;
+  border-bottom: 1px solid #E5E9F0;
+  margin: 10px -12px 14px; /* 抵消左右 12px 内边距 */
+  overflow: hidden;
+}
+/* medical-history 模式：左 padding 11px，右 12px（由外层设置），做精确抵消 */
+.patient-info-descriptions.xhdesc-medical-history .xhdesc-divider {
+  width: calc(100% + 23px);
+  margin-left: -11px;
+  margin-right: -12px;
 }
 
 .footer-grid {
@@ -408,13 +572,13 @@ export default {
 }
 
 /* Ant Design 描述列表样式覆盖 */
-:deep(.ant-descriptions-row) {
+::v-deep(.ant-descriptions-row) {
   display: flex;
   flex-direction: row;
   align-items: flex-start;
 }
 
-:deep(.ant-descriptions-item) {
+::v-deep(.ant-descriptions-item) {
   padding: 0 !important;
   display: flex !important;
   align-items: flex-start !important;
@@ -424,7 +588,7 @@ export default {
   margin-bottom: 16px;
 }
 
-:deep(.ant-descriptions-item-container) {
+::v-deep(.ant-descriptions-item-container) {
   display: flex !important;
   flex-direction: row !important;
   align-items: flex-start !important;
@@ -433,7 +597,7 @@ export default {
   width: 100% !important;
 }
 
-:deep(.ant-descriptions-item-label) {
+::v-deep(.ant-descriptions-item-label) {
   color: rgba(0, 0, 0, 0.65);
   padding: 0 !important;
   margin: 0 !important;
@@ -446,7 +610,7 @@ export default {
   padding-right: 2px !important;
 }
 
-:deep(.ant-descriptions-item-content) {
+::v-deep(.ant-descriptions-item-content) {
   font-size: v-bind('(config && config.style && config.style.fontSize) || "14px"');
   display: inline-flex !important;
   align-items: center !important;
@@ -455,7 +619,7 @@ export default {
   margin-left: 0px !important;
 }
 
-:deep(.ant-descriptions-item-colon) {
+::v-deep(.ant-descriptions-item-colon) {
   position: static !important;
   display: inline-flex !important;
   align-items: center !important;
@@ -464,18 +628,18 @@ export default {
   margin-right: 2px !important;
 }
 
-:deep(.ant-descriptions-item-container:hover) {
+::v-deep(.ant-descriptions-item-container:hover) {
   background-color: rgba(0, 0, 0, 0.02);
   border-radius: 4px;
 }
 
-:deep(.ant-btn-link) {
+::v-deep(.ant-btn-link) {
   padding: 0;
   height: auto;
   line-height: 1;
 }
 
-:deep(.ant-btn-link:hover) {
+::v-deep(.ant-btn-link:hover) {
   color: #1890ff;
   background: transparent;
 }
@@ -513,12 +677,12 @@ export default {
 }
 
 /* 对于 Ant Design 描述列表的特殊处理 */
-:deep(.ant-descriptions-item.with-divider) {
+::v-deep(.ant-descriptions-item.with-divider) {
   position: relative;
   margin-bottom: 16px !important;
 }
 
-:deep(.ant-descriptions-item.with-divider::after) {
+::v-deep(.ant-descriptions-item.with-divider::after) {
   content: '';
   position: absolute;
   left: 0;
@@ -540,12 +704,12 @@ export default {
     padding: 6.5px 12px;
 
     /* *ant-btn-link */
-    :deep(.ant-btn-link) {
+    ::v-deep .ant-btn-link {
       border: none;
     }
 
     /* *ant-descriptions-item-content */
-    :deep(.ant-descriptions-item-content) {
+    ::v-deep .ant-descriptions-item-content {
       font-weight: bold;
     }
   }
@@ -554,179 +718,202 @@ export default {
 .xhdesc-margin-top-12 {
   margin-top: -12px;
 }
-.xhdesc-no-padding {
-  padding: 0px;
-}
 .xhdesc-no-padding {
   padding: 0px;
   &.patient-info-descriptions,
   .patient-info-descriptions {
     /* *ant-descriptions-item-content */
-    :deep(.descriptions-container) {
+    ::v-deep .descriptions-container {
       padding: 0px;
     }
-    :deep(.content-wrapper) {
+    ::v-deep .content-wrapper {
       margin: 0px;
     }
   }
 }
+/* 医疗病史模式：自定义HTML结构样式 */
+.medical-history-descriptions {
+  width: 100%;
+}
+
+.medical-history-item {
+  margin: 0;
+  width: 100%;
+}
+
+.medical-history-item.with-divider {
+  position: relative;
+  padding-bottom: 4px; /* 分割线与上方间距 4px */
+  margin-bottom: 4px;  /* 分割线与下方间距 4px */
+}
+
+.medical-history-item.with-divider::after {
+  content: '';
+  position: absolute;
+  left: 0;
+  bottom: 0; /* 贴合容器底部 */
+  width: 100%;
+  height: 0;
+  border-bottom: 1px solid rgba(0, 0, 0, 0.15);
+}
+
+.medical-history-content {
+  font-family: "Source Han Sans";
+  font-size: 18px;
+  line-height: 24px;
+  letter-spacing: 0em;
+  text-align: left;
+  word-break: break-word;
+  white-space: normal;
+  text-indent: 0;
+  padding-left: 0;
+  margin-left: 0;
+  /* 使用float实现真正的文本环绕 */
+  overflow: hidden;
+  /* 确保容器能够正确清除浮动 */
+  position: relative;
+}
+
+.medical-history-label {
+  font-family: "Source Han Sans";
+  font-size: 16px;
+  font-weight: 700;
+  color: #313131;
+  white-space: nowrap;
+  float: left;
+  margin-right: 0px;
+  /* 确保标签不会影响文本流 */
+  position: relative;
+  z-index: 1;
+}
+
+.medical-history-text {
+  font-family: "Source Han Sans";
+  font-size: 16px;
+  font-weight: 400;
+  color: #313131;
+  display: block;
+  overflow: hidden;
+  text-indent: 0;
+  padding-left: 0;
+  margin-left: 0;
+  word-break: break-word;
+  white-space: normal;
+  text-align: left;
+  line-height: 24px;
+  /* 确保文本能够正确环绕浮动元素 */
+  margin-top: 0;
+  margin-bottom: 0;
+}
+
+.medical-history-text.ellipsis {
+  display: -webkit-box;
+  -webkit-box-orient: vertical;
+  -webkit-line-clamp: 3;
+  line-clamp: 3;
+  overflow: hidden;
+  cursor: pointer;
+  position: relative;
+  word-break: break-word;
+  white-space: normal;
+  line-height: 24px;
+  text-indent: 0;
+  padding-left: 0;
+  margin-left: 0;
+  text-align: left;
+  -webkit-box-pack: start;
+  -webkit-box-align: start;
+}
+
+/* 使用-webkit-line-clamp时不需要手动添加省略号 */
+.medical-history-text.ellipsis::after {
+  display: none;
+}
+
+/* 针对多行文本的特殊处理：确保换行文本与首行对齐 */
+.medical-history-text.ellipsis::first-line {
+  text-indent: 0;
+}
+
+/* 为不支持-webkit-line-clamp的浏览器提供后备方案 */
+@supports not (-webkit-line-clamp: 3) {
+  .medical-history-text.ellipsis {
+    display: block;
+    max-height: 72px; /* 3行 * 24px行高 */
+    overflow: hidden;
+    position: relative;
+  }
+
+  .medical-history-text.ellipsis::after {
+    content: '...';
+    position: absolute;
+    right: 0;
+    bottom: 0;
+    background: #fff;
+    padding-left: 4px;
+    display: block;
+  }
+}
+
 /* 医疗病史样式开关：通过 wrapperClassObject 添加类 xhdesc-medical-history */
 .patient-info-descriptions.xhdesc-medical-history {
+  padding: 9px 12px 10px 11px !important;
   /* 移除右侧空白（本模式不需要详情按钮预留空间） */
   .descriptions-container {
     padding-right: 0;
-    padding-left: 12px;
+    padding-left: 0px;
   }
-
-  /* 保持原有的自适应布局样式 */
-  .flex-descriptions {
-    gap: 4px 16px;
-  }
-
-  .description-item {
-    padding: 2px 4px;
+  /* 医疗病史模式下：footer 区域使用与上方相同的医疗病史样式 */
+  .medical-history-footer {
     width: 100%;
-    align-items: flex-start;
+  }
+  .medical-history-footer .footer-right {
+    margin-top: 8px;
     display: flex;
-    flex-direction: column;
+    justify-content: flex-end;
+    align-items: flex-start;
+    gap: 16px;
+    width: 100%;
   }
-
-  /* 只修改布局，保持原有字体样式 */
-  .label-wrapper {
+  /* 右侧（医生/医嘱日期）标签与值的字体要求 */
+  .medical-history-footer .footer-right .label-wrapper .label-text {
     font-family: "Source Han Sans";
-    font-size: 18px;
-    font-weight: 600;
-    line-height: 24px;
-    text-align: justify;
-    letter-spacing: 0em;
-    white-space: nowrap;
-    margin-right: 8px;
-    margin-bottom: 0;
-    display: inline;
+    font-size: 16px;
+    font-weight: 700;
+    color: #313131;
+    line-height: 22px;
   }
-
-  .content-wrapper {
+  .medical-history-footer .footer-right .content-wrapper {
     font-family: "Source Han Sans";
-    font-size: 18px;
+    font-size: 16px;
     font-weight: 400;
-    line-height: 24px;
-    letter-spacing: 0em;
-    margin-left: 0;
-    max-width: none;
-    overflow: visible;
-    text-overflow: initial;
-    white-space: normal;
-    word-break: break-word;
-    display: inline;
-  }
-
-  /* 修复Ant Design描述列表的布局，保持字体样式 */
-  :deep(.ant-descriptions-item) {
-    display: block !important;
-    white-space: nowrap;
-    width: 100% !important;
-    margin-bottom: 8px;
-    margin-right: 0;
-  }
-
-  :deep(.ant-descriptions-item-container) {
-    display: inline !important;
-    white-space: nowrap;
-    width: auto !important;
-    align-items: start !important;
-  }
-
-  :deep(.ant-descriptions-item-label) {
-    display: inline !important;
-    white-space: nowrap !important;
-    min-width: auto !important;
-    padding-right: 1px !important;
-    /* 保持原有字体样式 */
-    font-family: "Source Han Sans" !important;
-    font-size: 18px !important;
-    font-weight: 600 !important;
-    line-height: 24px !important;
-    text-align: justify !important;
-    letter-spacing: 0em !important;
-  }
-
-  :deep(.ant-descriptions-item-content) {
-    display: inline !important;
-    white-space: normal !important;
-    word-break: break-word !important;
-    margin-left: 0 !important;
-    overflow: visible !important;
-    /* 保持原有字体样式 */
-    font-family: "Source Han Sans" !important;
-    font-size: 18px !important;
-    font-weight: 400 !important;
-    line-height: 24px !important;
-    letter-spacing: 0em !important;
-  }
-
-  :deep(.ant-descriptions-item-colon) {
-    margin-right: 2px !important;
-    display: inline !important;
-  }
-
-  /* 确保内部元素正确对齐 */
-  :deep(.ant-descriptions-item-label .label-wrapper) {
-    display: inline !important;
-    white-space: nowrap !important;
-    width: auto !important;
-    gap: 0 !important;
-    margin: 0 !important;
-    padding: 0 !important;
-    line-height: 24px !important;
+    line-height: 22px;
+    color: #313131;
   }
 
-  :deep(.ant-descriptions-row) {
-    display: block !important;
-    white-space: nowrap;
-    width: 100%;
+  .medical-history-footer .footer-right .medical-history-item {
+    display: inline-block;
+    text-align: right;
   }
 
-  /* 移除所有可能冲突的布局属性 */
-  :deep(.ant-descriptions-item),
-  :deep(.ant-descriptions-item-container) {
-    float: none !important;
-    flex: none !important;
-    flex-direction: row !important;
-    align-items: flex-start !important;
+  .medical-history-footer .footer-right .medical-history-content {
+    text-align: right;
   }
 
-  /* 确保表格布局正确 */
-  :deep(.ant-descriptions-view) {
-    white-space: nowrap;
-    table-layout: auto !important;
+  .medical-history-footer .footer-right .medical-history-label {
+    float: none;
+    display: inline;
+    margin-right: 0px;
   }
 
-  :deep(.ant-descriptions-table) {
-    table-layout: auto !important;
+  .medical-history-footer .footer-right .medical-history-text {
+    display: inline;
+    text-align: right;
   }
 
-  /* 医疗病史模式下：footer 区域恢复与上方描述项一致的横向样式 */
-  .xhdesc-footer {
-    .description-item {
-      display: inline-flex;
-      flex-direction: row;
-      align-items: center;
-      width: 100%;
-    }
-    .label-wrapper {
-      display: inline-flex;
-      margin-right: 4px;
-      margin-bottom: 0;
-      font-weight: 600; // 与上方保持一致
-    }
-    .content-wrapper {
-      display: inline-flex;
-      margin-left: 0;
-      max-width: 300px;
-      overflow: hidden;
-      text-overflow: ellipsis;
-      white-space: nowrap;
-    }
+  .medical-history-footer .footer-right .medical-history-text.ellipsis {
+    display: inline;
+    text-align: right;
   }
 }
 </style>

package/src/base-client/components/his/XSidebar/XSidebar.vue

@@ -104,6 +104,43 @@ export default {
     }
   },
   methods: {
+    // 通用的样式保护方法
+    protectElementStyles (element, stylesToProtect = ['padding', 'padding-left', 'padding-right', 'padding-top', 'padding-bottom', 'margin', 'background-color', 'color', 'font-size', 'border']) {
+      const protectedStyles = {}
+
+      // 保存需要保护的样式
+      stylesToProtect.forEach(style => {
+        const value = element.style.getPropertyValue(style)
+        if (value) {
+          protectedStyles[style] = value
+        }
+      })
+
+      return protectedStyles
+    },
+
+    // 恢复保护的样式
+    restoreElementStyles (element, protectedStyles) {
+      Object.entries(protectedStyles).forEach(([property, value]) => {
+        if (value) {
+          element.style.setProperty(property, value, 'important')
+        }
+      })
+    },
+
+    // 安全地设置布局样式，保护其他样式
+    safeSetLayoutStyles (element, layoutStyles) {
+      // 保护所有可能的样式配置
+      const protectedStyles = this.protectElementStyles(element)
+
+      // 设置布局样式
+      Object.entries(layoutStyles).forEach(([property, value]) => {
+        element.style.setProperty(property, value)
+      })
+
+      // 恢复保护的样式
+      this.restoreElementStyles(element, protectedStyles)
+    },
     toggleDrawer () {
       this.isOpen = !this.isOpen
       this.$emit('on-drawer-change', this.isOpen)
@@ -144,7 +181,7 @@ export default {
       })
     },
     // 获取同级的其他所有a-col元素
-    getSiblingCols () {
+    getSiblingCols (className) {
       try {
         // 找到当前组件所在的a-col
         let currentCol = this.$el.parentNode
@@ -162,10 +199,8 @@ export default {
           return []
         }
 
-        // 修改这里：只获取直接子元素中的.ant-col-12
-        const allCols = Array.from(row.children).filter(child =>
-          child.className.includes('ant-col-12')
-        )
+        // 修改这里 如果没有指定className 则获取全部
+        const allCols = Array.from(row.children).filter(child => !className || child.className.includes(className))
 
         // 过滤掉当前a-col，返回其他所有a-col
         return allCols.filter(col => col !== currentCol)
@@ -174,10 +209,48 @@ export default {
         return []
       }
     },
+
+    computeRemainingWidth (allElements, mainCol, currentCol) {
+      if (!allElements || allElements.length === 0) {
+        return '0px'
+      }
+
+      // 排除 mainCol 和 currentCol
+      const filteredElements = allElements.filter(element =>
+        element !== mainCol && element !== currentCol
+      )
+
+      if (filteredElements.length === 0) {
+        return '0px'
+      }
+
+      let totalWidth = 0
+
+      filteredElements.forEach(element => {
+        if (element && element.style) {
+          // 获取元素的计算样式
+          const computedStyle = window.getComputedStyle(element)
+
+          // 获取宽度（包括padding和border）
+          const width = parseFloat(computedStyle.width) || 0
+
+          // 获取左右margin
+          const marginLeft = parseFloat(computedStyle.marginLeft) || 0
+          const marginRight = parseFloat(computedStyle.marginRight) || 0
+
+          // 累加总宽度（宽度 + 左右margin）
+          totalWidth += width + marginLeft + marginRight
+        }
+      })
+
+      // 返回计算出的宽度，如果计算失败则返回默认值
+      return totalWidth > 0 ? `${totalWidth}px` : '0px'
+    },
+
     updateLayout (isOpen) {
       this.$nextTick(() => {
         try {
-          const otherCols = this.getSiblingCols()
+          const otherCols = this.getSiblingCols('ant-col-12')
           if (otherCols.length > 0) {
             let currentCol = this.$el.parentNode
             while (currentCol && !currentCol.className.includes('ant-col')) {
@@ -197,28 +270,42 @@ export default {
               if (isOpen) {
                 if (this.affectLayout) {
                   if (this.widthMode === 'px') {
-                    const drawerWidth = this.expandedWidth || 584
-                    // 使用 style 对象逐个设置属性，保留其他样式
-                    currentCol.style.flex = `0 0 ${drawerWidth}px`
-                    currentCol.style.maxWidth = `${drawerWidth}px`
-                    currentCol.style.transition = 'all 0.3s'
+                    const drawerWidth = this.expandedWidth || 602
+                    // 使用安全的方式设置布局样式
+                    this.safeSetLayoutStyles(currentCol, {
+                      flex: `0 0 ${drawerWidth}px`,
+                      maxWidth: `${drawerWidth}px`,
+                      transition: 'all 0.3s'
+                    })
                     if (otherCols.length === 1) {
                       const mainCol = otherCols[0]
-                      mainCol.style.flex = '1 1 auto'
-                      mainCol.style.maxWidth = `calc(${this.totalWidth} - ${drawerWidth}px)`
-                      mainCol.style.transition = 'all 0.3s'
+                      const remainingWidth = this.computeRemainingWidth(this.getSiblingCols(undefined), mainCol, currentCol)
+
+                      // 使用安全的方式设置布局样式
+                      this.safeSetLayoutStyles(mainCol, {
+                        flex: '1 1 auto',
+                        maxWidth: `calc(100% - ${remainingWidth} - ${drawerWidth}px)`,
+                        transition: 'all 0.3s'
+                      })
                     }
                   } else {
                     const drawerWidth = (this.expandedWidthPercent || 33.3)
-                    currentCol.style.flex = `0 0 ${drawerWidth}%`
-                    currentCol.style.maxWidth = `${drawerWidth}%`
-                    currentCol.style.transition = 'all 0.3s'
+                    // 使用安全的方式设置布局样式
+                    this.safeSetLayoutStyles(currentCol, {
+                      flex: `0 0 ${drawerWidth}%`,
+                      maxWidth: `${drawerWidth}%`,
+                      transition: 'all 0.3s'
+                    })
                     if (otherCols.length === 1) {
                       const mainCol = otherCols[0]
-                      const mainWidth = Math.max(0, Math.min(this.totalWidth, 100) - drawerWidth)
-                      mainCol.style.flex = `0 0 ${mainWidth}%`
-                      mainCol.style.maxWidth = `${mainWidth}%`
-                      mainCol.style.transition = 'all 0.3s'
+                      const remainingWidth = this.computeRemainingWidth(this.getSiblingCols(undefined), mainCol, currentCol)
+
+                      // 使用安全的方式设置布局样式
+                      this.safeSetLayoutStyles(mainCol, {
+                        flex: `0 0 calc(100% - ${remainingWidth} - ${drawerWidth}%)`,
+                        maxWidth: `calc(100% - ${remainingWidth} - ${drawerWidth}%)`,
+                        transition: 'all 0.3s'
+                      })
                     }
                   }
                 } else {
@@ -234,14 +321,23 @@ export default {
                 triggerResize()
               } else {
                 // 收缩状态
-                currentCol.style.flex = '0 0 26px'
-                currentCol.style.maxWidth = '26px'
-                currentCol.style.transition = 'all 0.3s'
+                const width = this.widthMode === 'px' ? this.collapsedWidth + 'px' : this.collapsedWidthPercent + '%'
+                // 使用安全的方式设置布局样式
+                this.safeSetLayoutStyles(currentCol, {
+                  flex: '0 0 ' + width,
+                  maxWidth: width,
+                  transition: 'all 0.3s'
+                })
                 if (otherCols.length === 1) {
                   const mainCol = otherCols[0]
-                  mainCol.style.flex = '1 1 auto'
-                  mainCol.style.maxWidth = 'calc(100% - 26px)'
-                  mainCol.style.transition = 'all 0.3s'
+                  const remainingWidth = this.computeRemainingWidth(this.getSiblingCols(undefined), mainCol, currentCol)
+
+                  // 使用安全的方式设置布局样式
+                  this.safeSetLayoutStyles(mainCol, {
+                    flex: '1 1 auto',
+                    maxWth: `calc(100% - ${remainingWidth} - ${width})`,
+                    transition: 'all 0.3s'
+                  })
                 }
                 triggerResize()
               }