From 999cab6fb3fc6d2a288d365da991351c5a396bf0 Mon Sep 17 00:00:00 2001 From: Admin <978517621@qq.com> Date: 星期三, 21 九月 2022 15:53:18 +0800 Subject: [PATCH] 删除无用页面 --- src/views/intellectInspect/intelligentMap/index.vue | 115 +++++++++++++++++++++++++++++++++++++++++---------------- 1 files changed, 83 insertions(+), 32 deletions(-) diff --git a/src/views/intellectInspect/intelligentMap/index.vue b/src/views/intellectInspect/intelligentMap/index.vue index b365a52..e44e7ec 100644 --- a/src/views/intellectInspect/intelligentMap/index.vue +++ b/src/views/intellectInspect/intelligentMap/index.vue @@ -1,10 +1,18 @@ <template> <div class="container"> - <div class="big-title" @click="goBack()"><span></span>大型实验室智能巡检系统<span></span></div> + <div class="big-title" @click="goBack()"><span></span>国泰新华智能巡检系统<span></span></div> <div style="font-size: 14px;color: #00ffff">{{present}}</div> + <div class="btns"> + <div class="fullbtn" @click="onScreenfullClick"> + <div class="toFull"> + <i class="iconfont" :title="isScreenfull ? $t('message.user.title6') : $t('message.user.title5')" :class="!isScreenfull ? 'icon-fullscreen' : 'icon-tuichuquanping'"></i> + </div> + <div>全屏</div> + </div> <div class="backBtn" @click="goBack()"> <img src="../../../assets/loginPage/back-icon.png"> <div>退出</div> + </div> </div> <div class="blocks"> <div class="current-task"> @@ -167,12 +175,12 @@ </div> </div> <div class="pic-tit water"> - <img src="../../../assets/loginPage/equipment.JPG"> + <img src="../../../assets/loginPage/equipment.jpg"> <p>实验室装置区</p> </div> <div></div> <div class="pic-tit"> - <img src="../../../assets/loginPage/wind.JPG"> + <img src="../../../assets/loginPage/wind.jpg"> <p>实验室风机系统</p> </div> <div class="item item-l warning"> @@ -204,7 +212,7 @@ <div></div> <div></div> <div class="pic-tit water"> - <img src="../../../assets/loginPage/watersys.JPG"> + <img src="../../../assets/loginPage/watersys.jpg"> <p>实验室循环水系统</p> </div> <div class="item item-t"> @@ -272,6 +280,10 @@ </template> <script> +import { ElMessage } from 'element-plus'; +import { ElMessageBox } from 'element-plus/es'; +import screenfull from 'screenfull'; + export default { name: 'NewForm', props: { @@ -279,7 +291,8 @@ }, data(){ return{ - present: '' + present: '', + isScreenfull: false } }, created() { @@ -290,12 +303,29 @@ methods:{ goBack(){ window.history.go(-1) + }, + // 全屏点击时 + onScreenfullClick(){ + const t = this + if (!screenfull.isEnabled) { + ElMessage.warning('暂不不支持全屏'); + return false; + } + screenfull.toggle(); + screenfull.on('change', () => { + if (screenfull.isFullscreen) { + t.isScreenfull = true + } + else{ + t.isScreenfull = false + } + }); } } } </script> -<!-- Add "scoped" attribute to limit CSS to this component only --> +<!-- Add "scoped" attribute to limit CSS to this components only --> <style scoped lang="scss"> @keyframes warn { 0% { @@ -399,23 +429,42 @@ margin: 0 20px; } } - .backBtn{ + .btns{ position: absolute; z-index: 99999; - right: 150px; + right: 60px; top: 40px; display: flex; align-items: center; - cursor: pointer; - - img{ - width: 18px; - height: 18px; - margin-right: 10px; + .fullbtn{ + cursor: pointer; + display: flex; + align-items: center; + margin-right: 20px; + .toFull{ + font-weight: bolder; + color: #00FFFF; + margin-right: 10px; + } + div{ + font-size: 16px; + color: #00FFFF; + } } - div{ - font-size: 16px; - color: #00FFFF; + + .backBtn{ + cursor: pointer; + display: flex; + align-items: center; + img{ + width: 14px; + height: 14px; + margin-right: 10px; + } + div{ + font-size: 16px; + color: #00FFFF; + } } } .blocks{ @@ -439,7 +488,7 @@ .item{ width: calc((100vw - 120px)/ 7); height: calc((100vh - 130px)/ 5); - padding: 20px 40px 20px 20px; + padding: 20px 30px 20px 20px; position: relative; box-sizing: border-box; @@ -683,17 +732,20 @@ display: flex; flex-direction: column; align-items: center; - font-size: 16px; + font-size: 20px; color: #36FCFC; border-right: 1px solid #36FCFC; padding-right: 20px; + img{ + margin-bottom: 10px; + } } .task-des-r{ - width: 320px; + width: calc((200vw - 240px)/ 7); display: flex; flex-direction: column; align-items: center; - font-size: 16px; + font-size: 20px; line-height: 28px; color: #FCFC36; padding-left: 20px; @@ -759,12 +811,11 @@ } .star-pic{ position: absolute; - width: calc(40vh - 80px); - height: calc(40vh - 80px); + width: calc((100vw - 120px)/ 7); + height: calc((100vw - 120px)/ 7); z-index: 999999; - top: calc(40vh - 120px); - left: 50%; - transform: translateX(-65%); + bottom: 40px; + right: 40px; padding: 20px; .star-bg{ @@ -795,9 +846,9 @@ .section-1{ position: absolute; left: 70px; - top: -10px; + top: -20px; width: calc((200vw - 240px) / 7 + 60px); - height: 630px; + height: calc(80vh - 109px); background: rgba(0,100,190,.1); border: 1px solid rgba(0,100,190,.4); border-radius: 8px; @@ -805,9 +856,9 @@ .section-2{ position: absolute; left: calc((400vw - 480px)/ 7 + 70px); - top: 150px; + top: calc((100vh - 130px)/ 5 - 20px); width: calc((200vw - 240px) / 7 + 60px); - height: 470px; + height: calc((300vh - 390px)/ 5 - 5px); background: rgba(0,100,190,.1); border: 1px solid rgba(0,100,190,.4); border-radius: 8px; @@ -815,9 +866,9 @@ .section-3{ position: absolute; left: 100px; - top: 630px; + top: calc(80vh - 119px); width: calc((500vw - 600px)/ 7 + 30px); - height: 180px; + height: calc((100vh - 130px)/ 5 + 20px); background: rgba(0,100,190,.1); border: 1px solid rgba(0,100,190,.4); border-radius: 8px; -- Gitblit v1.9.2