fetch(modify): 中英文以及黑屏

src/locales/langs/en.json

@@ -405,6 +405,7 @@
       "agent": "Agent Management",
       "customerAccount": "Customer Account",
       "enterpriseCustomer": "Enterprise Customer",
+      "enterpriseCards": "Enterprise Card Management",
       "customerCommission": "Customer Commission"
     },
     "account": {
@@ -412,7 +413,8 @@
       "customerAccount": "Customer Account",
       "withdrawal": "Commission Withdrawal",
       "withdrawalSettings": "Withdrawal Settings",
-      "myAccount": "My Account"
+      "myAccount": "My Account",
+      "carrierManagement": "Carrier Management"
     },
     "deviceManagement": {
       "title": "Device Management",
@@ -429,11 +431,19 @@
     },
     "assetManagement": {
       "title": "Asset Management",
+      "cardSearch": "Card Search",
+      "deviceSearch": "Device Search",
       "singleCard": "Single Card Info",
-      "cardList": "Card Management",
+      "standaloneCardList": "Standalone Card List",
+      "taskManagement": "Task Management",
+      "taskDetail": "Task Details",
       "devices": "Device Management",
-      "assetAssign": "Asset Assignment",
-      "cardReplacementRequest": "Card Replacement Request"
+      "deviceDetail": "Device Details",
+      "assetAssign": "Allocation Records",
+      "allocationRecordDetail": "Allocation Record Details",
+      "cardReplacementRequest": "Card Replacement Request",
+      "authorizationRecords": "Authorization Records",
+      "authorizationDetail": "Authorization Details"
     },
     "settings": {
       "title": "Settings Management",
@@ -447,6 +457,15 @@
       "deviceImport": "Device Import",
       "offlineBatchRecharge": "Offline Batch Recharge",
       "cardChangeNotice": "Card Change Notice"
+    },
+    "commission": {
+      "menu": {
+        "management": "Commission Management",
+        "withdrawal": "Withdrawal Approval",
+        "withdrawalSettings": "Withdrawal Settings",
+        "myCommission": "My Commission",
+        "agentCommission": "Agent Commission Management"
+      }
     }
   },
   "table": {
@@ -567,5 +586,160 @@
       "passwordHint": "Please use change password function to modify password",
       "disabledLoginHint": "Account has been disabled, please contact administrator"
     }
