skyouc
2025-07-04 49b8b52ae6dfb28e3e9a741bb277c231bd13418d
zy-asrs-admin/src/views/out/flat/index.vue
@@ -2,24 +2,18 @@
    <div class="table-header">
        <div style="display: flex;padding: 10px;">
            <div style="margin-right: 10px;">
                <a-input v-model:value="searchParam.pickNo"
                         placeholder="请输拣货单编号"
                         style="width: 200px;margin-right: 10px;"/>
                <a-input v-model:value="searchParam.waveNo" placeholder="请输入波次号"
                                style="width: 200px;" />
                <a-input v-model:value="searchParam.pickNo" placeholder="请输拣货单编号"
                    style="width: 200px;margin-right: 10px;" />
                <a-input v-model:value="searchParam.waveNo" placeholder="请输入波次号" style="width: 200px;" />
                <a-button @click="queryPickSheets" type="primary" style="margin-left: 35px">查询</a-button>
            </div>
        </div>
    </div>
    <a-table :columns="columns"
             :data-source="datasource" bordered
             :defaultExpandAllRows="false"
             :row-selection="{ selectedRowKeys: state.selectedRowKeys, onChange: onSelectChange }"
             :scroll="{y: columns.length * 140}"
             style="margin: 5px"
    >
        <template #bodyCell="{column, record, index}">
    <a-table :columns="columns" :data-source="datasource" bordered :defaultExpandAllRows="false"
        :row-selection="{ selectedRowKeys: state.selectedRowKeys, onChange: onSelectChange }"
        :scroll="{ y: columns.length * 140 }" style="margin: 5px">
        <template #bodyCell="{ column, record, index }">
            <template v-if="column.key === 'number'">
                {{ index + 1 }}
            </template>
@@ -38,7 +32,7 @@
        </template>
    </a-table>
    <a-modal ref="sheetDetl" v-model:open="show" :width="'80%'" title="拣货单明细" @ok="handleOk" @cancel="cancel"
             :okText="isPrint ? '打印' : '确认'" cancel-text="关闭">
        :okText="isPrint ? '打印' : '确认'" cancel-text="关闭">
        <div id="pcik-detl">
            <div class="component-header">
                <div>
@@ -50,15 +44,11 @@
                    </h3>
                </div>
                <div class="qrcode">
                    <a-qrcode :value="selectDetl.pickNo" :size="100" :bordered="false"/>
                    <a-qrcode :value="selectDetl.pickNo" :size="100" :bordered="false" />
                </div>
            </div>
            <a-table :columns="childNodes"
                     :data-source="childList"
                     bordered
                     :pagination="{hideOnSinglePage: true}"
            >
                <template #bodyCell="{column, record, index}">
            <a-table :columns="childNodes" :data-source="childList" bordered :pagination="{ hideOnSinglePage: true }">
                <template #bodyCell="{ column, record, index }">
                    <template v-if="column.key === 'number'">
                        {{ index + 1 }}
                    </template>
@@ -74,183 +64,184 @@
</template>
<script>
    import {post, get} from "@/utils/request.js";
    import {message, Modal} from "ant-design-vue";
    import {createVNode} from 'vue';
    import {ExclamationCircleOutlined} from '@ant-design/icons-vue';
    import printJS from 'print-js'
