图片路径统一配置在icon.ts中

src/components/dialog.vue

@@ -1,11 +1,13 @@
 <template>
     <teleport to="#app">
         <div class="dialog" v-show="show" @contextmenu.prevent="console.log('禁用浏览器默认右键功能')">
-            <div class="title" v-if="title">
+            <div class="content" @click.native.stop>
-                <span>{{ title }}</span>
+                <div class="title" v-if="title">
+                    <span>{{ title }}</span>
+                </div>
+                <slot />
+                <img v-if="showHeader" :src="close_icon" class="close" @click="show = false; emit('close')"></img>
             </div>
-            <slot />
-            <img v-if="showHeader" :src="lock_close" class="close" @click="show = false; emit('close')"></img>
         </div>
     </teleport>
 </template>
@@ -14,7 +16,7 @@
 import { useStore } from "vuex";
 import { watch, onMounted, ref } from "vue";
 import { useI18n } from "vue3-i18n";
-import { lock_close } from "@/config";
+import { close_icon } from "@/config";
 
 const { t } = useI18n();
 const { state, commit, dispatch } = useStore();
@@ -76,18 +78,25 @@ onMounted(() => {
 </script>
 <style lang="scss" scoped>
 .dialog {
-    top: v-bind('prop.top');
+    width: 100%;
-    left: v-bind('prop.left');
+    height: 100%;
-    right: v-bind('prop.right');
-    bottom: v-bind('prop.bottom');
-    padding: v-bind('prop.padding');
     position: absolute;
     z-index: v-bind('z');
-    border: 2px solid #fff;
+    background: rgba(0, 0, 0, 0.5);
-    border-radius: 6px;
+
-    box-shadow: 0 0 5px 5px rgba(0, 0, 0, 0.7);
+    .content {
-    background: rgba(0, 0, 0, 0.7);
+        top: v-bind('prop.top');
+        left: v-bind('prop.left');
+        right: v-bind('prop.right');
+        bottom: v-bind('prop.bottom');
+        padding: v-bind('prop.padding');
+        position: absolute;
+        border: 2px solid #fff;
+        border-radius: 6px;
+        box-shadow: 0 0 5px 5px rgba(0, 0, 0, 0.7);
+        background: rgba(0, 0, 0, 0.7);
 
+    }
 }
 
 .title {

src/components/drawer.vue

@@ -6,7 +6,7 @@
                     <span>{{ title }}</span>
                 </div>
                 <slot />
-                <img :src="lock_close" class="close" @click="show = false; emit('close')"></img>
+                <img :src="close_icon" class="close" @click="show = false; emit('close')"></img>
             </div>
         </div>
     </teleport>
@@ -16,7 +16,7 @@
 import { useStore } from "vuex";
 import { watch, onMounted, ref, onBeforeUnmount } from "vue";
 import { useI18n } from "vue3-i18n";
-import { lock_close } from "@/config";
+import { close_icon } from "@/config";
 
 const { t } = useI18n();
 const { state, commit, dispatch } = useStore();

src/components/equip-icon.vue

@@ -2,7 +2,7 @@
     <div class='icon' :class="{ 'red-flash': equip && isUnique(equip) }"
         :style="{ 'box-shadow': 'inset 0 0 7px 2px ' + ((equip && equip.quality.color) || '#a1a1a1') }">
         <span v-if="equip">
-            <img :src="'/img/equips/' + equip.base.icon">
+            <img :src="equips_icon_path + equip.base.icon">
             <div class="lv" v-if="equip.lv">lv{{ equip.lv }}</div>
         </span>
     </div>
@@ -12,7 +12,7 @@
 import { useStore } from "vuex";
 import { reactive, onMounted, ref, computed } from "vue";
 import { useI18n } from "vue3-i18n";
-import { qualitys } from "@/config";
+import { qualitys,equips_icon_path } from "@/config";
 
 const { t } = useI18n();
 const { state, commit, dispatch } = useStore();

src/components/equip-tips.vue

@@ -5,7 +5,7 @@
         </div>
         <div class="tip" v-if="tipsShow && compare && curEquip" :style='tipsStyle2' :key="2">
             <Equip :equip="curEquip" :used="true" />
-            <img class="equip-used" :src="lock_used"></img>
+            <img class="equip-used" :src="used_icon"></img>
         </div>
     </teleport>
 </template>
@@ -15,7 +15,7 @@ import { useStore } from "vuex";
 import { computed, onMounted, ref } from "vue";
 import { useI18n } from "vue3-i18n";
 import Equip from "./equip.vue"
-import { lock_used } from "@/config";
+import { used_icon } from "@/config";
 
 const { t } = useI18n();
 const { state, commit, dispatch } = useStore();

src/components/tooltip.vue

@@ -4,7 +4,7 @@
             <slot></slot>
         </div>
         <div class="c-tooltip-tip" :class="placement" v-if="tipsShow" :style='tipsStyle'>
-            <img v-if="showIcon" src="/img/tips.png" class="tip-icons"></img>
+            <img v-if="showIcon" :src="tips_icon" class="tip-icons"></img>
             <p v-for="info in infos" class="info">* {{ info }}</p>
             <slot name="tip"></slot>
         </div>
@@ -15,6 +15,8 @@
 import { useStore } from "vuex";
 import { reactive, onMounted, ref } from "vue";
 import { useI18n } from "vue3-i18n";
+import { tips_icon } from "@/config";
+
 
 const { t } = useI18n();
 const { state, commit, dispatch } = useStore();

src/config/icons.ts

@@ -25,10 +25,12 @@ export const attr_icon_urls = {
   moveSpeed: '/img/attribute/S_EVA.png',
   battleSpeed: '/img/attribute/S_EVA.png',
 };
+export const tips_icon = '/img/tips.png';
+export const equips_icon_path = "/img/equips/"
 export const lock_icon = '/img/lock.png';
-export const lock_used = '/img/used.png';
+export const used_icon = '/img/used.png';
-export const lock_close = '/img/close.png';
+export const close_icon = '/img/close.png';
-export const lock_refresh = '/img/re.png';
+export const refresh_icon = '/img/re.png';
 export const playerImg = '/img/player.png';
 export const playerImg2 = '/img/player2.png';
 

src/views/dungeon/dungeonMap.vue

@@ -7,7 +7,7 @@
         <div id="map" class="map" :style="mapStyle">
             <span v-if="!state.battle.battleShow">
                 <DungeonView v-for="item in dungeons" :dungeon="item" :key="item.lv" @battle="startBattle(item)" />
-                <img :src="lock_refresh" class="refresh" @click="refreshDungeons"></img>
+                <img :src="refresh_icon" class="refresh" @click="refreshDungeons"></img>
             </span>
             <BattleView :dungeon="curDungeon" v-if="state.battle.battleShow" ref="battle" />
         </div>
@@ -21,7 +21,7 @@ import { useStore } from "vuex";
 import { onBeforeUnmount, onMounted, computed, ref, nextTick } from "vue";
 import { useI18n } from "vue3-i18n";
 import { Tooltip, Dialog } from "@/components"
-import { menu_icons, Dungeon, lock_refresh } from "@/config";
+import { menu_icons, Dungeon, refresh_icon } from "@/config";
 import { randomDungeonDifficulty } from "@/tool";
 import DungeonView from "./dungeon.vue"
 import BattleView from "./battle.vue"
@@ -73,9 +73,9 @@ const setStype = () => {
     }
     if (window.innerWidth > 1360) {
         mapStyle.value = {
-            height: 'calc(100 % - 0.5rem)',
+            height: 'calc(100 % - 1vh)',
-            width: 'calc(100 % - 53.5rem)',
+            width: '58.5vw',
-            left: '53rem',
+            left: '40.5vw',
         }
     } else {
         mapStyle.value = {