智慧园区前端大屏
linwe
2024-11-13 9ee3f349fbbcaeed2694a46744fe14862ed09d7c
企业应急空间优化,三道防线优化
10 files modified
827 ■■■■■ changed files
src/pages/layout/components/scomponents/layersControl.vue 136 ●●●●● patch | view | raw | blame | history
src/views/companyInfo/components/box/dataContent.vue 251 ●●●● patch | view | raw | blame | history
src/views/companyInfo/components/box/fireTrend.vue 15 ●●●●● patch | view | raw | blame | history
src/views/companyInfo/components/box/occurStatistics.vue 160 ●●●●● patch | view | raw | blame | history
src/views/companyInfo/components/box/unitContent.vue 160 ●●●●● patch | view | raw | blame | history
src/views/companyInfo/components/leftContainer.vue 45 ●●●● patch | view | raw | blame | history
src/views/companyInfo/components/mainMenu.vue 16 ●●●●● patch | view | raw | blame | history
src/views/companyInfo/components/rightContainer.vue 4 ●●●● patch | view | raw | blame | history
src/views/companyInfo/index.vue 2 ●●● patch | view | raw | blame | history
src/views/space/components/box/dataContent.vue 38 ●●●● patch | view | raw | blame | history
src/pages/layout/components/scomponents/layersControl.vue
@@ -558,141 +558,11 @@
  handleCheckChange(data.filter(i => indexPoint.value.includes(i.id)))
})
const sharedData = computed(() => pointStore.sharedData);
//
watch(sharedData, (newValue) => {
  let companyInfo = JSON.parse(localStorage.getItem('companyInfo'))
// const sharedData = computed(() => pointStore.sharedData);
// watch(sharedData, (newValue) => {
// });
  if (newValue === '1') {
    // 处理切换了应急空间页面,把图标隐藏
    if (indexPoint.value.includes('3')) {
      let allList = data.filter(i => indexPoint.value.includes(i.id))
      let temp = indexPoint.value.filter(ie => ie != '3')
      // console.log(temp, '***************************************')
      let checkList = data.filter(i => temp.includes(i.id))
      treeRef.value?.setCheckedNodes(checkList)
      handleCheckChangeTwo(allList, companyInfo.id)
    }
    return
  }
  // 处理切换到应急空间页面,把图标显示
  console.log('sharedData changed to:', newValue);
  // 获取缓存里面的企业id
  indexPoint.value.includes(newValue) ? '' : indexPoint.value.push(newValue)
  let checkList = data.filter(i => indexPoint.value.includes(i.id))
  treeRef.value?.setCheckedNodes(checkList)
  handleCheckChangeTwo(checkList, companyInfo.id)
});
const handleCheckChangeTwo = (data, firmId) => {
  let options = treeRef.value?.getCheckedNodes()
  // console.log(options, "*************222222***********")
  collectedNodes.value = []
  collectNodesWithFlag(data)
  collectedNodes.value.forEach(item => {
    let layerName = item.layerName + '_' + firmId
    console.log(layerName, "**************************************")
    if (options.some(i => i.id == item.id)) {
      if (item.subType == 'labelPoint') {
        if (!addTileLayers[layerName]) {
          addTileLayers[layerName] = new DC.HtmlLayer(addTileLayers[layerName])
          window.$viewer.addLayer(addTileLayers[layerName])
          let params = { ...item.params }
          params.firmId = firmId
          item.method(params).then(res => {
            let data = res.data.data.records
            data.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>${i[item.showParams] || i.name}</div>
                </div>`
              }
              let divIcon = new DC.DivIcon(
                new DC.Position(i.lng, i.lat, 0),
                `<div class="public-map-popup">
                    ${iconEl}
                  </div>`
              )
              addTileLayers[layerName].addOverlay(divIcon)
            })
          })
        } else {
          addTileLayers[layerName].show = true
        }
      }
    } else {
      if (addTileLayers[layerName]) {
        if (item.subType == 'labelPoint') {
          addTileLayers[layerName].show = false
        }
      }
    }
  })
}
// const handleCheckChangeTwo = (data, firmId) => {
//   let options = treeRef.value?.getCheckedNodes()
//   console.log(options, "*************222222***********")
//   collectedNodes.value = []
//   collectNodesWithFlag(data)
//   collectedNodes.value.forEach(item => {
//     if (options.some(i => i.id == item.id)) {
//       if (item.subType == 'labelPoint') {
//         if (!addTileLayers[item.layerName]) {
//           addTileLayers[item.layerName] = new DC.HtmlLayer(addTileLayers[item.layerName])
//           window.$viewer.addLayer(addTileLayers[item.layerName])
//           let params = { ...item.params }
//           params.firmId = firmId
//           item.method(params).then(res => {
//             let data = res.data.data.records
//             data.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>${i[item.showParams] || i.name}</div>
//                 </div>`
//               }
//               let divIcon = new DC.DivIcon(
//                 new DC.Position(i.lng, i.lat, 0),
//                 `<div class="public-map-popup">
//                     ${iconEl}
//                   </div>`
//               )
//               addTileLayers[item.layerName].addOverlay(divIcon)
//             })
//           })
//         } else {
//           addTileLayers[item.layerName].show = true
//         }
//       }
//     } else {
//       if (addTileLayers[item.layerName]) {
//         if (item.subType == 'labelPoint') {
//           addTileLayers[item.layerName].show = false
//         }
//       }
//     }
//   })
// }
onUnmounted(() => {
  tileLayers && window.$viewer.removeLayer(tileLayers)
src/views/companyInfo/components/box/dataContent.vue
@@ -1,139 +1,160 @@
<!--
 * @Author: shuishen 1109946754@qq.com
 * @Date: 2023-03-13 14:54:26
 * @Date: 2023-03-10 15:27:59
 * @LastEditors: shuishen 1109946754@qq.com
 * @LastEditTime: 2023-03-13 15:00:55
 * @FilePath: \forest-fire\src\views\statistics\components\box\dataContent.vue
 * @Description:
 *
 * Copyright (c) 2023 by ${git_name_email}, All Rights Reserved.
 * @LastEditTime: 2024-11-12 18:10:32
 * @FilePath: \bigScreen\src\views\space\components\leftContainer.vue
 * @Description:
 *
 * Copyright (c) 2023 by ${git_name_email}, All Rights Reserved.
-->
<script setup>
import publicContent from './publicContent.vue'
const fxy = () => {
    if (state.layer) {
        console.log("***************************")
        window.$viewer.removeLayer(state.layer)
import { getList } from "@/api/space/space"
import { onUnmounted, reactive } from 'vue'
const resData = reactive({
    data: [{
        label: '防线一',
        value: '1',
        type: 1,
        remark: '防火提及配套设置、装置围堰、罐区围堰'
    }, {
        label: '防线二',
        value: '2',
        type: 1,
        remark: '雨污水排口一体化闸阀、车间收集池、雨污管阀'
    },
    {
        label: '防线三',
        value: '3',
        type: 1,
        remark: '事故应急池、雨水收集池'
    }
    let layer = new DC.VectorLayer(`${row.id}`)
    state.layer = layer
    window.$viewer.addLayer(layer)
    let material = new DC.PolylineDashMaterialProperty({
        color: DC.Color.ORANGE
    ]
})
const curSelect = ref('1')
let addTileLayers = {}
const handleCheckChange = (row) => {
    let companyInfo = JSON.parse(localStorage.getItem('companyInfo'))
    console.log(row)
    resData.data.forEach(item => {
        if (row.value === item.value) {
            if (!addTileLayers[item.label]) {
                addTileLayers[item.label] = new DC.HtmlLayer(item.label)
                window.$viewer.addLayer(addTileLayers[item.label])
                getList({
                    firmId: companyInfo.id,
                    size: 1000,
                    type: item.type,
                }).then(res => {
                    let data = res.data.data.records
                    data.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>${item.remark}</div>  </div>`
                        }
                        let divIcon = new DC.DivIcon(
                            new DC.Position(i.lng, i.lat, 0),
                            `<div class="public-map-popup">
                    ${iconEl}
                  </div>`
                        )
                        divIcon.attrParams = i
                        let incident = () => { }
                        if (item.incident) incident = item.incident
                        divIcon.on(DC.MouseEventType.CLICK, incident)
                        addTileLayers[item.label].addOverlay(divIcon)
                    })
                })
            } else {
                addTileLayers[item.label].show = true
            }
        } else {
            if (addTileLayers[item.label]) {
                addTileLayers[item.label].show = false
            }
        }
    })
    let item = new DC.Position(row.lng, row.lat, 100)
    let label = new DC.CustomLabel(
        item,
        row.name
    )
    label.setStyle({
        fillColor: DC.Color.YELLOW,
        font: '12px',
        pixelOffset: { x: 0, y: -10 },
    })
    label.setVLine({
        width: 2,
        material
    })
    layer.addOverlay(label)
}
const fxe = () => {
    if (state.layer) {
        console.log("***************************")
        window.$viewer.removeLayer(state.layer)
    }
    let layer = new DC.VectorLayer(`${row.id}`)
    state.layer = layer
    window.$viewer.addLayer(layer)
    let material = new DC.PolylineDashMaterialProperty({
        color: DC.Color.ORANGE
    })
    let item = new DC.Position(row.lng, row.lat, 100)
    let label = new DC.CustomLabel(
        item,
        row.name
    )
    label.setStyle({
        fillColor: DC.Color.YELLOW,
        font: '12px',
        pixelOffset: { x: 0, y: -10 },
    })
    label.setVLine({
        width: 2,
        material
    })
    layer.addOverlay(label)
const tabClick = (item) => {
    handleCheckChange(item)
    curSelect.value = item.value
}
const fxs = () => {
    if (state.layer) {
        console.log("***************************")
        window.$viewer.removeLayer(state.layer)
const showOn = computed(() => (item) => {
    if (curSelect.value == item.value) {
        return true
    }
    let layer = new DC.VectorLayer(`${row.id}`)
    state.layer = layer
    window.$viewer.addLayer(layer)
    let material = new DC.PolylineDashMaterialProperty({
        color: DC.Color.ORANGE
    return false
})
onMounted(() => {
    tabClick(resData.data[0])
}),
    onUnmounted(() => {
        let arr = Object.keys(addTileLayers)
        arr.forEach(i => {
            addTileLayers[i] && window.$viewer.removeLayer(addTileLayers[i])
        })
    })
    let item = new DC.Position(row.lng, row.lat, 100)
    let label = new DC.CustomLabel(
        item,
        row.name
    )
    label.setStyle({
        fillColor: DC.Color.YELLOW,
        font: '12px',
        pixelOffset: { x: 0, y: -10 },
    })
    label.setVLine({
        width: 2,
        material
    })
    layer.addOverlay(label)
}
</script>
<template>
    <public-content>
        <template #content>
            <div class="data-content">
                <ul>
                    <li @click="fxy">防线一</li>
                    <li @click="fxe">防线二</li>
                    <li @click="fxs">防线三</li>
                </ul>
    <div class="left-container cur-container">
        <div class="tablist h100">
            <div class="cursor-p" :class="{ on: showOn(item) }" v-for="item, index in resData.data" :key="index"
                @click="tabClick(item)">
                <div class="nowrap-ellipsis-hidden">
                    {{ item.label }}
                </div>
            </div>
        </template>
    </public-content>
        </div>
    </div>
</template>
<style lang="scss" scoped>
.data-content {
    color: #fff;
}
.cur-container {
    background: transparent;
    pointer-events: none;
.data-content>ul {
    margin-top: 90px;
    margin-left: 90px;
}
    .tablist {
        pointer-events: all;
.data-content>ul>li {
    display: block;
    color: #000;
    margin-top: 160px;
    background-color: #fff;
    width: 60px;
    height: 60px;
    line-height: 60px;
    text-align: center;
    border-radius: 50%;
        &>div {
            margin-top: 86px;
            padding: 10px;
            width: 64px;
            height: 64px;
            line-height: 64px;
            text-align: center;
            border-radius: 50%;
            box-shadow: inset 0 0 40px #409eff;
            color: #fff;
            box-sizing: content-box;
            &.on {
                position: relative;
                color: #75b1ff;
            }
        }
    }
}
</style>
</style>
src/views/companyInfo/components/box/fireTrend.vue
@@ -115,18 +115,13 @@
      </el-form-item>
    </el-form>
    <div class="table-box">
      <el-table :data="tableData" style="width: 100%" :header-cell-style="headerCellStyle" :cell-style="tableCellStyle"
        v-loading="loading" element-loading-background="rgba(122, 122, 122, 0.1)">
        <el-table-column fixed prop="name" label="名称" />
        <el-table-column prop="numUnit" label="数量" width="100" />
        <!-- <el-table-column prop="firmName" label="单位名称" /> -->
        <el-table-column prop="personInCha" label="负责人" width="100" />
      <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="numUnit" label="数量" />
        <el-table-column prop="personInCha" label="负责人" />
      </el-table>
    </div>
    <!-- <div class="el-page">
      <el-pagination background layout="prev, pager, next" :page-size="pages.pageSize" :total="pages.total"
        @size-change="handleSizeChange" @current-change="handleCurrentChange" />
    </div> -->
  </div>
</template>
src/views/companyInfo/components/box/occurStatistics.vue
@@ -30,169 +30,13 @@
  data.companyInfo = JSON.parse(localStorage.getItem('companyInfo'))
  getLists()
})
// 表格样式
const tableCellStyle = ({ row, column }) => {
  return { background: "#152851", color: "#fff" }
}
// 表格表头样式
const headerCellStyle = ({ }) => {
  return {
    background: "#152851",
    color: "#fff",
  }
}
// 搜索条件
const formInline = reactive({
  perInCha: "",
  type: ''
})
// 提交查询
const onSubmit = () => {
  pages.page = 1
  pages.pageSize = 13
  pages.total = 0
  console.log("submit!")
  getLists(formInline)
}
// 分页树改变
const handleSizeChange = (val) => {
  pages.pageSize = val
  getLists(formInline)
}
// 分页改变
const handleCurrentChange = (val) => {
  pages.page = val
  getLists(formInline)
}
// 重置条件
const clearBtn = () => {
  formInline.perInCha = ''
  formInline.type = ''
  pages.page = 1
  pages.pageSize = 13
  pages.total = 0
  getLists(formInline)
}
// 查询分页数据
function getLists (param = {}) {
  param.current = pages.page
  param.size = pages.pageSize
  param.firmId = data.companyInfo.id
  loading.value = true
  getList(param)
    .then((res) => {
      const data = res.data.data
      data.records.forEach((element) => {
        if (element.type == 1) {
          element.ownership = "园区"
        } else {
          element.ownership = "企业"
        }
      })
      tableData.value = data.records
      pages.total = data.total
      loading.value = false
    })
    .catch((err) => {
      loading.value = false
      console.log(err)
    })
}
</script>
<template>
  <div class="search-box">
    <el-form :inline="true" :model="formInline" class="demo-form-inline">
      <el-form-item label="" class="form-item-input">
        <el-input v-model="formInline.perInCha" placeholder="请输入姓名" clearable style="width: 120px" />
      </el-form-item>
      <!-- <el-form-item label="归属">
                        <el-select v-model="formInline.type" placeholder="请选择" clearable style="width: 120px">
                            <el-option label="园区" value="1" />
                            <el-option label="企业" value="2" />
                        </el-select>
                    </el-form-item> -->
      <el-form-item class="search-btn">
        <el-button type="primary" @click="onSubmit">查询</el-button>
        <el-button type="primary" @click="clearBtn">重置</el-button>
      </el-form-item>
    </el-form>
    <el-table :data="tableData" style="width: 100%" :header-cell-style="headerCellStyle" :cell-style="tableCellStyle"
      v-loading="loading" element-loading-background="rgba(122, 122, 122, 0.1)">
      <el-table-column fixed prop="perInCha" label="责任人姓名" />
      <el-table-column prop="perInChaPho" label="联系电话" />
      <!-- <el-table-column prop="firmName" label="单位名称" /> -->
      <el-table-column prop="perInCha" label="负责人" width="100" />
    </el-table>
    <div class="el-page">
      <el-pagination background layout="prev, pager, next" :page-size="pages.pageSize" :total="pages.total"
        @size-change="handleSizeChange" @current-change="handleCurrentChange" />
    </div>
    1111111111111111
  </div>
</template>
<style lang="scss" scoped>
.el-form-item__label {
  color: #fff !important;
}
/* 当表格没有数据时,修改表格的背景颜色 */
.el-table--empty .el-table__body {
  background-color: #19284e !important;
  /* 你想要的背景颜色 */
}
.search-box {
  padding: 10px;
  ::v-deep .el-table__body-wrapper {
    background-color: #152851;
  }
}
.el-page {
  margin-top: 10px;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  // margin-bottom:10px;
}
.form-item-input {
  width: 160px;
  ::v-deep(.el-input) {
    width: 0;
    flex: 1;
    .el-input__wrapper {
      font-size: 16px;
      font-weight: 400;
      border-radius: 0;
      background: rgba(135, 158, 199, 0.3);
      box-shadow: inset 0px 3px 7px 0px rgba(42, 138, 236, 0.95);
      .el-input__inner {
        color: #BFD3E5;
      }
    }
  }
}
.search-btn {
  ::v-deep .el-button--primary {
    background-color: transparent;
    border-color: none;
    border: none;
    cursor: pointer;
    color: #edffff;
    background: rgba(135, 158, 199, 0.3);
    box-shadow: inset 0px 3px 7px 0px rgba(42, 138, 236, 0.95);
  }
}
</style>
<style lang="scss" scoped></style>
src/views/companyInfo/components/box/unitContent.vue
@@ -1,25 +1,163 @@
<!--
 * @Author: shuishen 1109946754@qq.com
 * @Date: 2023-03-13 14:54:26
 * @Date: 2023-03-10 15:27:59
 * @LastEditors: shuishen 1109946754@qq.com
 * @LastEditTime: 2023-03-13 15:00:55
 * @FilePath: \forest-fire\src\views\statistics\components\box\dataContent.vue
 * @LastEditTime: 2024-11-12 18:10:32
 * @FilePath: \bigScreen\src\views\space\components\leftContainer.vue
 * @Description: 
 * 
 * Copyright (c) 2023 by ${git_name_email}, All Rights Reserved. 
-->
<script setup>
import publicContent from './publicContent.vue'
import EventBus from 'utils/bus'
import { getDictionary } from "@/api/dict/dict"
import { onUnmounted, reactive } from 'vue'
import { getList } from "@/api/space/space"
const resData = reactive({
    data: []
})
const curSelect = ref('')
let addTileLayers = {}
const handleCheckChange = (row) => {
    let companyInfo = JSON.parse(localStorage.getItem('companyInfo'))
    resData.data.forEach(item => {
        if (row.value == item.value) {
            if (!addTileLayers[item.label]) {
                addTileLayers[item.label] = new DC.HtmlLayer(item.label)
                window.$viewer.addLayer(addTileLayers[item.label])
                getList({
                    firmId: companyInfo.id,
                    size: 1000,
                    type: item.type,
                }).then(res => {
                    let data = res.data.data.records
                    data.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>${i.name}</div>
                </div>`
                        }
                        let divIcon = new DC.DivIcon(
                            new DC.Position(i.lng, i.lat, 0),
                            `<div class="public-map-popup">
                    ${iconEl}
                  </div>`
                        )
                        divIcon.attrParams = i
                        let incident = () => { }
                        if (item.incident) incident = item.incident
                        divIcon.on(DC.MouseEventType.CLICK, incident)
                        addTileLayers[item.label].addOverlay(divIcon)
                    })
                })
            } else {
                addTileLayers[item.label].show = true
            }
        } else {
            if (addTileLayers[item.label]) {
                addTileLayers[item.label].show = false
            }
        }
    })
}
// 获取下拉字典
const getDictData = (code) => {
    const param = {
        code: code,
    }
    getDictionary(param).then((res) => {
        resData.data = res.data.data.map(item => {
            return {
                type: item.sort,
                label: item.dictValue,
                value: item.dictKey
            }
        })
        tabClick(resData.data[0])
    })
}
const tabClick = (item) => {
    handleCheckChange(item)
    curSelect.value = item.value
}
const showOn = computed(() => (item) => {
    if (curSelect.value == item.value) {
        return true
    }
    return false
})
getDictData("emergency_space_type")
onUnmounted(() => {
    let arr = Object.keys(addTileLayers)
    arr.forEach(i => {
        addTileLayers[i] && window.$viewer.removeLayer(addTileLayers[i])
    })
})
</script>
<template>
    <public-content>
        <template #content>
            <div>
    <div class="left-container cur-container">
        <div class="tablist h100">
            <div class="cursor-p" :class="{ on: showOn(item) }" v-for="item, index in resData.data" :key="index"
                @click="tabClick(item)">
                <div class="nowrap-ellipsis-hidden">
                    {{ item.label }}
                </div>
            </div>
        </template>
    </public-content>
        </div>
    </div>
</template>
<style lang="scss" scoped></style>
<style lang="scss" scoped>
.cur-container {
    background: transparent;
    pointer-events: none;
    .tablist {
        pointer-events: all;
        &>div {
            margin-top: 16px;
            padding: 10px;
            width: 64px;
            height: 64px;
            line-height: 64px;
            text-align: center;
            border-radius: 50%;
            box-shadow: inset 0 0 40px #409eff;
            color: #fff;
            box-sizing: content-box;
            &.on {
                position: relative;
                color: #75b1ff;
            }
        }
    }
}
</style>
src/views/companyInfo/components/leftContainer.vue
@@ -12,27 +12,38 @@
import dataContent from './box/dataContent.vue'
import unitContent from './box/unitContent.vue'
import fireContent from './box/fireContent.vue'
let state = defineProps({
  buttonIndex: {
    type: Number,
    default: 1
  }
})
</script>
<template>
  <div class="left-container">
    <div class="data box">
    <div class="unit box" v-if="state.buttonIndex == 3">
      <title-box>
        <template #titleName>
          <!-- 数据概览 -->
          <!-- 应急空间 -->
        </template>
      </title-box>
      <unit-content></unit-content>
    </div>
    <div class="data box" v-if="state.buttonIndex == 4">
      <title-box>
        <template #titleName>
          <!-- 三道防线 -->
        </template>
      </title-box>
      <data-content></data-content>
    </div>
    <!-- <div class="unit box">
      <title-box>
        <template #titleName>
          入住单位统计
        </template>
      </title-box>
      <unit-content></unit-content>
    </div> -->
    <!-- <div class="fire box">
      <title-box>
@@ -45,4 +56,16 @@
  </div>
</template>
<style lang="scss" scoped></style>
<style lang="scss" scoped>
.left-container {
  display: flex;
  flex-direction: column;
  position: absolute;
  top: 0;
  left: 0;
  width: 100px;
  height: 100%;
  pointer-events: auto;
  // background: rgba(28, 115, 195, 0.2);
}
</style>
src/views/companyInfo/components/mainMenu.vue
@@ -21,22 +21,18 @@
  [
    {
      menuName: '企业信息',
      path: '/layout/sub/companyInfo',
      value: 1,
    },
    {
      menuName: '应急物质',
      path: '/layout/sub/',
      value: 2,
    },
    {
      menuName: '应急空间',
      path: '/layout/ws',
      value: 3,
    },
    {
      menuName: '三道防线',
      path: '/layout/sj',
      value: 4,
    }
  ]
@@ -50,29 +46,17 @@
const goToPath = (params) => {
  if (params.value == 1) {
   useAppStore.updateSharedData('1')
    emit('childEvent', params.value)
    return
  } else if (params.value == 2) {
   useAppStore.updateSharedData('1')
    emit('childEvent', params.value)
    return
  } else if (params.value == 3) {
   useAppStore.updateSharedData('3')
    emit('childEvent', params.value)
    return
  } else if (params.value == 4) {
   useAppStore.updateSharedData('1')
    emit('childEvent', params.value)
    return
  }
  if (params.children && params.children.length > 0) return
  if (params.path) {
    if (router.currentRoute.value.path == params.path) return
    // router.push(params.path)
  } else {
    params.childrenFlag = !params.childrenFlag
  }
}
src/views/companyInfo/components/rightContainer.vue
@@ -58,7 +58,7 @@
      </div>
    </div>
    <div class="fire-trend box" v-if="state.buttonIndex == 3">
    <!-- <div class="fire-trend box" >
      <title-box>
        <template #titleName>
          救援队伍
@@ -67,7 +67,7 @@
      <div class="content-box">
        <occur-statistics></occur-statistics>
      </div>
    </div>
    </div> -->
  </div>
</template>
src/views/companyInfo/index.vue
@@ -63,7 +63,7 @@
    <div class="main-header">
      <centerContainer :button-index="buttonIndex" @childEvent="handleChildEvent"></centerContainer>
    </div>
    <div class="main-container" v-if="buttonIndex == 4">
    <div class="main-container">
      <left-container :button-index="buttonIndex"></left-container>
    </div>
src/views/space/components/box/dataContent.vue
@@ -114,26 +114,24 @@
// 行点击
function rowClick(row) {
  if (state.layer) {
    window.$viewer.removeLayer(state.layer)
  }
  let layer = new DC.HtmlLayer(`${row.id}`)
  state.layer = layer
  window.$viewer.addLayer(layer)
  let iconEl = `<div class="marsBlueGradientPnl">
                  <div>${row.name}</div>
                </div>`
  let divIcon = new DC.DivIcon(
    new DC.Position(row.lng, row.lat, 0),
    `<div class="public-map-popup">
                    ${iconEl}
                  </div>`
  )
  // divIcon.attrParams = row
  let incident = () => { }
  // if (item.incident) incident = item.incident
  divIcon.on(DC.MouseEventType.CLICK, incident)
  layer.addOverlay(divIcon)
  // if (state.layer) {
  //   window.$viewer.removeLayer(state.layer)
  // }
  // let layer = new DC.HtmlLayer(`${row.id}`)
  // state.layer = layer
  // window.$viewer.addLayer(layer)
  // let iconEl = `<div class="marsBlueGradientPnl">
  //                 <div>${row.name}</div>
  //               </div>`
  // let divIcon = new DC.DivIcon(
  //   new DC.Position(row.lng, row.lat, 0),
  //   `<div class="public-map-popup">
  //                   ${iconEl}
  //                 </div>`
  // )
  // let incident = () => { }
  // divIcon.on(DC.MouseEventType.CLICK, incident)
  // layer.addOverlay(divIcon)
  window.$viewer.flyToPosition(new DC.Position(row.lng, row.lat, 600, 0, -90, 0))