圆形统计、多边形统计

src/renderer/src/views/components/propertyBox/GoodsSearchCircle.vue

@@ -1,19 +1,26 @@
 <template>
-  <Dialog
+  <Dialog ref="baseDialog" title="物质统计" left="180px" top="100px" :closeCallback="closeCallBack">
-    v-if="show"
-    ref="baseDialog"
-    title="物质统计"
-    left="180px"
-    top="100px"
-    :closeCallback="closeCallBack"
-  >
     <template #content>
-      <div id="goodSearchEchart" style="width: 100%; height: 100%"></div>
+      <div id="goodSearchEchart" style="width: 650px; height: 400px"></div>
-    </template>
-    <template #footer>
-      <button>绘制</button>
     </template>
   </Dialog>
+
+  <!-- <el-dialog
+    v-model="show"
+    title="物质统计"
+    width="500"
+    draggable
+    :before-close="closeCallBack"
+    :modal="false"
+    :close-on-click-modal="false"
+  >
+    <div id="goodSearchEchart" style="width: 300px; height: 200px"></div>
+    <template #footer>
+      <div class="dialog-footer">
+        <el-button>绘制</el-button>
+      </div>
+    </template>
+  </el-dialog> -->
 </template>
 
 <script setup lang="ts">
@@ -22,32 +29,50 @@ import { inject } from 'vue'
 import { nextTick } from 'vue'
 import { ElMessage } from 'element-plus'
 import Dialog from '@/components/dialog/baseDialog.vue'
+import { MaterialApi } from '@/api/material/index'
 
 const baseDialog: any = ref(null)
 const eventBus: any = inject('bus')
