2 changed files with 568 additions and 0 deletions
@ -0,0 +1,28 @@ |
|||
import { createAPI } from "@/utils/httpRequest.js"; |
|||
|
|||
// 获取托盘列表
|
|||
export const getPalletList = data => createAPI('warehouse/pallet/list', 'POST', data) |
|||
|
|||
// 获取托盘信息（根据托盘ID）
|
|||
export const getPalletInfo = data => createAPI('warehouse/pallet/info', 'POST', data) |
|||
|
|||
// 获取托盘信息（根据主键ID）
|
|||
export const getPalletById = id => createAPI(`warehouse/pallet/info/${id}`, 'GET') |
|||
|
|||
// 保存托盘信息
|
|||
export const savePallet = data => createAPI('warehouse/pallet/save', 'POST', data) |
|||
|
|||
// 修改托盘信息
|
|||
export const updatePallet = data => createAPI('warehouse/pallet/update', 'POST', data) |
|||
|
|||
// 删除托盘
|
|||
export const deletePallet = data => createAPI('warehouse/pallet/delete', 'POST', data) |
|||
|
|||
// 检查托盘ID是否存在
|
|||
export const checkPalletId = data => createAPI('warehouse/pallet/checkPalletId', 'POST', data) |
|||
|
|||
// 获取托盘状态选项
|
|||
export const getPalletStatusOptions = () => createAPI('warehouse/pallet/statusOptions', 'GET') |
|||
|
|||
// 获取用户授权站点列表
|
|||
export const getUserAuthorizedSites = data => createAPI('warehouse/pallet/getUserAuthorizedSites', 'POST', data) |
|||
@ -0,0 +1,540 @@ |
|||
<template> |
|||
<div class="mod-config"> |
|||
<div> |
|||
<span @click="favoriteFunction()"> |
|||
<icon-svg :name="favorite?'xiangqufill':'xiangqu'" class="sl-svg"></icon-svg> |
|||
</span> |
|||
</div> |
|||
|
|||
<el-form :inline="true" label-position="top"> |
|||
<el-form-item :label="inputLabel.headerInput.label0"> |
|||
<el-select v-model="queryHeaderData.site" placeholder="请选择站点" style="width: 120px;" clearable> |
|||
<el-option |
|||
v-for="item in siteOptions" |
|||
:key="item.site" |
|||
:label="item.siteName || item.site" |
|||
:value="item.site"> |
|||
</el-option> |
|||
</el-select> |
|||
</el-form-item> |
|||
<el-form-item :label="inputLabel.headerInput.label1"> |
|||
<el-input style="width: 150px;" v-model="queryHeaderData.palletId" placeholder="托盘ID"></el-input> |
|||
</el-form-item> |
|||
<el-form-item :label="inputLabel.headerInput.label2"> |
|||
<el-select v-model="queryHeaderData.palletType" placeholder="请选择" style="width: 120px;" clearable> |
|||
<el-option label="全部" value=""></el-option> |
|||
<el-option label="木质" value="木质"></el-option> |
|||
<el-option label="塑料" value="塑料"></el-option> |
|||
<el-option label="铁制" value="铁制"></el-option> |
|||
</el-select> |
|||
</el-form-item> |
|||
<el-form-item :label="inputLabel.headerInput.label3"> |
|||
<el-select v-model="queryHeaderData.status" placeholder="请选择" style="width: 120px;" clearable> |
|||
<el-option label="全部" value=""></el-option> |
|||
<el-option |
|||
v-for="item in statusOptions" |
|||
:key="item.value" |
|||
:label="item.label" |
|||
:value="item.value"> |
|||
</el-option> |
|||
</el-select> |
|||
</el-form-item> |
|||
<el-form-item :label="inputLabel.headerInput.label4"> |
|||
<el-input style="width: 150px;" v-model="queryHeaderData.locationCode" placeholder="库位编码"></el-input> |
|||
</el-form-item> |
|||
<el-form-item style="margin-top: 20px;"> |
|||
<el-button @click="getDataList()" type="primary">查询</el-button> |
|||
</el-form-item> |
|||
<el-form-item style="margin-top: 20px;"> |
|||
<el-button @click="initModel()" type="primary">新增</el-button> |
|||
<el-button v-if="isAuth(':pallet:delete')" type="danger" @click="deleteHandle()" |
|||
:disabled="dataListSelections.length <= 0">{{ buttons.deleteList}} |
|||
</el-button> |
|||
</el-form-item> |
|||
</el-form> |
|||
|
|||
<el-table |
|||
id="palletTable" |
|||
:height="height" |
|||
:data="dataList" |
|||
border |
|||
v-loading="dataListLoading" |
|||
@selection-change="selectionChangeHandle" |
|||
style="width: 100%;"> |
|||
<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> |
|||
<span v-if="item.columnImage"><img :src="scope.row[item.columnProp]" |
|||
style="width: 100px; height: 80px"/></span> |
|||
</template> |
|||
</el-table-column> |
|||
<el-table-column |
|||
fixed="right" |
|||
header-align="center" |
|||
align="center" |
|||
width="150" |
|||
label="操作"> |
|||
<template slot-scope="scope"> |
|||
<a @click="initModel(scope.row)" type="text" >编辑</a> |
|||
<a @click="delHeaderData(scope.row)" type="text" >删除</a> |
|||
</template> |
|||
</el-table-column> |
|||
</el-table> |
|||
|
|||
<el-pagination |
|||
@size-change="sizeChangeHandle" |
|||
@current-change="currentChangeHandle" |
|||
:current-page="pageIndex" |
|||
:page-sizes="[10, 20, 50, 100]" |
|||
:page-size="pageSize" |
|||
:total="totalPage" |
|||
layout="total, sizes, prev, pager, next, jumper"> |
|||
</el-pagination> |
|||
|
|||
<!-- 新增/编辑dialog --> |
|||
<el-dialog :close-on-click-modal="false" :close-on-press-escape="false" |
|||
v-drag :title="inputLabel.headerInput.label5" |
|||
:visible.sync="setUp.reviewFlag" width="360px"> |
|||
<el-form :model="saveHeaderData" ref="dataForm" |
|||
label-width="100px" size="medium" :inline="true" label-position="top"> |
|||
<el-row :gutter="20"> |
|||
<el-col :span="12"> |
|||
<el-form-item :label="inputLabel.headerInput.label0" prop="site"> |
|||
<el-select v-model="saveHeaderData.site" placeholder="请选择站点" style="width: 100%;"> |
|||
<el-option |
|||
v-for="item in siteOptions" |
|||
:key="item.siteCode" |
|||
:label="item.siteName || item.siteCode" |
|||
:value="item.siteCode"> |
|||
</el-option> |
|||
</el-select> |
|||
</el-form-item> |
|||
</el-col> |
|||
<el-col :span="12"> |
|||
<el-form-item :label="inputLabel.headerInput.label1" prop="palletId"> |
|||
<el-input v-model="saveHeaderData.palletId" readonly |
|||
placeholder="系统自动生成"></el-input> |
|||
</el-form-item> |
|||
</el-col> |
|||
<el-col :span="12"> |
|||
<el-form-item :label="inputLabel.headerInput.label2" prop="palletType"> |
|||
<el-select v-model="saveHeaderData.palletType" placeholder="请选择" style="width: 100%;"> |
|||
<el-option label="木质" value="木质"></el-option> |
|||
<el-option label="塑料" value="塑料"></el-option> |
|||
<el-option label="铁制" value="铁制"></el-option> |
|||
</el-select> |
|||
</el-form-item> |
|||
</el-col> |
|||
<el-col :span="12"> |
|||
<el-form-item label="托盘尺寸"> |
|||
<el-input v-model="saveHeaderData.palletSize" placeholder="如: 1200x1000"></el-input> |
|||
</el-form-item> |
|||
</el-col> |
|||
<el-col :span="12"> |
|||
<el-form-item label="最大承重(kg)"> |
|||
<el-input v-model="saveHeaderData.maxLoad" :precision="2" |
|||
:min="0" placeholder="请输入最大承重" style="width: 100%;"></el-input> |
|||
</el-form-item> |
|||
</el-col> |
|||
<el-col :span="12"> |
|||
<el-form-item :label="inputLabel.headerInput.label3" prop="status"> |
|||
<el-select v-model="saveHeaderData.status" placeholder="请选择" style="width: 100%;"> |
|||
<el-option |
|||
v-for="item in statusOptions" |
|||
:key="item.value" |
|||
:label="item.label" |
|||
:value="item.value"> |
|||
</el-option> |
|||
</el-select> |
|||
</el-form-item> |
|||
</el-col> |
|||
<el-col :span="12"> |
|||
<el-form-item :label="inputLabel.headerInput.label4"> |
|||
<el-input v-model="saveHeaderData.locationCode" placeholder="请输入库位编码"></el-input> |
|||
</el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
</el-form> |
|||
<span slot="footer" class="dialog-footer" > |
|||
<el-button @click="setUp.reviewFlag = false">取消</el-button> |
|||
<el-button type="primary" :disabled="setUp.saveButton" @click="saveHeaderFunction()">确定</el-button> |
|||
</span> |
|||
</el-dialog> |
|||
|
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import { |
|||
userFavoriteList, |
|||
saveUserFavorite, |
|||
removeUserFavorite, |
|||
} from '@/api/userFavorite.js' |
|||
import { |
|||
getPalletList, |
|||
savePallet, |
|||
updatePallet, |
|||
deletePallet, |
|||
checkPalletId, |
|||
getPalletStatusOptions, |
|||
getUserAuthorizedSites |
|||
} from '@/api/warehouse/pallet.js' |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
saveHeaderData: { |
|||
id: null, |
|||
site: '', |
|||
palletId: '', |
|||
palletType: '', |
|||
palletSize: '', |
|||
maxLoad: null, |
|||
status: 'AVAILABLE', |
|||
locationCode: '', |
|||
remark: '', |
|||
createdBy: this.$store.state.user.name, |
|||
updatedBy: this.$store.state.user.name |
|||
}, |
|||
queryHeaderData: { |
|||
site: '', |
|||
palletId: '', |
|||
palletType: '', |
|||
status: '', |
|||
locationCode: '', |
|||
page: 1, |
|||
limit: 20 |
|||
}, |
|||
setUp: { |
|||
reviewFlag: false, |
|||
saveButton: false, |
|||
readonlyFlag: false, |
|||
}, |
|||
inputLabel: { |
|||
headerInput: { |
|||
label0: '站点', |
|||
label1: '托盘ID', |
|||
label2: '托盘类型', |
|||
label3: '托盘状态', |
|||
label4: '库位编码', |
|||
label5: '托盘信息', |
|||
}, |
|||
}, |
|||
statusOptions: [], |
|||
siteOptions: [], |
|||
// table高度 |
|||
height: 450, |
|||
// 是否收藏 |
|||
favorite: false, |
|||
functionId: this.$route.meta.menuId, |
|||
// 展示列集 |
|||
columnList: [ |
|||
{ |
|||
columnProp: "site", |
|||
headerAlign: "center", |
|||
align: "center", |
|||
columnLabel: "站点", |
|||
columnWidth: 100, |
|||
}, |
|||
{ |
|||
columnProp: "palletId", |
|||
headerAlign: "center", |
|||
align: "center", |
|||
columnLabel: "托盘ID", |
|||
columnWidth: 150, |
|||
}, |
|||
{ |
|||
columnProp: "palletType", |
|||
headerAlign: "center", |
|||
align: "center", |
|||
columnLabel: "托盘类型", |
|||
columnWidth: 100, |
|||
}, |
|||
{ |
|||
columnProp: "palletSize", |
|||
headerAlign: "center", |
|||
align: "center", |
|||
columnLabel: "托盘尺寸", |
|||
columnWidth: 120, |
|||
}, |
|||
{ |
|||
columnProp: "maxLoad", |
|||
headerAlign: "center", |
|||
align: "center", |
|||
columnLabel: "最大承重", |
|||
columnWidth: 120, |
|||
}, |
|||
{ |
|||
columnProp: "statusText", |
|||
headerAlign: "center", |
|||
align: "center", |
|||
columnLabel: "状态", |
|||
columnWidth: 100, |
|||
}, |
|||
{ |
|||
columnProp: "locationCode", |
|||
headerAlign: "center", |
|||
align: "center", |
|||
columnLabel: "库位编码", |
|||
columnWidth: 150, |
|||
}, |
|||
{ |
|||
columnProp: "createdBy", |
|||
headerAlign: "center", |
|||
align: "center", |
|||
columnLabel: "创建人", |
|||
columnWidth: 100, |
|||
}, |
|||
{ |
|||
columnProp: "createdTime", |
|||
headerAlign: "center", |
|||
align: "center", |
|||
columnLabel: "创建时间", |
|||
columnWidth: 150, |
|||
}, |
|||
], |
|||
// 数据集 |
|||
dataList: [], |
|||
buttons: { |
|||
deleteList: '批量删除', |
|||
}, |
|||
// 分页 |
|||
pageIndex: 1, |
|||
pageSize: 20, |
|||
totalPage: 0, |
|||
dataListLoading: false, |
|||
dataListSelections: [], |
|||
// 验证规则 |
|||
dataRule: { |
|||
site: [ |
|||
{ required: true, message: '站点不能为空', trigger: 'change' } |
|||
], |
|||
palletType: [ |
|||
{ required: true, message: '托盘类型不能为空', trigger: 'change' } |
|||
], |
|||
status: [ |
|||
{ required: true, message: '托盘状态不能为空', trigger: 'change' } |
|||
] |
|||
} |
|||
} |
|||
}, |
|||
mounted() { |
|||
this.$nextTick(() => { |
|||
this.height = window.innerHeight - 220; |
|||
}) |
|||
}, |
|||
activated() { |
|||
this.getDataList() |
|||
this.getStatusOptions() |
|||
this.getSiteOptions() |
|||
}, |
|||
methods: { |
|||
// 获取状态选项 |
|||
getStatusOptions() { |
|||
getPalletStatusOptions().then(({data}) => { |
|||
if (data && data.code === 0) { |
|||
this.statusOptions = data.options |
|||
} |
|||
}) |
|||
}, |
|||
// 获取站点选项 |
|||
getSiteOptions() { |
|||
const params = { |
|||
userName: this.$store.state.user.name |
|||
} |
|||
getUserAuthorizedSites(params).then(({data}) => { |
|||
if (data && data.code === 0) { |
|||
this.siteOptions = data.data |
|||
} |
|||
}).catch(error => { |
|||
console.error('获取站点列表失败:', error) |
|||
}) |
|||
}, |
|||
// 删除托盘 |
|||
delHeaderData(row) { |
|||
this.$confirm(`确定删除托盘 [${row.palletId}]?`, '操作提示', { |
|||
confirmButtonText: '确定', |
|||
cancelButtonText: '取消', |
|||
type: 'warning' |
|||
}).then(() => { |
|||
deletePallet([row.id]).then(({data}) => { |
|||
if (data.code == 0) { |
|||
this.$message.success(data.msg) |
|||
this.getDataList() |
|||
} else { |
|||
this.$alert(data.msg, '操作提示', { |
|||
confirmButtonText: '确定' |
|||
}); |
|||
} |
|||
}) |
|||
}) |
|||
}, |
|||
// 保存托盘 |
|||
saveHeaderFunction() { |
|||
this.$refs.dataForm.validate((valid) => { |
|||
if (valid) { |
|||
this.setUp.saveButton = true |
|||
|
|||
// 准备提交数据 |
|||
let submitData = { ...this.saveHeaderData } |
|||
|
|||
// 如果是新增，清空托盘ID让后端自动生成 |
|||
if (!submitData.id) { |
|||
submitData.palletId = '' |
|||
} |
|||
|
|||
const apiMethod = submitData.id ? updatePallet : savePallet |
|||
|
|||
apiMethod(submitData).then(({data}) => { |
|||
this.setUp.saveButton = false |
|||
if (data.code == 0) { |
|||
this.$message.success(data.msg) |
|||
this.getDataList() |
|||
this.setUp.reviewFlag = false |
|||
} else { |
|||
this.$alert(data.msg, '操作提示', { |
|||
confirmButtonText: '确定' |
|||
}); |
|||
} |
|||
}).catch(() => { |
|||
this.setUp.saveButton = false |
|||
}) |
|||
} |
|||
}) |
|||
}, |
|||
// 初始化表单 |
|||
initModel(row) { |
|||
this.setUp.reviewFlag = true |
|||
this.setUp.saveButton = false |
|||
this.setUp.readonlyFlag = false |
|||
|
|||
if (row) { |
|||
// 编辑模式 |
|||
this.setUp.readonlyFlag = true |
|||
this.saveHeaderData = { |
|||
id: row.id, |
|||
site: row.site, |
|||
palletId: row.palletId, |
|||
palletType: row.palletType, |
|||
palletSize: row.palletSize, |
|||
maxLoad: row.maxLoad, |
|||
status: row.status, |
|||
locationCode: row.locationCode, |
|||
remark: row.remark, |
|||
updatedBy: this.$store.state.user.name |
|||
} |
|||
} else { |
|||
// 新增模式 |
|||
this.saveHeaderData = { |
|||
id: null, |
|||
site: '', |
|||
palletId: '系统自动生成', |
|||
palletType: '', |
|||
palletSize: '', |
|||
maxLoad: null, |
|||
status: 'AVAILABLE', |
|||
locationCode: '', |
|||
remark: '', |
|||
createdBy: this.$store.state.user.name |
|||
} |
|||
} |
|||
}, |
|||
// 收藏功能 |
|||
favoriteFunction() { |
|||
let userFavorite = { |
|||
userId: this.$store.state.user.id, |
|||
functionId: this.$route.meta.menuId, |
|||
} |
|||
if (this.favorite) { |
|||
this.$confirm(`确定取消收藏`, '提示', { |
|||
confirmButtonText: '确定', |
|||
cancelButtonText: '取消', |
|||
type: 'warning' |
|||
}).then(() => { |
|||
removeUserFavorite(userFavorite).then(({data}) => { |
|||
this.$message.success(data.msg) |
|||
this.favorite = false |
|||
}) |
|||
}) |
|||
} else { |
|||
saveUserFavorite(userFavorite).then(({data}) => { |
|||
this.$message.success(data.msg) |
|||
this.favorite = true |
|||
}) |
|||
} |
|||
}, |
|||
// 获取数据列表 |
|||
getDataList() { |
|||
this.dataListLoading = true |
|||
this.queryHeaderData.page = this.pageIndex |
|||
this.queryHeaderData.limit = this.pageSize |
|||
|
|||
getPalletList(this.queryHeaderData).then(({data}) => { |
|||
if (data && data.code === 0) { |
|||
this.dataList = data.page.list |
|||
this.totalPage = data.page.totalCount |
|||
} else { |
|||
this.dataList = [] |
|||
this.totalPage = 0 |
|||
} |
|||
this.dataListLoading = false |
|||
}) |
|||
}, |
|||
// 每页数 |
|||
sizeChangeHandle(val) { |
|||
this.pageSize = val |
|||
this.pageIndex = 1 |
|||
this.getDataList() |
|||
}, |
|||
// 当前页 |
|||
currentChangeHandle(val) { |
|||
this.pageIndex = val |
|||
this.getDataList() |
|||
}, |
|||
// 多选 |
|||
selectionChangeHandle(val) { |
|||
this.dataListSelections = val |
|||
}, |
|||
// 批量删除 |
|||
deleteHandle() { |
|||
var ids = this.dataListSelections.map(item => { |
|||
return item.id |
|||
}) |
|||
this.$confirm(`确定批量删除选中的托盘?`, '提示', { |
|||
confirmButtonText: '确定', |
|||
cancelButtonText: '取消', |
|||
type: 'warning' |
|||
}).then(() => { |
|||
deletePallet(ids).then(({data}) => { |
|||
if (data && data.code === 0) { |
|||
this.$message.success('操作成功') |
|||
this.getDataList() |
|||
} else { |
|||
this.$message.error(data.msg) |
|||
} |
|||
}) |
|||
}) |
|||
} |
|||
}, |
|||
created() { |
|||
// 初始化收藏状态 |
|||
this.favorite = false |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style scoped> |
|||
.sl-svg { |
|||
overflow: hidden; |
|||
float: right; |
|||
} |
|||
</style> |
|||
Write
Preview
Loading…
Cancel
Save
Reference in new issue