diff --git a/src/config/cn.json b/src/config/cn.json
index 6665b4a..c59069d 100644
--- a/src/config/cn.json
+++ b/src/config/cn.json
@@ -40,6 +40,12 @@
     "end_date": "结束日期",
     "end_time": "结束时间"
   },
+  "system": {
+    "status": "状态",
+    "details": "详细资料",
+    "attribute": "属性",
+    "value": "值"
+  },
   "energy": {
     "elec_consumption": "用电即时分布",
     "total_elec": "总用电",
diff --git a/src/config/tw.json b/src/config/tw.json
index 0c54577..c09a5ed 100644
--- a/src/config/tw.json
+++ b/src/config/tw.json
@@ -16,12 +16,12 @@
   },
   "dashboard": {
     "yesterday_today": "昨天/今天",
-    "elec_consumption_comparison":"用電量比較",
-    "today_electricity_consumption":"今日用電量",
-    "yesterday_electricity_consumption":"昨天用電量",
-    "this_last_week":"本週/上週",
-    "thisweek_electricity_consumption":"本周用電量",
-    "lastweek_electricity_consumption":"上週用電量"
+    "elec_consumption_comparison": "用電量比較",
+    "today_electricity_consumption": "今日用電量",
+    "yesterday_electricity_consumption": "昨天用電量",
+    "this_last_week": "本週/上週",
+    "thisweek_electricity_consumption": "本周用電量",
+    "lastweek_electricity_consumption": "上週用電量"
   },
   "history": {
     "title": "歷史資料",
@@ -40,6 +40,12 @@
     "end_date": "結束日期",
     "end_time": "結束時間"
   },
+  "system": {
+    "status": "狀態",
+    "details": "詳細資料",
+    "attribute": "屬性",
+    "value": "數值"
+  },
   "energy": {
     "elec_consumption": "用電即時分佈",
     "total_elec": "總用電",
diff --git a/src/config/us.json b/src/config/us.json
index 7ba5396..170c361 100644
--- a/src/config/us.json
+++ b/src/config/us.json
@@ -40,6 +40,12 @@
     "thisweek_electricity_consumption": "This week’s electricity consumption",
     "lastweek_electricity_consumption": "Last week’s electricity consumption"
   },
+  "system": {
+    "status": "Status",
+    "details": "Details",
+    "attribute": "Attribute",
+    "value": "value"
+  },
   "energy": {
     "elec_consumption": "Real-time distribution of electricity consumption",
     "total_elec": "Total electricity consumption",
diff --git a/src/views/dashboard/components/DashboardSysCard.vue b/src/views/dashboard/components/DashboardSysCard.vue
index 5c0a7a0..3960ff9 100644
--- a/src/views/dashboard/components/DashboardSysCard.vue
+++ b/src/views/dashboard/components/DashboardSysCard.vue
@@ -124,6 +124,7 @@ const navigateToSubSystem = (mainSystemId, subSystemId) => {
     params: {
       main_system_id: mainSystemId,
       sub_system_id: subSystemId,
+      floor_id: 'main'
     },
   });
 };
diff --git a/src/views/system/System.vue b/src/views/system/System.vue
index 3ea8806..dbba160 100644
--- a/src/views/system/System.vue
+++ b/src/views/system/System.vue
@@ -206,8 +206,8 @@ provide("system_selectedDevice", { selectedDeviceRealtime, selectedDevice, getCu
     <div class="col-span-1 h-full flex flex-col justify-between">
       <SystemMode />
       <div class="min-h-[75vh] relative">
-        <SystemFloor v-show="route.query.mode === '2D'" />
-        <div :class="twMerge('absolute h-full w-full', route.query.mode === '3D' ? 'opacity-100' : 'opacity-0')">
+        <SystemFloor :class="twMerge('absolute h-full w-full', route.query.mode === '2D' ? 'opacity-100 z-10' : 'opacity-0 z-0')"/>
+        <div :class="twMerge('absolute h-full w-full', route.query.mode === '3D' ? 'opacity-100 z-10' : 'opacity-0 z-0')">
           <ForgeForSystem :initialData="{}" />
         </div>
       </div>
diff --git a/src/views/system/components/SystemCard.vue b/src/views/system/components/SystemCard.vue
index 6ae249c..a8c06d4 100644
--- a/src/views/system/components/SystemCard.vue
+++ b/src/views/system/components/SystemCard.vue
@@ -30,16 +30,16 @@ watch(selectedFloor, (newValue) => {
                 <div class="sec02">
                   <img v-if="device.device_image_url" :src="device.device_image_url" alt="" class="w-8 h-8">
                   <span class="w-8 h-8" v-else></span>
-                  <span>{{ device.full_name }}</span>
+                  <span class="w-32 break-all">{{ device.full_name }}</span>
                 </div>
                 <div class="flex justify-between">
                   <div class="sec03">
                     <span></span>
-                    <span>狀態：</span>
+                    <span>{{$t("system.status")}}：</span>
                     <span></span>
                   </div>
                   <button class="btn-text border-0 "
-                    @click.stop.prevent="(e) => getCurrentInfoModalData(e, { left: e.clientX, top: e.clientY }, device)">詳細資料</button>
+                    @click.stop.prevent="(e) => getCurrentInfoModalData(e, { left: e.clientX, top: e.clientY }, device)">{{$t("system.details")}}</button>
                 </div>
               </div>
 
diff --git a/src/views/system/components/SystemInfoModalDesktop.vue b/src/views/system/components/SystemInfoModalDesktop.vue
index 7bb64e2..90f40df 100644
--- a/src/views/system/components/SystemInfoModalDesktop.vue
+++ b/src/views/system/components/SystemInfoModalDesktop.vue
@@ -1,5 +1,8 @@
 <script setup>
 import { computed, inject } from "vue";
+import { useI18n } from "vue-i18n";
+
+const { t, locale } = useI18n();
 
 const { selectedDevice, selectedDeviceRealtime } = inject("system_selectedDevice");
 
@@ -12,11 +15,11 @@ const data = computed(() => {
 })
 
 const columns = [{
-  title: "屬性",
+  title: t("system.attribute"),
   key: "points"
 },
 {
-  title: "值",
+  title: t("system.value"),
   key: "value"
 }]