马宇豪
2024-11-12 77737f4e73f7267170b9b06fc73d1610c29c0661
src/views/newHome/index.vue
@@ -21,7 +21,7 @@
        <div class="leftCont"></div>
        <div class="topCont">
            <div class="topInfo">
                <div class="topTit">新疆国泰新华<br />安全风险预警监测系统(试运行)</div>
                <div class="topTit">新疆国泰新华<br />安全风险预警监测系统</div>
                <div class="topTime">
                    <div class="time">
                        {{ time }}
@@ -82,7 +82,27 @@
                    </div>
                    <img class="bgImg" src="../../assets/newMenu/card-7.png" />
                </div>
                <div class="grid-content cont-bg-1" v-throttle @click="render('7')">
                <div class="grid-content cont-bg-1" v-throttle @click="toManLocation">
                  <div class="toplayer">
                    <img class="iconImg" src="../../assets/newMenu/icon12.png" />
                    <div>
                      <div class="itemTit">人员定位系统</div>
                      <div class="enTit">Personnel Positioning System</div>
                    </div>
                  </div>
                  <img class="bgImg" src="../../assets/newMenu/card-12.png" />
                </div>
                <div class="grid-content cont-bg-2" v-throttle @click="render('12')">
                  <div class="toplayer">
                    <img class="iconImg" src="../../assets/newMenu/icon14.png" />
                    <div>
                      <div class="itemTit">监管数据融合互通系统</div>
                      <div class="enTit">Regulatory Data Integration and Interoperability System</div>
                    </div>
                  </div>
                  <img class="bgImg" src="../../assets/newMenu/card-14.png" />
                </div>
                <div class="grid-content cont-bg-2" v-throttle @click="render('7')">
                    <div class="toplayer">
                        <img class="iconImg" src="../../assets/newMenu/icon5.png" />
                        <div>
@@ -126,8 +146,10 @@
                    <div class="toplayer">
                        <img class="iconImg" src="../../assets/newMenu/icon9.png" />
                        <div>
                            <div class="itemTit">智能安全危险化学品全生命周期管控系统</div>
                            <div class="enTit">Intelligent Security Hazardous Chemicals Life Cycle Safety Management System </div>
<!--                            <div class="itemTit">智能安全危险化学品全生命周期管控系统</div>-->
<!--                            <div class="enTit">Intelligent Security Hazardous Chemicals Life Cycle Safety Management System</div>-->
                            <div class="itemTit">安全教育考试系统</div>
                            <div class="enTit">Safety Education Examination System</div>
                        </div>
                    </div>
                    <img class="bgImg" src="../../assets/newMenu/card-10.png" />
@@ -142,6 +164,16 @@
                    </div>
                    <img class="bgImg" src="../../assets/newMenu/card-6.png" />
                </div>
<!--                <div class="grid-content cont-bg-2" v-throttle @click="toSmartFactory">-->
<!--                  <div class="toplayer">-->
<!--                    <img class="iconImg" src="../../assets/newMenu/icon13.png" />-->
<!--                    <div>-->
<!--                      <div class="itemTit">智能工厂系统</div>-->
<!--                      <div class="enTit">Intelligent Factory System</div>-->
<!--                    </div>-->
<!--                  </div>-->
<!--                  <img class="bgImg" src="../../assets/newMenu/card-13.png" />-->
<!--                </div>-->
                <div class="grid-content cont-bg-2" @click="render('1')">
                    <div class="toplayer">
                        <img class="iconImg" src="../../assets/newMenu/icon11.png" />
@@ -163,7 +195,7 @@
</template>
<script lang="ts">
import { toRefs, reactive, computed, defineComponent, onMounted } from 'vue';
import {toRefs, reactive, computed, defineComponent, onMounted, onUnmounted} from 'vue';
import { storeToRefs } from 'pinia';
import { useThemeConfig } from '/@/stores/themeConfig';
import logoMini from '/@/assets/logo-mini.svg';
@@ -196,6 +228,7 @@
    date: string;
    weekDay: string;
    dayTime: string;
    timer: null | any
}
export default defineComponent({
@@ -230,7 +263,8 @@
            date: '',
            weekDay: '',
            dayTime: '',
            isScreenfull: false
            isScreenfull: false,
              timer: null
        });
        const userName = computed(() =>{
@@ -326,16 +360,27 @@
            });
        };
        // 去风险大屏
        const toRiskPlatform = () => {
        const toRiskPlatform = async() => {
            // router.push({
            //     name: "warningScreen"
            // });
            window.open('http://39.104.85.193:8585/');
          const routePath = '/warningScreen';
          const resolvedRoute = router.resolve(routePath);
          const fullPath = resolvedRoute.href
          window.open(fullPath, '_blank');
            // window.open('http://39.104.85.193:8585/');
        };
        const toDoublePrevent = () => {
           window.open('http://121.239.169.27:6801');
           window.open('http://8.137.115.153:6801/login');
        };
        const toSmartFactory = () =>{
          window.open('http://117.190.40.54:5522/#/login');
        }
        const toManLocation = () =>{
          window.open('http://117.190.40.54:8081/location_system_5.4.9/login/login.html?company=GUOTAI&version=5.4.9');
        }
        const throttle = (renderMenu: any, delay: number) => {
            let flag = true;
            let count = 0;
@@ -357,6 +402,7 @@
        //调用菜单方法
        const renderMenu = throttle(() => {
          // debugger
            renderFun();
        }, 2000);
@@ -366,8 +412,8 @@
            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]));
                if (linkToMenu && linkToMenu.length > 0) {
                    router.push(linkToFirstMenu(JSON.parse(JSON.stringify(linkToMenu))[0]));
                } else {
                    ElMessage({ type: 'warning', message: '你没有该子系统的权限' });
                }
