fix(business-crud-page): 修复合同名称列左对齐问题

- 在 business-crud-page.vue 的 contractName 插槽中新增包裹 div,强制内容左对齐
- 新增 scoped 样式 .business-crud-page__contract-name,设置 text-align: left
- contract-manage.js 保留 contractName 列 align 和 headerAlign 配置,作为兜底
- 调整合同名称列最小宽度和合同管理页面菜单宽度
- 修复车辆信用评分量化页面部分文本居中样式移除
This commit is contained in:
2026-08-20 17:05:43 +08:00
parent 8870925c60
commit e538b7f509
5 changed files with 28 additions and 11 deletions
+10
View File
@@ -129,3 +129,13 @@
## master-order 弹窗搜索栏白底补齐 ## master-order 弹窗搜索栏白底补齐
- `src/views/business/components/master-order-editor.vue` line 1815-1818:把 `.common-cargo-dialog__search` 单条白底规则改写为 `.common-address-dialog__search, .common-cargo-dialog__search { background: #fff }`,让"选择常用地址"弹窗的搜索栏也跟随既有白卡样式(其他 `.route-dialog__search` 默认无该 class,仍保留灰底)。 - `src/views/business/components/master-order-editor.vue` line 1815-1818:把 `.common-cargo-dialog__search` 单条白底规则改写为 `.common-address-dialog__search, .common-cargo-dialog__search { background: #fff }`,让"选择常用地址"弹窗的搜索栏也跟随既有白卡样式(其他 `.route-dialog__search` 默认无该 class,仍保留灰底)。
## 合同管理合同名称列左对齐修复
- 调整文件:`src/views/business/components/business-crud-page.vue``src/option/business/contract-manage.js`
- 修改内容:
1.`business-crud-page.vue``#contractName` 插槽内,用 `<div class="business-crud-page__contract-name">` 包裹 `el-link` / `span` 内容。
2.`business-crud-page.vue` 的 scoped SCSS 中新增 `.business-crud-page__contract-name { text-align: left; }`
3. 保留 `contract-manage.js``contractName` 列的 `align: 'left'` / `headerAlign: 'left'` 配置(虽然 Avue slot 列的 align 未生效,作为兜底仍保留)。
- 原因:用户反馈 `/business/contract-manage` 的合同名称列文字仍居中。Avue 自定义 slot 列的 `align` 属性似乎没有正确作用到单元格,改由插槽内容自身强制 `text-align: left` 更可靠。
- 影响:所有使用 `business-crud-page` 且渲染 `contractName` 插槽的页面,其合同名称单元格内容都会左对齐。
+3 -1
View File
@@ -251,12 +251,14 @@ export const option = createCrudOption([
{ {
label: '合同名称', label: '合同名称',
prop: 'contractName', prop: 'contractName',
align: 'left',
headerAlign: 'left',
search: true, search: true,
searchOrder: 7, searchOrder: 7,
searchPlaceholder: '请输入', searchPlaceholder: '请输入',
order: 180, order: 180,
slot: true, slot: true,
minWidth: 180, minWidth: 240,
rules: textRule('合同名称', 100, true), rules: textRule('合同名称', 100, true),
}, },
{ {
@@ -126,6 +126,7 @@
</template> </template>
<template #contractName="{ row }"> <template #contractName="{ row }">
<div class="business-crud-page__contract-name">
<el-link <el-link
v-if="config.contractNameDetail && row.contractName" v-if="config.contractNameDetail && row.contractName"
type="primary" type="primary"
@@ -134,6 +135,7 @@
{{ row.contractName }} {{ row.contractName }}
</el-link> </el-link>
<span v-else>{{ row.contractName || '-' }}</span> <span v-else>{{ row.contractName || '-' }}</span>
</div>
</template> </template>
<template #loadingNo="{ row }"> <template #loadingNo="{ row }">
@@ -13649,6 +13651,10 @@ export default {
width: 100%; width: 100%;
} }
&__contract-name {
text-align: left;
}
&__contract-expiry-search { &__contract-expiry-search {
display: flex; display: flex;
align-items: center; align-items: center;
+1 -1
View File
@@ -3,7 +3,7 @@
:api="api" :api="api"
:config="config" :config="config"
:crud-option="option" :crud-option="option"
:menu-width="252" :menu-width="280"
contract-form-page contract-form-page
/> />
</template> </template>
@@ -1129,7 +1129,6 @@ export default {
color: #303133; color: #303133;
font-size: 14px; font-size: 14px;
font-weight: 400; font-weight: 400;
text-align: center;
} }
:deep(.score-description-input .el-input__inner) { :deep(.score-description-input .el-input__inner) {