From 31dcd2ac79af82cc149f34fbfb6ffd3d4a91a3cd Mon Sep 17 00:00:00 2001
From: 马宇豪 <978517621@qq.com>
Date: 星期二, 25 二月 2025 13:46:58 +0800
Subject: [PATCH] 修改名称
---
src/views/newHome/index.vue | 329 ++++++++++++++++++++++++++++++++++--------------------
1 files changed, 205 insertions(+), 124 deletions(-)
diff --git a/src/views/newHome/index.vue b/src/views/newHome/index.vue
index a075efa..4382f35 100644
--- a/src/views/newHome/index.vue
+++ b/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">智能安全数字化平台</div>
<div class="topTime">
<div class="time">
{{ time }}
@@ -40,38 +40,38 @@
</div>
<div class="menuGrid">
<div class="gridCont">
- <div class="grid-content grid-content-1 cont-bg-1" v-throttle @click="toRiskPlatform">
- <div class="toplayer">
- <div>
- <img class="iconImg" src="../../assets/newMenu/icon1.png" />
- <div>
- <div class="itemTit1">智能安全风险综合预警<br />预报平台</div>
- <div class="enTit1">Intelligent Security Risk Comprehensive Forewarning and Forecasting Platform</div>
- </div>
- </div>
- </div>
- <img class="bgImg1" src="../../assets/newMenu/card-1.png" />
- </div>
- <div class="grid-content cont-bg-1" v-throttle @click="render('2')">
- <div class="toplayer">
- <img class="iconImg" src="../../assets/newMenu/icon2.png" />
- <div>
- <div class="itemTit">智能安全双重预防系统</div>
- <div class="enTit">Intelligent Security Dual Prevention System</div>
- </div>
- </div>
- <img class="bgImg" src="../../assets/newMenu/card-4.png" />
- </div>
- <div class="grid-content cont-bg-1" v-throttle @click="render('4')">
- <div class="toplayer">
- <img class="iconImg" src="../../assets/newMenu/icon3.png" />
- <div>
- <div class="itemTit">智能安全巡检系统</div>
- <div class="enTit">Intelligent Security Patrol System</div>
- </div>
- </div>
- <img class="bgImg" src="../../assets/newMenu/card-8.png" />
- </div>
+<!-- <div class="grid-content grid-content-1 cont-bg-1" v-throttle @click="toRiskPlatform">-->
+<!-- <div class="toplayer">-->
+<!-- <div>-->
+<!-- <img class="iconImg" src="../../assets/newMenu/icon1.png" />-->
+<!-- <div>-->
+<!-- <div class="itemTit1">智能安全风险综合预警<br />预报平台</div>-->
+<!-- <div class="enTit1">Intelligent Security Risk Comprehensive Forewarning and Forecasting Platform</div>-->
+<!-- </div>-->
+<!-- </div>-->
+<!-- </div>-->
+<!-- <img class="bgImg1" src="../../assets/newMenu/card-1.png" />-->
+<!-- </div>-->
+<!-- <div class="grid-content cont-bg-1" v-throttle @click="toDoublePrevent">-->
+<!-- <div class="toplayer">-->
+<!-- <img class="iconImg" src="../../assets/newMenu/icon2.png" />-->
+<!-- <div>-->
+<!-- <div class="itemTit">智能安全双重预防系统</div>-->
+<!-- <div class="enTit">Intelligent Security Dual Prevention System</div>-->
+<!-- </div>-->
+<!-- </div>-->
+<!-- <img class="bgImg" src="../../assets/newMenu/card-4.png" />-->
+<!-- </div>-->
+<!-- <div class="grid-content cont-bg-1" v-throttle @click="render('4')">-->
+<!-- <div class="toplayer">-->
+<!-- <img class="iconImg" src="../../assets/newMenu/icon3.png" />-->
+<!-- <div>-->
+<!-- <div class="itemTit">智能安全巡检系统</div>-->
+<!-- <div class="enTit">Intelligent Security Patrol System</div>-->
+<!-- </div>-->
+<!-- </div>-->
+<!-- <img class="bgImg" src="../../assets/newMenu/card-8.png" />-->
+<!-- </div>-->
<div class="grid-content cont-bg-1" v-throttle @click="render('3')">
<div class="toplayer">
<img class="iconImg" src="../../assets/newMenu/icon4.png" />
@@ -82,66 +82,98 @@
</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="toplayer">
- <img class="iconImg" src="../../assets/newMenu/icon5.png" />
- <div>
- <div class="itemTit">安全目标责任管理系统</div>
- <div class="enTit">Security Target Responsibility Management System</div>
- </div>
- </div>
- <img class="bgImg" src="../../assets/newMenu/card-2.png" />
- </div>
- <div class="grid-content cont-bg-2" v-throttle @click="render('10')">
- <div class="toplayer">
- <img class="iconImg" src="../../assets/newMenu/icon6.png" />
- <div>
- <div class="itemTit">安全知识图谱系统</div>
- <div class="enTit">Security Knowledge Graph System</div>
- </div>
- </div>
- <img class="bgImg" src="../../assets/newMenu/card-3.png" />
- </div>
- <div class="grid-content cont-bg-2" v-throttle @click="render('9')">
- <div class="toplayer">
- <img class="iconImg" src="../../assets/newMenu/icon7.png" />
- <div>
- <div class="itemTit">设备综合管控系统</div>
- <div class="enTit">Equipment Integrated Management and Control System</div>
- </div>
- </div>
- <img class="bgImg" src="../../assets/newMenu/card-9.png" />
- </div>
- <div class="grid-content cont-bg-2" v-throttle @click="render('6')">
- <div class="toplayer">
- <img class="iconImg" src="../../assets/newMenu/icon8.png" />
- <div>
- <div class="itemTit">应急管理系统</div>
- <div class="enTit">Emergency Management System</div>
- </div>
- </div>
- <img class="bgImg" src="../../assets/newMenu/card-5.png" />
- </div>
- <div class="grid-content cont-bg-2" v-throttle @click="renderToNew('11')">
- <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>
- </div>
- <img class="bgImg" src="../../assets/newMenu/card-10.png" />
- </div>
- <div class="grid-content cont-bg-2" v-throttle @click="render('8')">
- <div class="toplayer">
- <img class="iconImg" src="../../assets/newMenu/icon10.png" />
- <div>
- <div class="itemTit">安全事故管理系统</div>
- <div class="enTit">Security Incident Management System</div>
- </div>
- </div>
- <img class="bgImg" src="../../assets/newMenu/card-6.png" />
- </div>
+<!-- <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>-->
+<!-- <div class="itemTit">安全目标责任管理系统</div>-->
+<!-- <div class="enTit">Security Target Responsibility Management System</div>-->
+<!-- </div>-->
+<!-- </div>-->
+<!-- <img class="bgImg" src="../../assets/newMenu/card-2.png" />-->
+<!-- </div>-->
+<!-- <div class="grid-content cont-bg-2" v-throttle @click="render('10')">-->
+<!-- <div class="toplayer">-->
+<!-- <img class="iconImg" src="../../assets/newMenu/icon6.png" />-->
+<!-- <div>-->
+<!-- <div class="itemTit">安全知识图谱系统</div>-->
+<!-- <div class="enTit">Security Knowledge Graph System</div>-->
+<!-- </div>-->
+<!-- </div>-->
+<!-- <img class="bgImg" src="../../assets/newMenu/card-3.png" />-->
+<!-- </div>-->
+<!-- <div class="grid-content cont-bg-2" v-throttle @click="render('9')">-->
+<!-- <div class="toplayer">-->
+<!-- <img class="iconImg" src="../../assets/newMenu/icon7.png" />-->
+<!-- <div>-->
+<!-- <div class="itemTit">设备综合管控系统</div>-->
+<!-- <div class="enTit">Equipment Integrated Management and Control System</div>-->
+<!-- </div>-->
+<!-- </div>-->
+<!-- <img class="bgImg" src="../../assets/newMenu/card-9.png" />-->
+<!-- </div>-->
+<!-- <div class="grid-content cont-bg-2" v-throttle @click="render('6')">-->
+<!-- <div class="toplayer">-->
+<!-- <img class="iconImg" src="../../assets/newMenu/icon8.png" />-->
+<!-- <div>-->
+<!-- <div class="itemTit">应急管理系统</div>-->
+<!-- <div class="enTit">Emergency Management System</div>-->
+<!-- </div>-->
+<!-- </div>-->
+<!-- <img class="bgImg" src="../../assets/newMenu/card-5.png" />-->
+<!-- </div>-->
+<!-- <div class="grid-content cont-bg-2" v-throttle @click="renderToNew('11')">-->
+<!-- <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">Safety Education Examination System</div>-->
+<!-- </div>-->
+<!-- </div>-->
+<!-- <img class="bgImg" src="../../assets/newMenu/card-10.png" />-->
+<!-- </div>-->
+<!-- <div class="grid-content cont-bg-2" v-throttle @click="render('8')">-->
+<!-- <div class="toplayer">-->
+<!-- <img class="iconImg" src="../../assets/newMenu/icon10.png" />-->
+<!-- <div>-->
+<!-- <div class="itemTit">安全事故管理系统</div>-->
+<!-- <div class="enTit">Security Incident Management System</div>-->
+<!-- </div>-->
+<!-- </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,12 +360,27 @@
});
};
// 去风险大屏
- const toRiskPlatform = () => {
- router.push({
- name: "warningScreen"
- });
+ const toRiskPlatform = async() => {
+ // router.push({
+ // name: "warningScreen"
+ // });
+ 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://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;
@@ -353,6 +402,7 @@
//调用菜单方法
const renderMenu = throttle(() => {
+ // debugger
renderFun();
}, 2000);
@@ -362,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: '你没有该子系统的权限' });
}
@@ -380,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 = () => {
@@ -391,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,
@@ -405,6 +461,9 @@
getDateTime,
renderToNew,
toRiskPlatform,
+ toDoublePrevent,
+ toSmartFactory,
+ toManLocation,
onScreenfullClick,
loginIconTwo,
getThemeConfig,
@@ -433,13 +492,27 @@
left: 0;
}
}
-@media screen and (min-width: 1400px) {
+ @keyframes upDown {
+ 50% {
+ -webkit-transform: translateY(-8px);
+ -ms-transform: translateY(-8px);
+ -o-transform: translateY(-8px);
+ transform: translateY(-8px);
+ }
+ 100% {
+ -webkit-transform: translateY(0);
+ -ms-transform: translateY(0);
+ -o-transform: translateY(0);
+ transform: translateY(0);
+ }
+ }
+@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 {
@@ -501,7 +574,7 @@
}
.itemTit1 {
- font-size: 34px;
+ font-size: 32px;
line-height: 42px;
height: 40%;
letter-spacing: 1px;
@@ -509,7 +582,7 @@
margin-bottom: 12px;
}
.enTit1 {
- font-size: 20px;
+ font-size: 18px;
line-height: 24px;
color: #072270;
}
@@ -529,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;
@@ -551,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;
}
@@ -597,7 +670,7 @@
}
.itemTit1 {
- font-size: 28px;
+ font-size: 24px;
line-height: 36px;
height: 40%;
letter-spacing: 1px;
@@ -605,7 +678,7 @@
margin-bottom: 12px;
}
.enTit1 {
- font-size: 16px;
+ font-size: 14px;
color: #072270;
}
}
@@ -625,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;
@@ -644,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;
}
@@ -689,7 +762,7 @@
}
.itemTit1 {
- font-size: 24px;
+ font-size: 16px;
line-height: 36px;
height: 40%;
letter-spacing: 1px;
@@ -697,7 +770,7 @@
margin-bottom: 12px;
}
.enTit1 {
- font-size: 14px;
+ font-size: 12px;
color: #072270;
}
}
@@ -803,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;
@@ -882,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;
@@ -898,9 +973,15 @@
border: 2px solid rgba(255,255,255,0);
&:hover {
+ border-radius: 16px;
background-image: radial-gradient(ellipse farthest-side at 50% 100%, #48a3ff 0%, #fff 120%);
box-shadow: -8px -8px 24px rgba(20, 97, 234, 0.2), 8px 8px 24px rgba(20, 97, 234, 0.2);
- border: 2px solid rgba(255,255,255,0.8);
+ border: 2px solid #fff;
+
+ .iconImg{
+ animation: upDown 0.3s 1 ease-in-out forwards;
+ filter: drop-shadow(0 0 12px rgba(20, 97, 234, 0.4));
+ }
}
}
.cont-bg-1 {
--
Gitblit v1.9.2