智慧园区前端大屏
linwe
2024-11-19 940222bec16446d4b933fb7682ca4933fb520b4a
src/views/companyInfo/components/box/fireTrend.vue
@@ -101,6 +101,66 @@
      console.log(err)
    })
}
let addTileLayers = {}
// 行点击
function rowClick(row) {
  // window.$viewer.flyToPosition(new DC.Position(row.lng, row.lat, 600, 0, -90, 0))
  // return
  if (!addTileLayers[row.name]) {
    addTileLayers[row.name] = new DC.HtmlLayer(row.name)
    window.$viewer.addLayer(addTileLayers[row.name])
    // item.method(item.params).then(res => {
    // let data = res.data.data.records
    // tableData.value.filter(i => i.lng && i.lng != '' && i.lat && i.lat != '').forEach(i => {
    let iconEl = ''
    // if ('showPanel' in item && item.showPanel == false) {
    //   if (item.backgroundIcon) {
    //     iconEl = `
    //             <div class="map-name">${i[item.showParams] || i.name}</div>
    //             <div class="map-icon">
    //               <img src="${item.backgroundIcon}">
    //             </div>
    //             `
    //   }
    // } else
    {
      iconEl = `<div class="marsBlueGradientPnl">
                  <div>${row.name}</div>
                </div>`
    }
    let divIcon = new DC.DivIcon(
      new DC.Position(row.lng, row.lat, 64),
      `<div class="public-map-popup ${'sk-box'}">
                    ${iconEl}
                  </div>`
    )
    // divIcon.attrParams = i
    let incident = () => { }
    // if (item.incident) incident = item.incident
    divIcon.on(DC.MouseEventType.CLICK, incident)
    addTileLayers[row.name].addOverlay(divIcon)
    // })
    // })
  }
}
onUnmounted(() => {
  console.log('销毁***************************')
  let arr = Object.keys(addTileLayers)
  arr.forEach(i => {
    addTileLayers[i] && window.$viewer.removeLayer(addTileLayers[i])
  })
})
</script>
<template>
@@ -117,9 +177,15 @@
    <div class="table-box">
      <el-table :data="tableData" empty-text="" style="width: 100%" :header-cell-style="headerCellStyle"
        :cell-style="tableCellStyle" element-loading-background="rgba(122, 122, 122, 0.1)">
        <el-table-column prop="name" label="名称" />
        <el-table-column prop="name" label="名称" width="160" />
        <el-table-column prop="numUnit" label="数量" />
        <el-table-column prop="personInCha" label="负责人" />
        <el-table-column fixed="right" label="操作" width="80">
          <template #default="scope">
            <el-button link type="primary" size="small" :disabled="scope.row.lng == ''"
              @click="rowClick(scope.row)">定位</el-button>
          </template>
        </el-table-column>
      </el-table>
    </div>
  </div>