智慧园区前端大屏
shuishen
2024-12-18 9a37c5e1b2190c3f6ec71483923922189091dd52
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
<!--
 * @Author: shuishen 1109946754@qq.com
 * @Date: 2024-11-08 11:00:30
 * @LastEditors: shuishen 1109946754@qq.com
 * @LastEditTime: 2024-11-27 19:16:37
 * @FilePath: \bigScreen\src\views\companyInfo\index.vue
 * @Description:
 *
 * Copyright (c) 2024 by shuishen, All Rights Reserved.
-->
<script setup>
import { computerCapacity } from "utils/turfPolygon.js"
import qyfw from "@/assets/json/qyfw"
import rightContainer from './components/rightContainer.vue'
import leftContainer from './components/leftContainer.vue'
import centerContainer from './components/centerContainer.vue' // 修改这里
import mainMenuVue from './components/mainMenu.vue'
import { onUnmounted } from "vue"
 
let buttonIndex = ref(1)
let data = reactive({
  companyInfo: {}
})
 
let curCompanyWall = new DC.VectorLayer('curCompanyWall')
window.$viewer.addLayer(curCompanyWall)
 
data.companyInfo = JSON.parse(localStorage.getItem('companyInfo'))
let curCompany = qyfw.features.find(item => item.properties.name == data.companyInfo.name)
 
let wall = new DC.Wall(
  curCompany.geometry.coordinates[0].map(d => [...d, 125].join(',')).join(';')
)
 
wall.setStyle({
  material: new DC.WallTrailMaterialProperty({
    color: window.$Cesium.Color.fromBytes(255, 255, 0, 180),
    speed: 10
  })
})
curCompanyWall.addOverlay(wall)
 
onMounted(() => {
  window.$viewer && window.$viewer.flyTo(curCompanyWall)
})
 
onUnmounted(() => {
  window.$viewer && window.$viewer.removeLayer(curCompanyWall)
  curCompanyWall = null
})
 
const handleChildEvent = (data) => {
  buttonIndex.value = data
  // localStorage.setItem('buttonIndex', data);
 
}
</script>
 
<template>
  <div class="container cur-page-container">
    <div class="main-header">
      <centerContainer :button-index="buttonIndex" @childEvent="handleChildEvent"></centerContainer>
    </div>
    <div class="main-container">
      <left-container :button-index="buttonIndex"></left-container>
    </div>
 
    <div class="main-container" v-if="buttonIndex <= 2">
      <right-container :button-index="buttonIndex"></right-container>
    </div>
    <main-menu-vue :button-index="buttonIndex" @childEvent="handleChildEvent"></main-menu-vue>
  </div>
</template>
 
<style lang="scss" scoped>
.container {
  position: absolute;
  width: 100%;
  height: 100%;
 
  .main-header {
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    top: 0;
    width: 100%;
    height: 6vh;
    pointer-events: auto;
  }
 
  .main-container {
    position: absolute;
    top: 80px;
    left: 40px;
    right: 40px;
    bottom: 40px;
  }
}
 
.cur-page-container {}
</style>