全屏

src/layout/components/Header/index.vue

@@ -94,8 +94,13 @@
       <img class="icon" src="@/assets/images/back.png" alt="" /> 返回
     </div>
   </div>
+  <div class="amplify" @click="handleAmplify">
+	  <img class="icon-qp" src="@/assets/images/qping.png" alt="" /> 
+  </div>
 </template>
-
+<script>
+	
+</script>
 <script setup>
   import { useRouter } from 'vue-router'
 
@@ -110,7 +115,8 @@
 
   import pubSub from 'pubsub-js'
   import { useScenicStore } from '@/stores/scenic'
-
+  import { useHomeStore } from '@/stores/home'
+  const homeStore = useHomeStore()
   const scenicStore = useScenicStore()
   const router = useRouter()
 
@@ -127,7 +133,12 @@
   let otherLeftNav = ref([])
   let otherRightNav = ref([])
   let spotList = ref([])
-
+  let amplify = ref(true)
+  //放大
+  const handleAmplify = ()=>{
+	  amplify.value = !amplify.value
+	  homeStore.setAmplify(amplify.value)
+  }
   // 补零
   const fillZero = (value) => {
     return value < 10 ? `0${value}` : value
@@ -374,8 +385,6 @@
   )
   onMounted(async() => {
 	// 获取查询参数
-
-
 	PubSub.subscribe('navToChange', (msg, data) => {
 		monitorDefaultData.value = data
 		console.log(monitorDefaultData.value,'monitorDefaultData.valuemonitorDefaultData.value')
@@ -402,6 +411,14 @@
 </script>
 
 <style scoped lang="scss">
+	.amplify{
+		position:absolute;
+		right:vw(550);
+		top:vh(50);
+		.icon-qp{
+			width:vw(50);
+		}
+	}
   .header {
     position: absolute;
     left: vw(326);

src/layout/index.vue

@@ -1,11 +1,11 @@
 <template>
   <Header />
   <div class="flex flex-1">
-    <core-video />
+    <core-video v-if="homeStore.amplify" />
     <div class="mian">
       <router-view />
     </div>
-    <correspondence />
+    <correspondence v-if="homeStore.amplify"/>
   </div>
 </template>
 
@@ -15,7 +15,8 @@
   import Header from './components/Header/index'
   import CoreVideo from './components/CoreVideo/index'
   import Correspondence from './components/Correspondence/index'
-
+  import { useHomeStore } from '@/stores/home'
+  const homeStore = useHomeStore()
   let props = defineProps({
     title: {
       type: String,
@@ -34,6 +35,10 @@
       default: () => []
     }
   })
+
+  onMounted(() => {
+  	
+  })
 </script>
 
 <style scoped lang="scss">

src/main.js

@@ -10,6 +10,7 @@ import 'element-plus/theme-chalk/el-message.css'
 import '@/assets/adapter.min.js'
 import '@/assets/webrtcstreamer.js'
 
+
 const app = createApp(App)
 
 app.use(createPinia())

src/stores/home.js

@@ -2,6 +2,7 @@ import { ref } from 'vue'
 import { defineStore } from 'pinia'
 
 export const useHomeStore = defineStore('home', () => {
+	let amplify = ref(true)
   // 景区信息数据
   let scenicData = ref({
     scenicSpot: [
@@ -110,7 +111,9 @@ export const useHomeStore = defineStore('home', () => {
     { name: '停车异常', value: 0 },
     { name: '舆论异常', value: 0 }
   ])
-
+  const setAmplify = (val)=>{
+	  amplify.value = val
+  }
   const setNotifyInfo = (val) => {
     notifyInfo.value = val
   }
@@ -158,6 +161,7 @@ export const useHomeStore = defineStore('home', () => {
     userPortraitData.value = val
   }
   return {
+	  amplify,
 	trainData,
 	setTrainData,
     scenicData,
@@ -187,6 +191,7 @@ export const useHomeStore = defineStore('home', () => {
     setTrafficInfoData,
     setCarStopInfoData,
     setCarShipData,
-    setHotelData
+    setHotelData,
+	setAmplify,
   }
 })

src/views/home/components/box-2.vue

@@ -1,6 +1,6 @@
 <template>
-  <div class="box-3">
-    <div class="header">
+  <div class="box-3" :class="homeStore.amplify?'':'coll-box'">
+    <div class="header" :class="homeStore.amplify?'':'coll-box-2'">
       <div class="flex">
         <div class="left">
           <div class="item">
@@ -270,10 +270,19 @@
 
   onMounted(() => {
     getSpotList()
+	
   })
 </script>
 
 <style lang="scss" scoped>
+	.coll-box{
+		width:initial !important;
+		flex:1 !important;
+	}
+	.coll-box-2{
+		width:initial !important;
+		flex:1;
+	}
   :deep(.BMap_cpyCtrl) {
     display: none;
   }

src/views/hotel/components/video-box.vue

@@ -582,7 +582,8 @@
     }
     &-item {
       position: relative;
-      width: vw(720);
+      // width: vw(720);
+	  width:33%;
       height: vh(380);
       padding: vh(10) vw(10);
       background-image: url('/src/assets/images/item-primary.png');

src/views/monitor/components/box-2.vue

@@ -833,7 +833,8 @@
     }
     &-item {
       position: relative;
-      width: vw(686);
+      // width: vw(686);
+	  width: 33%;
       height: vh(380);
       padding: vh(10) vw(10);
       background-image: url('/src/assets/images/item-primary.png');

src/views/scenic/components/box-1.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="box-1">
+  <div class="box-1" :class="homeStore.amplify?'':'coll-box'">
     <div class="header">
      <div class="header__left" @click="handlePiaoPop">
         <img src="@/assets/images/ticket.png" />
@@ -130,14 +130,16 @@
   import { useRouter } from 'vue-router'
 
   import { useScenicStore } from '@/stores/scenic'
-
+  
   import { useMap } from '@/hooks/map'
   import {getPreviewUrlApi,getSpotTicketDate} from "@/api/home.js";
 import pubSub from 'pubsub-js'
   const router = useRouter()
   const scenicStore = useScenicStore()
   const { initMap, addMarker, map, marker } = useMap()
-
+ import { useHomeStore } from '@/stores/home'
+ 
+ const homeStore = useHomeStore()
   let props = defineProps({
     scenicSpotId: {
       type: String,
@@ -179,6 +181,7 @@ import pubSub from 'pubsub-js'
 	  gridData.value = res.data
 	  console.log(res,'res')
   }
+  let myElement = ref(false)
   onMounted(() => {
     scenicChange = PubSub.subscribe('scenicChange', (msg, data) => {
 
@@ -202,6 +205,12 @@ import pubSub from 'pubsub-js'
       // })
       // map.value.addOverlay(imgOverlay)
     })
+	PubSub.subscribe('changeAmplify', (msg, data) => {
+	   if(data&&myElement.value){
+		    myElement.value.classList.add('coll-box');
+			
+	   }
+	})
   })
   onUnmounted(() => {
     PubSub.unsubscribe(scenicChange)
@@ -209,6 +218,9 @@ import pubSub from 'pubsub-js'
 </script>
 
 <style scoped lang="scss">
+	.coll-box{
+		flex:1 !important;
+	}
   .box-1 {
     margin-top: vh(120);
     width: vw(900);

src/views/sentiment/index.vue

@@ -144,6 +144,7 @@
     flex: 1;
     margin-top: vh(120);
     box-sizing: border-box;
+	justify-content: center;
     .bg {
       background: linear-gradient(321deg, #0b2f64 0%, #062b57 100%);
     }

src/views/traffic/components/box-2.vue

@@ -11,7 +11,7 @@
         {{ item.name }}
       </li>
     </ul>
-	<div>
+	<div class="flex-1">
 		<div class="title-1">
 		  <div class="title">
 		    <span> 核心路段 </span>
@@ -231,6 +231,10 @@
 </script>
 
 <style lang="scss" scoped>
+	.flex-1{
+		flex:1;
+		overflow:hidden;
+	}
 	.title-1 {
 	  position: relative;
 	  margin-bottom:vh(20);
@@ -258,6 +262,7 @@
   .box-2 {
     margin-top: vh(120);
     display: flex;
+	flex:1;
   }
   .nav {
     width: vw(230);
@@ -294,7 +299,8 @@
   .traffic-map-big {
     position: relative;
     z-index: 9;
-    width: vw(2116);
+    // width: vw(2116);
+	width:100%;
     height: vh(890);
     margin-left: vw(8);
     box-sizing: border-box;
@@ -302,7 +308,7 @@
     background-size: 100% 100%;
   }
   .traffic-map {
-    width: vw(1500) !important;
+    // width: vw(1500) !important;
   }
   .video-list {
     width: vw(320);

src/views/vehicles/components/big-map.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="dialog">
+  <div class="dialog" :class="homeStore.amplify?'':'coll-box'">
     <!-- <el-dialog v-model="modelValue" :modal="false" :close-on-click-modal="false" :close-on-press-escape="false"	 align-center > -->
       <!-- <img class="close" src="@/assets/images/close.png" @click="handleClose" /> -->
       <div class="flex">
@@ -107,6 +107,8 @@ import PubSub from 'pubsub-js'
   import { debounce } from 'lodash'
   import { useScenicStore } from '@/stores/scenic'
   const scenicStore = useScenicStore()
+  import { useHomeStore } from '@/stores/home'
+  const homeStore = useHomeStore()
   const { map, marker, initMap, addMarker } = useMap()
   let tabsList = ref([
 	  {id:0,text:'所有',scenicSpotId:''},
@@ -432,6 +434,10 @@ import PubSub from 'pubsub-js'
 </script>
 
 <style lang="scss">
+	.coll-box{
+		width:100% !important;
+		flex:1 !important;
+	}
 	.tabs-box{
 		display:flex;
 		.tabs-list{
@@ -610,6 +616,7 @@ import PubSub from 'pubsub-js'
   :deep(.anchorBL) {
     display: none;
   }
+  
   .dialog {
 	  width: vw(3170);
 	  padding: vw(8);