图标

Your Name

2022-08-10 84358f2bc9415c90099306f0c9c41cdc24cc78d6

 src/views/homeMenu/homeMenu.vue

@@ -1,5 +1,5 @@
<template>
    <div class="login-container">
    <div class="login-container" :key="once">
        <div class="topPanel">
            <div class="topPanelCont">
                <div class="topTit">
@@ -22,22 +22,22 @@
            <div class="gridCont">
                <el-row :gutter="20">
                    <el-col :span="6"
                        ><div class="grid-content" v-throttle @click="renderMenu('2')">
                        ><div class="grid-content" v-throttle @click="render('2')">
                            <div class="itemTit">双重预防系统</div>
                            <img class="iconImg" src="../../assets/menu/icon4.png" /><img class="bgImg" src="../../assets/menu/card4.png" /></div
                    ></el-col>
                    <el-col :span="6"
                        ><div class="grid-content" v-throttle @click="renderMenu('3')">
                        ><div class="grid-content" v-throttle @click="render('3')">
                            <div class="itemTit">特殊作业系统</div>
                            <img class="iconImg" src="../../assets/menu/icon7.png" /><img class="bgImg" src="../../assets/menu/card7.png" /></div
                    ></el-col>
                    <el-col :span="6"
                        ><div class="grid-content" v-throttle @click="renderMenu('4')">
                        ><div class="grid-content" v-throttle @click="render('4')">
                            <div class="itemTit">智能巡检系统</div>
                            <img class="iconImg" src="../../assets/menu/icon8.png" /><img class="bgImg" src="../../assets/menu/card8.png" /></div
                    ></el-col>
                    <el-col :span="6">
                        <div class="grid-content" v-throttle @click="renderMenu('5')">
                        <div class="grid-content" v-throttle @click="render('5')">
                            <div class="itemTit">安全风险综合 <br />预警预报平台</div>
                            <img class="iconImg" src="../../assets/menu/icon1.png" />
                            <img class="bgImg" src="../../assets/menu/card1.png" />
@@ -46,39 +46,39 @@
                </el-row>
                <el-row :gutter="20">
                    <el-col :span="6"
                        ><div class="grid-content grid-content-2" v-throttle @click="renderMenu('6')">
                        ><div class="grid-content grid-content-2" v-throttle @click="render('6')">
                            <div class="itemTit">应急管理系统</div>
                            <img class="iconImg" src="../../assets/menu/icon5.png" /><img class="bgImg" src="../../assets/menu/card5.png" /></div
                    ></el-col>
                    <el-col :span="6"
                        ><div class="grid-content grid-content-2" v-throttle @click="renderMenu('7')">
                        ><div class="grid-content grid-content-2" v-throttle @click="render('7')">
                            <div class="itemTit">目标责任管理系统</div>
                            <img class="iconImg" src="../../assets/menu/icon2.png" /><img class="bgImg" src="../../assets/menu/card2.png" /></div
                    ></el-col>
                    <el-col :span="6"
                        ><div class="grid-content grid-content-2" v-throttle @click="renderMenu('8')">
                        ><div class="grid-content grid-content-2" v-throttle @click="render('8')">
                            <div class="itemTit">事故管理系统</div>
                            <img class="iconImg" src="../../assets/menu/icon6.png" /><img class="bgImg" src="../../assets/menu/card6.png" /></div
                    ></el-col>
                    <el-col :span="6"
                        ><div class="grid-content grid-content-2" v-throttle @click="renderMenu('9')">
                        ><div class="grid-content grid-content-2" v-throttle @click="render('9')">
                            <div class="itemTit">设备综合管控系统</div>
                            <img class="iconImg" src="../../assets/menu/icon9.png" /><img class="bgImg" src="../../assets/menu/card9.png" /></div
                    ></el-col>
                </el-row>
                <el-row :gutter="20">
                    <el-col :span="6"
                        ><div class="grid-content grid-content-3" v-throttle @click="renderMenu('10')">
                        ><div class="grid-content grid-content-3" v-throttle @click="render('10')">
                            <div class="itemTit">安全知识图谱系统</div>
                            <img class="iconImg" src="../../assets/menu/icon3.png" /><img class="bgImg" src="../../assets/menu/card3.png" /></div
                    ></el-col>
                    <el-col :span="9"
                        ><div class="grid-content grid-content-3" v-throttle @click="renderMenu('11')">
                        ><div class="grid-content grid-content-3" v-throttle @click="render('11')">
                            <div class="itemTit">危险化学品全生命周期安全<br />管理系统</div>
                            <img class="iconImg" src="../../assets/menu/icon10.png" /><img class="bgImg" src="../../assets/menu/card10.png" /></div
                    ></el-col>
                    <el-col :span="9"
                        ><div class="grid-content grid-content-3" v-throttle @click="renderMenu('1')">
                        ><div class="grid-content grid-content-3" @click="render('1')">
                            <div class="itemTit">基础数据权限管理系统</div>
                            <img class="iconImg" src="../../assets/menu/icon11.png" /><img class="bgImg" src="../../assets/menu/card11.png" /></div
                    ></el-col>
