From dacc95761cf7090c628fc37a5d4f8bb825ccbbb0 Mon Sep 17 00:00:00 2001
From: yyb <995253665@qq.com>
Date: 星期六, 16 五月 2026 15:41:45 +0800
Subject: [PATCH] 企业新闻和通知公告

---
 src/views/productionManagement/productionOrder/index.vue |  576 ++++++++++++++++++++++++++++++++++++++++++++++++++++----
 1 files changed, 528 insertions(+), 48 deletions(-)

diff --git a/src/views/productionManagement/productionOrder/index.vue b/src/views/productionManagement/productionOrder/index.vue
index 670290c..90ca51d 100644
--- a/src/views/productionManagement/productionOrder/index.vue
+++ b/src/views/productionManagement/productionOrder/index.vue
@@ -11,22 +11,6 @@
                     style="width: 160px;"
                     @change="handleQuery" />
         </el-form-item>
-        <el-form-item label="瀹㈡埛鍚嶇О:">
-          <el-input v-model="searchForm.customerName"
-                    placeholder="璇疯緭鍏�"
-                    clearable
-                    prefix-icon="Search"
-                    style="width: 160px;"
-                    @change="handleQuery" />
-        </el-form-item>
-        <el-form-item label="鍚堝悓鍙�:">
-          <el-input v-model="searchForm.salesContractNo"
-                    placeholder="璇疯緭鍏�"
-                    clearable
-                    prefix-icon="Search"
-                    style="width: 160px;"
-                    @change="handleQuery" />
-        </el-form-item>
         <el-form-item label="浜у搧鍚嶇О:">
           <el-input v-model="searchForm.productName"
                     placeholder="璇疯緭鍏�"
@@ -43,16 +27,35 @@
                     style="width: 160px;"
                     @change="handleQuery" />
         </el-form-item>
+        <el-form-item label="鐘舵��:">
+          <el-select v-model="searchForm.status"
+                     placeholder="璇烽�夋嫨"
+                     style="width: 160px;"
+                     @change="handleQuery">
+            <el-option label="寰呭紑濮�"
+                       value="1" />
+            <el-option label="杩涜涓�"
+                       value="2" />
+            <el-option label="宸插畬鎴�"
+                       value="3" />
+            <el-option label="宸插彇娑�"
+                       value="4" />
+            <el-option label="宸茬粨鏉�"
+                       value="5" />
+          </el-select>
+        </el-form-item>
         <el-form-item>
           <el-button type="primary"
                      @click="handleQuery">鎼滅储</el-button>
+          <el-button type="info"
+                     @click="handleReset">閲嶇疆</el-button>
         </el-form-item>
       </el-form>
       <div class="action-buttons">
-        <el-button type="primary"
-                   @click="isShowNewModal = true">鏂板</el-button>
+        <!-- <el-button type="primary"
+                   @click="isShowNewModal = true">鏂板</el-button> -->
         <el-button type="danger"
-                   @click="handleDelete">鍒犻櫎</el-button>
+                   @click="handleDelete">閫�鍥�</el-button>
         <el-button @click="handleOut">瀵煎嚭</el-button>
       </div>
     </div>
@@ -64,12 +67,33 @@
                 :tableLoading="tableLoading"
                 :row-class-name="tableRowClassName"
                 :isSelection="true"
+                :selectable="row => !row.endOrder"
                 @selection-change="handleSelectionChange"
                 @pagination="pagination">
         <template #completionStatus="{ row }">
           <el-progress :percentage="toProgressPercentage(row?.completionStatus)"
                        :color="progressColor(toProgressPercentage(row?.completionStatus))"
                        :status="toProgressPercentage(row?.completionStatus) >= 100 ? 'success' : ''" />
