Переглянути джерело

feat: fixing board add type

gemercheung 1 рік тому
батько
коміт
84770b7530
4 змінених файлів з 40 додано та 37 видалено
  1. 7 7
      src/router.ts
  2. 32 21
      src/view/map/map-borad.vue
  3. 1 1
      src/view/users-add.vue
  4. 0 8
      src/view/users-edit.vue

+ 7 - 7
src/router.ts

@@ -39,14 +39,14 @@ const routes: RouteRecordRaw[] = [
             path: "",
             name: "map",
             meta: { title: "文物", navClass: "map" },
-            component: () => import("@/view/map/map-borad.vue"),
-          },
-          {
-            path: "test",
-            name: "map-test",
-            meta: { title: "文物", navClass: "map" },
-            component: () => import("@/view/map/test-board.vue"),
+            component: () => import("@/view/map/map-board.vue"),
           },
+          // {
+          //   path: "test",
+          //   name: "map-test",
+          //   meta: { title: "文物", navClass: "map" },
+          //   component: () => import("@/view/map/test-board.vue"),
+          // },
           {
             path: "pano/:pid",
             name: "pano",

+ 32 - 21
src/view/map/map-borad.vue

@@ -1,30 +1,21 @@
 <template>
   <div class="map-layout">
+    <Teleport to=".header" v-if="isMounted">
+      <div class="custom_bar">
+
+      </div>
+    </Teleport>
     <div id="map" class="map-container" ref="mapContainer" @click.stop>
       <div class="map-component">
-        <el-select
-          v-model="tileType"
-          placeholder="选择底图"
-          style="width: 120px"
-          class="tile-type-select"
-        >
-          <el-option
-            v-for="item in tileOptions"
-            :key="item"
-            :label="item"
-            :value="item"
-          />
+        <el-select v-model="tileType" placeholder="选择底图" style="width: 120px" class="tile-type-select">
+          <el-option v-for="item in tileOptions" :key="item" :label="item" :value="item" />
         </el-select>
       </div>
 
       <div class="board" ref="boardContainer"></div>
     </div>
     <div class="right-control">
-      <MapRight
-        @fly-point="flyScenePoint"
-        @fly-scene="flyScene"
-        @goto-point="gotoPointPage"
-      />
+      <MapRight @fly-point="flyScenePoint" @fly-scene="flyScene" @goto-point="gotoPointPage" />
     </div>
   </div>
 </template>
@@ -36,8 +27,9 @@ import { Manage } from "./openlayer";
 import { ScenePoint, Scene, scenePoints, scenes } from "@/store/scene";
 import { initRelics, initSelfRelics, relics } from "@/store/relics";
 import { onMounted, ref, watchEffect, watch, onUnmounted } from "vue";
-import { createBoard, scenePosTransform } from "./board/";
+import { createBoard, scenePosTransform } from "./board";
 import { relicsPolyginsFetch } from "@/request";
+
 import {
   mapManageInit,
   boardInit,
@@ -53,6 +45,8 @@ const gotoPointPage = (point: ScenePoint) => {
   });
 };
 
+const isMounted = ref(false)
+
 const autoInitPos = () => {
   const scene = scenes.value.find(
     (scene) => !scene.scenePos.every((pos) => !pos.pos || pos.pos.length === 0)
@@ -163,7 +157,8 @@ let board: ReturnType<typeof createBoard>;
 
 onMounted(async () => {
   mapManage = mapManageInit(mapContainer.value!);
-  board = boardInit(boardContainer.value!, mapManage);
+  board = (window as any).board = boardInit(boardContainer.value!, mapManage);
+  isMounted.value = true
 });
 
 onUnmounted(() => {
@@ -176,6 +171,7 @@ onUnmounted(() => {
 .tooltip {
   pointer-events: none;
 }
+
 .map-layout {
   display: flex;
   flex-direction: row;
@@ -219,6 +215,7 @@ onUnmounted(() => {
   top: 0;
   z-index: 9;
 }
+
 .env {
   width: 100%;
   height: 100%;
@@ -245,15 +242,19 @@ onUnmounted(() => {
   font-size: 14px;
   display: flex;
   align-items: end;
+
   &.light {
     --color: #fff;
-    > div {
+
+    >div {
       text-shadow: 0 0 2px #000;
     }
   }
+
   &.dark {
     --color: #000;
-    > div {
+
+    >div {
       text-shadow: 0 0 2px #fff;
     }
   }
@@ -267,4 +268,14 @@ onUnmounted(() => {
   right: 0;
   z-index: 1;
 }
+
+.custom_bar {
+  width: 60px;
+  position: fixed;
+  top: 0;
+  left: 0;
+  height: 100vh;
+  background-color: white;
+
+}
 </style>

+ 1 - 1
src/view/users-add.vue

@@ -48,7 +48,7 @@ import {
 
 import { ref, reactive, unref, onMounted } from "vue";
 import { View, Hide } from '@element-plus/icons-vue';
-import { user } from '@/store/user'
+// import { user } from '@/store/user'
 
 const addPassFlag = ref(false)//图标显示标识
 

+ 0 - 8
src/view/users-edit.vue

@@ -45,14 +45,6 @@ const rules = reactive<FormRules>({
     { required: true, message: "请输入姓名", trigger: "blur" },
     // { required: true, pattern: /^1[3456789]\d{9}$/, message: "请输入正确手机号", trigger: "blur" },
   ],
-  // userName: [
-  //   { required: true, message: "请输入账号", trigger: "blur" },
-  //   // { required: true, pattern: /^1[3456789]\d{9}$/, message: "请输入正确手机号", trigger: "blur" },
-  // ],
-  // password: [
-  //   { required: true, pattern: /^(?=.*[A-Za-z])(?=.*\d)[A-Za-z\d]{8,16}$/, message: "请输入8-16位数字、字母大小写组合", trigger: "blur" },
-  //   { required: true, min: 8, message: '密码太短!', trigger: "blur" },
-  // ],
 },)
 
 const props = defineProps<{