瀏覽代碼

feat(init): fix tree stype

gemercheung 1 年之前
父節點
當前提交
1ca9a6697b
共有 6 個文件被更改,包括 81 次插入27 次删除
  1. 8 0
      src/assets/frame.svg
  2. 5 0
      src/assets/panorama.svg
  3. 11 0
      src/assets/state_gps.svg
  4. 16 12
      src/style.scss
  5. 1 2
      src/view/map/map-board.vue
  6. 40 13
      src/view/map/map-right.vue

+ 8 - 0
src/assets/frame.svg

@@ -0,0 +1,8 @@
+<svg fill="currentColor" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
+	<g id="frame">
+		<g id="Union">
+			<path d="M3.5 1C2.11929 1 1 2.11929 1 3.5V5C1 5.27614 1.22386 5.5 1.5 5.5C1.77614 5.5 2 5.27614 2 5V3.5C2 2.67157 2.67157 2 3.5 2H12.5C13.3284 2 14 2.67157 14 3.5V12.5C14 13.3284 13.3284 14 12.5 14H3.5C2.67157 14 2 13.3284 2 12.5V11C2 10.7239 1.77614 10.5 1.5 10.5C1.22386 10.5 1 10.7239 1 11V12.5C1 13.8807 2.11929 15 3.5 15H12.5C13.8807 15 15 13.8807 15 12.5V3.5C15 2.11929 13.8807 1 12.5 1H3.5Z"  />
+			<path d="M7.14645 4.14645C7.34171 3.95118 7.65829 3.95118 7.85355 4.14645L10.8536 7.14645C11.0488 7.34171 11.0488 7.65829 10.8536 7.85355L7.85355 10.8536C7.65829 11.0488 7.34171 11.0488 7.14645 10.8536C6.95118 10.6583 6.95118 10.3417 7.14645 10.1464L9.29289 8H1.5C1.22386 8 1 7.77614 1 7.5C1 7.22386 1.22386 7 1.5 7H9.29289L7.14645 4.85355C6.95118 4.65829 6.95118 4.34171 7.14645 4.14645Z" />
+		</g>
+	</g>
+</svg>

文件差異過大導致無法顯示
+ 5 - 0
src/assets/panorama.svg


+ 11 - 0
src/assets/state_gps.svg

@@ -0,0 +1,11 @@
+<svg  viewBox="0 0 16 16" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
+	<g id="state_gps">
+		<g id="Union">
+			<path d="M4.11091 2.61088C4.30617 2.41562 4.30617 2.09903 4.11091 1.90377C3.91565 1.70851 3.59907 1.70851 3.40381 1.90377C0.865398 4.44218 0.865398 8.55775 3.40381 11.0962C3.59907 11.2914 3.91565 11.2914 4.11091 11.0962C4.30617 10.9009 4.30617 10.5843 4.11091 10.3891C1.96303 8.24117 1.96303 4.75876 4.11091 2.61088Z"  />
+			<path d="M12.5962 11.0962C15.1346 8.55775 15.1346 4.44218 12.5962 1.90377C12.4009 1.70851 12.0843 1.70851 11.8891 1.90377C11.6938 2.09903 11.6938 2.41562 11.8891 2.61088C14.037 4.75876 14.037 8.24117 11.8891 10.3891C11.6938 10.5843 11.6938 10.9009 11.8891 11.0962C12.0843 11.2914 12.4009 11.2914 12.5962 11.0962Z"  />
+			<path d="M5.52513 3.31796C5.72039 3.51322 5.72039 3.8298 5.52513 4.02506C4.15829 5.3919 4.15829 7.60797 5.52513 8.97481C5.72039 9.17007 5.72039 9.48665 5.52513 9.68192C5.32986 9.87718 5.01328 9.87718 4.81802 9.68192C3.06066 7.92456 3.06066 5.07531 4.81802 3.31796C5.01328 3.12269 5.32986 3.12269 5.52513 3.31796Z" />
+			<path d="M11.182 3.31796C12.9393 5.07531 12.9393 7.92456 11.182 9.68192C10.9867 9.87718 10.6701 9.87718 10.4749 9.68192C10.2796 9.48665 10.2796 9.17007 10.4749 8.97481C11.8417 7.60797 11.8417 5.3919 10.4749 4.02506C10.2796 3.8298 10.2796 3.51322 10.4749 3.31796C10.6701 3.12269 10.9867 3.12269 11.182 3.31796Z"  />
+			<path d="M8 4.49994C9.10457 4.49994 10 5.39537 10 6.49994C10 7.58489 9.1361 8.46806 8.05866 8.4991L11.3091 14.9999H4.69104L7.94146 8.4991C6.86396 8.46813 6 7.58493 6 6.49994C6 5.39537 6.89543 4.49994 8 4.49994ZM8 5.49994C7.44772 5.49994 7 5.94765 7 6.49994C7 7.05222 7.44772 7.49994 8 7.49994C8.55228 7.49994 9 7.05222 9 6.49994C9 5.94765 8.55228 5.49994 8 5.49994ZM7.99978 10.6166L6.30878 13.9996H9.69078L7.99978 10.6166Z"/>
+		</g>
+	</g>
+</svg>