-const shpTotalDict: any = reactive({
+const shpTotalDict: any = reactive(
-  shlwz_jzzp: '救灾帐篷',
+  //   {
-  mb: '棉被',
+  //   shlwz_jzzp: '救灾帐篷',
-  mymdy: '棉衣、棉大衣',
+  //   mb: '棉被',
-  mjb: '毛巾被',
+  //   mymdy: '棉衣、棉大衣',
-  mt: '毛毯',
+  //   mjb: '毛巾被',
-  dgnsd: '睡袋',
+  //   mt: '毛毯',
-  zdc: '折叠床',
+  //   dgnsd: '睡袋',
-  jycs: '简易厕所',
+  //   zdc: '折叠床',
-  xpct: '橡皮船（艇）',
+  //   jycs: '简易厕所',
-  cfz: '冲锋舟',
+  //   xpct: '橡皮船（艇）',
-  jsc: '救生船',
+  //   cfz: '冲锋舟',
-  jsy: '救生衣',
+  //   jsc: '救生船',
-  jsq: '救生圈',
+  //   jsy: '救生衣',
-  bzd: '编织袋',
+  //   jsq: '救生圈',
-  md: '麻袋',
+  //   bzd: '编织袋',
-  csb: '抽水泵',
+  //   md: '麻袋',
-  fdj: '发电机',
+  //   csb: '抽水泵',
-  yjd: '应急灯',
+  //   fdj: '发电机',
-  jzzp: '救灾帐篷',
+  //   yjd: '应急灯',
-  jzyb: '救灾衣被',
+  //   jzzp: '救灾帐篷',
-  jygj: '救援工具'
+  //   jzyb: '救灾衣被',
+  //   jygj: '救援工具'
+  // }
+  []
+)
+
+//获取物资类型
+const getResource = () => {
+  let formData = new FormData()
+  formData.append('pageNum', 1)
+  formData.append('pageSize', 10000)
+  formData.append('name', '')
+  MaterialApi.getList(formData).then((res) => {
+    shpTotalDict = res.data.data.map((item) => {
+      return item.name
     })
+  })
+}
+getResource()
 
 var draw: any = reactive([])
 
@@ -56,11 +81,10 @@ eventBus.on('goodsSearchCircleDialog', () => {
   // baseDialog.value?.open()
   draw = new YJ.Draw.DrawCircle(window.earth)
   draw.start((err, positions) => {
-    console.log('err, positions', err, positions)
     if (!err && positions.center.lng) {
-      show.value = true
+      // show.value = true
+      baseDialog.value?.open()
       let nodes = booleanOverlaps(positions)
-      console.log('goodsSearchCircle', nodes)
       renderCanvas(nodes)
     }
   })
@@ -69,11 +93,10 @@ eventBus.on('goodsSearchCircleDialog', () => {
 const open = () => {
   draw = new YJ.Draw.DrawCircle(window.earth)
   draw.start((err, positions) => {
-    console.log('err, positions', err, positions)
     if (!err && positions.center.lng) {
-      show.value = true
+      // show.value = true
+      baseDialog.value?.open()
       let nodes = booleanOverlaps(positions)
-      console.log('goodsSearchCircle', nodes)
       renderCanvas(nodes)
     }
   })
@@ -95,17 +118,14 @@ function booleanOverlaps(positions1, flag = 'circle') {
     let res = []
     types.forEach((type) => {
       let nodes = treeObj.getNodesByParam('sourceType', type, null)
-      // console.log("nodes",nodes)
       res = res.concat(nodes)
     })
     return res
   }
 
   //绘制的区域
-  // console.log("[set3Array(positions1)]", [set3Array(positions1)])
   // 获取物资处（特定的标注类型）
   let allNodes = getNode(['point', 'vr', 'picture', 'Feature'])
-  console.log('allNodes', allNodes)
   let itemInArea: any = [] //区域内的类型符合的标注
 
   for (let i = 0; i < allNodes.length; i++) {
@@ -113,7 +133,7 @@ function booleanOverlaps(positions1, flag = 'circle') {
     let getAllItemInArea = (lng, lat) => {
       if (flag == 'circle') {
         let { center, radius } = positions1
-        let distance = new YJ.Tools().randomString(center, { lng, lat })
+        let distance = new YJ.Tools().pointDistance(center, { lng, lat })
         distance < radius && itemInArea.push(item)
       } else {
         let polygon1 = (window as any).turf.polygon([set3Array(positions1)])
@@ -121,13 +141,11 @@ function booleanOverlaps(positions1, flag = 'circle') {
         ;(window as any).turf.booleanPointInPolygon(pt, polygon1) && itemInArea.push(item)
       }
     }
-    console.log(item, item.sourceType, 'ooooo')
     switch (item.sourceType) {
       case 'point':
       case 'vr':
       case 'picture':
         let params = JSON.parse(item.params)
-        console.log('params', params)
         let lng = params.position.lng
         let lat = params.position.lat
         getAllItemInArea(lng, lat)
@@ -144,8 +162,6 @@ function booleanOverlaps(positions1, flag = 'circle') {
   return itemInArea
 }
 function renderCanvas(nodes) {
-  console.log('nodes', nodes)
-
   let x: any = []
   let y: any = []
   nodes.forEach((item) => {
@@ -154,8 +170,10 @@ function renderCanvas(nodes) {
       let obj = JSON.parse(JSON.stringify(item.detail.properties))
       for (const key in obj) {
         let name = key
-        if (shpTotalDict[key]) {
+        // if (shpTotalDict[key]) {
-          name = shpTotalDict[key]
+        //   name = shpTotalDict[key]
+        if (shpTotalDict.indexOf(key) != -1) {
+          name = key
           // 把相同名称的物资数量相加，名称相同时，累加数据
           let index = x.findIndex((item) => item === name)
           if (index !== -1) {
@@ -170,7 +188,6 @@ function renderCanvas(nodes) {
     let params = JSON.parse(item.params)
     if (params.attribute && params.attribute.goods) {
       let goods = params.attribute.goods.content
-      console.log('goods', goods)
       if (goods.length) {
         // $root_home_index.goodSearchDialog = false;
         goods.forEach((good) => {
@@ -187,9 +204,6 @@ function renderCanvas(nodes) {
     }
   })
 
-  console.log('x,y')
-  console.log(x)
-  console.log(y)
   let notZeroX: any = []
   let notZeroY: any = []
   for (let i = 0; i < y.length; i++) {
@@ -198,12 +212,10 @@ function renderCanvas(nodes) {
       notZeroY.push(y[i])
     }
   }
-  console.log(notZeroX)
-  console.log(notZeroY)
   x = notZeroX
   y = notZeroY
-  if (!x.length) show.value = false
+  if (!x.length) baseDialog.value?.close()
-  if (show.value) {
+  if (x.length) {
     nextTick(() => {
       let option: any = {
         grid: {

src/renderer/src/views/components/propertyBox/GoodsSearchPolgon.vue

@@ -1,17 +1,7 @@
 <template>
-  <Dialog
+  <Dialog ref="baseDialog" title="物质统计" left="180px" top="100px" :closeCallback="closeCallBack">
-    v-if="show"
-    ref="baseDialog"
-    title="物质统计"
-    left="180px"
-    top="100px"
-    :closeCallback="closeCallBack"
-  >
     <template #content>
-      <div id="goodSearchEchart2" style="width: 100%; height: 100%"></div>
+      <div id="goodSearchEchart2" style="width: 650px; height: 400px"></div>
-    </template>
-    <template #footer>
-      <button>绘制</button>
     </template>
   </Dialog>
 </template>
@@ -56,7 +46,8 @@ eventBus.on('goodsSearchPolgonDialog', () => {
   draw = new YJ.Draw.DrawPolygon(window.earth)
   draw.start((err, params) => {
     if (!err && params.length > 2) {
-      show.value = true
+      // show.value = true
+      baseDialog.value?.open()
       let nodes = booleanOverlaps(params, 'polygon')
       renderCanvas(nodes)
     }
@@ -67,7 +58,8 @@ const open = () => {
   draw = new YJ.Draw.DrawPolygon(window.earth)
   draw.start((err, params) => {
     if (!err && params.length > 2) {
-      show.value = true
+      // show.value = true
+      baseDialog.value?.open()
       let nodes = booleanOverlaps(params, 'polygon')
       renderCanvas(nodes)
     }
@@ -174,9 +166,6 @@ function renderCanvas(nodes) {
     }
   })
 
-  console.log('x,y')
-  console.log(x)
-  console.log(y)
   let notZeroX: any = []
   let notZeroY: any = []
   for (let i = 0; i < y.length; i++) {
@@ -185,12 +174,10 @@ function renderCanvas(nodes) {
       notZeroY.push(y[i])
     }
   }
-  console.log(notZeroX)
-  console.log(notZeroY)
   x = notZeroX
   y = notZeroY
-  if (!x.length) show.value = false
+  if (!x.length) baseDialog.value?.close()
-  if (show.value) {
+  if (x.length) {
     nextTick(() => {
       let option: any = {
         grid: {