loading component hidden feature

This commit is contained in:
Burak Civan 2022-09-22 09:39:47 +03:00
parent 6424b29580
commit b163b1a03b
4 changed files with 74 additions and 6 deletions

View File

@ -0,0 +1,32 @@
<?php
namespace App\View\Components\Loading;
use App\Abstracts\View\Component;
class Absolute extends Component
{
public $hidden;
/**
* Create a new component instance.
*
* @return void
*/
public function __construct(
bool $hidden = false,
) {
$this->hidden = $hidden;
}
/**
* Get the view / contents that represent the component.
*
* @return \Illuminate\Contracts\View\View|string
*/
public function render()
{
return view('components.loading.absolute');
}
}

View File

@ -0,0 +1,32 @@
<?php
namespace App\View\Components\Loading;
use App\Abstracts\View\Component;
class Content extends Component
{
public $hidden;
/**
* Create a new component instance.
*
* @return void
*/
public function __construct(
bool $hidden = false,
) {
$this->hidden = $hidden;
}
/**
* Get the view / contents that represent the component.
*
* @return \Illuminate\Contracts\View\View|string
*/
public function render()
{
return view('components.loading.content');
}
}

View File

@ -1,4 +1,6 @@
<div data-absolute-loading-content class="absolute w-full lg:flex items-start justify-center bg-body top-0 bottom-0 left-0 right-0 z-50">
<img src="{{ asset('public/img/akaunting-loading.gif') }}" class="w-28 h-28" alt="Akaunting" />
</div>
@if (! $hidden)
<div data-absolute-loading-content class="absolute w-full lg:flex items-start justify-center bg-body top-0 bottom-0 left-0 right-0 z-50">
<img src="{{ asset('public/img/akaunting-loading.gif') }}" class="w-28 h-28" alt="Akaunting" />
</div>
@endif
<!--data attr added because for none vue.js pages-->

View File

@ -1,4 +1,6 @@
<div data-loading-content class="fixed w-full lg:w-4/5 h-screen flex items-center justify-center bg-body top-0 bottom-0 ltr:right-0 rtl:left-0 -mx-1 z-50">
<img src="{{ asset('public/img/akaunting-loading.gif') }}" class="w-28 h-28 lg:-mt-16" alt="Akaunting" />
</div>
@if (! $hidden)
<div data-loading-content class="fixed w-full lg:w-4/5 h-screen flex items-center justify-center bg-body top-0 bottom-0 ltr:right-0 rtl:left-0 -mx-1 z-50">
<img src="{{ asset('public/img/akaunting-loading.gif') }}" class="w-28 h-28 lg:-mt-16" alt="Akaunting" />
</div>
@endif
<!--data attr added because for none vue.js pages-->