From 8a709ba6db50831048f9c3e2452ea6dc6c3de36f Mon Sep 17 00:00:00 2001
From: Bang Hu <hu_bang@hotmail.com>
Date: 星期五, 12 九月 2025 15:45:33 +0800
Subject: [PATCH] bug修改代码提交

---
 src/views/approveManage/tradeApproval/list.vue |  157 ++++++++++++++++-
 src/views/tradeManage/detail/index.vue         |  326 +++++++++++++++++++++++++++--------
 2 files changed, 398 insertions(+), 85 deletions(-)

diff --git a/src/views/approveManage/tradeApproval/list.vue b/src/views/approveManage/tradeApproval/list.vue
index 389e960..fcb656c 100644
--- a/src/views/approveManage/tradeApproval/list.vue
+++ b/src/views/approveManage/tradeApproval/list.vue
@@ -91,7 +91,7 @@
                 @click="btnClick('0','trade_point')"
             >
               <span class="numjx">绉垎寰呭姙</span>
-<!--              <span>{{ workFlowStatus.tradePointDealData }}</span>-->
+              <span class="count-num">({{ workFlowStatus.tradePointDealData }})</span>
             </div>
             <div
                 class="btnDiv"
@@ -99,7 +99,7 @@
                 @click="btnClick('1','trade_point')"
             >
               <span class="numjx">绉垎宸插姙</span>
-<!--              <span>{{ workFlowStatus.completedData }}</span>-->
+              <span class="count-num">({{ workFlowStatus.tradePointCompletedData }})</span>
             </div>
             <div
                 class="btnDiv"
@@ -107,7 +107,7 @@
                 @click="btnClick('0','trade_agreement')"
             >
               <span class="numjx">鍗忚寰呭姙</span>
-<!--              <span>{{ workFlowStatus.dealwithData }}</span>-->
+              <span class="count-num">({{ workFlowStatus.tradeAgreementDealData }})</span>
             </div>
             <div
                 class="btnDiv"
@@ -115,7 +115,7 @@
                 @click="btnClick('1','trade_agreement')"
             >
               <span class="numjx">鍗忚宸插姙</span>
-<!--              <span>{{ workFlowStatus.completedData }}</span>-->
+              <span class="count-num">({{ workFlowStatus.tradeAgreementCompletedData }})</span>
             </div>
           </div>
         </el-col>
@@ -344,7 +344,6 @@
   { label: '鍏ㄩ儴', value: '' },
   { label: '寰呬笂浼犳枃浠�', value: 'WAIT_UPLOAD' },
   { label: '寰呮巿鏉�', value: 'WAIT_AUTHORIZE' },
-  { label: '寰呭鎵规巿鏉�', value: 'WAIT_APPROVAL_AUTHORIZE' },
   { label: '寰呬氦鏄撶‘璁�', value: 'WAIT_CONFIRM' },
   { label: '宸插畬鎴�', value: 'COMPLETED' },
   { label: '宸茶瘎浠�', value: 'EVALUATED' },
@@ -382,7 +381,12 @@
 const workFlowStatus = reactive<any>({
   btnClassShow: 'trade_point0',
   workFlowType: 0,
-  businessType: 'trade_point' // trade_point
+  businessType: 'trade_point', // trade_point
+  // 璁㈠崟鏁伴噺缁熻
+  tradePointDealData: 1,    // 绉垎寰呭姙鏁伴噺 - 涓存椂娴嬭瘯鏁版嵁
+  tradePointCompletedData: 0, // 绉垎宸插姙鏁伴噺
+  tradeAgreementDealData: 2,  // 鍗忚寰呭姙鏁伴噺 - 涓存椂娴嬭瘯鏁版嵁
+  tradeAgreementCompletedData: 0 // 鍗忚宸插姙鏁伴噺
 })
 
 // 浣跨敤宸ヤ綔娴佺▼鎺у埗鍣ㄧ殑鐘舵�佹槧灏�
@@ -400,7 +404,7 @@
   [OrderStatus.WAIT_CONFIRM]: 'WAIT_CONFIRM',
   [OrderStatus.COMPLETED]: 'COMPLETED',
   [OrderStatus.EVALUATED]: 'EVALUATED',
