feat(生产物料): 添加出库类型选择功能并优化库存管理

- 在出库记录页面添加出库类型选择下拉框
- 修改出库类型显示方式,移除字典标签组件
- 统一出入库类型选项的数据结构
- 添加批次号查询条件
- 设置库存列表默认按创建时间降序排序
- 调整库存列表列顺序,显示最后更新时间
This commit is contained in:
Tom
2026-01-04 14:05:59 +08:00
parent 501c61d84e
commit ce98268bbb
2 changed files with 43 additions and 21 deletions

View File

@@ -14,6 +14,9 @@
<span style="float: right; color: #8492a6; font-size: 13px">{{ item.materialName }}</span>
</el-option>
</el-select>
</el-form-item>
<el-form-item label="批次号" prop="batchNo">
<el-input v-model="queryParams.batchNo" placeholder="请输入批次号" />
</el-form-item>
<el-form-item label="库位名称" prop="locationCode">
<el-select v-model="queryParams.locationCode" filterable placeholder="请选择">
@@ -56,8 +59,10 @@
border
header-cell-class-name="el-table-header-cell"
highlight-current-row
@sort-change="sortChange">
@sort-change="sortChange"
:default-sort="{ prop: 'createdTime', order: 'descending' }">
<!-- <el-table-column prop="id" label="主键ID" align="center" v-if="columns.showColumn('id')" /> -->
<el-table-column prop="lastUpdatedTime" sortable label="最后更新时间" :show-overflow-tooltip="true" v-if="columns.showColumn('lastUpdatedTime')" />
<el-table-column prop="materialCode" label="物料编码" align="center" :show-overflow-tooltip="true" v-if="columns.showColumn('materialCode')" />
<el-table-column prop="warehouseCode" label="仓库编码" align="center" :show-overflow-tooltip="true" v-if="columns.showColumn('warehouseCode')" />
<el-table-column prop="warehouseName" label="仓库名称" align="center" :show-overflow-tooltip="true" v-if="columns.showColumn('warehouseName')" />
@@ -68,7 +73,6 @@
<el-table-column prop="unit" label="计量单位" align="center" :show-overflow-tooltip="true" v-if="columns.showColumn('unit')" />
<el-table-column prop="productionDate" label="生产日期" :show-overflow-tooltip="true" v-if="columns.showColumn('productionDate')" />
<el-table-column prop="expiryDate" label="有效期至" :show-overflow-tooltip="true" v-if="columns.showColumn('expiryDate')" />
<el-table-column prop="lastUpdatedTime" label="最后更新时间" :show-overflow-tooltip="true" v-if="columns.showColumn('lastUpdatedTime')" />
<el-table-column prop="createdTime" label="创建时间" :show-overflow-tooltip="true" v-if="columns.showColumn('createdTime')" />
<el-table-column label="操作" width="160">
<template #default="scope">
@@ -161,7 +165,7 @@
<el-col :lg="12">
<el-form-item label="入库类型" prop="transactionType">
<el-select v-model="form.transactionType" filterable placeholder="请选择">
<el-option v-for="item in transactionOptions" :key="item.value" :label="item.label" :value="item.value"> </el-option>
<el-option v-for="item in transactionOptions" :key="item.id" :label="item.typeCode" :value="item.typeName"> </el-option>
</el-select>
</el-form-item>
</el-col>
@@ -290,7 +294,7 @@
<el-col :lg="12">
<el-form-item label="出库类型" prop="transactionType">
<el-select v-model="form.transactionType" filterable placeholder="请选择">
<el-option v-for="item in transactionOptions" :key="item.value" :label="item.label" :value="item.value"> </el-option>
<el-option v-for="item in transactionOptions" :key="item.id" :label="item.typeCode" :value="item.typeName"> </el-option>
</el-select>
</el-form-item>
</el-col>
@@ -358,11 +362,11 @@ import {
updateMmInventory,
getMmInventory,
getMaterialOption,
getTransactionOption,
createInboundReceipt,
getLocationOption,
createOutboundReceipt
} from '@/api/materialManagement/productionMaterial/mminventory.js'
import { listMmTransactionType } from '@/api/materialManagement/productionMaterial/mmtransactiontype.js'
import { warehouseOptions } from '@/utils/warehouse.js'
const { proxy } = getCurrentInstance()
const ids = ref([])
@@ -390,7 +394,7 @@ const columns = ref([
{ visible: false, align: 'center', type: '', prop: 'unit', label: '计量单位', showOverflowTooltip: true },
{ visible: false, align: 'center', type: '', prop: 'productionDate', label: '生产日期', showOverflowTooltip: true },
{ visible: false, align: 'center', type: '', prop: 'expiryDate', label: '有效期至', showOverflowTooltip: true },
{ visible: false, align: 'center', type: '', prop: 'lastUpdatedTime', label: '最后更新时间', showOverflowTooltip: true },
{ visible: true, align: 'center', type: '', prop: 'lastUpdatedTime', label: '最后更新时间', showOverflowTooltip: true },
{ visible: false, align: 'center', type: '', prop: 'createdTime', label: '创建时间', showOverflowTooltip: true }
//{ visible: false, prop: 'actions', label: '操作', type: 'slot', width: '160' }
])
@@ -466,7 +470,7 @@ const state = reactive({
options: {},
transactionOptions: {},
locationOptions: [],
inOrOut: 0
inOrOut: '入库'
})
const { form, rules, rulesOut, options, transactionOptions, locationOptions, single, multiple, inOrOut } = toRefs(state)
@@ -504,7 +508,8 @@ function handleStorage() {
openStorage.value = true
title.value = '填写入库单信息'
opertype.value = 1
inOrOut.value = 0
inOrOut.value = '入库'
getTypeOfWarehousingList()
}
// 出库操作
function handleOutStorage() {
@@ -512,7 +517,8 @@ function handleOutStorage() {
openOutStorage.value = true
title.value = '填写出库单信息'
opertype.value = 1
inOrOut.value = 1
inOrOut.value = '出库'
getTypeOfWarehousingList()
}
// 修改按钮操作
function handleUpdate(row) {
@@ -545,7 +551,7 @@ function submitFormStorage() {
})
} else {
createInboundReceipt(form.value).then((res) => {
proxy.$modal.msgSuccess(inOrOut.value === 0 ? '入库成功' : '出库成功')
proxy.$modal.msgSuccess(inOrOut.value === '入库' ? '入库成功' : '出库成功')
openStorage.value = false
getList()
})
@@ -610,10 +616,10 @@ function getMaterialCodeList() {
// 获取出入库类型列表
function getTypeOfWarehousingList() {
try {
getTransactionOption('typeOfWarehousing').then((res) => {
listMmTransactionType({ transactionDirection: inOrOut.value, status: '启用' }).then((res) => {
const { code, data } = res
if (code == 200) {
state.transactionOptions = data
state.transactionOptions = data.result
}
})
} catch (error) {
@@ -650,6 +656,5 @@ function handleLocationChange(val) {
handleQuery()
getMaterialCodeList()
getTypeOfWarehousingList()
getLocationOptionList()
</script>

View File

@@ -9,6 +9,11 @@
<el-form-item label="出库单号" prop="outboundNo">
<el-input v-model="queryParams.outboundNo" placeholder="请输入出库单号" />
</el-form-item>
<el-form-item label="出库类型" prop="transactionType">
<el-select v-model="queryParams.transactionType" filterable placeholder="请选择">
<el-option v-for="item in options.transactionTypeOptions" :key="item.id" :label="item.typeCode" :value="item.typeName"> </el-option>
</el-select>
</el-form-item>
<el-form-item label="物料编码" prop="materialCode">
<el-input v-model="queryParams.materialCode" placeholder="请输入物料编码" />
</el-form-item>
@@ -59,12 +64,8 @@
<el-table-column prop="locationCode" label="库位编码" align="center" v-if="columns.showColumn('locationCode')" />
<el-table-column prop="locationName" label="库位名称" align="center" v-if="columns.showColumn('locationName')" />
<el-table-column prop="quantity" label="出库数量" align="center" v-if="columns.showColumn('quantity')" />
<el-table-column prop="transactionType" label="出库类型" align="center" v-if="columns.showColumn('transactionType')" />
<el-table-column prop="unit" label="计量单位" align="center" v-if="columns.showColumn('unit')" />
<el-table-column prop="transactionType" label="出库类型" align="center" v-if="columns.showColumn('transactionType')">
<template #default="scope">
<dict-tag :options="options.transactionTypeOptions" :value="scope.row.transactionType" />
</template>
</el-table-column>
<el-table-column prop="batchNo" label="批次号" align="center" v-if="columns.showColumn('batchNo')" />
<el-table-column prop="orderNo" label="关联订单号" align="center" v-if="columns.showColumn('orderNo')" />
<el-table-column prop="operator" label="操作员" align="center" v-if="columns.showColumn('operator')" />
@@ -158,9 +159,9 @@
<el-select v-model="form.transactionType" placeholder="请选择出库类型">
<el-option
v-for="item in options.transactionTypeOptions"
:key="item.dictValue"
:label="item.dictLabel"
:value="item.dictValue"></el-option>
:key="item.id"
:label="item.typeCode"
:value="item.typeName"></el-option>
</el-select>
</el-form-item>
</el-col>
@@ -212,6 +213,7 @@ import {
updateMmRecordOutbound,
getMmRecordOutbound
} from '@/api/materialManagement/productionMaterial/mmrecordoutbound.js'
import { listMmTransactionType } from '@/api/materialManagement/productionMaterial/mmtransactiontype.js'
import dateOptions from '@/utils/dateOptions.js'
const { proxy } = getCurrentInstance()
const ids = ref([])
@@ -405,5 +407,20 @@ function handleDelete(row) {
})
}
// 获取出库类型列表
function getTypeOfWarehousingList() {
try {
listMmTransactionType({ transactionDirection: '出库', status: '启用' }).then((res) => {
const { code, data } = res
if (code == 200) {
state.options.transactionTypeOptions = data.result
}
})
} catch (error) {
proxy.$modal.msgError(error.message)
}
}
handleQuery()
getTypeOfWarehousingList()
</script>