航线库更新

GuLiMmo

2024-02-29 f4ad3d01ce7d22f27fb6ed88a0b4ab90658b58ca

 src/pages/page-web/projects/wayline.vue

@@ -19,6 +19,11 @@
                <SelectOutlined />
              </a-button>
            </a-upload>
            <a-button type="text" style="color: white">
              <template #icon>
                <PlusOutlined />
              </template>
            </a-button>
          </a-col>
        </a-row>
      </div>
@@ -52,7 +57,7 @@
                </a-tooltip>
                <div class="fz20 tools">
                  <span style="margin-right: 10px">
                    <EditOutlined style="font-size: 15px" @click="routeEventEdit" />
                    <EditOutlined style="font-size: 15px" @click.stop="routeEventEdit(wayline)" />
                  </span>
                  <a-dropdown>
                    <a style="color: white">
@@ -121,45 +126,26 @@
        </a-modal>
      </div>
      <!-- 航线编辑 -->
      <ul class="targt-point scrollbar" :style="{ height: height + 'px' }" v-else>
        <div class="back-btn" @click="backPage">
          <ArrowLeftOutlined />
          <span>返回上一页</span>
        </div>
        <div class="wayline-info">
          <div class="info-box" v-for="(item, index) in waylineDetails" :key="index">
            <div class="title">{{ item.title }}</div>
            <div class="info">{{ item.value }}</div>
          </div>
        </div>
        <li v-for="(item, index) in tragetPointArr" :key="index" :class="{ selectedColor: index === selectedPoint }"
          @click="tragetPointClick(item.position, index)">
          <div class="graph">
            <div class="left" :style="{
              borderTopColor: index === selectedPoint ? '#FF9900' : '#2D8CF0',
            }"></div>
            <div class="right">{{ index + 1 }}</div>
          </div>
          <div class="graph-right">
            <div v-for="(event, index) in item.eventList" :key="index" class="s-event-icon">
              <a-tooltip placement="top">
                <template #title>
                  {{ event.name }}
                </template>
                <img :src="event.icon" alt="icon" />
              </a-tooltip>
            </div>
          </div>
        </li>
      </ul>
      <div class="targt-point scrollbar" :style="{ height: height + 'px' }" v-else>
        <route-edit v-model:details="waylineDetails" @back-fn="backPage" />
      </div>
    </a-spin>
  </div>
</template>

<script lang="ts" setup>
import { reactive } from '@vue/reactivity'
import {
  PlusOutlined,
  EllipsisOutlined,
  RocketOutlined,
  CameraFilled,
  UserOutlined,
  SelectOutlined,
  EditOutlined,
} from '@ant-design/icons-vue'
import { message } from 'ant-design-vue'
import { onMounted, onUpdated, ref } from 'vue'
import { onMounted, onUpdated, reactive, ref } from 'vue'
import routeEdit from './components/route-edit/index.vue'
import ImageTrailMaterial from '/@/utils/cesium/ImageTrailMaterial'
import { getPolylineLength } from '/@/utils/cesium/mapUtils'
import {
@@ -170,15 +156,6 @@
  getWayLineFile,
} from '/@/api/wayline'
import { ELocalStorageKey, ERouterName } from '/@/types'
import {
  ArrowLeftOutlined,
  EllipsisOutlined,
  RocketOutlined,
  CameraFilled,
  UserOutlined,
  SelectOutlined,
  EditOutlined,
} from '@ant-design/icons-vue'
import { EDeviceType } from '/@/types/device'
import { useMyStore } from '/@/store'
import { WaylineFile } from '/@/types/wayline'
@@ -196,9 +173,6 @@

const getResource = (name: string) => {
  return new URL(`/src/assets/icons/${name}`, import.meta.url).href
}
const getResourceSvg = (name: string) => {
  return new URL(`/src/assets/svg/${name}`, import.meta.url).href
}

const projectWayLine = ref<HTMLDivElement>()
@@ -346,7 +320,7 @@
  }
  // removeById('entityLine')
  removeAllPoint()
  removeById('clickBox')
  // removeById('clickBox')
  store.commit('SET_WAYLINE_INFO', {
    isShow: false,
    wayline: {},
@@ -428,13 +402,17 @@
    wayline: {},
    position: null,
  })
  removeById('clickBox')
  // isPointListOpen.value = !isPointListOpen.value
}

// 编辑显示
const routeEventEdit = () => {
  isPointListOpen.value = !isPointListOpen.value
const routeEventEdit = (wayline: WaylineFile) => {
  loading.value = true
  getWayLineFile(workspaceId.value, wayline.id).then(res => {
    store.commit('SET_WAYLINE_KMZPATH', res.data)
    isPointListOpen.value = !isPointListOpen.value
    loading.value = false
  })
}

/**
@@ -462,7 +440,10 @@
    })
}

const waylineDetails = reactive([
const waylineDetails = reactive<{
  title: string,
  value: string | number
}[]>([
  {
    title: '航线长度',
    value: '0'
@@ -487,6 +468,7 @@
  const kmlEntityArr = dataSource.entities.values[0]._children
  const cartesianArr: any[] = []
  let btmStartPoint = null
  // 修改点位样式信息等
  for (let i = 0; i < kmlEntityArr.length; i++) {
    const entity = kmlEntityArr[i]
    // 将cartographic3D坐标转换为正常坐标
@@ -936,4 +918,3 @@
  background-color: #3c3c3c;
}
</style>
../../../utils/cesium/polylineImageTrailMaterial