From 2036a5a8fcca02c25403d55d8430a8837b1bf01c Mon Sep 17 00:00:00 2001
From: yewj <yewj@123.com>
Date: Fri, 21 Feb 2025 16:05:31 +0800
Subject: [PATCH] =?UTF-8?q?=E5=8F=96=E8=8D=AF=E7=A1=AE=E8=AE=A4=E7=95=8C?=
 =?UTF-8?q?=E9=9D=A2=E4=BF=AE=E6=94=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/collect/ConfirmDrugDealOrder.vue    | 547 ++++++++++--------
 .../collect/IocCollectOrderCheckCode.vue      |  14 +-
 src/views/collect/PannelOrderBizCard.vue      | 153 ++++-
 3 files changed, 429 insertions(+), 285 deletions(-)

diff --git a/src/views/collect/ConfirmDrugDealOrder.vue b/src/views/collect/ConfirmDrugDealOrder.vue
index 66c1ab5e..efa7bead 100644
--- a/src/views/collect/ConfirmDrugDealOrder.vue
+++ b/src/views/collect/ConfirmDrugDealOrder.vue
@@ -1,252 +1,259 @@
 <template>
-  <div>
-    <el-form :model="formData" class="order-el-form" ref="formData" label-width="120px" @submit.native.prevent>
-      <el-card>
-
-        <!--  <el-alert-->
-        <!--  style="margin-top: 15px"-->
-        <!--  :title="msgTip"-->
-        <!--  :closable="false"-->
-        <!--  type="warning">-->
-        <!--</el-alert>-->
-
-        <el-row :gutter="0" style="margin-top: 15px">
-          <el-col :span="24" align="right">
-            <el-button-group>
-<!--              <el-button type="primary" @click.native="deleteCode"-->
-<!--                         v-if="labelName == 1"-->
-<!--                         :disabled="formData.billNo == null"-->
-<!--              >扫码剔除-->
-<!--              </el-button>-->
-<!--              <el-button size="mini" type="primary"-->
-<!--                         v-if="labelName == 2"-->
-<!--                         @click.native="overdeleteCode"-->
-<!--              >结束剔除-->
-<!--              </el-button>-->
-              <el-button
-                type="primary"
-                :disabled="formData.billNo  || (this.formDataVisible != null &&  this.formDataVisible.scanType == 1)"
-                @click.native="nextCollectOrder()"
-              >下一单
-              </el-button>
-              <el-button
-                type="primary"
-                :disabled="formData.billNo ||(this.formDataVisible != null &&  this.formDataVisible.scanType == 1)"
-                @click.native="selectPrescribe()"
-              >选单
-              </el-button>
-<!--              <el-button-->
-<!--                type="primary"-->
-<!--                :disabled="!formData.billNo"-->
-<!--                @click.native="saveDraftOrder()"-->
-<!--              >挂起-->
-<!--              </el-button>-->
-<!--              <el-button-->
-<!--                type="primary"-->
-<!--                :disabled="!formData.billNo"-->
-<!--                @click.native="cancelOrder()"-->
-<!--              >放弃-->
-<!--              </el-button>-->
-              <el-button
-                type="primary"
-                :disabled="!formData.billNo"
-                @click.native="confirmFinishOrder()"
-              >完成
-              </el-button>
-
-              <!--              <el-dropdown @command="handleCommand">-->
-              <!--                <el-button type="primary">-->
-              <!--                  更多功能<i class="el-icon-arrow-down el-icon&#45;&#45;right"></i>-->
-              <!--                </el-button>-->
-              <!--                <el-dropdown-menu slot="dropdown">-->
-              <!--                  <el-dropdown-item divided @click.native="handleClickOut('IoCreateOrderBlank')">工位上货</el-dropdown-item>-->
-              <!--                  <el-dropdown-item divided @click.native="handleClickReturn('IoCreateOrderBlank')">工位退货-->
-              <!--                  </el-dropdown-item>-->
-              <!--                  <el-dropdown-item divided @click.native="handleClick('ioSplitFifoCodeBlank')">工位存量</el-dropdown-item>-->
-              <!--                  <el-dropdown-item divided @click.native="handleClick('CollectOrderAllotBlank')">待处理单-->
-              <!--                  </el-dropdown-item>-->
-              <!--                  <el-dropdown-item divided @click.native="handleClick('CollectOrderEndBlank')">已完成单</el-dropdown-item>-->
-              <!--                </el-dropdown-menu>-->
-              <!--              </el-dropdown>-->
-            </el-button-group>
-          </el-col>
-        </el-row>
-
-        <el-row style="margin-top: 6px;margin-bottom: -6px;"
-                v-if="this.formDataVisible != null &&  this.formDataVisible.scanType == 1">
-          <!--          <el-col :span="6">-->
-          <!--            <el-form-item prop="workPlaceCode" class="query-form-item" label="当前工位:">-->
-          <!--              <el-select-->
-          <!--                v-model="formData.workPlaceCode"-->
-          <!--                placeholder="当前工位"-->
-          <!--                style="width: 90%"-->
-          <!--                :disabled="corpOrderIdDisabled"-->
-          <!--                filterable-->
-          <!--                @change="workPlaceCodeChange"-->
-          <!--              >-->
-          <!--                <el-option-->
-          <!--                  v-for="item in curWorkPlaces"-->
-          <!--                  :key="item.workplaceId"-->
-          <!--                  :label="item.workplaceName"-->
-          <!--                  :value="item.workplaceId"-->
-          <!--                >-->
-          <!--                  <span style="float: left">{{ item.workplaceName }}</span>-->
-          <!--                  <span style="float: right; color: #8492a6; font-size: 13px">{{-->
-          <!--                      item.workplaceId-->
-          <!--                    }}</span>-->
-          <!--                </el-option>-->
-          <!--              </el-select>-->
-          <!--            </el-form-item>-->
-          <!--          </el-col>-->
-
-          <!--          <el-col :span="6">-->
-          <!--            <el-form-item prop="busType" class="query-form-item" label="当前业务类型:">-->
-          <!--              <el-select v-model="formData.busType"-->
-          <!--                         filterable-->
-          <!--                         remote-->
-          <!--                         @change="busTypeChange"-->
-          <!--                         reserve-keyword-->
-          <!--                         disabled-->
-          <!--                         placeholder="请选择业务类型" clearable style="width: 55%">-->
-          <!--                <el-option-->
-          <!--                  v-for="item in busTypeList"-->
-          <!--                  :key="item.documentTypeCode"-->
-          <!--                  :label="item.busName"-->
-          <!--                  :value="item.documentTypeCode"-->
-          <!--                >-->
-          <!--                  <span style="float: left">{{ item.busName }}</span>-->
-          <!--                  <span style="float: right; color: #8492a6; font-size: 13px">{{ item.documentTypeCode }}</span>-->
-          <!--                </el-option>-->
-          <!--              </el-select>-->
-          <!--              <el-button type="primary" @click="toggleBusType" style="margin-left: 5px">切换业务</el-button>-->
-          <!--            </el-form-item>-->
-          <!--          </el-col>-->
-          <el-col :span="6">
-            <el-form-item prop="locInvCode" label="发货方:">
-              <el-select v-model="formData.shipper" placeholder="请选择发货方" clearable
-                         :disabled="formData.billNo"
-                         style="width: 90%"
-              >
-                <el-option
-                  v-for="item in invList"
-                  :key="item.name"
-                  :label="item.name"
-                  :value="item.code">
-                  <span style="float: left">{{ item.name }}</span>
-                </el-option>
-              </el-select>
-            </el-form-item>
-          </el-col>
-          <el-col :span="6">
-            <!--            :label="this.formDataVisible.unitTittle + ':'"-->
-            <el-form-item class="query-form-item" label="收货方">
-              <el-select v-model="formData.fromCorp"
-                         filterable
-                         :disabled="formData.billNo"
-                         remote
-                         reserve-keyword
-                         @change="changeCorp"
-                         placeholder="请选择收货方" clearable style="width: 90%">
-                <el-option
-                  v-for="item in fromInvOptions"
-                  :key="item.code"
-                  :label="item.name"
-                  :value="item.code"
-                >
-                  <span style="float: left">{{ item.name }}</span>
-                  <span style="float: right; color: #8492a6; font-size: 13px">{{ item.code }}</span>
-                </el-option>
-              </el-select>
-            </el-form-item>
-          </el-col>
-
-        </el-row>
-
-        <div style="border: 1px solid #ebeef5;border-radius: 2px;margin-top: 15px;padding: 15px">
-          <el-row :gutter="0" style="margin-top: 5px">
-            <el-col :span="20">
-              <el-form-item prop="code" :label="scanTip" label-width="80px">
-                <el-input
-                  id="inputer"
-                  @focus="getInputFocus($event)"
-                  @keypress.enter.native="enterKey($event)"
-                  ref="inputRef"
-                  style="ime-mode: disabled"
-                  type="tel"
-                  :placeholder="this.placeholder"
-                  v-model="scanCode"
-                ></el-input>
-                <!--                       :disabled="scanDisabled"-->
-              </el-form-item>
-            </el-col>
-            <el-col :span="4">
-              <el-button-group style="display: flex;">
+  <div class="page-container">
+    <div class="content-wrapper">
+      <!-- 左侧面板 -->
+      <div class="content-left">
+        <el-card>
+          <el-form :model="formData" class="order-el-form" ref="formData" label-width="120px" @submit.native.prevent>
+  
+          <!--  <el-alert-->
+          <!--  style="margin-top: 15px"-->
+          <!--  :title="msgTip"-->
+          <!--  :closable="false"-->
+          <!--  type="warning">-->
+          <!--</el-alert>-->
+
+          <el-row :gutter="0" style="margin-top: 15px">
+            <el-col :span="24" align="right">
+              <el-button-group>
+                <!--              <el-button type="primary" @click.native="deleteCode"-->
+                <!--                         v-if="labelName == 1"-->
+                <!--                         :disabled="formData.billNo == null"-->
+                <!--              >扫码剔除-->
+                <!--              </el-button>-->
+                <!--              <el-button size="mini" type="primary"-->
+                <!--                         v-if="labelName == 2"-->
+                <!--                         @click.native="overdeleteCode"-->
+                <!--              >结束剔除-->
+                <!--              </el-button>-->
                 <el-button
                   type="primary"
