feat(business-crud-page): 优化运输计划调度弹窗UI与交互体验

- 使用全局<section-card>组件重构调度弹窗三块分区，提升视觉一致性
- 将弹窗灰底设置为#f5f6fa，调整padding及溢出滚动，增强弹窗内容可读性
- 收发货路线样式由黑实线改为主色号虚线并添加箭头，增强方向感
- 待调度列表纳入白卡容器，新增按钮及汇总文字移入列表卡extra slot
- 操作列宽度由180调整至220，预留扩展空间
- 增加分隔线和间距分割调度表底部区域，优化布局层次

src/views/business/components/business-crud-page.vue

@@ -2068,7 +2068,7 @@
             </div>
           </div>
           <div class="business-crud-page__dispatch-summary">
-            <div class="business-crud-page__dispatch-summary-left">
+            <section-card title="基本信息">
               <div class="business-crud-page__dispatch-summary-grid">
                 <div class="business-crud-page__dispatch-summary-item">
                   <div class="business-crud-page__dispatch-summary-label">客户</div>
@@ -2124,8 +2124,9 @@
                   </div>
                 </div>
               </div>
-            </div>
-            <div class="business-crud-page__dispatch-route">
+            </section-card>
+            <section-card title="收发货路线">
+              <div class="business-crud-page__dispatch-route">
               <div class="business-crud-page__dispatch-route-item">
                 <span class="business-crud-page__dispatch-route-badge is-start">起</span>
                 <div class="business-crud-page__dispatch-route-body">
@@ -2150,18 +2151,18 @@
                   <div class="business-crud-page__dispatch-route-address">
                     {{ parseDispatchRoutePoint(dispatchRow, 'end').address || '-' }}
                   </div>
-                  <div class="business-crud-page__dispatch-route-contact">
-                    {{ parseDispatchRoutePoint(dispatchRow, 'end').contact || '-' }}
-                  </div>
+                <div class="business-crud-page__dispatch-route-contact">
+                  {{ parseDispatchRoutePoint(dispatchRow, 'end').contact || '-' }}
                 </div>
               </div>
             </div>
-          </div>
+            </div>
+          </section-card>
+        </div>
         </div>
 
-        <div class="business-crud-page__dispatch-list">
-          <div class="business-crud-page__dispatch-list-head">
-            <div class="business-crud-page__dispatch-list-title">待调度列表</div>
+        <section-card title="待调度列表">
+          <template #extra>
             <el-button
               type="primary"
               :disabled="dispatchSummaryRemainingQuantity <= 0"
@@ -2169,10 +2170,10 @@
             >
               新增
             </el-button>
-            <div class="business-crud-page__dispatch-list-summary">
+            <span class="business-crud-page__dispatch-list-summary">
               {{ dispatchSummaryText }}
-            </div>
-          </div>
+            </span>
+          </template>
           <el-table
             :data="dispatchRows"
             border
@@ -2265,7 +2266,7 @@
               align="center"
               show-overflow-tooltip
             />
-            <el-table-column label="操作" width="180" align="center" fixed="right">
+            <el-table-column label="操作" width="220" align="center" fixed="right">
               <template #default="{ row, $index }">
                 <div class="business-crud-page__dispatch-actions">
                   <el-link type="primary" @click="handleDispatchEditRow(row, $index)">编辑</el-link>
@@ -2274,7 +2275,7 @@
               </template>
             </el-table-column>
           </el-table>
-        </div>
+        </section-card>
       </div>
       <template #footer>
         <div class="business-crud-page__dispatch-footer">
@@ -9131,7 +9132,10 @@ export default {
     }
 
     :deep(.el-dialog__body) {
-      padding: 0;
+      padding: 16px;
+      background: #f5f6fa;
+      max-height: calc(100vh - 140px);
+      overflow-y: auto;
     }
   }
 
@@ -9142,8 +9146,7 @@ export default {
   }
 
   &__dispatch-top {
-    padding: 22px 32px 14px;
-    border-bottom: 1px solid #e9edf5;
+    padding: 22px 0 0;
   }
 
   &__dispatch-heading {
@@ -9279,14 +9282,25 @@ export default {
   }
 
   &__dispatch-route-line {
+    position: relative;
     width: 72px;
-    height: 4px;
-    background: #3b3b3b;
-    border-radius: 999px;
-  }
+    height: 2px;
+    background-image: linear-gradient(
+      to right,
+      var(--el-color-primary) 0,
+      var(--el-color-primary) 6px,
+      transparent 6px,
+      transparent 10px
+    );
 
-  &__dispatch-list {
-    padding: 12px 18px 18px;
+    &::after {
+      content: '';
+      position: absolute;
+      right: -1px;
+      top: -4px;
+      border: 5px solid transparent;
+      border-left-color: var(--el-color-primary);
+    }
   }
 
   &__dispatch-list-head {
@@ -9340,6 +9354,9 @@ export default {
     justify-content: flex-end;
     gap: 12px;
     padding-right: 0;
+    padding-top: 16px;
+    margin-top: 16px;
+    border-top: 1px solid #e9edf5;
   }
 
   &__dispatch-item-dialog {