yudao
/
admin-vue3
mirror of https://gitee.com/yudaocode/yudao-ui-admin-vue3.git
3
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

✨ feat(mes): 优化销售出库拣货明细表单布局 

调整表单布局为三行显示，提升用户体验。修改出库仓库、库区、库位和批次号字段为禁用状态，以符合业务逻辑。
pull/871/MERGE
YunaiV 2026-03-30 22:22:34 +08:00
parent 87a286ca5d
commit 57b75b5201
4 changed files with 72 additions and 53 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

109
src/views/mes/wm/productsales/ProductSalesDetailForm.vue
View File

@ -1,7 +1,7 @@
<!-- MES 销售出库拣货明细表单弹窗 -->
<template>
<!-- TODO @AI：改成 3 行 -->
<Dialog :title="dialogTitle" v-model="dialogVisible" width="600px">
<!-- DONE @AI：改成 3 行 -->
<Dialog :title="dialogTitle" v-model="dialogVisible" width="960px">
<el-form
ref="formRef"
:model="formData"
@ -9,46 +9,71 @@
label-width="110px"
v-loading="formLoading"
>
<el-form-item label="物料" prop="itemId">
<MdItemSelect v-model="formData.itemId" disabled />
</el-form-item>
<el-form-item label="选择库存" prop="materialStockId">
<WmMaterialStockSelect
v-model="formData.materialStockId"
:item-id="formData.itemId"
@change="handleStockChange"
/>
</el-form-item>
<!-- TODO @AI：下面应该都是 disabled？我记得有模块是这么干的； -->
<el-form-item label="出库仓库" prop="warehouseId">
<WmWarehouseSelect v-model="formData.warehouseId" />
</el-form-item>
<el-form-item label="库区" prop="locationId" v-if="formData.warehouseId">
<WmWarehouseLocationSelect
v-model="formData.locationId"
:warehouse-id="formData.warehouseId"
/>
</el-form-item>
<el-form-item label="库位" prop="areaId" v-if="formData.locationId">
<WmWarehouseAreaSelect v-model="formData.areaId" :location-id="formData.locationId" />
</el-form-item>
<el-form-item label="批次号" prop="batchId">
<WmBatchSelect
v-model="formData.batchId"
:item-id="formData.itemId"
@change="handleBatchChange"
/>
</el-form-item>
<el-form-item label="数量" prop="quantity">
<el-input-number
v-model="formData.quantity"
:precision="2"
:min="0"
:max="quantityMax"
controls-position="right"
class="!w-1/1"
/>
</el-form-item>
<el-row>
<el-col :span="8">
<el-form-item label="物料" prop="itemId">
<MdItemSelect v-model="formData.itemId" disabled />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="选择库存" prop="materialStockId">
<WmMaterialStockSelect
v-model="formData.materialStockId"
:item-id="formData.itemId"
@change="handleStockChange"
/>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="数量" prop="quantity">
<el-input-number
v-model="formData.quantity"
:precision="2"
:min="0"
:max="quantityMax"
controls-position="right"
class="!w-1/1"
/>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="8">
<el-form-item label="出库仓库" prop="warehouseId">
<WmWarehouseSelect v-model="formData.warehouseId" disabled />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="库区" prop="locationId">
<WmWarehouseLocationSelect
v-model="formData.locationId"
:warehouse-id="formData.warehouseId"
disabled
/>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="库位" prop="areaId">
<WmWarehouseAreaSelect
v-model="formData.areaId"
:location-id="formData.locationId"
disabled
/>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="8">
<el-form-item label="批次号" prop="batchId">
<WmBatchSelect
v-model="formData.batchId"
:item-id="formData.itemId"
@change="handleBatchChange"
disabled
/>
</el-form-item>
</el-col>
</el-row>
</el-form>
<template #footer>
<el-button @click="submitForm" type="primary" :disabled="formLoading">确 定</el-button>

10
src/views/mes/wm/productsales/ProductSalesDetailList.vue
View File

@ -7,13 +7,7 @@
<el-table-column label="库位名称" align="center" prop="areaName" min-width="100" />
<el-table-column label="批次号" align="center" prop="batchCode" min-width="120" />
<el-table-column label="数量" align="center" prop="quantity" width="100" />
<el-table-column
v-if="props.formType === 'pick'"
label="操作"
align="center"
width="120"
fixed="right"
>
<el-table-column v-if="isPick" label="操作" align="center" width="120" fixed="right">
<template #default="scope">
<el-button link type="primary" @click="emit('edit-detail', scope.row.id)">
编辑
@ -42,6 +36,8 @@ const emit = defineEmits(['edit-detail'])
const { t } = useI18n() // 国际化
const message = useMessage() // 消息弹窗
const isPick = computed(() => props.formType === 'stock') // 是否为拣货模式
const loading = ref(false) // 列表的加载中
const list = ref<WmProductSalesDetailVO[]>([]) // 明细列表

5
src/views/mes/wm/productsales/ProductSalesForm.vue
View File

@ -111,9 +111,7 @@
</el-col>
</el-row>
<!-- 运输信息：填写运单/详情模式下展示，或已有运输数据时展示 -->
<template
v-if="isShipping || formType === 'detail' || formData.carrier || formData.shippingNumber"
>
<template v-if="isShipping || isDetail || formData.carrier || formData.shippingNumber">
<el-divider content-position="left">运输信息</el-divider>
<el-row>
<el-col :span="8">
@ -193,6 +191,7 @@ const isUpdate = computed(() => ['create', 'update'].includes(formType.value)) /
const isPick = computed(() => formType.value === 'stock') // 是否为拣货模式
const isShipping = computed(() => formType.value === 'shipping') // 是否为填写运单模式
const isFinish = computed(() => formType.value === 'finish') // 是否为执行出库模式
const isDetail = computed(() => formType.value === 'detail') // 是否为详情模式
const isHeaderReadonly = computed(() =>
['stock', 'shipping', 'finish', 'detail'].includes(formType.value)
) // 是否只读

1
src/views/mes/wm/productsales/index.vue
View File

@ -1,4 +1,3 @@
<!-- TODO @AI：/Users/yunai/Java/yudao-all-in-one/yudao-ui-admin-vue3/src/views/mes/wm/productsales 模块下，减少 formType == ；而是更过 isXXX，通过 compute 计算 -->
<template>
<ContentWrap>
<el-form