+  },
+  "commission": {
+    "menu": {
+      "management": "Commission Management",
+      "withdrawal": "Withdrawal Approval",
+      "withdrawalSettings": "Withdrawal Settings",
+      "myCommission": "My Commission",
+      "agentCommission": "Agent Commission Management"
+    },
+    "table": {
+      "withdrawalNo": "Withdrawal No.",
+      "applicant": "Applicant",
+      "applicantAccount": "Applicant Account",
+      "withdrawalAmount": "Withdrawal Amount",
+      "fee": "Fee",
+      "actualAmount": "Actual Amount",
+      "withdrawalMethod": "Withdrawal Method",
+      "accountInfo": "Account Info",
+      "accountName": "Account Name",
+      "accountNumber": "Account Number",
+      "bankName": "Bank Name",
+      "status": "Status",
+      "rejectReason": "Reject Reason",
+      "applyTime": "Apply Time",
+      "approveTime": "Approve Time",
+      "transferTime": "Transfer Time",
+      "actions": "Actions",
+      "commissionNo": "Commission No.",
+      "commissionType": "Commission Type",
+      "commissionAmount": "Commission Amount",
+      "orderNo": "Order No.",
+      "sourceUser": "Source User",
+      "beneficiary": "Beneficiary",
+      "settleTime": "Settle Time",
+      "withdrawTime": "Withdraw Time",
+      "remark": "Remark"
+    },
+    "status": {
+      "pending": "Pending",
+      "approved": "Approved",
+      "rejected": "Rejected",
+      "completed": "Completed",
+      "frozen": "Frozen",
+      "unfreezing": "Unfreezing",
+      "settled": "Settled",
+      "invalid": "Invalid"
+    },
+    "type": {
+      "oneTime": "One-time Commission",
+      "longTerm": "Long-term Commission"
+    },
+    "method": {
+      "alipay": "Alipay",
+      "wechat": "WeChat",
+      "bank": "Bank Card"
+    },
+    "form": {
+      "withdrawalAmount": "Withdrawal Amount",
+      "withdrawalAmountPlaceholder": "Please enter withdrawal amount",
+      "withdrawalMethod": "Withdrawal Method",
+      "withdrawalMethodPlaceholder": "Please select withdrawal method",
+      "accountName": "Account Name",
+      "accountNamePlaceholder": "Please enter account name",
+      "accountNumber": "Account Number",
+      "accountNumberPlaceholder": "Please enter account number",
+      "bankName": "Bank Name",
+      "bankNamePlaceholder": "Please enter bank name",
+      "alipayAccount": "Alipay Account",
+      "alipayAccountPlaceholder": "Please enter Alipay account",
+      "wechatAccount": "WeChat Account",
+      "wechatAccountPlaceholder": "Please enter WeChat account",
+      "rejectReason": "Reject Reason",
+      "rejectReasonPlaceholder": "Please enter reject reason",
+      "remark": "Remark",
+      "remarkPlaceholder": "Please enter remark",
+      "minWithdrawal": "Min Withdrawal",
+      "minWithdrawalPlaceholder": "Please enter min withdrawal amount",
+      "maxWithdrawal": "Max Withdrawal",
+      "maxWithdrawalPlaceholder": "Please enter max withdrawal amount",
+      "feeRate": "Fee Rate",
+      "feeRatePlaceholder": "Please enter fee rate (%)",
+      "availableBalance": "Available Balance",
+      "totalCommission": "Total Commission",
+      "frozenAmount": "Frozen Amount",
+      "withdrawnAmount": "Withdrawn Amount"
+    },
+    "buttons": {
+      "approve": "Approve",
+      "reject": "Reject",
+      "applyWithdrawal": "Apply Withdrawal",
+      "viewDetail": "View Details",
+      "export": "Export",
+      "batchApprove": "Batch Approve",
+      "batchReject": "Batch Reject"
+    },
+    "messages": {
+      "approveSuccess": "Approved successfully",
+      "rejectSuccess": "Rejected successfully",
+      "withdrawalSuccess": "Withdrawal application submitted successfully",
+      "updateSuccess": "Updated successfully",
+      "deleteSuccess": "Deleted successfully",
+      "approveConfirm": "Are you sure to approve this withdrawal?",
+      "rejectConfirm": "Are you sure to reject this withdrawal?",
+      "batchApproveConfirm": "Are you sure to approve {count} withdrawals?",
+      "batchRejectConfirm": "Are you sure to reject {count} withdrawals?",
+      "insufficientBalance": "Insufficient balance",
+      "belowMinAmount": "Amount below minimum withdrawal",
+      "exceedMaxAmount": "Amount exceeds maximum withdrawal",
+      "noData": "No data"
+    },
+    "validation": {
+      "withdrawalAmountRequired": "Please enter withdrawal amount",
+      "withdrawalAmountInvalid": "Withdrawal amount must be greater than 0",
+      "withdrawalMethodRequired": "Please select withdrawal method",
+      "accountNameRequired": "Please enter account name",
+      "accountNumberRequired": "Please enter account number",
+      "bankNameRequired": "Please enter bank name",
+      "rejectReasonRequired": "Please enter reject reason",
+      "minWithdrawalRequired": "Please enter min withdrawal amount",
+      "maxWithdrawalRequired": "Please enter max withdrawal amount",
+      "feeRateRequired": "Please enter fee rate",
+      "feeRateInvalid": "Fee rate must be between 0-100"
+    },
+    "searchForm": {
+      "withdrawalNo": "Withdrawal No.",
+      "withdrawalNoPlaceholder": "Please enter withdrawal no.",
+      "applicant": "Applicant",
+      "applicantPlaceholder": "Please enter applicant",
+      "shopName": "Shop Name",
+      "shopNamePlaceholder": "Please enter shop name",
+      "status": "Status",
+      "statusPlaceholder": "Please select status",
+      "withdrawalMethod": "Withdrawal Method",
+      "withdrawalMethodPlaceholder": "Please select withdrawal method",
+      "dateRange": "Date Range",
+      "dateRangePlaceholder": ["Start Date", "End Date"],
+      "commissionType": "Commission Type",
+      "commissionTypePlaceholder": "Please select commission type"
+    },
+    "dialog": {
+      "approve": "Approve Withdrawal",
+      "reject": "Reject Withdrawal",
+      "detail": "Withdrawal Details",
+      "applyWithdrawal": "Apply Withdrawal",
+      "withdrawalSettings": "Withdrawal Settings"
+    },
+    "summary": {
+      "title": "Commission Summary",
+      "totalCommission": "Total Commission",
+      "availableBalance": "Available Balance",
+      "frozenAmount": "Frozen Amount",
+      "withdrawnAmount": "Withdrawn Amount",
+      "pendingAmount": "Pending Amount",
+      "todayCommission": "Today's Commission"
+    }
   }
 }

