Teams/shanghaigangxiangtuzhuangVUE
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor(wmsManagement): 优化物料选择及出库单表格布局

Browse Source 
- 移除冗余表格列(U8编码、单位、版本号等)，保留关键信息
- 为表格列添加最小宽度设置，优化显示效果
- 在出库单中添加需求量输入验证逻辑
- 实现物料搜索表单的防抖功能，优化搜索体验
- 调整分页默认页大小为50条
This commit is contained in:
赵正易
2025-08-28 10:15:31 +08:00
parent 5bbfdee630
commit d33f39e102
2 changed files with 49 additions and 30 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
src/views/wmsManagement/WmOutOrder.vue
View File

@@ -172,18 +172,14 @@
<div>
<el-table :disabled="opertype === 2" :data="form.materialList" v-loading="materialLoading" ref="table" border highlight-current-row @selection-change="handleMaterialSelectionChange">
<!-- <el-table-column type="selection" width="50" align="center" /> -->
<el-table-column prop="partnumber" label="物料号" align="center" :show-overflow-tooltip="true" />
<el-table-column prop="u8InventoryCode" label="U8编码" align="center" :show-overflow-tooltip="true" />
<el-table-column prop="partnumber" label="物料号" align="center" :show-overflow-tooltip="true" min-width="120" />
<el-table-column label="需求量" prop="requireOutNum" align="center" width="100">
<template slot-scope="scope">
<el-input :disabled="opertype === 2" v-model.number="scope.row.requireOutNum" placeholder="请输入物料需求量" />
<el-input :disabled="opertype === 2" v-model.number="scope.row.requireOutNum" placeholder="请输入物料需求量" @blur="validateRequireOutNum(scope.row)"></el-input>
</template>
</el-table-column>
<el-table-column prop="stockQuantity" label="现有库存" align="center" :show-overflow-tooltip="true" />
<el-table-column prop="unit" label="单位" align="center" :show-overflow-tooltip="true" />
<el-table-column prop="description" label="显示描述" align="center" :show-overflow-tooltip="true" />
<el-table-column prop="version" label="版本号" align="center" :show-overflow-tooltip="true" />
<el-table-column prop="remarks" label="备注" align="center" :show-overflow-tooltip="true" />
<el-table-column prop="stockQuantity" label="出库量" align="center" :show-overflow-tooltip="true" min-width="100" />
<el-table-column prop="description" label="显示描述" align="center" :show-overflow-tooltip="true" min-width="180" />
<el-table-column label="操作" align="center" width="140">
<template slot-scope="scope">
<el-button :disabled="opertype === 2" size="mini" v-hasPermi="['business:wmmaterial:delete']" type="danger" icon="el-icon-delete" @click="handlerDeleteMaterial([scope.row.id])">移除此物料</el-button>
@@ -551,6 +547,16 @@
}
})
},
// 验证需求量输入
validateRequireOutNum(row) {
if (row.requireOutNum && row.requireOutNum <= 0) {
this.$message.error('需求量必须大于0');
row.requireOutNum = undefined;
} else if (row.requireOutNum && row.requireOutNum > row.stockQuantity) {
this.$message.error('需求量不能大于现有库存');
row.requireOutNum = undefined;
}
},
},
}
</script>

57
src/views/wmsManagement/components/TheChouseMaterial/TheChouseMaterial.vue
View File

@@ -6,37 +6,30 @@
<el-form-item label="物料号" prop="partnumber">
<el-input v-model="formData.partnumber" placeholder="请输入物料号(零件号)" clearable :style="{ width: '100%' }"> </el-input>
</el-form-item>
<el-form-item label="U8编码" prop="u8InventoryCode">
<el-input v-model="formData.u8InventoryCode" placeholder="请输入U8编码" clearable :style="{ width: '100%' }"></el-input>
</el-form-item>
<el-form-item label="描述" prop="description">
<el-input v-model="formData.description" placeholder="请输入描述" clearable :style="{ width: '100%' }"> </el-input>
</el-form-item>
</el-row>
<el-row type="flex" justify="start" align="top" :gutter="10">
<el-form-item label="" prop="search">
<el-button type="primary" icon="el-icon-search" size="mini" @click="getList">搜索</el-button>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleSearch">搜索</el-button>
</el-form-item>
</el-row>
<el-row>
<el-table
:data="dataList"
v-loading="loading"
ref="table"
border
highlight-current-row
@selection-change="handleSelectionChange"
>
<el-table-column type="selection" width="50" align="center" />
<el-table-column prop="partnumber" label="物料号" align="center" :show-overflow-tooltip="true" />
<el-table-column prop="u8InventoryCode" label="U8编码" align="center" :show-overflow-tooltip="true" />
<el-table-column prop="unit" label="单位" align="center" :show-overflow-tooltip="true" />
<el-table-column prop="description" label="显示描述" align="center" :show-overflow-tooltip="true" />
<el-table-column prop="version" label="版本号" align="center" :show-overflow-tooltip="true" />
<el-table-column prop="remarks" label="备注" align="center" :show-overflow-tooltip="true" />
<el-table-column prop="stockQuantity" label="现有库存" align="center" :show-overflow-tooltip="true" />
</el-table>
:data="dataList"
v-loading="loading"
ref="table"
border
highlight-current-row
@selection-change="handleSelectionChange"
>
<el-table-column type="selection" width="50" align="center" />
<el-table-column prop="partnumber" label="物料号" align="center" min-width="120" />
<el-table-column prop="description" label="显示描述" align="center" min-width="180" />
<el-table-column prop="stockQuantity" label="现有库存" align="center" min-width="100" />
</el-table>
<pagination
class="mt10"
background
@@ -56,6 +49,7 @@
</template>
<script>
import { getMaterialList } from '@/api/wmsManagement/wmOutOrder.js'
export default {
inheritAttrs: false,
components: {},
@@ -72,7 +66,7 @@ export default {
},
queryParams: {
pageNum: 1,
pageSize: 20,
pageSize: 50,
},
// 数据列表
dataList: [],
@@ -81,10 +75,25 @@ export default {
rules: {},
// 多选框选中数据
selectList: [],
// 防抖定时器
searchTimer: null,
}
},
computed: {},
watch: {},
watch: {
// 监听表单数据变化，实现防抖搜索
formData: {
deep: true,
handler() {
if (this.searchTimer) {
clearTimeout(this.searchTimer)
}
this.searchTimer = setTimeout(() => {
this.getList()
}, 500)
}
}
},
created() {},
mounted() {},
methods: {
@@ -141,6 +150,10 @@ export default {
}
})
},
handleSearch() {
this.queryParams.pageNum = 1
this.getList()
}
},
}
</script>