-  [OrderStatus.WAIT_APPROVAL_AUTHORIZE]: 'WAIT_APPROVAL_AUTHORIZE'
+  [OrderStatus.CANCELED]: 'CANCELED'
 }
 
 const formatDateTime = (val?: string) => {
@@ -553,10 +557,10 @@
   const statusMap: Record<string, 'warning' | 'danger' | 'success' | 'info'> = {
     WAIT_UPLOAD: 'warning',
     WAIT_AUTHORIZE: 'warning',
-    WAIT_APPROVAL_AUTHORIZE: 'warning',
     WAIT_CONFIRM: 'warning',
     COMPLETED: 'success',
     EVALUATED: 'success',
+    CANCELED: 'danger'
   }
   return statusMap[status] || 'info'
 }
@@ -640,6 +644,116 @@
   }
 }
 
+// 鏍规嵁褰撳墠閫変腑鐨勬寜閽被鍨嬫洿鏂板搴旂殑鏁伴噺
+const updateButtonCount = (total: number) => {
+  const { workFlowType, businessType } = workFlowStatus
+  
+  console.log('updateButtonCount 琚皟鐢�:', {
+    total: total,
+    workFlowType: workFlowType,
+    businessType: businessType,
+    currentButton: `${businessType}${workFlowType}`
+  })
+  
+  if (businessType === 'trade_point') {
+    if (workFlowType == 0) { // 浣跨敤 == 鑰屼笉鏄� === 鏉ュ鐞嗗瓧绗︿覆鍜屾暟瀛楃殑姣旇緝
+      // 绉垎寰呭姙
+      workFlowStatus.tradePointDealData = total
+      console.log('鏇存柊绉垎寰呭姙鏁伴噺涓�:', total)
+    } else if (workFlowType == 1) { // 浣跨敤 == 鑰屼笉鏄� === 鏉ュ鐞嗗瓧绗︿覆鍜屾暟瀛楃殑姣旇緝
+      // 绉垎宸插姙
+      workFlowStatus.tradePointCompletedData = total
+      console.log('鏇存柊绉垎宸插姙鏁伴噺涓�:', total)
+    }
+  } else if (businessType === 'trade_agreement') {
+    if (workFlowType == 0) { // 浣跨敤 == 鑰屼笉鏄� === 鏉ュ鐞嗗瓧绗︿覆鍜屾暟瀛楃殑姣旇緝
+      // 鍗忚寰呭姙
+      workFlowStatus.tradeAgreementDealData = total
+      console.log('鏇存柊鍗忚寰呭姙鏁伴噺涓�:', total)
+    } else if (workFlowType == 1) { // 浣跨敤 == 鑰屼笉鏄� === 鏉ュ鐞嗗瓧绗︿覆鍜屾暟瀛楃殑姣旇緝
+      // 鍗忚宸插姙
+      workFlowStatus.tradeAgreementCompletedData = total
+      console.log('鏇存柊鍗忚宸插姙鏁伴噺涓�:', total)
+    }
+  }
+  
+  console.log('鏇存柊鍚庣殑鎸夐挳鏁伴噺:', {
+    tradePointDealData: workFlowStatus.tradePointDealData,
+    tradePointCompletedData: workFlowStatus.tradePointCompletedData,
+    tradeAgreementDealData: workFlowStatus.tradeAgreementDealData,
+    tradeAgreementCompletedData: workFlowStatus.tradeAgreementCompletedData
+  })
+}
+
+// 鑾峰彇璁㈠崟缁熻鏁版嵁锛堢敤浜庡垵濮嬪寲鍜屾潯浠舵煡璇㈠悗鏇存柊锛�
+const getOrderCounts = async () => {
+  try {
+    // 鑾峰彇缁熻鏁版嵁鏃朵娇鐢ㄥ綋鍓嶇殑鎼滅储鏉′欢锛屼絾涓嶅寘鎷姸鎬佺瓫閫�
+    const getCountForType = async (workFlowType: number, businessType: string) => {
+      const payload: any = {
+        pageNum: 1,
+        pageSize: 10, // 涓巋andleSearch淇濇寔涓�鑷�
+        userId: userStore.getUserId,
+        unitId: userStore.getUnitId,
+        workFlowType: workFlowType,
+        businessType: businessType,
+        departmentId: userStore.getDepartmentId
+      }
+      
+      // 娣诲姞浜у搧鏉′欢鏌ヨ锛堜笌handleSearch瀹屽叏淇濇寔涓�鑷达級
+      if (query.industry) payload.industryId = query.industry
+      if (query.unitProject.length > 0) payload.unitProjectId = query.unitProject
+      if (query.importantDistrictIdList.length > 0) payload.importantDistrictId = query.importantDistrictIdList
+      if (query.productType) payload.productTypeId = query.productType
+      if (query.productSubType) payload.productSubTypeId = query.productSubType
+      if (query.productName) payload.productName = query.productName
+      if (query.orderNo) payload.orderId = query.orderNo
+      // 鍖呭惈鐘舵�佺瓫閫夋潯浠讹紝纭繚缁熻鏁版嵁鍙嶆槧褰撳墠鐨勭瓫閫夋潯浠�
+      if (query.status) payload.orderStatus = statusUiToServer[query.status]
+      if (Array.isArray(query.dateRange) && query.dateRange.length === 2) {
+        payload.applyTimeStart = query.dateRange[0]
+        payload.applyTimeEnd = query.dateRange[1]
+      }
+
+      // 鏍规嵁鏄惁鏈変骇鍝佹潯浠堕�夋嫨涓嶅悓鐨凙PI锛堜笌handleSearch淇濇寔涓�鑷达級
+      const hasProductConditions = query.industry || query.unitProject.length > 0 || query.productType || query.productSubType
+      const apiMethod = hasProductConditions ? fetchApprovalPageWithProductConditions : fetchApprovalPage
+      
+      console.log(`缁熻鏁版嵁-${businessType}${workFlowType}鏌ヨ鍙傛暟:`, payload)
+      const res = await apiMethod(payload) as any
+      console.log(`缁熻鏁版嵁-${businessType}${workFlowType}API鍝嶅簲:`, res)
+      return res?.data?.total || 0
+    }
+
+    // 骞惰鑾峰彇鎵�鏈夌粺璁℃暟鎹�
+    const [pointDealCount, pointCompletedCount, agreementDealCount, agreementCompletedCount] = await Promise.all([
+      getCountForType(0, 'trade_point'),    // 绉垎寰呭姙
+      getCountForType(1, 'trade_point'),    // 绉垎宸插姙
+      getCountForType(0, 'trade_agreement'), // 鍗忚寰呭姙
+      getCountForType(1, 'trade_agreement')  // 鍗忚宸插姙
+    ])
+
+    workFlowStatus.tradePointDealData = pointDealCount
+    workFlowStatus.tradePointCompletedData = pointCompletedCount
+    workFlowStatus.tradeAgreementDealData = agreementDealCount
+    workFlowStatus.tradeAgreementCompletedData = agreementCompletedCount
+
+    console.log('鏇存柊鍚庣殑缁熻鏁版嵁:', {
+      tradePointDealData: workFlowStatus.tradePointDealData,
+      tradePointCompletedData: workFlowStatus.tradePointCompletedData,
+      tradeAgreementDealData: workFlowStatus.tradeAgreementDealData,
+      tradeAgreementCompletedData: workFlowStatus.tradeAgreementCompletedData
+    })
+  } catch (error) {
+    console.error('鑾峰彇缁熻鏁版嵁澶辫触:', error)
+    // 濡傛灉鑾峰彇澶辫触锛屼娇鐢ㄩ粯璁ゅ��
+    workFlowStatus.tradePointDealData = 0
+    workFlowStatus.tradePointCompletedData = 0
+    workFlowStatus.tradeAgreementDealData = 0
+    workFlowStatus.tradeAgreementCompletedData = 0
+  }
+}
+
 // 鎼滅储澶勭悊锛堟帴鍏ョ湡瀹炲悗绔級
 const handleSearch = async () => {
   const payload: any = {
@@ -674,6 +788,12 @@
   const pageData = res?.data
   const list: any[] = Array.isArray(pageData?.list) ? pageData.list : []
   page.total = Number(pageData?.total || 0)
+  
+  console.log('鎼滅储鍙傛暟:', payload)
+  console.log('API鍝嶅簲:', res)
+  console.log('鍒楄〃鏁版嵁:', list)
+  console.log('鎬昏褰曟暟:', page.total)
+  console.log('褰撳墠椤佃褰曟暟:', list.length)
 
 
   const flatData: any[] = []
@@ -719,11 +839,14 @@
   })
 
   orderList.value = flatData
