mirror of
https://github.com/vitodeploy/vito.git
synced 2025-07-02 22:46:16 +00:00
Tags (#277)
This commit is contained in:
Saeed Vaziry
GitHub
64
resources/views/components/autocomplete-text.blade.php
Normal file
64
resources/views/components/autocomplete-text.blade.php
Normal file
@ -0,0 +1,64 @@
|
||||
@props([
|
||||
"id",
|
||||
"name",
|
||||
"placeholder" => "Search...",
|
||||
"items" => [],
|
||||
"maxResults" => 5,
|
||||
"value" => "",
|
||||
])
|
||||
|
||||
<script>
|
||||
window['items_' + @js($id)] = @json($items);
|
||||
</script>
|
||||
|
||||
<div
|
||||
x-data="{
|
||||
q: @js($value),
|
||||
items: window['items_' + @js($id)],
|
||||
resultItems: window['items_' + @js($id)],
|
||||
maxResults: @js($maxResults),
|
||||
init() {
|
||||
this.search()
|
||||
},
|
||||
search() {
|
||||
if (! this.q) {
|
||||
this.resultItems = this.items.slice(0, this.maxResults)
|
||||
return
|
||||
}
|
||||
this.resultItems = this.items
|
||||
.filter((item) => item.toLowerCase().includes(this.q.toLowerCase()))
|
||||
.slice(0, this.maxResults)
|
||||
},
|
||||
}"
|
||||
>
|
||||
<input type="hidden" name="{{ $name }}" x-ref="input" x-model="q" />
|
||||
<x-dropdown width="full" :hide-if-empty="true">
|
||||
<x-slot name="trigger">
|
||||
<x-text-input
|
||||
id="$id . '-q"
|
||||
x-model="q"
|
||||
type="text"
|
||||
class="mt-1 w-full"
|
||||
:placeholder="$placeholder"
|
||||
autocomplete="off"
|
||||
x-on:input.debounce.100ms="search"
|
||||
/>
|
||||
</x-slot>
|
||||
<x-slot name="content">
|
||||
<div
|
||||
id="{{ $id }}-items-list"
|
||||
x-bind:class="
|
||||
resultItems.length > 0
|
||||
? 'py-1 border border-gray-200 dark:border-gray-600 rounded-md'
|
||||
: ''
|
||||
"
|
||||
>
|
||||
<template x-for="item in resultItems">
|
||||
<x-dropdown-link class="cursor-pointer" x-on:click="q = item">
|
||||
<span x-text="item"></span>
|
||||
</x-dropdown-link>
|
||||
</template>
|
||||
</div>
|
||||
</x-slot>
|
||||
</x-dropdown>
|
||||
</div>
|
||||
10
resources/views/components/dropdown-trigger.blade.php
Normal file
10
resources/views/components/dropdown-trigger.blade.php
Normal file
@ -0,0 +1,10 @@
|
||||
<div>
|
||||
<div
|
||||
class="block w-full cursor-pointer rounded-md border border-gray-300 p-2.5 text-sm focus:border-primary-500 focus:ring-primary-500 dark:border-gray-700 dark:bg-gray-900 dark:text-gray-300 dark:focus:border-primary-600 dark:focus:ring-primary-600"
|
||||
>
|
||||
{{ $slot }}
|
||||
</div>
|
||||
<button type="button" class="absolute inset-y-0 right-0 flex items-center pr-2">
|
||||
<x-heroicon name="o-chevron-down" class="h-4 w-4 text-gray-400" />
|
||||
</button>
|
||||
</div>
|
||||
@ -2,12 +2,18 @@
|
||||
"open" => false,
|
||||
"align" => "right",
|
||||
"width" => "48",
|
||||
"contentClasses" => "list-none divide-y divide-gray-100 rounded-md border border-gray-200 bg-white py-1 text-base dark:divide-gray-600 dark:border-gray-600 dark:bg-gray-700",
|
||||
"contentClasses" => "list-none divide-y divide-gray-100 rounded-md bg-white text-base dark:divide-gray-600 dark:bg-gray-700",
|
||||
"search" => false,
|
||||
"searchUrl" => "",
|
||||
"hideIfEmpty" => false,
|
||||
"closeOnClick" => true,
|
||||
])
|
||||
|
||||
@php
|
||||
if (! $hideIfEmpty) {
|
||||
$contentClasses .= " py-1 border border-gray-200 dark:border-gray-600";
|
||||
}
|
||||
|
||||
switch ($align) {
|
||||
case "left":
|
||||
$alignmentClasses = "left-0 origin-top-left";
|
||||
@ -25,6 +31,9 @@
|
||||
case "48":
|
||||
$width = "w-48";
|
||||
break;
|
||||
case "56":
|
||||
$width = "w-56";
|
||||
break;
|
||||
case "full":
|
||||
$width = "w-full";
|
||||
break;
|
||||
@ -46,31 +55,9 @@
|
||||
x-transition:leave-end="scale-95 transform opacity-0"
|
||||
class="{{ $width }} {{ $alignmentClasses }} absolute z-50 mt-2 rounded-md"
|
||||
style="display: none"
|
||||
@click="open = false"
|
||||
@if ($closeOnClick) @click="open = false" @endif
|
||||
>
|
||||
<div class="{{ $contentClasses }} rounded-md">
|
||||
@if ($search)
|
||||
<div class="p-2">
|
||||
<input
|
||||
type="text"
|
||||
x-ref="search"
|
||||
x-model="search"
|
||||
x-on:keydown.window.prevent.enter="open = false"
|
||||
x-on:keydown.window.prevent.escape="open = false"
|
||||
x-on:keydown.window.prevent.arrow-up="
|
||||
open = true
|
||||
$refs.search.focus()
|
||||
"
|
||||
x-on:keydown.window.prevent.arrow-down="
|
||||
open = true
|
||||
$refs.search.focus()
|
||||
"
|
||||
class="w-full rounded-md border border-gray-200 p-2"
|
||||
placeholder="Search..."
|
||||
/>
|
||||
</div>
|
||||
@endif
|
||||
|
||||
{{ $content }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
14
resources/views/components/heroicons/o-funnel.blade.php
Normal file
14
resources/views/components/heroicons/o-funnel.blade.php
Normal file
@ -0,0 +1,14 @@
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
fill="none"
|
||||
viewBox="0 0 24 24"
|
||||
stroke-width="1.5"
|
||||
stroke="currentColor"
|
||||
{{ $attributes }}
|
||||
>
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
d="M12 3c2.755 0 5.455.232 8.083.678.533.09.917.556.917 1.096v1.044a2.25 2.25 0 0 1-.659 1.591l-5.432 5.432a2.25 2.25 0 0 0-.659 1.591v2.927a2.25 2.25 0 0 1-1.244 2.013L9.75 21v-6.568a2.25 2.25 0 0 0-.659-1.591L3.659 7.409A2.25 2.25 0 0 1 3 5.818V4.774c0-.54.384-1.006.917-1.096A48.32 48.32 0 0 1 12 3Z"
|
||||
/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 556 B |
10
resources/views/components/heroicons/o-plus.blade.php
Normal file
10
resources/views/components/heroicons/o-plus.blade.php
Normal file
@ -0,0 +1,10 @@
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
fill="none"
|
||||
viewBox="0 0 24 24"
|
||||
stroke-width="1.5"
|
||||
stroke="currentColor"
|
||||
{{ $attributes }}
|
||||
>
|
||||
<path stroke-linecap="round" stroke-linejoin="round" d="M12 4.5v15m7.5-7.5h-15" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 251 B |
15
resources/views/components/heroicons/o-tag.blade.php
Normal file
15
resources/views/components/heroicons/o-tag.blade.php
Normal file
@ -0,0 +1,15 @@
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
fill="none"
|
||||
viewBox="0 0 24 24"
|
||||
stroke-width="1.5"
|
||||
stroke="currentColor"
|
||||
{{ $attributes }}
|
||||
>
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
d="M9.568 3H5.25A2.25 2.25 0 0 0 3 5.25v4.318c0 .597.237 1.17.659 1.591l9.581 9.581c.699.699 1.78.872 2.607.33a18.095 18.095 0 0 0 5.223-5.223c.542-.827.369-1.908-.33-2.607L11.16 3.66A2.25 2.25 0 0 0 9.568 3Z"
|
||||
/>
|
||||
<path stroke-linecap="round" stroke-linejoin="round" d="M6 6h.008v.008H6V6Z" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 546 B |
@ -73,7 +73,7 @@ class="fixed inset-0 transform transition-all"
|
||||
|
||||
<div
|
||||
x-show="show"
|
||||
class="{{ $maxWidth }} mb-6 transform overflow-hidden rounded-lg bg-white shadow-xl transition-all dark:bg-gray-800 sm:mx-auto sm:w-full"
|
||||
class="{{ $maxWidth }} mb-6 transform overflow-visible rounded-lg bg-white shadow-xl transition-all dark:bg-gray-800 sm:mx-auto sm:w-full"
|
||||
x-transition:enter="duration-300 ease-out"
|
||||
x-transition:enter-start="translate-y-4 opacity-0 sm:translate-y-0 sm:scale-95"
|
||||
x-transition:enter-end="translate-y-0 opacity-100 sm:scale-100"
|
||||
|
||||
@ -71,5 +71,6 @@
|
||||
</script>
|
||||
<x-toast />
|
||||
<x-htmx-error-handler />
|
||||
@stack("footer")
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@ -11,7 +11,12 @@
|
||||
</div>
|
||||
</header>
|
||||
@else
|
||||
<h2 class="text-lg font-semibold">{{ $server->name }}</h2>
|
||||
<div class="flex items-center">
|
||||
<h2 class="text-lg font-semibold">{{ $server->name }}</h2>
|
||||
<div class="ml-2">
|
||||
@include("settings.tags.tags", ["taggable" => $server])
|
||||
</div>
|
||||
</div>
|
||||
@endif
|
||||
|
||||
<div class="flex flex-col items-end">
|
||||
|
||||
@ -161,6 +161,13 @@ class="fixed left-0 top-0 z-40 h-screen w-64 -translate-x-full border-r border-g
|
||||
<x-hr />
|
||||
@endif
|
||||
|
||||
<li>
|
||||
<x-sidebar-link :href="route('servers')" :active="request()->routeIs('servers')">
|
||||
<x-heroicon name="o-server" class="h-6 w-6" />
|
||||
<span class="ml-2">Servers</span>
|
||||
</x-sidebar-link>
|
||||
</li>
|
||||
|
||||
<li>
|
||||
<x-sidebar-link :href="route('scripts.index')" :active="request()->routeIs('scripts.*')">
|
||||
<x-heroicon name="o-bolt" class="h-6 w-6" />
|
||||
@ -239,6 +246,12 @@ class="fixed left-0 top-0 z-40 h-screen w-64 -translate-x-full border-r border-g
|
||||
<span class="ml-2">SSH Keys</span>
|
||||
</x-sidebar-link>
|
||||
</li>
|
||||
<li>
|
||||
<x-sidebar-link :href="route('settings.tags')" :active="request()->routeIs('settings.tags')">
|
||||
<x-heroicon name="o-tag" class="h-6 w-6" />
|
||||
<span class="ml-2">Tags</span>
|
||||
</x-sidebar-link>
|
||||
</li>
|
||||
@endif
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
@ -110,4 +110,15 @@ class="mt-2 md:ml-2 md:mt-0"
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="py-5">
|
||||
<div class="border-t border-gray-200 dark:border-gray-700"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex items-center justify-between">
|
||||
<div>{{ __("Tags") }}</div>
|
||||
<div>
|
||||
@include("settings.tags.tags", ["taggable" => $server, "edit" => true])
|
||||
</div>
|
||||
</div>
|
||||
</x-card>
|
||||
|
||||
@ -9,40 +9,73 @@
|
||||
</x-slot>
|
||||
</x-card-header>
|
||||
|
||||
<x-live id="live-servers-list">
|
||||
@if (count($servers) > 0)
|
||||
<div class="space-y-3">
|
||||
@foreach ($servers as $server)
|
||||
<a href="{{ route("servers.show", ["server" => $server]) }}" class="block">
|
||||
<x-item-card>
|
||||
<div class="flex-none">
|
||||
<img
|
||||
src="{{ asset("static/images/" . $server->provider . ".svg") }}"
|
||||
class="h-10 w-10"
|
||||
alt=""
|
||||
/>
|
||||
</div>
|
||||
<div class="ml-3 flex flex-grow flex-col items-start justify-center">
|
||||
<span class="mb-1">{{ $server->name }}</span>
|
||||
<span class="text-sm text-gray-400">
|
||||
{{ $server->ip }}
|
||||
</span>
|
||||
</div>
|
||||
<div class="flex items-center">
|
||||
<div class="inline">
|
||||
@include("servers.partials.server-status", ["server" => $server])
|
||||
</div>
|
||||
</div>
|
||||
</x-item-card>
|
||||
</a>
|
||||
@endforeach
|
||||
</div>
|
||||
@else
|
||||
<x-simple-card>
|
||||
<div class="text-center">
|
||||
{{ __("You don't have any servers yet!") }}
|
||||
<div class="space-y-3">
|
||||
<x-live id="live-servers-list">
|
||||
@if (count($servers) > 0)
|
||||
<div class="space-y-3">
|
||||
<x-table>
|
||||
<x-thead>
|
||||
<x-tr>
|
||||
<x-th>Name</x-th>
|
||||
<x-th>IP</x-th>
|
||||
<x-th>Tags</x-th>
|
||||
<x-th>Status</x-th>
|
||||
<x-th></x-th>
|
||||
</x-tr>
|
||||
</x-thead>
|
||||
<x-tbody>
|
||||
@foreach ($servers as $server)
|
||||
<x-tr>
|
||||
<x-td>
|
||||
<div class="flex items-center">
|
||||
<img
|
||||
src="{{ asset("static/images/" . $server->provider . ".svg") }}"
|
||||
class="mr-1 h-5 w-5"
|
||||
alt=""
|
||||
/>
|
||||
<a
|
||||
href="{{ route("servers.show", ["server" => $server]) }}"
|
||||
class="hover:underline"
|
||||
>
|
||||
{{ $server->name }}
|
||||
</a>
|
||||
</div>
|
||||
</x-td>
|
||||
<x-td>{{ $server->ip }}</x-td>
|
||||
<x-td>
|
||||
@include("settings.tags.tags", ["taggable" => $server, "oobOff" => true])
|
||||
</x-td>
|
||||
<x-td>
|
||||
@include("servers.partials.server-status", ["server" => $server])
|
||||
</x-td>
|
||||
<x-td>
|
||||
<div class="flex items-center justify-end">
|
||||
<x-icon-button
|
||||
:href="route('servers.show', ['server' => $server])"
|
||||
data-tooltip="Show Server"
|
||||
>
|
||||
<x-heroicon name="o-eye" class="h-5 w-5" />
|
||||
</x-icon-button>
|
||||
<x-icon-button
|
||||
:href="route('servers.settings', ['server' => $server])"
|
||||
data-tooltip="Settings"
|
||||
>
|
||||
<x-heroicon name="o-wrench-screwdriver" class="h-5 w-5" />
|
||||
</x-icon-button>
|
||||
</div>
|
||||
</x-td>
|
||||
</x-tr>
|
||||
@endforeach
|
||||
</x-tbody>
|
||||
</x-table>
|
||||
</div>
|
||||
</x-simple-card>
|
||||
@endif
|
||||
</x-live>
|
||||
@else
|
||||
<x-simple-card>
|
||||
<div class="text-center">
|
||||
{{ __("You don't have any servers yet!") }}
|
||||
</div>
|
||||
</x-simple-card>
|
||||
@endif
|
||||
</x-live>
|
||||
</div>
|
||||
</x-container>
|
||||
|
||||
41
resources/views/settings/tags/attach.blade.php
Normal file
41
resources/views/settings/tags/attach.blade.php
Normal file
@ -0,0 +1,41 @@
|
||||
<div x-data="">
|
||||
<button type="button" class="flex items-center" x-on:click="$dispatch('open-modal', 'create-tag-modal')">
|
||||
<x-heroicon name="o-plus" class="h-5 w-5 text-gray-500 dark:text-gray-400" />
|
||||
<span class="text-md">New Tag</span>
|
||||
</button>
|
||||
@push("footer")
|
||||
<x-modal name="create-tag-modal" max-width="sm">
|
||||
<form
|
||||
id="create-tag-form"
|
||||
hx-post="{{ route("tags.attach") }}"
|
||||
hx-swap="outerHTML"
|
||||
hx-select="#create-tag-form"
|
||||
class="p-6"
|
||||
>
|
||||
<h2 class="text-lg font-medium text-gray-900 dark:text-gray-100">New Tag</h2>
|
||||
|
||||
<input type="hidden" name="taggable_type" value="{{ get_class($taggable) }}" />
|
||||
<input type="hidden" name="taggable_id" value="{{ $taggable->id }}" />
|
||||
|
||||
<div class="mt-6">
|
||||
@include("settings.tags.fields.name",["value" => old("name"),"items" => auth()->user()->currentProject->tags()->pluck("name"),])
|
||||
</div>
|
||||
|
||||
<div class="mt-6 flex justify-end">
|
||||
<x-secondary-button type="button" x-on:click="$dispatch('close')">Cancel</x-secondary-button>
|
||||
<x-primary-button class="ml-3" hx-disable>Save</x-primary-button>
|
||||
</div>
|
||||
|
||||
@if (session()->has("status") && session()->get("status") === "tag-created")
|
||||
<script defer>
|
||||
window.dispatchEvent(
|
||||
new CustomEvent('close-modal', {
|
||||
detail: 'create-tag-modal'
|
||||
})
|
||||
);
|
||||
</script>
|
||||
@endif
|
||||
</form>
|
||||
</x-modal>
|
||||
@endpush
|
||||
</div>
|
||||
31
resources/views/settings/tags/fields/color.blade.php
Normal file
31
resources/views/settings/tags/fields/color.blade.php
Normal file
@ -0,0 +1,31 @@
|
||||
@php($id = "color-" . uniqid())
|
||||
<div x-data="{
|
||||
value: '{{ $value }}',
|
||||
}">
|
||||
<x-input-label for="color" :value="__('Color')" />
|
||||
<input x-bind:value="value" id="{{ $id }}" name="color" type="hidden" />
|
||||
<x-dropdown class="relative" align="left">
|
||||
<x-slot name="trigger">
|
||||
<x-dropdown-trigger>
|
||||
<div class="flex items-center">
|
||||
<div x-show="value" x-bind:class="`bg-${value}-500 mr-1 h-3 w-3 rounded-full`"></div>
|
||||
<span x-text="value || 'Select a color'"></span>
|
||||
</div>
|
||||
</x-dropdown-trigger>
|
||||
</x-slot>
|
||||
|
||||
<x-slot name="content">
|
||||
<div class="z-50 max-h-[200px] overflow-y-auto">
|
||||
@foreach (config("core.tag_colors") as $color)
|
||||
<x-dropdown-link href="#" x-on:click="value = '{{ $color }}'" class="flex items-center capitalize">
|
||||
<div class="bg-{{ $color }}-500 mr-1 h-3 w-3 rounded-full"></div>
|
||||
{{ $color }}
|
||||
</x-dropdown-link>
|
||||
@endforeach
|
||||
</div>
|
||||
</x-slot>
|
||||
</x-dropdown>
|
||||
@error("color")
|
||||
<x-input-error class="mt-2" :messages="$message" />
|
||||
@enderror
|
||||
</div>
|
||||
12
resources/views/settings/tags/fields/name.blade.php
Normal file
12
resources/views/settings/tags/fields/name.blade.php
Normal file
@ -0,0 +1,12 @@
|
||||
@php
|
||||
$id = "name-" . uniqid();
|
||||
if (! isset($items)) {
|
||||
$items = [];
|
||||
}
|
||||
@endphp
|
||||
|
||||
<x-input-label :for="$id" :value="__('Name')" />
|
||||
<x-autocomplete-text id="tag-name" name="name" :items="$items" :value="$value" placeholder="" />
|
||||
@error("name")
|
||||
<x-input-error class="mt-2" :messages="$message" />
|
||||
@enderror
|
||||
5
resources/views/settings/tags/index.blade.php
Normal file
5
resources/views/settings/tags/index.blade.php
Normal file
@ -0,0 +1,5 @@
|
||||
<x-settings-layout>
|
||||
<x-slot name="pageTitle">{{ __("Tags") }}</x-slot>
|
||||
|
||||
@include("settings.tags.partials.tags-list")
|
||||
</x-settings-layout>
|
||||
42
resources/views/settings/tags/manage.blade.php
Normal file
42
resources/views/settings/tags/manage.blade.php
Normal file
@ -0,0 +1,42 @@
|
||||
<x-modal name="manage-tags-modal">
|
||||
<div class="p-6">
|
||||
<div class="flex items-center justify-between">
|
||||
<h2 class="text-lg font-medium text-gray-900 dark:text-gray-100">Manage Tags</h2>
|
||||
@include("settings.tags.attach", ["taggable" => $taggable])
|
||||
</div>
|
||||
|
||||
<x-table id="tags-{{ $taggable->id }}" class="mt-6" hx-swap-oob="outerHTML">
|
||||
<x-thead>
|
||||
<x-tr>
|
||||
<x-th>Name</x-th>
|
||||
<x-th></x-th>
|
||||
</x-tr>
|
||||
</x-thead>
|
||||
<x-tbody>
|
||||
@foreach ($taggable->tags as $tag)
|
||||
<x-tr>
|
||||
<x-td>
|
||||
<div class="flex items-center">
|
||||
<div class="bg-{{ $tag->color }}-500 mr-1 h-3 w-3 rounded-full"></div>
|
||||
{{ $tag->name }}
|
||||
</div>
|
||||
</x-td>
|
||||
<x-td class="text-right">
|
||||
<form
|
||||
id="detach-tag-{{ $tag->id }}"
|
||||
hx-post="{{ route("tags.detach", ["tag" => $tag]) }}"
|
||||
hx-swap="outerHTML"
|
||||
>
|
||||
<input type="hidden" name="taggable_type" value="{{ get_class($taggable) }}" />
|
||||
<input type="hidden" name="taggable_id" value="{{ $taggable->id }}" />
|
||||
<x-icon-button>
|
||||
<x-heroicon name="o-trash" class="h-5 w-5 text-gray-500 dark:text-gray-400" />
|
||||
</x-icon-button>
|
||||
</form>
|
||||
</x-td>
|
||||
</x-tr>
|
||||
@endforeach
|
||||
</x-tbody>
|
||||
</x-table>
|
||||
</div>
|
||||
</x-modal>
|
||||
41
resources/views/settings/tags/partials/create-tag.blade.php
Normal file
41
resources/views/settings/tags/partials/create-tag.blade.php
Normal file
@ -0,0 +1,41 @@
|
||||
<div>
|
||||
<x-primary-button x-data="" x-on:click.prevent="$dispatch('open-modal', 'create-tag')">
|
||||
{{ __("Create Tag") }}
|
||||
</x-primary-button>
|
||||
|
||||
<x-modal name="create-tag">
|
||||
<form
|
||||
id="create-tag-form"
|
||||
hx-post="{{ route("settings.tags.create") }}"
|
||||
hx-swap="outerHTML"
|
||||
hx-select="#create-tag-form"
|
||||
hx-ext="disable-element"
|
||||
hx-disable-element="#btn-create-tag"
|
||||
class="p-6"
|
||||
x-data="{}"
|
||||
>
|
||||
@csrf
|
||||
<h2 class="text-lg font-medium text-gray-900 dark:text-gray-100">
|
||||
{{ __("Create Tag") }}
|
||||
</h2>
|
||||
|
||||
<div class="mt-6">
|
||||
@include("settings.tags.fields.name", ["value" => old("name")])
|
||||
</div>
|
||||
|
||||
<div class="mt-6">
|
||||
@include("settings.tags.fields.color", ["value" => old("color")])
|
||||
</div>
|
||||
|
||||
<div class="mt-6 flex justify-end">
|
||||
<x-secondary-button type="button" x-on:click="$dispatch('close')">
|
||||
{{ __("Cancel") }}
|
||||
</x-secondary-button>
|
||||
|
||||
<x-primary-button id="btn-create-tag" class="ml-3">
|
||||
{{ __("Save") }}
|
||||
</x-primary-button>
|
||||
</div>
|
||||
</form>
|
||||
</x-modal>
|
||||
</div>
|
||||
18
resources/views/settings/tags/partials/delete-tag.blade.php
Normal file
18
resources/views/settings/tags/partials/delete-tag.blade.php
Normal file
@ -0,0 +1,18 @@
|
||||
<x-modal name="delete-tag" :show="$errors->isNotEmpty()">
|
||||
<form id="delete-tag-form" method="post" x-bind:action="deleteAction" class="p-6">
|
||||
@csrf
|
||||
@method("delete")
|
||||
|
||||
<h2 class="text-lg font-medium">Deleting a tag will detach it from all the resources that it has been used</h2>
|
||||
|
||||
<div class="mt-6 flex justify-end">
|
||||
<x-secondary-button type="button" x-on:click="$dispatch('close')">
|
||||
{{ __("Cancel") }}
|
||||
</x-secondary-button>
|
||||
|
||||
<x-danger-button class="ml-3">
|
||||
{{ __("Delete") }}
|
||||
</x-danger-button>
|
||||
</div>
|
||||
</form>
|
||||
</x-modal>
|
||||
39
resources/views/settings/tags/partials/edit-tag.blade.php
Normal file
39
resources/views/settings/tags/partials/edit-tag.blade.php
Normal file
@ -0,0 +1,39 @@
|
||||
<x-modal
|
||||
name="edit-tag"
|
||||
:show="true"
|
||||
x-on:modal-edit-tag-closed.window="window.history.pushState('', '', '{{ route('settings.tags') }}');"
|
||||
>
|
||||
<form
|
||||
id="edit-tag-form"
|
||||
hx-post="{{ route("settings.tags.update", ["tag" => $tag->id]) }}"
|
||||
hx-swap="outerHTML"
|
||||
hx-select="#edit-tag-form"
|
||||
hx-ext="disable-element"
|
||||
hx-disable-element="#btn-edit-tag"
|
||||
class="p-6"
|
||||
>
|
||||
@csrf
|
||||
|
||||
<h2 class="text-lg font-medium text-gray-900 dark:text-gray-100">
|
||||
{{ __("Edit Tag") }}
|
||||
</h2>
|
||||
|
||||
<div class="mt-6">
|
||||
@include("settings.tags.fields.name", ["value" => old("name", $tag->name)])
|
||||
</div>
|
||||
|
||||
<div class="mt-6">
|
||||
@include("settings.tags.fields.color", ["value" => old("color", $tag->color)])
|
||||
</div>
|
||||
|
||||
<div class="mt-6 flex justify-end">
|
||||
<x-secondary-button type="button" x-on:click="$dispatch('close')">
|
||||
{{ __("Cancel") }}
|
||||
</x-secondary-button>
|
||||
|
||||
<x-primary-button id="btn-edit-tag" class="ml-3">
|
||||
{{ __("Save") }}
|
||||
</x-primary-button>
|
||||
</div>
|
||||
</form>
|
||||
</x-modal>
|
||||
69
resources/views/settings/tags/partials/tags-list.blade.php
Normal file
69
resources/views/settings/tags/partials/tags-list.blade.php
Normal file
@ -0,0 +1,69 @@
|
||||
<div>
|
||||
<x-card-header>
|
||||
<x-slot name="title">{{ __("Tags") }}</x-slot>
|
||||
<x-slot name="description">
|
||||
{{ __("You can manage tags here") }}
|
||||
</x-slot>
|
||||
<x-slot name="aside">
|
||||
@include("settings.tags.partials.create-tag")
|
||||
</x-slot>
|
||||
</x-card-header>
|
||||
<div x-data="{ deleteAction: '' }" class="space-y-3">
|
||||
@if (count($tags) > 0)
|
||||
<x-table class="mt-6">
|
||||
<x-thead>
|
||||
<x-tr>
|
||||
<x-th>Name</x-th>
|
||||
<x-th></x-th>
|
||||
</x-tr>
|
||||
</x-thead>
|
||||
<x-tbody>
|
||||
@foreach ($tags as $tag)
|
||||
<x-tr>
|
||||
<x-td>
|
||||
<div class="flex items-center">
|
||||
<div class="bg-{{ $tag->color }}-500 mr-1 size-4 rounded-full"></div>
|
||||
{{ $tag->name }}
|
||||
</div>
|
||||
</x-td>
|
||||
<x-td class="text-right">
|
||||
<div class="inline">
|
||||
<x-icon-button
|
||||
id="edit-{{ $tag->id }}"
|
||||
hx-get="{{ route('settings.tags', ['edit' => $tag->id]) }}"
|
||||
hx-replace-url="true"
|
||||
hx-select="#edit"
|
||||
hx-target="#edit"
|
||||
hx-ext="disable-element"
|
||||
hx-disable-element="#edit-{{ $tag->id }}"
|
||||
>
|
||||
<x-heroicon name="o-pencil" class="h-5 w-5" />
|
||||
</x-icon-button>
|
||||
<x-icon-button
|
||||
x-on:click="deleteAction = '{{ route('settings.tags.delete', ['tag' => $tag]) }}'; $dispatch('open-modal', 'delete-tag')"
|
||||
>
|
||||
<x-heroicon name="o-trash" class="h-5 w-5" />
|
||||
</x-icon-button>
|
||||
</div>
|
||||
</x-td>
|
||||
</x-tr>
|
||||
@endforeach
|
||||
</x-tbody>
|
||||
</x-table>
|
||||
|
||||
@include("settings.tags.partials.delete-tag")
|
||||
|
||||
<div id="edit">
|
||||
@if (isset($editTag))
|
||||
@include("settings.tags.partials.edit-tag", ["tag" => $editTag])
|
||||
@endif
|
||||
</div>
|
||||
@else
|
||||
<x-simple-card>
|
||||
<div class="text-center">
|
||||
{{ __("You don't have any tags yet!") }}
|
||||
</div>
|
||||
</x-simple-card>
|
||||
@endif
|
||||
</div>
|
||||
</div>
|
||||
30
resources/views/settings/tags/tags.blade.php
Normal file
30
resources/views/settings/tags/tags.blade.php
Normal file
@ -0,0 +1,30 @@
|
||||
<div x-data="">
|
||||
<div class="inline-flex gap-1">
|
||||
<div
|
||||
id="tags-list-{{ $taggable->id }}"
|
||||
class="inline-flex gap-1"
|
||||
@if (! isset($oobOff) || ! $oobOff)
|
||||
hx-swap-oob="outerHTML"
|
||||
@endif
|
||||
>
|
||||
@foreach ($taggable->tags as $tag)
|
||||
<div
|
||||
class="border-{{ $tag->color }}-300 bg-{{ $tag->color }}-50 text-{{ $tag->color }}-500 dark:border-{{ $tag->color }}-600 dark:bg-{{ $tag->color }}-500 flex max-w-max items-center rounded-md border px-2 py-1 text-xs dark:bg-opacity-10"
|
||||
>
|
||||
<x-heroicon name="o-tag" class="mr-1 size-4" />
|
||||
{{ $tag->name }}
|
||||
</div>
|
||||
@endforeach
|
||||
</div>
|
||||
|
||||
@if (isset($edit) && $edit)
|
||||
<a
|
||||
x-on:click="$dispatch('open-modal', 'manage-tags-modal')"
|
||||
class="flex max-w-max cursor-pointer items-center justify-center rounded-md border border-gray-300 bg-gray-50 px-2 py-1 text-xs text-gray-500 dark:border-gray-600 dark:bg-gray-500 dark:bg-opacity-10"
|
||||
>
|
||||
<x-heroicon name="o-pencil" class="h-3 w-3" />
|
||||
</a>
|
||||
@include("settings.tags.manage")
|
||||
@endif
|
||||
</div>
|
||||
</div>
|
||||
@ -1,6 +1,8 @@
|
||||
<x-site-layout :site="$site">
|
||||
<x-slot name="pageTitle">{{ __("Settings") }}</x-slot>
|
||||
|
||||
@include("site-settings.partials.site-details")
|
||||
|
||||
@include("site-settings.partials.change-php-version")
|
||||
|
||||
@include("site-settings.partials.update-aliases")
|
||||
|
||||
@ -0,0 +1,56 @@
|
||||
<x-card id="server-details">
|
||||
<x-slot name="title">{{ __("Details") }}</x-slot>
|
||||
<x-slot name="description">
|
||||
{{ __("More details about your site") }}
|
||||
</x-slot>
|
||||
<div class="flex items-center justify-between">
|
||||
<div>{{ __("Created At") }}</div>
|
||||
<div>
|
||||
<x-datetime :value="$site->created_at" />
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="py-5">
|
||||
<div class="border-t border-gray-200 dark:border-gray-700"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex items-center justify-between">
|
||||
<div>{{ __("Type") }}</div>
|
||||
<div class="capitalize">{{ $site->type }}</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="py-5">
|
||||
<div class="border-t border-gray-200 dark:border-gray-700"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex items-center justify-between">
|
||||
<div>{{ __("Site ID") }}</div>
|
||||
<div class="flex items-center">
|
||||
<span class="rounded-md bg-gray-100 p-1 dark:bg-gray-700">
|
||||
{{ $site->id }}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="py-5">
|
||||
<div class="border-t border-gray-200 dark:border-gray-700"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex items-center justify-between">
|
||||
<div>{{ __("Status") }}</div>
|
||||
<div class="flex items-center">
|
||||
@include("sites.partials.site-status")
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="py-5">
|
||||
<div class="border-t border-gray-200 dark:border-gray-700"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex items-center justify-between">
|
||||
<div>{{ __("Tags") }}</div>
|
||||
<div>
|
||||
@include("settings.tags.tags", ["taggable" => $site, "edit" => true])
|
||||
</div>
|
||||
</div>
|
||||
</x-card>
|
||||
@ -12,30 +12,63 @@
|
||||
<x-live id="live-sites">
|
||||
@if (count($sites) > 0)
|
||||
<div class="space-y-3">
|
||||
@foreach ($sites as $site)
|
||||
<a href="{{ route("servers.sites.show", ["server" => $server, "site" => $site]) }}" class="block">
|
||||
<x-item-card>
|
||||
<div class="flex-none">
|
||||
<img
|
||||
src="{{ asset("static/images/" . $site->type . ".svg") }}"
|
||||
class="h-10 w-10"
|
||||
alt=""
|
||||
/>
|
||||
</div>
|
||||
<div class="ml-3 flex flex-grow flex-col items-start justify-center">
|
||||
<span class="mb-1">{{ $site->domain }}</span>
|
||||
<span class="text-sm text-gray-400">
|
||||
<x-table>
|
||||
<x-thead>
|
||||
<x-tr>
|
||||
<x-th>Domain</x-th>
|
||||
<x-th>Date</x-th>
|
||||
<x-th>Tags</x-th>
|
||||
<x-th>Status</x-th>
|
||||
<x-th></x-th>
|
||||
</x-tr>
|
||||
</x-thead>
|
||||
<x-tbody>
|
||||
@foreach ($sites as $site)
|
||||
<x-tr>
|
||||
<x-td>
|
||||
<div class="flex items-center">
|
||||
<img
|
||||
src="{{ asset("static/images/" . $site->type . ".svg") }}"
|
||||
class="mr-1 h-5 w-5"
|
||||
alt=""
|
||||
/>
|
||||
<a
|
||||
href="{{ route("servers.sites.show", ["server" => $server, "site" => $site]) }}"
|
||||
class="hover:underline"
|
||||
>
|
||||
{{ $site->domain }}
|
||||
</a>
|
||||
</div>
|
||||
</x-td>
|
||||
<x-td>
|
||||
<x-datetime :value="$site->created_at" />
|
||||
</span>
|
||||
</div>
|
||||
<div class="flex items-center">
|
||||
<div class="inline">
|
||||
</x-td>
|
||||
<x-td>
|
||||
@include("settings.tags.tags", ["taggable" => $site, "oobOff" => true])
|
||||
</x-td>
|
||||
<x-td>
|
||||
@include("sites.partials.status", ["status" => $site->status])
|
||||
</div>
|
||||
</div>
|
||||
</x-item-card>
|
||||
</a>
|
||||
@endforeach
|
||||
</x-td>
|
||||
<x-td>
|
||||
<div class="flex items-center justify-end">
|
||||
<x-icon-button
|
||||
:href="route('servers.sites.show', ['server' => $server, 'site' => $site])"
|
||||
data-tooltip="Show Site"
|
||||
>
|
||||
<x-heroicon name="o-eye" class="h-5 w-5" />
|
||||
</x-icon-button>
|
||||
<x-icon-button
|
||||
:href="route('servers.sites.settings', ['server' => $server, 'site' => $site])"
|
||||
data-tooltip="Settings"
|
||||
>
|
||||
<x-heroicon name="o-wrench-screwdriver" class="h-5 w-5" />
|
||||
</x-icon-button>
|
||||
</div>
|
||||
</x-td>
|
||||
</x-tr>
|
||||
@endforeach
|
||||
</x-tbody>
|
||||
</x-table>
|
||||
</div>
|
||||
@else
|
||||
<x-simple-card>
|
||||
|
||||
Reference in New Issue
Block a user