<template>
    <Modal
            v-model="showModal"
            @on-ok="deliver"
            width="auto"
            class-name="deliver-modal">
        <div class="deliver-modal">
            <div class="deliver-info">
                <Row class-name="info-row">
                    <Col span="4" class-name="info-col">收货仓库：</Col>
                    <Col span="20">{{houseInfo.storeroomName}}</Col>
                </Row>
                <Row class-name="info-row">
                    <Col span="4">物流公司：</Col>
                    <Col span="20">
                    <select-express v-model="expressId"> </select-express>
                    </Col>
                </Row>
                <Row class-name="info-row">
                    <Col span="4">物流单号：</Col>
                    <Col span="20"><Input v-model="expressNumber"></Input></Col>
                </Row>

                <Row class-name="info-row">
                    <Col span="4" class="info-tip">发往：</Col>
                    <Col span="20" class="info-tip">
                        <div>{{houseInfo.storeroomName}} &nbsp; {{houseInfo.address}} &nbsp; {{houseInfo.adminName}} &nbsp; {{houseInfo.phone}}</div>
                    </Col>
                </Row>
            </div>
        </div>
        <div slot="footer">
            <Button type="text" size="large" @click="cancel">取消</Button>
            <Button type="primary" size="large" :loading="showLoading" @click="deliver">保存</Button>
        </div>
    </Modal>
</template>

<script>
    import {SelectExpress} from 'components/select';
    import InvoiceService from 'services/repository/invoice-service';

    export default {
        name: 'send-modal',
        props: ['context'],
        created() {
            this.invoiceService = new InvoiceService();
        },
        data() {
            return {
                showModal: false,
                showLoading: false,
                expressId: '',
                expressNumber: '',
                id: '',
                selection: [],
                houseInfo: {}
            };
        },
        methods: {
            show(id, selection) {
                this.showModal = true;
                this.selection = selection;
                this.id = id;
                this.houseInfo = this.context.info;
            },
            cancel() {
                this.showModal = false;
                this.showLoading = false;

                this.expressId = '';
                this.expressNumber = '';
                this.id = '';
                this.selection = [];
                this.houseInfo = {};
            },
            deliver() {
                const params = {
                    expressId: this.expressId,
                    expressNumber: this.expressNumber,
                    proRequisitionFormId: this.id,
                    expressGoodsBos: this.selection.map((i) => {
                        return {
                            sku: i.productSku,
                            num: i.num
                        };
                    })
                };

                if (!(params.expressId + '').length) {
                    this.$Message.error('请选择物流公司');
                    return;
                }

                if (!(params.expressNumber + '').length) {
                    this.$Message.error('请填写物流单号');
                    return;
                }

                this.showLoading = true;
                this.invoiceService.sendOrder(params).then((result) => {
                    if (result.code === 200) {
                        this.$Message.info('发货成功');
                    } else {
                        this.$Message.error('发货失败');
                    }

                    this.cancel();
                });
            }
        },
        components: {
            SelectExpress
        }
    };
</script>

<style lang="scss">

    .deliver-modal {
        padding: 30px;

        .info-row {
            margin-bottom: 20px;
        }

        .info-tip {
            color: #f00;
        }

        .ivu-modal {
            width: 50%;
        }
    }
</style>