perf(views): 优化环境监控区域内嵌网页 url 配置

src/types/env.d.ts

@@ -2,6 +2,7 @@
 
 interface ImportMetaEnv {
   readonly VITE_BASE_API: string;
+  readonly VITE_VIEW_URL: string;
   readonly VITE_TEMP_TOKEN: string;
 }
 

src/utils/env-area.ts

@@ -1,3 +1,7 @@
+export const envAreaEditorPageUrl = `${import.meta.env.VITE_VIEW_URL}/env-area`;
+
+export const envAreaPreviewPageUrl = `${import.meta.env.VITE_VIEW_URL}/env-area/preview`;
+
 /**
  * 环境监控模块与其区域 Iframe 内嵌网页通信的消息前缀
  */

src/views/env-monitor/AreaEditor.vue

@@ -2,7 +2,7 @@
 import { onMounted, onUnmounted, ref, useTemplateRef, watch } from 'vue';
 
 import { useViewVisible } from '@/hooks/view-visible';
-import { EnvAreaMsgType, getEnvAreaMsgType } from '@/utils/env-area';
+import { envAreaEditorPageUrl, EnvAreaMsgType, getEnvAreaMsgType } from '@/utils/env-area';
 
 import type { IframeMsg, RegionsPointsItem } from '@/types';
 
@@ -77,7 +77,7 @@ defineExpose({
     :mask-closable="false"
     :footer="null"
   >
-    <iframe ref="editorIframe" src="http://localhost:88/env-area"></iframe>
+    <iframe ref="editorIframe" :src="envAreaEditorPageUrl"></iframe>
     <ASpin v-if="!isIframeLoaded" class="center-loading env-area-editor-loading" :spinning="true" />
   </AModal>
 </template>

src/views/env-monitor/AreaPreview.vue

@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import { onMounted, onUnmounted, ref, useTemplateRef, watch } from 'vue';
 
-import { EnvAreaMsgType, getEnvAreaMsgType } from '@/utils/env-area';
+import { EnvAreaMsgType, envAreaPreviewPageUrl, getEnvAreaMsgType } from '@/utils/env-area';
 
 import type { IframeMsg, RegionsPointsItem } from '@/types';
 
@@ -73,7 +73,7 @@ defineExpose({
 </script>
 
 <template>
-  <iframe class="env-area-preview" ref="previewIframe" src="http://localhost:88/env-area/preview"></iframe>
+  <iframe class="env-area-preview" ref="previewIframe" :src="envAreaPreviewPageUrl"></iframe>
   <ASpin v-if="!isIframeLoaded" class="center-loading env-area-preview-loading" :spinning="true" />
 </template>