Browse Source
feat(automatedWarehouse): 添加合托查询功能
feat(automatedWarehouse): 添加合托查询功能
- 创建 palletMergeQuery API 接口文件,包含获取托盘类型、查询合托列表、提交合托等功能 - 实现合托查询页面组件,包含托盘类型选择下拉框和查询表单 - 添加表格展示需要合托的托盘列表,支持多选和行点击操作 - 实现提交合托功能,支持选择多个托盘进行合并操作 - 集成托盘类型下拉选项加载和表格数据查询功能 - 添加选中状态管理和提交按钮禁用逻辑master
2 changed files with 350 additions and 0 deletions
-
13src/api/automatedWarehouse/palletMergeQuery.js
-
337src/views/modules/automatedWarehouse/palletMergeQuery.vue
@ -0,0 +1,13 @@ |
|||
import { createAPI } from "@/utils/httpRequest.js"; |
|||
|
|||
// ========== 合托查询相关 ========== - rqrq
|
|||
|
|||
// 获取托盘类型下拉选项(wcs_auto_sort='Y' 且 pallet_family != 'A02')- rqrq
|
|||
export const getPalletTypeOptions = data => createAPI(`/automatedWarehouse/palletMergeQuery/getPalletTypeOptions`, 'post', data) |
|||
|
|||
// 查询需要合托的托盘列表 - rqrq
|
|||
export const searchPalletMergeList = data => createAPI(`/automatedWarehouse/palletMergeQuery/searchPalletMergeList`, 'post', data) |
|||
|
|||
// 提交合托请求(预留方法)- rqrq
|
|||
export const submitPalletMerge = data => createAPI(`/automatedWarehouse/palletMergeQuery/submitPalletMerge`, 'post', data) |
|||
|
|||
@ -0,0 +1,337 @@ |
|||
<template> |
|||
<div class="mod-config yzz"> |
|||
<!-- 查询表单 - rqrq --> |
|||
<el-form label-position="top" style="margin-top: 1px; margin-left: 0px;"> |
|||
<el-form :inline="true" label-position="top" style="margin-top: 0px"> |
|||
<el-form-item label="托盘类型" required> |
|||
<el-select |
|||
v-model="searchData.palletType" |
|||
placeholder="请选择托盘类型" |
|||
style="width: 200px" |
|||
clearable |
|||
@change="handlePalletTypeChange"> |
|||
<el-option |
|||
v-for="item in palletTypeOptions" |
|||
:key="item.palletType" |
|||
:label="item.palletType + ' - ' + item.typeDesc" |
|||
:value="item.palletType"> |
|||
</el-option> |
|||
</el-select> |
|||
</el-form-item> |
|||
<el-form-item :label="' '"> |
|||
<el-button type="primary" @click="searchTable()" :disabled="!searchData.palletType">查询</el-button> |
|||
</el-form-item> |
|||
</el-form> |
|||
</el-form> |
|||
|
|||
<!-- 操作按钮行 - rqrq --> |
|||
<div style="margin-bottom: 10px;"> |
|||
<el-button |
|||
type="primary" |
|||
class="yzzButtonAn" |
|||
@click="submitMerge()" |
|||
:disabled="submitLoading || selectedRows.length < 2" |
|||
:loading="submitLoading"> |
|||
{{ submitLoading ? '提交中...' : '提交合托' }} |
|||
</el-button> |
|||
<span style="margin-left: 10px; color: #909399; font-size: 12px;"> |
|||
已选择 {{ selectedRows.length }} 条,至少选择2条才能合托 |
|||
</span> |
|||
</div> |
|||
|
|||
<!-- 主表格 - rqrq --> |
|||
<el-table |
|||
:data="dataList" |
|||
@row-click="handleRowClick" |
|||
@selection-change="handleSelectionChange" |
|||
:height="height" |
|||
border |
|||
highlight-current-row |
|||
ref="mainTable" |
|||
v-loading="dataListLoading" |
|||
style="width: 100%;"> |
|||
<!-- 复选框列 - rqrq --> |
|||
<el-table-column |
|||
type="selection" |
|||
width="55" |
|||
align="center"> |
|||
</el-table-column> |
|||
<!-- 数据列 - rqrq --> |
|||
<el-table-column |
|||
v-for="(item,index) in columnList" |
|||
:key="index" |
|||
:sortable="item.columnSortable" |
|||
:prop="item.columnProp" |
|||
:header-align="item.headerAlign" |
|||
:show-overflow-tooltip="item.showOverflowTooltip" |
|||
:align="item.align" |
|||
:fixed="item.fixed==''?false:item.fixed" |
|||
:min-width="item.columnWidth" |
|||
:label="item.columnLabel"> |
|||
<template slot-scope="scope"> |
|||
<span v-if="!item.columnHidden">{{ scope.row[item.columnProp] }}</span> |
|||
</template> |
|||
</el-table-column> |
|||
</el-table> |
|||
|
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import { |
|||
getPalletTypeOptions, |
|||
searchPalletMergeList, |
|||
submitPalletMerge |
|||
} from "@/api/automatedWarehouse/palletMergeQuery.js" |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
height: 400, |
|||
dataList: [], |
|||
dataListLoading: false, |
|||
submitLoading: false, |
|||
selectedRows: [], |
|||
palletTypeOptions: [], |
|||
searchData: { |
|||
site: this.$store.state.user.site || '55', |
|||
palletType: '' |
|||
}, |
|||
// 表格列配置 - rqrq |
|||
columnList: [ |
|||
{ |
|||
userId: this.$store.state.user.name, |
|||
serialNumber: 'palletMerge01PalletId', |
|||
tableId: "palletMergeTable", |
|||
tableName: "合托查询表", |
|||
columnProp: "palletId", |
|||
headerAlign: "center", |
|||
align: "center", |
|||
columnLabel: "托盘ID", |
|||
columnHidden: false, |
|||
columnImage: false, |
|||
columnSortable: false, |
|||
sortLv: 0, |
|||
status: true, |
|||
fixed: '', |
|||
columnWidth: 120, |
|||
showOverflowTooltip: true |
|||
}, |
|||
{ |
|||
userId: this.$store.state.user.name, |
|||
serialNumber: 'palletMerge01PalletType', |
|||
tableId: "palletMergeTable", |
|||
tableName: "合托查询表", |
|||
columnProp: "palletType", |
|||
headerAlign: "center", |
|||
align: "center", |
|||
columnLabel: "托盘类型", |
|||
columnHidden: false, |
|||
columnImage: false, |
|||
columnSortable: false, |
|||
sortLv: 0, |
|||
status: true, |
|||
fixed: '', |
|||
columnWidth: 100, |
|||
showOverflowTooltip: true |
|||
}, |
|||
{ |
|||
userId: this.$store.state.user.name, |
|||
serialNumber: 'palletMerge01TypeDesc', |
|||
tableId: "palletMergeTable", |
|||
tableName: "合托查询表", |
|||
columnProp: "typeDesc", |
|||
headerAlign: "center", |
|||
align: "left", |
|||
columnLabel: "类型描述", |
|||
columnHidden: false, |
|||
columnImage: false, |
|||
columnSortable: false, |
|||
sortLv: 0, |
|||
status: true, |
|||
fixed: '', |
|||
columnWidth: 150, |
|||
showOverflowTooltip: true |
|||
}, |
|||
{ |
|||
userId: this.$store.state.user.name, |
|||
serialNumber: 'palletMerge01LocationCode', |
|||
tableId: "palletMergeTable", |
|||
tableName: "合托查询表", |
|||
columnProp: "locationCode", |
|||
headerAlign: "center", |
|||
align: "center", |
|||
columnLabel: "库位编码", |
|||
columnHidden: false, |
|||
columnImage: false, |
|||
columnSortable: false, |
|||
sortLv: 0, |
|||
status: true, |
|||
fixed: '', |
|||
columnWidth: 120, |
|||
showOverflowTooltip: true |
|||
}, |
|||
{ |
|||
userId: this.$store.state.user.name, |
|||
serialNumber: 'palletMerge01CallingFlag', |
|||
tableId: "palletMergeTable", |
|||
tableName: "合托查询表", |
|||
columnProp: "callingFlag", |
|||
headerAlign: "center", |
|||
align: "center", |
|||
columnLabel: "调用标志", |
|||
columnHidden: false, |
|||
columnImage: false, |
|||
columnSortable: false, |
|||
sortLv: 0, |
|||
status: true, |
|||
fixed: '', |
|||
columnWidth: 80, |
|||
showOverflowTooltip: true |
|||
}, |
|||
{ |
|||
userId: this.$store.state.user.name, |
|||
serialNumber: 'palletMerge01UsedPositionCount', |
|||
tableId: "palletMergeTable", |
|||
tableName: "合托查询表", |
|||
columnProp: "usedPositionCount", |
|||
headerAlign: "center", |
|||
align: "center", |
|||
columnLabel: "已用位置", |
|||
columnHidden: false, |
|||
columnImage: false, |
|||
columnSortable: true, |
|||
sortLv: 0, |
|||
status: true, |
|||
fixed: '', |
|||
columnWidth: 100, |
|||
showOverflowTooltip: true |
|||
} |
|||
] |
|||
} |
|||
}, |
|||
mounted() { |
|||
this.$nextTick(() => { |
|||
this.height = window.innerHeight - 260 |
|||
// 加载托盘类型下拉选项 - rqrq |
|||
this.loadPalletTypeOptions() |
|||
}) |
|||
}, |
|||
methods: { |
|||
// 加载托盘类型下拉选项 - rqrq |
|||
loadPalletTypeOptions() { |
|||
getPalletTypeOptions({ site: this.searchData.site }).then(({ data }) => { |
|||
if (data && data.code == 0) { |
|||
this.palletTypeOptions = data.rows || [] |
|||
} else { |
|||
this.palletTypeOptions = [] |
|||
this.$message.error(data.msg || '获取托盘类型选项失败') |
|||
} |
|||
}).catch(() => { |
|||
this.palletTypeOptions = [] |
|||
this.$message.error('获取托盘类型选项失败') |
|||
}) |
|||
}, |
|||
// 托盘类型变化时清空表格 - rqrq |
|||
handlePalletTypeChange() { |
|||
this.dataList = [] |
|||
this.selectedRows = [] |
|||
if (this.$refs.mainTable) { |
|||
this.$refs.mainTable.clearSelection() |
|||
} |
|||
}, |
|||
// 查询表格数据 - rqrq |
|||
searchTable() { |
|||
// 校验必选项 - rqrq |
|||
if (!this.searchData.palletType) { |
|||
this.$alert('请选择托盘类型', '提示', { confirmButtonText: '确定' }) |
|||
return |
|||
} |
|||
|
|||
this.dataListLoading = true |
|||
this.selectedRows = [] |
|||
if (this.$refs.mainTable) { |
|||
this.$refs.mainTable.clearSelection() |
|||
} |
|||
|
|||
searchPalletMergeList(this.searchData).then(({ data }) => { |
|||
this.dataListLoading = false |
|||
if (data && data.code == 0) { |
|||
this.dataList = data.rows || [] |
|||
if (this.dataList.length === 0) { |
|||
this.$message({ |
|||
message: '没有找到需要合托的托盘', |
|||
type: 'warning', |
|||
duration: 2000 |
|||
}) |
|||
} |
|||
} else { |
|||
this.dataList = [] |
|||
this.$alert(data.msg || '查询失败', '错误', { confirmButtonText: '确定' }) |
|||
} |
|||
}).catch(() => { |
|||
this.dataListLoading = false |
|||
this.dataList = [] |
|||
this.$message.error('查询失败') |
|||
}) |
|||
}, |
|||
// 行点击选中/取消选中 - rqrq |
|||
handleRowClick(row) { |
|||
this.$refs.mainTable.toggleRowSelection(row) |
|||
}, |
|||
// 选中变化处理 - rqrq |
|||
handleSelectionChange(selection) { |
|||
this.selectedRows = selection |
|||
}, |
|||
// 提交合托 - rqrq |
|||
submitMerge() { |
|||
// 校验选中数据 - rqrq |
|||
if (this.selectedRows.length < 2) { |
|||
this.$alert('请至少选择2条数据进行合托', '提示', { confirmButtonText: '确定' }) |
|||
return |
|||
} |
|||
|
|||
this.submitLoading = true |
|||
|
|||
// 调用后端提交合托方法(预留)- rqrq |
|||
submitPalletMerge(this.selectedRows).then(({ data }) => { |
|||
if (data && data.code === 0) { |
|||
this.$message({ |
|||
message: '提交成功', |
|||
type: 'success', |
|||
duration: 1500 |
|||
}) |
|||
// 刷新列表 - rqrq |
|||
this.searchTable() |
|||
} else { |
|||
this.$alert(data.msg || '提交失败', '错误', { confirmButtonText: '确定' }) |
|||
} |
|||
}).catch(() => { |
|||
this.$message.error('提交失败') |
|||
}).finally(() => { |
|||
this.submitLoading = false |
|||
}) |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style scoped> |
|||
/deep/ .el-form-item--medium .el-form-item__content { |
|||
height: auto; |
|||
} |
|||
|
|||
/* 表格行点击时的鼠标样式 - rqrq */ |
|||
/deep/ .el-table__body tr { |
|||
cursor: pointer; |
|||
} |
|||
|
|||
/* 必选标记样式 - rqrq */ |
|||
/deep/ .el-form-item.is-required .el-form-item__label:before, |
|||
.el-form-item[required] .el-form-item__label:before { |
|||
content: '*'; |
|||
color: #F56C6C; |
|||
margin-right: 4px; |
|||
} |
|||
</style> |
|||
|
|||
Write
Preview
Loading…
Cancel
Save
Reference in new issue