<template>
|
<a-table :columns="columns" :data-source="datasource" bordered>
|
<template #bodyCell="{column, record}">
|
<template v-if="column.key === 'operate'">
|
<a-button @click="viewDetail(record)" type="link">
|
{{ "查看明细" }}
|
</a-button>
|
<a-button @click="showDeleteConfirm(record)" danger type="link">{{"删除"}}</a-button>
|
</template>
|
<template v-if="column.key === 'status'">
|
<a-tag :color="record.status === 1 ? 'green' : 'volcano'">
|
{{record.status === 1 ? "正常" : "禁用"}}
|
</a-tag>
|
</template>
|
</template>
|
</a-table>
|
<a-modal ref="sheetDetl" v-model:open="show" :width="'80%'" title="拣货单明细" @ok="handleOk">
|
<a-table :columns="childNodes" :data-source="childList">
|
<template #bodyCell="{column, record}">
|
<template v-if="column.key === 'status'">
|
<a-tag :color="record.status === 1 ? 'green' : 'volcano'">
|
{{record.status === 1 ? "正常" : "禁用"}}
|
</a-tag>
|
</template>
|
</template>
|
</a-table>
|
</a-modal>
|
</template>
|
|
<script>
|
import {post, get} from "@/utils/request.js";
|
import {message, Modal} from "ant-design-vue";
|
import { createVNode } from 'vue';
|
import {formatMessage} from "@/utils/localeUtils.js";
|
import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
|
|
export default {
|
name: "out-stock-flat",
|
data() {
|
return {
|
columns: [
|
{key: 'number', title: '序号', dataIndex: 'number'},
|
{key: 'pickNo', title: '单号', dataIndex: 'pickNo'},
|
{key: 'waveNo', title: '波次号', dataIndex: 'waveNo'},
|
{key: 'anfme', title: '数量', dataIndex: 'anfme'},
|
{key: 'status', title: '单据状态', dataIndex: 'status'},
|
{key: 'memo', title: '备注', dataIndex: ''},
|
{key: 'createdTime', title: '创建时间', dataIndex: 'createdTime'},
|
{key: 'updatedTime', title: '修改时间', dataIndex: 'updatedTime'},
|
{key: 'operate', title: '操作', dataIndex: 'operate'}
|
],
|
childNodes: [
|
{key: 'number', title: '序号', dataIndex: 'number'},
|
{key: 'maktx', title: '物料名称', dataIndex: 'maktx'},
|
{key: 'matnr', title: '物料编码', dataIndex: 'matnr'},
|
{key: 'batch', title: '批号', dataIndex: 'batch'},
|
{key: 'locNo', title: '库位', dataIndex: 'locNo'},
|
{key: 'barcode', title: '拖盘码', dataIndex: 'barcode'},
|
{key: 'anfme', title: '数量', dataIndex: 'anfme'},
|
{key: 'memo', title: '备注', dataIndex: ''},
|
{key: 'status', title: '单据状态', dataIndex: 'status'},
|
// {key: 'operate', title: '操作', dataIndex: 'operate'}
|
],
|
datasource: [],
|
childList:[],
|
show: false,
|
}
|
},
|
|
mounted() {
|
//获取拣货单数据源
|
this.getOutFlatSheet();
|
},
|
|
methods: {
|
showDeleteConfirm(record){
|
let that = this
|
Modal.confirm({
|
title: '是否确认删除当前拣货单',
|
icon: createVNode(ExclamationCircleOutlined),
|
content: '连同明细一起删除',
|
okText: '确认',
|
okType: 'danger',
|
cancelText: '取消',
|
onOk() {
|
that.removeRow(record)
|
},
|
onCancel() {
|
console.log('Cancel');
|
},
|
});
|
},
|
|
//删除当前行
|
removeRow(record) {
|
let that = this
|
get('/api/pick/flat/remove/' + record.id).then((resp)=>{
|
let result = resp.data;
|
if (result.code == 200) {
|
that.getOutFlatSheet()
|
message.success(formatMessage('page.delete.success', '删除成功'));
|
} else {
|
message.error(result.msg);
|
}
|
})
|
},
|
//查看明细
|
viewDetail(record) {
|
this.show = !this.show
|
this.getSheetDetl(record)
|
},
|
getOutFlatSheet() {
|
let that = this
|
post('/api/pick/flat/page',{page: {currnt: 1, size: 10}}).then((resp) => {
|
let result = resp.data;
|
if (result.code == 200) {
|
// message.success(formatMessage('page.add.success', '成功'));
|
that.datasource = result.data
|
} else {
|
message.error(result.msg);
|
}
|
})
|
},
|
getSheetDetl(record) {
|
let that = this
|
post('/api/pick/flat/detl/page',{page: {currnt: 1, size: 10}, params: {pickId: record.id}}).then((resp) => {
|
let result = resp.data;
|
if (result.code == 200) {
|
// message.success(formatMessage('page.add.success', '成功'));
|
that.childList = result.data
|
} else {
|
message.error(result.msg);
|
}
|
})
|
},
|
}
|
}
|
</script>
|
|
<style scoped>
|
|
</style>
|
