<template>
    <layout-body>
        <layout-filter>
            <filter-item>
                <order-info :id="id" @on-change="onOrderChange"></order-info>
            </filter-item>
        </layout-filter>

        <layout-action>
            <Button type="primary" @click="onClickCreate" :disabled="this.selection.length === 0">发货</Button>
            <Button @click="$router.go(-1)">返回发货入库列表</Button>
        </layout-action>

        <layout-list>
            <Table ref="goodsList" border :columns="tableCols" :data="tableData"
                   @on-selection-change="onSelectChange">
            </Table>
        </layout-list>

        <send-modal ref="sendModal" :order-info="info" @deliver="invoiceDeliver"></send-modal>
    </layout-body>
</template>

<script>
    import deliver from './store/deliver';
    import SendModal from './components/send-modal';
    import OrderInfo from './components/order-info';
    import InvoiceService from 'services/repository/invoice-service';
    import _ from 'lodash';

    export default {
        data() {
            return deliver.call(this);
        },
        created() {
            this.invoiceService = new InvoiceService();
            this.id = this.$route.params.id;
            this.brandId = this.$route.query.brandId;
            this.getGoods();
        },
        methods: {
            invoiceDeliver({expressId, expressNumber}) {
                const params = {
                    expressId,
                    expressNumber,
                    proRequisitionFormId: this.id,
                    expressGoodsBos: this.selection.map((i) => {
                        return {
                            sku: i.productSku,
                            num: i.num
                        };
                    })
                };

                this.invoiceService.sendOrder(params).then((result) => {
                    if (result.code === 200) {
                        this.$Message.info('发货成功');
                        this.$refs.sendModal.hide();
                        this.getGoods();
                    } else {
                        this.$Message.error('发货失败');
                    }
                });
            },
            onClickCreate() {
                this.tableData = this.$refs.goodsList.rebuildData.map(row => {
                    if (_.some(this.selection, {id: row.id})) {
                        row._checked = true;
                    }
                    return row;
                });

                this.selection = this.selection.map(i => {
                    return _.find(this.tableData, (s) => s.id === i.id);
                });

                if (!this.selection.every((i) => {
                    return i.num && i.num <= i.buyingNums && i.num <= (i.buyingNums - i.shipmentsNums);
                })) {
                    this.$Message.error('请正确填写发货数量');
                    this.selection = [];
                    return;
                }

                this.$refs.sendModal.show();
            },
            getGoods() {
                return this.invoiceService.listProduct({
                    proRequisitionFormId: this.id,
                    brandId: this.brandId
                }).then((res) => {
                    if (res.code === 200) {
                        this.tableData = (res.data.goodsList || []).map((i) => {
                            i._disabled = i.shipmentsNums === i.buyingNums;
                            i.num = i._disabled ? null : i.buyingNums - i.shipmentsNums;
                            return i;
                        });
                    }
                });
            },
            onSelectChange(selection) {
                this.selection = selection;
            },
            onOrderChange(data) {
                this.info = data;
            },
            back() {
                this.$router.push({
                    name: 'repository.invoice.list'
                });
            }
        },
        components: {
            SendModal,
            OrderInfo
        }
    };
</script>

<style lang="scss">
</style>