-                  size="mini"
-                  icon="el-icon-search"
-                  @click.native.stop="enterKey()"
-                  style="margin-left: 15px"
-                >
+                  :disabled="formData.billNo  || (this.formDataVisible != null &&  this.formDataVisible.scanType == 1)"
+                  @click.native="nextCollectOrder()"
+                >下一单
+                </el-button>
+                <el-button
+                  type="primary"
+                  :disabled="formData.billNo ||(this.formDataVisible != null &&  this.formDataVisible.scanType == 1)"
+                  @click.native="selectPrescribe()"
+                >选单
                 </el-button>
-                <!-- :disabled="!formData.billNo ||  (this.formDataVisible != null &&  this.formDataVisible.scanType == 1)"-->
-<!--                <el-button type="primary"-->
-<!--                           @click="addGs">ALT+29-->
-<!--                </el-button>-->
+                <!--              <el-button-->
+                <!--                type="primary"-->
+                <!--                :disabled="!formData.billNo"-->
+                <!--                @click.native="saveDraftOrder()"-->
+                <!--              >挂起-->
+                <!--              </el-button>-->
+                <!--              <el-button-->
+                <!--                type="primary"-->
+                <!--                :disabled="!formData.billNo"-->
+                <!--                @click.native="cancelOrder()"-->
+                <!--              >放弃-->
+                <!--              </el-button>-->
                 <el-button
                   type="primary"
