修正问题

src/graphic/Renderer/Draw.js

@@ -534,13 +534,34 @@ export default class Draw {
     fo && help.setStyle(ctx, style)
 
     drawRoadEdgeChild(rightEdge);
+
+    if (fo) {
+      const p1 = coordinate.getScreenXY(leftEdge.start);
+      const p2 = coordinate.getScreenXY(rightEdge.start);
+      const p3 = coordinate.getScreenXY(leftEdge.end);
+      const p4 = coordinate.getScreenXY(rightEdge.end);
+      ctx.lineWidth = 1 * coordinate.ratio
+      ctx.setLineDash([5 * coordinate.ratio, 5 * coordinate.ratio ]);
+
+      ctx.beginPath()
+      ctx.moveTo(p1.x, p1.y)
+      ctx.lineTo(p2.x, p2.y)
+      ctx.stroke()
+      ctx.beginPath()
+      ctx.moveTo(p3.x, p3.y)
+      ctx.lineTo(p4.x, p4.y)
+      ctx.stroke()
+
+    }
+
+
     ctx.restore();
 
     if (import.meta.env.DEV) {
-      this.drawPoint(leftEdge.start);
-      this.drawPoint(leftEdge.end);
-      this.drawPoint(rightEdge.start);
-      this.drawPoint(rightEdge.end);
+      // this.drawPoint(leftEdge.start);
+      // this.drawPoint(leftEdge.end);
+      // this.drawPoint(rightEdge.start);
+      // this.drawPoint(rightEdge.end);
     }
   }
 
