From 87ec01c8dded78e974ad64d99ceae0898ce229cb 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, 2 Sep 2026 12:11:18 +0800
Subject: [PATCH] =?UTF-8?q?style(payment):=20=E8=B0=83=E6=95=B4=E8=B4=A6?=
 =?UTF-8?q?=E5=8D=95=E6=90=9C=E7=B4=A2=E7=BB=84=E4=BB=B6=E6=93=8D=E4=BD=9C?=
 =?UTF-8?q?=E6=A0=8F=E5=B8=83=E5=B1=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 将操作栏从水平方向排列改为垂直方向排列
- 调整按钮和标签间距增大，标签左对齐，按钮右对齐
- 标签和按钮分成独立两行显示，提高界面清晰度

style(transportCapacity): 统一到期快捷筛选标签布局及样式

- 将到期快捷筛选标签由搜索菜单槽位移至头部槽位独立一行
- 移除原先纵向顺序和内联样式，增加标签上下间距
- 统一 driver、ship、vehicle 三个页面到期标签的外观和结构
- 优化标签容器的 margin 边距，取消排序和宽度限制

style(transportCapacity/ship): 统一弹窗内输入控件宽度

- 删除强制设置 .el-input__wrapper 宽度为 150px 的样式
- 增加输入框、选择框及级联选择器等组件宽度为 100% 的样式覆盖
- 保证新增和修改弹窗内所有表单输入控件宽度一致，提升界面整齐度
---
 .workbuddy/memory/2026-09-02.md               | 20 ++++++++
 .../payment/components/bill-ledger-search.vue | 47 +++++++------------
 src/views/transportCapacity/driver.vue        |  7 ++-
 src/views/transportCapacity/ship.vue          | 13 +++--
 src/views/transportCapacity/vehicle.vue       |  7 ++-
 5 files changed, 49 insertions(+), 45 deletions(-)
 create mode 100644 .workbuddy/memory/2026-09-02.md

diff --git a/.workbuddy/memory/2026-09-02.md b/.workbuddy/memory/2026-09-02.md
new file mode 100644
index 0000000..9259a2f
--- /dev/null
+++ b/.workbuddy/memory/2026-09-02.md
@@ -0,0 +1,20 @@
+# 2026-09-02 工作日志
+
+## 合同/运力页「到期快捷筛选」标签统一改为独立一行
+- 需求：把 avue-crud 搜索栏 `#search-menu` 里的 `<el-check-tag>` 到期快捷筛选组，移出搜索栏、单独成一行（搜索卡下方、表格上方），不加卡片包裹。
+- 实现：改用 avue-crud 的 `#header` 插槽承载该组；CSS 由 `order:-1; margin-right:12px; min-width:0`（搜索按钮行内联）改为 `margin-bottom:12px`（独立行）。
+- 涉及文件（4 处，均已改）：
+  - `src/views/business/contract-manage.vue`（首改，用 `.contract-manage-page__expiry-search`）
+  - `src/views/transportCapacity/vehicle.vue`（`.transport-vehicle-page__expiry-tags`）
+  - `src/views/transportCapacity/driver.vue`（`.driver-page__expiry-tags`）
+  - `src/views/transportCapacity/ship.vue`（`.transport-ship-page__expiry-tags`）
+- 各页变量名保留原样（contract-manage 用 contractExpiryScope/changeExpiryScope/contractExpiryStats；运力页用 query.expireStatus/handleExpireChange/expiryStat）。
+- 已补改：`src/views/payment/components/bill-ledger-search.vue` —— 独立自定义搜索子组件。`bill-ledger-search__actions` 由「标签+按钮同一行(右对齐)」改为 `flex-direction:column; gap:12px`：标签独立一行（左对齐，去掉 justify-content:flex-end），按钮另起一行右对齐。标签变量 shortcutOptions/query.expiryShortcut 不变。用户确认需统一，故改之。
+
+## transportCapacity/ship 新增弹窗 input 宽度统一
+- 问题：新增/修改弹窗内输入控件宽度不一致（文本框明显窄于下拉框、日期框）。
+- 根因：`src/views/transportCapacity/ship.vue` 末尾 scoped 样式中独有 `.el-input__wrapper{width:150px !important}`，把文本框包裹层强制压成 150px，而 `el-select`（用 `.el-select__wrapper`）、日期/数字框不受影响 → 文本框与下拉框宽度不齐。同模块的 driver.vue / vehicle.vue 均无此规则。
+- 修复：
+  1. 删除 `.el-input__wrapper{width:150px!important}` 异常规则。
+  2. 增强 `.ship-form` 内输入控件的 100% 宽度覆盖，补齐 `.el-select__wrapper` / `.el-cascader` / `.el-input__wrapper`，使文本框/下拉/日期/数字框均 100% 填满所在栅格列。
+- 说明：弹窗仍保留不同栅格列宽（span6/8/12/16）的密集布局，同行字段已等宽；若需跨行全部 input 绝对像素等宽（统一栅格列宽），需进一步重排。
diff --git a/src/views/payment/components/bill-ledger-search.vue b/src/views/payment/components/bill-ledger-search.vue
index 22709c2..9960ca4 100644
--- a/src/views/payment/components/bill-ledger-search.vue
+++ b/src/views/payment/components/bill-ledger-search.vue
@@ -43,33 +43,21 @@
           </el-select>
         </el-form-item>
       </div>
