style(ui): 统一弹窗分组白卡样式并改造相关弹窗布局

- 新增全局弹窗灰底背景色，提升视觉一致性
- 新增通用分组白卡组件 section-card，标题融入卡头，支持额外插槽
- 统一 Avue 弹窗表单及分组为白卡样式
- 调整 common-route.vue 弹窗，使用 section-card 分组包裹查询条件与常用地址
- 改造 loading-manage.vue 弹窗所有分区，采用 section-card 统一风格
- 全局样式调整弹窗内容区表单项间距及两列表单布局工具类
- 在 main.js 全局注册 section-card 组件，便于项目统一复用

src/views/business/loading-manage.vue

@@ -358,8 +358,8 @@
           label-width="auto"
           class="loading-manage-dialog__form"
         >
-          <div class="dialog-section-title">配载基本信息</div>
-          <div class="loading-manage-dialog__grid">
+          <section-card title="配载基本信息">
+            <div class="loading-manage-dialog__grid">
             <el-form-item label="配载单号">
               <el-input v-model="dialogForm.loadingNo" disabled placeholder="系统自动生成" />
             </el-form-item>
@@ -449,12 +449,13 @@
               />
             </el-form-item>
           </div>
+          </section-card>
 
-          <div class="dialog-section-title loading-manage-dialog__title-action">
-            <span>筛选待配载运单</span>
-            <el-link v-if="!dialogReadonly" type="primary" @click="loadCandidateWaybills">筛选</el-link>
-          </div>
-          <div class="loading-manage-dialog__candidate-search" v-if="candidateSearchVisible">
+          <section-card title="筛选待配载运单">
+            <template #extra>
+              <el-link v-if="!dialogReadonly" type="primary" @click="loadCandidateWaybills">筛选</el-link>
+            </template>
+            <div class="loading-manage-dialog__candidate-search" v-if="candidateSearchVisible">
             <el-row :gutter="16">
               <el-col :span="6">
                 <el-form-item label="运单号">
@@ -733,13 +734,14 @@
               @current-change="handleCandidateCurrentChange"
             />
           </div>
+          </section-card>
 
-          <div class="dialog-section-title">待配载列表</div>
-          <el-table
-            :data="selectedWaybillRows"
-            border
-            class="loading-manage-dialog__selected-table"
-          >
+          <section-card title="待配载列表">
+            <el-table
+              :data="selectedWaybillRows"
+              border
+              class="loading-manage-dialog__selected-table"
+            >
             <el-table-column type="index" label="序号" width="70" align="center" />
             <el-table-column prop="waybillNo" label="运单号" min-width="150">
               <template #default="{ row }">
@@ -768,10 +770,11 @@
                 >移除</el-link>
               </template>
             </el-table-column>
-          </el-table>
+            </el-table>
+          </section-card>
 
-          <div class="dialog-section-title">路线信息</div>
-          <div class="loading-manage-dialog__route-list" v-if="routeNodes.length">
+          <section-card title="路线信息">
+            <div class="loading-manage-dialog__route-list" v-if="routeNodes.length">
             <div
               v-for="(node, index) in routeNodes"
               :key="node.key"
@@ -788,11 +791,12 @@
                 <el-tag v-for="tag in node.tags" :key="tag" size="small">{{ tag }}</el-tag>
               </span>
             </div>
-          </div>
-          <el-empty v-else description="添加待配载运单后自动生成路线" :image-size="72" />
+            </div>
+            <el-empty v-else description="添加待配载运单后自动生成路线" :image-size="72" />
+          </section-card>
 
-          <div class="dialog-section-title">货物信息</div>
-          <el-table :data="cargoRows" border class="loading-manage-dialog__cargo-table">
+          <section-card title="货物信息">
+            <el-table :data="cargoRows" border class="loading-manage-dialog__cargo-table">
             <el-table-column type="index" label="序号" width="70" align="center" fixed="left" />
             <el-table-column prop="projectName" label="项目名称" min-width="150" />
             <el-table-column prop="cargoName" label="货物名称" min-width="140" />
@@ -806,10 +810,11 @@
             <el-table-column prop="materialCode" label="物料编码" min-width="130" />
             <el-table-column prop="equipmentCode" label="设备编码" min-width="130" />
             <el-table-column prop="remark" label="备注" min-width="180" show-overflow-tooltip />
-          </el-table>
+            </el-table>
+          </section-card>
 
-          <div class="dialog-section-title">任务信息</div>
-          <div class="loading-manage-dialog__carrier-tabs">
+          <section-card title="任务信息">
+            <div class="loading-manage-dialog__carrier-tabs">
             <el-segmented
               v-model="dialogForm.carrierType"
               :options="carrierTypeOptions"
@@ -913,6 +918,7 @@
               />
             </el-form-item>
           </div>
+          </section-card>
         </el-form>
       </div>
 
@@ -1882,10 +1888,8 @@ export default {
   }
 
   .loading-manage-dialog__candidate-search {
-    padding: 12px 12px 4px;
+    padding: 4px 0;
     margin-bottom: 8px;
-    background: #fff;
-    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
   }
 
   .loading-manage-dialog__candidate-actions,