<template>
    <popup-modal
        v-if="daka.modal_type === 'popup'"
        :payWay="daka.data"
        :ueConf="ueConf"
        @onPayChoose="onPayChoose"
        @onClose="onClose"
    />
    <exchange-modal
        v-else-if="daka.modal_type === 'exchange'"
        :exchange="daka"
        :ueConf="ueConf"
        @onExchange="onExchange"
        @onClose="onClose"
        @onTipTap="onTipTap"
    />
    
    <view v-else class="brand-daka-modal">
        <view class="daka-modal-mask">
            <daka-modal
                v-if="daka.modal_type === 'daka'"
                :type="type"
                :daka="daka"
                :ueConf="ueConf"
                @onTipTap="onTipTap"
                @sharePage="sharePage"
                @onClose="onClose"
            />
            <!-- 提示弹窗 -->
            <tip-modal
                v-else-if="daka.modal_type === 'tip'"
                :daka="daka"
                :ueConf="ueConf"
                @sharePage="sharePage"
                @onClose="onClose"
            />
            <!-- 打卡中心提示弹窗 -->
            <center-tip
                v-else-if="daka.modal_type === 'centerTip'"
                :daka="daka"
                :ueConf="ueConf"
                @sharePage="sharePage"
                @onTipTap="onTipTap"
                @onClose="onClose"
            />
            <!-- 兑换弹窗 -->
            <exchange-tip
                v-if="daka.modal_type === 'exchangeTip'"
                :type="type"
                :daka="daka"
                :ueConf="ueConf"
                @onTipTap="onTipTap"
                @sharePage="sharePage"
                @onClose="onClose"
            />
            <!-- 道具卡弹窗 -->
            <tool-modal
                v-else-if="daka.modal_type === 'tool'"
                :daka="daka"
                :ueConf="ueConf"
                @onTipTap="onTipTap"
                @onClose="onClose"
            />
            <!-- 红包弹窗 -->
            <red-modal
                v-else-if="daka.modal_type === 'red'"
                :daka="daka"
                @onClose="onClose"
            />
        </view>
    </view>
</template>

<script>
/**
 * @file 弹窗集合
 * @author chenshuo04
 * @categories 业务组件
 * @tags [component]
 */
import DakaModal from './daka-modal';
import TipModal from './daka-tipModal';
import ToolModal from './daka-toolModal';
import RedModal from './daka-redModal';
import PopupModal from './daka-popup';
import ExchangeModal from './daka-exchange';
import CenterTip from './daka-centerTip';
import ExchangeTip from './daka-exchange-modal';

export default {
    config: {
        component: true
    },
    options: {
        addGlobalClass: true
    },
    components: {
        DakaModal,
        TipModal,
        ToolModal,
        RedModal,
        PopupModal,
        ExchangeModal,
        CenterTip,
        ExchangeTip
    },
    props: {
        // 弹窗对象
        daka: {
            type: Object,
            required: true
        },
        // UE 配置
        ueConf: {
            type: Object,
            required: true
        },
        // 类型
        type: {
            type: String,
            default: 'morning'
        }
    },
    methods: {
        onClose(type, isBtn) {
            /**
            * 关闭
            */
            this.$emit('onClose', type, isBtn, this.daka);
        },
        onTipTap(type, extra) {
            /**
            * 提示点击
            */
            this.$emit('onTipTap', type, extra);
        },
        sharePage() {
            /**
            * 分享
            */
            this.$emit('sharePage');
        },
        onPayChoose(type) {
            /**
            * 支付选择
            */
            this.$emit('onPayChoose', type);
        },
        onExchange(exchangeItem) {
            /**
            * 兑换事件
            */
            this.$emit('onExchange', exchangeItem);
        }
    }
};
</script>
<style lang="less" scoped>
.brand-daka-modal {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 999;
    .daka-modal-mask {
        width: 100%;
        height: 100%;
        background: rgba(0, 0, 0, .5);
        z-index: 12;
    }
}
</style>