+ 16 - 12
src/style.scss

@@ -2,7 +2,7 @@ html,
 body,
 #app {
   margin: 0;
-  width : 100vw;
+  width: 100vw;
   height: 100vh;
 }
 
@@ -15,30 +15,30 @@ body,
 }
 
 .disable {
-  opacity       : 0.7;
+  opacity: 0.7;
   pointer-events: none;
 }
 
 .relics-layout {
-  height        : 100%;
-  display       : flex;
+  height: 100%;
+  display: flex;
   flex-direction: column;
-  overflow      : hidden !important;
+  overflow: hidden !important;
 
   .relics-header {
     flex: none;
   }
 
   .relics-content {
-    flex    : 1;
+    flex: 1;
     position: relative;
 
     .el-table {
       position: absolute;
-      left    : 0;
-      top     : 0;
-      width   : 100%;
-      height  : 100%;
+      left: 0;
+      top: 0;
+      width: 100%;
+      height: 100%;
     }
   }
 
@@ -48,6 +48,10 @@ body,
 }
 
 .link {
-  color : var(--el-color-primary);
+  color: var(--el-color-primary);
   cursor: pointer;
-}
+}
+:root {
+  --font14: 14px;
+  --font16: 16px;
+}

+ 1 - 2
src/view/map/map-board.vue

@@ -477,10 +477,9 @@ const handlePolysEdit = (item: PolyDataType) => {
       cursor: pointer;
       user-select: none;
       width: 100%;
-
       span {
         line-height: 26px;
-        font-size: 13px;
+        font-size: var(--font14);
       }
 
       &.active {

+ 40 - 13
src/view/map/map-right.vue

@@ -28,6 +28,7 @@
                 <span :class="{ disable: data.disable }" class="title">
                   <el-icon>
                     <Grid />
+
                   </el-icon>
                   {{ data.raw.sceneName }}
 
@@ -38,7 +39,8 @@
                 <div class="title-box">
                   <span :class="{ disable: data.disable }" class="title">
                     <el-icon>
-                      <LocationInformation v-if="!data.disable" />
+
+                      <StateGpsIcon v-if="!data.disable" />
                       <DeleteLocation v-else />
                     </el-icon>
                     {{ node.label }}
@@ -64,11 +66,23 @@
                   </el-icon>
                 </template>
                 <el-icon color="#409efc" style="margin-left: 8px">
-                  <Link v-if="!data.run" @click.stop="
-                    data.type === 'scene'
-                      ? gotoScene(data.raw)
-                      : emit('gotoPoint', data.raw)
-                    " />
+                  <!-- root -->
+                  <template v-if="data.raw.scenePos">
+                    <FrameIcon v-if="!data.run" @click.stop="
+                      data.type === 'scene'
+                        ? gotoScene(data.raw)
+                        : emit('gotoPoint', data.raw)
+                      " />
+                  </template>
+                  <template v-else>
+
+                    <PanoramaIcon v-if="!data.run" @click.stop="
+                      data.type === 'scene'
+                        ? gotoScene(data.raw)
+                        : emit('gotoPoint', data.raw)
+                      " />
+                  </template>
+
                 </el-icon>
               </span>
             </div>
@@ -103,7 +117,7 @@ import {
   Delete,
   Grid,
   Download,
-  LocationInformation,
+  // LocationInformation,
   DeleteLocation,
   Edit,
   Link,
@@ -125,7 +139,10 @@ import { selectScenes } from "../quisk";
 import { addRelicsScenesFetch, delRelicsScenesFetch } from "@/request";
 import { exportFile, exportImage } from "./pc4Helper";
 import { SceneStatus } from "@/store/scene";
-
+import StateGpsIcon from '@/assets/state_gps.svg';
+import PanoramaIcon from '@/assets/panorama.svg';
+import FrameIcon from '@/assets/frame.svg';
+// import StateGpsIcon from '@/assets/state_gps.svg';
 const emit = defineEmits<{
   (e: "flyScene", data: Scene): void;
   (e: "flyPoint", data: ScenePoint): void;
@@ -217,16 +234,25 @@ const handlerExport = (type: number, name: string) => {
 
 
 <style lang="scss" scoped>
-:deep(.el-tree) {
+:deep(.el-tree-node__content) {
+  --el-tree-node-content-height: 26px;
+  line-height: 26px;
+
+}
+
+:deep(.el-tree-node__children .el-tree-node__content) {
   --el-tree-node-content-height: 52px;
 
-  // .el-tree-node__content>label.el-checkbox {
-  //   // padding-top: 10px;
-  //   // align-items: flex-start;
-  // }
+  &>label.el-checkbox {
+    padding-top: 6px;
+    align-items: flex-start;
+  }
 }
 
+:deep(.el-tree .tree-item) {}
+
 .tree-item {
+
   display: flex;
   width: calc(100% - 50px);
   align-items: flex-start;
@@ -257,6 +283,7 @@ const handlerExport = (type: number, name: string) => {
 
   .oper {
     flex: none;
+    line-height: 26px;
   }
 }