-                  size="mini"
-                  icon="el-icon-delete"
-                  @click.native.stop="clearCode()"
-                >清空
+                  :disabled="!formData.billNo"
+                  @click.native="confirmFinishOrder()"
+                >完成
                 </el-button>
+
+                <!--              <el-dropdown @command="handleCommand">-->
+                <!--                <el-button type="primary">-->
+                <!--                  更多功能<i class="el-icon-arrow-down el-icon&#45;&#45;right"></i>-->
+                <!--                </el-button>-->
+                <!--                <el-dropdown-menu slot="dropdown">-->
+                <!--                  <el-dropdown-item divided @click.native="handleClickOut('IoCreateOrderBlank')">工位上货</el-dropdown-item>-->
+                <!--                  <el-dropdown-item divided @click.native="handleClickReturn('IoCreateOrderBlank')">工位退货-->
+                <!--                  </el-dropdown-item>-->
+                <!--                  <el-dropdown-item divided @click.native="handleClick('ioSplitFifoCodeBlank')">工位存量</el-dropdown-item>-->
+                <!--                  <el-dropdown-item divided @click.native="handleClick('CollectOrderAllotBlank')">待处理单-->
+                <!--                  </el-dropdown-item>-->
+                <!--                  <el-dropdown-item divided @click.native="handleClick('CollectOrderEndBlank')">已完成单</el-dropdown-item>-->
+                <!--                </el-dropdown-menu>-->
+                <!--              </el-dropdown>-->
               </el-button-group>
             </el-col>
           </el-row>
