code refactoring

This commit is contained in:
Burak Civan 2022-06-27 14:27:11 +03:00
parent 135449f95d
commit b742ee013d
3 changed files with 22 additions and 18 deletions

View File

@ -293,10 +293,12 @@ function OnInput() {
//Auto Height for Textarea
//Loading scenario for href links
document.querySelectorAll('[data-link]').forEach((href) => {
href.addEventListener('click', function () {
document.querySelectorAll('[data-link-loading]').forEach((href) => {
let target_link_html = href.parentElement;
target_link_html.addEventListener('click', function () {
this.classList.add('disabled-link');
this.querySelector('[data-link-loading]').classList.remove('hidden');
this.querySelector('[data-link-spin]').classList.remove('hidden');
this.querySelector('[data-link-text]').classList.add('opacity-0');
this.querySelector('[data-link-text]').classList.remove('opacity-1');
});

View File

@ -1,7 +1,7 @@
@props(['module', 'installed', 'enable'])
@if (! empty($module->plan))
<a data-linkhref="{{ $module->action_url }}" class="relative bg-green hover:bg-green-700 rounded-md text-white text-sm text-center w-full py-2 truncate" target="_blank">
<a href="{{ $module->action_url }}" class="relative bg-green hover:bg-green-700 rounded-md text-white text-sm text-center w-full py-2 truncate" target="_blank">
<x-link.loading>
{{ trans('modules.get_premium_cloud') }}
</x-link.loading>
@ -9,7 +9,7 @@
@elseif (in_array('onprime', $module->where_to_use))
@if ($installed)
@can('delete-modules-item')
<a data-linkhref="{{ route('apps.app.uninstall', $module->slug) }}" class="relative bg-red text-white rounded-md text-sm text-center w-1/2 py-2 truncate">
<a href="{{ route('apps.app.uninstall', $module->slug) }}" class="relative bg-red text-white rounded-md text-sm text-center w-1/2 py-2 truncate">
<x-link.loading>
{{ trans('modules.button.uninstall') }}
</x-link.loading>
@ -18,13 +18,13 @@
@can('update-modules-item')
@if ($enable)
<a data-linkhref="{{ route('apps.app.disable', $module->slug) }}" class="relative bg-orange rounded-md text-white w-1/2 text-center text-sm py-2 truncate">
<a href="{{ route('apps.app.disable', $module->slug) }}" class="relative bg-orange rounded-md text-white w-1/2 text-center text-sm py-2 truncate">
<x-link.loading>
{{ trans('modules.button.disable') }}
</x-link.loading>
</a>
@else
<a data-linkhref="{{ route('apps.app.enable', $module->slug) }}" class="relative bg-green rounded-md text-white text-sm text-center w-1/2 py-2 truncate">
<a href="{{ route('apps.app.enable', $module->slug) }}" class="relative bg-green rounded-md text-white text-sm text-center w-1/2 py-2 truncate">
<x-link.loading>
{{ trans('modules.button.enable') }}
</x-link.loading>
@ -53,7 +53,7 @@
</button>
@endif
@else
<a data-linkhref="{{ $module->action_url }}" class="relative bg-green hover:bg-green-700 rounded-md text-white text-sm text-center w-full py-2 truncate" target="_blank">
<a href="{{ $module->action_url }}" class="relative bg-green hover:bg-green-700 rounded-md text-white text-sm text-center w-full py-2 truncate" target="_blank">
<x-link.loading>
{{ trans('modules.use_app') }}
</x-link.loading>
@ -63,13 +63,13 @@
@endif
@else
@if ($module->install)
<a data-linkhref="{{ $module->action_url }}" class="relative bg-green hover:bg-green-700 rounded-md text-white text-sm text-center w-full py-2 truncate" target="_blank">
<a href="{{ $module->action_url }}" class="relative bg-green hover:bg-green-700 rounded-md text-white text-sm text-center w-full py-2 truncate" target="_blank">
<x-link.loading>
{{ trans('modules.install_cloud') }}
</x-link.loading>
</a>
@else
<a data-linkhref="{{ $module->action_url }}" class="relative bg-green hover:bg-green-700 rounded-md text-white text-sm text-center w-full py-2 truncate" target="_blank">
<a href="{{ $module->action_url }}" class="relative bg-green hover:bg-green-700 rounded-md text-white text-sm text-center w-full py-2 truncate" target="_blank">
<x-link.loading>
{{ trans('modules.get_cloud') }}
</x-link.loading>

View File

@ -1,9 +1,11 @@
<i
data-link-loading
class="hidden animate-submit delay-[0.28s] absolute w-2 h-2 rounded-full left-0 right-0 -top-3.5 m-auto before:absolute before:w-2 before:h-2 before:rounded-full before:animate-submit before:delay-[0.14s] after:absolute after:w-2 after:h-2 after:rounded-full after:animate-submit before:-left-3.5 after:-right-3.5 after:delay-[0.42s]"
>
</i>
<div data-link-loading>
<i
data-link-spin
class="hidden animate-submit delay-[0.28s] absolute w-2 h-2 rounded-full left-0 right-0 -top-3.5 m-auto before:absolute before:w-2 before:h-2 before:rounded-full before:animate-submit before:delay-[0.14s] after:absolute after:w-2 after:h-2 after:rounded-full after:animate-submit before:-left-3.5 after:-right-3.5 after:delay-[0.42s]"
>
</i>
<span data-link-text class="opacity-1">
{!! $slot !!}
</span>
<span data-link-text class="opacity-1">
{!! $slot !!}
</span>
</div>