From 84c46b93122aa4f0e0f64100b66da9a1aa278a00 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=B5=B5=E5=BF=A0=E6=9E=97?= <170083662@qq.com>
Date: Wed, 26 Aug 2026 18:43:03 +0800
Subject: [PATCH] =?UTF-8?q?style(footer):=20=E7=BB=9F=E4=B8=80=E5=A4=9A?=
 =?UTF-8?q?=E9=A1=B5=E9=9D=A2=E5=BA=95=E6=A0=8F=E6=8C=89=E9=92=AE=E6=A0=B7?=
 =?UTF-8?q?=E5=BC=8F=E4=B8=8E=E6=8E=92=E5=BA=8F=E8=A7=84=E5=88=99?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 规范 master-order-editor.vue 底栏按钮类型及排序，按钮层级清晰
- 调整 payment-application-form.vue 底栏按钮样式为右对齐并浮动底部
- 统一 invoice-application/receipt-form 页底栏按钮顺序，返回按钮置首
- 所有相关表单页按钮底栏统一采用 sticky 浮动，背景及阴影样式一致
- 修复多个页面按钮缺少 plain 样式导致视觉层级不明
- 按钮间距统一为 12px，底栏内边距调整为 12px 24px
- 调整多个表单页面按钮组从居中对齐改为右对齐，提升操作一致性
- 保留弹窗 footer 按钮布局，不影响各页面独立弹窗交互体验
---
 .workbuddy/memory/2026-08-26.md               | 60 +++++++++++++++++++
 .workbuddy/memory/MEMORY.md                   |  4 ++
 .../components/master-order-editor.vue        | 18 ++++--
 src/views/payment/bill-ledger-form.vue        | 14 +++--
 src/views/payment/bill-payment-form.vue       | 10 +++-
 .../payment/invoice-application-form.vue      | 14 +++--
 src/views/payment/invoice-receipt-form.vue    | 14 +++--
 .../payment/payment-application-form.vue      | 17 ++++--
 .../payment/receipt-claim-record-form.vue     | 11 +++-
 src/views/payment/receipt-flow-form.vue       | 16 +++--
 .../components/formal-settlement-editor.vue   |  9 ++-
 .../components/pre-settlement-editor.vue      | 13 ++--
 .../settlement/receivable-payable-detail.vue  |  2 +-
 13 files changed, 162 insertions(+), 40 deletions(-)

diff --git a/.workbuddy/memory/2026-08-26.md b/.workbuddy/memory/2026-08-26.md
index 3bc803b..6e53429 100644
--- a/.workbuddy/memory/2026-08-26.md
+++ b/.workbuddy/memory/2026-08-26.md
@@ -230,3 +230,63 @@ Avue-form 内置按钮默认在中间，自定义内容分两侧插槽：
 **未触发场景**:
 - transport-plan / waybill / loading-manage 等其它走 business-crud-page 但未声明 `standalone-form-page` 的页面，
   本次未改。需要时可按相同模式补 slot。
