出库单展示调整

This commit is contained in:
2024-05-20 16:49:03 +08:00
parent ad2c842997
commit abccc2361c
2 changed files with 128 additions and 86 deletions

View File

@@ -1,7 +1,7 @@
<template>
<div>
<el-dialog v-loading="loading" v-bind="$attrs" v-on="$listeners" @open="onOpen" @close="onClose" title="出库单打印" width="860px">
<el-tabs v-model="activeName" @tab-click="handleClick">
<el-tabs v-model="activeName">
<el-tab-pane label="出库单" name="1">
<div class="print" id="printDom1" ref="printRef">
<div class="print-body-box">

View File

@@ -4,27 +4,49 @@
<el-form ref="elForm" :model="formData" :rules="rules" size="medium" label-width="100px"> </el-form>
<!-- 出库计划列表 -->
<div>
<!-- 数据区域 -->
<el-table :data="dataList" v-loading="loading" ref="table" border highlight-current-row max-height="400px">
<el-table-column prop="packageCode" label="批次号" align="center" :show-overflow-tooltip="true" min-width="140" />
<el-table-column prop="partnumber" label="物料号(零件号)" align="center" :show-overflow-tooltip="true" min-width="140" />
<el-table-column prop="description" label="描述" align="center" :show-overflow-tooltip="true" min-width="160" />
<el-table-column prop="warehouseCode" label="所属仓库" align="center" :show-overflow-tooltip="true" />
<el-table-column prop="requireNum" label="零件总需求" align="center" :show-overflow-tooltip="true" />
<el-table-column prop="outPackageNum" label="已出箱" align="center" :show-overflow-tooltip="true" />
<el-table-column prop="outPartnumberNum" label="已出零件" align="center" :show-overflow-tooltip="true" />
<el-table-column prop="packagePlanNum" label="计划箱" align="center" :show-overflow-tooltip="true" />
<el-table-column prop="partnumberPlanNum" label="计划零件" align="center" :show-overflow-tooltip="true" />
<el-table-column prop="packageNum" label="仓库箱" align="center" :show-overflow-tooltip="true" />
<el-table-column prop="partnumberNum" label="仓库零件" align="center" :show-overflow-tooltip="true" />
<el-table-column prop="isOver" label="是否出完" align="center">
<template slot-scope="scope">
<el-tag v-if="scope.row.isOver" type="success" effect="dark">已出完</el-tag>
<el-tag v-else type="info" effect="dark">未出完</el-tag>
</template>
</el-table-column>
<el-table-column prop="outOrder" label="计划顺序" align="center" :show-overflow-tooltip="true" />
</el-table>
<el-tabs type="border-card" v-model="activeName">
<el-tab-pane label="出库简报" name="1">
<!-- 数据区域 -->
<el-table :data="dataList" v-loading="loading" ref="table" border highlight-current-row max-height="400px" show-summary>
<el-table-column :filters="filters" :filter-method="filterHandler" prop="partnumber" label="物料号(零件号)" align="center" :show-overflow-tooltip="true" min-width="140" />
<el-table-column prop="packageCode" label="批次号" align="center" :show-overflow-tooltip="true" min-width="140" />
<el-table-column prop="description" label="描述" align="center" :show-overflow-tooltip="true" min-width="160" />
<el-table-column prop="warehouseCode" label="所属仓库" align="center" :show-overflow-tooltip="true" />
<el-table-column prop="outPackageNum" label="已出" align="center" :show-overflow-tooltip="true" />
<el-table-column prop="outPartnumberNum" label="已出零件" align="center" :show-overflow-tooltip="true" />
<el-table-column prop="isOver" label="是否出完" align="center">
<template slot-scope="scope">
<el-tag v-if="scope.row.isOver" type="success" effect="dark">已出完</el-tag>
<el-tag v-else type="info" effect="dark">未出完</el-tag>
</template>
</el-table-column>
</el-table>
</el-tab-pane>
<el-tab-pane label="详细信息" name="2">
<!-- 数据区域 -->
<el-table :data="dataList" v-loading="loading" ref="table" border highlight-current-row max-height="400px">
<el-table-column :filters="filters" :filter-method="filterHandler" prop="partnumber" label="物料号(零件号)" align="center" :show-overflow-tooltip="true" min-width="140" />
<el-table-column prop="packageCode" label="批次号" align="center" :show-overflow-tooltip="true" min-width="140" />
<el-table-column prop="description" label="描述" align="center" :show-overflow-tooltip="true" min-width="160" />
<el-table-column prop="warehouseCode" label="所属仓库" align="center" :show-overflow-tooltip="true" />
<el-table-column prop="requireNum" label="零件总需求" align="center" :show-overflow-tooltip="true" />
<el-table-column prop="outPackageNum" label="已出箱" align="center" :show-overflow-tooltip="true" />
<el-table-column prop="outPartnumberNum" label="已出零件" align="center" :show-overflow-tooltip="true" />
<el-table-column prop="packagePlanNum" label="计划箱" align="center" :show-overflow-tooltip="true" />
<el-table-column prop="partnumberPlanNum" label="计划零件" align="center" :show-overflow-tooltip="true" />
<el-table-column prop="packageNum" label="仓库箱" align="center" :show-overflow-tooltip="true" />
<el-table-column prop="partnumberNum" label="仓库零件" align="center" :show-overflow-tooltip="true" />
<el-table-column prop="isOver" label="是否出完" align="center">
<template slot-scope="scope">
<el-tag v-if="scope.row.isOver" type="success" effect="dark">已出完</el-tag>
<el-tag v-else type="info" effect="dark">未出完</el-tag>
</template>
</el-table-column>
<el-table-column prop="outOrder" label="计划顺序" align="center" :show-overflow-tooltip="true" />
</el-table>
</el-tab-pane>
</el-tabs>
<!-- <pagination
class="mt10"
background
@@ -42,71 +64,91 @@
</div>
</template>
<script>
import * as WmOutOrderApi from '@/api/wmsManagement/wmOutOrder.js'
export default {
inheritAttrs: false,
components: {},
props: ['planKey'],
data() {
return {
loading:false,
formData: {},
// 查询参数
queryParams: {
pageNum: 1,
pageSize: 10,
import * as WmOutOrderApi from '@/api/wmsManagement/wmOutOrder.js'
export default {
inheritAttrs: false,
components: {},
props: ['planKey'],
data() {
return {
loading: false,
formData: {},
// 查询参数
queryParams: {
pageNum: 1,
pageSize: 10,
},
activeName: '1',
// 弹出层标题
title: '出库详情',
// 数据列表
dataList: [],
filters: [],
filteredValue: [],
// 总记录数
total: 0,
rules: {},
}
},
computed: {},
watch: {},
created() {},
mounted() {},
methods: {
onOpen() {
this.activeName = '1';
this.getList()
},
// 弹出层标题
title: '出库详情',
// 数据列表
dataList: [],
// 总记录数
total: 0,
rules: {},
}
},
computed: {},
watch: {},
created() {},
mounted() {},
methods: {
onOpen() {
this.getList()
},
onClose() {
this.$refs['elForm'].resetFields()
},
close() {
this.$emit('update:visible', false)
},
handelConfirm() {
this.$refs['elForm'].validate((valid) => {
if (!valid) return
this.close()
})
},
getList() {
// this.loading = false;
// return;
this.loading = true
setTimeout(() => {
this.loading = false
}, 30000)
WmOutOrderApi.getOutOrderPlanAndOutProductionNum({ shipment_num: this.planKey }).then((res) => {
if (res.code === 200) {
console.log(res);
this.dataList = res.data
// 计划出库批次清单
onClose() {
this.$refs['elForm'].resetFields()
},
close() {
this.$emit('update:visible', false)
},
handelConfirm() {
this.$refs['elForm'].validate((valid) => {
if (!valid) return
this.close()
})
},
getList() {
// this.loading = false;
// return;
this.loading = true
setTimeout(() => {
this.loading = false
} else {
this.$message.error('获取列表失败!' + res.msg + this.planKey)
this.loading = false
}
})
}, 30000)
this.filters = [];
WmOutOrderApi.getOutOrderPlanAndOutProductionNum({ shipment_num: this.planKey }).then((res) => {
if (res.code === 200) {
this.dataList = res.data;
let filterList = [];
for (let item of this.dataList) {
if (!filterList.includes(item.partnumber)) {
filterList.push(item.partnumber);
this.filters.push({ text: item.partnumber + ' ' + item.description, value: item.partnumber });
}
}
console.log(this.filters);
// 计划出库批次清单
this.loading = false
} else {
this.$message.error('获取列表失败!' + res.msg + this.planKey)
this.loading = false
}
})
},
/** 修改按钮操作 */
handleUpdate(row) {},
handleClick(tab, event) {
},
filterHandler(value, row, column) {
const property = column['property'];
return row[property] === value;
},
},
/** 修改按钮操作 */
handleUpdate(row) {},
},
}
}
</script>
<style></style>
<style></style>