8
8
{{template "views/partials/navbar" .}}
9
9
< div class ="container mx-auto px-4 flex-grow ">
10
10
11
- < div class ="models mt-12 text-center ">
11
+ < div class ="workers mt-12 text-center ">
12
12
< h2 class ="text-3xl font-semibold text-gray-100 mb-8 ">
13
- < i class ="fa-solid fa-network-wired "> </ i > P2P Network</ h2 >
14
-
15
- < div class ="bg-gray-800 p-6 rounded-lg shadow-lg mb-8 inline-block ">
16
- < p class ="text-xl font-semibold text-gray-200 "> Total Workers Detected: {{ len .Nodes}}</ p >
17
- {{ $online:=0 }}
18
- {{ range .Nodes }}
19
- {{ if .IsOnline }}
20
- {{ $online = add $online 1 }}
21
- {{ end }}
22
- {{ end }}
23
- < p class ="text-xl font-semibold text-gray-200 "> Total Online Workers: {{$online}}</ p >
24
- </ div >
13
+ < i class ="fa-solid fa-network-wired "> </ i > P2P Network
14
+ < a href ="https://localai.io/features/distribute/ " target ="_blank ">
15
+ < i class ="fas fa-circle-info pr-2 "> </ i >
16
+ </ a >
17
+ </ h2 >
25
18
26
19
< div class ="bg-gray-800 p-6 rounded-lg shadow-lg mb-8 inline-block text-left ">
27
20
< h3 class ="text-2xl font-semibold text-gray-100 mb-4 "> Start a New Worker</ h3 >
@@ -32,11 +25,32 @@ <h3 class="text-2xl font-semibold text-gray-100 mb-4">Start a New Worker</h3>
32
25
</ code >
33
26
</ div >
34
27
35
- < div class ="text-center text-xs font-semibold text-gray-100 ">
28
+ < div class ="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 gap-4 mb-8 ">
29
+ < div class ="bg-gray-800 p-6 rounded-lg shadow-lg text-left ">
30
+ < p class ="text-xl font-semibold text-gray-200 "> Total Workers Detected: {{ len .Nodes }}</ p >
31
+ {{ $online := 0 }}
32
+ {{ range .Nodes }}
33
+ {{ if .IsOnline }}
34
+ {{ $online = add $online 1 }}
35
+ {{ end }}
36
+ {{ end }}
37
+ < p class ="text-xl font-semibold text-gray-200 "> Total Online Workers: {{$online}}</ p >
38
+ </ div >
39
+
36
40
{{ range .Nodes }}
37
- < button hx-post ="/browse/search/models " class ="text-blue-500 hover:text-blue-300 "
38
- hx-target ="#search-results " hx-vals ='{"search": "{{.ID}}"} '
39
- hx-indicator =".htmx-indicator " > {{.ID}} (Online: {{.IsOnline}})</ button >
41
+ < div class ="bg-gray-800 p-4 rounded-lg shadow-lg text-left ">
42
+ < div class ="flex items-center mb-2 ">
43
+ < i class ="fas fa-desktop text-gray-400 mr-2 "> </ i >
44
+ < span class ="text-gray-200 font-semibold "> {{.ID}}</ span >
45
+ </ div >
46
+ < p class ="text-sm text-gray-400 mt-2 flex items-center ">
47
+ Status:
48
+ < i class ="fas fa-circle {{ if .IsOnline }}text-green-500{{ else }}text-red-500{{ end }} ml-2 mr-1 "> </ i >
49
+ < span class ="{{ if .IsOnline }}text-green-400{{ else }}text-red-400{{ end }} ">
50
+ {{ if .IsOnline }}Online{{ else }}Offline{{ end }}
51
+ </ span >
52
+ </ p >
53
+ </ div >
40
54
{{ end }}
41
55
</ div >
42
56
</ div >
@@ -49,6 +63,11 @@ <h3 class="text-2xl font-semibold text-gray-100 mb-4">Start a New Worker</h3>
49
63
.token {
50
64
word-break : break-all;
51
65
}
66
+ .workers .grid div {
67
+ display : flex;
68
+ flex-direction : column;
69
+ justify-content : space-between;
70
+ }
52
71
</ style >
53
72
54
73
</ body >
0 commit comments