fix: 支持线段

src/components/group-button/index.vue

@@ -8,7 +8,7 @@
       :class="{ active: activeKey === menu.key, dire }"
       @click="menu.onClick && menu.onClick(menu)"
     >
-      <ui-icon type="close" class="icon"/>
+      <ui-icon :type="menu.icon || 'close'" class="icon"/>
       <p v-if="menu.text">{{ menu.text }}</p>
     </div>
   </ButtonPane>

src/graphic/Renderer/Draw.js

@@ -140,7 +140,8 @@ export default class Draw {
   }
 
   drawRoad(vector, isTemp) {
-    if (vector.display) {
+    console.log(vector)
+    if (!isTemp && vector.display && vector.way !== "oneWay") {
       const ctx = this.context;
       const draw = (midDivide) => {
         const startScreen = coordinate.getScreenXY(midDivide.start);

src/graphic/Service/ElementService.js

@@ -68,15 +68,15 @@ export class ElementService {
     this.newRoad.end = p2;
 
     let edgePoints;
-    if (newRoad.way == Constant.oneWay) {
+    if (this.newRoad.way == Constant.oneWay) {
       edgePoints = mathUtil.RectangleVertex(p1, p2, newRoad.singleRoadWidth);
     } else {
       edgePoints = mathUtil.RectangleVertex(
         p1,
         p2,
-        newRoad.leftWidth +
-          newRoad.rightWidth +
-          newRoad.midDivide.midDivideWidth
+        this.newRoad.leftWidth +
+        this.newRoad.rightWidth +
+        this.newRoad.midDivide.midDivideWidth
       );
     }
     let leftEdge = new RoadEdge(

src/utils/menus.ts

@@ -0,0 +1,76 @@
+import {computed, ref, Ref, toRaw} from "vue";
+import {uiType} from "@/hook/useGraphic";
+
+type MenuRaw = {
+  key: any,
+  children?: MenuRaw[]
+}
+
+
+type GenerateResult<R, E = {}> = Array<R & { children: GenerateResult<R, E> } & E>;
+export const generateByMenus = <T extends MenuRaw, R>(
+  generateFn: (men: T) => R,
+  mainMenus: T[]
+): GenerateResult<R>  => {
+  return mainMenus.map(mainMenu => ({
+    ...generateFn(mainMenu),
+    children: mainMenu.children ? generateByMenus(generateFn, mainMenu.children) : []
+  }))
+}
+export const findMenuByAttr = <T extends MenuRaw, K extends keyof T, V extends T[K]>
+(value: V, attr: K, mainMenus: T[]) => {
+  for (const mainMenu of mainMenus) {
+    if (toRaw(mainMenu[attr]) === toRaw(value)) {
+      return mainMenu
+    } else if (mainMenu.children) {
+      const childMainMenu = findMenuByAttr(value, attr as any, mainMenu.children)
+      if (childMainMenu) {
+        return childMainMenu;
+      }
+    }
+  }
+}
+
+export type GenerateMinMenusResult<TK, R> =  {
+  menus: GenerateResult<R, { onClick: () => void }>,
+  child: Ref<TK>,
+  activeMenuKey: Ref<any>
+}
+export const generateMixMenus = <
+  T extends MenuRaw,
+  K extends keyof T,
+  R
+>(
+  childKey: K,
+  generateFn: (men: T) => R,
+  mainMenus: T[],
+  itemAction: (men: MenuRaw) => void
+): GenerateMinMenusResult<T[K], R> => {
+  const child = ref();
+  const menus = generateByMenus((menu) => ({
+    ...generateFn(menu),
+    onClick: () => {
+      if (menu[childKey]) {
+        if (toRaw(menu[childKey]) !== toRaw(child.value)) {
+          child.value = menu[childKey]
+          return;
+        }
+      } else {
+        itemAction(menu);
+      }
+      child.value = null
+    }
+  }), mainMenus)
+
+  const activeMenuKey = computed(() =>
+    child.value
+      ? findMenuByAttr(child.value, childKey, mainMenus)?.key
+      : uiType.current
+  )
+
+  return {
+    child,
+    menus,
+    activeMenuKey
+  };
+}

src/views/graphic/menus.ts

@@ -1,5 +1,9 @@
 import {uiType, UIType, VectorType} from "@/hook/useGraphic";
-import {computed, Ref, ref, toRaw} from 'vue'
+import {
+  findMenuByAttr,
+  generateByMenus as generateByMenusRaw,
+  generateMixMenus as generateMixMenusRaw
+} from '@/utils/menus'
 
 export const UITypeExtend = {
   structure: "structure",
@@ -14,7 +18,8 @@ export const UITypeExtend = {
 }
 
 export type MenuRaw = {
-  key: string, text: string,
+  key: string,
+  text: string,
   icon?: string,
   children?: MenusRaw
   extend?: MenusRaw
@@ -140,72 +145,24 @@ focusMenuRaw[VectorType.CurveRoadEdge] = focusMenuRaw[VectorType.RoadEdge]
 focusMenuRaw[VectorType.CurveRoad] = focusMenuRaw[VectorType.Road]
 
 
-export const isUITypeExtend = (key: string) =>
-  Object.values(UITypeExtend).some(v => v === key)
-
-type GenerateResult<T extends {}, E = {}> = Array<T & { children: GenerateResult<T> } & E>;
-export const generateByMenus = <T>(
+export const generateByMenus = <T extends MenuRaw>(
   generateFn: (men: MenuRaw) => T,
   mainMenus: MenusRaw = mainMenusRaw
-): GenerateResult<T>  => {
-  return mainMenus.map(mainMenu => ({
-    ...generateFn(mainMenu),
-    children: mainMenu.children ? generateByMenus(generateFn, mainMenu.children) : []
-  }))
-}
+) => generateByMenusRaw(generateFn, mainMenus);
+
 export const findMainMenuByAttr = (
   value: MenusRaw,
-  attr = "extend",
+  attr = "extend" as const,
   mainMenus = mainMenusRaw
-) => {
-  for (const mainMenu of mainMenus) {
-    if (toRaw(mainMenu[attr]) === toRaw(value)) {
-      return mainMenu
-    } else if (mainMenu.children) {
-      const childMainMenu = findMainMenuByAttr(value, attr, mainMenu.children)
-      if (childMainMenu) {
-        return childMainMenu;
-      }
-    }
-  }
-}
+) => findMenuByAttr(value, attr, mainMenus)
 
-export type GenerateMinMenusResult<T extends {}, K extends keyof MenuRaw> =  {
-  menus: GenerateResult<T, { onClick: () => void }>,
-  child: Ref<MenuRaw[K]>,
-  activeMenuKey: Ref<string>
-}
 export const generateMixMenus = <T extends {}, K extends keyof MenuRaw>(
   childKey: K,
   generateFn: (men: MenuRaw) => T,
   mainMenus: MenusRaw = mainMenusRaw
-): GenerateMinMenusResult<T, K> => {
-  const child = ref();
-  const menus = generateByMenus((menu) => ({
-    ...generateFn(menu),
-    onClick: () => {
-      if (menu[childKey]) {
-        if (toRaw(menu[childKey]) !== toRaw(child.value)) {
-          child.value = menu[childKey]
-          console.log("变成为", child.value)
-          return;
-        }
-      } else {
-        uiType.change(menu.key as any)
-      }
-      child.value = null
-    }
-  }), mainMenus)
-
-  const activeMenuKey = computed(() =>
-    child.value
-      ? findMainMenuByAttr(child.value, childKey, mainMenus)?.key
-      : uiType.current
-  )
-
-  return {
-    child,
-    menus,
-    activeMenuKey
-  };
-}
+) => generateMixMenusRaw(
+  childKey,
+  generateFn,
+  mainMenus,
+    menu => uiType.change(menu.key as any)
+);

src/views/scene/container.vue

@@ -5,7 +5,7 @@
 </template>
 
 <script setup lang="ts">
-import {onMounted, ref} from "vue";
+import {onMounted, ref, watchEffect} from "vue";
 import {setupLaser, useLoading, useParams} from "@/hook";
 import {store} from "@/store";
 import {webSite} from "@/store/setup";
@@ -32,6 +32,7 @@ onMounted(() => {
     Loading.hideAll()
   }, 1000)
 });
+
 </script>
 
 <style scoped lang="scss">

src/views/scene/index.vue

@@ -6,4 +6,11 @@
 <script lang="ts" setup>
 import Container from "./container.vue"
 import Mode from './mode.vue'
+import {watchEffect} from "vue";
+import {useAsyncSDK, CustomCom, customMap} from "@/hook";
+
+useAsyncSDK().then(sdk => {
+  watchEffect(() => sdk.scene.changeMode(customMap[CustomCom.LaserMode]));
+
+})
 </script>

src/views/scene/mode.vue

@@ -1,6 +1,6 @@
 <template>
   <GroupButton
-    class="tabs"
+    class="scene-mode-tabs"
     :menus="menus"
     :active-key="activeKey"
   />
@@ -41,8 +41,19 @@ watchEffect(() => {
 </script>
 
 <style lang="scss" scoped>
-.tabs {
+.scene-mode-tabs {
   left: var(--boundMargin);
   bottom: var(--boundMargin);
 }
 </style>
+
+<style lang="scss">
+.scene-mode-tabs {
+  padding: 0 !important;
+  .menu {
+    width: 64px;
+    margin-right: 0 !important;
+    border-radius: 32px;
+  }
+}
+</style>