@@ -384,7 +430,8 @@
        };
        const renderToNew = () => {
            window.open('http://222.92.213.22:18001/smartlab/', '_blank');
            // window.open('http://222.92.213.22:18001/smartlab/', '_blank');
          window.open('http://47.108.222.15:8000/', '_blank');
        };
        // //点击进入特殊作业
        // const toSpecialWorkSys = () => {
@@ -395,12 +442,17 @@
            state.once += 1;
            NextLoading.done();
            getDateTime();
            setInterval(() => {
            state.timer = setInterval(() => {
                getDateTime();
            }, 1000);
            }, 30000);
            // loginBg();
            // loginApp()
        });
        })
      onUnmounted(() => {
        clearInterval(state.timer)
      });
        return {
            render,
            userName,
@@ -410,6 +462,8 @@
            renderToNew,
            toRiskPlatform,
            toDoublePrevent,
            toSmartFactory,
            toManLocation,
            onScreenfullClick,
            loginIconTwo,
            getThemeConfig,
@@ -452,13 +506,13 @@
            transform: translateY(0);
        }
    }
@media screen and (min-width: 1400px) {
@media screen and (min-width: 1600px) {
    .gridCont {
        width: 100%;
        height: 100%;
        display: grid;
        grid-gap: 20px;
        grid-template-columns: repeat(3, 1fr);
        grid-template-rows: repeat(5, 200px);
        grid-auto-flow: row;
        justify-content: center;
        .toplayer {
@@ -520,7 +574,7 @@
            }
            .itemTit1 {
                font-size: 34px;
                font-size: 32px;
                line-height: 42px;
                height: 40%;
                letter-spacing: 1px;
@@ -528,7 +582,7 @@
                margin-bottom: 12px;
            }
            .enTit1 {
                font-size: 20px;
                font-size: 18px;
                line-height: 24px;
                color: #072270;
            }
@@ -548,13 +602,13 @@
    }
}
@media screen and (min-width: 1200px) and (max-width: 1400px) {
@media screen and (min-width: 1200px) and (max-width: 1600px) {
    .gridCont {
        width: 100%;
        height: 100%;
        display: grid;
        grid-gap: 15px;
        grid-template-columns: repeat(3, 1fr);
        grid-template-rows: repeat(5, 120px);
        grid-auto-flow: row;
        justify-content: center;
@@ -570,14 +624,14 @@
            z-index: 99;
            .itemTit {
                font-size: 26px;
                font-size: 22px;
                line-height: 30px;
                height: 40%;
                color: #072270;
                margin-bottom: 2px;
            }
            .enTit {
                font-size: 14px;
                font-size: 12px;
                color: #072270;
            }
@@ -616,7 +670,7 @@
            }
            .itemTit1 {
                font-size: 28px;
                font-size: 24px;
                line-height: 36px;
                height: 40%;
                letter-spacing: 1px;
@@ -624,7 +678,7 @@
                margin-bottom: 12px;
            }
            .enTit1 {
                font-size: 16px;
                font-size: 14px;
                color: #072270;
            }
        }
@@ -644,10 +698,10 @@
@media screen and (max-width: 1200px) {
    .gridCont {
        width: 100%;
        height: 100%;
        display: grid;
        grid-gap: 10px;
        grid-template-columns: repeat(3, 1fr);
        grid-template-rows: repeat(5, 96px);
        grid-auto-flow: row;
        justify-content: center;
@@ -663,12 +717,12 @@
            z-index: 99;
            .itemTit {
                font-size: 18px;
                font-size: 14px;
                line-height: 22px;
                color: #072270;
            }
            .enTit {
                font-size: 12px;
                font-size: 10px;
                line-height: 14px;
                color: #072270;
            }
@@ -708,7 +762,7 @@
            }
            .itemTit1 {
                font-size: 24px;
                font-size: 16px;
                line-height: 36px;
                height: 40%;
                letter-spacing: 1px;
@@ -716,7 +770,7 @@
                margin-bottom: 12px;
            }
            .enTit1 {
                font-size: 14px;
                font-size: 12px;
                color: #072270;
            }
        }
@@ -822,7 +876,7 @@
        position: absolute;
        left: -100px;
        top: 0;
        width: 240px;
        width: 220px;
        height: 100%;
        z-index: 99;
        background: url('../../assets/newMenu/leftbg.png') no-repeat center;
@@ -901,12 +955,14 @@
        }
    }
    .menuGrid {
        width: calc(100vw - 240px);
        width: calc(100vw - 220px);
        height: calc(100vh - 320px);
        padding: 20px 20px 0;
        position: absolute;
        top: 260px;
        left: 240px;
        left: 220px;
      overflow: hidden;
      overflow-y: scroll;
        .gridCont {
            .grid-content {
                border-radius: 16px;