-<!--          <el-row :gutter="0">-->
-<!--            <el-col :span="20" style="margin-top: 0px;margin-bottom: 10px;margin-left: 80px">-->
-<!--              <el-checkbox v-model="checked" v-if="!this.formData.billNo && this.formDataVisible.scanType != 1">定向查询-->
-<!--              </el-checkbox>-->
-<!--            </el-col>-->
-<!--          </el-row>-->
-          <el-alert
-            :title="scanTitle"
-            :type="scanResultType"
-            :closable="false"
-            :dangerouslyUseHTMLString="true"
-            :description="result">
-          </el-alert>
-          <el-alert
-            v-if="warnVisible"
-            title="警告信息:"
-            type="warning"
-            :closable="true"
-            :dangerouslyUseHTMLString="true"
-            :description="warnResult">
-          </el-alert>
-          <el-alert
-            v-if="errVisible"
-            title="错误信息:"
-            type="warning"
-            :closable="true"
-            :dangerouslyUseHTMLString="true"
-            :description="errResult">
-          </el-alert>
-
-
-        </div>
-        <el-descriptions title="单据信息" :column="4" border style="margin-top: 15px">
-          <el-descriptions-item label="业务单号">{{ formData.billNo }}</el-descriptions-item>
-          <el-descriptions-item label="发货方">{{ formData.shipperName }}</el-descriptions-item>
-          <el-descriptions-item label="收货方">{{ formData.fromCorpName }}</el-descriptions-item>
-          <el-descriptions-item label="单据类型">{{ formData.busTypeName }}</el-descriptions-item>
-          <el-descriptions-item label="来源系统">{{ formData.fromType }}</el-descriptions-item>
-          <el-descriptions-item label="单据时间">{{ formData.billTime }}</el-descriptions-item>
-          <el-descriptions-item label="单据备注">{{ formData.remark }}</el-descriptions-item>
-        </el-descriptions>
-      </el-card>
 