-      <div class="bill-ledger-search__actions">
-        <div class="bill-ledger-search__actions-tags">
-          <el-check-tag
-            v-for="item in shortcutOptions"
-            :key="item.value"
-            :checked="query.expiryShortcut === item.value"
-            @change="handleShortcutChange(item.value)"
-          >
-            {{ item.label }}
-          </el-check-tag>
-        </div>
-        <div class="bill-ledger-search__actions-buttons">
-          <el-button type="primary" :loading="loading" @click="$emit('search')">
-            <el-icon><Search /></el-icon>
-            <span>搜索</span>
+      <div class="bill-ledger-search__actions-buttons">
+        <el-button type="primary" :loading="loading" @click="$emit('search')">
+          <el-icon><Search /></el-icon>
+          <span>搜索</span>
+        </el-button>
+        <el-button @click="$emit('reset')">
+          <el-icon><Delete /></el-icon>
+          <span>重置</span>
+        </el-button>
+        <el-tooltip :content="expanded ? '折叠' : '展开'" placement="top">
+          <el-button text @click="expanded = !expanded">
+            <el-icon><component :is="expanded ? ArrowUp : ArrowDown" /></el-icon>
+            <span>{{ expanded ? '折叠' : '展开' }}</span>
           </el-button>
-          <el-button @click="$emit('reset')">
-            <el-icon><Delete /></el-icon>
-            <span>重置</span>
-          </el-button>
-          <el-tooltip :content="expanded ? '折叠' : '展开'" placement="top">
-            <el-button text @click="expanded = !expanded">
-              <el-icon><component :is="expanded ? ArrowUp : ArrowDown" /></el-icon>
-              <span>{{ expanded ? '折叠' : '展开' }}</span>
-            </el-button>
-          </el-tooltip>
-        </div>
+        </el-tooltip>
       </div>
     </el-form>
   </section>
@@ -138,20 +126,19 @@ export default {
 }
 .bill-ledger-search__actions {
   display: flex;
-  align-items: center;
-  justify-content: flex-end;
-  gap: 8px;
+  flex-direction: column;
+  gap: 12px;
   margin-bottom: 8px;
 }
 .bill-ledger-search__actions-buttons {
   display: flex;
   align-items: center;
+  justify-content: flex-end;
   gap: 8px;
 }
 .bill-ledger-search__actions-tags {
   display: flex;
   align-items: center;
-  justify-content: flex-end;
   flex-wrap: wrap;
   gap: 8px;
 }
diff --git a/src/views/transportCapacity/driver.vue b/src/views/transportCapacity/driver.vue
index 94259fc..708249e 100644
--- a/src/views/transportCapacity/driver.vue
+++ b/src/views/transportCapacity/driver.vue
@@ -41,7 +41,7 @@
           >批量删除
         </el-button>
       </template>
-      <template #search-menu>
+      <template #header>
         <div class="driver-page__expiry-tags">
           <el-check-tag
             v-for="item in expiryTagOptions"
@@ -1724,9 +1724,8 @@ export default {
     flex-wrap: wrap;
     align-items: center;
     gap: 8px;
-    order: -1;
-    margin-right: 12px;
-    min-width: 0;
+    margin-top: 8px;
+    margin-bottom: 16px;
 
     :deep(.el-check-tag) {
       margin: 0;
diff --git a/src/views/transportCapacity/ship.vue b/src/views/transportCapacity/ship.vue
index 302491d..e052d13 100644
--- a/src/views/transportCapacity/ship.vue
+++ b/src/views/transportCapacity/ship.vue
@@ -44,7 +44,7 @@
           批量删除
         </el-button>
       </template>
-      <template #search-menu>
+      <template #header>
         <div class="transport-ship-page__expiry-tags">
           <el-check-tag
             v-for="item in expiryTagOptions"
@@ -1199,9 +1199,8 @@ export default {
     flex-wrap: wrap;
     align-items: center;
     gap: 8px;
-    order: -1;
-    margin-right: 12px;
-    min-width: 0;
+    margin-top: 8px;
+    margin-bottom: 16px;
 
     :deep(.el-check-tag) {
       margin: 0;
@@ -1219,7 +1218,10 @@ export default {
   :deep(.el-date-editor.el-input),
   :deep(.el-date-editor.el-input__wrapper),
   :deep(.el-select),
+  :deep(.el-select__wrapper),
+  :deep(.el-cascader),
   :deep(.el-input),
+  :deep(.el-input__wrapper),
   :deep(.el-input-number) {
     width: 100%;
   }
@@ -1374,7 +1376,4 @@ export default {
 .el-form-item {
   margin-bottom: 14px !important;
 }
-.el-input__wrapper{
-  width: 150px !important;
-}
 </style>
diff --git a/src/views/transportCapacity/vehicle.vue b/src/views/transportCapacity/vehicle.vue
index 8026573..b324d3a 100644
--- a/src/views/transportCapacity/vehicle.vue
+++ b/src/views/transportCapacity/vehicle.vue
@@ -41,7 +41,7 @@
           >批量删除
         </el-button>
       </template>
-      <template #search-menu>
+      <template #header>
         <div class="transport-vehicle-page__expiry-tags">
           <el-check-tag
             v-for="item in expiryTagOptions"
@@ -1407,9 +1407,8 @@ export default {
     flex-wrap: wrap;
     align-items: center;
     gap: 8px;
-    order: -1;
-    margin-right: 12px;
-    min-width: 0;
+    margin-top: 8px;
+    margin-bottom: 16px;
 
     :deep(.el-check-tag) {
       margin: 0;