更新

admin/src/components/prescription-slip/index.vue

@@ -92,16 +92,30 @@
                         </div>
                     </template>
                 </template>
-                <!-- 处方联：不写「主方/辅方」，药材连续展示 -->
+                <!-- 处方联：保留主方/辅方分区，用量展示单剂克数 -->
                 <template v-else>
-                    <div
-                        v-for="(h, i) in userHerbs"
-                        :key="'user-' + i"
-                        class="rx-herb-cell"
-                    >
-                        <span class="rx-herb-name">{{ h.name }}</span>
-                        <span class="rx-herb-total">{{ h.dosage }}克</span>
-                    </div>
+                    <template v-if="mainHerbs.length">
+                        <div class="rx-herb-section-label">主方</div>
+                        <div
+                            v-for="(h, i) in mainHerbs"
+                            :key="'user-main-' + i"
+                            class="rx-herb-cell"
+                        >
+                            <span class="rx-herb-name">{{ h.name }}</span>
+                            <span class="rx-herb-total">{{ h.dosage }}克</span>
+                        </div>
+                    </template>
+                    <template v-if="auxHerbs.length">
+                        <div class="rx-herb-section-label rx-herb-section-label--aux">辅方</div>
+                        <div
+                            v-for="(h, i) in auxHerbs"
+                            :key="'user-aux-' + i"
+                            class="rx-herb-cell"
+                        >
+                            <span class="rx-herb-name">{{ h.name }}</span>
+                            <span class="rx-herb-total">{{ h.dosage }}克</span>
+                        </div>
+                    </template>
                 </template>
             </div>
         </div>
@@ -216,8 +230,6 @@ const genderLabel = computed(() => slipGenderLabel(props.data?.gender))
 const ageText = computed(() => slipAgeText(props.data?.age))
 const mainHerbs = computed(() => getMainHerbs(props.data))
 const auxHerbs = computed(() => getAuxHerbs(props.data))
-/** 处方联用药列表：主+辅连续排列，不标注主/辅方 */
-const userHerbs = computed(() => [...mainHerbs.value, ...auxHerbs.value])
 const usageText = computed(() => rxUsageText(props.data))
 const auxUsageText = computed(() => rxAuxUsageText(props.data))
 const adviceText = computed(() => rxAdviceText(props.data))
