Redesign

frontend/src/pages/Compose.vue

@@ -236,7 +236,7 @@ import {
     getComposeTerminalName,
     PROGRESS_TERMINAL_ROWS,
     RUNNING
-} from "../../../backend/util-common";
+} from "../../../common/util-common";
 import { BModal } from "bootstrap-vue-next";
 import NetworkInput from "../components/NetworkInput.vue";
 import dotenv from "dotenv";
@@ -349,18 +349,22 @@ export default {
             if (!this.stack.name) {
                 return "";
             }
-            return getComposeTerminalName(this.stack.name);
+            return getComposeTerminalName(this.endpoint, this.stack.name);
         },
 
         combinedTerminalName() {
             if (!this.stack.name) {
                 return "";
             }
-            return getCombinedTerminalName(this.stack.name);
+            return getCombinedTerminalName(this.endpoint, this.stack.name);
         },
 
         networks() {
             return this.jsonConfig.networks;
+        },
+
+        endpoint() {
+            return this.$route.params.endpoint || "";
         }
 
     },
@@ -462,7 +466,7 @@ export default {
         },
 
         requestServiceStatus() {
-            this.$root.getSocket().emit("serviceStatusList", this.stack.name, (res) => {
+            this.$root.emitAgent(this.endpoint, "serviceStatusList", this.stack.name, (res) => {
                 if (res.ok) {
                     this.serviceStatusList = res.serviceStatusList;
                 }
@@ -490,7 +494,7 @@ export default {
 
         loadStack() {
             this.processing = true;
-            this.$root.getSocket().emit("getStack", this.stack.name, (res) => {
+            this.$root.emitAgent(this.endpoint, "getStack", this.stack.name, (res) => {
                 if (res.ok) {
                     this.stack = res.stack;
                     this.yamlCodeChange();

frontend/src/pages/Console.vue

@@ -22,7 +22,7 @@
 
 <script>
 
-import { allowedCommandList } from "../../../backend/util-common";
+import { allowedCommandList } from "../../../common/util-common";
 
 export default {
     components: {

frontend/src/pages/ContainerTerminal.vue

@@ -13,7 +13,7 @@
 </template>
 
 <script>
-import { getContainerExecTerminalName } from "../../../backend/util-common";
+import { getContainerExecTerminalName } from "../../../common/util-common";
 
 export default {
     components: {
@@ -37,7 +37,9 @@ export default {
             return getContainerExecTerminalName(this.stackName, this.serviceName, 0);
         },
         sh() {
-            return {
+            let endpoint = this.$route.params.endpoint;
+
+            let data = {
                 name: "containerTerminal",
                 params: {
                     stackName: this.stackName,
@@ -45,6 +47,13 @@ export default {
                     type: "sh",
                 },
             };
+
+            if (endpoint) {
+                data.name = "containerTerminalEndpoint";
+                data.params.endpoint = endpoint;
+            }
+
+            return data;
         },
     },
     mounted() {

frontend/src/pages/DashboardHome.vue

@@ -34,7 +34,7 @@
 </template>
 
 <script>
-import { statusNameShort } from "../../../backend/util-common";
+import { statusNameShort } from "../../../common/util-common";
 
 export default {
     components: {