-      <el-tabs type="border-card" style="margin: 15px" v-model="editableTabsValue">
+          <el-row style="margin-top: 6px;margin-bottom: -6px;"
+                  v-if="this.formDataVisible != null &&  this.formDataVisible.scanType == 1">
+            <!--          <el-col :span="6">-->
+            <!--            <el-form-item prop="workPlaceCode" class="query-form-item" label="当前工位:">-->
+            <!--              <el-select-->
+            <!--                v-model="formData.workPlaceCode"-->
+            <!--                placeholder="当前工位"-->
+            <!--                style="width: 90%"-->
+            <!--                :disabled="corpOrderIdDisabled"-->
+            <!--                filterable-->
+            <!--                @change="workPlaceCodeChange"-->
+            <!--              >-->
+            <!--                <el-option-->
+            <!--                  v-for="item in curWorkPlaces"-->
+            <!--                  :key="item.workplaceId"-->
+            <!--                  :label="item.workplaceName"-->
+            <!--                  :value="item.workplaceId"-->
+            <!--                >-->
+            <!--                  <span style="float: left">{{ item.workplaceName }}</span>-->
+            <!--                  <span style="float: right; color: #8492a6; font-size: 13px">{{-->
+            <!--                      item.workplaceId-->
+            <!--                    }}</span>-->
+            <!--                </el-option>-->
+            <!--              </el-select>-->
+            <!--            </el-form-item>-->
+            <!--          </el-col>-->
+
+            <!--          <el-col :span="6">-->
+            <!--            <el-form-item prop="busType" class="query-form-item" label="当前业务类型:">-->
+            <!--              <el-select v-model="formData.busType"-->
+            <!--                         filterable-->
+            <!--                         remote-->
+            <!--                         @change="busTypeChange"-->
+            <!--                         reserve-keyword-->
+            <!--                         disabled-->
+            <!--                         placeholder="请选择业务类型" clearable style="width: 55%">-->
+            <!--                <el-option-->
+            <!--                  v-for="item in busTypeList"-->
+            <!--                  :key="item.documentTypeCode"-->
+            <!--                  :label="item.busName"-->
+            <!--                  :value="item.documentTypeCode"-->
+            <!--                >-->
+            <!--                  <span style="float: left">{{ item.busName }}</span>-->
+            <!--                  <span style="float: right; color: #8492a6; font-size: 13px">{{ item.documentTypeCode }}</span>-->
+            <!--                </el-option>-->
+            <!--              </el-select>-->
+            <!--              <el-button type="primary" @click="toggleBusType" style="margin-left: 5px">切换业务</el-button>-->
+            <!--            </el-form-item>-->
+            <!--          </el-col>-->
+            <el-col :span="6">
+              <el-form-item prop="locInvCode" label="发货方:">
+                <el-select v-model="formData.shipper" placeholder="请选择发货方" clearable
+                           :disabled="formData.billNo"
+                           style="width: 90%"
+                >
+                  <el-option
+                    v-for="item in invList"
+                    :key="item.name"
+                    :label="item.name"
+                    :value="item.code">
+                    <span style="float: left">{{ item.name }}</span>
+                  </el-option>
+                </el-select>
+              </el-form-item>
+            </el-col>
+            <el-col :span="6">
+              <!--            :label="this.formDataVisible.unitTittle + ':'"-->
+              <el-form-item class="query-form-item" label="收货方">
+                <el-select v-model="formData.fromCorp"
+                           filterable
+                           :disabled="formData.billNo"
+                           remote
+                           reserve-keyword
+                           @change="changeCorp"
+                           placeholder="请选择收货方" clearable style="width: 90%">
+                  <el-option
+                    v-for="item in fromInvOptions"
+                    :key="item.code"
+                    :label="item.name"
+                    :value="item.code"
+                  >
+                    <span style="float: left">{{ item.name }}</span>
+                    <span style="float: right; color: #8492a6; font-size: 13px">{{ item.code }}</span>
+                  </el-option>
+                </el-select>
+              </el-form-item>
+            </el-col>
+
+          </el-row>
+
+          <div style="border: 1px solid #ebeef5;border-radius: 2px;margin-top: 15px;padding: 15px">
+            <el-row :gutter="0" style="margin-top: 5px">
+              <el-col :span="20">
+                <el-form-item prop="code" :label="scanTip" label-width="80px">
+                  <el-input
+                    id="inputer"
+                    @focus="getInputFocus($event)"
+                    @keypress.enter.native="enterKey($event)"
+                    ref="inputRef"
+                    style="ime-mode: disabled"
+                    type="tel"
+                    :placeholder="this.placeholder"
+                    v-model="scanCode"
+                  ></el-input>
+                  <!--                       :disabled="scanDisabled"-->
+                </el-form-item>
+              </el-col>
+              <el-col :span="4">
+                <el-button-group style="display: flex;">
+                  <el-button
+                    type="primary"
+                    size="mini"
+                    icon="el-icon-search"
+                    @click.native.stop="enterKey()"
+                    style="margin-left: 15px"
+                  >
+                  </el-button>
+                  <!-- :disabled="!formData.billNo ||  (this.formDataVisible != null &&  this.formDataVisible.scanType == 1)"-->
+                  <!--                <el-button type="primary"-->
+                  <!--                           @click="addGs">ALT+29-->
+                  <!--                </el-button>-->
+                  <el-button
+                    type="primary"
+                    size="mini"
+                    icon="el-icon-delete"
+                    @click.native.stop="clearCode()"
+                  >清空
+                  </el-button>
+                </el-button-group>
+              </el-col>
+            </el-row>
+            <!--          <el-row :gutter="0">-->
+            <!--            <el-col :span="20" style="margin-top: 0px;margin-bottom: 10px;margin-left: 80px">-->
+            <!--              <el-checkbox v-model="checked" v-if="!this.formData.billNo && this.formDataVisible.scanType != 1">定向查询-->
+            <!--              </el-checkbox>-->
+            <!--            </el-col>-->
+            <!--          </el-row>-->
+            <el-alert
+              :title="scanTitle"
+              :type="scanResultType"
+              :closable="false"
+              :dangerouslyUseHTMLString="true"
+              :description="result">
+            </el-alert>
+            <el-alert
+              v-if="warnVisible"
+              title="警告信息:"
+              type="warning"
+              :closable="true"
+              :dangerouslyUseHTMLString="true"
+              :description="warnResult">
+            </el-alert>
+            <el-alert
+              v-if="errVisible"
+              title="错误信息:"
+              type="warning"
+              :closable="true"
+              :dangerouslyUseHTMLString="true"
+              :description="errResult">
+            </el-alert>
+
+
+          </div>
+          <el-descriptions title="单据信息" :column="2" border style="margin-top: 15px">
+            <el-descriptions-item label="业务单号">{{ formData.billNo }}</el-descriptions-item>
+            <el-descriptions-item label="发货方">{{ formData.shipperName }}</el-descriptions-item>
+            <el-descriptions-item label="收货方">{{ formData.fromCorpName }}</el-descriptions-item>
+            <el-descriptions-item label="单据类型">{{ formData.busTypeName }}</el-descriptions-item>
+            <el-descriptions-item label="来源系统">{{ formData.fromType }}</el-descriptions-item>
+            <el-descriptions-item label="单据时间">{{ formData.billTime }}</el-descriptions-item>
+            <el-descriptions-item label="单据备注">{{ formData.remark }}</el-descriptions-item>
+          </el-descriptions>
+        </el-form>
+      </el-card>
+    </div>
+    
+    <!-- 右侧面板 -->
+    <div class="content-right">
+      <el-tabs type="border-card" class="right-tabs" v-model="editableTabsValue">
         <el-tab-pane label="扫码详情" name="prescribeOriginPanel">
           <prescribeOriginPanel
             v-if="panelALive"