+        </template>
+        <template #processRouteStatus="{ row }">
+          <div v-if="row.processRouteStatus && row.processRouteStatus.length"
+               class="process-progress-container">
+            <div v-for="(item, index) in row.processRouteStatus"
+                 :key="index"
+                 class="process-step">
+              <div class="step-content">
+                <div class="step-circle"
+                     :class="{ 'is-completed': item.percentage >= 100 }">
+                  <span class="step-percentage"
+                        :style="{ color: item.percentage >= 70 ? item.percentage >= 100 ? '#67c23a' : '#f56c6c' : '#000' }">{{ item.percentage }}%</span>
+                </div>
+                <div class="step-name">{{ item.name }}</div>
+              </div>
+              <div v-if="index < row.processRouteStatus.length - 1"
+                   class="step-line"></div>
+            </div>
+          </div>
+          <span v-else>-</span>
         </template>
       </PIMTable>
     </div>
@@ -98,15 +122,94 @@
         </span>
       </template>
     </el-dialog>
+    <!-- 鏉ユ簮鏁版嵁寮圭獥 -->
+    <el-dialog v-model="sourceDataDialogVisible"
+               title="鏉ユ簮鏁版嵁"
+               width="1200px">
+      <div v-if="sourceRowData"
+           class="applyno-summary1">
+        <div class="summary-item">
+          <span class="summary-label">浜у搧鍚嶇О锛�</span>
+          <span class="summary-value">
+            <el-tag type="primary">{{ sourceRowData.productName || '-' }}</el-tag>
+          </span>
+        </div>
+        <div class="summary-item">
+          <span class="summary-label">瑙勬牸锛�</span>
+          <span class="summary-value">{{ sourceRowData.model || '-' }}</span>
+        </div>
+        <div class="summary-item">
+          <span class="summary-label">璁㈠崟闇�姹傛暟閲忥細</span>
+          <span class="summary-value">{{ sourceRowData.quantity || 0 }}</span>
+        </div>
+      </div>
+      <div class="source-table-container">
+        <div class="source-data-cards-container">
+          <div v-for="(item, index) in sourceTableData"
+               :key="index"
+               class="source-data-card">
+            <div class="card-body">
+              <div class="info-grid">
+                <div class="info-item">
+                  <div class="info-label">璁″垝鍙�</div>
+                  <div class="info-value">{{ item.mpsNo || '-' }}</div>
+                </div>
+                <div class="info-item">
+                  <div class="info-label">鏁版嵁鏉ユ簮</div>
+                  <div class="info-value">
+                    <el-tag :type="item.source === '閿�鍞�' ? 'primary' : 'warning'">
+                      {{ item.source || '鏈煡' }}
+                    </el-tag>
+                  </div>
+                </div>
+                <div class="info-item">
+                  <div class="info-label">鍚堝悓鍙�</div>
+                  <div class="info-value">{{ item.salesContractNo || '-' }}</div>
+                </div>
+                <div class="info-item">
+                  <div class="info-label">瀹㈡埛鍚嶇О</div>
+                  <div class="info-value">{{ item.customerName || '-' }}</div>
+                </div>
+                <div class="info-item">
+                  <div class="info-label">椤圭洰鍚嶇О</div>
+                  <div class="info-value">{{ item.projectName || '-' }}</div>
+                </div>
+                <div class="info-item">
+                  <div class="info-label">璁″垝闇�姹傛暟閲�</div>
+                  <div class="info-value">{{ item.qtyRequired || 0 }} {{ item.unit || '' }}</div>
+                </div>
+                <div class="info-item">
+                  <div class="info-label">鍗曚綅</div>
+                  <div class="info-value">{{ item.unit || '-' }}</div>
+                </div>
+                <div class="info-item">
+                  <div class="info-label">闇�姹傛棩鏈�</div>
+                  <div class="info-value">{{ item.requiredDate ? dayjs(item.requiredDate).format('YYYY-MM-DD') : '-' }}</div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </el-dialog>
     <MaterialLedgerDialog v-model="materialDialogVisible"
                           :order-row="currentMaterialOrder"
                           @saved="getList" />
     <MaterialDetailDialog v-model="materialDetailDialogVisible"
                           :order-row="currentMaterialDetailOrder"
                           @confirmed="getList" />
