<template>
    <div >
        <!-- 门户选择框 -->
        <div class="modal" v-if="portalSwitch" >
            <div class="dialog">
                <div class="header">
                    <span class="title">欢迎登录，请选择您要进入的子系统</span>
                    <span class="close" @click="close">X</span>
                </div>
                <div class="body">
                    <div class="system">
                        <div class="box">
                            <div
                                v-for="item in appList"
                                :key="item.id"
                                class="content"
                                @click="linkTo(item)"
                                @dblclick="dblclickLinkTo(item)"
                            >
                                <div class="img">
                                    <img class="moduleImg" :src="item.image" alt />
                                </div>
                                <div class="name">{{ item.name }}</div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="footer">
                    *注：双击子系统在新标签页中打开，单击在当前页面打开
                </div>
            </div>
        </div>
    </div>
</template>

<script>
import * as URL from "@/config/url";
import AuthDao from "@/dao/auth";

let timer = null;

export default {
    data() {
        return {
            show: false,
            portalSwitch: false,
            appList: [],
        };
    },
    mounted() {
        // this.queryApp();
    },
    methods: {
        async queryApp() {
            const resp = await AuthDao.queryMenu({
                params: {
                    parentId: "0",
                    isRecursion: false,
                },
            });
            try {
                const {
                    data: { status, content, message },
                } = resp;
                if (status === "success") {
                    // console.log(content)
                    //过滤指挥调度和移动中台俩菜单，不显示
                    this.appList = content.filter((item) => {
                        return item.url !== "/dispatch" && item.url !== "/mobile";
                    });
                }
            } catch (err) {
                if (err) {
                    setTimeout(() => {
                        this.$emit("messageType",true)
                    }, 1000);
                }
                setTimeout(() => {
                    this.$emit("messageType",false)
                }, 4000);
            }
        },
        close() {
            this.portalSwitch = false;
            // this.$router.push(URL.LOGIN);
        },
        // 单击点击跳转路由
        linkTo(item) {
            console.log(item)
            clearTimeout(timer);
            timer = setTimeout(() => {
                const { url } = item;
                window.location.href = url;
            }, 300);
        },
        // 双击打开新窗口
        dblclickLinkTo(item) {
            clearTimeout(timer);
            const { url } = item;
            window.open(url);
        },
    },
};
</script>

<style scoped lang="less">
@import url("./index.less");
.system {
    color: red;
}
.system svg {
    fill: currentColor;
}
</style>
