1.加入docker file設定

2.調整組件以使用 window.env 讀取環境變數

.dockerignore

@@ -0,0 +1,7 @@
+node_modules
+.git
+.gitignore
+Dockerfile
+docker-compose.yml
+README.md
+.vs

.env.development

@@ -1,4 +0,0 @@
-VITE_API_BASEURL = "https://ibms-Empower-api.production.mjmtech.com.tw"
-VITE_FILE_API_BASEURL = "https://ibms-Empower.production.mjmtech.com.tw"
-VITE_MQTT_BASEURL = "wss://mqttwss.mjm-staging.developers-homelab.net"
-VITE_FORGE_BASEURL = "https://ibms-Empower.production.mjmtech.com.tw/dist"

.env.production

@@ -1,4 +0,0 @@
-VITE_API_BASEURL = "https://ibms-Empower-api.production.mjmtech.com.tw"
-VITE_FILE_API_BASEURL = "https://ibms-Empower.production.mjmtech.com.tw"
-VITE_MQTT_BASEURL = "wss://mqttwss.mjm-staging.developers-homelab.net"
-VITE_FORGE_BASEURL = "https://ibms-Empower.production.mjmtech.com.tw/dist"

.env.staging

@@ -1,3 +0,0 @@
-VITE_API_BASEURL = "http://220.132.206.5:8008"
-VITE_FILE_API_BASEURL = "http://220.132.206.5:8085/file"
-VITE_FORGE_BASEURL = "http://localhost:5173"

.gitattributes

@@ -1,2 +0,0 @@
-* text=auto
-*.html text eol=lf

Dockerfile

@@ -0,0 +1,43 @@
+	# 使用 Node.js 作為基礎映像
+FROM node:18-alpine AS builder
+
+# 設定工作目錄
+WORKDIR /app
+
+# 複製 package.json 和 package-lock.json (或 yarn.lock) 到工作目錄
+COPY package*.json ./
+
+# 安裝依賴
+RUN npm install --legacy-peer-deps
+
+# 複製所有檔案到工作目錄
+COPY . .
+
+# 清理緩存並重新構建
+RUN npm cache clean --force
+RUN rm -rf node_modules
+RUN npm install --legacy-peer-deps
+
+# 構建前端應用 (如果需要)
+RUN npm run build --omit=dev
+
+# 使用一個更小的映像來提供靜態文件 (例如 Nginx)
+FROM nginx:alpine
+
+# 將構建好的靜態檔案複製到 Nginx 的預設目錄
+COPY --from=builder /app/dist /usr/share/nginx/html
+
+# (可選) 複製自定義 Nginx 設定檔
+# COPY nginx.conf /etc/nginx/conf.d/default.conf
+
+# 暴露 Nginx 預設的 80 端口
+EXPOSE 80
+
+# 2025-08-29 說明
+LABEL changelog="2025-08-29: 打包測試。"
+
+# Nginx 已經預設啟動，所以不需要 CMD 指令
+COPY docker-entrypoint.sh /docker-entrypoint.sh
+RUN chmod +x /docker-entrypoint.sh
+ENTRYPOINT ["/docker-entrypoint.sh"]
+CMD ["nginx", "-g", "daemon off;"]

docker-entrypoint.sh

@@ -0,0 +1,5 @@
+#!/bin/sh
+echo "window.env = { VITE_API_BASEURL: '${VITE_API_BASEURL}', VITE_FILE_API_BASEURL: '${VITE_FILE_API_BASEURL}', VITE_APP_TITLE: '${VITE_APP_TITLE}' };" > /usr/share/nginx/html/env.js
+sed -i "s|<title>.*</title>|<title>${VITE_APP_TITLE}</title>|g" /usr/share/nginx/html/index.html
+sed -i "s|<link rel=\"icon\" href=\".*\"|<link rel=\"icon\" href=\"${VITE_FILE_API_BASEURL}/favicon.ico\"|g" /usr/share/nginx/html/index.html
+exec "$@"

index.html

@@ -10,6 +10,7 @@
     />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>新創賦能</title>
+    <script src="/env.js"></script>
     <script src="https://code.jquery.com/jquery-3.7.1.js"></script>
     <script src="https://code.jquery.com/ui/1.13.3/jquery-ui.js"></script>
     <!-- <script type="text/javascript" src="/requirejs/config.js"></script> -->