+
+## master-order 编辑页底栏按钮统一
+
+**问题**: `/business/master-order?mode=editor`（多联总单编辑/新增页）底部按钮没统一。
+
+**根因**: 编辑页是 `master-order.vue` 的 `mode==='editor'` 模板里内嵌 `<master-order-editor>` 组件，
+主 footer 在 `src/views/business/components/master-order-editor.vue:534-539`。
+
+**原状**:
+```
+[返回 default] [暂存 default] [确认创建 primary] [创建并调度 primary]
+```
+- 暂存 无 type，与返回同为灰描边，缺层级
+- 确认创建 / 创建并调度 两个都 primary 实心，无视觉优先级
+- footer 仅 `flex-end` + `padding:16px 0`，不浮动
+
+**修复** (`master-order-editor.vue`):
+- 按钮改：`[返回 default] [暂存 primary plain] [确认创建 primary plain] [创建并调度 primary]`
+  严格按「返回第一个、中间浅蓝 plain、最后深蓝实心」规则，仅最右一个深蓝。
+- footer 样式改浮动底部：`position: sticky; bottom:0; z-index:10; background:#fff;
+  border-top:1px solid #eff1f7; box-shadow:0 -2px 8px rgba(0,0,0,.06); gap:12px; padding:12px 24px`。
+
+**未动**: 页内各 el-dialog 的 footer（线路/地图/常用货物/货物导入等）已是 `[关闭 default][确定 primary]`，
+符合「次→主」规则，无需调整。
+
+## payment-application 表单页底栏按钮统一
+
+**问题**: `/payment/payment-application/form?mode=add`（付款申请表单页）底部按钮没统一。
+
+**根因**: 独立表单页 `src/views/payment/payment-application-form.vue` 的 `.payment-form-page__actions` footer（330 行）。
+
+**原状**:
+```
+justify-content: center（居中）
+[返回 default] [保存 default（缺 plain）] [提交 primary]
+```
+- 保存 无 type，与返回同为灰描边，缺层级
+- footer 居中且不浮动
+
+**修复** (`payment-application-form.vue`):
+- 按钮：`[返回 default] [保存 primary plain] [提交 primary]`，仅最后深蓝。
+- footer 样式：`justify-content: center` → `flex-end`；加 `position: sticky; bottom:0; z-index:10;
+  background:#fff; border-top:1px solid #eff1f7; box-shadow:0 -2px 8px rgba(0,0,0,.06); gap:12px; padding:12px 24px`。
+
+**未动**: `payment-application.vue`（list 表格页，无独立 footer）；`invoice-application-form.vue` / `invoice-receipt-form.vue` 上一轮已改。
+
+## invoice-application / invoice-receipt 表单页底栏按钮统一
+
+**问题**: `/payment/invoice-application/form?mode=add` 底部按钮没统一（用户反馈）。排查发现同族 `invoice-receipt-form.vue` 完全同款问题，一并修了。
+
+**根因**: 两个发票表单页 footer 都是 `[同步 plain][返回 default][保存 plain][提交 primary]` + `justify-content: center`（居中），且未浮动。
+- 同步 在 返回 之前，违反「返回在第一个」
+- footer 居中，不靠右、不浮动
+
+**修复**（`invoice-application-form.vue` 419-433 + 980；`invoice-receipt-form.vue` 242-256 + 777）：
+- 按钮重排为 `[返回 default][同步 plain][保存 plain][提交 primary]`，返回置首、最后仅提交深蓝。
+- footer 样式：`justify-content: center` → `flex-end`；加 `position: sticky; bottom:0; z-index:10;
+  background:#fff; border-top:1px solid #eff1f7; box-shadow:0 -2px 8px rgba(0,0,0,.06); gap:12px; padding:12px 24px`。
+
+**注意**: 之前首轮曾把这两个页「保存加 plain、返回挪到保存前面」，但当时没动 同步 的位置、没改居中/浮动，所以用户仍觉得没统一。本次彻底对齐。
diff --git a/.workbuddy/memory/MEMORY.md b/.workbuddy/memory/MEMORY.md
index b33f9d4..82f918e 100644
--- a/.workbuddy/memory/MEMORY.md
+++ b/.workbuddy/memory/MEMORY.md
@@ -54,6 +54,10 @@
   - `payment/invoice-receipt-form.vue`、`payment/invoice-application-form.vue`
   - `vehicle/customer-archive.vue` 全部 5 处 footer（`archive-form__footer` 主表单页 + `contact-dialog`/`receipt-dialog`/`invoice-dialog` 子弹窗 + `score-detail-dialog` 含总分合计）
   - `business/components/business-crud-page.vue` 的 PageAvueForm 独立表单页（`#menu-form-before` slot 新增 `关闭` 按钮，紧跟运费合计、置于保存草稿之前；shipping-template 模式验证通过）
+  - `business/components/master-order-editor.vue` 主 `<footer>`（返回 default + 暂存/确认创建 plain + 创建并调度 primary；footer 用 `position:sticky; bottom:0` 浮动底部）
+  - `payment/payment-application-form.vue` `.payment-form-page__actions`（返回 default + 保存 plain + 提交 primary；footer `justify-content:flex-end` + `position:sticky` 浮动底部）
+  - `payment/invoice-application-form.vue` `.invoice-form-page__actions`（`[返回][同步][保存][提交]`，返回置首 + 提交深蓝；footer 右对齐浮动）
+  - `payment/invoice-receipt-form.vue` `.receipt-form-page__actions`（同上，与发票申请同款结构）
 - **已合规未动**：`settlement/components/pre-settlement-editor.vue`、`settlement/components/transport-reconciliation-editor.vue`、`business/temporary-credit-limit.vue`。
 - **Avue-form footer 结构注意**：`#menu-form-before` slot 内容在 Avue 内置按钮之**左**；`#menu-form` slot 在 Avue 内置按钮之**右**。要实现 `[次要][Avue 主操作]` 顺序，把次要按钮放进 `#menu-form-before`，主操作保留 Avue 内置即可。
 - **复杂 footer 例外**：当 footer 需要在按钮组左侧展示「总分合计 / 数量统计」等聚合信息时，块用 `flex:1` 推自己到最左，按钮组按上述规则排在右半边（参考 `score-detail-dialog`）。