@@ -382,8 +389,9 @@
       </el-dialog>
 
 
-    </el-form>
+    </div>
   </div>
+</div>
 
 </template>
 
@@ -582,7 +590,7 @@ export default {
         this.result = "";
         return;
       }else {//不需要
-       return
+        return
       }
     },
     getBillNo(billNo) {
@@ -655,7 +663,6 @@ export default {
             }
 
           }
-
         }
         return
       })
@@ -1674,20 +1681,62 @@ export default {
 </script>
 
 <style scoped>
+.page-container {
+  height: 100%;
+  width: 100%;
+  padding: 15px;
+  box-sizing: border-box;
+}
+
+.content-wrapper {
+  display: flex;
+  gap: 15px;
+  height: 100%;
+  width: 100%;
+}
+
+.content-left {
+  flex: 0 0 40%;
+  min-width: 0; /* 防止内容溢出 */
+}
+
+.content-right {
+  flex: 0 0 60%;
+  min-width: 0; /* 防止内容溢出 */
+}
+
+/* 保持卡片内容可滚动 */
+.content-left :deep(.el-card__body) {
+  height: 100%;
+  overflow-y: auto;
+}
+
+/* 保持右侧标签页内容可滚动 */
+.content-right :deep(.el-tabs__content) {
+  height: calc(100% - 40px);
+  overflow-y: auto;
+}
+
+/* 其他现有样式保持不变 */
 .el-col {
-  margin-top: -5px;
-  margin-bottom: -5px;
+  margin: 0;
+}
+
+.el-alert {
+  margin-bottom: 16px;
 }
 
-.el-dropdown {
-  vertical-align: top;
+.el-alert:last-child {
+  margin-bottom: 0;
 }
 
-.el-dropdown + .el-dropdown {
-  margin-left: 15px;
+.el-tabs--border-card {
+  height: 100%;
+  box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
 }
 
-.el-icon-arrow-down {
-  font-size: 12px;
+.query-form-item :deep(.el-form-item__content) {
+  display: flex;
+  align-items: center;
 }
 </style>
diff --git a/src/views/collect/IocCollectOrderCheckCode.vue b/src/views/collect/IocCollectOrderCheckCode.vue
index 1acd4e85..358888d7 100644
--- a/src/views/collect/IocCollectOrderCheckCode.vue
+++ b/src/views/collect/IocCollectOrderCheckCode.vue
@@ -146,8 +146,8 @@
             <el-table-column label="产品通用名" prop="cpmctymc" width="160"></el-table-column>
             <el-table-column label="制剂规格" prop="prepnSpec" width="160"></el-table-column>
             <el-table-column label="包装规格" prop="spec" width="100"></el-table-column>
-<!--            <el-table-column label="扫码数量" prop="scanActCount" width="80"></el-table-column>-->
-<!--            <el-table-column label="单据数量" prop="count" width="80"></el-table-column>-->
+            <!--            <el-table-column label="扫码数量" prop="scanActCount" width="80"></el-table-column>-->
+            <!--            <el-table-column label="单据数量" prop="count" width="80"></el-table-column>-->
             <!-- 扫码数量列 -->
             <el-table-column label="扫码实际数量" width="100">
               <template slot-scope="scope">
@@ -178,7 +178,7 @@
                   <div style="background-color: #F56C6C;width: 10px;height: 10px;"></div>
                 </td>
                 <td>
-                  <span style="color: #6d6d6d;"><pre>未扫码  </pre></span>
+                  <span style="color: #6d6d6d; "><pre>未扫码  </pre></span>
                 </td>
                 <td>
                   <div style="background-color: #E6A23C;width: 10px;height: 10px;"></div>
@@ -575,14 +575,14 @@ export default {
             this.checkCodeEnd()
           } else {
 
-            if ( this.busDataList.length > 0){
+            if (this.busDataList.length > 0) {
               this.busDataList.forEach(item => {
                 // 检查 item 的 id 是否与 bizId 匹配
                 if (item.id == res.data.bizIdFk) {
                   // 如果匹配，递增计数器
-                  if ( item.scanActCount == null){
+                  if (item.scanActCount == null) {
                     item.scanActCount = res.data.scanActCount;
-                  }else {
+                  } else {
                     item.scanActCount += res.data.scanActCount;
                   }
                 }
@@ -1020,7 +1020,7 @@ export default {
       rowBackground.height = '38px'
       return rowBackground
     }
-    },
+  },
   watch: {
     resetKey(newVal, oldVal) {
       this.$refs.inputRef.focus()
diff --git a/src/views/collect/PannelOrderBizCard.vue b/src/views/collect/PannelOrderBizCard.vue
index e3af5494..3761f097 100644
--- a/src/views/collect/PannelOrderBizCard.vue
+++ b/src/views/collect/PannelOrderBizCard.vue
@@ -1,39 +1,62 @@
 <template>
   <div>
-    <el-row>
-      <el-col v-for="(info, index)  in preDetailList"  :key="index" :xs="12" :sm="6" :md="6" :lg="8" >
-        <el-card :body-style="{margin:'20px'}"
-                 style="margin:20px 20px 20px 20px;;background-color: #e1f3fb;border-radius: 12px; position: relative;">
-          <div style="display: flex; justify-content: space-between; align-items: center; height: 26px; /* 约为 200px 的 1/3 */" >
-            <p>产品通用名：</p> <p style="font-size: 20px;background-color: #e1f3fb;font-weight: bold;">{{ info.cpmctymc }}</p>
+    <el-row :gutter="20">
+      <el-col v-for="(info, index) in preDetailList" :key="index" :span="24">
+        <el-card class="drug-card">
+          <div class="card-content">
+            <div class="info-section">
+              <div class="info-row">
+                <span class="label">产品通用名：</span>
+                <span class="value product-name">{{ info.cpmctymc }}</span>
+              </div>
+              <div class="info-row">
+                <span class="label">包装规格：</span>
+                <span class="value">{{ info.ggxh }}</span>
+              </div>
+              <div class="info-row">
+                <span class="label">制剂规格：</span>
+                <span class="value">{{ info.prepnSpec }}</span>
+              </div>
+              <div class="info-row">
+                <span class="label">批次号：</span>
+                <span class="value">{{ info.batchNo }}</span>
+              </div>
+              <div class="info-row">
+                <span class="label">摆放位置：</span>
+                <span class="value">{{ info.queueCode }}</span>
+              </div>
+            </div>
+            
+            <div class="action-section">
+              <div class="count-display">
+                <h1 class="count" :class="{ 'confirmed': info.getConfirm }">{{ info.count }}</h1>
+                <div class="light-info">
+                  <i class="el-icon-s-opportunity"></i>
+                  <span :style="colorStyle(info)">{{ info.colorName }}</span>
+                </div>
+              </div>
+              <div class="button-group">
+                <el-button 
+                  type="primary" 
+                  icon="el-icon-document" 
+                  @click="codeHandleClick(info)" 
+                  :disabled="!info.getConfirm">
+                  赋码明细
+                </el-button>
+                <el-button 
+                  type="primary" 
+                  icon="el-icon-thumb" 
+                  @click="handleClick(info)" 
+                  :disabled="info.getConfirm">
+                  确认取药
+                </el-button>
+              </div>
+            </div>
           </div>
-          <div style="display: flex; justify-content: space-between; align-items: center; height: 26px; /* 约为 200px 的 1/3 */" >
-            <p>包装规格：</p><p style="font-size: 16px;background-color: #e1f3fb;font-weight: bold;">{{ info.ggxh }}</p>
-          </div>
-          <div style="display: flex; justify-content: space-between; align-items: center; height: 26px; /* 约为 200px 的 1/3 */" >
-            <p>制剂规格：</p><p style="font-size: 16px;background-color: #e1f3fb;font-weight: bold;">{{ info.prepnSpec }}</p>
-          </div>
-          <div style="display: flex; justify-content: space-between; align-items: center; height: 26px; /* 约为 200px 的 1/3 */" >
-            <p>批次号：</p><p style="font-size: 16px;background-color: #e1f3fb;font-weight: bold;">{{ info.batchNo }}</p>
-          </div>
-          <div style="display: flex; justify-content: space-between; align-items: center; height: 26px; /* 约为 200px 的 1/3 */" >
-            <p>摆放位置：</p><p style="font-size: 16px;background-color: #e1f3fb;font-weight: bold;">{{ info.queueCode }}</p>
-          </div>
-          <div style="display: flex; justify-content: space-between; align-items: center; height: 26px; /* 约为 200px 的 1/3 */" >
-            <p></p><p style="font-size: 20px;background-color: #e1f3fb;font-weight: bold;margin-top: 80px"><i  class="el-icon-s-opportunity"></i>
-            <span :style="colorStyle(info)">{{ info.colorName}}</span></p>
-          </div>
-          <div style="flex: 1; display: flex; flex-direction: column; justify-content: flex-end; padding-top: 10px;"  >
-            <span><h1 :style="{ 'font-size': '45px', 'color': info.getConfirm ? '#67C23A' : '#F56C6C' }">{{ info.count }}</h1></span>
-            <el-button type="primary" style="position: absolute; bottom: 20px; right: 130px;" icon="el-icon-document" @click="codeHandleClick(info)"  :disabled="!info.getConfirm">赋码明细</el-button>
-            <el-button type="primary" style="position: absolute; bottom: 20px; right: 20px;" icon="el-icon-thumb" @click="handleClick(info)"  :disabled="info.getConfirm">确认取药</el-button>
-          </div>
-
         </el-card>
       </el-col>
     </el-row>
 
-
     <el-dialog
       title="扫码明细"
       :visible.sync="scanDetailVisible"
@@ -345,4 +368,76 @@ export default {
 </script>
 
 <style scoped>
+.drug-card {
+  margin: 10px 0;
+  background-color: #e1f3fb;
+  border-radius: 12px;
+}
+
+.card-content {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+
+}
+
+.info-section {
+  flex: 1;
+}
+
+.info-row {
+  display: flex;
+  align-items: center;
+  margin: 8px 0;
+}
+
+.label {
+  color: #606266;
+  font-size: 14px;
+  width: 100px;
+  flex-shrink: 0;
+}
+
+.value {
+  font-weight: bold;
+  font-size: 14px;
+}
+
+.product-name {
+  font-size: 16px;
+}
+
+.action-section {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  margin-left: 40px;
+}
+
+.count-display {
+  text-align: center;
+  margin-bottom: 20px;
+}
+
+.count {
+  font-size: 45px;
+  margin: 0 0 10px 0;
+}
+
+.count.confirmed {
+  color: #67C23A;
+}
+
+.count:not(.confirmed) {
+  color: #F56C6C;
+}
+
+.light-info {
+  text-align: center;
+}
+
+.button-group {
+  display: flex;
+  gap: 10px;
+}
 </style>