mirror of
https://github.com/muety/wakapi.git
synced 2023-08-10 21:12:56 +03:00
feat: ui for managing project labels
This commit is contained in:
@@ -203,6 +203,73 @@
|
||||
</div>
|
||||
</details>
|
||||
|
||||
<details class="mb-8 pb-8 border-b border-gray-700">
|
||||
<summary class="cursor-pointer">
|
||||
<h2 class="font-semibold text-lg text-white m-0 border-b-2 border-green-700 inline-block">
|
||||
Project Labels
|
||||
</h2>
|
||||
</summary>
|
||||
<div class="w-full" id="project-labels">
|
||||
<div class="text-gray-300 text-sm mb-4 mt-6">
|
||||
You can assign labels (aka. tags) to projects to group them together, e.g. by <span class="inline-block mb-1 text-gray-500 italic">private</span> and <span
|
||||
class="inline-block mb-1 text-gray-500 italic">work</span>.
|
||||
</div>
|
||||
|
||||
{{ if .Labels }}
|
||||
<h3 class="inline-block font-semibold text-md border-b border-green-700 text-white">Labels</h3>
|
||||
{{ range $i, $label := .Labels }}
|
||||
<div class="flex items-center" action="" method="post">
|
||||
<div class="text-gray-500 border-1 w-full border-green-700 inline-block my-1 py-1 text-align text-sm"
|
||||
style="line-height: 1.8">
|
||||
▸ <span class="font-semibold text-white">{{ $label.Key }}:</span>
|
||||
{{ range $j, $value := $label.Values }}
|
||||
<form action="" method="post" class="text-white text-xs bg-gray-900 rounded-full py-1 px-2 font-mono inline-flex justify-between items-center space-x-2">
|
||||
<input type="hidden" name="action" value="delete_label">
|
||||
<input type="hidden" name="key" value="{{ $label.Key }}">
|
||||
<input type="hidden" name="value" value="{{ $value }}">
|
||||
<span>{{- $value -}}</span>
|
||||
<button type="submit" class="bg-gray-800 text-center hover:bg-gray-700 rounded-full w-4 h-4 leading-none" title="Delete label">x</button>
|
||||
</form>
|
||||
{{ if lt $j (add (len $label.Values) -1) }}
|
||||
<span class="-ml-1">{{- ", " | capitalize -}}</span>
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
</div>
|
||||
</div>
|
||||
{{end}}
|
||||
<div class="mb-8"></div>
|
||||
{{end}}
|
||||
|
||||
{{ if .Projects }}
|
||||
<h3 class="inline-block font-semibold text-md border-b border-green-700 text-white mb-2">Add Label</h3>
|
||||
<form action="" method="post">
|
||||
<input type="hidden" name="action" value="add_label">
|
||||
<div class="flex items-center mt-2 w-full text-gray-500 text-sm">
|
||||
<span class="mr-2">Project:</span>
|
||||
<select name="key" id="select-project"
|
||||
class="shadow appearance-nonshadow appearance-none bg-gray-800 focus:bg-gray-700 text-gray-300 border-green-700 focus:border-gray-500 border rounded py-1 px-3 cursor-pointer">
|
||||
{{ range $i, $p := .Projects }}
|
||||
<option value="{{ $p }}">{{ $p }}</option>
|
||||
{{ end }}
|
||||
</select>
|
||||
<span class="ml-8 mr-2">Label:</span>
|
||||
<input class="shadow appearance-nonshadow appearance-none bg-gray-800 focus:bg-gray-700 text-gray-300 border-green-700 focus:border-gray-500 border rounded py-1 px-3"
|
||||
type="text" id="label-value" style="width: 130px;"
|
||||
name="value" placeholder="work" minlength="1" required>
|
||||
<div class="flex-grow flex justify-end">
|
||||
<button type="submit"
|
||||
class="py-1 px-3 rounded bg-green-700 hover:bg-green-800 text-white text-sm">
|
||||
Add
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
{{ else }}
|
||||
<div class="text-gray-300 text-sm mb-4 mt-6">You don't have any projects, yet. Start out by sending a few heartbeats before you can then assign labels.</div>
|
||||
{{ end }}
|
||||
</div>
|
||||
</details>
|
||||
|
||||
<details class="mb-8 pb-8 border-b border-gray-700">
|
||||
<summary class="cursor-pointer">
|
||||
<h2 class="font-semibold text-lg text-white m-0 border-b-2 border-green-700 inline-block"
|
||||
@@ -662,16 +729,8 @@
|
||||
|
||||
// Time zone stuff
|
||||
|
||||
const userTimeZone = {
|
||||
{ .
|
||||
User.Location
|
||||
}
|
||||
}
|
||||
const userTzOffset = {
|
||||
{ .
|
||||
User.TZOffset.Hours
|
||||
}
|
||||
}
|
||||
const userTimeZone = {{ .User.Location }}
|
||||
const userTzOffset = {{ .User.TZOffset.Hours }}
|
||||
const selectTimezone = document.getElementById('select-timezone')
|
||||
const createTzOption = (tz) => {
|
||||
if (!tz) tz = 'Local'
|
||||
|
||||
Reference in New Issue
Block a user