diff --git a/src/views/business/components/master-order-editor.vue b/src/views/business/components/master-order-editor.vue
index 0205ef7..a113b38 100644
--- a/src/views/business/components/master-order-editor.vue
+++ b/src/views/business/components/master-order-editor.vue
@@ -532,10 +532,10 @@
       </template>
     </el-dialog>
     <footer>
-      <el-button @click="$emit('back')">返回</el-button
-      ><el-button @click="saveDraft">暂存</el-button
-      ><el-button type="primary" @click="confirmCreate">确认创建</el-button
-      ><el-button type="primary" @click="createAndDispatch">创建并调度</el-button>
+      <el-button @click="$emit('back')">返回</el-button>
+      <el-button type="primary" plain @click="saveDraft">暂存</el-button>
+      <el-button type="primary" plain @click="confirmCreate">确认创建</el-button>
+      <el-button type="primary" @click="createAndDispatch">创建并调度</el-button>
     </footer>
   </div>
 </template>
@@ -2050,7 +2050,13 @@ export default {
 footer {
   display: flex;
   justify-content: flex-end;
-  gap: 8px;
-  padding: 16px 0;
+  gap: 12px;
+  padding: 12px 24px;
+  position: sticky;
+  bottom: 0;
+  z-index: 10;
+  background: #fff;
+  border-top: 1px solid #eff1f7;
+  box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.06);
 }
 </style>
diff --git a/src/views/payment/bill-ledger-form.vue b/src/views/payment/bill-ledger-form.vue
index 3ed6ac0..ca58d1c 100644
--- a/src/views/payment/bill-ledger-form.vue
+++ b/src/views/payment/bill-ledger-form.vue
@@ -267,8 +267,8 @@
       </section-card>
 
       <div class="bill-ledger-form-page__actions">
-        <el-button type="primary" :loading="saving" @click="confirmSubmit">确认</el-button>
         <el-button @click="goBack">取消</el-button>
+        <el-button type="primary" :loading="saving" @click="confirmSubmit">确认</el-button>
       </div>
     </el-form>
   </basic-container>
