| | |
| | | </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="grid-content cont-bg-1" v-throttle @click="toDoublePrevent"> |
| | | <div class="toplayer"> |
| | | <img class="iconImg" src="../../assets/newMenu/icon2.png" /> |
| | | <div> |
| | |
| | | </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('7')"> |
| | | <div class="toplayer"> |
| | | <img class="iconImg" src="../../assets/newMenu/icon5.png" /> |
| | | <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"> |
| | |
| | | }; |
| | | // 去风险大屏 |
| | | const toRiskPlatform = () => { |
| | | router.push({ |
| | | name: "warningScreen" |
| | | }); |
| | | // window.open('http://39.104.85.193:8585/'); |
| | | // router.push({ |
| | | // name: "warningScreen" |
| | | // }); |
| | | window.open('http://39.104.85.193:8585/'); |
| | | }; |
| | | |
| | | const toDoublePrevent = () => { |
| | | window.open('http://121.239.169.27:6801'); |
| | | }; |
| | | const toSmartFactory = () =>{ |
| | | window.open('http://10.211.134.139:5522/#/login'); |
| | | } |
| | | const toManLocation = () =>{ |
| | | window.open('http://10.211.134.138:8081/GUOTAI'); |
| | | } |
| | | const throttle = (renderMenu: any, delay: number) => { |
| | | let flag = true; |
| | | let count = 0; |
| | |
| | | getDateTime, |
| | | renderToNew, |
| | | toRiskPlatform, |
| | | toDoublePrevent, |
| | | toSmartFactory, |
| | | toManLocation, |
| | | onScreenfullClick, |
| | | loginIconTwo, |
| | | getThemeConfig, |
| | |
| | | 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 { |
| | |
| | | } |
| | | |
| | | .itemTit1 { |
| | | font-size: 34px; |
| | | font-size: 32px; |
| | | line-height: 42px; |
| | | height: 40%; |
| | | letter-spacing: 1px; |
| | |
| | | margin-bottom: 12px; |
| | | } |
| | | .enTit1 { |
| | | font-size: 20px; |
| | | font-size: 18px; |
| | | line-height: 24px; |
| | | color: #072270; |
| | | } |
| | |
| | | } |
| | | } |
| | | |
| | | @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); |
| | |
| | | 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; |
| | | } |
| | | |
| | |
| | | } |
| | | |
| | | .itemTit1 { |
| | | font-size: 28px; |
| | | font-size: 24px; |
| | | line-height: 36px; |
| | | height: 40%; |
| | | letter-spacing: 1px; |
| | |
| | | margin-bottom: 12px; |
| | | } |
| | | .enTit1 { |
| | | font-size: 16px; |
| | | font-size: 14px; |
| | | color: #072270; |
| | | } |
| | | } |
| | |
| | | @media screen and (max-width: 1200px) { |
| | | .gridCont { |
| | | width: 100%; |
| | | height: 100%; |
| | | display: grid; |
| | | grid-gap: 10px; |
| | | grid-template-columns: repeat(3, 1fr); |
| | |
| | | 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; |
| | | } |
| | |
| | | } |
| | | |
| | | .itemTit1 { |
| | | font-size: 24px; |
| | | font-size: 16px; |
| | | line-height: 36px; |
| | | height: 40%; |
| | | letter-spacing: 1px; |
| | |
| | | margin-bottom: 12px; |
| | | } |
| | | .enTit1 { |
| | | font-size: 14px; |
| | | font-size: 12px; |
| | | color: #072270; |
| | | } |
| | | } |
| | |
| | | position: absolute; |
| | | left: -100px; |
| | | top: 0; |
| | | width: 240px; |
| | | width: 220px; |
| | | height: 100%; |
| | | z-index: 99; |
| | | background: url('../../assets/newMenu/leftbg.png') no-repeat center; |
| | |
| | | } |
| | | } |
| | | .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; |