✨ feat(mes): 优化库存选择器和退货明细表单布局
调整库存选择器为下拉选择组件,支持前端过滤,提升用户体验。更新退货明细表单,增加库存记录选择,优化表单布局,确保信息展示更为清晰。pull/871/MERGE
parent
23bf42c4ad
commit
51e8cd35fa
|
|
@ -52,5 +52,10 @@ export const BatchApi = {
|
|||
// 向后追溯
|
||||
getBackwardList: async (code: string) => {
|
||||
return await request.get({ url: `/mes/wm/batch/backward-list`, params: { code } })
|
||||
},
|
||||
|
||||
// 获取批次精简列表(主要用于前端下拉)
|
||||
getBatchSimpleList: async () => {
|
||||
return await request.get({ url: `/mes/wm/batch/simple-list` })
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@ export interface WmReturnVendorDetailVO {
|
|||
id?: number
|
||||
returnId: number
|
||||
lineId: number
|
||||
materialStockId: number
|
||||
materialStockId?: number
|
||||
itemId: number
|
||||
quantity: number
|
||||
batchId?: number
|
||||
|
|
|
|||
|
|
@ -11,6 +11,7 @@ export interface WmReturnVendorLineVO {
|
|||
unitMeasureName?: string
|
||||
quantity: number
|
||||
batchId?: number
|
||||
batchCode?: string
|
||||
remark?: string
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -0,0 +1,81 @@
|
|||
<!-- MES 批次选择器:一次加载全量,前端过滤(支持 code) -->
|
||||
<template>
|
||||
<el-select
|
||||
v-model="selectValue"
|
||||
:placeholder="placeholder"
|
||||
:disabled="disabled"
|
||||
:clearable="clearable"
|
||||
filterable
|
||||
:filter-method="handleFilter"
|
||||
class="!w-1/1"
|
||||
@change="handleChange"
|
||||
>
|
||||
<el-option v-for="item in filteredList" :key="item.id" :label="item.code" :value="item.id">
|
||||
<div class="flex items-center gap-8px">
|
||||
<span>{{ item.code }}</span>
|
||||
<el-tag v-if="item.itemCode" size="small" type="info" class="ml-4px">
|
||||
{{ item.itemCode }}
|
||||
</el-tag>
|
||||
</div>
|
||||
</el-option>
|
||||
</el-select>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { BatchApi, BatchVO } from '@/api/mes/wm/batch'
|
||||
|
||||
defineOptions({ name: 'WmBatchSelect' })
|
||||
|
||||
const props = withDefaults(
|
||||
defineProps<{
|
||||
modelValue?: number
|
||||
disabled?: boolean
|
||||
clearable?: boolean
|
||||
placeholder?: string
|
||||
}>(),
|
||||
{
|
||||
disabled: false,
|
||||
clearable: true,
|
||||
placeholder: '请选择批次'
|
||||
}
|
||||
)
|
||||
|
||||
const emit = defineEmits<{
|
||||
'update:modelValue': [value: number | undefined]
|
||||
change: [item: BatchVO | undefined]
|
||||
}>()
|
||||
|
||||
const allList = ref<BatchVO[]>([])
|
||||
const filteredList = ref<BatchVO[]>([])
|
||||
|
||||
const selectValue = computed({
|
||||
get: () => props.modelValue,
|
||||
set: (val) => emit('update:modelValue', val)
|
||||
})
|
||||
|
||||
/** 前端过滤(code) */
|
||||
const handleFilter = (query: string) => {
|
||||
if (!query) {
|
||||
filteredList.value = allList.value
|
||||
return
|
||||
}
|
||||
const keyword = query.toLowerCase()
|
||||
filteredList.value = allList.value.filter(
|
||||
(item) =>
|
||||
item.code?.toLowerCase().includes(keyword) ||
|
||||
item.itemCode?.toLowerCase().includes(keyword)
|
||||
)
|
||||
}
|
||||
|
||||
/** 选中变化 */
|
||||
const handleChange = (val: number | undefined) => {
|
||||
const item = allList.value.find((o) => o.id === val)
|
||||
emit('change', item)
|
||||
}
|
||||
|
||||
/** 加载批次列表 */
|
||||
onMounted(async () => {
|
||||
allList.value = await BatchApi.getBatchSimpleList()
|
||||
filteredList.value = allList.value
|
||||
})
|
||||
</script>
|
||||
|
|
@ -32,7 +32,7 @@
|
|||
<el-table-column label="规格型号" align="center" prop="specification" min-width="120" />
|
||||
<el-table-column label="单位" align="center" prop="unitMeasureName" width="80" />
|
||||
<el-table-column label="退货数量" align="center" prop="quantity" width="100" />
|
||||
<el-table-column label="批次号" align="center" prop="batchId" width="80" />
|
||||
<el-table-column label="批次号" align="center" prop="batchCode" width="150" />
|
||||
<el-table-column
|
||||
v-if="isUpdate || isStock"
|
||||
label="操作"
|
||||
|
|
@ -93,7 +93,11 @@
|
|||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<!-- TODO @芋艿:这里差一个批次号的选择器;【暂不处理】 -->
|
||||
<el-col :span="8">
|
||||
<el-form-item label="批次号" prop="batchId">
|
||||
<WmBatchSelect v-model="formData.batchId" @change="handleBatchChange" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
|
|
@ -120,6 +124,7 @@
|
|||
<script setup lang="ts">
|
||||
import { WmReturnVendorLineApi, WmReturnVendorLineVO } from '@/api/mes/wm/returnvendor/line'
|
||||
import MdItemSelect from '@/views/mes/md/item/components/MdItemSelect.vue'
|
||||
import WmBatchSelect from '@/views/mes/wm/batch/components/WmBatchSelect.vue'
|
||||
import ReturnVendorDetailList from './ReturnVendorDetailList.vue'
|
||||
import ReturnVendorDetailForm from './ReturnVendorDetailForm.vue'
|
||||
|
||||
|
|
@ -179,6 +184,8 @@ const formData = ref({
|
|||
returnId: undefined as number | undefined,
|
||||
itemId: undefined,
|
||||
quantity: undefined,
|
||||
batchId: undefined as number | undefined,
|
||||
batchCode: undefined as string | undefined,
|
||||
remark: undefined
|
||||
})
|
||||
const formRules = reactive({
|
||||
|
|
@ -194,6 +201,11 @@ const handleItemChange = (item: any) => {
|
|||
}
|
||||
}
|
||||
|
||||
/** 批次选中回调,同步 batchCode */
|
||||
const handleBatchChange = (batch: any) => {
|
||||
formData.value.batchCode = batch?.code
|
||||
}
|
||||
|
||||
/** 打开表单弹窗 */
|
||||
const openForm = async (type: string, id?: number) => {
|
||||
dialogVisible.value = true
|
||||
|
|
@ -240,6 +252,8 @@ const resetForm = () => {
|
|||
returnId: undefined,
|
||||
itemId: undefined,
|
||||
quantity: undefined,
|
||||
batchId: undefined,
|
||||
batchCode: undefined,
|
||||
remark: undefined
|
||||
}
|
||||
formRef.value?.resetFields()
|
||||
|
|
|
|||
Loading…
Reference in New Issue