src/locales/langs/zh.json

@@ -435,6 +435,8 @@
     },
     "assetManagement": {
       "title": "资产管理",
+      "cardSearch": "单卡查询",
+      "deviceSearch": "设备查询",
       "singleCard": "单卡信息",
       "standaloneCardList": "单卡列表",
       "taskManagement": "任务管理",
@@ -442,6 +444,7 @@
       "devices": "设备管理",
       "deviceDetail": "设备详情",
       "assetAssign": "分配记录",
+      "allocationRecordDetail": "分配记录详情",
       "cardReplacementRequest": "换卡申请",
       "authorizationRecords": "授权记录",
       "authorizationDetail": "授权记录详情"
@@ -449,7 +452,8 @@
     "account": {
       "title": "账户管理",
       "customerAccount": "客户账号",
-      "myAccount": "我的账户"
+      "myAccount": "我的账户",
+      "carrierManagement": "运营商管理"
     },
     "commission": {
       "menu": {

src/router/routes/asyncRoutes.ts

@@ -834,26 +834,6 @@ export const asyncRoutes: AppRouteRecord[] = [
       }
     ]
   },
-  {
-    path: '/my-simcard',
-    name: 'MySimcard',
-    component: RoutesAlias.Home,
-    meta: {
-      title: '我的网卡',
-      icon: ''
-    },
-    children: [
-      {
-        path: 'single-card',
-        name: 'SingleCard',
-        component: RoutesAlias.SingleCard,
-        meta: {
-          title: '单卡信息',
-          keepAlive: true
-        }
-      }
-    ]
-  },
   {
     path: '/asset-management',
     name: 'AssetManagement',
@@ -868,7 +848,7 @@ export const asyncRoutes: AppRouteRecord[] = [
         name: 'CardSearch',
         component: RoutesAlias.CardSearch,
         meta: {
-          title: '单卡查询',
+          title: 'menus.assetManagement.cardSearch',
           keepAlive: true
         }
       },
@@ -877,7 +857,7 @@ export const asyncRoutes: AppRouteRecord[] = [
         name: 'DeviceSearch',
         component: RoutesAlias.DeviceSearch,
         meta: {
-          title: '设备查询',
+          title: 'menus.assetManagement.deviceSearch',
           keepAlive: true
         }
       },
@@ -942,7 +922,7 @@ export const asyncRoutes: AppRouteRecord[] = [
         name: 'AllocationRecordDetail',
         component: RoutesAlias.AllocationRecordDetail,
         meta: {
-          title: '分配记录详情',
+          title: 'menus.assetManagement.allocationRecordDetail',
           isHide: true,
           keepAlive: false
         }
@@ -1009,7 +989,7 @@ export const asyncRoutes: AppRouteRecord[] = [
         name: 'CarrierManagement',
         component: RoutesAlias.CarrierManagement,
         meta: {
-          title: '运营商管理',
+          title: 'menus.account.carrierManagement',
           keepAlive: true
         }
       },

src/views/finance/commission/agent-commission/index.vue

@@ -1,221 +1,224 @@
 <template>
-  <ArtTableFullScreen>
-    <div class="agent-commission-page" id="table-full-screen">
-      <!-- 搜索栏 -->
-      <ElCard shadow="never" class="search-card">
-        <ElForm :inline="true" :model="searchForm" class="search-form">
-          <ElFormItem label="店铺名称">
-            <ElInput
-              v-model="searchForm.shop_name"
-              placeholder="请输入店铺名称"
-              clearable
-              style="width: 200px"
-            />
-          </ElFormItem>
-          <ElFormItem label="店铺编码">
-            <ElInput
-              v-model="searchForm.shop_code"
-              placeholder="请输入店铺编码"
-              clearable
-              style="width: 200px"
-            />
-          </ElFormItem>
-          <ElFormItem>
-            <ElButton type="primary" @click="handleSearch">查询</ElButton>
-            <ElButton @click="handleReset">重置</ElButton>
-          </ElFormItem>
-        </ElForm>
-      </ElCard>
+  <div class="agent-commission-container">
+    <ArtTableFullScreen>
+      <div class="agent-commission-page" id="table-full-screen">
+        <!-- 搜索栏 -->
+        <ElCard shadow="never" class="search-card">
+          <ElForm :inline="true" :model="searchForm" class="search-form">
+            <ElFormItem label="店铺名称">
+              <ElInput
+                v-model="searchForm.shop_name"
+                placeholder="请输入店铺名称"
+                clearable
+                style="width: 200px"
+              />
+            </ElFormItem>
+            <ElFormItem label="店铺编码">
+              <ElInput
+                v-model="searchForm.shop_code"
+                placeholder="请输入店铺编码"
+                clearable
+                style="width: 200px"
+              />
+            </ElFormItem>
+            <ElFormItem>
+              <ElButton type="primary" @click="handleSearch">查询</ElButton>
+              <ElButton @click="handleReset">重置</ElButton>
+            </ElFormItem>
+          </ElForm>
+        </ElCard>
 
-      <ElCard shadow="never" class="art-table-card">
-        <!-- 表格头部 -->
-        <ArtTableHeader
-          :columnList="columnOptions"
-          v-model:columns="columnChecks"
-          @refresh="handleRefresh"
-        />
+        <ElCard shadow="never" class="art-table-card">
+          <!-- 表格头部 -->
+          <ArtTableHeader
+            :columnList="columnOptions"
+            v-model:columns="columnChecks"
+            @refresh="handleRefresh"
+          />
 
-        <!-- 表格 -->
-        <ArtTable
-          ref="tableRef"
-          row-key="shop_id"
-          :loading="loading"
-          :data="summaryList"
-          :currentPage="pagination.page"
-          :pageSize="pagination.pageSize"
-          :total="pagination.total"
-          :marginTop="10"
-          @size-change="handleSizeChange"
-          @current-change="handleCurrentChange"
-        >
-          <template #default>
-            <ElTableColumn v-for="col in columns" :key="col.prop || col.type" v-bind="col" />
-          </template>
-        </ArtTable>
-      </ElCard>
-    </div>
-  </ArtTableFullScreen>
+          <!-- 表格 -->
+          <ArtTable
+            ref="tableRef"
+            row-key="shop_id"
+            :loading="loading"
+            :data="summaryList"
+            :currentPage="pagination.page"
+            :pageSize="pagination.pageSize"
+            :total="pagination.total"
+            :marginTop="10"
+            @size-change="handleSizeChange"
+            @current-change="handleCurrentChange"
+          >
+            <template #default>
+              <ElTableColumn v-for="col in columns" :key="col.prop || col.type" v-bind="col" />
+            </template>
+          </ArtTable>
+        </ElCard>
+      </div>
+    </ArtTableFullScreen>
 
-  <!-- 详情抽屉 -->
-  <ElDrawer
-    v-model="detailDrawerVisible"
-    :title="`${currentShop?.shop_name || ''} - 佣金详情`"
-    size="60%"
-    destroy-on-close
-  >
-    <ElTabs v-model="activeTab" class="detail-tabs">
-      <!-- 佣金明细 Tab -->
-      <ElTabPane label="佣金明细" name="commission">
-        <ArtTable
-          ref="commissionTableRef"
-          row-key="id"
-          :loading="commissionLoading"
-          :data="commissionRecords"
-          :currentPage="commissionPagination.page"
-          :pageSize="commissionPagination.pageSize"
-          :total="commissionPagination.total"
-          :marginTop="10"
-          :height="500"
-          @size-change="handleCommissionSizeChange"
-          @current-change="handleCommissionCurrentChange"
-        >
-          <template #default>
-            <ElTableColumn label="佣金金额" prop="amount" width="120">
-              <template #default="scope">
-                <span style="font-weight: 500; color: var(--el-color-success)">
-                  {{ formatMoney(scope.row.amount) }}
-                </span>
-              </template>
-            </ElTableColumn>
-            <ElTableColumn label="入账后余额" prop="balance_after" width="120">
-              <template #default="scope">
-                {{ formatMoney(scope.row.balance_after) }}
-              </template>
-            </ElTableColumn>
-            <ElTableColumn label="佣金类型" prop="commission_type" width="120">
-              <template #default="scope">
-                <ElTag
-                  :type="
-                    CommissionTypeMap[scope.row.commission_type as keyof typeof CommissionTypeMap]
-                      ?.type || 'info'
-                  "
-                >
+    <!-- 详情抽屉 -->
+    <ElDrawer
+      v-model="detailDrawerVisible"
+      :title="`${currentShop?.shop_name || ''} - 佣金详情`"
+      size="60%"
+      destroy-on-close
+    >
+      <ElTabs v-model="activeTab" class="detail-tabs">
+        <!-- 佣金明细 Tab -->
+        <ElTabPane label="佣金明细" name="commission">
+          <ArtTable
+            ref="commissionTableRef"
+            row-key="id"
+            :loading="commissionLoading"
+            :data="commissionRecords"
+            :currentPage="commissionPagination.page"
+            :pageSize="commissionPagination.pageSize"
+            :total="commissionPagination.total"
+            :marginTop="10"
+            :height="500"
+            @size-change="handleCommissionSizeChange"
+            @current-change="handleCommissionCurrentChange"
+          >
+            <template #default>
+              <ElTableColumn label="佣金金额" prop="amount" width="120">
+                <template #default="scope">
+                  <span style="font-weight: 500; color: var(--el-color-success)">
+                    {{ formatMoney(scope.row.amount) }}
+                  </span>
+                </template>
+              </ElTableColumn>
+              <ElTableColumn label="入账后余额" prop="balance_after" width="120">
+                <template #default="scope">
+                  {{ formatMoney(scope.row.balance_after) }}
+                </template>
+              </ElTableColumn>
+              <ElTableColumn label="佣金类型" prop="commission_type" width="120">
+                <template #default="scope">
+                  <ElTag
+                    :type="
+                      CommissionTypeMap[scope.row.commission_type as keyof typeof CommissionTypeMap]
+                        ?.type || 'info'
+                    "
+                  >
+                    {{
+                      CommissionTypeMap[scope.row.commission_type as keyof typeof CommissionTypeMap]
+                        ?.label || scope.row.commission_type
+                    }}
+                  </ElTag>
+                </template>
+              </ElTableColumn>
+              <ElTableColumn label="状态" prop="status" width="100">
+                <template #default="scope">
+                  <ElTag
+                    :type="
+                      CommissionStatusMap[scope.row.status as keyof typeof CommissionStatusMap]
+                        ?.type || 'info'
+                    "
+                  >
+                    {{
+                      CommissionStatusMap[scope.row.status as keyof typeof CommissionStatusMap]
+                        ?.label || scope.row.status
+                    }}
+                  </ElTag>
+                </template>
+              </ElTableColumn>
+              <ElTableColumn label="订单号" prop="order_no" min-width="180" show-overflow-tooltip />
+              <ElTableColumn label="ICCID" prop="iccid" min-width="150" show-overflow-tooltip />
+              <ElTableColumn label="设备号" prop="device_no" min-width="150" show-overflow-tooltip />
+              <ElTableColumn label="入账时间" prop="created_at" width="180">
+                <template #default="scope">
+                  {{ formatDateTime(scope.row.created_at) }}
+                </template>
+              </ElTableColumn>
+            </template>
+          </ArtTable>
+        </ElTabPane>
+
+        <!-- 提现记录 Tab -->
+        <ElTabPane label="提现记录" name="withdrawal">
+          <ArtTable
+            ref="withdrawalTableRef"
+            row-key="id"
+            :loading="withdrawalLoading"
+            :data="withdrawalRecords"
+            :currentPage="withdrawalPagination.page"
+            :pageSize="withdrawalPagination.pageSize"
+            :total="withdrawalPagination.total"
+            :marginTop="10"
+            :height="500"
+            @size-change="handleWithdrawalSizeChange"
+            @current-change="handleWithdrawalCurrentChange"
+          >
+            <template #default>
+              <ElTableColumn
+                label="提现单号"
+                prop="withdrawal_no"
+                min-width="180"
+                show-overflow-tooltip
+              />
+              <ElTableColumn label="提现金额" prop="amount" width="120">
+                <template #default="scope">
+                  <span style="font-weight: 500; color: var(--el-color-danger)">
+                    {{ formatMoney(scope.row.amount) }}
+                  </span>
+                </template>
+              </ElTableColumn>
+              <ElTableColumn label="实际到账" prop="actual_amount" width="120">
+                <template #default="scope">
+                  {{ formatMoney(scope.row.actual_amount) }}
+                </template>
+              </ElTableColumn>
+              <ElTableColumn label="手续费" prop="fee" width="100">
+                <template #default="scope">
+                  {{ formatMoney(scope.row.fee) }}
+                </template>
+              </ElTableColumn>
+              <ElTableColumn label="提现方式" prop="withdrawal_method" width="100">
+                <template #default="scope">
                   {{
-                    CommissionTypeMap[scope.row.commission_type as keyof typeof CommissionTypeMap]
-                      ?.label || scope.row.commission_type
+                    WithdrawalMethodMap[
+                      scope.row.withdrawal_method as keyof typeof WithdrawalMethodMap
+                    ]?.label || scope.row.withdrawal_method
                   }}
-                </ElTag>
-              </template>
-            </ElTableColumn>
-            <ElTableColumn label="状态" prop="status" width="100">
-              <template #default="scope">
-                <ElTag
-                  :type="
-                    CommissionStatusMap[scope.row.status as keyof typeof CommissionStatusMap]
-                      ?.type || 'info'
-                  "
-                >
-                  {{
-                    CommissionStatusMap[scope.row.status as keyof typeof CommissionStatusMap]
-                      ?.label || scope.row.status
-                  }}
-                </ElTag>
-              </template>
-            </ElTableColumn>
-            <ElTableColumn label="订单号" prop="order_no" min-width="180" show-overflow-tooltip />
-            <ElTableColumn label="ICCID" prop="iccid" min-width="150" show-overflow-tooltip />
-            <ElTableColumn label="设备号" prop="device_no" min-width="150" show-overflow-tooltip />
-            <ElTableColumn label="入账时间" prop="created_at" width="180">
-              <template #default="scope">
-                {{ formatDateTime(scope.row.created_at) }}
-              </template>
-            </ElTableColumn>
-          </template>
-        </ArtTable>
-      </ElTabPane>
-
-      <!-- 提现记录 Tab -->
-      <ElTabPane label="提现记录" name="withdrawal">
-        <ArtTable
-          ref="withdrawalTableRef"
-          row-key="id"
-          :loading="withdrawalLoading"
-          :data="withdrawalRecords"
-          :currentPage="withdrawalPagination.page"
-          :pageSize="withdrawalPagination.pageSize"
-          :total="withdrawalPagination.total"
-          :marginTop="10"
-          :height="500"
-          @size-change="handleWithdrawalSizeChange"
-          @current-change="handleWithdrawalCurrentChange"
-        >
-          <template #default>
-            <ElTableColumn
-              label="提现单号"
-              prop="withdrawal_no"
-              min-width="180"
-              show-overflow-tooltip
-            />
-            <ElTableColumn label="提现金额" prop="amount" width="120">
-              <template #default="scope">
-                <span style="font-weight: 500; color: var(--el-color-danger)">
-                  {{ formatMoney(scope.row.amount) }}
-                </span>
-              </template>
-            </ElTableColumn>
-            <ElTableColumn label="实际到账" prop="actual_amount" width="120">
-              <template #default="scope">
-                {{ formatMoney(scope.row.actual_amount) }}
-              </template>
-            </ElTableColumn>
-            <ElTableColumn label="手续费" prop="fee" width="100">
-              <template #default="scope">
-                {{ formatMoney(scope.row.fee) }}
-              </template>
-            </ElTableColumn>
-            <ElTableColumn label="提现方式" prop="withdrawal_method" width="100">
-              <template #default="scope">
-                {{
-                  WithdrawalMethodMap[
-                    scope.row.withdrawal_method as keyof typeof WithdrawalMethodMap
-                  ]?.label || scope.row.withdrawal_method
-                }}
-              </template>
-            </ElTableColumn>
-            <ElTableColumn label="状态" prop="status" width="100">
-              <template #default="scope">
-                <ElTag
-                  :type="
-                    WithdrawalStatusMap[scope.row.status as keyof typeof WithdrawalStatusMap]
-                      ?.type || 'info'
-                  "
-                >
-                  {{
-                    WithdrawalStatusMap[scope.row.status as keyof typeof WithdrawalStatusMap]
-                      ?.label || scope.row.status
-                  }}
-                </ElTag>
-              </template>
-            </ElTableColumn>
-            <ElTableColumn label="申请时间" prop="created_at" width="180">
-              <template #default="scope">
-                {{ formatDateTime(scope.row.created_at) }}
-              </template>
-            </ElTableColumn>
-            <ElTableColumn label="处理时间" prop="processed_at" width="180">
-              <template #default="scope">
-                {{ formatDateTime(scope.row.processed_at) }}
-              </template>
-            </ElTableColumn>
-          </template>
-        </ArtTable>
-      </ElTabPane>
-    </ElTabs>
-  </ElDrawer>
+                </template>
+              </ElTableColumn>
+              <ElTableColumn label="状态" prop="status" width="100">
+                <template #default="scope">
+                  <ElTag
+                    :type="
+                      WithdrawalStatusMap[scope.row.status as keyof typeof WithdrawalStatusMap]
+                        ?.type || 'info'
+                    "
+                  >
+                    {{
+                      WithdrawalStatusMap[scope.row.status as keyof typeof WithdrawalStatusMap]
+                        ?.label || scope.row.status
+                    }}
+                  </ElTag>
+                </template>
+              </ElTableColumn>
+              <ElTableColumn label="申请时间" prop="created_at" width="180">
+                <template #default="scope">
+                  {{ formatDateTime(scope.row.created_at) }}
+                </template>
+              </ElTableColumn>
+              <ElTableColumn label="处理时间" prop="processed_at" width="180">
+                <template #default="scope">
+                  {{ formatDateTime(scope.row.processed_at) }}
+                </template>
+              </ElTableColumn>
+            </template>
+          </ArtTable>
+        </ElTabPane>
+      </ElTabs>
+    </ElDrawer>
+  </div>
 </template>
 
 <script setup lang="ts">
-  import { h } from 'vue'
+  import { h, watch, onBeforeUnmount } from 'vue'
+  import { useRoute } from 'vue-router'
   import { CommissionService } from '@/api/modules'
   import { ElMessage, ElTag } from 'element-plus'
   import type {
@@ -235,6 +238,8 @@
 
   defineOptions({ name: 'AgentCommission' })
 
+  const route = useRoute()
+
   // 主表格状态
   const loading = ref(false)
   const tableRef = ref()
@@ -464,6 +469,23 @@
     }
   })
 
+  // 监听路由变化，关闭抽屉
+  watch(
+    () => route.path,
+    () => {
+      if (detailDrawerVisible.value) {
+        detailDrawerVisible.value = false
+      }
+    }
+  )
+
+  // 组件卸载前关闭抽屉
+  onBeforeUnmount(() => {
+    if (detailDrawerVisible.value) {
+      detailDrawerVisible.value = false
+    }
+  })
+
   // 加载佣金明细
   const loadCommissionRecords = async () => {
     if (!currentShop.value) return
@@ -540,6 +562,10 @@
 </script>
 
 <style lang="scss" scoped>
+  .agent-commission-container {
+    height: 100%;
+  }
+
   .agent-commission-page {
     .search-card {
       margin-bottom: 16px;