@@ -111,6 +111,9 @@
interface LoginState {
    tabsActiveName: string;
    isScan: boolean;
    count: number;
    projectId: string;
    once: number;
}

export default defineComponent({
@@ -118,7 +121,6 @@
    components: {},
    setup() {
        const { t } = useI18n();
        const route = useRoute();
        const router = useRouter();
        const userInfo = useUserInfo();
        const { userInfos } = storeToRefs(userInfo);
@@ -128,7 +130,10 @@
        const { themeConfig } = storeToRefs(storesThemeConfig);
        const state = reactive<LoginState>({
            tabsActiveName: 'account',
            isScan: false
            isScan: false,
            count: 0,
            projectId: '1',
            once: 0
        });
        // 获取布局配置信息
        const getThemeConfig = computed(() => {
@@ -175,18 +180,50 @@
                })
                .catch(() => {});
        };
        const renderMenu = async (value: string) => {
            Session.set('projectId', value);
            userInfos.value.projectId = value;
        //选择菜单
        const render = (value: string) => {
            state.projectId = value;
            renderMenu();
        };

        const throttle = (renderMenu: any, delay: number) => {
            let flag = true;
            let count = 0;
            return function () {
                if (!flag) return;
                flag = false;
                if (count === 0) {
                    renderMenu.apply();
                    count++;
                    flag = true;
                } else {
                    setTimeout(() => {
                        renderMenu.apply();
                        flag = true;
                    }, delay);
                }
            };
        };

        //调用菜单方法
        const renderMenu = throttle(() => {
            renderFun();
        }, 2000);

        //调后台菜单接口
        const renderFun = async () => {
            Session.set('projectId', state.projectId);
            userInfos.value.projectId = state.projectId;
            await initBackEndControlRoutes().then(() => {
                let linkToMenu = [...routesList.value];
                if (linkToMenu && linkToMenu.length > 1) {
                    router.push(linkToFirstMenu(JSON.parse(JSON.stringify(linkToMenu))[1]));
                } else {
                    ElMessage({ type: 'warning', message: '你没有该项目的权限' });
                    ElMessage({ type: 'warning', message: '你没有该子系统的权限' });
                }
            });
        };

        const linkToFirstMenu: any = (value: any) => {
            let returnMenu = value;
            if (returnMenu.children?.length > 0) {
@@ -201,16 +238,17 @@
        // };
        // 页面加载时
        onMounted(() => {
            state.once += 1;
            NextLoading.done();
            // loginBg();
            // loginApp()
        });
        return {
            render,
            logoMini,
            onLoginOut,
            loginIconTwo,
            getThemeConfig,
            renderMenu,
            ...toRefs(state)
        };
    }