feat(table): 调整表格操作列宽度并统一文字链接间距

- /business/project-apply 主表操作列宽度固定为 220,移除 applyTableMenuWidth 调用
- /business/temporary-credit-limit 通过传入 menuWidth prop 固定操作列宽度为 180
- /base/common-address 操作列宽度由 220 降至 180
- /business/process-config 操作列宽度由 320 调整为 180,修复末尾语法错误
- /vehicle/insurance-record 操作列宽度先降至 140 后改回 160,后全部车/船务管理模块记录页统一为 180
- 多个车/船务管理模块相关 option 文件及 vue 文件操作列宽统调为 180
- 新增 business-crud-page 组件 menuWidth prop,支持外部传值控制操作列宽度
- 全站操作列文字链接去除 el-link 默认 margin,避免和 gap 叠加导致文字间距过宽
- 优化操作列按钮过多时自动换行展示逻辑,确保按钮不被裁切
This commit is contained in:
2026-08-06 23:55:30 +08:00
parent 454608d7be
commit cf04d48010
25 changed files with 123 additions and 37 deletions

View File

@@ -3871,6 +3871,11 @@ export default {
type: Object,
default: () => ({ column: [] }),
},
// 可选:固定操作列宽度;不传则按按钮数量自动估算(沿用既有逻辑)
menuWidth: {
type: Number,
default: null,
},
},
data() {
return {
@@ -3918,7 +3923,11 @@ export default {
defaultDialogButtons: null,
contractCreateActionLoading: '',
transportPlanCreateActionLoading: '',
option: this.cloneOption(this.crudOption, estimateMenuButtonCount(this.config)),
option: (() => {
const opt = this.cloneOption(this.crudOption, estimateMenuButtonCount(this.config));
if (this.menuWidth != null) opt.menuWidth = this.menuWidth;
return opt;
})(),
selectedProjectId: '',
projectOptions: [],
projectLoading: false,

View File

@@ -1,5 +1,5 @@
<template>
<business-crud-page :api="api" :config="config" :crud-option="option" />
<business-crud-page :api="api" :config="config" :crud-option="option" :menu-width="245" />
</template>
<script>

View File

@@ -695,7 +695,6 @@ import { getDictionary as getSystemDictionary } from '@/api/system/dict';
import { getDictionary as getBizDictionary } from '@/api/system/dictbiz';
import { getList as getUserList } from '@/api/system/user';
import { getToken } from '@/utils/auth';
import { applyTableMenuWidth } from '@/utils/table-menu';
import { downloadFileByUrl, downloadXls } from '@/utils/util';
import { mapGetters } from 'vuex';
import NProgress from 'nprogress';
@@ -1036,18 +1035,17 @@ export default {
},
methods: {
buildTableOption() {
return applyTableMenuWidth(
{
...option,
dialogType: 'dialog',
addBtn: false,
viewBtn: false,
editBtn: false,
delBtn: false,
column: (option.column || []).map(column => ({ ...column, display: false })),
},
4
);
return {
...option,
dialogType: 'dialog',
addBtn: false,
viewBtn: false,
editBtn: false,
delBtn: false,
// 操作列收窄本项目操作按钮较少320px 过宽,调整为 220px链接会自动换行兜底
menuWidth: 180,
column: (option.column || []).map(column => ({ ...column, display: false })),
};
},
hasPermission(code) {
return this.isAdmin || this.validData(this.permission && this.permission[code], false);

View File

@@ -1,5 +1,5 @@
<template>
<business-crud-page :api="api" :config="config" :crud-option="option" />
<business-crud-page :api="api" :config="config" :crud-option="option" :menu-width="270" />
</template>
<script>

View File

@@ -1,5 +1,5 @@
<template>
<business-crud-page :api="api" :config="config" :crud-option="option" />
<business-crud-page :api="api" :config="config" :crud-option="option" :menu-width="270" />
</template>
<script>

View File

@@ -1,5 +1,5 @@
<template>
<business-crud-page :api="api" :config="config" :crud-option="option" />
<business-crud-page :api="api" :config="config" :crud-option="option" :menu-width="220" />
</template>
<script>