修改大屏

马宇豪

2025-04-24 235a109b3b461c7acbd1d7bb4f7e920075de2b9e

 src/views/hazardousChemicals/bigScreen/index.vue

@@ -9,10 +9,12 @@
        <h1 class="dashboard-title">独墅湖科教创新区危化品智慧管控平台</h1>
      </div>
      <div class="header-right">
<!--        <div class="weather-info">-->
        <div class="weather-info">
<!--          <span class="weather-icon">☀</span>-->
<!--          <span class="weather-text">晴 26°C</span>-->
<!--        </div>-->
          <div class="exit-btn" v-show="!isFull" @click="toFull">全屏</div>
          <div class="exit-btn" v-show="isFull" @click="exitFull">退出全屏</div>
        </div>
      </div>
    </header>

@@ -84,12 +86,16 @@
import LeftBottom from "@/views/hazardousChemicals/bigScreen/components/leftBottom";
import MidBottom from "@/views/hazardousChemicals/bigScreen/components/midBottom";
import RightTop from "@/views/hazardousChemicals/bigScreen/components/rightTop";
import MidTop from "@/views/hazardousChemicals/bigScreen/components/midTop";
import MidTop from "@/views/hazardousChemicals/bigScreen/components/midTop2";
import RightBottom from "@/views/hazardousChemicals/bigScreen/components/rightBottom";
import {useRoute, useRouter} from "vue-router";
const router = useRouter()
const route = useRoute()

const currentTime = ref('');
const currentDate = ref('');
let timer = ref(null);

const isFull = ref(false)
const updateTime = () => {
  const now = new Date();
  currentTime.value = now.toLocaleTimeString();
@@ -106,6 +112,11 @@
  window.onresize = () => {
    setRem();/* 改变窗口大小时重新设置 rem */
  }
  if(route.path == '/bigScreen'){
    isFull.value = false
  }else{
    isFull.value = true
  }
  updateTime();
  timer.value = setInterval(updateTime, 1000);
});
@@ -113,12 +124,20 @@
onBeforeUnmount(() => {
  if (timer.value) clearInterval(timer.value);
});

const toFull = ()=>{
  router.push('/bigMap')
}
const exitFull = ()=>{
  router.push('/bigScreen')
}

</script>

<style lang="postcss">
.data-dashboard {
  width: 100%;
  height: calc(100vh - 70px);
  height: 100%;
  display: flex;
  flex-direction: column;
  background-color: #031A41;
@@ -175,7 +194,11 @@
        background: rgba(255, 255, 255, 0.1);
        padding: 10px 20px;
        border-radius: 30px;

        .exit-btn{
          cursor: pointer;
          color: #02CDE6;
          font-size: 14px;
        }
        .weather-icon {
          font-size: 16px;
          margin-right: 10px;