miguel456 2b1caeb80c
branch commit
Signed-off-by: miguel456 <me@nogueira.codes>
2023-06-29 18:21:58 +01:00

86 lines
1.9 KiB
PHP
Executable File

<div {{ $attributes->merge(['class' => $makeProgressClass()]) }}>
{{-- Progress bar --}}
<div class="{{ $makeProgressBarClass() }}" role="progressbar"
aria-valuenow="{{ $value }}" aria-valuemin="0" aria-valuemax="100"
style="{{ $makeProgressBarStyle() }}">
{{-- Progress bar label --}}
@isset($withLabel)
{{ $value }}%
@else
<span class="sr-only">{{ $value }}% Progress</span>
@endisset
</div>
</div>
{{-- Register Javascript utility class for this component --}}
@once
@push('js')
<script>
class _AdminLTE_Progress {
/**
* Constructor.
*
* target: The id of the target progress bar.
*/
constructor(target)
{
this.target = target;
}
/**
* Get the current progress bar value.
*/
getValue()
{
// Check if target exists.
let t = $(`#${this.target}`);
if (t.length <= 0) {
return;
}
// Return the progress bar current value (casted to number).
return +(t.find('.progress-bar').attr('aria-valuenow'));
}
/**
* Set the new progress bar value.
*/
setValue(value)
{
// Check if target exists.
let t = $(`#${this.target}`);
if (t.length <= 0) {
return;
}
// Update progress bar.
value = +value;
t.find('.progress-bar').css('width', value + '%')
.attr('aria-valuenow', value);
if (t.find('span.sr-only').length > 0) {
t.find('span.sr-only').text(value + '% Progress');
} else {
t.find('.progress-bar').text(value + '%');
}
}
}
</script>
@endpush
@endonce