<template>
    <div class="eibs-tab">
        <el-tabs v-model="activeName">
            <el-tab-pane label="申报管理" name="jsh">
                <c-content>
                    <m-wg :codes="codes" :model="model.jshmod"/>
                </c-content>
            </el-tab-pane>
            <el-tab-pane :label="baspLabel" name="basp" v-if="showBasp">
                <c-content>
                    <m-basp :codes="codes" :model="recgrp" :prefix="prefix"/>
                </c-content>
            </el-tab-pane>
            <el-tab-pane :label="vrfpLabel" name="vrfp" v-if="showVrfp">
                <c-content>
                    <m-vrfp :codes="codes" :model="recgrp" :prefix="prefix"/>
                </c-content>
            </el-tab-pane>
        </el-tabs>
    </div>
</template>
<script>
    import Wg from './wg'
    import event from "../event";
    import Basp from "./basp";
    import Vrfp from "./vrfp";

    export default {
        inject: ["root"],
        mixins: [event],
        components: {
            "m-wg": Wg,
            "m-basp": Basp,
            "m-vrfp": Vrfp,
        },
        props: ["model", "codes"],
        provide() {
            return {
                calcJshmod: this.calcJshmod
            };
        },
        computed: {
            showBasp() {
                const basflg = this.model.jshmod.basflg;
                return basflg === 'X' && Object.keys(this.recgrp).length !== 0;
            },
            showVrfp() {
                const vrfflg = this.model.jshmod.vrfflg;
                return vrfflg === 'X' && Object.keys(this.recgrp).length !== 0;
            },
        },
        data() {
            return {
                activeName: "jsh",
                recgrp: {},
                baspLabel: "",
                vrfpLabel: "",
                prefix: "",
            }
        },
        watch: {
            'model.jshmod.szflg': {
                handler(newValue) {
                    this.baspLabel = newValue === '' ? '' : this.baspLabel;
                    this.baspLabel = newValue === '1' ? '外汇账户内结汇-基础信息' : this.baspLabel;
                    this.baspLabel = newValue === '2' ? '外汇账户内购汇-基础信息' : this.baspLabel;
                    this.vrfpLabel = newValue === '' ? '' : this.vrfpLabel;
                    this.vrfpLabel = newValue === '1' ? '外汇账户内结汇-管理信息' : this.vrfpLabel;
                    this.vrfpLabel = newValue === '2' ? '外汇账户内购汇-管理信息' : this.vrfpLabel;
                    this.prefix = newValue === '' ? '' : this.prefix;
                    this.prefix = newValue === '1' ? 'dbjgrp' : this.prefix;
                    this.prefix = newValue === '2' ? 'dbwgrp' : this.prefix;
                    this.recgrp = newValue === '' ? {} : this.recgrp;
                    this.recgrp = newValue === '1' ? this.model.jshmod.dbjgrp : this.recgrp;
                    this.recgrp = newValue === '2' ? this.model.jshmod.dbwgrp : this.recgrp;
                },
                immediate: true,
            },
        },
        methods: {
            calcJshmod() {
                const commonData = this.root.buildCommonData(this.root.model, this.root.trnName);
                this.initJshmod(this.buildJshmod(commonData)).then((rtnmsg) => {
                    if (rtnmsg.respCode === SUCCESS) {
                        console.log('结售汇报送 试算成功');
                    }
                });
            }
        },
    }
</script>
<style lang="less" scoped>
    .eibs-tab /deep/ .el-form-item__label {
        padding-left: 10px;
        padding-right: 10px;
        line-height: 20px !important;
        display: flex;
        align-items: center;
        justify-content: flex-start;
        text-align: left;
    }
</style>