src/apis/account/index.js

@@ -10,7 +10,7 @@ import {
   DELETE_ACCOUNT_USER_API,
 } from "./api";
 import instance from "@/util/request";
-import apihandler from "@/util/apihandler";
+import apihandler from "@/util/apiHandler";
 
 export const getAccountUserList = async (search_condition = {}) => {
   const res = await instance.post(GET_ACCOUNT_USERLIST_API, search_condition);

src/apis/alert/index.js

@@ -23,7 +23,7 @@ import {
   POST_ALERT_MQTT_REFRESH,
 } from "./api";
 import instance from "@/util/request";
-import apihandler from "@/util/apihandler";
+import apihandler from "@/util/apiHandler";
 
 export const getAlertFormId = async (uuid) => {
   const res = await instance.post(GET_ALERT_FORMID_API, uuid);

src/apis/asset/index.js

@@ -28,7 +28,7 @@ import {
   POST_ASSET_ELEC_SETTING_API,
 } from "./api";
 import instance from "@/util/request";
-import apihandler from "@/util/apihandler";
+import apihandler from "@/util/apiHandler";
 import { object } from "yup";
 
 export const getAssetMainList = async (building_guid) => {

src/apis/building/index.js

@@ -7,7 +7,7 @@ import {
   GET_ALL_DEVICE_API,
 } from "./api";
 import instance from "@/util/request";
-import apihandler from "@/util/apihandler";
+import apihandler from "@/util/apiHandler";
 
 export const getBuildings = async () => {
   const res = await instance.post(GET_BUILDING_API);

src/apis/dashboard/index.js

@@ -13,7 +13,7 @@ import {
   GET_DASHBOARD_ALARMOPERATION_INFO_API,
 } from "./api";
 import instance from "@/util/request";
-import apihandler from "@/util/apihandler";
+import apihandler from "@/util/apiHandler";
 
 export const getDashboardInit = async (page_type = "SR") => {
   const res = await instance.post(GET_DASHBOARD_INIT_API, {

src/apis/energy/index.js

@@ -18,7 +18,7 @@ import {
   POST_TIME_ELEC_API,
 } from "./api";
 import instance, { fileInstance } from "@/util/request";
-import apihandler from "@/util/apihandler";
+import apihandler from "@/util/apiHandler";
 import downloadExcel from "@/util/downloadExcel";
 
 export const getRealTimeData = async () => {

src/apis/forge/index.js

@@ -1,6 +1,6 @@
 import instance from "@/util/request";
 import { GET_FORGETOKEN_API, GET_FORGEURN_API } from "./api";
-import apihandler from "@/util/apihandler";
+import apihandler from "@/util/apiHandler";
 
 export const getUrn = async () => {
   const res = await instance.post(GET_FORGEURN_API);

src/apis/graph/api.js

@@ -1,5 +1,5 @@
 // graph
-const BASEURL = import.meta.env.VITE_API_BASEURL;
+const BASEURL = window.env?.VITE_API_BASEURL;
 export const GET_GRAPH_SIDEBAR_API = `/GraphManage/GraphManageTreeList`;
 
 export const UPDATE_GRAPH_SIDEBAR_API = `/GraphManage/EditGraphManageTree`;

src/apis/history/api.js

@@ -1,5 +1,5 @@
 // history
-const BASEURL = import.meta.env.VITE_API_BASEURL;
+const BASEURL = window.env?.VITE_API_BASEURL;
 export const GET_HISTORY_SIDEBAR_API = `/api/History/GetDeviceInfo`;
 export const GET_HISTORY_POINT_API = `/api/History/GetAllDevPoi`;
 export const GET_HISTORY_DATA_API = `/api/History/GetHistoryData`;

src/apis/login/index.js

@@ -1,6 +1,6 @@
 import { POST_LOGIN } from "./api";
 import instance from "@/util/request";
-import apihandler from "@/util/apihandler";
+import apihandler from "@/util/apiHandler";
 
 export async function Login({ account, password }) {
   const res = await instance.post(POST_LOGIN, {

src/apis/operation/index.js

@@ -12,7 +12,7 @@ import {
   DELETE_OPERATION_COMPANY_API,
 } from "./api";
 import instance from "@/util/request";
-import apihandler from "@/util/apihandler";
+import apihandler from "@/util/apiHandler";
 import dayjs from "dayjs";
 
 export const getOperationRecord = async ({

src/apis/productSetting/index.js

@@ -1,5 +1,5 @@
 import instance from "@/util/request";
-import apihandler from "@/util/apihandler";
+import apihandler from "@/util/apiHandler";
 import {
   POST_SETTING_POINT_API,
   GET_SETTING_TYPE_API,

src/apis/system/index.js

@@ -7,7 +7,7 @@ import {
   POST_MQTT_TOPIC_STOP_API,
 } from "./api";
 import instance from "@/util/request";
-import apihandler from "@/util/apihandler";
+import apihandler from "@/util/apiHandler";
 
 export const getSystemFloors = async (building_tag, sub_system_tag) => {
   const res = await instance.post(GET_SYSTEM_FLOOR_LIST_API, {

src/components/forge/Forge.vue

@@ -1,7 +1,7 @@
 <script setup>
 import { ref, onMounted, onUnmounted } from "vue";
 
-const FILE_BASEURL = import.meta.env.VITE_FILE_API_BASEURL;
+const FILE_BASEURL = window.env?.VITE_FILE_API_BASEURL;
 
 const forgeDom = ref(null);
 let viewer = null;

src/components/forge/ForgeForSystem.vue

@@ -164,7 +164,7 @@ const initForge = async () => {
   //     });
   //   });
   // });
-  const FILE_BASEURL = import.meta.env.VITE_FILE_API_BASEURL;
+  const FILE_BASEURL = window.env?.VITE_FILE_API_BASEURL;
   const viewer = await initViewer(forgeDom.value)
   const filePath = `${FILE_BASEURL}/upload/forge/0.svf`;
   await loadModel(viewer, filePath)

src/constant/api_app.js

@@ -1,4 +1,4 @@
-const BASEURL = import.meta.env.VITE_API_BASEURL;
+const BASEURL = window.env?.VITE_API_BASEURL;
 export const POST_LOGIN = `${BASEURL}/api/Login/`;
 export const GET_AUTHPAGE_API = `${BASEURL}/api/GetUsrFroList`;
 export const GET_SUBAUTHPAGE_API = `${BASEURL}/api/Device/GetMainSub`;

src/constant/api_forge.js

@@ -1,4 +1,4 @@
-const BASEURL = import.meta.env.VITE_API_BASEURL;
+const BASEURL = window.env?.VITE_API_BASEURL;
 export const GET_FORGETOKEN_API = `${BASEURL}/api/forge/oauth/token`;
 
 export const GET_FORGEURN_API = `${BASEURL}/api/Device/GetBuild`;

src/main.js

@@ -15,7 +15,7 @@ import App from "./App.vue";
 import router from "./router";
 import "virtual:svg-icons-register";
 // 引入项目中的全部全局组件
-import SvgIcon from "@/components/svgIcon.vue";
+import SvgIcon from "@/components/SvgIcon.vue";
 import library from "./fontawsomeIconRegister";
 import "flag-icons/css/flag-icons.min.css";
 

src/util/downloadExcel.js

@@ -1,4 +1,4 @@
-const BASEURL = import.meta.env.VITE_API_BASEURL;
+const BASEURL = window.env?.VITE_API_BASEURL;
 
 export default function downloadExcel(res) {
   let disposition = res.headers.get("Content-Disposition");

src/util/request.js

@@ -1,6 +1,6 @@
 import useGetCookie from "@/hooks/useGetCookie";
 import axios from "axios";
-const BASEURL = import.meta.env.VITE_API_BASEURL;
+const BASEURL = window.env?.VITE_API_BASEURL;
 
 const instance = axios.create({
   baseURL: BASEURL,

src/views/AssetManagement/components/AssetTable.vue

@@ -10,7 +10,7 @@ import { useI18n } from "vue-i18n";
 const { t } = useI18n();
 const { openToast, cancelToastOpen } = inject("app_toast");
 const { companyOptions, departmentList, floors } = inject("asset_modal_options");
-const FILE_BASEURL = import.meta.env.VITE_FILE_API_BASEURL;
+const FILE_BASEURL = window.env?.VITE_FILE_API_BASEURL;
 const { searchParams, changeParams } = useSearchParam();
 
 const totalCoordinates = ref({});

src/views/AssetManagement/components/AssetTableModalLeftInfo.vue

@@ -10,7 +10,7 @@ import useUserInfoStore from "@/stores/useUserInfoStore";
 import dayjs from "dayjs";
 import { useI18n } from "vue-i18n";
 const { t } = useI18n();
-const FILE_BASEURL = import.meta.env.VITE_FILE_API_BASEURL;
+const FILE_BASEURL = window.env?.VITE_FILE_API_BASEURL;
 const { searchParams, changeParams } = useSearchParam();
 const { updateLeftFields, formErrorMsg, formState } = inject(
   "asset_table_modal_form"

src/views/AssetManagement/components/AssetTableModalLeftInfoGraph.vue

@@ -4,7 +4,7 @@ import { ref, computed, inject, watch, onMounted } from "vue";
 import { useI18n } from "vue-i18n";
 import Menu from "@/components/customUI/Menu.vue";
 const { t } = useI18n();
-const FILE_BASEURL = import.meta.env.VITE_FILE_API_BASEURL;
+const FILE_BASEURL = window.env?.VITE_FILE_API_BASEURL;
 const { formState } = inject("asset_table_modal_form");
 const columns = computed(() => [
   {

src/views/AssetManagement/components/AssetTableModalRightInfo.vue

@@ -7,7 +7,7 @@ import { twMerge } from "tailwind-merge";
 import { useI18n } from "vue-i18n";
 
 const { t } = useI18n();
-const FILE_BASEURL = import.meta.env.VITE_FILE_API_BASEURL;
+const FILE_BASEURL = window.env?.VITE_FILE_API_BASEURL;
 const { totalCoordinates } = inject("asset_table_data");
 const { floors } = inject("asset_modal_options");
 const { updateRightFields, formErrorMsg, formState } = inject(

src/views/alert/components/AlertQuery/AlertTableModal.vue

@@ -7,7 +7,7 @@ import "yup-phone-lite";
 import useFormErrorMessage from "@/hooks/useFormErrorMessage";
 import { useI18n } from "vue-i18n";
 const { t } = useI18n();
-const FILE_BASEURL = import.meta.env.VITE_FILE_API_BASEURL;
+const FILE_BASEURL = window.env?.VITE_FILE_API_BASEURL;
 
 const props = defineProps({
   editRecord: Object,

src/views/dashboard/Dashboard.vue

@@ -14,7 +14,7 @@ import { computed, inject, ref, watch, onMounted, onUnmounted } from "vue";
 import useBuildingStore from "@/stores/useBuildingStore";
 import { getSystemDevices, getSystemRealTime } from "@/apis/system";
 import DashboardRefrig from "./components/DashboardRefrig.vue";
-const FILE_BASEURL = import.meta.env.VITE_FILE_API_BASEURL;
+const FILE_BASEURL = window.env?.VITE_FILE_API_BASEURL;
 const buildingStore = useBuildingStore();
 
 const subscribeData = ref([]);

src/views/dashboard/components/DashboardEffectScatter.vue

@@ -9,7 +9,7 @@ import { useI18n } from "vue-i18n";
 const { t } = useI18n();
 const route = useRoute();
 const { searchParams, changeParams } = useSearchParam();
-const FILE_BASEURL = import.meta.env.VITE_FILE_API_BASEURL;
+const FILE_BASEURL = window.env?.VITE_FILE_API_BASEURL;
 
 const props = defineProps({
   data: {

src/views/dashboard/components/DashboardSysCard.vue

@@ -2,7 +2,7 @@
 import { ref, computed } from "vue";
 import useSearchParam from "@/hooks/useSearchParam";
 const { searchParams, changeParams } = useSearchParam();
-const FILE_BASEURL = import.meta.env.VITE_FILE_API_BASEURL;
+const FILE_BASEURL = window.env?.VITE_FILE_API_BASEURL;
 const props = defineProps({
   data: {
     type: Object,

src/views/graphManagement/components/GraphModal.vue

@@ -10,7 +10,7 @@ import {
 } from "@/apis/graph";
 import { useI18n } from "vue-i18n";
 const { t } = useI18n();
-const BASEURL = import.meta.env.VITE_FILE_API_BASEURL;
+const BASEURL = window.env?.VITE_FILE_API_BASEURL;
 
 const props = defineProps({
   updateEditRecord: Function,

src/views/graphManagement/components/GraphTable.vue

@@ -8,7 +8,7 @@ import { useI18n } from "vue-i18n";
 const { t } = useI18n();
 const { openToast, cancelToastOpen } = inject("app_toast");
 const { sidebar_data } = inject("current_dir");
-const FILE_BASEURL = import.meta.env.VITE_FILE_API_BASEURL;
+const FILE_BASEURL = window.env?.VITE_FILE_API_BASEURL;
 
 const columns = computed(() => [
   {

src/views/operation/components/OperationTable.vue

@@ -8,7 +8,7 @@ import useSearchParam from "@/hooks/useSearchParam";
 import { useI18n } from "vue-i18n";
 const { t } = useI18n();
 const { openToast, cancelToastOpen } = inject("app_toast");
-const FILE_BASEURL = import.meta.env.VITE_FILE_API_BASEURL;
+const FILE_BASEURL = window.env?.VITE_FILE_API_BASEURL;
 const { searchParams } = useSearchParam();
 
 const { dataSource, openModal, updateEditRecord, search, tableLoading } =

src/views/operation/components/OperationTableModal.vue

@@ -12,7 +12,7 @@ import Select from "@/components/customUI/Select.vue";
 import SearchSelect from "@/components/customUI/SearchSelect.vue";
 import { useI18n } from "vue-i18n";
 const { t } = useI18n();
-const FILE_BASEURL = import.meta.env.VITE_FILE_API_BASEURL;
+const FILE_BASEURL = window.env?.VITE_FILE_API_BASEURL;
 
 const props = defineProps({
   editRecord: Object,

src/views/setting/components/Floors.vue

@@ -7,7 +7,7 @@ import { useI18n } from "vue-i18n";
 import useBuildingStore from "@/stores/useBuildingStore";
 
 const storeBuild = useBuildingStore();
-const FILE_BASEURL = import.meta.env.VITE_FILE_API_BASEURL;
+const FILE_BASEURL = window.env?.VITE_FILE_API_BASEURL;
 const { t } = useI18n();
 const { openToast, cancelToastOpen } = inject("app_toast");
 

src/views/system/SystemFloor.vue

@@ -11,7 +11,7 @@ const { currentFloor, subscribeData } = inject("system_deviceList");
 const { getCurrentInfoModalData, selected_dbid } = inject(
   "system_selectedDevice"
 );
-const FILE_BASEURL = import.meta.env.VITE_FILE_API_BASEURL;
+const FILE_BASEURL = window.env?.VITE_FILE_API_BASEURL;
 
 const asset_floor_chart = ref(null);
 const sameOption = {

src/views/system/components/SystemCard.vue

@@ -8,7 +8,7 @@ const { getCurrentInfoModalData, selected_dbid } = inject(
 const { subscribeData } = inject("system_deviceList");
 
 const { showData } = useSystemShowData();
-const FILE_BASEURL = import.meta.env.VITE_FILE_API_BASEURL;
+const FILE_BASEURL = window.env?.VITE_FILE_API_BASEURL;
 
 const fitToView = (forge_dbid, spriteDbId) => {
   selected_dbid.value = [forge_dbid, spriteDbId];

src/views/system/components/SystemInfoModalImage.vue

@@ -2,7 +2,7 @@
 import { computed, inject, watch, ref } from "vue";
 import { useI18n } from "vue-i18n";
 const { t } = useI18n();
-const FILE_BASEURL = import.meta.env.VITE_FILE_API_BASEURL;
+const FILE_BASEURL = window.env?.VITE_FILE_API_BASEURL;
 const { selectedDeviceCog } = inject("system_selectedDevice");
 const imgData = ref([]);
 

vite.config.js

@@ -13,15 +13,6 @@ export default defineConfig({
     outDir: "./dist",
     emptyOutDir: true,
   },
-  server: {
-    proxy: {
-      "/upload": {
-        target: "https://ibms-empower2.production.mjmtech.com.tw",
-        changeOrigin: true,
-        secure: false,
-      },
-    },
-  },
   plugins: [
     vue(),
     Components({