Feat: i18n & offline daemon chart

Author: yumao233

src/app/views/Services.vue

@@ -162,16 +162,16 @@
                       size="mini"
                       v-model="node.ip"
                       :placeholder="$t('overview.addr')"
-                      style="max-width: 120px"
+                      style="max-width: 120px; margin-right: 4px"
                     ></el-input>
-                    &nbsp;
+
                     <el-input
                       size="mini"
                       v-model="node.port"
                       :placeholder="$t('overview.port')"
-                      style="max-width: 70px"
+                      style="max-width: 70px; margin-right: 4px"
                     ></el-input>
-                    &nbsp;
+
                     <el-button size="mini" @click="linkService(node, true)">{{
                       node.available ? $t("services.update") : $t("services.connect")
                     }}</el-button>
@@ -425,13 +425,13 @@ export default {
       this.$nextTick(() => {
         for (let i = 0; i < this.services.length; i++) {
           const element = this.services[i];
+          const echartCpuDom = echarts.init(
+            document.querySelector("#echart-wrapper-daemon-cpu-" + i)
+          );
+          const echartMemDom = echarts.init(
+            document.querySelector("#echart-wrapper-daemon-mem-" + i)
+          );
           if (element.available && element.cpuMemChart) {
-            const echartCpuDom = echarts.init(
-              document.querySelector("#echart-wrapper-daemon-cpu-" + i)
-            );
-            const echartMemDom = echarts.init(
-              document.querySelector("#echart-wrapper-daemon-mem-" + i)
-            );
             const cpuChartData = element?.cpuMemChart.map((v) => v.cpu);
             const memChartData = element?.cpuMemChart.map((v) => v.mem);
             echartCpuDom.setOption(getDaemonMemChartOption(cpuChartData));
@@ -442,6 +442,15 @@ export default {
               cpuChartInstance: echartCpuDom,
               memChartInstance: echartMemDom
             };
+          } else {
+            echartCpuDom.setOption(getDaemonMemChartOption(null));
+            echartMemDom.setOption(getDaemonMemChartOption(null));
+            this.daemonCharts[element.uuid] = {
+              cpu: [],
+              mem: [],
+              cpuChartInstance: echartCpuDom,
+              memChartInstance: echartMemDom
+            };
           }
         }
       });

src/language/en_us.json

@@ -783,7 +783,10 @@
     "inputNewKey": "Please provide new token, the panel will automatically attempt to connect with new token later.",
     "key": "Token",
     "keySub2": "Linux, the token is usually in /opt/mcsmanager/daemon/data/Config/global.json",
-    "copyId": "(available for API calls)"
+    "copyId": "(available for API calls)",
+    "toDocker": "Docker",
+    "toFileManager": "Files",
+    "toTerminal": "Terminal"
   },
   "container": {
     "remoteList": "Select daemon",