+  
+  // 鏉′欢鏌ヨ鍚庯紝閲嶆柊鑾峰彇鎵�鏈�4绉嶇被鍨嬬殑璁㈠崟鎬绘暟骞舵洿鏂版寜閽樉绀�
+  await getOrderCounts()
 }
 
 const btnClick = (workFlowType?: any,businessType?: any) => {
   workFlowStatus.btnClassShow = businessType+workFlowType
-  workFlowStatus.workFlowType = workFlowType
+  workFlowStatus.workFlowType = Number(workFlowType) // 纭繚杞崲涓烘暟瀛楃被鍨�
   workFlowStatus.businessType = businessType
 
   // 鑾峰彇list鏁版嵁
@@ -819,6 +942,9 @@
     getIndustryOptions(),
     getProductTypeOptions()
   ])
+  
+  // 鑾峰彇鍒濆缁熻鏁版嵁
+  await getOrderCounts()
   
   // 鎵ц鎼滅储
   handleSearch()
@@ -1232,6 +1358,10 @@
   .btnDivClass {
     background-color: #2f4589 !important;
     color: #fff;
+    
+    .count-num {
+      color: #fff !important;
+    }
   }
 
   .btnDiv {
@@ -1248,6 +1378,15 @@
     cursor: pointer;
     background-color: #FFFFFF;
 
+    .numjx {
+      padding-right: 5px;
+    }
+
+    .count-num {
+      color: #f04844;
+      font-weight: 500;
+    }
+
     span :nth-child(2) {
       color: #f04844;
     }
diff --git a/src/views/tradeManage/detail/index.vue b/src/views/tradeManage/detail/index.vue
index c5eb9b5..9e0589f 100644
--- a/src/views/tradeManage/detail/index.vue
+++ b/src/views/tradeManage/detail/index.vue
@@ -2,84 +2,103 @@
   <div class="default-main">
     <!-- 璁㈠崟淇℃伅 + 鐢宠浜轰俊鎭� + 浜ゆ槗鍐呭锛堝悎骞朵负鍚屼竴鍗＄墖锛� -->
     <el-card shadow="never">
-      <el-descriptions
-        :column="2"
-        border
-        class="mt10 order-desc fixed-label"
-        label-width="180px"
-        :label-style="labelStyle"
-        :content-style="contentStyle"
-      >
-        <el-descriptions-item :span="2" class="section-header">
-          <template #label>
-            <el-icon class="section-icon"><Document /></el-icon>
-            <span>璁㈠崟淇℃伅</span>
-          </template>
-          <template #default></template>
-        </el-descriptions-item>
-        <el-descriptions-item label="璁㈠崟缂栧彿">{{ detail.orderNo }}</el-descriptions-item>
-        <el-descriptions-item label="浜ゆ槗璧勬簮绫诲瀷">{{ detail.resourceTypeName }}</el-descriptions-item>
-        <el-descriptions-item label="鐢宠鏃堕棿">{{ detail.applyTime }}</el-descriptions-item>
-        <el-descriptions-item label="浜ゆ槗鐘舵��">
-          <el-tag :type="getStatusType(detail.status)" size="small">{{ detail.statusName }}</el-tag>
-        </el-descriptions-item>
-      </el-descriptions>
+      <!-- 璁㈠崟淇℃伅 - 浣跨敤鑷畾涔夎〃鏍煎竷灞� -->
+      <div class="order-info-section">
+        <div class="section-header">
+          <el-icon class="section-icon"><Document /></el-icon>
+          <span>璁㈠崟淇℃伅</span>
+        </div>
+        <div class="order-info-grid">
+          <div class="order-info-item">
+            <div class="order-label">璁㈠崟缂栧彿</div>
+            <div class="order-content">{{ detail.orderNo }}</div>
+          </div>
+          <div class="order-info-item">
+            <div class="order-label">浜ゆ槗璧勬簮绫诲瀷</div>
+            <div class="order-content">{{ detail.resourceTypeName }}</div>
+          </div>
+          <div class="order-info-item">
+            <div class="order-label">鐢宠鏃堕棿</div>
+            <div class="order-content">{{ detail.applyTime }}</div>
+          </div>
+          <div class="order-info-item">
+            <div class="order-label">浜ゆ槗鐘舵��</div>
+            <div class="order-content">
+              <el-tag :type="getStatusType(detail.status)" size="small">{{ detail.statusName }}</el-tag>
+            </div>
+          </div>
+        </div>
+      </div>
 
-      <!-- 鐢宠浜轰俊鎭紙涓庤鍗曚俊鎭悓鍗＄墖锛屽鐢ㄥ垎闅旀爣棰樻牱寮忥級 -->
-      <el-descriptions
-        :column="2"
-        border
-        class="mt15 order-desc fixed-label"
-        label-width="180px"
-        :label-style="labelStyle"
-        :content-style="contentStyle"
-      >
-        <el-descriptions-item :span="2" class="section-header">
-          <template #label>
-            <el-icon class="section-icon"><User /></el-icon>
-            <span>鐢宠浜轰俊鎭�</span>
-          </template>
-          <template #default></template>
-        </el-descriptions-item>
-        <el-descriptions-item label="濮撳悕">{{ detail.userName || '-' }}</el-descriptions-item>
-        <el-descriptions-item label="鍗曚綅">{{ detail.unitName || '-' }}</el-descriptions-item>
-        <el-descriptions-item label="閮ㄩ棬">{{ detail.userDept || '-' }}</el-descriptions-item>
-        <el-descriptions-item label="鐢ㄦ埛鍚�">{{ detail.userAccount || '-' }}</el-descriptions-item>
-      </el-descriptions>
+      <!-- 鐢宠浜轰俊鎭� - 浣跨敤鑷畾涔夎〃鏍煎竷灞� -->
+      <div class="applicant-info-section">
+        <div class="section-header">
+          <el-icon class="section-icon"><User /></el-icon>
+          <span>鐢宠浜轰俊鎭�</span>
+        </div>
+        <div class="applicant-info-grid">
+          <div class="applicant-info-item">
+            <div class="applicant-label">濮撳悕</div>
+            <div class="applicant-content">{{ detail.userName || '-' }}</div>
+          </div>
+          <div class="applicant-info-item">
+            <div class="applicant-label">鍗曚綅</div>
+            <div class="applicant-content">{{ detail.unitName || '-' }}</div>
+          </div>
+          <div class="applicant-info-item">
+            <div class="applicant-label">閮ㄩ棬</div>
+            <div class="applicant-content">{{ detail.userDept || '-' }}</div>
+          </div>
+          <div class="applicant-info-item">
+            <div class="applicant-label">鐢ㄦ埛鍚�</div>
+            <div class="applicant-content">{{ detail.userAccount || '-' }}</div>
+          </div>
+        </div>
+      </div>
 
-      <!-- 浜ゆ槗鍐呭锛堢揣闅忕敵璇蜂汉淇℃伅锛屽悓鍗＄墖锛屽鐢ㄥ垎闅旀爣棰樻牱寮忥級 -->
-      <el-descriptions
-        :column="2"
-        border
-        class="mt15 order-desc fixed-label"
-        label-width="180px"
-        :label-style="labelStyle"
-        :content-style="contentStyle"
-      >
-        <el-descriptions-item :span="2" class="section-header">
-          <template #label>
-            <el-icon class="section-icon"><Goods /></el-icon>
-            <span>浜ゆ槗鍐呭</span>
-          </template>
-          <template #default></template>
-        </el-descriptions-item>
-        <el-descriptions-item label="浜у搧鍚嶇О">
-          <el-link type="primary" :underline="false">{{ detail.productName }}</el-link>
-        </el-descriptions-item>
-        <el-descriptions-item label="鎻愪緵鑰�">{{ detail.supplier }}</el-descriptions-item>
-        <el-descriptions-item label="琛屼笟棰嗗煙">{{ detail.industry }}</el-descriptions-item>
-        <el-descriptions-item label="鍗曚綅宸ョ▼">
-          <el-tooltip effect="dark" :content="detail.projectUnit || '-'" placement="top" :disabled="!(detail.projectUnit && String(detail.projectUnit).trim())" popper-class="tooltip-wrap">
-            <div class="ellipsis-1">{{ detail.projectUnit || '-' }}</div>
-          </el-tooltip>
-        </el-descriptions-item>
-        <el-descriptions-item label="浜у搧绫诲瀷">{{ detail.productType || '-' }}</el-descriptions-item>
-        <el-descriptions-item label="浜у搧绠�浠�">
-          <el-tooltip effect="dark" :content="detail.productDesc || '-'" placement="top" :disabled="!(detail.productDesc && String(detail.productDesc).trim())" popper-class="tooltip-wrap" trigger="click">
-            <div class="desc-wrap ellipsis-3">{{ detail.productDesc || '-' }}</div>
-          </el-tooltip>
-        </el-descriptions-item>
-      </el-descriptions>
+      <!-- 浜ゆ槗鍐呭 - 浣跨敤鑷畾涔夎〃鏍煎竷灞� -->
+      <div class="transaction-content-section">
+        <div class="section-header">
+          <el-icon class="section-icon"><Goods /></el-icon>
+          <span>浜ゆ槗鍐呭</span>
+        </div>
+        <div class="transaction-content-grid">
+          <div class="transaction-content-item">
+            <div class="transaction-label">浜у搧鍚嶇О</div>
+            <div class="transaction-content">
+              <el-link type="primary" :underline="false">{{ detail.productName }}</el-link>
+            </div>
+          </div>
+          <div class="transaction-content-item">
+            <div class="transaction-label">鎻愪緵鑰�</div>
+            <div class="transaction-content">{{ detail.supplier }}</div>
+          </div>
+          <div class="transaction-content-item">
+            <div class="transaction-label">琛屼笟棰嗗煙</div>
+            <div class="transaction-content">{{ detail.industry }}</div>
+          </div>
+          <div class="transaction-content-item">
+            <div class="transaction-label">鍗曚綅宸ョ▼</div>
+            <div class="transaction-content">
+              <el-tooltip effect="dark" :content="detail.projectUnit || '-'" placement="top" :disabled="!(detail.projectUnit && String(detail.projectUnit).trim())" popper-class="tooltip-wrap">
+                <div class="ellipsis-1">{{ detail.projectUnit || '-' }}</div>
+              </el-tooltip>
+            </div>
+          </div>
+          <div class="transaction-content-item">
+            <div class="transaction-label">浜у搧绫诲瀷</div>
+            <div class="transaction-content">{{ detail.productType || '-' }}</div>
+          </div>
+          <div class="transaction-content-item">
+            <div class="transaction-label">浜у搧绠�浠�</div>
+            <div class="transaction-content">
+              <el-tooltip effect="dark" :content="detail.productDesc || '-'" placement="top" :disabled="!(detail.productDesc && String(detail.productDesc).trim())" popper-class="tooltip-wrap" trigger="click">
+                <div class="desc-wrap ellipsis-3">{{ detail.productDesc || '-' }}</div>
+              </el-tooltip>
+            </div>
+          </div>
+        </div>
+      </div>
 
       <!-- 璁㈠崟璇︽儏锛堢Щ鍔ㄥ埌浜ゆ槗鍐呭涓嬮潰锛屽悓涓�鍗＄墖鍐咃級 -->
       <div ref="orderTableWrapRef">
@@ -382,6 +401,7 @@
 })
 const labelStyle = { width: '180px', maxWidth: '180px' }
 const contentStyle = { width: 'calc(50% - 180px)' }
