<template>
    <div style="padding: 16px">
        <!--  <a-card>-->
        <div>
            <div>
                <span style="font-size: 18px;font-weight: 600;"> 分配入库</span>
            </div>
            <div style="margin-top: 16px">
                <a-descriptions bordered :column="{  sm: 2, xs: 1 }" class="dis_title">
                    <a-descriptions-item label="发货单位">
                        {{detailInfo.sendUnitName || '--'}}
                    </a-descriptions-item>
                    <a-descriptions-item label="分配日期">
                        {{detailInfo.sendDate || '--'}}
                    </a-descriptions-item>
                    <a-descriptions-item label="发货人姓名">
                        {{detailInfo.sendContact || '--'}}
                    </a-descriptions-item>
                    <a-descriptions-item label="联系电话">
                        {{detailInfo.sendPhone || '--'}}
                    </a-descriptions-item>
                    <a-descriptions-item label="供应商">
                        {{detailInfo.supplierName || '--'}}
                    </a-descriptions-item>
                    <a-descriptions-item label="品牌">
                        {{detailInfo.brandName || '--'}}
                    </a-descriptions-item>
                    <a-descriptions-item label="批次号">
                        {{detailInfo.batchNumber || '--'}}
                    </a-descriptions-item>
                    <a-descriptions-item label="生产日期">
                        {{detailInfo.produceDate || '--'}}
                    </a-descriptions-item>
                    <a-descriptions-item label="有效期至">
                        {{detailInfo.expireDate || '--'}}
                    </a-descriptions-item>
                    <a-descriptions-item label="单价">
                        {{detailInfo.unitPrice || '--'}}<span>元</span>
                    </a-descriptions-item>
                    <a-descriptions-item label="数量">
                        {{detailInfo.sendNum || '--'}}
                    </a-descriptions-item>

                    <a-descriptions-item label="入库状态">
                        <div :class="detailInfo.statusName == '待入库' ? 'ready_stock' : 'in_stock'">
                            <span> {{detailInfo.statusName || '--'}}</span>
                        </div>
                    </a-descriptions-item>
                </a-descriptions>
                <a-form-model ref="formRef" :model="formData"
                              :labelCol="{span: 4}"
                              :wrapperCol="{span: 13}"
                              style="margin-top: 20px;"
                >
                    <a-form-model-item label="备注"
                                       prop="remarks"
                                       :labelCol="{span: 5}"
                                       :wrapperCol="{span: 12}">
                        <a-textarea
                                :rows="5"
                                :maxLength="200"
                                v-model="formData.remarks"
                                placeholder="请输入备注，最多可输入200字"></a-textarea>
                    </a-form-model-item>
                </a-form-model>
            </div>
        </div>
        <div style="text-align: center;">
            <a-button class="ant-table-btn" @click="goBack(1)">取消</a-button>
            <a-button type="primary" @click="goBack(2)" style="margin-left: 10px">入库</a-button>
        </div>
        <!-- </a-card>-->
    </div>
</template>
<script>
    import moment from 'moment';
    import {closedDetail} from "../../../utils/common";

    export default {
        data() {
            return {
                routerParams: {},
                detailInfo: {},
                formData: {},
                formRules: []
            }
        },
        created() {
            this.routerParams = this.$route.query;
            this.getReceiveDetails()
        },
        methods: {
            getReceiveDetails() {
                let par = {
                    id: this.routerParams.id,
                    menuId: this.routerParams.menuId
                }
                this.$api.stockManage.fetchReceiveDetails(par).then(({data = [], code}) => {
                    this.detailInfo = data;
                })
            },
            goBack(type) {
                if (type == 1) {
                    closedDetail('/inStock/inStockManageDetail', '/Home/distributionWarehousing');
                    return;
                }
                let that = this;
                let params = {
                    recordId: this.detailInfo.id, remarks: this.formData.remarks,
                    menuId: this.routerParams.menuId
                };
                this.$confirm({
                    title: '确认入库吗?',
                    content: "",
                    onOk() {
                        that.$api.stockManage.fetchReceiveConfirm(params).then(({data = [], code}) => {
                            if (code === 'SUCCESS') {
                                window.top.postMessage({messageType:'THIRD_PAGECHANGE',name:`${this.routerParams.menuCode}`,source:"yesuan"}, '*')
                                // closedDetail('/inStock/inStockManageDetail', '/Home/distributionWarehousing')
                            }
                        });
                    },
                    onCancel() {
                    },
                    class: 'test',
                });
            }
        },
    }
</script>
<style lang="less">
    .dis_title {
        .ant-descriptions-item-label {
            width: 120px;
        }
    }

    .ready_stock {
        border-radius: 2px;
        width: 62px;
        text-align: center;
        padding: 2px 8px;
        background: #FFF7E6;
        border: 1px solid #FFD591;
        color: #FA8C16
    }

    .in_stock {
        border-radius: 2px;
        width: 62px;
        text-align: center;
        padding: 2px 8px;
        /*background: lightgreen;*/
        border: 1px solid #52C41A;
        color: #52C41A
    }
</style>