wms_client_kate_suzhou/src/layout/stockUpdateRecord.vue
liangzhou 18c7068b28 代码更新:
1. 修改任务记录界面
2024-10-15 17:12:16 +08:00

207 lines
7.6 KiB
Vue

<template>
<div style="margin-bottom: 10px; height: 100%; padding-left: 1%; padding-right: 1%;">
<el-config-provider :locale="zhCn">
<div style="display: flex;justify-content: space-between;">
<el-row>
<el-input v-model="vehicleIdQuery" style="width: 158px; margin-right: 10px;" placeholder="箱号"
:suffix-icon="Search" />
<el-input v-model="goodsIdQuery" style="width: 158px; margin-right: 10px;" placeholder="料号"
:suffix-icon="Search" />
<el-select-v2 v-model="reasonQuery" style="width: 158px; margin-right: 10px;"
placeholder="请选择更新原因" :options="reasonOptions" @change="search()"></el-select-v2>
<el-button type="primary" @click="search()">搜索</el-button>
<el-button type="warning" @click="reset()">重置</el-button>
</el-row>
</div>
<br />
<el-table :data="recordList" stripe border v-loading="loading" class="table-class" highlight-current-row
max-height="650px" @row-click="getCurrentRow" :header-cell-style="{ 'text-align': 'center' }"
:cell-style="{ 'text-align': 'center' }">
<el-table-column width="65px" fixed="left">
<template v-slot="scope">
<el-radio :label="scope.row.recordId" v-model="recordId">&nbsp;</el-radio>
</template>
</el-table-column>
<el-table-column prop="recordId" label="id" fixed="left" min-width="120px" show-overflow-tooltip />
<el-table-column prop="stockId" label="库存编号" min-width="120px" show-overflow-tooltip />
<el-table-column prop="vehicleId" label="箱号" min-width="120px" show-overflow-tooltip />
<el-table-column prop="goodsId" label="料号" show-overflow-tooltip min-width="120px" />
<el-table-column prop="goodsName" label="物料名称" min-width="120px" show-overflow-tooltip />
<el-table-column prop="locationBefore" label="原位置" min-width="120px" show-overflow-tooltip />
<el-table-column prop="locationAfter" label="新位置" min-width="120px" show-overflow-tooltip />
<el-table-column prop="quantityBefore" label="原数量" min-width="120px" />
<el-table-column prop="quantityAfter" label="新数量" min-width="120px" />
<el-table-column prop="reason" label="原因" fixed="right" show-overflow-tooltip min-width="120px" />
<el-table-column prop="updateTime" label="完成时间" :formatter="timeFormat" min-width="120px"
show-overflow-tooltip />
<el-table-column prop="updateUser" label="操作用户" show-overflow-tooltip min-width="120px" />
</el-table>
<br />
<el-pagination v-model:current-page="currentPage" v-model:page-size="pageSize" :page-sizes="[10, 25, 50]"
:small="false" :disabled="false" :background="false" :default-page-size="10"
layout="total, sizes, prev, pager, next, jumper" :total="total" @size-change="search"
@current-change="search" />
</el-config-provider>
</div>
</template>
<script setup>
import store from '@/store'
import { getStockUpdateRecord } from '@/api/stock.js'
import { errorBox } from '@/utils/myMessageBox.js'
import { dateFormatter, timeFormatter } from '@/utils/formatter.js'
import { Search } from '@element-plus/icons-vue'
import zhCn from 'element-plus/dist/locale/zh-cn.mjs'
</script>
<script>
export default {
name: 'stockUpdateRecord',
data() {
return {
recordList: [],
currentPage: 1,
pageSize: 10,
total: 0,
vehicleIdQuery: '',
goodsIdQuery: '',
reasonQuery: '',
loading: true,
recordId: '',
reasonOptions: [
{
value: '',
label: '全部'
},
{
value: '备料拣选更新',
label: '备料拣选更新'
},
{
value: '站台确认更新',
label: '站台确认更新'
},
{
value: '直接物料非计划领料回库更新',
label: '直接物料非计划领料回库更新'
},
{
value: '站台处理箱料错误',
label: '站台处理箱料错误'
},
{
value: '界面修改库存',
label: '界面修改库存'
},
{
value: '界面删除库存',
label: '界面删除库存'
},
{
value: '界面增加库存',
label: '界面增加库存'
},
{
value: '入库更新库存',
label: '入库更新库存'
},
{
value: '入库增加库存',
label: '入库增加库存'
},
{
value: '整出',
label: '整出'
},
],
}
},
mounted() {
this.search()
},
methods: {
search() {
this.loading = true
const request = {
pageNo: this.currentPage,
pageSize: this.pageSize,
vehicleId: this.vehicleIdQuery.trim(),
goodsId: this.goodsIdQuery.trim(),
reason: this.reasonQuery.trim(),
userName: store.getters.getUserName
}
getStockUpdateRecord(request).then(res => {
const tableResponse = res.data
if (tableResponse.code == 0) {
this.recordList = tableResponse.returnData.lists
this.total = tableResponse.returnData.total
} else {
errorBox(tableResponse.message)
}
}).catch(err => {
console.log(err)
errorBox('查询库存更新记录错误')
})
this.loading = false
},
timeFormat: (row, column, cellValue, index) => {
return timeFormatter(cellValue)
},
reset() {
this.vehicleIdQuery = ''
this.goodsIdQuery = ''
this.reasonQuery = ''
this.search()
},
getCurrentRow(row) {
this.recordId = row.recordId
},
},
}
</script>
<style scoped>
.el-pagination {
padding-left: 5px;
}
.el-row .el-button {
width: 72px;
margin-left: 0px;
margin-right: 5px;
}
.table-class {
width: 100%;
}
.el-row .el-form-item {
width: 10% inherit;
justify-content: center;
}
.el-row .el-form-item .el-select-v2 {
width: 100% !important;
}
.el-row .el-form-item .el-input-number {
width: 100% !important;
}
.el-row .el-form-item .el-button {
margin: auto;
}
.title-area {
display: flex;
/* min-height: 10%; */
max-height: max-content;
margin-bottom: 10px;
min-width: inherit;
border: solid 1px;
border-radius: 10px;
box-shadow: 0px 15px 10px -15px #000;
overflow: auto;
flex-direction: column;
padding: 10px;
}
</style>