jihongshun
2025-07-09 bec1a5e6532575b221b24094471fce8c814fc7ae
src/views/system/project/components/addPorjectDialog.vue
@@ -13,6 +13,7 @@
                  <!-- <el-button type="primary" @click='chooseModel'>添加设备</el-button> -->
                  <div class="fontJust">设备列表</div>
                   <el-button @click="addDevice"> 新增</el-button>
                   <el-button @click="draw"> 渲染</el-button>
                  <el-table
                    :data="tableData"
                    max-height = '180'
@@ -23,15 +24,16 @@
                      width="150">
                    </el-table-column>
                    <el-table-column
                      prop="muban"
                      prop="mode"
                      label="模板"
                      width="150">
                      width="120">
                    </el-table-column>
                    <el-table-column
                      fixed="right"
                      label="操作"
                      width="100">
                      width="130">
                      <template slot-scope="scope">
                        <el-button type="text" size="small" @click="chooseModel(scope.row)">模板</el-button>
                        <el-button type="text" size="small" @click="flyToLocal(scope.row)">定位</el-button>
                        <el-button type="text" size="small" @click="deleteData(scope.row)">移除</el-button>
                      </template>
@@ -63,28 +65,379 @@
        <el-button type="primary" @click="submit()" >生成航线任务</el-button>
      </span>
    </el-dialog>
     <chooseDeviceDialog v-if="showModel" @cancel ='cancel' @dealChooseArr="dealChooseArr" ></chooseDeviceDialog>
     <chooseDeviceDialog v-if="showDevice" @cancel ='cancel' @dealChooseArr="dealChooseArr" ></chooseDeviceDialog>
     <chooseModelDialog v-if="showModel" @cancelModel ='cancelModel' @receiveModel="receiveModel" :deviceId="deviceId"></chooseModelDialog>
  </div>
