feat: change icon

src/model/app.vue

@@ -2,14 +2,21 @@
   <iframe class="external" :src="url" ref="iframeRef" v-if="url"></iframe>
   <div class="laser-layer" v-show="!url">
     <div class="scene-canvas" ref="fuseRef" :class="{ full: full === 'scene' }">
-      <span class="taggle switch" v-if="full !== 'scene'" @click="full = 'scene'">
-        <ui-icon type="f-l" ctrl />
+      <span
+        class="taggle switch"
+        v-if="full !== 'scene'"
+        @click="full = 'scene'"
+      >
+        <!-- <ui-icon type="f-l" ctrl /> -->
+        <img src="@/assets/icon_switch.png" />
+       
       </span>
       <div id="direction"></div>
     </div>
     <div id="scene-map" :class="{ full: full === 'map' }">
       <span class="taggle switch" v-if="full === 'scene'" @click="full = 'map'">
-        <ui-icon type="f-l" ctrl />
+        <!-- <ui-icon type="f-l" ctrl /> -->
+        <img src="@/assets/icon_switch.png" />
       </span>
 
       <span class="scale" :style="{ width: scaleInfo.width + 'px' }">
@@ -20,7 +27,14 @@
 </template>
 
 <script lang="ts">
-import { defineComponent, ref, watchEffect, computed, watch, nextTick } from "vue";
+import {
+  defineComponent,
+  ref,
+  watchEffect,
+  computed,
+  watch,
+  nextTick,
+} from "vue";
 import { SceneType } from "@/store";
 import { params } from "@/env";
 import { fuseModel, modelProps } from "./index";
@@ -28,9 +42,10 @@ import { modelSDKFactory } from "./platform";
 import { sdk, ZoomInfo } from "@/sdk";
 import { round } from "@/utils";
 
+
 const typeChange = () => {
   const oldType = modelProps.type;
-  let stopWatch = (null as unknown) as () => void;
+  let stopWatch = null as unknown as () => void;
 
   const typePromise = new Promise((_, reject) => {
     stopWatch = watchEffect(() => {
@@ -48,7 +63,9 @@ export const full = ref("scene");
 export const Model = defineComponent({
   name: "model",
   setup() {
-    const scene = computed(() => modelProps.type !== fuseModel && modelProps.type);
+    const scene = computed(
+      () => modelProps.type !== fuseModel && modelProps.type
+    );
     const url = ref("");
     const setUrl = (newURL: string) => {
       if (newURL !== url.value) {
@@ -149,7 +166,8 @@ export const Model = defineComponent({
           console.error(doc, doc.head);
           const target = doc.head;
           clearInterval(interval);
-          (window as any).iframeCreated && (window as any).iframeCreated(iframeRef.value);
+          (window as any).iframeCreated &&
+            (window as any).iframeCreated(iframeRef.value);
           if (type === SceneType.SWSS) {
             const $style = document.createElement("style");
             $style.type = "text/css";
@@ -208,7 +226,9 @@ export const Model = defineComponent({
 
       // return `${rlen} ${unit}`
 
-      return `${unit === "dm" ? rlen / 10 : unit === "cm" ? rlen / 100 : rlen}m`;
+      return `${
+        unit === "dm" ? rlen / 10 : unit === "cm" ? rlen / 100 : rlen
+      }m`;
     };
 
     return {
@@ -246,7 +266,9 @@ export default Model;
 }
 
 #direction {
-  right: calc(var(--editor-menu-right) + var(--editor-toolbox-width)) !important;
+  right: calc(
+    var(--editor-menu-right) + var(--editor-toolbox-width)
+  ) !important;
   top: calc(var(--header-top) + var(--editor-head-height)) !important;
   margin: 10px;
   transition: top 0.3s ease, right 0.3s ease;
@@ -255,7 +277,9 @@ export default Model;
 #scene-map {
   &:not(.full) {
     position: absolute !important;
-    right: calc(var(--editor-menu-right) + var(--editor-toolbox-width)) !important;
+    right: calc(
+      var(--editor-menu-right) + var(--editor-toolbox-width)
+    ) !important;
     bottom: 0;
     width: 320px;
     height: 200px;