import { post, get } from "@/utils/request.js";
import { message, Modal } from "ant-design-vue";
import { createVNode } from 'vue';
import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
import printJS from 'print-js'
    export default {
        name: "out-stock-flat",
        data() {
            return {
                searchParam: {
                    pickNo: '',
                    waveNo:''
                },
                state: {
                    selectedRowKeys: []
                },
                searchInput: '',
                columns: [
                    {key: 'number', title: '序号', dataIndex: 'number', align: 'center', width: '65px'},
                    {key: 'pickNo', title: '单号', dataIndex: 'pickNo', align: 'center', width: '205px'},
                    {key: 'waveNo', title: '波次号', dataIndex: 'waveNo', align: 'center', width: '155px'},
                    {key: 'anfme', title: '数量', dataIndex: 'anfme', align: 'center', width: '85px'},
                    {key: 'status', title: '单据状态', dataIndex: 'status', align: 'center', width: '105px'},
                    {key: 'createdTime', title: '创建时间', dataIndex: 'createdTime', align: 'center', width: '185px'},
                    {key: 'updatedTime', title: '修改时间', dataIndex: 'updatedTime', align: 'center', width: '185px'},
                    {key: 'memo', title: '备注', dataIndex: '', align: 'center'},
                    {
                        key: 'operate',
                        title: '操作',
                        dataIndex: 'operate',
                        fixed: 'right',
                        align: 'center',
                        width: '155px'
                    }
                ],
                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,
                isPrint: false,
                selectDetl: {},
export default {
    name: "out-stock-flat",
    data() {
        return {
            searchParam: {
                pickNo: '',
                waveNo: ''
            },
            state: {
                selectedRowKeys: []
            },
            searchInput: '',
            columns: [
                { key: 'number', title: '序号', dataIndex: 'number', align: 'center', width: '65px' },
                { key: 'pickNo', title: '单号', dataIndex: 'pickNo', align: 'center', width: '205px' },
                { key: 'waveNo', title: '波次号', dataIndex: 'waveNo', align: 'center', width: '205px' },
                { key: 'type$', title: '类型', dataIndex: 'type$', align: 'center', width: '155px' },
                { key: 'anfme', title: '数量', dataIndex: 'anfme', align: 'center', width: '85px' },
                { key: 'status', title: '单据状态', dataIndex: 'status', align: 'center', width: '105px' },
                { key: 'createdTime', title: '创建时间', dataIndex: 'createdTime', align: 'center', width: '185px' },
                { key: 'updatedTime', title: '修改时间', dataIndex: 'updatedTime', align: 'center', width: '185px' },
                { key: 'memo', title: '备注', dataIndex: '', align: 'center' },
                {
                    key: 'operate',
                    title: '操作',
                    dataIndex: 'operate',
                    fixed: 'right',
                    align: 'center',
                    width: '155px'
                }
            ],
            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,
            isPrint: false,
            selectDetl: {},
        }
    },
    mounted() {
        //获取拣货单数据源
        this.getOutFlatSheet();
    },
    methods: {
        queryPickSheets() {
            this.getOutFlatSheet()
        },
        handleOk() {
            if (this.isPrint) {
                printJS('pcik-detl', 'html')
            }
        },
        mounted() {
            //获取拣货单数据源
            this.getOutFlatSheet();
        cancel() {
            this.isPrint = false
        },
        onSelectChange(selectedRowKeys) {
            state.selectedRowKeys = selectedRowKeys;
        },
        /**
         * 打印
         */
        handlePrint(column, record) {
            this.show = true
            this.isPrint = true
            this.selectDetl = record
            this.getSheetDetl(record)
        },
        /**
         * 搜索
         */
        onSearch() {
            console.log(this)
        },
        methods: {
            queryPickSheets() {
              this.getOutFlatSheet()
            },
        showDeleteConfirm(record) {
            let that = this
            Modal.confirm({
                title: '是否确认删除当前拣货单',
                icon: createVNode(ExclamationCircleOutlined),
                content: '连同明细一起删除',
                okText: '确认',
                okType: 'danger',
                cancelText: '取消',
                onOk() {
                    that.removeRow(record)
                },
                onCancel() {
                    console.log('Cancel');
                },
            });
        },
            handleOk() {
                if (this.isPrint) {
                    printJS('pcik-detl', 'html')
        //删除当前行
        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);
                }
            },
            cancel() {
                this.isPrint = false
            },
            onSelectChange(selectedRowKeys) {
                state.selectedRowKeys = selectedRowKeys;
            },
            /**
             * 打印
             */
            handlePrint(column, record) {
                this.show = true
                this.isPrint = true
                this.selectDetl = record
                this.getSheetDetl(record)
            },
            /**
             * 搜索
             */
            onSearch() {
                console.log(this)
            },
            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(column, record) {
                this.show = !this.show
                this.isPrint = false
                this.selectDetl = record
                this.getSheetDetl(record)
            },
            getOutFlatSheet() {
                let that = this
                post('/api/pick/flat/page', {page: {currnt: 1, size: 10},  params: {pickNo: this.searchParam.pickNo, waveNo: this.searchParam.waveNo}}).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);
                    }
                })
            },
        }
            })
        },
        //查看明细
        viewDetail(column, record) {
            this.show = !this.show
            this.isPrint = false
            this.selectDetl = record
            this.getSheetDetl(record)
        },
        getOutFlatSheet() {
            let that = this
            post('/api/pick/flat/page', { page: { currnt: 1, size: 10 }, params: { pickNo: this.searchParam.pickNo, waveNo: this.searchParam.waveNo } }).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>
    .component-header {
        display: flex;
    }
.component-header {
    display: flex;
}
    .component-header > div {
        flex: 1;
    }
.component-header>div {
    flex: 1;
}
    .qrcode {
        display: flex;
        justify-content: flex-end;
        margin-right: 30px;
    }
.qrcode {
    display: flex;
    justify-content: flex-end;
    margin-right: 30px;
}
</style>