refactor(business): 优化 process-config 弹窗及多页面基本信息布局
- process-config 弹窗改为手写 el-dialog,统一与 credit-score-quantification 风格 - 弹窗内三张 section-card 堆叠,卡间间距12px,底部按钮新增保存草稿/保存并启用 - 删除原 Avue 内置 dialog 及相关表单插槽,移除无用样式,调整弹窗最大高度 - 多页面「基本信息」类分区由3列(span 8)改为4列(span 6),包含结算、合同、船舶等多处页面 - contract-manage-change.vue 手写表单列宽全部由8改6,保留备注与分区标题整行显示 - business-crud-page.vue contract配置中基本信息分区改为4列显示,调整表单 label 宽度为150px - temporary-credit-limit 详情弹窗加 align-center 实现上下居中,新增 computed 绑定配置开关 - temporary-credit-limit 弹窗宽度修改为96%,与其他业务页面保持一致 - ship.vue 标签宽度调整为最多6汉字宽,允许超长标签换行,改善显示效果 - common-route.vue 调整部分输入框宽度适配布局 - element-ui.scss 调整 process-config 相关弹窗样式,取消原 Avue 透明化样式,全局灰底内卡片间距统一 - 精简 process-config 相关 option 配置,去除 dialog 相关冗余属性 - 过程配置弹窗新增打开、保存、关闭等手写逻辑,支持查看、编辑不同状态,保持业务逻辑完整 - 删除 process-config 内部 avue-crud 相关操作,整体改用标准 el-dialog 和 el-form 实现 - 其他局部样式细节调整,保证表单布局和交互统一规范
This commit is contained in:
@@ -137,13 +137,13 @@
|
||||
:model="shipForm"
|
||||
:rules="formRules"
|
||||
label-position="right"
|
||||
label-width="auto"
|
||||
label-width="100"
|
||||
:disabled="readonly"
|
||||
class="ship-form archive-form"
|
||||
>
|
||||
<section-card title="基础船舶信息">
|
||||
<el-row :gutter="18">
|
||||
<el-col :span="8">
|
||||
<el-col :span="6">
|
||||
<el-form-item label="船舶所属组织" prop="organizationName">
|
||||
<el-select
|
||||
v-model="shipForm.organizationName"
|
||||
@@ -160,12 +160,12 @@
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-col :span="6">
|
||||
<el-form-item label="船名" prop="shipName">
|
||||
<el-input v-model="shipForm.shipName" maxlength="20" show-word-limit />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-col :span="6">
|
||||
<el-form-item label="安放龙骨日期/建造完工日期" prop="keelLayingDate">
|
||||
<div class="date-range-inline">
|
||||
<el-date-picker
|
||||
@@ -186,7 +186,7 @@
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="18">
|
||||
<el-col :span="8">
|
||||
<el-col :span="6">
|
||||
<el-form-item label="总长" prop="totalLength">
|
||||
<el-input
|
||||
v-model="shipForm.totalLength"
|
||||
@@ -196,7 +196,7 @@
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-col :span="6">
|
||||
<el-form-item label="船宽" prop="shipWidth">
|
||||
<el-input
|
||||
v-model="shipForm.shipWidth"
|
||||
@@ -206,7 +206,7 @@
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-col :span="6">
|
||||
<el-form-item label="型深" prop="moldedDepth">
|
||||
<el-input
|
||||
v-model="shipForm.moldedDepth"
|
||||
@@ -218,7 +218,7 @@
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="18">
|
||||
<el-col :span="8">
|
||||
<el-col :span="6">
|
||||
<el-form-item label="最大船高" prop="maxShipHeight">
|
||||
<el-input
|
||||
v-model="shipForm.maxShipHeight"
|
||||
@@ -228,7 +228,7 @@
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-col :span="6">
|
||||
<el-form-item label="空载吃水" prop="lightDraft">
|
||||
<el-input
|
||||
v-model="shipForm.lightDraft"
|
||||
@@ -238,7 +238,7 @@
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-col :span="6">
|
||||
<el-form-item label="满载吃水" prop="fullLoadDraft">
|
||||
<el-input
|
||||
v-model="shipForm.fullLoadDraft"
|
||||
@@ -250,7 +250,7 @@
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="18">
|
||||
<el-col :span="8">
|
||||
<el-col :span="6">
|
||||
<el-form-item label="航区" prop="navigationArea">
|
||||
<div class="navigation-area-field">
|
||||
<el-select v-model="shipForm.navigationArea" placeholder="请选择">
|
||||
@@ -1226,6 +1226,12 @@ export default {
|
||||
:deep(.el-input-number) {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
// label 固定宽度:可容纳 6 个汉字,超出自动换行
|
||||
:deep(.el-form-item__label) {
|
||||
white-space: normal;
|
||||
line-height: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
.date-range-inline {
|
||||
|
||||
Reference in New Issue
Block a user