@@ -421,7 +433,7 @@ defineExpose({
     display: grid;
     grid-template-columns: 1fr 1fr;
     column-gap: 24px;
-    row-gap: 6px;
+    row-gap: 10px;
     position: relative;
     z-index: 1;
     width: 100%;
@@ -451,7 +463,8 @@ defineExpose({
     grid-template-columns: 1fr 64px;
     column-gap: 8px;
     font-size: 13px;
-    line-height: 1.85;
+    /* 略加高：预览与 html2canvas 导出时中文字不易挤叠/切边 */
+    line-height: 2.35;
     min-width: 0;
 }
 
@@ -503,7 +516,7 @@ defineExpose({
 
 .rx-bot-row-1 {
     grid-template-columns: 1.6fr 0.9fr 0.9fr 0.9fr;
-    min-height: 70px;
+    min-height: 78px;
 }
 
 .rx-bot-row-1--user {
@@ -512,15 +525,18 @@ defineExpose({
 
 .rx-bot-cell {
     border-right: 1px solid #c8c8c8;
-    padding: 6px 10px;
+    /* 上下多留空：html2canvas 对中文字体 baseline 偏紧，易切掉字脚/字头 */
+    padding: 10px 12px;
     font-size: 12px;
     color: #1f1f1f;
     display: flex;
     flex-direction: row;
     align-items: center;
     justify-content: flex-start;
-    min-height: 32px;
+    min-height: 40px;
     box-sizing: border-box;
+    line-height: 1.6;
+    overflow: visible;
 
     &:last-child {
         border-right: none;
@@ -537,6 +553,7 @@ defineExpose({
     font-size: 13px;
     color: #1f1f1f;
     margin-bottom: 4px;
+    line-height: 1.5;
 }
 
 .rx-bot-doctor {
@@ -545,52 +562,61 @@ defineExpose({
         display: flex;
         align-items: center;
         gap: 6px;
-        min-height: 36px;
+        min-height: 40px;
+        overflow: visible;
     }
 
     .rx-bot-doctor-name {
         font-size: 13px;
         color: #1f1f1f;
+        line-height: 1.5;
     }
 
     .rx-bot-sign-img {
-        max-height: 40px;
-        max-width: 110px;
+        max-height: 44px;
+        max-width: 120px;
         object-fit: contain;
+        display: block;
     }
 }
 
 .rx-bot-meta {
     flex-wrap: nowrap;
+    overflow: visible;
 
     .rx-bot-meta-key {
         color: #1f1f1f;
         margin-right: 6px;
         white-space: nowrap;
         flex-shrink: 0;
-        line-height: 1.4;
+        line-height: 1.6;
+        padding: 2px 0;
     }
 
     .rx-bot-meta-val {
         font-weight: 500;
         white-space: nowrap;
-        overflow: hidden;
-        text-overflow: ellipsis;
+        /* 勿用 overflow:hidden：导出时易把「30天」等字脚下缘裁掉 */
+        overflow: visible;
         min-width: 0;
-        line-height: 1.4;
+        line-height: 1.6;
+        padding: 2px 0;
     }
 }
 
 .rx-hospital-row {
     display: block;
-    padding: 8px 10px;
+    /* 与上方边框拉开，避免院名/地址字头被横线切掉 */
+    padding: 12px 12px 14px;
     background: #fafafa;
+    overflow: visible;
 }
 
 .rx-hospital-line {
     font-size: 12px;
     color: #606266;
-    line-height: 1.7;
+    line-height: 1.85;
+    padding: 1px 0;
 }
 </style>
 

admin/src/views/consumer/prescription/index.vue

@@ -2649,7 +2649,28 @@ async function handleDownloadSlip() {
             windowWidth: node.scrollWidth,
             windowHeight: node.scrollHeight,
             width: node.scrollWidth,
-            height: node.scrollHeight
+            height: node.scrollHeight,
+            /** 克隆节点上再兜一层：加高行高，避免药材/底部文字被切边 */
+            onclone: (_doc, cloned) => {
+                if (!(cloned instanceof HTMLElement)) return
+                cloned.querySelectorAll<HTMLElement>('.rx-herb-cell').forEach((el) => {
+                    el.style.lineHeight = '2.5'
+                })
+                cloned.querySelectorAll<HTMLElement>('.rx-herbs').forEach((el) => {
+                    el.style.rowGap = '12px'
+                })
+                cloned.querySelectorAll<HTMLElement>('.rx-text').forEach((el) => {
+                    el.style.lineHeight = '2.1'
+                })
+                cloned.querySelectorAll<HTMLElement>('.rx-bot-meta-val, .rx-hospital-line, .rx-bot-cell').forEach((el) => {
+                    el.style.overflow = 'visible'
+                    el.style.lineHeight = '1.85'
+                })
+                cloned.querySelectorAll<HTMLElement>('.rx-hospital-row').forEach((el) => {
+                    el.style.paddingTop = '12px'
+                    el.style.paddingBottom = '14px'
+                })
+            }
         })
         const imgData = canvas.toDataURL('image/jpeg', 0.95)
         const pdf = new jsPDF({ unit: 'mm', format: 'a4', orientation: 'portrait' })

admin/src/views/consumer/prescription/order_list.vue

@@ -4978,7 +4978,28 @@ async function capturePrescriptionSlipCanvas(): Promise<HTMLCanvasElement> {
         width: el.scrollWidth,
         height: el.scrollHeight,
         ignoreElements: (node: Element) =>
-            node instanceof HTMLElement && node.classList.contains('cf-slip-no-export')
+            node instanceof HTMLElement && node.classList.contains('cf-slip-no-export'),
+        /** 克隆节点上再兜一层：加高行高，避免药材/底部文字被切边 */
+        onclone: (_doc, cloned) => {
+            if (!(cloned instanceof HTMLElement)) return
+            cloned.querySelectorAll<HTMLElement>('.rx-herb-cell').forEach((node) => {
+                node.style.lineHeight = '2.5'
+            })
+            cloned.querySelectorAll<HTMLElement>('.rx-herbs').forEach((node) => {
+                node.style.rowGap = '12px'
+            })
+            cloned.querySelectorAll<HTMLElement>('.rx-text').forEach((node) => {
+                node.style.lineHeight = '2.1'
+            })
+            cloned.querySelectorAll<HTMLElement>('.rx-bot-meta-val, .rx-hospital-line, .rx-bot-cell').forEach((node) => {
+                node.style.overflow = 'visible'
+                node.style.lineHeight = '1.85'
+            })
+            cloned.querySelectorAll<HTMLElement>('.rx-hospital-row').forEach((node) => {
+                node.style.paddingTop = '12px'
+                node.style.paddingBottom = '14px'
+            })
+        }
     })
 }
 

admin/src/views/consumer/prescription/order_list_h5.vue

@@ -5673,7 +5673,28 @@ async function capturePrescriptionSlipCanvas(): Promise<HTMLCanvasElement> {
         width: el.scrollWidth,
         height: el.scrollHeight,
         ignoreElements: (node: Element) =>
-            node instanceof HTMLElement && node.classList.contains('cf-slip-no-export')
+            node instanceof HTMLElement && node.classList.contains('cf-slip-no-export'),
+        /** 克隆节点上再兜一层：加高行高，避免药材/底部文字被切边 */
+        onclone: (_doc, cloned) => {
+            if (!(cloned instanceof HTMLElement)) return
+            cloned.querySelectorAll<HTMLElement>('.rx-herb-cell').forEach((node) => {
+                node.style.lineHeight = '2.5'
+            })
+            cloned.querySelectorAll<HTMLElement>('.rx-herbs').forEach((node) => {
+                node.style.rowGap = '12px'
+            })
+            cloned.querySelectorAll<HTMLElement>('.rx-text').forEach((node) => {
+                node.style.lineHeight = '2.1'
+            })
+            cloned.querySelectorAll<HTMLElement>('.rx-bot-meta-val, .rx-hospital-line, .rx-bot-cell').forEach((node) => {
+                node.style.overflow = 'visible'
+                node.style.lineHeight = '1.85'
+            })
+            cloned.querySelectorAll<HTMLElement>('.rx-hospital-row').forEach((node) => {
+                node.style.paddingTop = '12px'
+                node.style.paddingBottom = '14px'
+            })
+        }
     })
 }