FJurmanovic/acc-server-manager-web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

add player count and track

Browse Source
This commit is contained in:
Fran Jurmanović
2025-05-24 00:46:50 +02:00
parent 12a9e55f5a
commit f10150776d
3 changed files with 78 additions and 66 deletions
Download Patch File Download Diff File Expand all files Collapse all files

34
src/components/EditorAssistRules.svelte
View File

@@ -166,24 +166,24 @@
</div>
</div>
<div class="pt-4 border-t border-gray-700">
<label class="flex items-center">
<input
type="checkbox"
bind:checked={restart}
class="h-4 w-4 text-green-600 focus:ring-green-500 border-gray-600 rounded bg-gray-700"
/>
<span class="ml-2 text-sm text-gray-300">Restart server after saving</span>
</label>
</div>
<label class="flex items-center">
<input
type="checkbox"
bind:checked={restart}
class="h-4 w-4 text-green-600 focus:ring-green-500 border-gray-600 rounded bg-gray-700"
/>
<span class="ml-2 text-sm text-gray-300">Restart server after saving</span>
</label>
</div>
<div class="flex justify-end">
<button
type="submit"
disabled={formLoading}
class="px-4 py-2 bg-green-600 hover:bg-green-700 rounded-md text-sm font-medium"
>
Save Changes
</button>
<div class="flex justify-end">
<button
type="submit"
disabled={formLoading}
class="px-4 py-2 bg-green-600 hover:bg-green-700 rounded-md text-sm font-medium"
>
Save Changes
</button>
</div>
</form>

86
src/components/ServerCard.svelte
View File

@@ -5,79 +5,83 @@
function getStatusColor(status: string) {
switch (status) {
case 'SERVICE_RUNNING\r\n': return 'bg-green-500';
case 'SERVICE_STOPPED\r\n': return 'bg-red-500';
case 'SERVICE_RESTARTING\r\n': return 'bg-yellow-500';
default: return 'bg-gray-500';
case 'SERVICE_RUNNING\r\n':
return 'bg-green-500';
case 'SERVICE_STOPPED\r\n':
return 'bg-red-500';
case 'SERVICE_RESTARTING\r\n':
return 'bg-yellow-500';
default:
return 'bg-gray-500';
}
}
</script>
<div class="bg-gray-800 rounded-lg shadow-lg overflow-hidden border border-gray-700">
<a
href={`dashboard/server/${server.id}`}
>
<div class="overflow-hidden rounded-lg border border-gray-700 bg-gray-800 shadow-lg">
<a href={`dashboard/server/${server.id}`}>
<div class="p-4">
<div class="flex justify-between items-start">
<div>
<h3 class="text-lg font-medium">{server.name}</h3>
<div class="flex items-center mt-1">
<span class={`inline-block w-2 h-2 rounded-full ${getStatusColor(server.status)} mr-2`}></span>
<span class="text-sm capitalize">{server.status}</span>
<div class="flex items-start justify-between">
<div>
<h3 class="text-lg font-medium">{server.name}</h3>
<div class="mt-1 flex items-center">
<span class={`inline-block h-2 w-2 rounded-full ${getStatusColor(server.status)} mr-2`}
></span>
<span class="text-sm capitalize">{server.status}</span>
</div>
</div>
</div>
<button
class="text-gray-400 hover:text-white"
>
<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" viewBox="0 0 20 20" fill="currentColor">
<path d="M13.586 3.586a2 2 0 112.828 2.828l-.793.793-2.828-2.828.793-.793zM11.379 5.793L3 14.172V17h2.828l8.38-8.379-2.83-2.828z" />
</svg>
</button>
<button class="text-gray-400 hover:text-white">
<svg
xmlns="http://www.w3.org/2000/svg"
class="h-5 w-5"
viewBox="0 0 20 20"
fill="currentColor"
>
<path
d="M13.586 3.586a2 2 0 112.828 2.828l-.793.793-2.828-2.828.793-.793zM11.379 5.793L3 14.172V17h2.828l8.38-8.379-2.83-2.828z"
/>
</svg>
</button>
</div>
<div class="mt-4 grid grid-cols-2 gap-2 text-sm text-gray-300">
<div>
<span class="text-gray-500">Track:</span> {server.track}
</div>
<div>
<span class="text-gray-500">Class:</span> {server.carClass}
</div>
<div>
<span class="text-gray-500">Players:</span> {server.players}
</div>
<div>
<span class="text-gray-500">Uptime:</span> {server.uptime}
</div>
<div>
<span class="text-gray-500">Track:</span>
{server.state.track}
</div>
<div>
<span class="text-gray-500">Players:</span>
{server.state.playerCount}
</div>
</div>
</div>
</a>
<form method="POST" action="?/start">
<div class="bg-gray-900 px-4 py-3 flex justify-between">
<div class="flex justify-between bg-gray-900 px-4 py-3">
<input type="hidden" name="id" value={server.id} />
<button
type="submit"
disabled={server.status.startsWith('SERVICE_RUNNING')}
onclick={(e) => e.stopPropagation()}
class="px-3 py-1 bg-green-600 hover:bg-green-700 rounded-md text-xs font-medium disabled:opacity-50 disabled:cursor-not-allowed"
class="rounded-md bg-green-600 px-3 py-1 text-xs font-medium hover:bg-green-700 disabled:cursor-not-allowed disabled:opacity-50"
>
Start
Start
</button>
<button
disabled={server.status.startsWith('SERVICE_STOPPED')}
onclick={(e) => e.stopPropagation()}
class="px-3 py-1 bg-yellow-600 hover:bg-yellow-700 rounded-md text-xs font-medium disabled:opacity-50 disabled:cursor-not-allowed"
class="rounded-md bg-yellow-600 px-3 py-1 text-xs font-medium hover:bg-yellow-700 disabled:cursor-not-allowed disabled:opacity-50"
formaction="?/restart"
>
Restart
Restart
</button>
<button
disabled={server.status.startsWith('SERVICE_STOPPED')}
onclick={(e) => e.stopPropagation()}
class="px-3 py-1 bg-red-600 hover:bg-red-700 rounded-md text-xs font-medium disabled:opacity-50 disabled:cursor-not-allowed"
class="rounded-md bg-red-600 px-3 py-1 text-xs font-medium hover:bg-red-700 disabled:cursor-not-allowed disabled:opacity-50"
formaction="?/stop"
>
Stop
Stop
</button>
</div>
</form>

8
src/models/server.ts
View File

@@ -1,5 +1,13 @@
interface State {
session: string;
playerCount: number;
track: string;
maxConnections: number;
}
export interface Server {
id: number;
name: string;
status: string;
state: State;
}