</template>
<script>
import CesiumMap from "../../../../utils/components/cesium-map.vue";
import chooseDeviceDialog from './chooseDeviceDialog.vue';
import chooseModelDialog from './chooseModelDialog.vue';
export  default{
  components: {
    CesiumMap,
    chooseDeviceDialog
    chooseDeviceDialog,
    chooseModelDialog
  },
  data(){
    return{
       dialogVisible :true,
        tableData: [],
        treeData:[],
        treeData:[
    {
        "createBy": null,
        "createTime": null,
        "updateBy": null,
        "updateTime": null,
        "remark": null,
        "id": "3c5fc76c46c54c1187ff0bbcc092194b",
        "modelId": "6257cf734cf94c7caae0dee2ac2231d1",
        "deviceName": "设备3",
        "deviceType": null,
        "longitude": 125.01255362568844,
        "latitude": 46.40803605631184,
        "altitude": -0.029793403136164368,
        "belongingRoute": "线路3",
        "face": 30,
        "label": "设备3",
        "children": [
            {
                "id": "197ee63df18b0af0",
                "label": "地面点0",
                "longitude": 125.01254682821249,
                "latitude": 46.40803726847258,
                "height": 5.55594577349203,
                "children": [
                    {
                        "id": "197ee63df18539a3",
                        "label": "空中点1",
                        "longitude": 125.01128753149214,
                        "latitude": 46.4082612208105,
                        "height": 6.492838981926156
                    }
                ]
            },
            {
                "id": "197ee63df18cce29",
                "label": "地面点1",
                "longitude": 125.01254709729052,
                "latitude": 46.408037217374755,
                "height": 6.4920524070572645,
                "children": [
                    {
                        "id": "197ee63df18539a3",
                        "label": "空中点1",
                        "longitude": 125.01128753149214,
                        "latitude": 46.4082612208105,
                        "height": 6.492838981926156
                    }
                ]
            },
            {
                "id": "197ee63df188aa47",
                "label": "地面点2",
                "longitude": 125.01254783039168,
                "latitude": 46.408036932133236,
                "height": 7.424864167610554,
                "children": [
                    {
                        "id": "197ee63df1845bc7",
                        "label": "空中点2",
                        "longitude": 125.0112772702233,
                        "latitude": 46.40822893934041,
                        "height": 7.425650325131619
                    }
                ]
            },
            {
                "id": "197ee63df199a530",
                "label": "地面点3",
                "longitude": 125.01255933758492,
                "latitude": 46.40803691722688,
                "height": 7.424719094681872,
                "children": [
                    {
                        "id": "197ee63df1908bad",
                        "label": "空中点3",
                        "longitude": 125.0138300519516,
                        "latitude": 46.40822843553173,
                        "height": 7.425505375628057
                    }
                ]
            },
            {
                "id": "197ee63df198ebdf",
                "label": "地面点4",
                "longitude": 125.01256021566009,
                "latitude": 46.408036958116895,
                "height": 6.454013013927198,
                "children": [
                    {
                        "id": "197ee63df192e649",
                        "label": "空中点4",
                        "longitude": 125.0138360193498,
                        "latitude": 46.40821153783117,
                        "height": 6.454799694246353
                    }
                ]
            },
            {
                "id": "197ee63df1989863",
                "label": "地面点5",
                "longitude": 125.01256037655455,
                "latitude": 46.40803705402738,
                "height": 5.5173191358810305,
                "children": [
                    {
                        "id": "197ee63df19fb1cb",
                        "label": "空中点5",
                        "longitude": 125.01384789553899,
                        "latitude": 46.408163891976834,
                        "height": 6.023658449094137
                    }
                ]
            }
        ]
    },
    {
        "createBy": null,
        "createTime": null,
        "updateBy": null,
        "updateTime": null,
        "remark": null,
        "id": "5d7c595466094e369c6ed9fdcab6ba50",
        "modelId": "416a0c3361a9409495623eff5c19fb41",
        "deviceName": "设备2",
        "deviceType": null,
        "longitude": 124.98495711631958,
        "latitude": 46.60913669289758,
        "altitude": -0.010649270561847658,
        "belongingRoute": "线路2",
        "face": 30,
        "label": "设备2",
        "children": [
    {
        "id": "197ee6746f64a423",
        "label": "地面点0",
        "longitude": 124.98496378621228,
        "latitude": 46.60913556199556,
        "height": 5.517188951102072,
        "children": [
            {
                "id": "197ee6746f74e23a",
                "label": "空中点0",
                "longitude": 124.98623131325654,
                "latitude": 46.60892064074182,
                "height": 5.517975962983238
            }
        ]
    },
    {
        "id": "197ee6746f7d5cbb",
        "label": "地面点1",
        "longitude": 124.98496380688303,
        "latitude": 46.609135777787124,
        "height": 6.454174518781066,
        "children": [
            {
                "id": "197ee6746f76d1f7",
                "label": "空中点1",
                "longitude": 124.98624416031694,
                "latitude": 46.60896064802085,
                "height": 6.454961413485681
            }
        ]
    },
    {
        "id": "197ee6746f7f75d3",
        "label": "地面点2",
        "longitude": 124.9849627026509,
        "latitude": 46.6091358190698,
        "height": 7.4247849395402445,
        "children": [
            {
                "id": "197ee6746f7bd9af",
                "label": "空中点2",
                "longitude": 124.98623564998626,
                "latitude": 46.608936693647046,
                "height": 7.425571052201786
            }
        ]
    },
    {
        "id": "197ee6746f786c30",
        "label": "地面点3",
        "longitude": 124.98495139129277,
        "latitude": 46.609136202860036,
        "height": 7.385436810668997,
        "children": [
            {
                "id": "197ee6746f7220cc",
                "label": "空中点3",
                "longitude": 124.98365601680429,
                "latitude": 46.60902531680706,
                "height": 7.386222783506121
            }
        ]
    },
    {
        "id": "197ee6746f70eac7",
        "label": "地面点4",
        "longitude": 124.98495046384257,
        "latitude": 46.6091358802505,
        "height": 6.453950090508963,
        "children": [
            {
                "id": "197ee6746f74dd82",
                "label": "空中点4",
                "longitude": 124.98366517250753,
                "latitude": 46.60897886511559,
                "height": 6.4547368247826675
            }
        ]
    },
    {
        "id": "197ee6746f7ac599",
        "label": "地面点5",
        "longitude": 124.984950334958,
        "latitude": 46.609135834916806,
        "height": 5.516518597126235,
        "children": [
            {
                "id": "197ee6746f7220cc",
                "label": "空中点3",
                "longitude": 124.98365601680429,
                "latitude": 46.60902531680706,
                "height": 7.386222783506121
            }
        ]
    }
]
    },
    {
        "createBy": null,
        "createTime": null,
        "updateBy": null,
        "updateTime": null,
        "remark": null,
        "id": "f796896ac1c445c183456c500502bef0",
        "modelId": "1bd29eedeaaf4a3da83212fbb1793fd5",
        "deviceName": "设备1",
        "deviceType": null,
        "longitude": 125.14336018333184,
        "latitude": 46.558980802047344,
        "altitude": -0.0019061848373990704,
        "belongingRoute": "线路1",
        "face": 60,
        "label": "设备1",
        "children": [
    {
        "id": "197ee65dac710766",
        "label": "地面点0",
        "longitude": 125.14335344347126,
        "latitude": 46.55898205916312,
        "height": 5.556756800574575,
        "children": [
            {
                "id": "197ee65dac75edbb",
                "label": "空中点0",
                "longitude": 125.14209452120562,
                "latitude": 46.55921686479333,
                "height": 5.557543680589247
            }
        ]
    },
    {
        "id": "197ee65dac76a522",
        "label": "地面点1",
        "longitude": 125.14335363213557,
        "latitude": 46.55898182607255,
        "height": 6.651683951645225,
        "children": [
            {
                "id": "197ee65dac772525",
                "label": "空中点2",
                "longitude": 125.14208232214659,
                "latitude": 46.559179705774746,
                "height": 7.425743074154034
            }
        ]
    },
    {
        "id": "197ee65dac712c69",
        "label": "地面点2",
        "longitude": 125.14335446603941,
        "latitude": 46.55898169199969,
        "height": 7.424957062075383,
        "children": [
            {
                "id": "197ee65dac772525",
                "label": "空中点2",
                "longitude": 125.14208232214659,
                "latitude": 46.559179705774746,
                "height": 7.425743074154034
            }
        ]
    },
    {
        "id": "197ee65dac7d469a",
        "label": "地面点3",
        "longitude": 125.14336581328187,
        "latitude": 46.55898112552418,
        "height": 7.385369522508276,
        "children": [
            {
                "id": "197ee65dac74b335",
                "label": "空中点3",
                "longitude": 125.14460210993491,
                "latitude": 46.55869709406983,
                "height": 11.416007026601994
            }
        ]
    },
    {
        "id": "197ee65dac7817ff",
        "label": "地面点4",
        "longitude": 125.14336674537108,
        "latitude": 46.55898211835868,
        "height": 6.48472072335647,
        "children": [
            {
                "id": "197ee65dac7602d7",
                "label": "空中点4",
                "longitude": 125.14461900411601,
                "latitude": 46.559233306964344,
                "height": 6.485507501890941
            }
        ]
    },
    {
        "id": "197ee65dac74500d",
        "label": "地面点5",
        "longitude": 125.14336684823117,
        "latitude": 46.55898218335435,
        "height": 5.556803725040882,
        "children": [
            {
                "id": "197ee65dac7d10f5",
                "label": "空中点5",
                "longitude": 125.14464805019499,
                "latitude": 46.559149450894154,
                "height": 7.227587215704448
            }
        ]
    }
]
    }
],
        defaultProps: {
          children: 'children',
          label: 'label'
        },
        showDevice:false,
        multipleSelection: [],
        showModel:false,
        multipleSelection: []
        deviceId:null
    }
  },
  methods:{
@@ -114,18 +467,34 @@
        orientation: orientation,
        model: {
          uri: "http://192.168.1.5:9000/tower/2025/07/01/tower_20250701145739A004.glb", // 替换成你的模型路径
          scale: 1000,
          scale: 1,
        },
        label: {
          show: true,
          verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
          horizontalOrigin: Cesium.HorizontalOrigin.CENTER,
          font: '28px Helvetica',
          outlineColor: Cesium.Color.BLUE,
          outlineWidth: 3,
          fillColor: Cesium.Color.fromCssColorString('#FFFFFF'), //44c3cc
          text: row.deviceName,
          style: Cesium.LabelStyle.FILL_AND_OUTLINE,
          pixelOffset: new Cesium.Cartesian2(0.0, -56.0),
          scaleByDistance: new Cesium.NearFarScalar(1000, 0.6, 10000, 0.4),
          pixelOffsetScaleByDistance: new Cesium.NearFarScalar(1000, 0.4, 10000, 0.4),
          disableDepthTestDistance: 100000000
        }
      });
      console.log(entity)
      // 飞行到模型位置
      console.log(this.treeData)
      viewer.flyTo(entity)
    },
    addDevice(){
      this.showModel = true
      this.showDevice = true
    },
    cancel(){
      this.showModel = false
      this.showDevice = false
    },
    hasSameId(array1, array2) {
      const ids1 = new Set(array1.map(item => item.id));
@@ -148,7 +517,7 @@
        this.tableData = this.tableData.concat(arr)
      }
      const dealTreeData =this.dealTee()
      this.treeData = dealTreeData
      // this.treeData = dealTreeData
      console.log(this.treeData)
    },
    dealTee(){
@@ -167,7 +536,132 @@
        this.tableData.splice(index, 1);
      }
      const dealTreeData = this.dealTee()
      this.treeData = dealTreeData
      // this.treeData = dealTreeData
    },
    chooseModel(row){
      this.deviceId = row.id
      this.showModel = true
    },
    cancelModel(){
      this.showModel = false
    },
    receiveModel(obj){
      //deal逻辑
      console.log(obj)
      this.dealTableTemplate(obj)
      // this.dealTreeMerge(obj)
    },
    dealTableTemplate(obj){
      const target = this.tableData.find(item => item.id === obj.deviceId)
      if (target) {
        this.$set(target, 'mode', obj.modelObj.name) // ✅ Vue2 需要使用 $set 以确保响应式
      }
    },
    dealTreeMerge(obj){
      let newChildrenData= [
        { id: 100, label: '新子节点A',children:[{id: 1001,label: '新子节点A-1'}]},
        { id: 101, label: '新子节点B' }
      ]
      this.treeData.forEach(item => {
        if(item.id == obj.deviceId) {
          // 替换第一层每个节点的 children
          this.$set(item, 'children', JSON.parse(JSON.stringify(newChildrenData)));
        }
      });
    },
    drawConnectionsWithLabels(devices) {
      const airPoints = [];
      devices.forEach(device => {
        if (!Array.isArray(device.children)) return;
        device.children.forEach(groundPoint => {
          console.log(groundPoint)
          const groundPos = Cesium.Cartesian3.fromDegrees(
            groundPoint.longitude,
            groundPoint.latitude,
            groundPoint.height
          );
          // ✅ 地面点:添加实体 + label
          viewer.entities.add({
            position: groundPos,
            point: {
              pixelSize: 6,
              color: Cesium.Color.BLUE
            },
            label: {
              text: groundPoint.label || '',
              font: '14px sans-serif',
              fillColor: Cesium.Color.WHITE,
              style: Cesium.LabelStyle.FILL_AND_OUTLINE,
              outlineWidth: 2,
              outlineColor: Cesium.Color.BLACK,
              verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
              pixelOffset: new Cesium.Cartesian2(0, -12)
            }
          });
          // 遍历空中点
          if (Array.isArray(groundPoint.children)) {
            groundPoint.children.forEach(airPoint => {
              console.log(airPos)
              const airPos = Cesium.Cartesian3.fromDegrees(
                airPoint.longitude,
                airPoint.latitude,
                airPoint.height
              );
              // ✅ 空中点:添加实体 + label
              viewer.entities.add({
                position: airPos,
                point: {
                  pixelSize: 6,
                  color: Cesium.Color.YELLOW
                },
                label: {
                  text: airPoint.label || '',
                  font: '14px sans-serif',
                  fillColor: Cesium.Color.YELLOW,
                  style: Cesium.LabelStyle.FILL_AND_OUTLINE,
                  outlineWidth: 2,
                  outlineColor: Cesium.Color.BLACK,
                  verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
                  pixelOffset: new Cesium.Cartesian2(0, -12)
                }
              });
              // ✅ 地面点 ➜ 空中点 蓝色虚线
              viewer.entities.add({
                polyline: {
                  positions: [groundPos, airPos],
                  width: 2,
                  material: new Cesium.PolylineDashMaterialProperty({
                    color: Cesium.Color.BLUE,
                    dashLength: 8
                  })
                }
              });
              airPoints.push(airPos);
            });
          }
        });
      });
      // ✅ 所有空中点 ➜ 黄色实线连接
      if (airPoints.length > 1) {
        viewer.entities.add({
          polyline: {
            positions: airPoints,
            width: 3,
            material: Cesium.Color.YELLOW
          }
        });
      }
    },
    draw(){
      this.drawConnectionsWithLabels(this.treeData)
    }
  }
}