+
 
 // 鏂囦欢鐩稿叧
 const fileList = ref<any[]>([])
@@ -1086,6 +1106,160 @@
   width: calc(50% - 180px) !important;
 }
 
+/* 璁㈠崟淇℃伅鑷畾涔夊竷灞�鏍峰紡 */
+.order-info-section {
+  border: 1px solid #e4e7ed;
+  border-radius: 4px;
+  margin-top: 10px;
+  overflow: hidden;
+}
+
+.order-info-section .section-header {
+  background: #f3f6fb;
+  padding: 12px 16px;
+  border-bottom: 1px solid #e4e7ed;
+  font-weight: 600;
+  display: flex;
+  align-items: center;
+}
+
+.order-info-section .section-icon {
+  margin-right: 6px;
+  color: #409eff;
+}
+
+.order-info-grid {
+  display: grid;
+  grid-template-columns: 15% 30% 15% 40%;
+  width: 100%;
+}
+
+.order-info-item {
+  display: contents;
+}
+
+.order-info-item .order-label {
+  padding: 12px 16px;
+  background: #fafafa;
+  border: 1px solid #e4e7ed;
+  font-size: 14px;
+  color: #606266;
+  display: flex;
+  align-items: center;
+}
+
+.order-info-item .order-content {
+  padding: 12px 16px;
+  border: 1px solid #e4e7ed;
+  font-size: 14px;
+  color: #303133;
+  display: flex;
+  align-items: center;
+}
+
+/* 鐢宠浜轰俊鎭嚜瀹氫箟甯冨眬鏍峰紡 */
+.applicant-info-section {
+  border: 1px solid #e4e7ed;
+  border-radius: 4px;
+  margin-top: 15px;
+  overflow: hidden;
+}
+
+.applicant-info-section .section-header {
+  background: #f3f6fb;
+  padding: 12px 16px;
+  border-bottom: 1px solid #e4e7ed;
+  font-weight: 600;
+  display: flex;
+  align-items: center;
+}
+
+.applicant-info-section .section-icon {
+  margin-right: 6px;
+  color: #409eff;
+}
+
+.applicant-info-grid {
+  display: grid;
+  grid-template-columns: 15% 30% 15% 40%;
+  width: 100%;
+}
+
+.applicant-info-item {
+  display: contents;
+}
+
+.applicant-info-item .applicant-label {
+  padding: 12px 16px;
+  background: #fafafa;
+  border: 1px solid #e4e7ed;
+  font-size: 14px;
+  color: #606266;
+  display: flex;
+  align-items: center;
+}
+
+.applicant-info-item .applicant-content {
+  padding: 12px 16px;
+  border: 1px solid #e4e7ed;
+  font-size: 14px;
+  color: #303133;
+  display: flex;
+  align-items: center;
+}
+
+/* 浜ゆ槗鍐呭鑷畾涔夊竷灞�鏍峰紡 */
+.transaction-content-section {
+  border: 1px solid #e4e7ed;
+  border-radius: 4px;
+  margin-top: 15px;
+  overflow: hidden;
+}
+
+.transaction-content-section .section-header {
+  background: #f3f6fb;
+  padding: 12px 16px;
+  border-bottom: 1px solid #e4e7ed;
+  font-weight: 600;
+  display: flex;
+  align-items: center;
+}
+
+.transaction-content-section .section-icon {
+  margin-right: 6px;
+  color: #409eff;
+}
+
+.transaction-content-grid {
+  display: grid;
+  grid-template-columns: 15% 30% 15% 40%;
+  width: 100%;
+}
+
+.transaction-content-item {
+  display: contents;
+}
+
+.transaction-content-item .transaction-label {
+  padding: 12px 16px;
+  background: #fafafa;
+  border: 1px solid #e4e7ed;
+  font-size: 14px;
+  color: #606266;
+  display: flex;
+  align-items: center;
+}
+
+.transaction-content-item .transaction-content {
+  padding: 12px 16px;
+  border: 1px solid #e4e7ed;
+  font-size: 14px;
+  color: #303133;
+  display: flex;
+  align-items: center;
+}
+
+
 .desc-wrap {
   white-space: pre-wrap;
   line-height: 22px;

--
Gitblit v1.8.0