sysadmin/dockge
1
0
Fork 0
mirror of https://github.com/louislam/dockge.git synced 2026-05-21 14:02:17 +00:00
Code Issues Packages Projects Releases Wiki Activity

Container control buttons (#649)

Browse Source 
Co-authored-by: cmcooper1980 <31871143+cmcooper1980@users.noreply.github.com>
additional QOL commits by @Dracrius
This commit is contained in:
Lance Cain
2026-04-11 19:58:45 -04:00
committed by GitHub
parent e589d4ec7e
commit 078f762631
4 changed files with 186 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

64
backend/agent-socket-handlers/docker-socket-handler.ts
View File

@@ -147,6 +147,8 @@ export class DockerSocketHandler extends AgentSocketHandler {
msgi18n: true,
}, callback);
server.sendStackList();
stack.leaveCombinedTerminal(socket);
} catch (e) {
callbackError(e, callback);
}
@@ -238,6 +240,68 @@ export class DockerSocketHandler extends AgentSocketHandler {
}
});
// Start a service
agentSocket.on("startService", async (stackName: unknown, serviceName: unknown, callback) => {
try {
checkLogin(socket);
if (typeof (stackName) !== "string" || typeof (serviceName) !== "string") {
throw new ValidationError("Stack name and service name must be strings");
}
const stack = await Stack.getStack(server, stackName);
await stack.startService(socket, serviceName);
stack.joinCombinedTerminal(socket); // Ensure the combined terminal is joined
callbackResult({
ok: true,
msg: "Service " + serviceName + " started"
}, callback);
server.sendStackList();
} catch (e) {
callbackError(e, callback);
}
});
// Stop a service
agentSocket.on("stopService", async (stackName: unknown, serviceName: unknown, callback) => {
try {
checkLogin(socket);
if (typeof (stackName) !== "string" || typeof (serviceName) !== "string") {
throw new ValidationError("Stack name and service name must be strings");
}
const stack = await Stack.getStack(server, stackName);
await stack.stopService(socket, serviceName);
callbackResult({
ok: true,
msg: "Service " + serviceName + " stopped"
}, callback);
server.sendStackList();
} catch (e) {
callbackError(e, callback);
}
});
agentSocket.on("restartService", async (stackName: unknown, serviceName: unknown, callback) => {
try {
checkLogin(socket);
if (typeof stackName !== "string" || typeof serviceName !== "string") {
throw new Error("Invalid stackName or serviceName");
}
const stack = await Stack.getStack(server, stackName, true);
await stack.restartService(socket, serviceName);
callbackResult({
ok: true,
msg: "Service " + serviceName + " restarted"
}, callback);
} catch (e) {
callbackError(e, callback);
}
});
// getExternalNetworkList
agentSocket.on("getDockerNetworkList", async (callback) => {
try {

30
backend/stack.ts
View File

@@ -550,4 +550,34 @@ export class Stack {
}
}
async startService(socket: DockgeSocket, serviceName: string) {
const terminalName = getComposeTerminalName(socket.endpoint, this.name);
const exitCode = await Terminal.exec(this.server, socket, terminalName, "docker", ["compose", "up", "-d", serviceName], this.path);
if (exitCode !== 0) {
throw new Error(`Failed to start service ${serviceName}, please check logs for more information.`);
}
return exitCode;
}
async stopService(socket: DockgeSocket, serviceName: string): Promise<number> {
const terminalName = getComposeTerminalName(socket.endpoint, this.name);
const exitCode = await Terminal.exec(this.server, socket, terminalName, "docker", ["compose", "stop", serviceName], this.path);
if (exitCode !== 0) {
throw new Error(`Failed to stop service ${serviceName}, please check logs for more information.`);
}
return exitCode;
}
async restartService(socket: DockgeSocket, serviceName: string): Promise<number> {
const terminalName = getComposeTerminalName(socket.endpoint, this.name);
const exitCode = await Terminal.exec(this.server, socket, terminalName, "docker", ["compose", "restart", serviceName], this.path);
if (exitCode !== 0) {
throw new Error(`Failed to restart service ${serviceName}, please check logs for more information.`);
}
return exitCode;
}
}

50
frontend/src/components/Container.vue
View File

@@ -1,7 +1,7 @@
<template>
<div class="shadow-box big-padding mb-3 container">
<div class="row">
<div class="col-7">
<div class="col-5">
<h4>{{ name }}</h4>
<div class="image mb-2">
<span class="me-1">{{ imageName }}:</span><span class="tag">{{ imageTag }}</span>
@@ -14,12 +14,35 @@
</a>
</div>
</div>
<div class="col-5">
<div class="col-7">
<div class="function">
<router-link v-if="!isEditMode" class="btn btn-normal" :to="terminalRouteLink" disabled="">
<div class="btn-group me-2" role="group">
<router-link v-if="!isEditMode && (status === 'running' || status === 'healthy')" class="btn btn-normal" :to="terminalRouteLink" disabled="">
<font-awesome-icon icon="terminal" />
Bash
</router-link>
<button v-if="this.serviceCount > 1 && !isEditMode && status !== 'running' && status !== 'healthy'"
class="btn btn-primary"
:disabled="processing"
@click="startService">
<font-awesome-icon icon="play" class="me-1" />
{{ $t("startStack") }}
</button>
<button v-if="this.serviceCount > 1 && !isEditMode && (status === 'running' || status === 'healthy' || status === 'unhealthy')"
class="btn btn-normal"
:disabled="processing"
@click="restartService">
<font-awesome-icon icon="rotate" class="me-1" />
{{ $t("restartStack") }}
</button>
<button v-if="this.serviceCount > 1 && !isEditMode && (status === 'running' || status === 'healthy' || status === 'unhealthy')"
class="btn btn-normal"
:disabled="processing"
@click="stopService">
<font-awesome-icon icon="stop" class="me-1" />
{{ $t("stopStack") }}
</button>
</div>
</div>
</div>
</div>
@@ -160,12 +183,19 @@ export default defineComponent({
type: String,
default: "N/A",
},
processing: {
type: Boolean,
default: false,
},
ports: {
type: Array,
default: null
}
},
emits: [
"start-service",
"stop-service",
"restart-service"
],
data() {
return {
@@ -234,6 +264,10 @@ export default defineComponent({
return this.jsonObject.services[this.name];
},
serviceCount() {
return Object.keys(this.jsonObject.services).length;
},
jsonObject() {
return this.$parent.$parent.jsonConfig;
},
@@ -288,6 +322,16 @@ export default defineComponent({
remove() {
delete this.jsonObject.services[this.name];
},
startService() {
this.$emit("start-service", this.name);
},
stopService() {
this.$emit("stop-service", this.name);
},
restartService() {
this.$emit("restart-service", this.name);
}
}
});
</script>

42
frontend/src/pages/Compose.vue
View File

@@ -128,6 +128,10 @@
:name="name"
:is-edit-mode="isEditMode"
:first="name === Object.keys(jsonConfig.services)[0]"
:processing="processing"
@start-service="startService"
@stop-service="stopService"
@restart-service="restartService"
:status="serviceStatusList[name]?.state"
:ports="serviceStatusList[name]?.ports"
/>
@@ -777,6 +781,44 @@ export default {
this.stack.name = this.stack?.name?.toLowerCase();
},
startService(serviceName) {
this.processing = true;
this.$root.emitAgent(this.endpoint, "startService", this.stack.name, serviceName, (res) => {
this.processing = false;
this.$root.toastRes(res);
if (res.ok) {
this.requestServiceStatus(); // Refresh service status
}
});
},
stopService(serviceName) {
this.processing = true;
this.$root.emitAgent(this.endpoint, "stopService", this.stack.name, serviceName, (res) => {
this.processing = false;
this.$root.toastRes(res);
if (res.ok) {
this.requestServiceStatus(); // Refresh service status
}
});
},
restartService(serviceName) {
this.processing = true;
this.$root.emitAgent(this.endpoint, "restartService", this.stack.name, serviceName, (res) => {
this.processing = false;
this.$root.toastRes(res);
if (res.ok) {
this.requestServiceStatus(); // Refresh service status
}
});
},
}
};
</script>