@@ -591,9 +591,15 @@ export default {
 }
 .bill-ledger-form-page__actions {
   display: flex;
-  justify-content: center;
-  gap: 8px;
-  padding: 16px 0 8px;
+  justify-content: flex-end;
+  gap: 12px;
+  padding: 12px 24px;
+  position: sticky;
+  bottom: 0;
+  z-index: 10;
+  background: #fff;
+  border-top: 1px solid #eff1f7;
+  box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.06);
 }
 .bill-ledger-form-page :deep(.el-table) {
   --el-table-border-color: #eff1f7;
diff --git a/src/views/payment/bill-payment-form.vue b/src/views/payment/bill-payment-form.vue
index 8d98adb..f0e359a 100644
--- a/src/views/payment/bill-payment-form.vue
+++ b/src/views/payment/bill-payment-form.vue
@@ -399,8 +399,14 @@ export default {
 .bill-payment-form-page__actions {
   display: flex;
   justify-content: flex-end;
-  gap: 8px;
-  padding: 16px 0 8px;
+  gap: 12px;
+  padding: 12px 24px;
+  position: sticky;
+  bottom: 0;
+  z-index: 10;
+  background: #fff;
+  border-top: 1px solid #eff1f7;
+  box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.06);
 }
 .bill-payment-form-page__dialog-search {
   display: flex;
diff --git a/src/views/payment/invoice-application-form.vue b/src/views/payment/invoice-application-form.vue
index 6501239..32ee56a 100644
--- a/src/views/payment/invoice-application-form.vue
+++ b/src/views/payment/invoice-application-form.vue
@@ -417,8 +417,8 @@
       </section-card>
 
       <div class="invoice-form-page__actions">
-        <el-button v-if="!readonly" type="primary" plain @click="syncReferenceData">同步</el-button>
         <el-button @click="goBack">返回</el-button>
+        <el-button v-if="!readonly" type="primary" plain @click="syncReferenceData">同步</el-button>
         <el-button
           v-if="!readonly && canSave"
           type="primary"
@@ -979,9 +979,15 @@ export default {
 }
 .invoice-form-page__actions {
   display: flex;
-  justify-content: center;
-  gap: 8px;
-  padding: 16px 0 8px;
+  justify-content: flex-end;
+  gap: 12px;
+  padding: 12px 24px;
+  position: sticky;
+  bottom: 0;
+  z-index: 10;
+  background: #fff;
+  border-top: 1px solid #eff1f7;
+  box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.06);
 }
 .invoice-form-page__attachment-upload {
   display: flex;
diff --git a/src/views/payment/invoice-receipt-form.vue b/src/views/payment/invoice-receipt-form.vue
index a9cc8ad..a00752c 100644
--- a/src/views/payment/invoice-receipt-form.vue
+++ b/src/views/payment/invoice-receipt-form.vue
@@ -240,8 +240,8 @@
       </section-card>
 
       <div class="receipt-form-page__actions">
-        <el-button v-if="!readonly" type="primary" plain @click="syncReferenceData">同步</el-button>
         <el-button @click="goBack">返回</el-button>
+        <el-button v-if="!readonly" type="primary" plain @click="syncReferenceData">同步</el-button>
         <el-button
           v-if="!readonly && canSave"
           type="primary"
@@ -776,9 +776,15 @@ export default {
 }
 .receipt-form-page__actions {
   display: flex;
-  justify-content: center;
-  gap: 8px;
-  padding: 16px 0 8px;
+  justify-content: flex-end;
+  gap: 12px;
+  padding: 12px 24px;
+  position: sticky;
+  bottom: 0;
+  z-index: 10;
+  background: #fff;
+  border-top: 1px solid #eff1f7;
+  box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.06);
 }
 .receipt-form-page__dialog-search {
   display: flex;
diff --git a/src/views/payment/payment-application-form.vue b/src/views/payment/payment-application-form.vue
index b68c2cd..32cbf16 100644
--- a/src/views/payment/payment-application-form.vue
+++ b/src/views/payment/payment-application-form.vue
@@ -328,9 +328,9 @@
         </div>
       </section-card>
       <div class="payment-form-page__actions">
-        <el-button @click="goBack">返回</el-button
-        ><el-button v-if="!readonly && canSave" @click="saveDraft(false)">保存</el-button
-        ><el-button
+        <el-button @click="goBack">返回</el-button>
+        <el-button v-if="!readonly && canSave" type="primary" plain @click="saveDraft(false)">保存</el-button>
+        <el-button
           v-if="!readonly && canSave && hasPermission('payment_application_submit')"
           type="primary"
           @click="submitForm"
@@ -1282,10 +1282,15 @@ export default {
 <style scoped lang="scss">
 .payment-form-page__actions {
   display: flex;
-  justify-content: center;
-  gap: 16px;
-  padding: 24px 0;
+  justify-content: flex-end;
+  gap: 12px;
+  padding: 12px 24px;
+  position: sticky;
+  bottom: 0;
+  z-index: 10;
+  background: #fff;
   border-top: 1px solid #eff1f7;
+  box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.06);
 }
 .payment-form-page__section-actions {
   display: flex;
diff --git a/src/views/payment/receipt-claim-record-form.vue b/src/views/payment/receipt-claim-record-form.vue
index 9abbc6a..78c22ca 100644
--- a/src/views/payment/receipt-claim-record-form.vue
+++ b/src/views/payment/receipt-claim-record-form.vue
@@ -312,8 +312,15 @@ export default {
 <style scoped lang="scss">
 .claim-record-form-page__actions {
   display: flex;
-  justify-content: center;
-  padding: 16px 0 8px;
+  justify-content: flex-end;
+  gap: 12px;
+  padding: 12px 24px;
+  position: sticky;
+  bottom: 0;
+  z-index: 10;
+  background: #fff;
+  border-top: 1px solid #eff1f7;
+  box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.06);
 }
 .claim-record-form-page__links {
   display: flex;
diff --git a/src/views/payment/receipt-flow-form.vue b/src/views/payment/receipt-flow-form.vue
index c6fb752..4b12d1b 100644
--- a/src/views/payment/receipt-flow-form.vue
+++ b/src/views/payment/receipt-flow-form.vue
@@ -165,8 +165,8 @@
         /></el-form-item>
       </section-card>
       <div class="receipt-claim-form-page__actions">
-        <el-button type="primary" :loading="submitting" @click="submitClaim">确认</el-button
-        ><el-button :disabled="submitting" @click="goBack">取消</el-button>
+        <el-button :disabled="submitting" @click="goBack">取消</el-button>
+        <el-button type="primary" :loading="submitting" @click="submitClaim">确认</el-button>
       </div>
     </el-form>
 
@@ -471,9 +471,15 @@ export default {
 }
 .receipt-claim-form-page__actions {
   display: flex;
-  justify-content: center;
-  gap: 8px;
-  padding: 16px 0 8px;
+  justify-content: flex-end;
+  gap: 12px;
+  padding: 12px 24px;
+  position: sticky;
+  bottom: 0;
+  z-index: 10;
+  background: #fff;
+  border-top: 1px solid #eff1f7;
+  box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.06);
 }
 .receipt-claim-form-page__dialog-search {
   display: flex;
diff --git a/src/views/settlement/components/formal-settlement-editor.vue b/src/views/settlement/components/formal-settlement-editor.vue
index 5ddb102..47750b0 100644
--- a/src/views/settlement/components/formal-settlement-editor.vue
+++ b/src/views/settlement/components/formal-settlement-editor.vue
@@ -1546,9 +1546,14 @@ export default {
 .formal-editor__page-actions {
   display: flex;
   justify-content: flex-end;
-  padding: 16px 0 4px;
+  padding: 12px 24px;
   border-top: 1px solid #eff1f7;
-  gap: 8px;
+  gap: 12px;
+  position: sticky;
+  bottom: 0;
+  z-index: 10;
+  background: #fff;
+  box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.06);
 }
 .formal-editor__links {
   display: flex;
diff --git a/src/views/settlement/components/pre-settlement-editor.vue b/src/views/settlement/components/pre-settlement-editor.vue
index 8d7f1c4..9cd4527 100644
--- a/src/views/settlement/components/pre-settlement-editor.vue
+++ b/src/views/settlement/components/pre-settlement-editor.vue
@@ -393,7 +393,7 @@
 
     <template v-if="!pageMode" #footer>
       <el-button @click="visible = false">取消</el-button>
-      <el-button v-if="editable" :loading="saving" @click="saveDraft(false)">保存</el-button>
+      <el-button v-if="editable" type="primary" plain :loading="saving" @click="saveDraft(false)">保存</el-button>
       <el-button
         v-if="editable && hasPermission('pre_settlement_submit')"
         type="primary"
@@ -405,7 +405,7 @@
     </template>
     <div v-if="pageMode" class="pre-settlement-editor__page-actions">
       <el-button @click="visible = false">取消</el-button>
-      <el-button v-if="editable" :loading="saving" @click="saveDraft(false)">保存</el-button>
+      <el-button v-if="editable" type="primary" plain :loading="saving" @click="saveDraft(false)">保存</el-button>
       <el-button
         v-if="editable && hasPermission('pre_settlement_submit')"
         type="primary"
@@ -1529,9 +1529,14 @@ export default {
   &__page-actions {
     display: flex;
     justify-content: flex-end;
-    padding: 16px 0 4px;
+    padding: 12px 24px;
     border-top: 1px solid #eff1f7;
-    gap: 8px;
+    gap: 12px;
+    position: sticky;
+    bottom: 0;
+    z-index: 10;
+    background: #fff;
+    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.06);
   }
 
   &__form {
diff --git a/src/views/settlement/receivable-payable-detail.vue b/src/views/settlement/receivable-payable-detail.vue
index d95d667..c6efc5c 100644
--- a/src/views/settlement/receivable-payable-detail.vue
+++ b/src/views/settlement/receivable-payable-detail.vue
@@ -597,7 +597,7 @@
       </div>
       <template #footer>
         <el-button @click="previewDialog.visible = false">取消</el-button>
-        <el-button type="primary" @click="backToGenerateDialog">上一步</el-button>
+        <el-button type="primary" plain @click="backToGenerateDialog">上一步</el-button>
         <el-button type="primary" :loading="previewDialog.submitting" @click="submitGenerateFee">
           提交
         </el-button>