+    <MaterialSupplementDialog v-model="materialSupplementDialogVisible"
+                              :order-row="currentMaterialSupplementOrder"
+                              @saved="getList" />
     <new-product-order v-if="isShowNewModal"
                        v-model:visible="isShowNewModal"
                        @completed="handleQuery" />
+    <!-- 鎵撳嵃棰嗘枡鍗曠粍浠� -->
+    <div class="print-requisition-wrapper">
+      <PrintMaterialRequisition ref="printRef"
+                                :order-row="printOrderRow"
+                                :material-list="printMaterialList" />
+    </div>
   </div>
 </template>
 
@@ -129,12 +232,21 @@
     bindingRoute,
     listProcessBom,
     delProductOrder,
+    getProductOrderSource,
+    updateProductOrder,
   } from "@/api/productionManagement/productionOrder.js";
+  import { productWorkOrderPage } from "@/api/productionManagement/workOrder.js";
   import { listMain as getOrderProcessRouteMain } from "@/api/productionManagement/productProcessRoute.js";
   import MaterialLedgerDialog from "@/views/productionManagement/productionOrder/components/MaterialLedgerDialog.vue";
   import MaterialDetailDialog from "@/views/productionManagement/productionOrder/components/MaterialDetailDialog.vue";
+  import MaterialSupplementDialog from "@/views/productionManagement/productionOrder/components/MaterialSupplementDialog.vue";
+  import PrintMaterialRequisition from "@/views/productionManagement/productionOrder/components/PrintMaterialRequisition.vue";
   import PIMTable from "@/components/PIMTable/PIMTable.vue";
   import { listPage } from "@/api/productionManagement/processRoute.js";
+  import {
+    listMaterialPickingDetail,
+    listMaterialPickingBom,
+  } from "@/api/productionManagement/productionOrder.js";
   const NewProductOrder = defineAsyncComponent(() =>
     import("@/views/productionManagement/productionOrder/New.vue")
   );
@@ -143,22 +255,55 @@
 
   const router = useRouter();
   const isShowNewModal = ref(false);
+  const sourceDataDialogVisible = ref(false);
+  const sourceTableData = ref([]);
+  const sourceRowData = ref(null);
+  const sourcePage = reactive({
+    total: 0,
+  });
 
