style(admin): unify dialog layouts and dense readonly presentation

src/modules/appointment-calendar/WorkCreateAppointmentForm.vue

@@ -44,18 +44,23 @@ async function save() {
 onMounted(load)
 </script>
 <template>
-  <section class="work-form" aria-label="新建预约安排">
-    <h3>新建预约安排</h3>
+  <section class="work-form density-dialog-sections" aria-label="新建预约安排">
     <LoadErrorState v-if="error" title="预约货物预览失败" :message="error.message" :loading="loading" @retry="load"><template #details><ApiErrorMeta :details="error" /></template></LoadErrorState>
     <p v-if="loading">正在核对本次货物范围…</p>
     <template v-if="preview && !error">
-      <p>{{ preview.originWarehouseName }} → {{ preview.destinationWarehouseCode }} · {{ preview.group.sourceCount }} 票 · {{ preview.group.packages ?? '箱数待核实' }}</p>
-      <p v-for="source in preview.sources" :key="`${source.customerId}:${source.sourceKey}`">{{ source.inboundCode || source.bookingNo || '原票业务号未提供' }}</p>
-      <p v-for="field in preview.missingFields" :key="field">{{ workReason(field) }}</p>
-      <p v-if="preview.group.readinessIncomplete">货物备妥窗口待核实。</p>
-      <FbaAppointmentFields :model="form" :timezone="preview.destinationTimezone" :disabled="!writable || loading || saving || !!pending" />
+      <section class="density-dialog-section" data-tone="summary" aria-label="本次预约货物">
+        <h3 class="density-dialog-section__title">本次预约货物</h3>
+        <table class="density-table"><tbody>
+          <tr><th scope="row">起运仓</th><td>{{ preview.originWarehouseName || '—' }}</td><th scope="row">目的FBA仓</th><td>{{ preview.destinationWarehouseCode || '—' }}</td></tr>
+          <tr><th scope="row">票数</th><td>{{ preview.group.sourceCount }}</td><th scope="row">箱数</th><td>{{ preview.group.packages ?? '箱数待核实' }}</td></tr>
+          <tr><th scope="row">货物业务号</th><td colspan="3"><template v-for="(source, index) in preview.sources" :key="`${source.customerId}:${source.sourceKey}`">{{ index ? '、' : '' }}{{ source.inboundCode || source.bookingNo || '原票业务号未提供' }}</template></td></tr>
+        </tbody></table>
+        <p v-for="field in preview.missingFields" :key="field" role="status" class="density-dialog-note">{{ workReason(field) }}</p>
+        <p v-if="preview.group.readinessIncomplete" role="status" class="density-dialog-note">货物备妥窗口待核实。</p>
+      </section>
+      <FbaAppointmentFields continuous :model="form" :timezone="preview.destinationTimezone" :disabled="!writable || loading || saving || !!pending" />
       <LoadErrorState v-if="saveError" title="预约尚未创建" :message="saveError.message" :show-retry="false"><template #details><ApiErrorMeta :details="saveError" /></template></LoadErrorState>
-      <el-button type="primary" :disabled="!writable || loading" :loading="saving" @click="save">{{ pending ? '重试本次创建' : '保存预约安排' }}</el-button>
+      <div class="density-actions density-actions--footer"><el-button type="primary" :disabled="!writable || loading" :loading="saving" @click="save">{{ pending ? '重试本次创建' : '保存预约安排' }}</el-button></div>
     </template>
   </section>
 </template>