@@ -592,14 +613,14 @@ export default class Draw {
   }
 
   drawCurveRoad(vector) {
+    const ctx = this.context;
+    const [_, foo] = help.setVectorStyle(ctx, vector);
     if (vector.display && vector.midDivide) {
       const covesArray = help.transformCoves([
         vector.midDivide.leftMidDivideCurves,
         vector.midDivide.rightMidDivideCurves,
       ]);
-      const ctx = this.context;
       ctx.save();
-      help.setVectorStyle(ctx, vector);
       ctx.lineWidth *= Settings.lineWidth
       for (let coves of covesArray) {
         help.drawCoves(ctx, coves);
@@ -614,6 +635,30 @@ export default class Draw {
     vector.rightLanesCurves &&
       vector.rightLanesCurves.forEach(this.drawCurveLan.bind(this));
 
+
+    if (foo) {
+      const leftEdge = dataService.getCurveRoadEdge(vector.leftEdgeId)
+      const rightEdge = dataService.getCurveRoadEdge(vector.rightEdgeId)
+      const p1 = coordinate.getScreenXY(leftEdge.start);
+      const p2 = coordinate.getScreenXY(rightEdge.start);
+      const p3 = coordinate.getScreenXY(leftEdge.end);
+      const p4 = coordinate.getScreenXY(rightEdge.end);
+      ctx.save();
+      ctx.setLineDash([5 * coordinate.ratio, 5 * coordinate.ratio ]);
+      ctx.lineWidth = 1 * coordinate.ratio
+      ctx.strokeStyle = Style.Lane.strokeStyle
+      ctx.beginPath()
+      ctx.moveTo(p1.x, p1.y)
+      ctx.lineTo(p2.x, p2.y)
+      ctx.stroke()
+      ctx.beginPath()
+      ctx.moveTo(p3.x, p3.y)
+      ctx.lineTo(p4.x, p4.y)
+      ctx.stroke()
+      ctx.restore();
+    }
+
+
     // if (import.meta.env.DEV) {
       vector.points.forEach(this.drawPoint.bind(this));
     // }
@@ -622,6 +667,7 @@ export default class Draw {
   drawCurveRoadEdge(vector, roadVector) {
     const [coves] = help.transformCoves([vector.curves]);
     const ctx = this.context;
+    console.log(coves)
     const [style, select] = help.getVectorStyle(roadVector)
     ctx.save();
     help.setVectorStyle(ctx, vector);
@@ -655,7 +701,7 @@ export default class Draw {
   }
 
   drawRoadPoint(vector) {
-    this.drawPoint(vector);
+    vector.display && this.drawPoint(vector);
   }
 
   drawArrow(vector) {
@@ -705,10 +751,7 @@ export default class Draw {
       y: vector.popPosition.y,
     };
     const offset = radius / 2;
-    const targetPts =
-      style === Style.Focus.Magnifier
-        ? [mathUtil.translate(pt, target, pt, radius), target]
-        : null;
+    const targetPts =[mathUtil.translate(pt, target, pt, radius), target];
 
     ctx.save();
     ctx.beginPath();
@@ -796,7 +839,8 @@ export default class Draw {
   }
 
   drawCircle(element) {
-    this.drawElliptic(element, element.radius, element.radius)
+    this.drawElliptic(element, element.radiusX, element.radiusY)
+    console.log(element)
     const [_, label] = help.getVectorStyle(element);
     label && element.points.forEach((point) => this.drawPoint(point));
   }

src/hook/custom/preset.ts

@@ -1,6 +1,7 @@
 import { Mode, PointInfo, Pos } from "@/sdk/types";
 import { stackFactory, Stack, fastStacksValue, os } from "@/utils/vue";
 import { Ref, ref } from "vue";
+import {FixPoint} from "@/store/fixPoint";
 
 export enum DisabledCom {
   Search = "search",
@@ -77,6 +78,7 @@ export enum CustomCom {
   SpiltView = "split",
   MagnifierMode = "magnifier",
   CustomMouseMenu = "cMoseMenu",
+  ActiveFixPoint = "activeFixPoint",
   ResidenMouseMenu = "rMouseMenu",
   CarryView = "carryView",
   SysView = "sysView",
@@ -123,11 +125,13 @@ export const boxWidthStack = stackFactory(
 );
 export const autoSysViewLeftStack = stackFactory(ref<string>("70px"));
 export const controlFullStack = stackFactory(ref<boolean>(false));
+export const activeFixPointStack = stackFactory(ref<FixPoint>());
 
 export const customMapStack = {
   [CustomCom.LaserMode]: laserModeStack,
   [CustomCom.FullView]: fullViewStack,
   [CustomCom.SpiltView]: spiltViewModeStack,
+  [CustomCom.ActiveFixPoint]: activeFixPointStack,
   [CustomCom.MagnifierMode]: magnifierModeStack,
   [CustomCom.ResidenMouseMenu]: residenMouseMenuStack,
   [CustomCom.CustomMouseMenu]: customMouseMenuStack,

src/views/graphic/geos/normalLine.vue

@@ -19,6 +19,7 @@ import VectorCategory from "@/graphic/enum/VectorCategory";
 const props = defineProps<{ geo: FocusVector }>()
 const vector = computed(() => dataService.getLine(props.geo.vectorId))
 
+console.log(vector)
 const clickHandlerFactory = (key) => {
   return () => drawRef.value.uiControl.updateVectorForSelectUI(key)
 }
@@ -63,7 +64,7 @@ const lineWidthMenu = [
     icon: 'l_thick',
     text: "宽度",
     onClick: () => {
-      clickHandlerFactory(VectorWeight.Bold)()
+      clickHandlerFactory(VectorWeight.Thinning)()
       menus.value[1] = lineWidthMenu[1]
     }
   },
@@ -72,7 +73,7 @@ const lineWidthMenu = [
     icon: 'l_thin',
     text: "宽度",
     onClick: () => {
-      clickHandlerFactory(VectorWeight.Thinning)()
+      clickHandlerFactory(VectorWeight.Bold)()
       menus.value[1] = lineWidthMenu[0]
     }
   },
@@ -104,7 +105,7 @@ const menus = ref([
       childMenus.value = toRaw(childMenus.value) === lineTypeMenu ? null : lineTypeMenu
     }
   },
-  vector.value?.style === VectorWeight.Bold ? lineWidthMenu[0] : lineWidthMenu[1],
+  vector.value?.weight === VectorWeight.Bold ? lineWidthMenu[0] : lineWidthMenu[1],
   ...appendMenus,
   {
     key: 'copy',

src/views/graphic/geos/roadEdge.vue

@@ -57,14 +57,14 @@ const lineTypeMenu = [
   },
   {key: VectorStyle.Greenbelt, icon: "treelawn", text: "绿化带 ", onClick: clickHandlerFactory(VectorStyle.Greenbelt)},
 ]
-const lineWidthMenu = [
 
+const lineWidthMenu = [
   {
     key: VectorWeight.Bold,
     icon: 'l_thick',
     text: "宽度",
     onClick: () => {
-      clickHandlerFactory(VectorWeight.Bold)()
+      clickHandlerFactory(VectorWeight.Thinning)()
       menus.value[1] = lineWidthMenu[1]
     }
   },
@@ -73,7 +73,7 @@ const lineWidthMenu = [
     icon: 'l_thin',
     text: "宽度",
     onClick: () => {
-      clickHandlerFactory(VectorWeight.Thinning)()
+      clickHandlerFactory(VectorWeight.Bold)()
       menus.value[1] = lineWidthMenu[0]
     }
   },
@@ -105,7 +105,7 @@ const menus = ref([
       childMenus.value = toRaw(childMenus.value) === lineTypeMenu ? null : lineTypeMenu
     }
   },
-  vector.value?.style === VectorWeight.Bold ? lineWidthMenu[0] : lineWidthMenu[1],
+  vector.value?.weight === VectorWeight.Bold ? lineWidthMenu[0] : lineWidthMenu[1],
   ...appendMenus
 ])
 

src/views/graphic/imageLabel.vue

@@ -25,7 +25,6 @@
         >
           <ui-icon :type="menu.icon" class="icon" />
           <p>{{ menu.text }}</p>
-          {{menu.icon}}
         </div>
       </div>
     </div>

src/views/scene/covers/basePoint.vue

@@ -2,8 +2,9 @@
   <Cover
       @change-pos="pos => $emit('changePos', pos)"
       :pos="pos"
-      @focus="active = true"
-      @blur="active = false"
+      :focus="active"
+      @focus="emit('focus')"
+      @blur="emit('blur')"
   >
     <img :src="active ? activeIcon : icon" class="label" />
   </Cover>
@@ -17,20 +18,15 @@ import activeIcon from './icon/point_s_s.png'
 import {Pos3D} from '@/sdk'
 import {ref, watchEffect} from "vue";
 
-const props = defineProps<{ pos: Pos3D }>()
-const active = ref(false)
+const props = defineProps<{
+  pos: Pos3D
+  active: boolean
+}>()
 const emit = defineEmits<{
   (m: 'changePos', pos: Pos3D): void,
   (m: 'focus'): void,
   (m: 'blur'): void,
 }>()
-watchEffect(() => {
-  if (active.value) {
-    emit('focus')
-  } else {
-    emit('blur')
-  }
-})
 </script>
 
 <style scoped lang="scss">

src/views/scene/covers/basePoints.vue

@@ -4,6 +4,7 @@
     :key="point.id"
     :pos="point.pos"
     @change-pos="pos => point.pos = pos"
+    :active="active === point"
     @blur="() => active = active === point ? null : active"
     @focus="() => active = point"
   />
@@ -18,7 +19,7 @@ import {ref} from "vue";
 import {FixPoint} from "@/store/fixPoint";
 import ActionsPanel from "@/views/scene/covers/actions.vue";
 
-const active = ref<FixPoint>()
+const active = ref<BasePoint>()
 const activeActionMenus = [
   {
     key: "delete",

src/views/scene/covers/cover.vue

@@ -13,13 +13,14 @@
 </template>
 
 <script setup lang="ts">
-import {computed, onMounted, onUnmounted, ref, watch} from 'vue'
+import {computed, onMounted, onUnmounted, ref, watch, watchEffect} from 'vue'
 import {Pos, Pos3D} from '@/sdk'
 import {customMap, useSDK} from '@/hook'
 import { getPostionByTarget} from '@/components/base/utils'
 
 const props = defineProps<{
-  pos: Pos3D
+  pos: Pos3D,
+  focus: boolean
 }>()
 const emit = defineEmits<{
   (m: 'changePos', pos: Pos3D): void
@@ -50,7 +51,6 @@ updatePos()
 
 const move = ref(false)
 const downHandler = (sev: MouseEvent | TouchEvent) => {
-  customMap.magnifier = true
   const start = new Date().getTime()
   const el = sev.target as HTMLElement
   const mountEl = document.documentElement
@@ -68,7 +68,10 @@ const downHandler = (sev: MouseEvent | TouchEvent) => {
   }
 
   const moveHandler = (ev: MouseEvent | TouchEvent) => {
-    move.value = true
+    if (!move.value) {
+      move.value = true
+      customMap.magnifier = true
+    }
     const pos = sdk.scene.getPointByScreen({
       x: (ev instanceof TouchEvent ? ev.touches[0].pageX : ev.pageX) + preset.x,
       y: (ev instanceof TouchEvent ? ev.touches[0].pageY : ev.pageY) + preset.y,
@@ -83,11 +86,13 @@ const downHandler = (sev: MouseEvent | TouchEvent) => {
     mountEl.removeEventListener('mouseup', upHandler)
     mountEl.removeEventListener('touchmove', moveHandler)
     mountEl.removeEventListener('touchend', upHandler)
-    move.value = false
-    customMap.magnifier = false
-    console.log("关闭放大镜")
+    if (move.value) {
+      move.value = false
+      customMap.magnifier = false
+      console.log("关闭放大镜")
+    }
     if (new Date().getTime() - start < 300) {
-      clickHandler(ev)
+      emit("focus")
     }
   }
 
@@ -98,21 +103,26 @@ const downHandler = (sev: MouseEvent | TouchEvent) => {
   sev.preventDefault()
 }
 
-const clickHandler = ev => {
-  emit("focus")
 
-  const handler = (ev: MouseEvent) => {
-    console.log("????????")
-    if (dom.value && !dom.value.contains(ev.target as HTMLElement) && ev.target !== dom.value) {
-      emit("blur")
-      // document.documentElement.removeEventListener("click", handler)
-      document.documentElement.removeEventListener("touchstart", handler)
-    }
+
+const clickHandler = (ev) => {
+  console.log("???")
+  if (dom.value && !dom.value.contains(ev.target as HTMLElement) && ev.target !== dom.value) {
+    emit("blur")
   }
-  // document.documentElement.addEventListener("click", handler, { passive: true })
-  document.documentElement.addEventListener("touchstart", handler, { passive: true })
 }
 
+watchEffect((onCleanup) => {
+  if (props.focus) {
+    console.log("载入点击")
+    document.documentElement.addEventListener("touchstart", clickHandler, { passive: true })
+    onCleanup(() => {
+      console.log("清除载入点击")
+      document.documentElement.removeEventListener("touchstart", clickHandler)
+    })
+  }
+})
+
 onUnmounted(() => {
   emit("blur")
 })

src/views/scene/covers/fixPoint.vue

@@ -2,8 +2,9 @@
   <Cover
       @change-pos="pos => $emit('changePos', pos)"
       :pos="data.pos"
-      @focus="active = true"
-      @blur="active = false"
+      @focus="emit('focus')"
+      @blur="emit('blur')"
+      :focus="active"
       class="fix-cover"
   >
     <div class="label">
@@ -22,20 +23,15 @@ import {Pos3D} from '@/sdk'
 import {FixPoint} from "@/store/fixPoint";
 import {ref, watchEffect} from "vue";
 
-const props = defineProps<{ data: FixPoint }>()
-const active = ref(false)
+const props = defineProps<{
+  data: FixPoint,
+  active: boolean
+}>()
 const emit = defineEmits<{
   (m: 'changePos', pos: Pos3D): void,
   (m: 'focus'): void,
   (m: 'blur'): void,
 }>()
-watchEffect(() => {
-  if (active.value) {
-    emit('focus')
-  } else {
-    emit('blur')
-  }
-})
 </script>
 
 <style scoped lang="scss">

src/views/scene/covers/fixPoints.vue

@@ -3,13 +3,14 @@
     v-for="point in fixPoints"
     :key="point.id"
     :data="point"
+    :active="point === customMap.activeFixPoint"
     @change-pos="pos => point.pos = pos"
-    @focus="() => active = point"
-    @blur="() => active = active === point ? null : active"
+    @focus="() => customMap.activeFixPoint = point"
+    @blur="() => customMap.activeFixPoint = customMap.activeFixPoint === point ? null : customMap.activeFixPoint"
   />
 
   <div ref="menu" @touchstart.stop>
-    <ActionsPanel :menus="activeActionMenus" v-show="active" />
+    <ActionsPanel :menus="activeActionMenus" v-show="customMap.activeFixPoint" />
   </div>
 
   <div class="edit-fix-point" v-if="edit" ref="dom"  @touchstart.stop>
@@ -37,11 +38,11 @@
 import { fixPoints, FixPoint } from '@/store/fixPoint'
 import FixPointPanel from './fixPoint.vue'
 import ActionsPanel from './actions.vue'
-import {ref, watchEffect} from "vue";
+import {ref, watch, watchEffect} from "vue";
+import {customMap} from '@/hook'
 import UiIcon from "@/components/base/components/icon/index.vue";
 import UiInput from "@/components/base/components/input/index.vue";
 
-const active = ref<FixPoint>()
 const edit = ref<FixPoint>()
 const options = [
   "轿车 / 平面",
@@ -64,7 +65,7 @@ const activeActionMenus = [
     color: "#161A1A",
     iconColor: "#2F8FFF",
     action() {
-      edit.value = active.value
+      edit.value = customMap.activeFixPoint
     }
   },
   {
@@ -73,11 +74,11 @@ const activeActionMenus = [
     color: "#FF4D4F",
     iconColor: "#fff",
     action() {
-      const index = fixPoints.value.indexOf(active.value)
+      const index = fixPoints.value.indexOf(customMap.activeFixPoint)
       if (~index) {
         fixPoints.value.splice(index, 1)
         edit.value = null
-        active.value = null
+        customMap.activeFixPoint = null
       }
     }
   }
@@ -101,6 +102,7 @@ watchEffect((onCleanup) => {
     })
   }
 })
+
 </script>
 
 <style lang="scss" scoped>
@@ -141,4 +143,4 @@ watchEffect((onCleanup) => {
     }
   }
 }
-</style>
+</style>

src/views/scene/menus/actions.ts

@@ -4,22 +4,30 @@ import {list, MeasureAtom, MeasureType} from "@/store/measure";
 import {baseLines} from '@/store/baseLine'
 import {basePoints} from "@/store/basePoint";
 import {Ref, watch} from "vue";
-import {customMap} from "@/hook";
+import {activeFixPointStack, customMap} from "@/hook";
 import {getCoverPos} from '../linkage/cover'
 import {Pos3D} from "@/sdk";
 import {fixPoints} from "@/store/fixPoint";
 import Message from "@/components/base/components/message/message.vue";
 import { getId } from '@/utils'
 
-const trackPosMenuAction = (onComplete: () => void, onAddStore: (pos: Pos3D) => void) => {
-  // customMap.magnifier = true
-
-  const onCleanup = getCoverPos(pos => {
-    onComplete()
-    onAddStore(pos)
-  })
+const trackPosMenuAction = (onComplete: () => void, onAddStore: (pos: Pos3D) => void, continued = false) => {
+  let onCleanup
+  let stop = false
+  const trackCoverPos = () => {
+    onCleanup && onCleanup()
+    onCleanup = getCoverPos(pos => {
+      onAddStore(pos)
+      if (!continued) {
+        onComplete()
+      } else if (!stop) {
+        trackCoverPos()
+      }
+    })
+  }
+  trackCoverPos()
   return () => {
-    // customMap.magnifier = false
+    stop = true
     onCleanup()
   }
 }
@@ -48,8 +56,8 @@ const trackMeasureMenuAction = (
   startTip()
   // customMap.magnifier = true
   const onAddMeasure = (data: MeasureAtom) => {
-    data.id = getId();
     if (data) {
+      data.id = getId();
       onAddStore(data)
       onComplete()
     }
@@ -95,7 +103,11 @@ const menuActions = {
         hide = null
         onComplete()
       },
-      pos => fixPoints.value.push({ id: getId(), pos, text: "其他散落物" })
+      pos => {
+        const len = fixPoints.value.push({ id: getId(), pos, text: "固定点" })
+        activeFixPointStack.current.value.value = fixPoints.value[len - 1]
+      },
+      true
     )
     return () => {
       onDestroy()