<template>
    <div>
        <el-card
            v-loading="loading"
            element-loading-text="拼命加载中......请稍等"
        >
            <div slot="header">
                <span>税局资料申领信息</span>
                <el-button
                    @click="showEditCompany"
                    style="float: right; padding: 0 5px"
                    type="text"
                    >编辑</el-button
                >
                <el-button
                    @click="handleRefresh"
                    style="float: right; padding: 0 5px"
                    type="text"
                    >刷新</el-button
                >
            </div>
            <div
                v-if="!existAddress"
                style="
                    background-color: #e6a23c;
                    padding: 10px 10px;
                    text-align: center;
                "
            >
                <span style="color: white"
                    >不存在邮寄信息，请添加发票邮寄信息</span
                >
            </div>
            <div v-else style="width: 100%">
                <el-form
                    ref="expressAddressForm"
                    :model="form"
                    label-width="170px"
                    style="max-width: 800px"
                >
                    <!-- <el-row :gutter="20">
                        <el-col :span="12">
                            <el-form-item label="企业名称：">
                                <span v-text="entName"></span>
                            </el-form-item>
                        </el-col>
                        <el-col :span="12">
                            <el-form-item label="企业税号：">
                                <span v-text="entTaxId"></span>
                            </el-form-item>
                        </el-col>
                    </el-row> -->
                    <el-form-item label="票据接收方式：" prop="getWay">
                        <span v-text="fmtGetWay"></span>
                        <!-- <el-radio-group v-model="form.getWay">
                            <el-radio
                                v-for="item in invoiceGetWayOptions"
                                :key="item.value"
                                :label="item.value"
                                :value="item.value"
                                >{{ item.label }}
                            </el-radio>
                        </el-radio-group> -->
                    </el-form-item>
                    <el-form-item
                        label="收件人："
                        prop="receiverName"
                        v-if="isGetway2"
                    >
                        <span v-text="form.receiverName"></span>
                    </el-form-item>
                    <el-row :gutter="20">
                        <el-col :span="12">
                            <el-form-item
                                label="移动电话："
                                prop="mobilePhoneNumber"
                                v-if="isGetway2"
                            >
                                <span v-text="form.mobilePhoneNumber"></span>
                            </el-form-item>
                        </el-col>
                        <el-col :span="12">
                            <el-form-item
                                label="固定电话："
                                prop="fixedPhoneNumber"
                                v-if="isGetway2"
                            >
                                <span v-text="form.fixedPhoneNumber"></span>
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <el-row :gutter="20">
                        <el-col :span="12">
                            <el-form-item
                                label="邮政编码："
                                prop="zipCode"
                                v-if="isGetway2"
                            >
                                <span v-text="form.zipCode"></span>
                            </el-form-item>
                        </el-col>
                        <el-col :span="12">
                            <el-form-item
                                label="快递地址："
                                prop="receiverAddress"
                                v-if="isGetway2"
                            >
                                <span v-text="form.receiverAddress"></span>
                            </el-form-item>
                        </el-col>
                    </el-row>
                </el-form>
            </div>
        </el-card>
    </div>
</template>

<script>
import SEND from "@/api/send";
import cache from "@/utils/cache";

// 发票申领领购方式
const invoiceGetWayOptions = [
    {
        value: 1,
        label: "自行领取",
    },
    {
        value: 2,
        label: "快递配送",
    },
];

export default {
    name: "ExpressAddressOverview",
    data() {
        return {
            loading: false,
            existAddress: false, // 是否存在地址
            entName: "",
            entTaxId: "",
            invoiceGetWayOptions: invoiceGetWayOptions,
            sendId: "", // 修改地址信息时需要
            form: {
                getWay: 2, // 领取方式：1=自行领取，2=邮件快递
                receiverName: "", // 收件人姓名
                mobilePhoneNumber: "", // 移动电话
                fixedPhoneNumber: "", // 固定电话
                receiverAddress: "", // 快递地址
                zipCode: "", // 邮编
            },
        };
    },
    created() {
        let company = JSON.parse(cache.getSession("company"));
        this.entTaxId = company.entTaxId;
        this.entName = company.entName;
        this.callGetSendInfo();
    },
    computed: {
        // 是否是快递配送
        isGetway2() {
            return this.form.getWay == 2;
        },
        fmtGetWay() {
            let result = this.form.getWay;
            for (const item of invoiceGetWayOptions) {
                if (item.value === this.form.getWay) {
                    result = item.label;
                    break;
                }
            }
            return result;
        },
    },
    methods: {
        // 刷新
        handleRefresh() {
            this.callGetSendInfo();
        },
        // 编辑企业信息
        showEditCompany() {
            this.$router.push("/express-address");
        },
        callGetSendInfo() {
            let _this = this;
            _this.loading = true;
            SEND.getSendInfo()
                .then((val) => {
                    _this.loading = false;
                    _this.existAddress = true;
                    _this.sendId = val.data.sendId;
                    _this.form.getWay = val.data.getWay;
                    _this.form.receiverName = val.data.receiverName;
                    _this.form.receiverAddress = val.data.receiverAddress;
                    _this.form.mobilePhoneNumber = val.data.mobilePhoneNumber;
                    _this.form.zipCode = val.data.zipCode;
                    _this.form.fixedPhoneNumber = val.data.fixedPhoneNumber;
                })
                .catch((error) => {
                    if (error.code == 10166) {
                        _this.existAddress = false;
                    } else {
                        _this.existAddress = true;
                        _this.$message.error(error.msg);
                    }
                    _this.loading = false;
                });
        },
    },
};
</script>

<style scoped>
.ent_input {
    width: 250px;
}

.edit_layout {
    display: flex;
    align-items: center;
    margin-bottom: 5px;
}
</style>