-  const tableColumn = ref([
+  const processColumnWidth = computed(() => {
+    if (!tableData.value || tableData.value.length === 0) return "200px";
+    const maxProcesses = Math.max(
+      ...tableData.value.map(row => row.processRouteStatus?.length || 0)
+    );
+    if (maxProcesses === 0) return "100px";
+    // 姣忎釜宸ュ簭鍦嗗湀 36px + 绾挎潯 30px = 66px锛岄澶栧姞 60px 杈硅窛鍜屾枃瀛楃┖闂�
+    return `${maxProcesses * 66 + 60}px`;
+  });
+
+  const tableColumn = computed(() => [
     {
       label: "鐢熶骇璁㈠崟鍙�",
       prop: "npsNo",
       width: "150px",
     },
+    // 1.寰呭紑濮嬨��2.杩涜涓��3.宸插畬鎴愩��4.宸插彇娑堛��5.宸茬粨鏉�
     {
-      label: "閿�鍞悎鍚屽彿",
-      prop: "salesContractNo",
+      label: "鐘舵��",
+      prop: "status",
       width: "150px",
-    },
-    {
-      label: "瀹㈡埛鍚嶇О",
-      prop: "customerName",
-      width: "200px",
+      dataType: "tag",
+      formatData: val =>
+        val === 1
+          ? "寰呭紑濮�"
+          : val === 2
+          ? "杩涜涓�"
+          : val === 3
+          ? "宸插畬鎴�"
+          : val === 5
+          ? "宸茬粨鏉�"
+          : "宸插彇娑�",
+      formatType: val =>
+        val === 1
+          ? "primary"
+          : val === 2
+          ? "warning"
+          : val === 3
+          ? "success"
+          : val === 5
+          ? "danger"
+          : "info",
     },
     {
       label: "浜у搧鍚嶇О",
@@ -182,6 +327,13 @@
     {
       label: "瀹屾垚鏁伴噺",
       prop: "completeQuantity",
+    },
+    {
+      label: "宸ュ簭鐢熶骇杩涘害",
+      prop: "processRouteStatus",
+      dataType: "slot",
+      slot: "processRouteStatus",
+      width: processColumnWidth.value,
     },
     {
       dataType: "slot",
@@ -213,11 +365,12 @@
       label: "鎿嶄綔",
       align: "center",
       fixed: "right",
-      width: 340,
+      width: 280,
       operation: [
         {
           name: "宸ヨ壓璺嚎",
           type: "text",
+          showHide: row => row.processRouteCode,
           clickFun: row => {
             showRouteItemModal(row);
           },
@@ -225,30 +378,83 @@
         {
           name: "缁戝畾宸ヨ壓璺嚎",
           type: "text",
-          showHide: row => !row.processRouteCode,
+          showHide: row => !row.processRouteCode && !row.endOrder,
           clickFun: row => {
-            openBindRouteDialog(row);
+            openBindRouteDialog(row, "add");
           },
         },
-        // {
-        //   name: "浜у搧缁撴瀯",
-        //   type: "text",
-        //   clickFun: row => {
-        //     showProductStructure(row);
-        //   },
-        // },
+        {
+          name: "鏇存崲宸ヨ壓璺嚎",
+          type: "text",
+          showHide: row => row.processRouteCode && !row.endOrder,
+          clickFun: row => {
+            openBindRouteDialog(row, "change");
+          },
+        },
+        {
+          name: "鏉ユ簮",
+          type: "text",
+          clickFun: row => {
+            showSourceData(row);
+          },
+        },
         {
           name: "棰嗘枡",
           type: "text",
+          color: "#5EC7AB",
+          showHide: row => !row.endOrder && !row.returned,
           clickFun: row => {
             openMaterialDialog(row);
           },
         },
         {
+          name: "琛ユ枡",
+          type: "text",
+          color: "#5EC7AB",
+          showHide: row => !row.endOrder && !row.returned,
+          clickFun: row => {
+            openMaterialSupplementDialog(row);
+          },
+        },
+        {
           name: "棰嗘枡璇︽儏",
           type: "text",
+          color: "#5EC7AB",
           clickFun: row => {
             openMaterialDetailDialog(row);
+          },
+        },
+        {
+          name: "鎵撳嵃棰嗘枡鍗�",
+          type: "text",
+          color: "#5EC7AB",
+          showHide: row => !row.endOrder,
+          clickFun: row => {
+            handlePrint(row);
+          },
+        },
+        {
+          name: "鐢熶骇杩芥函",
+          type: "text",
+          color: "#409eff",
+          clickFun: row => {
+            router.push({
+              path: "/productionManagement/productionTraceability",
+              query: {
+                npsNo: row.npsNo,
+                productName: row.productName,
+                model: row.model,
+              },
+            });
+          },
+        },
+        {
+          name: "缁撴潫璁㈠崟",
+          type: "text",
+          color: "red",
+          showHide: row => !row.endOrder,
+          clickFun: row => {
+            handleEndOrder(row);
           },
         },
       ],
@@ -271,6 +477,7 @@
       projectName: "",
       productName: "",
       model: "",
+      status: "",
     },
   });
   const { searchForm } = toRefs(data);
@@ -322,10 +529,48 @@
   const currentMaterialOrder = ref(null);
   const materialDetailDialogVisible = ref(false);
   const currentMaterialDetailOrder = ref(null);
+  const materialSupplementDialogVisible = ref(false);
+  const currentMaterialSupplementOrder = ref(null);
 
-  const openBindRouteDialog = async row => {
+  // 鎵撳嵃鐩稿叧
+  const printOrderRow = ref(null);
+  const printMaterialList = ref([]);
+  const handlePrint = async row => {
+    printOrderRow.value = row;
+    proxy.$modal.loading("姝e湪鑾峰彇棰嗘枡鏁版嵁...");
+    try {
+      printMaterialList.value = [];
+      const detailRes = await listMaterialPickingDetail(row.id);
+      const detailList = Array.isArray(detailRes?.data)
+        ? detailRes.data
+        : detailRes?.data?.records || [];
+
+      if (detailList.length > 0) {
+        printMaterialList.value = detailList;
+      }
+
+      if (printMaterialList.value.length === 0) {
+        proxy.$modal.msgWarning("鏆傛棤棰嗘枡鏁版嵁");
+        return;
+      }
+
+      // 绛夊緟 DOM 鏇存柊鍚庢墽琛屾墦鍗�
+      proxy.$nextTick(() => {
+        setTimeout(() => {
+          window.print();
+        }, 800);
+      });
+    } catch (e) {
+      console.error("鑾峰彇棰嗘枡鏁版嵁澶辫触锛�", e);
+      proxy.$modal.msgError("鑾峰彇棰嗘枡鏁版嵁澶辫触");
+    } finally {
+      proxy.$modal.closeLoading();
+    }
+  };
+
+  const openBindRouteDialog = async (row, type) => {
     bindForm.orderId = row.id;
-    bindForm.routeId = null;
+    bindForm.routeId = type === "add" ? null : row.technologyRoutingId;
     bindRouteDialogVisible.value = true;
     routeOptions.value = [];
     if (!row.productModelId) {
@@ -354,7 +599,7 @@
     try {
       await bindingRoute({
         id: bindForm.orderId,
-        routeId: bindForm.routeId,
+        technologyRoutingId: bindForm.routeId,
       });
       proxy.$modal.msgSuccess("缁戝畾鎴愬姛");
       bindRouteDialogVisible.value = false;
@@ -375,6 +620,25 @@
   const openMaterialDetailDialog = async row => {
     currentMaterialDetailOrder.value = row;
     materialDetailDialogVisible.value = true;
+  };
+
+  const openMaterialSupplementDialog = row => {
+    currentMaterialSupplementOrder.value = row;
+    materialSupplementDialogVisible.value = true;
+  };
+
+  const handleReset = () => {
+    searchForm.value = {
+      ...searchForm.value,
+      npsNo: "",
+      customerName: "",
+      salesContractNo: "",
+      projectName: "",
+      productName: "",
+      model: "",
+      status: "",
+    };
+    handleQuery();
   };
 
   // 鏌ヨ鍒楄〃
@@ -404,10 +668,35 @@
     const params = { ...searchForm.value, ...page };
     params.entryDate = undefined;
     productOrderListPage(params)
-      .then(res => {
-        tableLoading.value = false;
-        tableData.value = res.data.records;
+      .then(async res => {
+        const records = res.data.records || [];
+        // 涓烘瘡涓鍗曟煡璇㈠搴旂殑宸ュ簭杩涘害鏁版嵁
+        const processPromises = records.map(async item => {
+          if (item.npsNo) {
+            try {
+              const workOrderRes = await productWorkOrderPage({
+                npsNo: item.npsNo,
+                size: 100,
+              });
+              const workOrders = workOrderRes.data.records || [];
+              // 鎸夌収宸ュ簭椤哄簭鎺掑簭锛堝鏋滄湁椤哄簭瀛楁锛屽亣璁句负 orderNum 鎴栨寜杩斿洖椤哄簭锛�
+              // 杞崲涓� processRouteStatus 鏍煎紡
+              const processRouteStatus = workOrders.map(wo => ({
+                name: wo.operationName || "鏈煡宸ュ簭",
+                percentage: wo.completionStatus > 100 ? 100 : wo.completionStatus,
+              }));
+              return { ...item, processRouteStatus };
+            } catch (error) {
+              console.error(`鑾峰彇宸ュ崟 ${item.npsNo} 杩涘害澶辫触:`, error);
+              return { ...item, processRouteStatus: [] };
+            }
+          }
+          return { ...item, processRouteStatus: [] };
+        });
+
+        tableData.value = await Promise.all(processPromises);
         page.total = res.data.total;
+        tableLoading.value = false;
       })
       .catch(() => {
         tableLoading.value = false;
@@ -427,14 +716,16 @@
         path: "/productionManagement/processRouteItem",
         query: {
           id: data.id,
-          bomId: data.bomId,
+          bomId: data.orderBomId,
           processRouteCode: data.processRouteCode || "",
           productName: row.productName || "",
           model: row.model || "",
           bomNo: row.bomNo || "",
           description: data.description || "",
+          quantity: row.quantity || 0,
           orderId,
           type: "order",
+          editable: !row.endOrder,
         },
       });
     } catch (e) {
@@ -457,6 +748,29 @@
     });
   };
 
+  // 鏌ョ湅鏉ユ簮鐢熶骇璁″垝鏁版嵁
+  const showSourceData = row => {
+    // 瀛樺偍鐐瑰嚮鏉ユ簮鎸夐挳鏃朵紶閫掔殑row鍙傛暟
+    sourceRowData.value = row;
+    // 璋冪敤API鑾峰彇鏉ユ簮鏁版嵁
+    getProductOrderSource(row.id)
+      .then(res => {
+        if (res.code === 200) {
+          // 鐩存帴瀛樺偍杩斿洖鐨勬墎骞冲寲鏁版嵁
+          sourceTableData.value = res.data || [];
+          sourcePage.total = sourceTableData.value.length;
+          // 鎵撳紑寮圭獥
+          sourceDataDialogVisible.value = true;
+        } else {
+          proxy.$modal.msgError(res.msg || "鑾峰彇鏉ユ簮鏁版嵁澶辫触");
+        }
+      })
+      .catch(err => {
+        proxy.$modal.msgError("鑾峰彇鏉ユ簮鏁版嵁澶辫触");
+        console.error(err);
+      });
+  };
+
   // 琛ㄦ牸閫夋嫨鏁版嵁
   const handleSelectionChange = selection => {
     selectedRows.value = selection;
@@ -470,14 +784,15 @@
       proxy.$modal.msgWarning("璇烽�夋嫨鏁版嵁");
       return;
     }
-    ElMessageBox.confirm("閫変腑鐨勫唴瀹瑰皢琚垹闄わ紝鏄惁纭鍒犻櫎锛�", "瀵煎嚭", {
+    ElMessageBox.confirm("鏄惁閫�鍥炶鐢熶骇璁㈠崟锛�", "閫�鍥�", {
       confirmButtonText: "纭",
       cancelButtonText: "鍙栨秷",
       type: "warning",
     })
       .then(() => {
+        console.log(ids, "ids");
         delProductOrder(ids).then(res => {
-          proxy.$modal.msgSuccess("鍒犻櫎鎴愬姛");
+          proxy.$modal.msgSuccess("閫�鍥炴垚鍔�");
           getList();
         });
       })
@@ -495,14 +810,34 @@
     })
       .then(() => {
         proxy.download(
-          "/productOrder/export",
+          "/productionOrder/export",
           { ...searchForm.value },
-          "鐢熶骇璁㈠崟.xlsx"
+          "鐢熶骇璁㈠崟鏁版嵁.xlsx"
         );
       })
       .catch(() => {
         proxy.$modal.msg("宸插彇娑�");
       });
+  };
+
+  // 缁撴潫璁㈠崟
+  const handleEndOrder = row => {
+    ElMessageBox.confirm(`鏄惁纭缁撴潫璁㈠崟锛�${row.npsNo}锛焋, "鎻愮ず", {
+      confirmButtonText: "纭畾",
+      cancelButtonText: "鍙栨秷",
+      type: "warning",
+    })
+      .then(() => {
+        const params = {
+          id: row.id,
+          endOrder: true,
+        };
+        updateProductOrder(params).then(() => {
+          proxy.$modal.msgSuccess("缁撴潫璁㈠崟鎴愬姛");
+          getList();
+        });
+      })
+      .catch(() => {});
   };
 
   const handleConfirmRoute = () => {};
@@ -541,4 +876,149 @@
   .table_list {
     margin-top: unset;
   }
+
+  .process-progress-container {
+    display: inline-flex;
+    align-items: center;
+    padding: 10px 0;
+    white-space: nowrap;
+
+    .process-step {
+      display: flex;
+      align-items: center;
+      position: relative;
+
+      .step-content {
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        z-index: 1;
+
+        .step-circle {
+          width: 36px;
+          height: 36px;
+          border-radius: 50%;
+          border: 2px solid #409eff;
+          display: flex;
+          align-items: center;
+          justify-content: center;
+          background-color: #fff;
+          margin-bottom: 4px;
+
+          .step-percentage {
+            font-size: 11px;
+            font-weight: bold;
+          }
+
+          &.is-completed {
+            border-color: #67c23a;
+            .step-percentage {
+              color: #67c23a;
+            }
+          }
+        }
+
+        .step-name {
+          font-size: 12px;
+          color: #606266;
+          white-space: nowrap;
+        }
+      }
+
+      .step-line {
+        width: 30px;
+        height: 1px;
+        background-color: #dcdfe6;
+        margin: 0 -2px;
+        margin-top: -20px; // 鍚戜笂鍋忕Щ浠ュ榻愬渾蹇�
+      }
+    }
+  }
+</style>
+<style lang="scss">
+  .status-cell {
+    font-weight: 600;
+    color: #409eff;
+    font-family: "Courier New", monospace;
+    text-shadow: 0 1px 2px rgba(64, 158, 255, 0.2);
+  }
+
+  .source-table-container {
+    margin-top: 20px;
+  }
+
+  .source-data-cards-container {
+    display: flex;
+    flex-direction: column;
+    gap: 16px;
+    max-height: 500px;
+    overflow-y: auto;
+    padding: 10px;
+    background-color: #f5f7fa;
+    border-radius: 4px;
+    padding-bottom: 20px;
+
+    .source-data-card {
+      background: #fff;
+      border-radius: 8px;
+      box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
+      overflow: hidden;
+
+      .card-body {
+        padding: 20px;
+
+        .info-grid {
+          display: grid;
+          grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
+          gap: 16px;
+
+          .info-item {
+            display: flex;
+            flex-direction: column;
+
+            .info-label {
+              font-size: 12px;
+              color: #909399;
+              margin-bottom: 4px;
+              font-weight: 500;
+            }
+
+            .info-value {
+              font-size: 14px;
+              color: #303133;
+              font-weight: 500;
+            }
+          }
+        }
+      }
+    }
+  }
+
+  .applyno-summary1 {
+    padding: 16px 20px;
+    background: #f5f7fa;
+    border-bottom: 1px solid #e4e7ed;
+    display: flex;
+    flex-wrap: wrap;
+    gap: 16px;
+
+    .summary-item {
+      display: flex;
+      align-items: center;
+      margin-right: 20px;
+
+      .summary-label {
+        font-size: 13px;
+        color: #909399;
+        margin-right: 8px;
+        font-weight: 500;
+      }
+
+      .summary-value {
+        font-size: 14px;
+        color: #303133;
+        font-weight: 500;
+      }
+    }
+  }
 </style>

--
Gitblit v1.9.3