优化

src/modules/overseas-warehouse/pages/MojiaSkuSyncView.vue

@@ -1,4 +1,5 @@
 <script setup lang="ts">
+import '@/styles/adminWorkbench.css'
 import '@/styles/adminDensity.css'
 import { computed, onMounted, reactive, ref } from 'vue'
 import { ElMessage, ElMessageBox } from 'element-plus'
@@ -162,7 +163,7 @@ async function saveEdit() {
 async function retry(row: MojiaSkuSyncRecord, confirm = true) {
   if (confirm) {
     try {
-      await ElMessageBox.confirm(`确认重新推送 SKU「${row.skuCode}」的最新测量值？`, '重新推送领星', { type: 'warning', confirmButtonText: '重新推送', cancelButtonText: '取消', customClass: 'admin-density-confirm' })
+      await ElMessageBox.confirm(`确认重新推送 SKU「${row.skuCode}」的最新测量值？`, '重新推送领星', { type: 'warning', confirmButtonText: '重新推送', cancelButtonText: '取消', customClass: 'admin-density-confirm admin-workbench is-dialog' })
     } catch { return }
   }
   actionId.value = row.id
@@ -186,9 +187,9 @@ onMounted(() => { void Promise.all([loadConfig(), load()]) })
 </script>
 
 <template>
-  <AdminPage class="admin-density mojia-sku-sync-page">
+  <AdminPage class="admin-density mojia-sku-sync-page admin-workbench">
     <ListPageLayout aria-label="称重机器">
-      <DataTable v-model:page="page" v-model:page-size="size" :total="total" :page-sizes="[10, 20, 30, 40, 50, 100]" @update:page="load" @update:page-size="search" appearance="integrated" :stripe="false" column-settings-mode="show" preference-key="mojia-sku-sync-table" :data="rows" :columns="columns" :loading="loading" :aria-busy="loading" row-key="id" border empty-text="暂无墨家机器上传记录">
+      <div class="workbench-table is-page-surface"><DataTable v-model:page="page" v-model:page-size="size" :total="total" :page-sizes="[10, 20, 30, 40, 50, 100]" @update:page="load" @update:page-size="search" appearance="integrated" :stripe="false" column-settings-mode="show" preference-key="mojia-sku-sync-table" :data="rows" :columns="columns" :loading="loading" :aria-busy="loading" row-key="id" border empty-text="暂无墨家机器上传记录">
           <template #toolbar-start><h1>称重机器</h1></template>
           <template #filters>
             <div class="sync-filters query-toolbar">
@@ -226,9 +227,9 @@ onMounted(() => { void Promise.all([loadConfig(), load()]) })
           <template #match="{ row }">{{ row.lingxingSkuId || '未匹配' }}</template>
           <template #measuredAt="{ row }">{{ formatTime(row.measuredAt) }}</template>
           <template #failure="{ row }">{{ row.syncFailureReason || '—' }}</template>
-        </DataTable>
+        </DataTable></div>
     </ListPageLayout>
-    <AppDialog v-model="editOpen" class="admin-density-dialog" title="编辑 SKU 测量修正版" width="min(620px, calc(100vw - 28px))" confirm-text="保存并重新同步" :confirm-loading="Boolean(actionId)" @confirm="saveEdit">
+    <AppDialog v-model="editOpen" class="admin-density-dialog admin-workbench is-dialog" title="编辑 SKU 测量修正版" width="min(620px, calc(100vw - 28px))" confirm-text="保存并重新同步" :confirm-loading="Boolean(actionId)" @confirm="saveEdit">
       <el-form label-position="top" class="sync-edit-form">
         <el-form-item label="SKU"><el-input v-model.trim="editForm.skuCode" /></el-form-item>
         <div class="sync-edit-grid">
@@ -240,7 +241,7 @@ onMounted(() => { void Promise.all([loadConfig(), load()]) })
         <el-alert type="info" :closable="false" title="原始墨家测量记录不可变，本次保存会生成新的人工修正版并进入同步队列。" />
       </el-form>
     </AppDialog>
-    <AppDialog v-model="testOpen" class="admin-density-dialog" title="领星连接测试" width="min(720px, calc(100vw - 28px))" :show-cancel="false" confirm-text="关闭" @confirm="testOpen = false">
+    <AppDialog v-model="testOpen" class="admin-density-dialog admin-workbench is-dialog" title="领星连接测试" width="min(720px, calc(100vw - 28px))" :show-cancel="false" confirm-text="关闭" @confirm="testOpen = false">
       <div v-if="testResult" class="connection-result">
         <div class="connection-result__sku">查询 SKU：<strong>{{ testResult.skuCode }}</strong></div>
         <el-table :data="testResult.warehouses" border>
@@ -251,7 +252,7 @@ onMounted(() => { void Promise.all([loadConfig(), load()]) })
         </el-table>
       </div>
     </AppDialog>
-    <AppDialog v-model="verificationOpen" class="admin-density-dialog" title="领星二次验证" width="min(460px, calc(100vw - 28px))" confirm-text="提交验证码" :confirm-loading="submittingVerification" @confirm="submitVerification">
+    <AppDialog v-model="verificationOpen" class="admin-density-dialog admin-workbench is-dialog" title="领星二次验证" width="min(460px, calc(100vw - 28px))" confirm-text="提交验证码" :confirm-loading="submittingVerification" @confirm="submitVerification">
       <el-alert type="warning" :closable="false" title="领星要求二次验证，请在验证码发送到手机、邮箱或验证器后输入。" />
       <el-form label-position="top" class="verification-form"><el-form-item label="验证码"><el-input v-model.trim="verificationCode" maxlength="16" autocomplete="one-time-code" placeholder="请输入验证码" @keyup.enter="submitVerification" /></el-form-item></el-form>
     </AppDialog>
@@ -267,7 +268,7 @@ onMounted(() => { void Promise.all([loadConfig(), load()]) })
 .sync-edit-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 16px; }
 .sync-edit-grid :deep(.el-input-number) { width: 100%; }
 .connection-result { display: grid; gap: var(--admin-space-4); }
-.connection-result__sku { color: var(--cc-muted); }
-.connection-result__sku strong { color: var(--cc-text); }
+.connection-result__sku { color: var(--workbench-muted); }
+.connection-result__sku strong { color: var(--workbench-text); }
 @media (max-width: 900px) { .sync-filters .el-input { width: 180px; } }
 </style>