Commit d1a523e044774a326757bb75811a5a0986aa1cbb

Authored by ww
1 parent 99e1be05

fix: 预览模式模拟数据未清空

... ... @@ -5,7 +5,7 @@
5 5 </template>
6 6
7 7 <script setup lang="ts">
8   -import { ref, PropType, toRefs, watch, render, h, onMounted, onUnmounted, reactive} from 'vue'
  8 +import { ref, PropType, toRefs, watch, render, h, onMounted, onUnmounted, reactive } from 'vue'
9 9 import AMapLoader from '@amap/amap-jsapi-loader'
10 10 import { CreateComponentType } from '@/packages/index.d'
11 11 import { useChartDataFetch } from '@/hooks'
... ... @@ -74,7 +74,7 @@ const initMap = (newData: any) => {
74 74 pitch: pitch.value, // 地图俯仰角度,有效范围 0 度- 83 度
75 75 skyColor: skyColor.value,
76 76 viewMode: viewMode.value, // 地图模式
77   - willReadFrequently: true,
  77 + willReadFrequently: true,
78 78 WebGLParams: {
79 79 preserveDrawingBuffer: true,
80 80 }
... ... @@ -102,10 +102,10 @@ const initMap = (newData: any) => {
102 102
103 103 //携带设备的tbDeviceId和别名或者名称
104 104 const devicePartInfo = reactive<devicePartInfoInterface>({
105   - tbDeviceId:'',
106   - name:'',
107   - alias:'',
108   - deviceProfileId:'',
  105 + tbDeviceId: '',
  106 + name: '',
  107 + alias: '',
  108 + deviceProfileId: '',
109 109 })
110 110
111 111 //创建信息弹窗
... ... @@ -140,25 +140,24 @@ const createInfoWindow = async (extraInfo: dataExtraInfoType) => {
140 140 <div style="display:flex;flex-direction:column;margin:3.5rem 5.5rem 2rem 6.5rem;position:relative;">
141 141 <div style="display:flex;justify-content:space-between;align-items:center;color:white;">
142 142 <span style="${textOverflowFontBold}">${alias || name}</span>
143   - ${
144   - deviceState === 'INACTIVE'
145   - ? `<div style="${deviceStateContainer}">
  143 + ${deviceState === 'INACTIVE'
  144 + ? `<div style="${deviceStateContainer}">
146 145 <img onclick="handleOpenDrawer()" title="最新数据" style="${deviceStateImg};cursor:pointer;" src="${listView}"/>
147 146 <img style="${deviceStateImg};margin-left:0.3rem" src="${inactive}"/>
148 147 <span style="${deviceStateText}">待激活</span>
149 148 </div>`
150   - : deviceState === 'ONLINE'
151   - ? `<div style="${deviceStateContainer}">
  149 + : deviceState === 'ONLINE'
  150 + ? `<div style="${deviceStateContainer}">
152 151 <img onclick="handleOpenDrawer()" title="最新数据" style="${deviceStateImg};cursor:pointer;" src="${listView}"/>
153 152 <img style="${deviceStateImg};margin-left:0.3rem" src="${online}"/>
154 153 <span style="${deviceStateText}">在线</span>
155 154 </div>`
156   - : `<div style="${deviceStateContainer}">
  155 + : `<div style="${deviceStateContainer}">
157 156 <img onclick="handleOpenDrawer()" title="最新数据" style="${deviceStateImg};cursor:pointer;" src="${listView}"/>
158 157 <img style="${deviceStateImg};margin-left:0.3rem" src="${offline}"/>
159 158 <span style="${deviceStateText}">离线</span>
160 159 </div>`
161   - }
  160 + }
162 161 </div>
163 162 <div style="display:flex;flex-direction:column;justify-content:space-between;color:white;margin-top:1rem;gap:0.95rem;">
164 163 <div style="${textOverflow}">所属组织:${organizationDTO.name}</div>
... ... @@ -179,16 +178,16 @@ const handleOpenDrawer = async () => {
179 178 deviceLatestTableRef.value?.setDrawerTitle(devicePartInfo.alias || devicePartInfo.name)
180 179 if (!devicePartInfo.tbDeviceId) return
181 180 const resp = await getDeviceLatest(devicePartInfo.tbDeviceId)
182   - const respGetAttrs = await getProfileAttrs({deviceProfileId: devicePartInfo.deviceProfileId})
183   - deviceLatestTableRef.value?.setValue(resp,respGetAttrs)
  181 + const respGetAttrs = await getProfileAttrs({ deviceProfileId: devicePartInfo.deviceProfileId })
  182 + deviceLatestTableRef.value?.setValue(resp, respGetAttrs)
184 183 }
185 184
186 185 onMounted(() => {
187   - (window as any).handleOpenDrawer = handleOpenDrawer;
  186 + (window as any).handleOpenDrawer = handleOpenDrawer;
188 187 });
189 188
190 189 onUnmounted(() => {
191   - (window as any).handleOpenDrawer = null;
  190 + (window as any).handleOpenDrawer = null;
192 191 });
193 192
194 193 //地图鼠标hover
... ... @@ -228,9 +227,10 @@ const dataHandle = (newData: dataJsonType) => {
228 227 offset: new AMapIns.Pixel(-13, 5),
229 228 icon: iconMarker.value
230 229 })
231   - // markers.push(markerInstance) 原作者这种方式添加,属于JS API 1.4.8版本的
232   - // markerInstance.setMap(mapIns)
233   - mapIns.add(markerInstance)
  230 + // 原作者这种方式添加,属于JS API 1.4.8版本的
  231 + markers.push(markerInstance)
  232 + markerInstance.setMap(mapIns)
  233 + // mapIns.add(markerInstance)
234 234 mapClick(markerInstance, markerItem)
235 235 })
236 236 } else if (mapMarkerType.value === MarkerEnum.CIRCLE_MARKER) {
... ... @@ -288,18 +288,23 @@ useChartDataFetch(props.chartConfig, useChartEditStore, (newData: any) => {
288 288
289 289 <style>
290 290 /**去除高德地图原生弹窗 */
291   -.amap-info-outer, .amap-menu-outer {
292   - box-shadow: 0 1px 2px rgba(0,0,0,0)!important;
  291 +.amap-info-outer,
  292 +.amap-menu-outer {
  293 + box-shadow: 0 1px 2px rgba(0, 0, 0, 0) !important;
293 294 }
  295 +
294 296 .amap-info-outer {
295 297 background-color: rgba(0, 0, 0, 0) !important;
296 298 }
  299 +
297 300 .amap-info-close {
298 301 display: none !important;
299 302 }
  303 +
300 304 .amap-info-content {
301 305 overflow: hidden !important;
302 306 }
  307 +
303 308 /**去除高德地图原生弹窗*/
304 309 .amap-info-content .go-border-box {
305 310 position: absolute;
... ... @@ -307,6 +312,7 @@ useChartDataFetch(props.chartConfig, useChartEditStore, (newData: any) => {
307 312 top: 0;
308 313 z-index: -100;
309 314 }
  315 +
310 316 .amap-info-content .go-border-box svg {
311 317 background-color: v-bind(bgColor);
312 318 }
... ... @@ -314,6 +320,7 @@ useChartDataFetch(props.chartConfig, useChartEditStore, (newData: any) => {
314 320 <style lang="scss" scoped>
315 321 .chart-amap {
316 322 position: relative;
  323 +
317 324 .search-box {
318 325 cursor: pointer;
319 326 position: absolute;
... ...