fix: 修复表单禁用状态和加载逻辑问题

修复发货表单字段的禁用状态逻辑,移除多余的readonly属性
调整取消分卷操作的加载状态处理,确保在finally中重置状态
优化钢卷选择器组件,增加切边和包装筛选及显示列
将结算方式输入框改为下拉选择框,提升用户体验
This commit is contained in:
砂糖
2026-01-29 15:04:06 +08:00
parent b7a171b599
commit a9fb6d51b1
5 changed files with 53 additions and 29 deletions

View File

@@ -47,6 +47,19 @@
<muti-select v-model="queryParams.itemManufacturer" :options="dict.type.coil_manufacturer" placeholder="请选择厂家"
clearable />
</el-form-item>
<el-form-item label="切边" prop="trimmingRequirement" v-if="orderBy">
<el-select v-model="queryParams.trimmingRequirement" placeholder="请选择切边" clearable style="width: 100%">
<el-option label="净边" value="净边" />
<el-option label="毛边" value="毛边" />
</el-select>
</el-form-item>
<el-form-item label="包装" prop="packagingRequirement" v-if="orderBy">
<el-select v-model="queryParams.packagingRequirement" placeholder="请选择包装" clearable style="width: 100%">
<el-option label="裸包" value="裸包" />
<el-option label="普包" value="普包" />
<el-option label="简包" value="简包" />
</el-select>
</el-form-item>
<el-form-item label="实际库区" v-if="orderBy">
<actual-warehouse-select v-model="queryParams.actualWarehouseId" placeholder="请选择实际库区" canSelectLevel2
canSelectDisabled />
@@ -59,10 +72,13 @@
</el-form>
<!-- 数据表格 -->
<el-table v-if="!salesRestricted" v-loading="loading" :data="coilList" @row-click="handleRowClick" height="400px" style="width: 100%" :row-class-name="getRowClassName">
<el-table v-if="!salesRestricted" v-loading="loading" :data="coilList" @row-click="handleRowClick" height="400px"
style="width: 100%" :row-class-name="getRowClassName">
<!-- 自定义列 -->
<el-table-column v-for="column in renderColumns" :label="column.label" :align="column.align" :prop="column.prop"
:width="column.width" :show-overflow-tooltip="column.showOverflowTooltip" />
<el-table-column v-if="orderBy" label="切边" prop="trimmingRequirement"></el-table-column>
<el-table-column v-if="orderBy" label="包装" prop="packagingRequirement"></el-table-column>
</el-table>
<div v-else>
@@ -72,11 +88,13 @@
</el-tabs>
<!-- 增加 row-class-name 绑定动态设置行样式 -->
<el-table v-loading="loading" :data="coilList" @row-click="handleRowClick" height="400px"
style="width: 100%" :row-class-name="getRowClassName">
<el-table v-loading="loading" :data="coilList" @row-click="handleRowClick" height="400px" style="width: 100%"
:row-class-name="getRowClassName">
<!-- 自定义列 -->
<el-table-column v-for="column in renderColumns" :label="column.label" :align="column.align"
:prop="column.prop" :width="column.width" :show-overflow-tooltip="column.showOverflowTooltip" />
<el-table-column v-if="orderBy" label="切边" prop="trimmingRequirement"></el-table-column>
<el-table-column v-if="orderBy" label="包装" prop="packagingRequirement"></el-table-column>
</el-table>
</div>
@@ -291,17 +309,17 @@ export default {
// 动态生成表格行类名 - 综合处理选中、禁用等状态
getRowClassName({ row }) {
const classNames = [];
// 检查是否为已选中的钢卷
if (this.selectedCoilIds.has(row.coilId)) {
classNames.push('selected-coil-row');
}
// 销售受限模式下,判断当前行是否有权限
if (this.salesRestricted && row.saleId !== this.currentUserId) {
classNames.push('disabled-coil-row'); // 禁用行类名
}
return classNames.join(' ');
},
@@ -544,12 +562,14 @@ export default {
// 核心:已选钢卷样式(黄色背景)
::v-deep .el-table .selected-coil-row {
background-color: #fffbe6 !important; /* 浅黄色背景 */
&:hover > td {
background-color: #fff8d9 !important; /* hover时稍深一点的黄色 */
background-color: #fffbe6 !important;
/* 浅黄色背景 */
&:hover>td {
background-color: #fff8d9 !important;
/* hover时稍深一点的黄色 */
}
// 当同时是当前行时
&.current-row {
background-color: #fff8d9 !important;
@@ -563,7 +583,7 @@ export default {
cursor: not-allowed !important;
// 覆盖hover高亮
&:hover > td {
&:hover>td {
background-color: #f8f8f8 !important;
}
@@ -577,12 +597,12 @@ export default {
pointer-events: none;
user-select: none; // 禁止文本选中
}
// 当同时是已选行时(优先级:禁用 > 已选)
&.selected-coil-row {
background-color: #f5f5f5 !important;
&:hover > td {
&:hover>td {
background-color: #f5f5f5 !important;
}
}

View File

@@ -46,7 +46,7 @@
</el-col>
<el-col :span="12">
<el-form-item label="班组" prop="team">
<el-select v-model="form.team" placeholder="请选择班组" style="width: 100%" :disabled="readonly">
<el-select v-model="form.team" placeholder="请选择班组" style="width: 100%">
<el-option key="甲" label="甲" value="甲" />
<el-option key="乙" label="乙" value="乙" />
</el-select>
@@ -77,25 +77,25 @@
<el-row>
<el-col :span="12">
<el-form-item label="质量状态" prop="qualityStatus">
<el-input v-model="form.qualityStatus" placeholder="请输入质量状态" :disabled="readonly">
<el-input v-model="form.qualityStatus" placeholder="请输入质量状态">
</el-input>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="切边要求" prop="trimmingRequirement">
<el-input v-model="form.trimmingRequirement" placeholder="请输入切边要求" :disabled="readonly">
<el-input v-model="form.trimmingRequirement" placeholder="请输入切边要求">
</el-input>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="打包状态" prop="packingStatus">
<el-input v-model="form.packingStatus" placeholder="请输入打包状态" :disabled="readonly">
<el-input v-model="form.packingStatus" placeholder="请输入打包状态">
</el-input>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="包装要求" prop="packagingRequirement">
<el-input v-model="form.packagingRequirement" placeholder="请输入包装要求" :disabled="readonly">
<el-input v-model="form.packagingRequirement" placeholder="请输入包装要求">
</el-input>
</el-form-item>
</el-col>

View File

@@ -768,10 +768,11 @@ export default {
this.buttonLoading = true
cancelSpecialSplit(row.actionId).then(response => {
this.$message.success('取消分卷成功')
this.stepSpilt.loading = false
this.buttonLoading = false
this.getPendingAction() // 刷新待操作列表
this.getStepSplitList()
}).finally(() => {
this.stepSpilt.loading = false
this.buttonLoading = false
})
})
},

View File

@@ -7,7 +7,7 @@
<el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd">新增</el-button>
</el-col>
<el-col :span="1.5">
<coil-selector :use-trigger="true" multiple @confirm="handleBatchAdd"
<coil-selector dialogWidth="1200px" :use-trigger="true" multiple @confirm="handleBatchAdd"
:filters="{ selectType: 'product', status: 0, excludeBound: true, orderBy: true }" :orderBy="true">
<el-button type="primary" plain icon="el-icon-plus" size="mini">批量新增</el-button>
</coil-selector>
@@ -54,7 +54,7 @@
<el-form ref="form" :model="form" label-width="80px">
<el-form-item label="发货钢卷" prop="coilId">
<div style="display: flex; gap: 10px;">
<coil-selector v-model="form.coilId" :use-trigger="true"
<coil-selector dialogWidth="1200px" v-model="form.coilId" :use-trigger="true"
:filters="{ selectType: 'product', status: 0, excludeBound: true, orderBy: true }" @select="handleSelect"
:orderBy="true" />
<el-checkbox v-model="autoFillForm" label="自动填写表单信息" />
@@ -67,20 +67,23 @@
</el-select>
</el-form-item>
<el-form-item label="切边" prop="edgeType">
<el-select v-model="form.edgeType" placeholder="请选择切边" style="width: 100%">
<el-select v-model="form.edgeType" placeholder="请选择切边" clearable style="width: 100%">
<el-option label="净边料" value="净边料" />
<el-option label="毛边料" value="毛边料" />
</el-select>
</el-form-item>
<el-form-item label="包装" prop="packaging">
<el-select v-model="form.packaging" placeholder="请选择包装" style="width: 100%">
<el-select v-model="form.packaging" placeholder="请选择包装" clearable style="width: 100%">
<el-option label="裸包" value="裸包" />
<el-option label="普包" value="普包" />
<el-option label="简包" value="简包" />
</el-select>
</el-form-item>
<el-form-item label="结算方式" prop="settlementType">
<el-input v-model="form.settlementType" placeholder="请输入结算方式" />
<el-select v-model="form.settlementType" placeholder="请选择结算方式" style="width: 100%">
<el-option label="磅重结算" value="磅重结算" />
<el-option label="卷重结算" value="卷重结算" />
</el-select>
</el-form-item>
<el-form-item label="原料厂家" prop="rawMaterialFactory">
<el-input v-model="form.rawMaterialFactory" placeholder="请输入原料厂家" />
@@ -139,7 +142,7 @@ export default {
waybillId: {
handler(newVal, oldVal) {
// if (newVal) {
this.getList();
this.getList();
// }
},
immediate: true

View File

@@ -118,7 +118,7 @@
<script>
import { listDeliveryWaybill, getDeliveryWaybill, delDeliveryWaybill, addDeliveryWaybill, updateDeliveryWaybill, updateDeliveryWaybillStatus } from "@/api/wms/deliveryWaybill";
import { listDeliveryPlan, listSelectableCoils } from "@/api/wms/deliveryPlan"; // 导入发货计划API
import { listSelectableCoils } from "@/api/wms/deliveryPlan"; // 导入发货计划API
import { listCoilByIds } from "@/api/wms/coil";
import { listDeliveryWaybillDetail } from "@/api/wms/deliveryWaybillDetail";
import MemoInput from "@/components/MemoInput";