fix(styles): 优化多页面表单及弹窗样式统一性和功能

- 全站业务状态标签文字化,el-tag.status-text 转为纯文本,统一字号、行高和基线对齐
- 临时额度详情弹窗加宽 label 列宽至 180px,避免标签折成三行
- 年检记录费用字段将单位“元”移至标签内,清理无效 append 配置和 template 代码
- 维修记录里程字段单位动态显示于标签,移除输入框右侧单位后缀
- 全站 Avue CRUD 弹窗标题自动添加页面全称,支持手动覆盖和自定义
- 合同管理独立表单页顶部补充“新增合同管理”标题,统一与其它表单页面样式
- 结算-正式结算页表格整合到“应付/应收”两个标签页内,复用组件并调整操作列宽度至320px
- 业务相关弹窗和组件统一支持 dialogCustomClass 传递及样式适配
- 取消部分页面样式中冗余或注释代码,调整组件内按钮布局和权限判断函数逻辑
- 新增全局 mixin 以设置 CRUD 弹窗标题,主入口 main.js 注册相关初始化函数
This commit is contained in:
2026-08-25 15:18:44 +08:00
parent 2bd9d8c047
commit 1625fb292d
16 changed files with 234 additions and 267 deletions
+41
View File
@@ -0,0 +1,41 @@
/**
* 全站 Avue CRUD 新增/编辑/查看弹窗标题自动注入
*
* 默认情况下 Avue 弹窗标题走 i18n,只显示「新增 / 编辑 / 查看」。
* 本 mixin 在组件创建时自动根据当前菜单中文标题拼出完整标题,例如:
* 「新增空港机场主数据」/「编辑空港机场主数据」/「查看空港机场主数据」
*
* 标题来源优先级:
* 1. 页面自定义方法 getCrudPageTitle()(若存在)
* 2. 当前路由中文菜单标题(this.$router.$avueRouter.generateTitle
*
* 若页面已在 option 中手动配置了 addTitle / editTitle / viewTitle,则不覆盖。
*/
export function setupCrudDialogTitle(app) {
app.mixin({
created() {
if (!this.option || typeof this.option !== 'object') return;
if (!Array.isArray(this.option.column)) return;
if (this.option._dialogTitleInjected) return;
const getTitle =
typeof this.getCrudPageTitle === 'function'
? this.getCrudPageTitle
: () => {
const router = this.$router;
if (router && router.$avueRouter) {
return router.$avueRouter.generateTitle(this.$route, { label: 'name' });
}
return (this.$route && this.$route.meta && this.$route.meta.title) || '';
};
const title = getTitle();
if (!title) return;
this.option.addTitle = this.option.addTitle || `新增${title}`;
this.option.editTitle = this.option.editTitle || `编辑${title}`;
this.option.viewTitle = this.option.viewTitle || `查看${title}`;
this.option._dialogTitleInjected = true;
},
});
}