first commit
This commit is contained in:
36
resources/views/admin-settings/smtp-settings.blade.php
Normal file
36
resources/views/admin-settings/smtp-settings.blade.php
Normal file
@ -0,0 +1,36 @@
|
||||
@extends('vuexy-admin::layouts.vuexy.layoutMaster')
|
||||
|
||||
@section('title', 'Servidor de correo SMTP')
|
||||
|
||||
@section('vendor-style')
|
||||
@vite([
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/form-validation.scss'
|
||||
])
|
||||
@endsection
|
||||
|
||||
@section('vendor-script')
|
||||
@vite([
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/popular.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/bootstrap5.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/auto-focus.js'
|
||||
])
|
||||
@endsection
|
||||
|
||||
@push('page-script')
|
||||
@vite('vendor/koneko/laravel-vuexy-admin/resources/js/pages/smtp-settings-scripts.js')
|
||||
@endpush
|
||||
|
||||
@section('content')
|
||||
<div class="row">
|
||||
<div class="col-md-4">
|
||||
<div class="mb-4">
|
||||
@livewire('mail-smtp-settings')
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<div class="mb-4">
|
||||
@livewire('mail-sender-response-settings')
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@endsection
|
||||
@ -0,0 +1,30 @@
|
||||
@extends('vuexy-admin::layouts.vuexy.layoutMaster')
|
||||
|
||||
@section('title', 'Ajustes generales')
|
||||
|
||||
@push('page-script')
|
||||
@vite('vendor/koneko/laravel-vuexy-admin/resources/js/pages/admin-settings-scripts.js')
|
||||
@endpush
|
||||
|
||||
@section('content')
|
||||
<div class="row">
|
||||
<div class="col-lg-4">
|
||||
<!-- App Settings Card -->
|
||||
<div class="mb-4">
|
||||
@livewire('application-settings')
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-lg-4">
|
||||
<!-- General Settings Card -->
|
||||
<div class="mb-4">
|
||||
@livewire('general-settings')
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-lg-4">
|
||||
<!-- Interface Settings Card -->
|
||||
<div class="mb-4">
|
||||
@livewire('interface-settings')
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@endsection
|
||||
356
resources/views/auth/auth-register-multisteps.blade.php
Normal file
356
resources/views/auth/auth-register-multisteps.blade.php
Normal file
@ -0,0 +1,356 @@
|
||||
@php
|
||||
$customizerHidden = 'customizer-hide';
|
||||
$configData = Helper::appClasses();
|
||||
@endphp
|
||||
|
||||
@extends('vuexy-admin::layouts.vuexy.layoutMaster')
|
||||
|
||||
@section('title', 'Multi Steps Sign-up - Pages')
|
||||
|
||||
@section('vendor-style')
|
||||
@vite([
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/bs-stepper/bs-stepper.scss',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/bootstrap-select/bootstrap-select.scss',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/select2/select2.scss',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/form-validation.scss'
|
||||
])
|
||||
@endsection
|
||||
|
||||
@push('page-style')
|
||||
@vite([
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/scss/pages/page-auth.scss'
|
||||
])
|
||||
@endsection
|
||||
|
||||
@section('vendor-script')
|
||||
@vite([
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/cleavejs/cleave.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/cleavejs/cleave-phone.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/bs-stepper/bs-stepper.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/select2/select2.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/popular.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/bootstrap5.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/auto-focus.js'
|
||||
])
|
||||
@endsection
|
||||
|
||||
@push('page-script')
|
||||
@vite([
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/js/auth/pages-auth-multisteps.js'
|
||||
])
|
||||
@endpush
|
||||
|
||||
@section('content')
|
||||
<div class="authentication-wrapper authentication-cover authentication-bg">
|
||||
<!-- Logo -->
|
||||
<a href="{{url('/')}}" class="app-brand auth-cover-brand">
|
||||
<span class="app-brand-logo demo">
|
||||
<img src="{{ asset('storage/' . $_admin['image_logo']['small']) }}" alt="{{ $_admin['app_name'] }}" />
|
||||
</span>
|
||||
<span class="app-brand-text demo text-heading fw-bold">{{ config('koneko.templateName') }}</span>
|
||||
</a>
|
||||
<!-- /Logo -->
|
||||
<div class="authentication-inner row">
|
||||
|
||||
<!-- Left Text -->
|
||||
<div class="d-none d-lg-flex col-lg-4 align-items-center justify-content-center p-5 auth-cover-bg-color position-relative auth-multisteps-bg-height">
|
||||
<img src="{{ asset('vendor/vuexy-admin/img/illustrations/auth-register-multisteps-illustration.png') }}" alt="auth-register-multisteps" class="img-fluid" width="280">
|
||||
|
||||
<img src="{{ asset('vendor/vuexy-admin/img/illustrations/auth-register-multisteps-shape-'.$configData['style'].'.png') }}" alt="auth-register-multisteps" class="platform-bg" data-app-light-img="illustrations/auth-register-multisteps-shape-light.png" data-app-dark-img="illustrations/auth-register-multisteps-shape-dark.png">
|
||||
</div>
|
||||
<!-- /Left Text -->
|
||||
|
||||
<!-- Multi Steps Registration -->
|
||||
<div class="d-flex col-lg-8 align-items-center justify-content-center authentication-bg p-5">
|
||||
<div class="w-px-700">
|
||||
<div id="multiStepsValidation" class="bs-stepper border-none shadow-none mt-5">
|
||||
<div class="bs-stepper-header border-none pt-12 px-0">
|
||||
<div class="step" data-target="#accountDetailsValidation">
|
||||
<button type="button" class="step-trigger">
|
||||
<span class="bs-stepper-circle"><i class="ti ti-file-analytics ti-md"></i></span>
|
||||
<span class="bs-stepper-label">
|
||||
<span class="bs-stepper-title">Account</span>
|
||||
<span class="bs-stepper-subtitle">Account Details</span>
|
||||
</span>
|
||||
</button>
|
||||
</div>
|
||||
<div class="line">
|
||||
<i class="ti ti-chevron-right"></i>
|
||||
</div>
|
||||
<div class="step" data-target="#personalInfoValidation">
|
||||
<button type="button" class="step-trigger">
|
||||
<span class="bs-stepper-circle"><i class="ti ti-user ti-md"></i></span>
|
||||
<span class="bs-stepper-label">
|
||||
<span class="bs-stepper-title">Personal</span>
|
||||
<span class="bs-stepper-subtitle">Enter Information</span>
|
||||
</span>
|
||||
</button>
|
||||
</div>
|
||||
<div class="line">
|
||||
<i class="ti ti-chevron-right"></i>
|
||||
</div>
|
||||
<div class="step" data-target="#billingLinksValidation">
|
||||
<button type="button" class="step-trigger">
|
||||
<span class="bs-stepper-circle"><i class="ti ti-credit-card ti-md"></i></span>
|
||||
<span class="bs-stepper-label">
|
||||
<span class="bs-stepper-title">Billing</span>
|
||||
<span class="bs-stepper-subtitle">Payment Details</span>
|
||||
</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="bs-stepper-content px-0">
|
||||
<form id="multiStepsForm" onSubmit="return false">
|
||||
<!-- Account Details -->
|
||||
<div id="accountDetailsValidation" class="content">
|
||||
<div class="content-header mb-6">
|
||||
<h4 class="mb-0">Account Information</h4>
|
||||
<p class="mb-0">Enter Your Account Details</p>
|
||||
</div>
|
||||
<div class="row g-6">
|
||||
<div class="col-sm-6">
|
||||
<label class="form-label" for="multiStepsUsername">Username</label>
|
||||
<input type="text" name="multiStepsUsername" id="multiStepsUsername" class="form-control" placeholder="johndoe" />
|
||||
</div>
|
||||
<div class="col-sm-6">
|
||||
<label class="form-label" for="multiStepsEmail">Email</label>
|
||||
<input type="email" name="multiStepsEmail" id="multiStepsEmail" class="form-control" placeholder="john.doe@email.com" aria-label="john.doe" />
|
||||
</div>
|
||||
<div class="col-sm-6 form-password-toggle">
|
||||
<label class="form-label" for="multiStepsPass">Password</label>
|
||||
<div class="input-group input-group-merge">
|
||||
<input type="password" id="multiStepsPass" name="multiStepsPass" class="form-control" placeholder="············" aria-describedby="multiStepsPass2" />
|
||||
<span class="input-group-text cursor-pointer" id="multiStepsPass2"><i class="ti ti-eye-off"></i></span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-6 form-password-toggle">
|
||||
<label class="form-label" for="multiStepsConfirmPass">Confirm Password</label>
|
||||
<div class="input-group input-group-merge">
|
||||
<input type="password" id="multiStepsConfirmPass" name="multiStepsConfirmPass" class="form-control" placeholder="············" aria-describedby="multiStepsConfirmPass2" />
|
||||
<span class="input-group-text cursor-pointer" id="multiStepsConfirmPass2"><i class="ti ti-eye-off"></i></span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-12">
|
||||
<label class="form-label" for="multiStepsURL">Profile Link</label>
|
||||
<input type="text" name="multiStepsURL" id="multiStepsURL" class="form-control" placeholder="johndoe/profile" aria-label="johndoe" />
|
||||
</div>
|
||||
<div class="col-12 d-flex justify-content-between">
|
||||
<button class="btn btn-label-secondary btn-prev" disabled> <i class="ti ti-arrow-left ti-xs me-sm-2 me-0"></i>
|
||||
<span class="align-middle d-sm-inline-block d-none">Previous</span>
|
||||
</button>
|
||||
<button class="btn btn-primary btn-next"> <span class="align-middle d-sm-inline-block d-none me-sm-1 me-0">Next</span> <i class="ti ti-arrow-right ti-xs"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Personal Info -->
|
||||
<div id="personalInfoValidation" class="content">
|
||||
<div class="content-header mb-6">
|
||||
<h4 class="mb-0">Personal Information</h4>
|
||||
<p class="mb-0">Enter Your Personal Information</p>
|
||||
</div>
|
||||
<div class="row g-6">
|
||||
<div class="col-sm-6">
|
||||
<label class="form-label" for="multiStepsFirstName">First Name</label>
|
||||
<input type="text" id="multiStepsFirstName" name="multiStepsFirstName" class="form-control" placeholder="John" />
|
||||
</div>
|
||||
<div class="col-sm-6">
|
||||
<label class="form-label" for="multiStepsLastName">Last Name</label>
|
||||
<input type="text" id="multiStepsLastName" name="multiStepsLastName" class="form-control" placeholder="Doe" />
|
||||
</div>
|
||||
<div class="col-sm-6">
|
||||
<label class="form-label" for="multiStepsMobile">Mobile</label>
|
||||
<div class="input-group">
|
||||
<span class="input-group-text">US (+1)</span>
|
||||
<input type="text" id="multiStepsMobile" name="multiStepsMobile" class="form-control multi-steps-mobile" placeholder="202 555 0111" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-6">
|
||||
<label class="form-label" for="multiStepsPincode">Pincode</label>
|
||||
<input type="text" id="multiStepsPincode" name="multiStepsPincode" class="form-control multi-steps-pincode" placeholder="Postal Code" maxlength="6" />
|
||||
</div>
|
||||
<div class="col-md-12">
|
||||
<label class="form-label" for="multiStepsAddress">Address</label>
|
||||
<input type="text" id="multiStepsAddress" name="multiStepsAddress" class="form-control" placeholder="Address" />
|
||||
</div>
|
||||
<div class="col-md-12">
|
||||
<label class="form-label" for="multiStepsArea">Landmark</label>
|
||||
<input type="text" id="multiStepsArea" name="multiStepsArea" class="form-control" placeholder="Area/Landmark" />
|
||||
</div>
|
||||
<div class="col-sm-6">
|
||||
<label class="form-label" for="multiStepsCity">City</label>
|
||||
<input type="text" id="multiStepsCity" class="form-control" placeholder="Jackson" />
|
||||
</div>
|
||||
<div class="col-sm-6">
|
||||
<label class="form-label" for="multiStepsState">State</label>
|
||||
<select id="multiStepsState" class="select2 form-select" data-allow-clear="true">
|
||||
<option value="">Select</option>
|
||||
<option value="AL">Alabama</option>
|
||||
<option value="AK">Alaska</option>
|
||||
<option value="AZ">Arizona</option>
|
||||
<option value="AR">Arkansas</option>
|
||||
<option value="CA">California</option>
|
||||
<option value="CO">Colorado</option>
|
||||
<option value="CT">Connecticut</option>
|
||||
<option value="DE">Delaware</option>
|
||||
<option value="DC">District Of Columbia</option>
|
||||
<option value="FL">Florida</option>
|
||||
<option value="GA">Georgia</option>
|
||||
<option value="HI">Hawaii</option>
|
||||
<option value="ID">Idaho</option>
|
||||
<option value="IL">Illinois</option>
|
||||
<option value="IN">Indiana</option>
|
||||
<option value="IA">Iowa</option>
|
||||
<option value="KS">Kansas</option>
|
||||
<option value="KY">Kentucky</option>
|
||||
<option value="LA">Louisiana</option>
|
||||
<option value="ME">Maine</option>
|
||||
<option value="MD">Maryland</option>
|
||||
<option value="MA">Massachusetts</option>
|
||||
<option value="MI">Michigan</option>
|
||||
<option value="MN">Minnesota</option>
|
||||
<option value="MS">Mississippi</option>
|
||||
<option value="MO">Missouri</option>
|
||||
<option value="MT">Montana</option>
|
||||
<option value="NE">Nebraska</option>
|
||||
<option value="NV">Nevada</option>
|
||||
<option value="NH">New Hampshire</option>
|
||||
<option value="NJ">New Jersey</option>
|
||||
<option value="NM">New Mexico</option>
|
||||
<option value="NY">New York</option>
|
||||
<option value="NC">North Carolina</option>
|
||||
<option value="ND">North Dakota</option>
|
||||
<option value="OH">Ohio</option>
|
||||
<option value="OK">Oklahoma</option>
|
||||
<option value="OR">Oregon</option>
|
||||
<option value="PA">Pennsylvania</option>
|
||||
<option value="RI">Rhode Island</option>
|
||||
<option value="SC">South Carolina</option>
|
||||
<option value="SD">South Dakota</option>
|
||||
<option value="TN">Tennessee</option>
|
||||
<option value="TX">Texas</option>
|
||||
<option value="UT">Utah</option>
|
||||
<option value="VT">Vermont</option>
|
||||
<option value="VA">Virginia</option>
|
||||
<option value="WA">Washington</option>
|
||||
<option value="WV">West Virginia</option>
|
||||
<option value="WI">Wisconsin</option>
|
||||
<option value="WY">Wyoming</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="col-12 d-flex justify-content-between">
|
||||
<button class="btn btn-label-secondary btn-prev"> <i class="ti ti-arrow-left ti-xs me-sm-2 me-0"></i>
|
||||
<span class="align-middle d-sm-inline-block d-none">Previous</span>
|
||||
</button>
|
||||
<button class="btn btn-primary btn-next"> <span class="align-middle d-sm-inline-block d-none me-sm-1 me-0">Next</span> <i class="ti ti-arrow-right ti-xs"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Billing Links -->
|
||||
<div id="billingLinksValidation" class="content">
|
||||
<div class="content-header mb-6">
|
||||
<h4 class="mb-0">Select Plan</h4>
|
||||
<p class="mb-0">Select plan as per your requirement</p>
|
||||
</div>
|
||||
<!-- Custom plan options -->
|
||||
<div class="row gap-md-0 gap-4 mb-12">
|
||||
<div class="col-md">
|
||||
<div class="form-check custom-option custom-option-icon">
|
||||
<label class="form-check-label custom-option-content" for="basicOption">
|
||||
<span class="custom-option-body">
|
||||
<span class="d-block mb-2 h5">Basic</span>
|
||||
<span>A simple start for start ups & Students</span>
|
||||
<span class="d-flex justify-content-center mt-2">
|
||||
<sup class="text-primary h6 fw-normal pt-2 mb-0">$</sup>
|
||||
<span class="fw-medium h3 text-primary mb-0">0</span>
|
||||
<sub class="h6 fw-normal mt-3 mb-0 text-muted">/month</sub>
|
||||
</span>
|
||||
</span>
|
||||
<input name="customRadioIcon" class="form-check-input" type="radio" value="" id="basicOption" />
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md">
|
||||
<div class="form-check custom-option custom-option-icon">
|
||||
<label class="form-check-label custom-option-content" for="standardOption">
|
||||
<span class="custom-option-body">
|
||||
<span class="d-block mb-2 h5">Standard</span>
|
||||
<span>For small to medium businesses</span>
|
||||
<span class="d-flex justify-content-center mt-2">
|
||||
<sup class="text-primary h6 fw-normal pt-2 mb-0">$</sup>
|
||||
<span class="fw-medium h3 text-primary mb-0">99</span>
|
||||
<sub class="h6 fw-normal mt-3 mb-0 text-muted">/month</sub>
|
||||
</span>
|
||||
</span>
|
||||
<input name="customRadioIcon" class="form-check-input" type="radio" value="" id="standardOption" checked />
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md">
|
||||
<div class="form-check custom-option custom-option-icon">
|
||||
<label class="form-check-label custom-option-content" for="enterpriseOption">
|
||||
<span class="custom-option-body">
|
||||
<span class="d-block mb-2 h5">Enterprise</span>
|
||||
<span>Solution for enterprise & organizations</span>
|
||||
<span class="d-flex justify-content-center mt-2">
|
||||
<sup class="text-primary h6 fw-normal pt-2 mb-0">$</sup>
|
||||
<span class="fw-medium h3 text-primary mb-0">499</span>
|
||||
<sub class="h6 fw-normal mt-3 mb-0 text-muted">/year</sub>
|
||||
</span>
|
||||
</span>
|
||||
<input name="customRadioIcon" class="form-check-input" type="radio" value="" id="enterpriseOption" />
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--/ Custom plan options -->
|
||||
<div class="content-header mb-6">
|
||||
<h4 class="mb-0">Payment Information</h4>
|
||||
<p class="mb-0">Enter your card information</p>
|
||||
</div>
|
||||
<!-- Credit Card Details -->
|
||||
<div class="row g-6">
|
||||
<div class="col-md-12">
|
||||
<label class="form-label w-100" for="multiStepsCard">Card Number</label>
|
||||
<div class="input-group input-group-merge">
|
||||
<input id="multiStepsCard" class="form-control multi-steps-card" name="multiStepsCard" type="text" placeholder="1356 3215 6548 7898" aria-describedby="multiStepsCardImg" />
|
||||
<span class="input-group-text cursor-pointer" id="multiStepsCardImg"><span class="card-type"></span></span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-5">
|
||||
<label class="form-label" for="multiStepsName">Name On Card</label>
|
||||
<input type="text" id="multiStepsName" class="form-control" name="multiStepsName" placeholder="John Doe" />
|
||||
</div>
|
||||
<div class="col-6 col-md-4">
|
||||
<label class="form-label" for="multiStepsExDate">Expiry Date</label>
|
||||
<input type="text" id="multiStepsExDate" class="form-control multi-steps-exp-date" name="multiStepsExDate" placeholder="MM/YY" />
|
||||
</div>
|
||||
<div class="col-6 col-md-3">
|
||||
<label class="form-label" for="multiStepsCvv">CVV Code</label>
|
||||
<div class="input-group input-group-merge">
|
||||
<input type="text" id="multiStepsCvv" class="form-control multi-steps-cvv" name="multiStepsCvv" maxlength="3" placeholder="654" />
|
||||
<span class="input-group-text cursor-pointer" id="multiStepsCvvHelp"><i class="ti ti-help text-muted" data-bs-toggle="tooltip" data-bs-placement="top" title="Card Verification Value"></i></span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 d-flex justify-content-between">
|
||||
<button class="btn btn-label-secondary btn-prev"> <i class="ti ti-arrow-left ti-xs me-sm-2 me-0"></i>
|
||||
<span class="align-middle d-sm-inline-block d-none">Previous</span>
|
||||
</button>
|
||||
<button type="submit" class="btn btn-success btn-next btn-submit">Submit</button>
|
||||
</div>
|
||||
</div>
|
||||
<!--/ Credit Card Details -->
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- / Multi Steps Registration -->
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="module">
|
||||
// Check selected custom option
|
||||
window.Helpers.initCustomOptionCheck();
|
||||
</script>
|
||||
@endsection
|
||||
86
resources/views/auth/auth-two-steps-basic.blade.php
Normal file
86
resources/views/auth/auth-two-steps-basic.blade.php
Normal file
@ -0,0 +1,86 @@
|
||||
@php
|
||||
$customizerHidden = 'customizer-hide';
|
||||
@endphp
|
||||
|
||||
@extends('vuexy-admin::layouts.vuexy.layoutMaster')
|
||||
|
||||
@section('title', 'Two Steps Verifications Basic - Pages')
|
||||
|
||||
@section('vendor-style')
|
||||
@vite([
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/form-validation.scss'
|
||||
])
|
||||
@endsection
|
||||
|
||||
@push('page-style')
|
||||
@vite([
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/scss/pages/page-auth.scss'
|
||||
])
|
||||
@endsection
|
||||
|
||||
@section('vendor-script')
|
||||
@vite([
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/cleavejs/cleave.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/popular.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/bootstrap5.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/auto-focus.js'
|
||||
])
|
||||
@endsection
|
||||
|
||||
@push('page-script')
|
||||
@vite([
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/js/auth/pages-auth.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/js/auth/pages-auth-two-steps.js'
|
||||
])
|
||||
@endpush
|
||||
|
||||
@section('content')
|
||||
<div class="authentication-wrapper authentication-basic px-6">
|
||||
<div class="authentication-inner py-6">
|
||||
<!-- Two Steps Verification -->
|
||||
<div class="card">
|
||||
<div class="card-body">
|
||||
<!-- Logo -->
|
||||
<div class="app-brand justify-content-center mb-6">
|
||||
<a href="{{url('/')}}" class="app-brand-link">
|
||||
<span class="app-brand-logo demo">
|
||||
<img src="{{ asset('storage/' . $_admin['image_logo']['small']) }}" alt="{{ $_admin['app_name'] }}" />
|
||||
</span>
|
||||
<span class="app-brand-text demo text-heading fw-bold">{{ config('koneko.templateName') }}</span>
|
||||
</a>
|
||||
</div>
|
||||
<!-- /Logo -->
|
||||
<h4 class="mb-1">Two Step Verification 💬</h4>
|
||||
<p class="text-start mb-6">
|
||||
We sent a verification code to your mobile. Enter the code from the mobile in the field below.
|
||||
<span class="fw-medium d-block mt-1 text-heading">******1234</span>
|
||||
</p>
|
||||
<p class="mb-0">Type your 6 digit security code</p>
|
||||
<form id="twoStepsForm" action="{{url('/')}}" method="GET">
|
||||
<div class="mb-6">
|
||||
<div class="auth-input-wrapper d-flex align-items-center justify-content-between numeral-mask-wrapper">
|
||||
<input type="tel" class="form-control auth-input h-px-50 text-center numeral-mask mx-sm-1 my-2" maxlength="1" autofocus>
|
||||
<input type="tel" class="form-control auth-input h-px-50 text-center numeral-mask mx-sm-1 my-2" maxlength="1">
|
||||
<input type="tel" class="form-control auth-input h-px-50 text-center numeral-mask mx-sm-1 my-2" maxlength="1">
|
||||
<input type="tel" class="form-control auth-input h-px-50 text-center numeral-mask mx-sm-1 my-2" maxlength="1">
|
||||
<input type="tel" class="form-control auth-input h-px-50 text-center numeral-mask mx-sm-1 my-2" maxlength="1">
|
||||
<input type="tel" class="form-control auth-input h-px-50 text-center numeral-mask mx-sm-1 my-2" maxlength="1">
|
||||
</div>
|
||||
<!-- Create a hidden field which is combined by 3 fields above -->
|
||||
<input type="hidden" name="otp" />
|
||||
</div>
|
||||
<button class="btn btn-primary d-grid w-100 mb-6">
|
||||
Verify my account
|
||||
</button>
|
||||
<div class="text-center">Didn't get the code?
|
||||
<a href="javascript:void(0);">
|
||||
Resend
|
||||
</a>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
<!-- / Two Steps Verification -->
|
||||
</div>
|
||||
</div>
|
||||
@endsection
|
||||
96
resources/views/auth/auth-two-steps-cover.blade.php
Normal file
96
resources/views/auth/auth-two-steps-cover.blade.php
Normal file
@ -0,0 +1,96 @@
|
||||
@php
|
||||
$customizerHidden = 'customizer-hide';
|
||||
$configData = Helper::appClasses();
|
||||
@endphp
|
||||
|
||||
@extends('vuexy-admin::layouts.vuexy.layoutMaster')
|
||||
|
||||
@section('title', 'Two Steps Verifications Cover - Pages')
|
||||
|
||||
@section('vendor-style')
|
||||
@vite([
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/form-validation.scss'
|
||||
])
|
||||
@endsection
|
||||
|
||||
@push('page-style')
|
||||
@vite([
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/scss/pages/page-auth.scss'
|
||||
])
|
||||
@endsection
|
||||
|
||||
@section('vendor-script')
|
||||
@vite([
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/cleavejs/cleave.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/popular.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/bootstrap5.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/auto-focus.js'
|
||||
])
|
||||
@endsection
|
||||
|
||||
@push('page-script')
|
||||
@vite([
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/js/auth/pages-auth.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/js/auth/pages-auth-two-steps.js'
|
||||
])
|
||||
@endpush
|
||||
|
||||
@section('content')
|
||||
<div class="authentication-wrapper authentication-cover">
|
||||
<!-- Logo -->
|
||||
<a href="{{url('/')}}" class="app-brand auth-cover-brand">
|
||||
<span class="app-brand-logo demo">
|
||||
<img src="{{ asset('storage/' . $_admin['image_logo']['small']) }}" alt="{{ $_admin['app_name'] }}" />
|
||||
</span>
|
||||
<span class="app-brand-text demo text-heading fw-bold">{{ config('koneko.templateName') }}</span>
|
||||
</a>
|
||||
<!-- /Logo -->
|
||||
<div class="authentication-inner row m-0">
|
||||
|
||||
<!-- /Left Text -->
|
||||
<div class="d-none d-lg-flex col-lg-8 p-0">
|
||||
<div class="auth-cover-bg auth-cover-bg-color d-flex justify-content-center align-items-center">
|
||||
<img src="{{ asset('vendor/vuexy-admin/img/illustrations/auth-two-step-illustration-'.$configData['style'].'.png') }}" alt="auth-two-steps-cover" class="my-5 auth-illustration" data-app-light-img="illustrations/auth-two-step-illustration-light.png" data-app-dark-img="illustrations/auth-two-step-illustration-dark.png">
|
||||
|
||||
<img src="{{ asset('vendor/vuexy-admin/img/illustrations/bg-shape-image-'.$configData['style'].'.png') }}" alt="auth-two-steps-cover" class="platform-bg" data-app-light-img="illustrations/bg-shape-image-light.png" data-app-dark-img="illustrations/bg-shape-image-dark.png">
|
||||
</div>
|
||||
</div>
|
||||
<!-- /Left Text -->
|
||||
|
||||
<!-- Two Steps Verification -->
|
||||
<div class="d-flex col-12 col-lg-4 align-items-center authentication-bg p-6 p-sm-12">
|
||||
<div class="w-px-400 mx-auto mt-12 mt-5">
|
||||
<h4 class="mb-1">Two Step Verification 💬</h4>
|
||||
<p class="text-start mb-6">
|
||||
We sent a verification code to your mobile. Enter the code from the mobile in the field below.
|
||||
<span class="fw-medium d-block mt-1 text-heading">******1234</span>
|
||||
</p>
|
||||
<p class="mb-0">Type your 6 digit security code</p>
|
||||
<form id="twoStepsForm" action="{{url('/')}}" method="GET">
|
||||
<div class="mb-6">
|
||||
<div class="auth-input-wrapper d-flex align-items-center justify-content-between numeral-mask-wrapper">
|
||||
<input type="tel" class="form-control auth-input h-px-50 text-center numeral-mask mx-sm-1 my-2" maxlength="1" autofocus>
|
||||
<input type="tel" class="form-control auth-input h-px-50 text-center numeral-mask mx-sm-1 my-2" maxlength="1">
|
||||
<input type="tel" class="form-control auth-input h-px-50 text-center numeral-mask mx-sm-1 my-2" maxlength="1">
|
||||
<input type="tel" class="form-control auth-input h-px-50 text-center numeral-mask mx-sm-1 my-2" maxlength="1">
|
||||
<input type="tel" class="form-control auth-input h-px-50 text-center numeral-mask mx-sm-1 my-2" maxlength="1">
|
||||
<input type="tel" class="form-control auth-input h-px-50 text-center numeral-mask mx-sm-1 my-2" maxlength="1">
|
||||
</div>
|
||||
<!-- Create a hidden field which is combined by 3 fields above -->
|
||||
<input type="hidden" name="otp" />
|
||||
</div>
|
||||
<button class="btn btn-primary d-grid w-100 mb-6">
|
||||
Verify my account
|
||||
</button>
|
||||
<div class="text-center">Didn't get the code?
|
||||
<a href="javascript:void(0);">
|
||||
Resend
|
||||
</a>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
<!-- /Two Steps Verification -->
|
||||
</div>
|
||||
</div>
|
||||
@endsection
|
||||
47
resources/views/auth/auth-verify-email-basic.blade.php
Normal file
47
resources/views/auth/auth-verify-email-basic.blade.php
Normal file
@ -0,0 +1,47 @@
|
||||
@php
|
||||
$customizerHidden = 'customizer-hide';
|
||||
@endphp
|
||||
|
||||
@extends('vuexy-admin::layouts.vuexy.layoutMaster')
|
||||
|
||||
@section('title', 'Verify Email Basic - Pages')
|
||||
|
||||
@push('page-style')
|
||||
<!-- Page -->
|
||||
@vite('vendor/koneko/laravel-vuexy-admin/resources/scss/pages/page-auth.scss')
|
||||
@endsection
|
||||
|
||||
@section('content')
|
||||
<div class="authentication-wrapper authentication-basic px-6">
|
||||
<div class="authentication-inner py-6">
|
||||
<!-- Verify Email -->
|
||||
<div class="card">
|
||||
<div class="card-body">
|
||||
<!-- Logo -->
|
||||
<div class="app-brand justify-content-center mb-6">
|
||||
<a href="{{url('/')}}" class="app-brand-link">
|
||||
<span class="app-brand-logo demo">
|
||||
<img src="{{ asset('storage/' . $_admin['image_logo']['small']) }}" alt="{{ $_admin['app_name'] }}" />
|
||||
</span>
|
||||
<span class="app-brand-text demo text-heading fw-bold">{{ config('koneko.templateName') }}</span>
|
||||
</a>
|
||||
</div>
|
||||
<!-- /Logo -->
|
||||
<h4 class="mb-1">Verify your email ✉️</h4>
|
||||
<p class="text-start mb-0">
|
||||
Account activation link sent to your email address: hello@example.com Please follow the link inside to continue.
|
||||
</p>
|
||||
<a class="btn btn-primary w-100 my-6" href="{{url('/')}}">
|
||||
Skip for now
|
||||
</a>
|
||||
<p class="text-center mb-0">Didn't get the mail?
|
||||
<a href="javascript:void(0);">
|
||||
Resend
|
||||
</a>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<!-- /Verify Email -->
|
||||
</div>
|
||||
</div>
|
||||
@endsection
|
||||
57
resources/views/auth/auth-verify-email-cover.blade.php
Normal file
57
resources/views/auth/auth-verify-email-cover.blade.php
Normal file
@ -0,0 +1,57 @@
|
||||
@php
|
||||
$customizerHidden = 'customizer-hide';
|
||||
$configData = Helper::appClasses();
|
||||
@endphp
|
||||
|
||||
@extends('vuexy-admin::layouts.vuexy.layoutMaster')
|
||||
|
||||
@section('title', 'Verify Email Cover - Pages')
|
||||
|
||||
@push('page-style')
|
||||
<!-- Page -->
|
||||
@vite('vendor/koneko/laravel-vuexy-admin/resources/scss/pages/page-auth.scss')
|
||||
@endsection
|
||||
|
||||
@section('content')
|
||||
<div class="authentication-wrapper authentication-cover">
|
||||
<!-- Logo -->
|
||||
<a href="{{url('/')}}" class="app-brand auth-cover-brand">
|
||||
<span class="app-brand-logo demo">
|
||||
<img src="{{ asset('storage/' . $_admin['image_logo']['small']) }}" alt="{{ $_admin['app_name'] }}" />
|
||||
</span>
|
||||
<span class="app-brand-text demo text-heading fw-bold">{{ config('koneko.templateName') }}</span>
|
||||
</a>
|
||||
<!-- /Logo -->
|
||||
<div class="authentication-inner row m-0">
|
||||
|
||||
<!-- /Left Text -->
|
||||
<div class="d-none d-lg-flex col-lg-8 p-0">
|
||||
<div class="auth-cover-bg auth-cover-bg-color d-flex justify-content-center align-items-center">
|
||||
<img src="{{ asset('vendor/vuexy-admin/img/illustrations/auth-verify-email-illustration-'.$configData['style'].'.png') }}" alt="auth-verify-email-cover" class="my-5 auth-illustration" data-app-light-img="illustrations/auth-verify-email-illustration-light.png" data-app-dark-img="illustrations/auth-verify-email-illustration-dark.png">
|
||||
|
||||
<img src="{{ asset('vendor/vuexy-admin/img/illustrations/bg-shape-image-'.$configData['style'].'.png') }}" alt="auth-verify-email-cover" class="platform-bg" data-app-light-img="illustrations/bg-shape-image-light.png" data-app-dark-img="illustrations/bg-shape-image-dark.png">
|
||||
</div>
|
||||
</div>
|
||||
<!-- /Left Text -->
|
||||
|
||||
<!-- Verify email -->
|
||||
<div class="d-flex col-12 col-lg-4 align-items-center authentication-bg p-6 p-sm-12">
|
||||
<div class="w-px-400 mx-auto mt-12 mt-5">
|
||||
<h4 class="mb-1">Verify your email ✉️</h4>
|
||||
<p class="text-start mb-0">
|
||||
Account activation link sent to your email address: hello@example.com Please follow the link inside to continue.
|
||||
</p>
|
||||
<a class="btn btn-primary w-100 my-6" href="{{url('/')}}">
|
||||
Skip for now
|
||||
</a>
|
||||
<p class="text-center mb-0">Didn't get the mail?
|
||||
<a href="javascript:void(0);">
|
||||
Resend
|
||||
</a>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<!-- / Verify email -->
|
||||
</div>
|
||||
</div>
|
||||
@endsection
|
||||
97
resources/views/auth/forgot-password-basic.blade.php
Normal file
97
resources/views/auth/forgot-password-basic.blade.php
Normal file
@ -0,0 +1,97 @@
|
||||
@php
|
||||
$customizerHidden = 'customizer-hide';
|
||||
@endphp
|
||||
|
||||
@extends('vuexy-admin::layouts.vuexy.layoutMaster')
|
||||
|
||||
@section('title', 'Recuperar Contraseña')
|
||||
|
||||
@section('vendor-style')
|
||||
@vite([
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/form-validation.scss'
|
||||
])
|
||||
@endsection
|
||||
|
||||
@push('page-style')
|
||||
@vite([
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/scss/pages/page-auth.scss'
|
||||
])
|
||||
@endsection
|
||||
|
||||
@section('vendor-script')
|
||||
@vite([
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/popular.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/bootstrap5.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/auto-focus.js'
|
||||
])
|
||||
@endsection
|
||||
|
||||
@push('page-script')
|
||||
@vite([
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/js/auth/pages-auth.js'
|
||||
])
|
||||
@endpush
|
||||
|
||||
@section('content')
|
||||
<div class="container-xxl">
|
||||
<div class="authentication-wrapper authentication-basic container-p-y">
|
||||
<div class="authentication-inner py-6">
|
||||
<!-- Recuperar Contraseña -->
|
||||
<div class="card">
|
||||
<div class="card-body">
|
||||
<!-- Logo -->
|
||||
<div class="app-brand justify-content-center mb-6">
|
||||
<a href="{{ url('/') }}" class="app-brand-link">
|
||||
<span class="app-brand-logo demo">
|
||||
<img src="{{ asset('storage/' . $_admin['image_logo']['small']) }}" alt="{{ $_admin['app_name'] }}" />
|
||||
</span>
|
||||
<span class="app-brand-text demo text-heading fw-bold">{{ $_admin['app_name'] }}</span>
|
||||
</a>
|
||||
</div>
|
||||
<!-- /Logo -->
|
||||
|
||||
<h4 class="mb-1">¿Olvidaste tu Contraseña? 🔒</h4>
|
||||
<p class="mb-6">Ingresa tu correo electrónico y te enviaremos instrucciones para restablecer tu contraseña</p>
|
||||
|
||||
@if (session('status'))
|
||||
<div class="alert alert-success">
|
||||
{{ session('status') }}
|
||||
</div>
|
||||
@endif
|
||||
|
||||
<form method="POST" action="{{ route('password.email') }}" class="mb-6">
|
||||
@csrf
|
||||
<div class="mb-6 fv-row">
|
||||
<label for="email" class="form-label">Correo Electrónico</label>
|
||||
<input type="email"
|
||||
class="form-control @error('email') is-invalid @enderror"
|
||||
id="email"
|
||||
name="email"
|
||||
value="{{ old('email') }}"
|
||||
placeholder="Ingresa tu correo electrónico"
|
||||
required
|
||||
autofocus>
|
||||
@error('email')
|
||||
<div class="invalid-feedback">
|
||||
{{ $message }}
|
||||
</div>
|
||||
@enderror
|
||||
</div>
|
||||
<button type="submit" class="btn btn-primary d-grid w-100">
|
||||
Enviar Enlace de Restablecimiento
|
||||
</button>
|
||||
</form>
|
||||
|
||||
<div class="text-center">
|
||||
<a href="{{ route('login') }}" class="d-flex justify-content-center">
|
||||
<i class="ti ti-chevron-left scaleX-n1-rtl me-1_5"></i>
|
||||
Volver al Inicio de Sesión
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- /Recuperar Contraseña -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@endsection
|
||||
104
resources/views/auth/forgot-password-cover.blade.php
Normal file
104
resources/views/auth/forgot-password-cover.blade.php
Normal file
@ -0,0 +1,104 @@
|
||||
@php
|
||||
$customizerHidden = 'customizer-hide';
|
||||
$configData = Helper::appClasses();
|
||||
@endphp
|
||||
|
||||
@extends('vuexy-admin::layouts.vuexy.layoutMaster')
|
||||
|
||||
@section('title', 'Recuperar Contraseña')
|
||||
|
||||
@section('vendor-style')
|
||||
@vite([
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/form-validation.scss'
|
||||
])
|
||||
@endsection
|
||||
|
||||
@push('page-style')
|
||||
@vite([
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/scss/pages/page-auth.scss'
|
||||
])
|
||||
@endsection
|
||||
|
||||
@section('vendor-script')
|
||||
@vite([
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/popular.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/bootstrap5.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/auto-focus.js'
|
||||
])
|
||||
@endsection
|
||||
|
||||
@push('page-script')
|
||||
@vite([
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/js/auth/pages-auth.js'
|
||||
])
|
||||
@endpush
|
||||
|
||||
@section('content')
|
||||
<div class="authentication-wrapper authentication-cover">
|
||||
<!-- Logo -->
|
||||
<a href="{{ url('/') }}" class="app-brand auth-cover-brand">
|
||||
<span class="app-brand-logo demo">
|
||||
<img src="{{ asset('storage/' . $_admin['image_logo']['small']) }}" alt="{{ $_admin['app_name'] }}" />
|
||||
</span>
|
||||
<span class="app-brand-text demo text-heading fw-bold">{{ $_admin['app_name'] }}</span>
|
||||
</a>
|
||||
<!-- /Logo -->
|
||||
<div class="authentication-inner row m-0">
|
||||
|
||||
<!-- /Left Text -->
|
||||
<div class="d-none d-lg-flex col-lg-8 p-0">
|
||||
<div class="auth-cover-bg auth-cover-bg-color d-flex justify-content-center align-items-center">
|
||||
<img src="{{ asset('vendor/vuexy-admin/img/illustrations/auth-forgot-password-illustration-'.$configData['style'].'.png') }}" alt="Ilustración de recuperación de contraseña" class="my-5 auth-illustration d-lg-block d-none" data-app-light-img="illustrations/auth-forgot-password-illustration-light.png" data-app-dark-img="illustrations/auth-forgot-password-illustration-dark.png">
|
||||
|
||||
<img src="{{ asset('vendor/vuexy-admin/img/illustrations/bg-shape-image-'.$configData['style'].'.png') }}" alt="Fondo de recuperación de contraseña" class="platform-bg" data-app-light-img="illustrations/bg-shape-image-light.png" data-app-dark-img="illustrations/bg-shape-image-dark.png">
|
||||
</div>
|
||||
</div>
|
||||
<!-- /Left Text -->
|
||||
|
||||
<!-- Recuperar Contraseña -->
|
||||
<div class="d-flex col-12 col-lg-4 align-items-center authentication-bg p-sm-12 p-6">
|
||||
<div class="w-px-400 mx-auto mt-12 mt-5">
|
||||
<h4 class="mb-1">¿Olvidaste tu Contraseña? 🔒</h4>
|
||||
<p class="mb-6">Ingresa tu correo electrónico y te enviaremos instrucciones para restablecer tu contraseña</p>
|
||||
|
||||
@if (session('status'))
|
||||
<div class="alert alert-success mb-4">
|
||||
{{ session('status') }}
|
||||
</div>
|
||||
@endif
|
||||
|
||||
<form method="POST" action="{{ route('password.email') }}" class="mb-6">
|
||||
@csrf
|
||||
<div class="mb-6 fv-row">
|
||||
<label for="email" class="form-label">Correo Electrónico</label>
|
||||
<input type="email"
|
||||
class="form-control @error('email') is-invalid @enderror"
|
||||
id="email"
|
||||
name="email"
|
||||
value="{{ old('email') }}"
|
||||
placeholder="Ingresa tu correo electrónico"
|
||||
required
|
||||
autofocus>
|
||||
@error('email')
|
||||
<div class="invalid-feedback">
|
||||
{{ $message }}
|
||||
</div>
|
||||
@enderror
|
||||
</div>
|
||||
<button type="submit" class="btn btn-primary d-grid w-100">
|
||||
Enviar Enlace de Restablecimiento
|
||||
</button>
|
||||
</form>
|
||||
|
||||
<div class="text-center">
|
||||
<a href="{{ route('login') }}" class="d-flex align-items-center justify-content-center">
|
||||
<i class="ti ti-chevron-left scaleX-n1-rtl me-1_5"></i>
|
||||
Volver al Inicio de Sesión
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- /Recuperar Contraseña -->
|
||||
</div>
|
||||
</div>
|
||||
@endsection
|
||||
134
resources/views/auth/login-basic.blade.php
Normal file
134
resources/views/auth/login-basic.blade.php
Normal file
@ -0,0 +1,134 @@
|
||||
@php
|
||||
use Laravel\Fortify\Features;
|
||||
|
||||
$customizerHidden = 'customizer-hide';
|
||||
$configData = Helper::appClasses();
|
||||
@endphp
|
||||
|
||||
@extends('vuexy-admin::layouts.vuexy.layoutMaster')
|
||||
|
||||
@section('title', 'Iniciar sesión')
|
||||
|
||||
@section('vendor-style')
|
||||
@vite([
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/vuexy-admin/vendor/libs/@form-validation/form-validation.scss'
|
||||
])
|
||||
@endsection
|
||||
|
||||
@push('page-style')
|
||||
@vite([
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/vuexy-admin/scss/auth/page-auth.scss'
|
||||
])
|
||||
@endsection
|
||||
|
||||
@section('vendor-script')
|
||||
@vite([
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/vuexy-admin/vendor/libs/@form-validation/popular.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/vuexy-admin/vendor/libs/@form-validation/bootstrap5.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/vuexy-admin/vendor/libs/@form-validation/auto-focus.js'
|
||||
])
|
||||
@endsection
|
||||
|
||||
@push('page-script')
|
||||
@vite([
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/vuexy-admin/js/auth/pages-auth.js'
|
||||
])
|
||||
@endpush
|
||||
|
||||
|
||||
@section('content')
|
||||
<div class="container-xxl">
|
||||
<div class="authentication-wrapper authentication-basic container-p-y">
|
||||
<div class="authentication-inner py-6">
|
||||
<!-- Login -->
|
||||
<div class="card">
|
||||
<div class="card-body">
|
||||
<!-- Logo -->
|
||||
<div class="app-brand justify-content-center mb-6">
|
||||
<a href="{{ url('/') }}" class="app-brand-link">
|
||||
<span class="app-brand-logo demo">
|
||||
<img src="{{ asset('storage/' . $_admin['image_logo']['small']) }}" alt="{{ $_admin['app_name'] }}" />
|
||||
</span>
|
||||
<span class="app-brand-text demo text-heading fw-bold">{{ $_admin['app_name'] }}</span>
|
||||
</a>
|
||||
</div>
|
||||
<!-- /Logo -->
|
||||
<h4 class="mb-1">¡Bienvenido a {{ $_admin['app_name'] }}! 👋</h4>
|
||||
<p class="mb-6">Inicie sesión en su cuenta y comience la aventura</p>
|
||||
|
||||
<form id="formAuthentication" class="mb-4" action="{{ route('login') }}" method="POST">
|
||||
@csrf
|
||||
<div class="mb-6 fv-row">
|
||||
<label for="email" class="form-label">Correo electrónico</label>
|
||||
<input type="text" class="form-control @error('email') is-invalid @enderror" id="email" name="email" placeholder="Ingrese su correo electrónico" autofocus value="{{ old('email') }}">
|
||||
@error('email')
|
||||
<span class="invalid-feedback" role="alert">
|
||||
<span class="fw-medium">{{ $message }}</span>
|
||||
</span>
|
||||
@enderror
|
||||
</div>
|
||||
<div class="mb-6 fv-row form-password-toggle">
|
||||
<label class="form-label" for="password">Contraseña</label>
|
||||
<div class="input-group input-group-merge">
|
||||
<input type="password" id="password" class="form-control @error('password') is-invalid @enderror" name="password" placeholder="············" aria-describedby="password" autocomplete="false" />
|
||||
<span class="input-group-text cursor-pointer"><i class="ti ti-eye-off"></i></span>
|
||||
</div>
|
||||
@error('password')
|
||||
<span class="invalid-feedback" role="alert">
|
||||
<span class="fw-medium">{{ $message }}</span>
|
||||
</span>
|
||||
@enderror
|
||||
</div>
|
||||
<div class="my-8">
|
||||
<div class="d-flex justify-content-between">
|
||||
<div class="form-check mb-0 ms-2">
|
||||
<input class="form-check-input" type="checkbox" id="remember-me" name="remember">
|
||||
<label class="form-check-label" for="remember-me">
|
||||
Recuérdame
|
||||
</label>
|
||||
</div>
|
||||
@if (Features::enabled(Features::resetPasswords()))
|
||||
<a href="{{ route('password.request') }}">
|
||||
<p class="mb-0">¿Olvidaste tu contraseña?</p>
|
||||
</a>
|
||||
@endif
|
||||
</div>
|
||||
</div>
|
||||
<div class="mb-6">
|
||||
<button class="btn btn-primary d-grid w-100" type="submit">Iniciar sesión</button>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
<p class="text-center">
|
||||
@if (Features::enabled(Features::registration()))
|
||||
<span>¿Nuevo en nuestra plataforma?</span>
|
||||
<a href="{{ route('register') }}">
|
||||
<span>Crea una cuenta</span>
|
||||
</a>
|
||||
@endif
|
||||
</p>
|
||||
|
||||
<div class="divider my-6">
|
||||
<div class="divider-text">o</div>
|
||||
</div>
|
||||
|
||||
<div class="d-flex justify-content-center">
|
||||
<a href="javascript:;" class="btn btn-sm btn-icon rounded-pill btn-text-facebook me-1_5">
|
||||
<i class="tf-icons ti ti-brand-facebook-filled"></i>
|
||||
</a>
|
||||
<a href="javascript:;" class="btn btn-sm btn-icon rounded-pill btn-text-twitter me-1_5">
|
||||
<i class="tf-icons ti ti-brand-twitter-filled"></i>
|
||||
</a>
|
||||
<a href="javascript:;" class="btn btn-sm btn-icon rounded-pill btn-text-github me-1_5">
|
||||
<i class="tf-icons ti ti-brand-github-filled"></i>
|
||||
</a>
|
||||
<a href="javascript:;" class="btn btn-sm btn-icon rounded-pill btn-text-google-plus">
|
||||
<i class="tf-icons ti ti-brand-google-filled"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@endsection
|
||||
133
resources/views/auth/login-cover.blade.php
Normal file
133
resources/views/auth/login-cover.blade.php
Normal file
@ -0,0 +1,133 @@
|
||||
@php
|
||||
use Laravel\Fortify\Features;
|
||||
|
||||
$customizerHidden = 'customizer-hide';
|
||||
$configData = Helper::appClasses();
|
||||
@endphp
|
||||
|
||||
@extends('vuexy-admin::layouts.vuexy.layoutMaster')
|
||||
|
||||
@section('title', 'Iniciar sesión')
|
||||
|
||||
@section('vendor-style')
|
||||
@vite('vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/form-validation.scss')
|
||||
@endsection
|
||||
|
||||
@push('page-style')
|
||||
@vite('vendor/koneko/laravel-vuexy-admin/resources/scss/pages/page-auth.scss')
|
||||
@endpush
|
||||
|
||||
@section('vendor-script')
|
||||
@vite([
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/popular.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/bootstrap5.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/auto-focus.js'
|
||||
])
|
||||
@endsection
|
||||
|
||||
@push('page-script')
|
||||
@vite('vendor/koneko/laravel-vuexy-admin/resources/js/auth/pages-auth.js')
|
||||
@endpush
|
||||
|
||||
@section('content')
|
||||
<div class="authentication-wrapper authentication-cover">
|
||||
<!-- Logo -->
|
||||
<a href="{{ url('/') }}" class="app-brand auth-cover-brand">
|
||||
<span class="app-brand-logo demo">
|
||||
<img src="{{ asset('storage/' . $_admin['image_logo']['small']) }}" alt="{{ $_admin['app_name'] }}" />
|
||||
</span>
|
||||
<span class="app-brand-text demo text-heading fw-bold">{{ $_admin['app_name'] }}</span>
|
||||
</a>
|
||||
<!-- /Logo -->
|
||||
<div class="authentication-inner row m-0">
|
||||
<!-- /Left Text -->
|
||||
<div class="d-none d-lg-flex col-lg-8 p-0">
|
||||
<div class="auth-cover-bg auth-cover-bg-color d-flex justify-content-center align-items-center">
|
||||
<img src="{{ asset('vendor/vuexy-admin/img/illustrations/auth-login-illustration-'.$configData['style'].'.png') }}" alt="auth-login-cover" class="my-5 auth-illustration" data-app-light-img="illustrations/auth-login-illustration-light.png" data-app-dark-img="illustrations/auth-login-illustration-dark.png">
|
||||
<img src="{{ asset('vendor/vuexy-admin/img/illustrations/bg-shape-image-'.$configData['style'].'.png') }}" alt="auth-login-cover" class="platform-bg" data-app-light-img="illustrations/bg-shape-image-light.png" data-app-dark-img="illustrations/bg-shape-image-dark.png">
|
||||
</div>
|
||||
</div>
|
||||
<!-- /Left Text -->
|
||||
|
||||
<!-- Login -->
|
||||
<div class="d-flex col-12 col-lg-4 align-items-center authentication-bg p-sm-12 p-6">
|
||||
<div class="w-px-400 mx-auto mt-12 pt-5">
|
||||
<h4 class="mb-1">¡Bienvenido a {{ $_admin['app_name'] }}! 👋</h4>
|
||||
<p class="mb-6">Inicie sesión en su cuenta y comience la aventura</p>
|
||||
|
||||
<form id="formAuthentication" class="mb-6" action="{{ route('login') }}" method="POST">
|
||||
@csrf
|
||||
<div class="mb-6 fv-row">
|
||||
<label for="email" class="form-label">Correo electrónico</label>
|
||||
<input type="text" class="form-control @error('email') is-invalid @enderror" id="email" name="email" placeholder="Ingrese el correo electrónico" autofocus value="{{ old('email') }}">
|
||||
@error('email')
|
||||
<span class="invalid-feedback" role="alert">
|
||||
<span class="fw-medium">{{ $message }}</span>
|
||||
</span>
|
||||
@enderror
|
||||
</div>
|
||||
<div class="mb-6 fv-row form-password-toggle">
|
||||
<label class="form-label" for="password">Contraseña</label>
|
||||
<div class="input-group input-group-merge">
|
||||
<input type="password" id="password" class="form-control" name="password" placeholder="············" aria-describedby="password" autocomplete="false" />
|
||||
<span class="input-group-text cursor-pointer"><i class="ti ti-eye-off"></i></span>
|
||||
</div>
|
||||
@error('password')
|
||||
<span class="invalid-feedback" role="alert">
|
||||
<span class="fw-medium">{{ $message }}</span>
|
||||
</span>
|
||||
@enderror
|
||||
</div>
|
||||
<div class="my-8">
|
||||
<div class="d-flex justify-content-between">
|
||||
<div class="form-check mb-0 ms-2">
|
||||
<input class="form-check-input" type="checkbox" id="remember-me" name="remember">
|
||||
<label class="form-check-label" for="remember-me">
|
||||
Recuérdame
|
||||
</label>
|
||||
</div>
|
||||
@if (Features::enabled(Features::resetPasswords()))
|
||||
<a href="{{ route('password.request') }}">
|
||||
<p class="mb-0">¿Olvidaste tu contraseña?</p>
|
||||
</a>
|
||||
@endif
|
||||
</div>
|
||||
</div>
|
||||
<button type="submit" class="btn btn-primary d-grid w-100">
|
||||
Iniciar sesión
|
||||
</button>
|
||||
</form>
|
||||
|
||||
<p class="text-center">
|
||||
@if (Features::enabled(Features::registration()))
|
||||
<span>¿Nuevo en nuestra plataforma?</span>
|
||||
<a href="{{ route('register') }}">
|
||||
<span>Crea una cuenta</span>
|
||||
</a>
|
||||
@endif
|
||||
</p>
|
||||
|
||||
<div class="divider my-6">
|
||||
<div class="divider-text">o</div>
|
||||
</div>
|
||||
|
||||
<div class="d-flex justify-content-center">
|
||||
<a href="javascript:;" class="btn btn-sm btn-icon rounded-pill btn-text-facebook me-1_5">
|
||||
<i class="tf-icons ti ti-brand-facebook-filled"></i>
|
||||
</a>
|
||||
<a href="javascript:;" class="btn btn-sm btn-icon rounded-pill btn-text-twitter me-1_5">
|
||||
<i class="tf-icons ti ti-brand-twitter-filled"></i>
|
||||
</a>
|
||||
<a href="javascript:;" class="btn btn-sm btn-icon rounded-pill btn-text-github me-1_5">
|
||||
<i class="tf-icons ti ti-brand-github-filled"></i>
|
||||
</a>
|
||||
<a href="javascript:;" class="btn btn-sm btn-icon rounded-pill btn-text-google-plus">
|
||||
<i class="tf-icons ti ti-brand-google-filled"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- /Login -->
|
||||
</div>
|
||||
</div>
|
||||
@endsection
|
||||
151
resources/views/auth/register-basic.blade.php
Normal file
151
resources/views/auth/register-basic.blade.php
Normal file
@ -0,0 +1,151 @@
|
||||
@php
|
||||
$customizerHidden = 'customizer-hide';
|
||||
@endphp
|
||||
|
||||
@extends('vuexy-admin::layouts.vuexy.layoutMaster')
|
||||
|
||||
@section('title', 'Registro de usuarios')
|
||||
|
||||
@section('vendor-style')
|
||||
@vite([
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/form-validation.scss'
|
||||
])
|
||||
@endsection
|
||||
|
||||
@push('page-style')
|
||||
@vite([
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/scss/pages/page-auth.scss'
|
||||
])
|
||||
@endsection
|
||||
|
||||
@section('vendor-script')
|
||||
@vite([
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/popular.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/bootstrap5.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/auto-focus.js'
|
||||
])
|
||||
@endsection
|
||||
|
||||
@push('page-script')
|
||||
@vite([
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/js/auth/pages-auth.js'
|
||||
])
|
||||
@endpush
|
||||
|
||||
@section('content')
|
||||
<div class="container-xxl">
|
||||
<div class="authentication-wrapper authentication-basic container-p-y">
|
||||
<div class="authentication-inner py-6">
|
||||
|
||||
<!-- Tarjeta de Registro -->
|
||||
<div class="card">
|
||||
<div class="card-body">
|
||||
<!-- Logo -->
|
||||
<div class="app-brand justify-content-center mb-6">
|
||||
<a href="{{ url('/') }}" class="app-brand-link">
|
||||
<span class="app-brand-logo demo">
|
||||
<img src="{{ asset('storage/' . $_admin['image_logo']['small']) }}" alt="{{ $_admin['app_name'] }}" />
|
||||
</span>
|
||||
<span class="app-brand-text demo text-heading fw-bold">{{ $_admin['app_name'] }}</span>
|
||||
</a>
|
||||
</div>
|
||||
<!-- /Logo -->
|
||||
<h4 class="mb-1">Empieza tu aventura 🚀</h4>
|
||||
<p class="mb-6">¡Gestiona tu aplicación de manera sencilla y divertida!</p>
|
||||
|
||||
<form id="formAuthentication" class="mb-6" action="{{ route('register') }}" method="POST">
|
||||
@csrf
|
||||
<div class="mb-6 fv-row">
|
||||
<label for="name" class="form-label">Nombre de usuario</label>
|
||||
<input type="text" class="form-control" id="name" name="name" placeholder="Ingresa tu nombre de usuario" autofocus required>
|
||||
@error('name')
|
||||
<span class="invalid-feedback" role="alert">
|
||||
<span class="fw-medium">{{ $message }}</span>
|
||||
</span>
|
||||
@enderror
|
||||
</div>
|
||||
<div class="mb-6 fv-row">
|
||||
<label for="email" class="form-label">Correo Electrónico</label>
|
||||
<input type="email" class="form-control" id="email" name="email" placeholder="Ingresa tu correo electrónico" required>
|
||||
@error('email')
|
||||
<span class="invalid-feedback" role="alert">
|
||||
<span class="fw-medium">{{ $message }}</span>
|
||||
</span>
|
||||
@enderror
|
||||
</div>
|
||||
<div class="mb-6 fv-row form-password-toggle">
|
||||
<label class="form-label" for="password">Contraseña</label>
|
||||
<div class="input-group input-group-merge">
|
||||
<input type="password" id="password" class="form-control" name="password" placeholder="············" aria-describedby="password" required />
|
||||
<span class="input-group-text cursor-pointer"><i class="ti ti-eye-off"></i></span>
|
||||
</div>
|
||||
@error('password')
|
||||
<span class="invalid-feedback" role="alert">
|
||||
<span class="fw-medium">{{ $message }}</span>
|
||||
</span>
|
||||
@enderror
|
||||
</div>
|
||||
<div class="mb-6 fv-row form-password-toggle">
|
||||
<label class="form-label" for="password_confirmation">Confirmar Contraseña</label>
|
||||
<div class="input-group input-group-merge">
|
||||
<input type="password" id="password_confirmation" class="form-control" name="password_confirmation" placeholder="············" required />
|
||||
<span class="input-group-text cursor-pointer"><i class="ti ti-eye-off"></i></span>
|
||||
</div>
|
||||
@error('password_confirmation')
|
||||
<span class="invalid-feedback" role="alert">
|
||||
<span class="fw-medium">{{ $message }}</span>
|
||||
</span>
|
||||
@enderror
|
||||
</div>
|
||||
|
||||
<div class="fv-row">
|
||||
<div class="my-8 fv-row">
|
||||
<div class="form-check mb-0 ms-2">
|
||||
<input class="form-check-input" type="checkbox" id="terms-conditions" name="terms" required>
|
||||
<label class="form-check-label" for="terms-conditions">
|
||||
Acepto la <a href="javascript:void(0);">política de privacidad y términos</a>
|
||||
</label>
|
||||
@error('terms')
|
||||
<span class="invalid-feedback" role="alert">
|
||||
<span class="fw-medium">{{ $message }}</span>
|
||||
</span>
|
||||
@enderror
|
||||
</div>
|
||||
</div>
|
||||
<button type="submit" class="btn btn-primary d-grid w-100">
|
||||
Registrarse
|
||||
</button>
|
||||
</form>
|
||||
|
||||
<p class="text-center">
|
||||
<span>¿Ya tienes una cuenta?</span>
|
||||
<a href="{{ route('login') }}">
|
||||
<span>Inicia sesión</span>
|
||||
</a>
|
||||
</p>
|
||||
|
||||
<div class="divider my-6">
|
||||
<div class="divider-text">o</div>
|
||||
</div>
|
||||
|
||||
<div class="d-flex justify-content-center">
|
||||
<a href="javascript:;" class="btn btn-sm btn-icon rounded-pill btn-text-facebook me-1_5">
|
||||
<i class="tf-icons ti ti-brand-facebook-filled"></i>
|
||||
</a>
|
||||
<a href="javascript:;" class="btn btn-sm btn-icon rounded-pill btn-text-twitter me-1_5">
|
||||
<i class="tf-icons ti ti-brand-twitter-filled"></i>
|
||||
</a>
|
||||
<a href="javascript:;" class="btn btn-sm btn-icon rounded-pill btn-text-github me-1_5">
|
||||
<i class="tf-icons ti ti-brand-github-filled"></i>
|
||||
</a>
|
||||
<a href="javascript:;" class="btn btn-sm btn-icon rounded-pill btn-text-google-plus">
|
||||
<i class="tf-icons ti ti-brand-google-filled"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- /Tarjeta de Registro -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@endsection
|
||||
132
resources/views/auth/register-cover.blade.php
Normal file
132
resources/views/auth/register-cover.blade.php
Normal file
@ -0,0 +1,132 @@
|
||||
@php
|
||||
$customizerHidden = 'customizer-hide';
|
||||
$configData = Helper::appClasses();
|
||||
@endphp
|
||||
|
||||
@extends('vuexy-admin::layouts.vuexy.layoutMaster')
|
||||
|
||||
@section('title', 'Registro de usuarios')
|
||||
|
||||
@section('vendor-style')
|
||||
@vite([
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/form-validation.scss'
|
||||
])
|
||||
@endsection
|
||||
|
||||
@push('page-style')
|
||||
@vite([
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/scss/pages/page-auth.scss'
|
||||
])
|
||||
@endsection
|
||||
|
||||
@section('vendor-script')
|
||||
@vite([
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/popular.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/bootstrap5.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/auto-focus.js'
|
||||
])
|
||||
@endsection
|
||||
|
||||
@push('page-script')
|
||||
@vite([
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/js/auth/pages-auth.js'
|
||||
])
|
||||
@endpush
|
||||
|
||||
@section('content')
|
||||
<div class="authentication-wrapper authentication-cover">
|
||||
<!-- Logo -->
|
||||
<a href="{{ url('/') }}" class="app-brand auth-cover-brand">
|
||||
<span class="app-brand-logo demo">
|
||||
<img src="{{ asset('storage/' . $_admin['image_logo']['small']) }}" alt="{{ $_admin['app_name'] }}" />
|
||||
</span>
|
||||
<span class="app-brand-text demo text-heading fw-bold">{{ $_admin['app_name'] }}</span>
|
||||
</a>
|
||||
<!-- /Logo -->
|
||||
|
||||
<div class="authentication-inner row m-0">
|
||||
<!-- Texto Izquierdo -->
|
||||
<div class="d-none d-lg-flex col-lg-8 p-0">
|
||||
<div class="auth-cover-bg auth-cover-bg-color d-flex justify-content-center align-items-center">
|
||||
<img src="{{ asset('vendor/vuexy-admin/img/illustrations/auth-register-illustration-'.$configData['style'].'.png') }}" alt="registro-cubierta" class="my-5 auth-illustration" data-app-light-img="illustrations/auth-register-illustration-light.png" data-app-dark-img="illustrations/auth-register-illustration-dark.png">
|
||||
<img src="{{ asset('vendor/vuexy-admin/img/illustrations/bg-shape-image-'.$configData['style'].'.png') }}" alt="registro-cubierta" class="platform-bg" data-app-light-img="illustrations/bg-shape-image-light.png" data-app-dark-img="illustrations/bg-shape-image-dark.png">
|
||||
</div>
|
||||
</div>
|
||||
<!-- /Texto Izquierdo -->
|
||||
|
||||
<!-- Registro -->
|
||||
<div class="d-flex col-12 col-lg-4 align-items-center authentication-bg p-sm-12 p-6">
|
||||
<div class="w-px-400 mx-auto mt-12 pt-5">
|
||||
<h4 class="mb-1">Empieza tu aventura 🚀</h4>
|
||||
<p class="mb-6">Gestiona tu aplicación de manera sencilla y divertida.</p>
|
||||
|
||||
<!-- Formulario de Registro -->
|
||||
<form id="formAuthentication" class="mb-6" action="{{ route('register') }}" method="POST">
|
||||
@csrf
|
||||
<div class="mb-6 fv-row">
|
||||
<label for="name" class="form-label">Nombre de usuario</label>
|
||||
<input type="text" class="form-control" id="name" name="name" placeholder="Ingresa tu nombre de usuario" autofocus required>
|
||||
</div>
|
||||
<div class="mb-6 fv-row">
|
||||
<label for="email" class="form-label">Correo Electrónico</label>
|
||||
<input type="email" class="form-control" id="email" name="email" placeholder="Ingresa tu correo electrónico" required>
|
||||
</div>
|
||||
<div class="mb-6 fv-row form-password-toggle">
|
||||
<label class="form-label" for="password">Contraseña</label>
|
||||
<div class="input-group input-group-merge">
|
||||
<input type="password" id="password" class="form-control" name="password" placeholder="············" aria-describedby="password" required />
|
||||
<span class="input-group-text cursor-pointer"><i class="ti ti-eye-off"></i></span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mb-6 fv-row form-password-toggle">
|
||||
<label class="form-label" for="password_confirmation">Confirmar Contraseña</label>
|
||||
<div class="input-group input-group-merge">
|
||||
<input type="password" id="password_confirmation" class="form-control" name="password_confirmation" placeholder="············" required />
|
||||
<span class="input-group-text cursor-pointer"><i class="ti ti-eye-off"></i></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mb-6 fv-row mt-8">
|
||||
<div class="form-check mb-8 ms-2">
|
||||
<input class="form-check-input" type="checkbox" id="terms-conditions" name="terms" required>
|
||||
<label class="form-check-label" for="terms-conditions">
|
||||
Acepto la <a href="javascript:void(0);">política de privacidad y términos</a>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
<button class="btn btn-primary d-grid w-100">
|
||||
Registrarse
|
||||
</button>
|
||||
</form>
|
||||
|
||||
<p class="text-center">
|
||||
<span>¿Ya tienes una cuenta?</span>
|
||||
<a href="{{ route('login') }}">
|
||||
<span>Iniciar sesión</span>
|
||||
</a>
|
||||
</p>
|
||||
|
||||
<div class="divider my-6">
|
||||
<div class="divider-text">o</div>
|
||||
</div>
|
||||
|
||||
<div class="d-flex justify-content-center">
|
||||
<a href="javascript:;" class="btn btn-sm btn-icon rounded-pill btn-text-facebook me-1_5">
|
||||
<i class="tf-icons ti ti-brand-facebook-filled"></i>
|
||||
</a>
|
||||
<a href="javascript:;" class="btn btn-sm btn-icon rounded-pill btn-text-twitter me-1_5">
|
||||
<i class="tf-icons ti ti-brand-twitter-filled"></i>
|
||||
</a>
|
||||
<a href="javascript:;" class="btn btn-sm btn-icon rounded-pill btn-text-github me-1_5">
|
||||
<i class="tf-icons ti ti-brand-github-filled"></i>
|
||||
</a>
|
||||
<a href="javascript:;" class="btn btn-sm btn-icon rounded-pill btn-text-google-plus">
|
||||
<i class="tf-icons ti ti-brand-google-filled"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- /Registro -->
|
||||
</div>
|
||||
</div>
|
||||
@endsection
|
||||
130
resources/views/auth/reset-password-basic.blade.php
Normal file
130
resources/views/auth/reset-password-basic.blade.php
Normal file
@ -0,0 +1,130 @@
|
||||
@php
|
||||
$customizerHidden = 'customizer-hide';
|
||||
@endphp
|
||||
|
||||
@extends('vuexy-admin::layouts.vuexy.layoutMaster')
|
||||
|
||||
@section('title', 'Restablecer Contraseña')
|
||||
|
||||
@section('vendor-style')
|
||||
@vite([
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/form-validation.scss'
|
||||
])
|
||||
@endsection
|
||||
|
||||
@push('page-style')
|
||||
@vite([
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/scss/pages/page-auth.scss'
|
||||
])
|
||||
@endsection
|
||||
|
||||
@section('vendor-script')
|
||||
@vite([
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/popular.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/bootstrap5.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/auto-focus.js'
|
||||
])
|
||||
@endsection
|
||||
|
||||
@push('page-script')
|
||||
@vite([
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/js/auth/pages-auth.js'
|
||||
])
|
||||
@endpush
|
||||
|
||||
@section('content')
|
||||
<div class="container-xxl">
|
||||
<div class="authentication-wrapper authentication-basic container-p-y">
|
||||
<div class="authentication-inner py-6">
|
||||
<!-- Restablecer Contraseña -->
|
||||
<div class="card">
|
||||
<div class="card-body">
|
||||
<!-- Logo -->
|
||||
<div class="app-brand justify-content-center mb-6">
|
||||
<a href="{{ url('/') }}" class="app-brand-link">
|
||||
<span class="app-brand-logo demo">
|
||||
<img src="{{ asset('storage/' . $_admin['image_logo']['small']) }}" alt="{{ $_admin['app_name'] }}" />
|
||||
</span>
|
||||
<span class="app-brand-text demo text-heading fw-bold">{{ $_admin['app_name'] }}</span>
|
||||
</a>
|
||||
</div>
|
||||
<!-- /Logo -->
|
||||
<h4 class="mb-1">Restablecer Contraseña 🔒</h4>
|
||||
<p class="mb-6"><span class="fw-medium">Tu nueva contraseña debe ser diferente de las contraseñas utilizadas anteriormente</span></p>
|
||||
|
||||
<form method="POST" action="{{ route('password.update') }}" class="mb-6">
|
||||
@csrf
|
||||
|
||||
{{-- Token de restablecimiento de contraseña --}}
|
||||
<input type="hidden" name="token" value="{{ $request->route('token') }}">
|
||||
|
||||
<div class="mb-6 fv-row form-password-toggle">
|
||||
<label class="form-label" for="email">Correo Electrónico</label>
|
||||
<input type="email"
|
||||
id="email"
|
||||
class="form-control @error('email') is-invalid @enderror"
|
||||
name="email"
|
||||
value="{{ old('email', $request->email) }}"
|
||||
required
|
||||
autofocus
|
||||
readonly>
|
||||
|
||||
@error('email')
|
||||
<div class="invalid-feedback">
|
||||
{{ $message }}
|
||||
</div>
|
||||
@enderror
|
||||
</div>
|
||||
|
||||
<div class="mb-6 fv-row form-password-toggle">
|
||||
<label class="form-label" for="password">Nueva Contraseña</label>
|
||||
<div class="input-group input-group-merge">
|
||||
<input type="password"
|
||||
id="password"
|
||||
class="form-control @error('password') is-invalid @enderror"
|
||||
name="password"
|
||||
placeholder="············"
|
||||
required
|
||||
autocomplete="new-password" />
|
||||
<span class="input-group-text cursor-pointer"><i class="ti ti-eye-off"></i></span>
|
||||
|
||||
@error('password')
|
||||
<div class="invalid-feedback">
|
||||
{{ $message }}
|
||||
</div>
|
||||
@enderror
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mb-6 fv-row form-password-toggle">
|
||||
<label class="form-label" for="password_confirmation">Confirmar Contraseña</label>
|
||||
<div class="input-group input-group-merge">
|
||||
<input type="password"
|
||||
id="password_confirmation"
|
||||
class="form-control"
|
||||
name="password_confirmation"
|
||||
placeholder="············"
|
||||
required
|
||||
autocomplete="new-password" />
|
||||
<span class="input-group-text cursor-pointer"><i class="ti ti-eye-off"></i></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<button type="submit" class="btn btn-primary d-grid w-100 mb-6">
|
||||
Establecer Nueva Contraseña
|
||||
</button>
|
||||
|
||||
<div class="text-center">
|
||||
<a href="{{ route('login') }}" class="d-flex justify-content-center align-items-center">
|
||||
<i class="ti ti-chevron-left scaleX-n1-rtl me-1_5"></i>
|
||||
Volver al Inicio de Sesión
|
||||
</a>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
<!-- /Restablecer Contraseña -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@endsection
|
||||
137
resources/views/auth/reset-password-cover.blade.php
Normal file
137
resources/views/auth/reset-password-cover.blade.php
Normal file
@ -0,0 +1,137 @@
|
||||
@php
|
||||
$customizerHidden = 'customizer-hide';
|
||||
$configData = Helper::appClasses();
|
||||
@endphp
|
||||
|
||||
@extends('vuexy-admin::layouts.vuexy.layoutMaster')
|
||||
|
||||
@section('title', 'Restablecer Contraseña')
|
||||
|
||||
@section('vendor-style')
|
||||
@vite([
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/form-validation.scss'
|
||||
])
|
||||
@endsection
|
||||
|
||||
@push('page-style')
|
||||
@vite([
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/scss/pages/page-auth.scss'
|
||||
])
|
||||
@endsection
|
||||
|
||||
@section('vendor-script')
|
||||
@vite([
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/popular.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/bootstrap5.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/auto-focus.js'
|
||||
])
|
||||
@endsection
|
||||
|
||||
@push('page-script')
|
||||
@vite([
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/js/auth/pages-auth.js'
|
||||
])
|
||||
@endpush
|
||||
|
||||
@section('content')
|
||||
<div class="authentication-wrapper authentication-cover">
|
||||
<!-- Logo -->
|
||||
<a href="{{ url('/') }}" class="app-brand auth-cover-brand">
|
||||
<span class="app-brand-logo demo">
|
||||
<img src="{{ asset('storage/' . $_admin['image_logo']['small']) }}" alt="{{ $_admin['app_name'] }}" />
|
||||
</span>
|
||||
<span class="app-brand-text demo text-heading fw-bold">{{ $_admin['app_name'] }}</span>
|
||||
</a>
|
||||
<!-- /Logo -->
|
||||
<div class="authentication-inner row m-0">
|
||||
|
||||
<!-- /Left Text -->
|
||||
<div class="d-none d-lg-flex col-lg-8 p-0">
|
||||
<div class="auth-cover-bg auth-cover-bg-color d-flex justify-content-center align-items-center">
|
||||
<img src="{{ asset('vendor/vuexy-admin/img/illustrations/auth-reset-password-illustration-'.$configData['style'].'.png') }}" alt="Ilustración de restablecimiento de contraseña" class="my-5 auth-illustration" data-app-light-img="illustrations/auth-reset-password-illustration-light.png" data-app-dark-img="illustrations/auth-reset-password-illustration-dark.png">
|
||||
<img src="{{ asset('vendor/vuexy-admin/img/illustrations/bg-shape-image-'.$configData['style'].'.png') }}" alt="Fondo de restablecimiento de contraseña" class="platform-bg" data-app-light-img="illustrations/bg-shape-image-light.png" data-app-dark-img="illustrations/bg-shape-image-dark.png">
|
||||
</div>
|
||||
</div>
|
||||
<!-- /Left Text -->
|
||||
|
||||
<!-- Restablecer Contraseña -->
|
||||
<div class="d-flex col-12 col-lg-4 align-items-center authentication-bg p-6 p-sm-12">
|
||||
<div class="w-px-400 mx-auto mt-12 pt-5">
|
||||
<h4 class="mb-1">Restablecer Contraseña 🔒</h4>
|
||||
<p class="mb-6"><span class="fw-medium">Tu nueva contraseña debe ser diferente de las contraseñas utilizadas anteriormente</span></p>
|
||||
|
||||
<form method="POST" action="{{ route('password.update') }}" class="mb-6">
|
||||
@csrf
|
||||
|
||||
{{-- Token de restablecimiento de contraseña --}}
|
||||
<input type="hidden" name="token" value="{{ $request->route('token') }}">
|
||||
|
||||
<div class="mb-6 fv-row form-password-toggle">
|
||||
<label class="form-label" for="email">Correo Electrónico</label>
|
||||
<input type="email"
|
||||
id="email"
|
||||
class="form-control @error('email') is-invalid @enderror"
|
||||
name="email"
|
||||
value="{{ old('email', $request->email) }}"
|
||||
required
|
||||
autofocus
|
||||
readonly>
|
||||
|
||||
@error('email')
|
||||
<div class="invalid-feedback">
|
||||
{{ $message }}
|
||||
</div>
|
||||
@enderror
|
||||
</div>
|
||||
|
||||
<div class="mb-6 fv-row form-password-toggle">
|
||||
<label class="form-label" for="password">Nueva Contraseña</label>
|
||||
<div class="input-group input-group-merge">
|
||||
<input type="password"
|
||||
id="password"
|
||||
class="form-control @error('password') is-invalid @enderror"
|
||||
name="password"
|
||||
placeholder="············"
|
||||
required
|
||||
autocomplete="new-password" />
|
||||
<span class="input-group-text cursor-pointer"><i class="ti ti-eye-off"></i></span>
|
||||
|
||||
@error('password')
|
||||
<div class="invalid-feedback">
|
||||
{{ $message }}
|
||||
</div>
|
||||
@enderror
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mb-6 fv-row form-password-toggle">
|
||||
<label class="form-label" for="password_confirmation">Confirmar Contraseña</label>
|
||||
<div class="input-group input-group-merge">
|
||||
<input type="password"
|
||||
id="password_confirmation"
|
||||
class="form-control"
|
||||
name="password_confirmation"
|
||||
placeholder="············"
|
||||
required
|
||||
autocomplete="new-password" />
|
||||
<span class="input-group-text cursor-pointer"><i class="ti ti-eye-off"></i></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<button type="submit" class="btn btn-primary d-grid w-100 mb-6">
|
||||
Establecer Nueva Contraseña
|
||||
</button>
|
||||
|
||||
<div class="text-center">
|
||||
<a href="{{ route('login') }}" class="d-flex align-items-center justify-content-center">
|
||||
<i class="ti ti-chevron-left scaleX-n1-rtl me-1_5"></i>
|
||||
Volver al Inicio de Sesión
|
||||
</a>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
<!-- /Restablecer Contraseña -->
|
||||
</div>
|
||||
</div>
|
||||
@endsection
|
||||
41
resources/views/cache-manager/index.blade.php
Normal file
41
resources/views/cache-manager/index.blade.php
Normal file
@ -0,0 +1,41 @@
|
||||
@extends('vuexy-admin::layouts.vuexy.layoutMaster')
|
||||
|
||||
@section('title', 'Ajustes de caché')
|
||||
|
||||
@push('page-script')
|
||||
@vite('vendor/koneko/laravel-vuexy-admin/resources/js/pages/cache-manager-scripts.js')
|
||||
@endpush
|
||||
|
||||
@section('content')
|
||||
<div class="row">
|
||||
<div class="col-md-4">
|
||||
<div class="mb-6">
|
||||
@livewire('cache-stats')
|
||||
</div>
|
||||
<div class="mb-6">
|
||||
@livewire('session-stats')
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-8">
|
||||
<div class="mb-6">
|
||||
@livewire('cache-functions')
|
||||
</div>
|
||||
<div class="row">
|
||||
@if($configCache['redisInUse'])
|
||||
<div class="col-md-6">
|
||||
<div class="mb-6">
|
||||
@livewire('redis-stats')
|
||||
</div>
|
||||
</div>
|
||||
@endif
|
||||
@if($configCache['memcachedInUse'])
|
||||
<div class="col-md-6">
|
||||
<div class="mb-6">
|
||||
@livewire('memcached-stats')
|
||||
</div>
|
||||
</div>
|
||||
@endif
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@endsection
|
||||
63
resources/views/components/button/basic.blade.php
Normal file
63
resources/views/components/button/basic.blade.php
Normal file
@ -0,0 +1,63 @@
|
||||
@props([
|
||||
'type' => 'button', // Tipo de botón: button, submit, reset (solo para botones)
|
||||
'href' => null, // URL si es un enlace
|
||||
'route' => null, // URL si es un enlace
|
||||
'target' => '_self', // Target del enlace (_self, _blank, etc.)
|
||||
'label' => '', // Texto del botón
|
||||
'size' => 'md', // Tamaño: xs, sm, md, lg, xl
|
||||
'variant' => 'primary', // Color del botón (primary, secondary, success, danger, warning, info, dark)
|
||||
'labelStyle' => false, // Usa `btn-label-*`
|
||||
'outline' => false, // Habilitar estilo outline
|
||||
'textStyle' => false, // Habilitar estilo de texto
|
||||
'rounded' => false, // Habilitar bordes redondeados
|
||||
'block' => false, // Convertir en botón de ancho completo
|
||||
'waves' => true, // Habilitar efecto Vuexy (waves-effect)
|
||||
'icon' => '', // Clases del ícono (ej: 'ti ti-home')
|
||||
'iconOnly' => false, // Botón solo con ícono
|
||||
'iconPosition' => 'left', // Posición del ícono: left, right
|
||||
'active' => false, // Activar estado de botón
|
||||
'disabled' => false, // Deshabilitar botón
|
||||
'attributes' => new \Illuminate\View\ComponentAttributeBag([]), // Atributos adicionales
|
||||
])
|
||||
|
||||
@php
|
||||
// Generar clases dinámicas
|
||||
$classes = [
|
||||
'btn',
|
||||
$labelStyle ? "btn-label-$variant" : '',
|
||||
$outline ? "btn-outline-$variant" : '',
|
||||
$textStyle ? "btn-text-$variant" : '',
|
||||
$labelStyle || $outline || $textStyle ? '' : "btn-$variant",
|
||||
$rounded ? 'rounded-pill' : '',
|
||||
$block ? 'd-block w-100' : '',
|
||||
$waves ? 'waves-effect' : '',
|
||||
$size !== 'md' ? "btn-$size" : '',
|
||||
$active ? 'active' : '',
|
||||
$disabled ? 'disabled' : '',
|
||||
$iconOnly ? 'btn-icon' : '',
|
||||
];
|
||||
@endphp
|
||||
|
||||
@if ($href || $route)
|
||||
{{-- Si es un enlace --}}
|
||||
<a {{ $attributes->merge(['class' => implode(' ', array_filter($classes)), 'href' => ($href?? route($route)), 'target' => $target]) }}>
|
||||
@if ($icon && $iconPosition === 'left')
|
||||
<i class="{{ $icon }} {{ $label ? 'me-2' : '' }}"></i>
|
||||
@endif
|
||||
{{ $label }}
|
||||
@if ($icon && $iconPosition === 'right')
|
||||
<i class="{{ $icon }} {{ $label ? 'ms-2' : '' }}"></i>
|
||||
@endif
|
||||
</a>
|
||||
@else
|
||||
{{-- Si es un botón --}}
|
||||
<button type="{{ $type }}" {{ $attributes->merge(['class' => implode(' ', array_filter($classes))]) }}>
|
||||
@if ($icon && $iconPosition === 'left')
|
||||
<i class="{{ $icon }} {{ $label ? 'me-2' : '' }}"></i>
|
||||
@endif
|
||||
{{ $label }}
|
||||
@if ($icon && $iconPosition === 'right')
|
||||
<i class="{{ $icon }} {{ $label ? 'ms-2' : '' }}"></i>
|
||||
@endif
|
||||
</button>
|
||||
@endif
|
||||
46
resources/views/components/button/group.blade.php
Normal file
46
resources/views/components/button/group.blade.php
Normal file
@ -0,0 +1,46 @@
|
||||
@props([
|
||||
'buttons' => [], // Lista de botones en formato de array
|
||||
'toolbar' => false, // Si es un grupo de botones estilo "toolbar"
|
||||
'nesting' => false, // Si hay un grupo anidado con dropdown
|
||||
'class' => '', // Clases adicionales
|
||||
])
|
||||
|
||||
@php
|
||||
// Determinar si es un toolbar o un grupo simple
|
||||
$groupClass = $toolbar ? 'btn-toolbar' : 'btn-group';
|
||||
@endphp
|
||||
|
||||
<div class="{{ $groupClass }} {{ $class }}" role="group" aria-label="Button group">
|
||||
@foreach($buttons as $button)
|
||||
@if(isset($button['dropdown']))
|
||||
{{-- Botón con dropdown anidado --}}
|
||||
<div class="btn-group" role="group">
|
||||
<button id="btnGroupDrop{{ $loop->index }}" type="button" class="btn {{ $button['variant'] ?? 'btn-outline-secondary' }} dropdown-toggle waves-effect" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
|
||||
@if(isset($button['icon'])) <i class="{{ $button['icon'] }} ti-md"></i> @endif
|
||||
<span class="d-none d-sm-block">{{ $button['label'] ?? 'Dropdown' }}</span>
|
||||
</button>
|
||||
<div class="dropdown-menu" aria-labelledby="btnGroupDrop{{ $loop->index }}">
|
||||
@foreach($button['dropdown'] as $dropdownItem)
|
||||
<a class="dropdown-item waves-effect" href="{{ $dropdownItem['href'] ?? 'javascript:void(0);' }}">
|
||||
{{ $dropdownItem['label'] }}
|
||||
</a>
|
||||
@endforeach
|
||||
</div>
|
||||
</div>
|
||||
@else
|
||||
{{-- Botón normal o ancla --}}
|
||||
@if(isset($button['href']))
|
||||
<a href="{{ route($button['href']) }}" class="btn {{ $button['variant'] ?? 'btn-outline-secondary' }} waves-effect">
|
||||
@if(isset($button['icon'])) <i class="{{ $button['icon'] }} ti-md"></i> @endif
|
||||
{{ $button['label'] }}
|
||||
</a>
|
||||
@else
|
||||
<button type="{{ $button['type'] ?? 'button' }}" class="btn {{ $button['variant'] ?? 'btn-outline-secondary' }} waves-effect"
|
||||
{{ $button['disabled'] ?? false ? 'disabled' : '' }}>
|
||||
@if(isset($button['icon'])) <i class="{{ $button['icon'] }} ti-md"></i> @endif
|
||||
{{ $button['label'] }}
|
||||
</button>
|
||||
@endif
|
||||
@endif
|
||||
@endforeach
|
||||
</div>
|
||||
30
resources/views/components/button/index-off-canvas.blade.php
Normal file
30
resources/views/components/button/index-off-canvas.blade.php
Normal file
@ -0,0 +1,30 @@
|
||||
@php
|
||||
use Illuminate\Support\Str;
|
||||
@endphp
|
||||
|
||||
@props([
|
||||
'label' => '',
|
||||
'tagName' => '',
|
||||
'icon' => 'ti ti-pencil-plus',
|
||||
])
|
||||
|
||||
@php
|
||||
$tagOffcanvas = ucfirst(Str::camel($tagName));
|
||||
$helperTag = Str::kebab($tagName);
|
||||
|
||||
$ariaControls = "'offcanvas{$tagOffcanvas}";
|
||||
$dataBsToggle = 'offcanvas';
|
||||
$dataBsTarget = "#offcanvas{$tagOffcanvas}";
|
||||
$onclick = "window.formHelpers['{$helperTag}'].reloadOffcanvas('create')";
|
||||
@endphp
|
||||
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-primary waves-effect waves-light"
|
||||
tabindex="0"
|
||||
aria-controls='{{ $ariaControls }}'
|
||||
data-bs-toggle="{{ $dataBsToggle }}"
|
||||
data-bs-target="{{ $dataBsTarget }}"
|
||||
onclick="{!! $onclick !!}">
|
||||
<span class="ti-xs {{ $icon }} me-2"></span>{{ ucfirst($label) }}
|
||||
</button>
|
||||
@ -0,0 +1,18 @@
|
||||
@props([
|
||||
'tagName' => '',
|
||||
'mode' => 'create',
|
||||
])
|
||||
|
||||
@php
|
||||
$helperTag = Str::kebab($tagName);
|
||||
|
||||
$onclick = "window.formHelpers['{$helperTag}'].reloadOffcanvas('reset')";
|
||||
@endphp
|
||||
|
||||
<div class="pt-3">
|
||||
<button type="submit" class="btn btn-submit waves-effect waves mr-3 mb-3"></button>
|
||||
<button type="reset" class="btn btn-reset mr-3 mb-3" onclick="{{ $onclick }}" data-bs-dismiss="offcanvas" aria-label="Close">Cancelar</button>
|
||||
</div>
|
||||
@if($mode == 'delete')
|
||||
<x-vuexy-admin::form.checkbox model="confirmDeletion" label="Confirmar eliminación" parentClass="confirm-deletion" data-always-enabled switch switch-type="square" color="danger" size="lg" with-icon />
|
||||
@endif
|
||||
76
resources/views/components/card/basic.blade.php
Normal file
76
resources/views/components/card/basic.blade.php
Normal file
@ -0,0 +1,76 @@
|
||||
@props([
|
||||
'title' => '',
|
||||
'subtitle' => '',
|
||||
'image' => null,
|
||||
'bgColor' => '', // primary, secondary, success, danger, etc.
|
||||
'borderColor' => '', // primary, secondary, etc.
|
||||
'textColor' => 'text-dark',
|
||||
'shadow' => true, // true / false
|
||||
'dropdown' => [], // Opciones para el menú
|
||||
'footer' => '',
|
||||
'footerClass' => '', // Clase CSS personalizada para el footer
|
||||
'footerAlign' => 'start', // Alineación: start, center, end
|
||||
'footerButtons' => [], // Botones de acción
|
||||
'class' => 'mb-6',
|
||||
])
|
||||
|
||||
@php
|
||||
$cardClass = 'card ' . ($shadow ? '' : 'shadow-none') . ' ' . ($bgColor ? "bg-$bgColor text-white" : '') . ' ' . ($borderColor ? "border border-$borderColor" : '') . " $class";
|
||||
$footerAlignment = match ($footerAlign) {
|
||||
'center' => 'text-center',
|
||||
'end' => 'text-end',
|
||||
default => 'text-start'
|
||||
};
|
||||
@endphp
|
||||
|
||||
<div class="{{ $cardClass }}">
|
||||
@if ($image)
|
||||
<img class="card-img-top" src="{{ $image }}" alt="Card image">
|
||||
@endif
|
||||
|
||||
@if ($title || $subtitle || $dropdown)
|
||||
<div class="card-header d-flex justify-content-between">
|
||||
<div class="card-title mb-0">
|
||||
@if ($title)
|
||||
<h5 class="mb-1 {{ $textColor }}">{{ $title }}</h5>
|
||||
@endif
|
||||
@if ($subtitle)
|
||||
<p class="card-subtitle {{ $textColor }}">{{ $subtitle }}</p>
|
||||
@endif
|
||||
</div>
|
||||
@if (!empty($dropdown))
|
||||
<div class="dropdown">
|
||||
<button class="btn btn-text-secondary rounded-pill text-muted border-0 p-2" type="button" data-bs-toggle="dropdown">
|
||||
<i class="ti ti-dots-vertical"></i>
|
||||
</button>
|
||||
<div class="dropdown-menu dropdown-menu-end">
|
||||
@foreach ($dropdown as $item)
|
||||
<a class="dropdown-item" href="{{ $item['href'] ?? 'javascript:void(0);' }}">{{ $item['label'] }}</a>
|
||||
@endforeach
|
||||
</div>
|
||||
</div>
|
||||
@endif
|
||||
</div>
|
||||
@endif
|
||||
|
||||
<div class="card-body">
|
||||
{{ $slot }}
|
||||
</div>
|
||||
|
||||
{{-- Footer flexible --}}
|
||||
@if ($footer || !empty($footerButtons))
|
||||
<div class="card-footer {{ $footerClass }} {{ $footerAlignment }}">
|
||||
{{-- Slot de contenido directo en el footer --}}
|
||||
@if ($footer)
|
||||
{!! $footer !!}
|
||||
@endif
|
||||
|
||||
{{-- Generación dinámica de botones --}}
|
||||
@foreach ($footerButtons as $button)
|
||||
<a href="{{ $button['href'] ?? '#' }}" class="btn btn-{{ $button['type'] ?? 'primary' }} {{ $button['class'] ?? '' }}">
|
||||
{{ $button['label'] }}
|
||||
</a>
|
||||
@endforeach
|
||||
</div>
|
||||
@endif
|
||||
</div>
|
||||
70
resources/views/components/file/dropzone.blade.php
Normal file
70
resources/views/components/file/dropzone.blade.php
Normal file
@ -0,0 +1,70 @@
|
||||
@props([
|
||||
// Identificador único
|
||||
'uid' => uniqid(),
|
||||
|
||||
// Modelo para Livewire
|
||||
'model' => '',
|
||||
|
||||
// Etiqueta y Texto de ayuda
|
||||
'message' => '',
|
||||
'note' => '',
|
||||
|
||||
// Clases generales
|
||||
'size' => 'md', // Tamaño del textarea (xxs, xs, sm, md)
|
||||
'mb0' => false, // Remover margen inferior
|
||||
'parentClass' => '',
|
||||
])
|
||||
|
||||
@php
|
||||
// **Configuración de Name, ID y Model**
|
||||
$livewireModel = $attributes->get('wire:model', $model);
|
||||
$name = $attributes->get('name', $livewireModel);
|
||||
$inputId = $attributes->get('id', $name . '_' . $uid);
|
||||
|
||||
// **Manejo de errores**
|
||||
$errorKey = $livewireModel ?: $name;
|
||||
$hasError = $errors->has($errorKey);
|
||||
$errorClass = $hasError ? 'is-invalid' : '';
|
||||
|
||||
// **Clases dinámicas**
|
||||
$sizeClassDropzone = match ($size) {
|
||||
'sm' => 'dropzone-sm',
|
||||
'xs' => 'dropzone-xs',
|
||||
'md' => 'dropzone-md',
|
||||
default => '',
|
||||
};
|
||||
|
||||
$sizeClassButton = match ($size) {
|
||||
'sm' => 'btn-sm',
|
||||
'xs' => 'btn-xs',
|
||||
default => '',
|
||||
};
|
||||
@endphp
|
||||
|
||||
<!-- Dropzone (se oculta automáticamente después de la carga) -->
|
||||
<div class="{{ $mb0 ? '' : 'mb-4 ' }} {{ $sizeClassDropzone }}">
|
||||
<div class="dropzone" id="dropzone_{{ $inputId }}"">
|
||||
<div class="dz-message">
|
||||
@if ($size == 'sm' || $size == 'xs')
|
||||
<div class="flex items-center">
|
||||
<span class="btn btn-icon {{ $sizeClassButton }} btn-label-secondary mr-2">
|
||||
<i class="ti ti-upload text-base"></i>
|
||||
</span>
|
||||
<span>
|
||||
{{ $message }}
|
||||
<span class="note needsclick">{!! $note !!}</span>
|
||||
</span>
|
||||
</div>
|
||||
@else
|
||||
{{ $message }}
|
||||
<span class="note needsclick">{!! $note !!}</span>
|
||||
@endif
|
||||
</div>
|
||||
</div>
|
||||
<input type="file" wire:model="pdf" {{ $livewireModel ? "wire:model=$livewireModel" : '' }} id="{{ $inputId }}" accept="application/pdf" class="d-none">
|
||||
|
||||
{{-- Mensaje de error --}}
|
||||
@if ($hasError)
|
||||
<span class="text-danger">{{ $errors->first($errorKey) }}</span>
|
||||
@endif
|
||||
</div>
|
||||
148
resources/views/components/form/checkbox-group.blade.php
Normal file
148
resources/views/components/form/checkbox-group.blade.php
Normal file
@ -0,0 +1,148 @@
|
||||
@props([
|
||||
// Identificador único
|
||||
'uid' => uniqid(),
|
||||
|
||||
// Modelos para Livewire
|
||||
'checkboxModel' => '',
|
||||
'textModel' => '',
|
||||
|
||||
// Etiqueta y clases de la etiqueta
|
||||
'label' => '',
|
||||
'labelClass' => '',
|
||||
|
||||
// Clases generales
|
||||
'align' => 'start',
|
||||
'size' => '', // Tamaño del input (sm, lg)
|
||||
'mb0' => false, // Remover margen inferior
|
||||
'parentClass' => '',
|
||||
|
||||
// Elementos opcionales antes/después del input
|
||||
'prefix' => null,
|
||||
'suffix' => null,
|
||||
|
||||
// Íconos dentro del input
|
||||
'icon' => null, // Ícono fijo
|
||||
'clickableIcon' => null, // Ícono con botón
|
||||
|
||||
// Configuración del checkbox
|
||||
'checked' => false,
|
||||
'disabled' => false,
|
||||
|
||||
// Configuración del input de texto
|
||||
'disableOnOffCheckbox' => true, // Deshabilita input hasta que el checkbox esté activo
|
||||
'focusOnCheck' => true, // Hace foco en el input al activar el checkbox
|
||||
|
||||
// Texto de ayuda
|
||||
'helperText' => '',
|
||||
|
||||
// Atributos adicionales para el input de texto
|
||||
'attributes' => new \Illuminate\View\ComponentAttributeBag([]),
|
||||
])
|
||||
|
||||
@php
|
||||
// **Generación de Name, ID y Model**
|
||||
$livewireCheckbox = $checkboxModel ? "wire:model=$checkboxModel" : '';
|
||||
$livewireText = $textModel ? "wire:model=$textModel" : '';
|
||||
|
||||
$nameCheckbox = $checkboxModel;
|
||||
$nameText = $attributes->get('name', $textModel);
|
||||
|
||||
$checkboxId = $attributes->get('id', 'chk_' . $uid);
|
||||
$textInputId = 'txt_' . $uid;
|
||||
|
||||
// **Placeholder del input de texto**
|
||||
$placeholder = $attributes->get('placeholder', 'Ingrese información');
|
||||
|
||||
// **Clases dinámicas**
|
||||
$sizeClass = match ($size) {
|
||||
'sm' => 'form-control-sm',
|
||||
'lg' => 'form-control-lg',
|
||||
default => '',
|
||||
};
|
||||
|
||||
$fullClass = trim("form-control $sizeClass");
|
||||
|
||||
// **Fusionar atributos del input de texto**
|
||||
$inputAttributes = $attributes->merge([
|
||||
'id' => $textInputId,
|
||||
'name' => $nameText,
|
||||
'placeholder' => $placeholder,
|
||||
])->class($fullClass);
|
||||
@endphp
|
||||
|
||||
{{-- ============================ CHECKBOX CON INPUT GROUP ============================ --}}
|
||||
<div class="mb-4 {{ $parentClass }}">
|
||||
@if ($label)
|
||||
<label for="{{ $checkboxId }}" class="{{ $labelClass }}">{{ $label }}</label>
|
||||
@endif
|
||||
|
||||
<div class="input-group">
|
||||
{{-- Checkbox dentro del input-group-text --}}
|
||||
<div class="input-group-text">
|
||||
<input
|
||||
id="{{ $checkboxId }}"
|
||||
name="{{ $nameCheckbox }}"
|
||||
type="checkbox"
|
||||
{{ $livewireCheckbox }}
|
||||
{{ $disabled ? 'disabled' : '' }}
|
||||
class="form-check-input mt-0"
|
||||
onchange="toggleInputState('{{ $checkboxId }}', '{{ $textInputId }}', {{ $focusOnCheck ? 'true' : 'false' }}, {{ $disableOnOffCheckbox ? 'true' : 'false' }})"
|
||||
>
|
||||
</div>
|
||||
|
||||
{{-- Prefijo opcional --}}
|
||||
@isset($prefix)
|
||||
<span class="input-group-text">{{ $prefix }}</span>
|
||||
@endisset
|
||||
|
||||
{{-- Ícono fijo opcional --}}
|
||||
@isset($icon)
|
||||
<span class="input-group-text"><i class="{{ $icon }}"></i></span>
|
||||
@endisset
|
||||
|
||||
{{-- Input de texto dentro del mismo grupo --}}
|
||||
<input
|
||||
{{ $livewireText }}
|
||||
{!! $inputAttributes !!}
|
||||
@if ($disableOnOffCheckbox) disabled @endif
|
||||
aria-label="Text input with checkbox"
|
||||
>
|
||||
|
||||
{{-- Sufijo opcional --}}
|
||||
@isset($suffix)
|
||||
<span class="input-group-text">{{ $suffix }}</span>
|
||||
@endisset
|
||||
|
||||
{{-- Ícono clickeable opcional --}}
|
||||
@isset($clickableIcon)
|
||||
<button type="button" class="input-group-text cursor-pointer">
|
||||
<i class="{{ $clickableIcon }}"></i>
|
||||
</button>
|
||||
@endisset
|
||||
</div>
|
||||
|
||||
{{-- Texto de ayuda opcional --}}
|
||||
@if ($helperText)
|
||||
<div class="form-text">{{ $helperText }}</div>
|
||||
@endif
|
||||
</div>
|
||||
|
||||
{{-- ============================ JAVASCRIPT PURO ============================ --}}
|
||||
<script>
|
||||
function toggleInputState(checkboxId, inputId, focusOnCheck, disableOnOffCheckbox) {
|
||||
let checkbox = document.getElementById(checkboxId);
|
||||
let textInput = document.getElementById(inputId);
|
||||
|
||||
if (!checkbox || !textInput) return;
|
||||
|
||||
// Deshabilitar o habilitar el input de texto
|
||||
if (disableOnOffCheckbox) {
|
||||
textInput.disabled = !checkbox.checked;
|
||||
}
|
||||
|
||||
// Enfocar automáticamente el input si está habilitado
|
||||
if (focusOnCheck && checkbox.checked) {
|
||||
textInput.focus();
|
||||
}
|
||||
}
|
||||
</script>
|
||||
133
resources/views/components/form/checkbox.blade.php
Normal file
133
resources/views/components/form/checkbox.blade.php
Normal file
@ -0,0 +1,133 @@
|
||||
@props([
|
||||
// Identificador único
|
||||
'uid' => uniqid(),
|
||||
|
||||
// Modelo de Livewire (si aplica)
|
||||
'model' => '',
|
||||
|
||||
// Etiqueta y clases de la etiqueta
|
||||
'label' => '',
|
||||
'labelClass' => '',
|
||||
|
||||
// Clases generales
|
||||
'align' => 'start',
|
||||
'size' => 'md', // Tamaño del checkbox/switch: sm, md, lg
|
||||
'mb0' => false, // Remover margen inferior
|
||||
'parentClass' => '',
|
||||
|
||||
// Estilos del checkbox
|
||||
'switch' => false, // Cambiar a modo switch
|
||||
'switchType' => 'default', // 'default' o 'square'
|
||||
'color' => 'primary', // Bootstrap color: primary, secondary, success, danger, etc.
|
||||
'withIcon' => false, // Si el switch usa íconos en On/Off
|
||||
|
||||
// Diseño de disposición
|
||||
'inline' => false, // Modo inline en lugar de bloque
|
||||
|
||||
// Texto de ayuda
|
||||
'helperText' => '',
|
||||
|
||||
// Atributos adicionales
|
||||
'attributes' => new \Illuminate\View\ComponentAttributeBag([]),
|
||||
])
|
||||
|
||||
@php
|
||||
// **Configuración de valores base**
|
||||
$livewireModel = $attributes->get('wire:model', $model);
|
||||
$name = $attributes->get('name', $livewireModel);
|
||||
$inputId = $attributes->get('id', $name . '_' . $uid);
|
||||
$checked = $attributes->get('checked', false);
|
||||
$disabled = $attributes->get('disabled', false);
|
||||
|
||||
// **Manejo de errores**
|
||||
$errorKey = $livewireModel ?: $name;
|
||||
$hasError = $errors->has($errorKey);
|
||||
$errorClass = $hasError ? 'is-invalid' : '';
|
||||
|
||||
// **Clases dinámicas**
|
||||
$alignClass = match ($align) {
|
||||
'center' => 'text-center',
|
||||
'end' => 'text-end',
|
||||
default => '',
|
||||
};
|
||||
|
||||
$sizeClass = match ($size) {
|
||||
'sm' => 'switch-sm',
|
||||
'lg' => 'switch-lg',
|
||||
default => '',
|
||||
};
|
||||
|
||||
$switchTypeClass = $switchType === 'square' ? 'switch-square' : '';
|
||||
$switchColorClass = "switch-{$color}";
|
||||
$checkColorClass = "form-check-{$color}";
|
||||
|
||||
// **Fusionar atributos con clases dinámicas**
|
||||
$checkboxAttributes = $attributes->merge([
|
||||
'id' => $inputId,
|
||||
'name' => $name,
|
||||
'type' => 'checkbox',
|
||||
]);
|
||||
|
||||
// **Detectar si se usa input-group**
|
||||
$requiresInputGroup = $attributes->get('inline');
|
||||
@endphp
|
||||
|
||||
@if ($switch)
|
||||
{{-- ============================ MODO SWITCH ============================ --}}
|
||||
<div class="{{ $alignClass }} {{ $inline ? 'd-inline-block' : '' }} {{ $parentClass }} {{ $mb0 ? '' : 'mb-2' }}">
|
||||
<label class="switch {{ $switchTypeClass }} {{ $switchColorClass }} {{ $sizeClass }} {{ $labelClass }}">
|
||||
<input
|
||||
{{ $livewireModel ? "wire:model=$livewireModel" : '' }}
|
||||
{{ $disabled ? 'disabled' : '' }}
|
||||
{{ $checked ? 'checked' : '' }}
|
||||
{!! $checkboxAttributes->class("switch-input $errorClass")->toHtml() !!}
|
||||
/>
|
||||
{{-- El Switch Slider --}}
|
||||
<span class="switch-toggle-slider">
|
||||
@if ($withIcon)
|
||||
<span class="switch-on">
|
||||
<i class="ti ti-check"></i>
|
||||
</span>
|
||||
<span class="switch-off">
|
||||
<i class="ti ti-x"></i>
|
||||
</span>
|
||||
@endif
|
||||
</span>
|
||||
{{-- Etiqueta textual a la derecha del switch --}}
|
||||
<span class="switch-label">
|
||||
{{ $label }}
|
||||
</span>
|
||||
</label>
|
||||
|
||||
{{-- Texto de ayuda y error --}}
|
||||
@isset($helperText)
|
||||
<div class="form-text">{{ $helperText }}</div>
|
||||
@endisset
|
||||
@if ($hasError)
|
||||
<span class="text-danger">{{ $errors->first($errorKey) }}</span>
|
||||
@endif
|
||||
</div>
|
||||
|
||||
@else
|
||||
{{-- ============================ MODO CHECKBOX ============================ --}}
|
||||
<div class="form-check {{ $checkColorClass }} {{ $alignClass }} {{ $sizeClass }} {{ $inline ? 'form-check-inline' : '' }} {{ $parentClass }} {{ $mb0 ? '' : 'mb-4' }}">
|
||||
<input
|
||||
{{ $livewireModel ? "wire:model=$livewireModel" : '' }}
|
||||
{{ $disabled ? 'disabled' : '' }}
|
||||
{{ $checked ? 'checked' : '' }}
|
||||
{!! $checkboxAttributes->class("form-check-input $errorClass")->toHtml() !!}
|
||||
>
|
||||
|
||||
<label for="{{ $inputId }}" class="form-check-label {{ $labelClass }}">
|
||||
{{ $label }}
|
||||
</label>
|
||||
|
||||
{{-- Texto de ayuda y error --}}
|
||||
@isset($helperText)
|
||||
<div class="form-text">{{ $helperText }}</div>
|
||||
@endisset
|
||||
@if ($hasError)
|
||||
<span class="text-danger">{{ $errors->first($errorKey) }}</span>
|
||||
@endif
|
||||
</div>
|
||||
@endif
|
||||
54
resources/views/components/form/custom-option.blade.php
Normal file
54
resources/views/components/form/custom-option.blade.php
Normal file
@ -0,0 +1,54 @@
|
||||
@props([
|
||||
'uid' => uniqid(),
|
||||
'id' => '',
|
||||
'model' => '',
|
||||
'name' => '',
|
||||
'type' => 'checkbox', // checkbox o radio
|
||||
'title' => '',
|
||||
'description' => '',
|
||||
'icon' => null, // Clases de iconos (ej: ti ti-rocket)
|
||||
'image' => null, // URL de imagen
|
||||
'checked' => false,
|
||||
'disabled' => false,
|
||||
'helperText' => '', // Texto de ayuda opcional
|
||||
])
|
||||
|
||||
@php
|
||||
$livewireModel = $attributes->get('wire:model', $model);
|
||||
$name = $name ?: $livewireModel;
|
||||
$inputId = $id ?: ($uid ? $name . '_' . $uid : $name);
|
||||
$errorClass = $errors->has($model) ? 'is-invalid' : '';
|
||||
$checkedAttribute = $checked ? 'checked' : '';
|
||||
$visualContent = $icon
|
||||
? "<i class='{$icon}'></i>"
|
||||
: ($image ? "<img src='{$image}' alt='{$title}' class='img-fluid rounded'>" : '');
|
||||
@endphp
|
||||
|
||||
<div class="mb-4 form-check custom-option custom-option-icon {{ $checked ? 'checked' : '' }}">
|
||||
<label class="form-check-label custom-option-content" for="{{ $inputId }}">
|
||||
<span class="custom-option-body">
|
||||
{!! $visualContent !!}
|
||||
<span class="custom-option-title">{{ $title }}</span>
|
||||
@if($description)
|
||||
<small>{{ $description }}</small>
|
||||
@endif
|
||||
</span>
|
||||
<input
|
||||
type="{{ $type }}"
|
||||
class="form-check-input {{ $errorClass }}"
|
||||
id="{{ $inputId }}"
|
||||
name="{{ $name }}"
|
||||
wire:model="{{ $model }}"
|
||||
{{ $checked ? 'checked' : '' }}
|
||||
{{ $disabled ? 'disabled' : '' }}
|
||||
>
|
||||
</label>
|
||||
|
||||
@if ($helperText)
|
||||
<div class="form-text">{{ $helperText }}</div>
|
||||
@endif
|
||||
|
||||
@error($model)
|
||||
<span class="text-danger">{{ $message }}</span>
|
||||
@enderror
|
||||
</div>
|
||||
48
resources/views/components/form/form.blade.php
Normal file
48
resources/views/components/form/form.blade.php
Normal file
@ -0,0 +1,48 @@
|
||||
@props([
|
||||
'id' => uniqid(), // ID único del formulario
|
||||
'uniqueId' => '', // ID único del formulario
|
||||
'mode' => 'create', // Modo actual ('create', 'edit', 'delete')
|
||||
'method' => 'POST', // Método del formulario (POST, GET, PUT, DELETE)
|
||||
'action' => '', // URL de acción
|
||||
'enctype' => false, // Para envío de archivos
|
||||
'wireSubmit' => false, // Usar wire:submit.prevent
|
||||
'class' => '', // Clases adicionales para el formulario
|
||||
'actionPosition' => 'bottom', // Posición de acciones: top, bottom, both, none
|
||||
])
|
||||
|
||||
@php
|
||||
$formAttributes = [
|
||||
'id' => $id,
|
||||
'method' => $method,
|
||||
'action' => $action,
|
||||
'class' => "fv-plugins-bootstrap5 $class",
|
||||
];
|
||||
|
||||
if ($wireSubmit) {
|
||||
$formAttributes['wire:submit.prevent'] = $wireSubmit;
|
||||
}
|
||||
|
||||
if ($enctype) {
|
||||
$formAttributes['enctype'] = 'multipart/form-data';
|
||||
}
|
||||
@endphp
|
||||
|
||||
<form {{ $attributes->merge($formAttributes) }}>
|
||||
<x-vuexy-admin::form.input :uid="$uniqueId" type="hidden" model="id" />
|
||||
<x-vuexy-admin::form.input :uid="$uniqueId" type="hidden" model="mode" />
|
||||
@if ($mode !== 'delete' && in_array($actionPosition, ['top', 'both']))
|
||||
<div class="notification-container mb-4"></div>
|
||||
<div class="form-actions mb-4">
|
||||
{{ $actions ?? '' }}
|
||||
</div>
|
||||
@endif
|
||||
<div class="form-body">
|
||||
{{ $slot }}
|
||||
</div>
|
||||
@if (in_array($actionPosition, ['bottom', 'both']))
|
||||
<div class="notification-container mb-4"></div>
|
||||
<div class="form-actions mt-4">
|
||||
{{ $actions ?? '' }}
|
||||
</div>
|
||||
@endif
|
||||
</form>
|
||||
184
resources/views/components/form/input.blade copy.php
Normal file
184
resources/views/components/form/input.blade copy.php
Normal file
@ -0,0 +1,184 @@
|
||||
@props([
|
||||
'uid' => uniqid(),
|
||||
|
||||
|
||||
'model' => '',
|
||||
|
||||
|
||||
'label' => '',
|
||||
'labelClass' => '',
|
||||
|
||||
|
||||
'class' => '',
|
||||
|
||||
'align' => 'start',
|
||||
'size' => '',
|
||||
'mb-0' => false,
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
'parentClass' => '',
|
||||
|
||||
|
||||
'prefix' => null,
|
||||
'suffix' => null,
|
||||
|
||||
'icon' => null,
|
||||
'clickableIcon' => null,
|
||||
|
||||
'inline' => false,
|
||||
|
||||
'labelCol' => 4,
|
||||
'inputCol' => 8,
|
||||
|
||||
'floatLabel' => false,
|
||||
'helperText' => '',
|
||||
|
||||
'attributes' => new \Illuminate\View\ComponentAttributeBag([]), // Atributos adicionales
|
||||
])
|
||||
|
||||
@php
|
||||
// Configuración dinámica de atributos y clases CSS
|
||||
$livewireModel = $attributes->get('wire:model', $model); // Permitir uso directo de wire:model en el atributo
|
||||
$name = $name ?: $livewireModel; // Si no se proporciona el nombre, toma el nombre del modelo
|
||||
$inputId = $id ?: ($uid ? $name . '_' . $uid : $name); // ID generado si no se proporciona uno
|
||||
|
||||
|
||||
// Obtener los atributos actuales en un array
|
||||
$attributesArray = array_merge([
|
||||
'type' => $type,
|
||||
'id' => $inputId,
|
||||
'name' => $name,
|
||||
]);
|
||||
|
||||
|
||||
// Agregar wire:model solo si existe
|
||||
if ($livewireModel) {
|
||||
$attributesArray['wire:model'] = $livewireModel;
|
||||
}
|
||||
|
||||
|
||||
$attributesArray = array_merge($attributesArray, $attributes->getAttributes());
|
||||
|
||||
|
||||
// Reconstruir el ComponentAttributeBag con los atributos modificados
|
||||
$inputAttributes = new \Illuminate\View\ComponentAttributeBag($attributesArray);
|
||||
|
||||
dump($inputAttributes);
|
||||
|
||||
|
||||
// Manejo de errores de validación
|
||||
$errorKey = $livewireModel ?: $name;
|
||||
$errorClass = $errors->has($errorKey) ? 'is-invalid' : '';
|
||||
|
||||
// Definir el tamaño del input basado en la clase seleccionada
|
||||
$sizeClass = $size === 'small' ? 'form-control-sm' : ($size === 'large' ? 'form-control-lg' : '');
|
||||
|
||||
// Alineación del texto
|
||||
$alignClass = match ($align) {
|
||||
'center' => 'text-center',
|
||||
'end' => 'text-end',
|
||||
default => ''
|
||||
};
|
||||
|
||||
// Clases combinadas para el input
|
||||
$fullClass = trim("form-control $sizeClass $alignClass $errorClass $class");
|
||||
|
||||
// Detectar si se necesita usar input-group
|
||||
$requiresInputGroup = $prefix || $suffix || $icon || $clickableIcon;
|
||||
@endphp
|
||||
|
||||
{{-- Input oculto sin estilos --}}
|
||||
@if($type === 'hidden')
|
||||
<input type="hidden" id="{{ $inputId }}" name="{{ $name }}" {{ $livewireModel ? "wire:model=$livewireModel" : '' }}
|
||||
/>
|
||||
@elseif($floatLabel)
|
||||
{{-- Input con etiqueta flotante --}}
|
||||
<div class="form-floating mb-4 {{ $parentClass }}">
|
||||
<input
|
||||
type="{{ $type }}"
|
||||
id="{{ $inputId }}"
|
||||
name="{{ $name }}"
|
||||
{{ $livewireModel ? "wire:model=$livewireModel" : '' }}
|
||||
class="{{ $fullClass }}"
|
||||
placeholder="{{ $placeholder ?: 'Ingrese ' . strtolower($label) }}"
|
||||
{{ $step ? "step=$step" : '' }}
|
||||
{{ $max ? "maxlength=$max" : '' }}
|
||||
{{ $min ? "minlength=$min" : '' }}
|
||||
{{ $pattern ? "pattern=$pattern" : '' }}
|
||||
{{ $disabled ? 'disabled' : '' }}
|
||||
{{ $multiple ? 'multiple' : '' }} />
|
||||
<label for="{{ $inputId }}">{{ $label }}</label>
|
||||
|
||||
@if ($helperText)
|
||||
<div class="form-text">{{ $helperText }}</div>
|
||||
@endif
|
||||
|
||||
@if ($errors->has($errorKey))
|
||||
<span class="text-danger">{{ $errors->first($errorKey) }}</span>
|
||||
@endif
|
||||
</div>
|
||||
@else
|
||||
{{-- Input con formato clásico --}}
|
||||
<div class="{{ $inline ? 'row' : '' }} {{ $parentClass }} fv-row mb-4">
|
||||
@isset($label)
|
||||
<label for="{{ $inputId }}" class="{{ $inline ? 'col-form-label col-md-' . $labelCol : 'form-label' }} {{ $labelClass }}">{{ $label }}</label>
|
||||
@endisset
|
||||
<div class="{{ $inline ? 'col-md-' . $inputCol : '' }}">
|
||||
@if ($requiresInputGroup)
|
||||
<div class="input-group input-group-merge">
|
||||
@if ($prefix)
|
||||
<span class="input-group-text">{{ $prefix }}</span>
|
||||
@endif
|
||||
@if ($icon)
|
||||
<span class="input-group-text"><i class="{{ $icon }}"></i></span>
|
||||
@endif
|
||||
<input
|
||||
type="{{ $type }}"
|
||||
id="{{ $inputId }}"
|
||||
name="{{ $name }}"
|
||||
{{ $livewireModel ? "wire:model=$livewireModel" : '' }}
|
||||
class="{{ $fullClass }}"
|
||||
placeholder="{{ $placeholder ?: 'Ingrese ' . strtolower($label) }}"
|
||||
{{ $step ? "step=$step" : '' }}
|
||||
{{ $max ? "maxlength=$max" : '' }}
|
||||
{{ $min ? "minlength=$min" : '' }}
|
||||
{{ $pattern ? "pattern=$pattern" : '' }}
|
||||
{{ $disabled ? 'disabled' : '' }}
|
||||
{{ $multiple ? 'multiple' : '' }} />
|
||||
@if ($suffix)
|
||||
<span class="input-group-text">{{ $suffix }}</span>
|
||||
@endif
|
||||
@if ($clickableIcon)
|
||||
<button type="button" class="input-group-text cursor-pointer">
|
||||
<i class="{{ $clickableIcon }}"></i>
|
||||
</button>
|
||||
@endif
|
||||
</div>
|
||||
@else
|
||||
{{-- Input sin prefijo o íconos --}}
|
||||
<input
|
||||
type="{{ $type }}"
|
||||
id="{{ $inputId }}"
|
||||
name="{{ $name }}"
|
||||
{{ $livewireModel ? "wire:model=$livewireModel" : '' }}
|
||||
class="{{ $fullClass }}"
|
||||
placeholder="{{ $placeholder ?: 'Ingrese ' . strtolower($label) }}"
|
||||
{{ $step ? "step=$step" : '' }}
|
||||
{{ $max ? "maxlength=$max" : '' }}
|
||||
{{ $min ? "minlength=$min" : '' }}
|
||||
{{ $pattern ? "pattern=$pattern" : '' }}
|
||||
{{ $disabled ? 'disabled' : '' }}
|
||||
{{ $multiple ? 'multiple' : '' }} />
|
||||
@endif
|
||||
@if ($helperText)
|
||||
<small class="form-text text-muted">{{ $helperText }}</small>
|
||||
@endif
|
||||
@if ($errors->has($errorKey))
|
||||
<span class="text-danger">{{ $errors->first($errorKey) }}</span>
|
||||
@endif
|
||||
</div>
|
||||
</div>
|
||||
@endif
|
||||
169
resources/views/components/form/input.blade.php
Normal file
169
resources/views/components/form/input.blade.php
Normal file
@ -0,0 +1,169 @@
|
||||
@props([
|
||||
// Identificador único
|
||||
'uid' => uniqid(),
|
||||
|
||||
// Modelo de Livewire
|
||||
'model' => '',
|
||||
|
||||
// Etiqueta y Clases
|
||||
'label' => '',
|
||||
'labelClass' => '',
|
||||
'placeholder' => '',
|
||||
|
||||
// Clases Generales
|
||||
'align' => 'start',
|
||||
'size' => '', // Tamaño del input (sm, lg)
|
||||
'mb0' => false, // Remover margen inferior
|
||||
'parentClass' => '',
|
||||
|
||||
// Elementos opcionales antes/después del input
|
||||
'prefix' => null,
|
||||
'suffix' => null,
|
||||
|
||||
// Íconos dentro del input
|
||||
'icon' => null,
|
||||
'clickableIcon' => null,
|
||||
|
||||
// Configuración especial
|
||||
'phoneMode' => false, // "national", "international", "both"
|
||||
|
||||
// Diseño de disposición (columnas)
|
||||
'inline' => false,
|
||||
'labelCol' => 4,
|
||||
'inputCol' => 8,
|
||||
|
||||
// Configuración de etiquetas flotantes y texto de ayuda
|
||||
'floatLabel' => false,
|
||||
'helperText' => '',
|
||||
|
||||
// Atributos adicionales
|
||||
'attributes' => new \Illuminate\View\ComponentAttributeBag([]),
|
||||
])
|
||||
|
||||
@php
|
||||
// **Configuración de Name, ID y Model**
|
||||
$livewireModel = $attributes->get('wire:model', $model);
|
||||
$name = $attributes->get('name', $livewireModel);
|
||||
$inputId = $attributes->get('id', $name . '_' . $uid);
|
||||
$type = $attributes->get('type', 'text');
|
||||
|
||||
// **Definir formato de teléfono según `phoneMode`**
|
||||
if ($phoneMode) {
|
||||
$type = 'tel';
|
||||
$attributes = $attributes->merge([
|
||||
'autocomplete' => 'tel',
|
||||
'inputmode' => 'tel',
|
||||
]);
|
||||
|
||||
switch ($phoneMode) {
|
||||
case 'national':
|
||||
$attributes = $attributes->merge([
|
||||
'pattern' => '^(?:\D*\d){10,}$',
|
||||
'placeholder' => $placeholder !== false ? ($placeholder ?: 'Ej. (55) 1234-5678') : null,
|
||||
]);
|
||||
break;
|
||||
|
||||
case 'international':
|
||||
$attributes = $attributes->merge([
|
||||
'pattern' => '^\+?[1-9]\d{1,14}$',
|
||||
'placeholder' => $placeholder !== false ? ($placeholder ?: 'Ej. +52 1 55 1234-5678') : null,
|
||||
]);
|
||||
break;
|
||||
|
||||
case 'both':
|
||||
$attributes = $attributes->merge([
|
||||
'pattern' => '(^(?:\D*\d){10,}$)|(^\+?[1-9]\d{1,14}$)',
|
||||
'placeholder' => $placeholder !== false ? ($placeholder ?: 'Ej. (55) 1234-5678 o +52 1 55 1234-5678') : null,
|
||||
]);
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
// **Manejo del Placeholder si no lo estableció `phoneMode`**
|
||||
if (!$attributes->has('placeholder')) {
|
||||
if ($placeholder === false) {
|
||||
// No agregar `placeholder`
|
||||
$placeholderAttr = [];
|
||||
} elseif (empty($placeholder)) {
|
||||
// Generar automáticamente desde el `label`
|
||||
$placeholderAttr = ['placeholder' => 'Ingrese ' . strtolower($label)];
|
||||
} else {
|
||||
// Usar `placeholder` definido manualmente
|
||||
$placeholderAttr = ['placeholder' => $placeholder];
|
||||
}
|
||||
|
||||
// Fusionar el placeholder si no fue definido en `phoneMode`
|
||||
$attributes = $attributes->merge($placeholderAttr);
|
||||
}
|
||||
|
||||
// **Manejo de errores**
|
||||
$errorKey = $livewireModel ?: $name;
|
||||
$hasError = $errors->has($errorKey);
|
||||
$errorClass = $hasError ? 'is-invalid' : '';
|
||||
|
||||
// **Clases dinámicas**
|
||||
$sizeClass = match ($size) {
|
||||
'sm' => 'form-control-sm',
|
||||
'lg' => 'form-control-lg',
|
||||
default => '',
|
||||
};
|
||||
|
||||
$alignClass = match ($align) {
|
||||
'center' => 'text-center',
|
||||
'end' => 'text-end',
|
||||
default => '',
|
||||
};
|
||||
|
||||
// **Fusionar atributos**
|
||||
$inputAttributes = $attributes->merge([
|
||||
'type' => $type,
|
||||
'id' => $inputId,
|
||||
'name' => $name,
|
||||
])->class("form-control $sizeClass $alignClass $errorClass");
|
||||
@endphp
|
||||
|
||||
{{-- Estructura del Input --}}
|
||||
<div class="{{ $mb0 ? '' : 'mb-4' }} {{ $parentClass }}">
|
||||
{{-- Etiqueta --}}
|
||||
@if ($label)
|
||||
<label for="{{ $inputId }}" class="form-label {{ $labelClass }}">{{ $label }}</label>
|
||||
@endif
|
||||
|
||||
{{-- Input con Prefijos, Sufijos o Íconos --}}
|
||||
@if ($prefix || $suffix || $icon || $clickableIcon)
|
||||
<div class="input-group input-group-merge">
|
||||
@isset($prefix)
|
||||
<span class="input-group-text">{{ $prefix }}</span>
|
||||
@endisset
|
||||
|
||||
@isset($icon)
|
||||
<span class="input-group-text"><i class="{{ $icon }}"></i></span>
|
||||
@endisset
|
||||
|
||||
<input {!! $inputAttributes !!} {{ $livewireModel ? "wire:model=$livewireModel" : '' }} />
|
||||
|
||||
@isset($suffix)
|
||||
<span class="input-group-text">{{ $suffix }}</span>
|
||||
@endisset
|
||||
|
||||
@isset($clickableIcon)
|
||||
<button type="button" class="input-group-text cursor-pointer">
|
||||
<i class="{{ $clickableIcon }}"></i>
|
||||
</button>
|
||||
@endisset
|
||||
</div>
|
||||
@else
|
||||
{{-- Input Simple --}}
|
||||
<input {!! $inputAttributes !!} {{ $livewireModel ? "wire:model=$livewireModel" : '' }} />
|
||||
@endif
|
||||
|
||||
{{-- Texto de ayuda --}}
|
||||
@if ($helperText)
|
||||
<div class="form-text">{{ $helperText }}</div>
|
||||
@endif
|
||||
|
||||
{{-- Mensajes de error --}}
|
||||
@if ($hasError)
|
||||
<span class="text-danger">{{ $errors->first($errorKey) }}</span>
|
||||
@endif
|
||||
</div>
|
||||
149
resources/views/components/form/radio-group.blade.php
Normal file
149
resources/views/components/form/radio-group.blade.php
Normal file
@ -0,0 +1,149 @@
|
||||
@props([
|
||||
// Identificador único
|
||||
'uid' => uniqid(),
|
||||
|
||||
// Modelos para Livewire
|
||||
'radioModel' => '',
|
||||
'textModel' => '',
|
||||
|
||||
// Etiqueta y clases de la etiqueta
|
||||
'label' => '',
|
||||
'labelClass' => '',
|
||||
|
||||
// Clases generales
|
||||
'align' => 'start',
|
||||
'size' => '', // Tamaño del input (sm, lg)
|
||||
'mb0' => false, // Remover margen inferior
|
||||
'parentClass' => '',
|
||||
|
||||
// Elementos opcionales antes/después del input
|
||||
'prefix' => null,
|
||||
'suffix' => null,
|
||||
|
||||
// Íconos dentro del input
|
||||
'icon' => null, // Ícono fijo
|
||||
'clickableIcon' => null, // Ícono con botón
|
||||
|
||||
// Configuración del radio
|
||||
'checked' => false,
|
||||
'disabled' => false,
|
||||
'name' => '', // Grupo del radio
|
||||
|
||||
// Configuración del input de texto
|
||||
'disableOnOffRadio' => true, // Deshabilita input hasta que el radio esté seleccionado
|
||||
'focusOnCheck' => true, // Hace foco en el input al seleccionar el radio
|
||||
|
||||
// Texto de ayuda
|
||||
'helperText' => '',
|
||||
|
||||
// Atributos adicionales para el input de texto
|
||||
'attributes' => new \Illuminate\View\ComponentAttributeBag([]),
|
||||
])
|
||||
|
||||
@php
|
||||
// **Generación de Name, ID y Model**
|
||||
$livewireRadio = $radioModel ? "wire:model=$radioModel" : '';
|
||||
$livewireText = $textModel ? "wire:model=$textModel" : '';
|
||||
|
||||
$nameRadio = $attributes->get('name', $radioModel ?: $name);
|
||||
$nameText = $attributes->get('name', $textModel);
|
||||
|
||||
$radioId = $attributes->get('id', 'radio_' . $uid);
|
||||
$textInputId = 'txt_' . $uid;
|
||||
|
||||
// **Placeholder del input de texto**
|
||||
$placeholder = $attributes->get('placeholder', 'Ingrese información');
|
||||
|
||||
// **Clases dinámicas**
|
||||
$sizeClass = match ($size) {
|
||||
'sm' => 'form-control-sm',
|
||||
'lg' => 'form-control-lg',
|
||||
default => '',
|
||||
};
|
||||
|
||||
$fullClass = trim("form-control $sizeClass");
|
||||
|
||||
// **Fusionar atributos del input de texto**
|
||||
$inputAttributes = $attributes->merge([
|
||||
'id' => $textInputId,
|
||||
'name' => $nameText,
|
||||
'placeholder' => $placeholder,
|
||||
])->class($fullClass);
|
||||
@endphp
|
||||
|
||||
{{-- ============================ RADIO BUTTON CON INPUT GROUP ============================ --}}
|
||||
<div class="{{ $mb0 ? '' : 'mb-4' }} {{ $parentClass }}">
|
||||
@if ($label)
|
||||
<label for="{{ $radioId }}" class="{{ $labelClass }}">{{ $label }}</label>
|
||||
@endif
|
||||
|
||||
<div class="input-group">
|
||||
{{-- Radio dentro del input-group-text --}}
|
||||
<div class="input-group-text">
|
||||
<input
|
||||
id="{{ $radioId }}"
|
||||
name="{{ $nameRadio }}"
|
||||
type="radio"
|
||||
{{ $livewireRadio }}
|
||||
{{ $disabled ? 'disabled' : '' }}
|
||||
class="form-check-input mt-0"
|
||||
onchange="toggleRadioInputState('{{ $radioId }}', '{{ $textInputId }}', {{ $focusOnCheck ? 'true' : 'false' }}, {{ $disableOnOffRadio ? 'true' : 'false' }})"
|
||||
>
|
||||
</div>
|
||||
|
||||
{{-- Prefijo opcional --}}
|
||||
@isset($prefix)
|
||||
<span class="input-group-text">{{ $prefix }}</span>
|
||||
@endisset
|
||||
|
||||
{{-- Ícono fijo opcional --}}
|
||||
@isset($icon)
|
||||
<span class="input-group-text"><i class="{{ $icon }}"></i></span>
|
||||
@endisset
|
||||
|
||||
{{-- Input de texto dentro del mismo grupo --}}
|
||||
<input
|
||||
{{ $livewireText }}
|
||||
{!! $inputAttributes !!}
|
||||
@if ($disableOnOffRadio) disabled @endif
|
||||
aria-label="Text input with radio button"
|
||||
>
|
||||
|
||||
{{-- Sufijo opcional --}}
|
||||
@isset($suffix)
|
||||
<span class="input-group-text">{{ $suffix }}</span>
|
||||
@endisset
|
||||
|
||||
{{-- Ícono clickeable opcional --}}
|
||||
@isset($clickableIcon)
|
||||
<button type="button" class="input-group-text cursor-pointer">
|
||||
<i class="{{ $clickableIcon }}"></i>
|
||||
</button>
|
||||
@endisset
|
||||
</div>
|
||||
|
||||
{{-- Texto de ayuda opcional --}}
|
||||
@if ($helperText)
|
||||
<div class="form-text">{{ $helperText }}</div>
|
||||
@endif
|
||||
</div>
|
||||
|
||||
{{-- ============================ JAVASCRIPT PURO ============================ --}}
|
||||
<script>
|
||||
function toggleRadioInputState(radioId, inputId, focusOnCheck, disableOnOffRadio) {
|
||||
let radio = document.getElementById(radioId);
|
||||
let textInput = document.getElementById(inputId);
|
||||
|
||||
if (!radio || !textInput) return;
|
||||
|
||||
// Deshabilitar o habilitar el input de texto
|
||||
if (disableOnOffRadio) {
|
||||
textInput.disabled = !radio.checked;
|
||||
}
|
||||
|
||||
// Enfocar automáticamente el input si está habilitado
|
||||
if (focusOnCheck && radio.checked) {
|
||||
textInput.focus();
|
||||
}
|
||||
}
|
||||
</script>
|
||||
125
resources/views/components/form/radio.blade.php
Normal file
125
resources/views/components/form/radio.blade.php
Normal file
@ -0,0 +1,125 @@
|
||||
@props([
|
||||
// Identificador único
|
||||
'uid' => uniqid(),
|
||||
|
||||
// Modelo de Livewire (si aplica)
|
||||
'model' => '',
|
||||
|
||||
// Etiqueta y clases de la etiqueta
|
||||
'label' => '',
|
||||
'labelClass' => '',
|
||||
|
||||
// Clases generales
|
||||
'align' => 'start',
|
||||
'size' => '', // Tamaño del radio (sm, lg)
|
||||
'mb0' => false, // Remover margen inferior
|
||||
'parentClass' => '',
|
||||
|
||||
// Modo de visualización
|
||||
'switch' => false, // Convertir en switch
|
||||
'switchType' => 'default', // 'default' o 'square'
|
||||
'color' => 'primary', // Colores personalizados (Bootstrap)
|
||||
'stacked' => false, // Apilar radios en lugar de inline
|
||||
'inline' => false, // Mostrar radios en línea
|
||||
|
||||
// Texto de ayuda
|
||||
'helperText' => '',
|
||||
|
||||
// Atributos adicionales
|
||||
'attributes' => new \Illuminate\View\ComponentAttributeBag([]),
|
||||
])
|
||||
|
||||
@php
|
||||
// **Configuración de valores base**
|
||||
$livewireModel = $attributes->get('wire:model', $model);
|
||||
$name = $attributes->get('name', $livewireModel);
|
||||
$inputId = $attributes->get('id', $name . '_' . $uid);
|
||||
$checked = $attributes->get('checked', false);
|
||||
$disabled = $attributes->get('disabled', false);
|
||||
|
||||
// **Manejo de errores**
|
||||
$errorKey = $livewireModel ?: $name;
|
||||
$hasError = $errors->has($errorKey);
|
||||
$errorClass = $hasError ? 'is-invalid' : '';
|
||||
|
||||
// **Clases dinámicas**
|
||||
$alignClass = match ($align) {
|
||||
'center' => 'text-center',
|
||||
'end' => 'text-end',
|
||||
default => '',
|
||||
};
|
||||
|
||||
$sizeClass = match ($size) {
|
||||
'sm' => 'form-check-sm',
|
||||
'lg' => 'form-check-lg',
|
||||
default => '',
|
||||
};
|
||||
|
||||
$switchTypeClass = $switchType === 'square' ? 'switch-square' : '';
|
||||
$switchColorClass = "switch-{$color}";
|
||||
$radioColorClass = "form-check-{$color}";
|
||||
|
||||
// **Fusionar atributos con clases dinámicas**
|
||||
$radioAttributes = $attributes->merge([
|
||||
'id' => $inputId,
|
||||
'name' => $name,
|
||||
'type' => 'radio',
|
||||
]);
|
||||
|
||||
// **Detectar si se usa `inline` o `stacked`**
|
||||
$layoutClass = $stacked ? 'switches-stacked' : 'form-check';
|
||||
@endphp
|
||||
|
||||
@if ($switch)
|
||||
{{-- ============================ MODO SWITCH ============================ --}}
|
||||
<div class="{{ $alignClass }} {{ $inline ? 'd-inline-block' : '' }} {{ $parentClass }} {{ $mb0 ? '' : 'mb-4' }}">
|
||||
<label class="switch {{ $switchTypeClass }} {{ $switchColorClass }} {{ $sizeClass }} {{ $labelClass }}">
|
||||
<input
|
||||
{{ $livewireModel ? "wire:model=$livewireModel" : '' }}
|
||||
{{ $disabled ? 'disabled' : '' }}
|
||||
{{ $checked ? 'checked' : '' }}
|
||||
{!! $radioAttributes->class("switch-input $errorClass")->toHtml() !!}
|
||||
/>
|
||||
{{-- El Switch Slider --}}
|
||||
<span class="switch-toggle-slider">
|
||||
<span class="switch-on"></span>
|
||||
<span class="switch-off"></span>
|
||||
</span>
|
||||
{{-- Etiqueta textual a la derecha del switch --}}
|
||||
<span class="switch-label">
|
||||
{{ $label }}
|
||||
</span>
|
||||
</label>
|
||||
|
||||
{{-- Texto de ayuda y error --}}
|
||||
@isset($helperText)
|
||||
<div class="form-text">{{ $helperText }}</div>
|
||||
@endisset
|
||||
@if ($hasError)
|
||||
<span class="text-danger">{{ $errors->first($errorKey) }}</span>
|
||||
@endif
|
||||
</div>
|
||||
|
||||
@else
|
||||
{{-- ============================ MODO RADIO ============================ --}}
|
||||
<div class="{{ $layoutClass }} {{ $radioColorClass }} {{ $alignClass }} {{ $sizeClass }} {{ $inline ? 'form-check-inline' : '' }} {{ $parentClass }} {{ $mb0 ? '' : 'mb-4' }}">
|
||||
<input
|
||||
{{ $livewireModel ? "wire:model=$livewireModel" : '' }}
|
||||
{{ $disabled ? 'disabled' : '' }}
|
||||
{{ $checked ? 'checked' : '' }}
|
||||
{!! $radioAttributes->class("form-check-input $errorClass")->toHtml() !!}
|
||||
>
|
||||
|
||||
<label for="{{ $inputId }}" class="form-check-label {{ $labelClass }}">
|
||||
{{ $label }}
|
||||
</label>
|
||||
|
||||
{{-- Texto de ayuda y error --}}
|
||||
@isset($helperText)
|
||||
<div class="form-text">{{ $helperText }}</div>
|
||||
@endisset
|
||||
@if ($hasError)
|
||||
<span class="text-danger">{{ $errors->first($errorKey) }}</span>
|
||||
@endif
|
||||
</div>
|
||||
@endif
|
||||
86
resources/views/components/form/select.blade copy.php
Normal file
86
resources/views/components/form/select.blade copy.php
Normal file
@ -0,0 +1,86 @@
|
||||
@props([
|
||||
'uid' => uniqid(),
|
||||
'id' => '',
|
||||
'model' => '',
|
||||
'name' => '',
|
||||
'label' => '',
|
||||
'labelClass' => 'form-label',
|
||||
'placeholder' => '',
|
||||
'options' => [],
|
||||
'selected' => null,
|
||||
'class' => '',
|
||||
'parentClass' => '',
|
||||
'multiple' => false,
|
||||
'disabled' => false,
|
||||
'prefixLabel' => null,
|
||||
'suffixLabel' => null,
|
||||
'buttonBefore' => null,
|
||||
'buttonAfter' => null,
|
||||
'inline' => false, // Si es en línea
|
||||
'labelCol' => 2, // Columnas que ocupa el label (Bootstrap grid)
|
||||
'inputCol' => 10, // Columnas que ocupa el input (Bootstrap grid)
|
||||
'helperText' => '', // Texto de ayuda opcional
|
||||
'select2' => false, // Activar Select2 automáticamente
|
||||
])
|
||||
|
||||
@php
|
||||
$name = $name ?: $model;
|
||||
$inputId = $id ?: ($uid ? str_replace('.', '_', $name) . '_' . $uid : $name);
|
||||
$placeholder = $placeholder ?: 'Seleccione ' . strtolower($label);
|
||||
$errorClass = $errors->has($model) ? 'is-invalid' : '';
|
||||
$options = is_array($options) ? collect($options) : $options;
|
||||
$select2Class = $select2 ? 'select2' : ''; // Agrega la clase select2 si está habilitado
|
||||
@endphp
|
||||
|
||||
<div class="{{ $inline ? 'row' : 'mb-4' }} {{ $parentClass }} fv-row">
|
||||
@if($label != null)
|
||||
<label for="{{ $inputId }}" class="{{ $inline ? 'col-md-' . $labelCol : '' }} {{ $labelClass }}">{{ $label }}</label>
|
||||
@endif
|
||||
|
||||
<div class="{{ $inline ? 'col-md-' . $inputCol : '' }}">
|
||||
<div class="input-group {{ $prefixLabel || $suffixLabel || $buttonBefore || $buttonAfter ? 'input-group-merge' : '' }}">
|
||||
@if ($buttonBefore)
|
||||
<button class="btn btn-outline-primary waves-effect" type="button">{{ $buttonBefore }}</button>
|
||||
@endif
|
||||
|
||||
@if ($prefixLabel)
|
||||
<label class="input-group-text" for="{{ $inputId }}">{{ $prefixLabel }}</label>
|
||||
@endif
|
||||
|
||||
<select
|
||||
id="{{ $inputId }}"
|
||||
name="{{ $name }}"
|
||||
class="form-select {{ $errorClass }} {{ $class }} {{ $select2Class }}"
|
||||
{{ $multiple ? 'multiple' : '' }}
|
||||
{{ $disabled ? 'disabled' : '' }}
|
||||
{{ $model ? "wire:model=$model" : '' }}
|
||||
{{ $select2 ? 'data-live-search="true"' : '' }}
|
||||
>
|
||||
@if (!$multiple && $placeholder)
|
||||
<option value="">{{ $placeholder }}</option>
|
||||
@endif
|
||||
@foreach ($options as $key => $value)
|
||||
<option value="{{ $key }}" {{ (string) $key === (string) $selected ? 'selected' : '' }}>
|
||||
{{ $value }}
|
||||
</option>
|
||||
@endforeach
|
||||
</select>
|
||||
|
||||
@if ($suffixLabel)
|
||||
<label class="input-group-text" for="{{ $inputId }}">{{ $suffixLabel }}</label>
|
||||
@endif
|
||||
|
||||
@if ($buttonAfter)
|
||||
<button class="btn btn-outline-primary waves-effect" type="button">{{ $buttonAfter }}</button>
|
||||
@endif
|
||||
</div>
|
||||
|
||||
@if ($helperText)
|
||||
<div class="form-text">{{ $helperText }}</div>
|
||||
@endif
|
||||
|
||||
@if ($errors->has($model))
|
||||
<span class="text-danger">{{ $errors->first($model) }}</span>
|
||||
@endif
|
||||
</div>
|
||||
</div>
|
||||
151
resources/views/components/form/select.blade.php
Normal file
151
resources/views/components/form/select.blade.php
Normal file
@ -0,0 +1,151 @@
|
||||
@props([
|
||||
// Identificador único
|
||||
'uid' => uniqid(),
|
||||
|
||||
// Modelo de Livewire (si aplica)
|
||||
'model' => '',
|
||||
|
||||
// Etiqueta y clases de la etiqueta
|
||||
'label' => '',
|
||||
'labelClass' => '',
|
||||
|
||||
// Clases generales
|
||||
'align' => 'start',
|
||||
'size' => '', // Tamaño del select (small, large)
|
||||
'mb0' => false, // Remover margen inferior
|
||||
'parentClass' => '',
|
||||
|
||||
// Activar Select2 automáticamente
|
||||
'select2' => false,
|
||||
|
||||
// Prefijos y sufijos en input-group
|
||||
'prefixLabel' => null,
|
||||
'suffixLabel' => null,
|
||||
'buttonBefore' => null,
|
||||
'buttonAfter' => null,
|
||||
|
||||
// Diseño de disposición (columnas)
|
||||
'inline' => false,
|
||||
'labelCol' => 4,
|
||||
'inputCol' => 8,
|
||||
|
||||
// Texto de ayuda
|
||||
'helperText' => '',
|
||||
|
||||
// Opciones del select
|
||||
'options' => [],
|
||||
|
||||
// Atributos adicionales
|
||||
'attributes' => new \Illuminate\View\ComponentAttributeBag([]),
|
||||
])
|
||||
|
||||
@php
|
||||
// **Configuración de valores base**
|
||||
$livewireModel = $attributes->get('wire:model', $model);
|
||||
$name = $attributes->get('name', $livewireModel);
|
||||
$inputId = $attributes->get('id', $name . '_' . $uid);
|
||||
$placeholder = $attributes->get('placeholder', 'Seleccione ' . strtolower($label));
|
||||
$selected = $attributes->get('selected', null);
|
||||
|
||||
// **Manejo de errores**
|
||||
$errorKey = $livewireModel ?: $name;
|
||||
$hasError = $errors->has($errorKey);
|
||||
$errorClass = $hasError ? 'is-invalid' : '';
|
||||
|
||||
// **Clases dinámicas**
|
||||
$select2Class = $select2 ? 'select2' : ''; // Agrega la clase `select2` si está habilitado
|
||||
$sizeClass = match ($size) {
|
||||
'sm' => 'form-select-sm',
|
||||
'lg' => 'form-select-lg',
|
||||
default => '',
|
||||
};
|
||||
$alignClass = match ($align) {
|
||||
'center' => 'text-center',
|
||||
'end' => 'text-end',
|
||||
default => '',
|
||||
};
|
||||
|
||||
// **Construcción de clases dinámicas**
|
||||
$fullClass = trim("form-select $select2Class $sizeClass $alignClass $errorClass");
|
||||
$fullLabelClass = trim(($inline ? 'col-form-label col-md-' . $labelCol : 'form-label') . ' ' . $labelClass);
|
||||
$containerClass = trim(($inline ? 'row' : '') . ' fv-row ' . ($mb0 ? '' : 'mb-4') . " $alignClass $parentClass");
|
||||
|
||||
// **Fusionar atributos con clases dinámicas**
|
||||
$selectAttributes = $attributes->merge([
|
||||
'id' => $inputId,
|
||||
'name' => $name,
|
||||
])->class($fullClass);
|
||||
|
||||
// **Detectar si se necesita input-group**
|
||||
$requiresInputGroup = $prefixLabel || $suffixLabel || $buttonBefore || $buttonAfter;
|
||||
@endphp
|
||||
|
||||
<div class="{{ $containerClass }}">
|
||||
{{-- Etiqueta del select --}}
|
||||
@if($label)
|
||||
<label for="{{ $inputId }}" class="{{ $fullLabelClass }}">{{ $label }}</label>
|
||||
@endif
|
||||
|
||||
@if($inline)
|
||||
<div class="col-md-{{ $inputCol }}">
|
||||
@endif
|
||||
|
||||
{{-- Input Group (Si tiene prefijo/sufijo) --}}
|
||||
@if ($requiresInputGroup)
|
||||
<div class="input-group input-group-merge">
|
||||
@isset($buttonBefore)
|
||||
<button class="btn btn-outline-primary waves-effect" type="button">{{ $buttonBefore }}</button>
|
||||
@endisset
|
||||
|
||||
@if($prefixLabel)
|
||||
<label class="input-group-text" for="{{ $inputId }}">{{ $prefixLabel }}</label>
|
||||
@endif
|
||||
|
||||
{{-- Select --}}
|
||||
<select {!! $selectAttributes !!} {{ $attributes->get('multiple') ? 'multiple' : '' }} {{ $attributes->get('disabled') ? 'disabled' : '' }} {{ $livewireModel ? "wire:model=$livewireModel" : '' }} {{ $select2 ? 'data-live-search="true"' : '' }}>
|
||||
@if (!$attributes->get('multiple') && $placeholder)
|
||||
<option value="">{{ $placeholder }}</option>
|
||||
@endif
|
||||
@foreach ($options as $key => $value)
|
||||
<option value="{{ $key }}" {{ (string) $key === (string) $selected ? 'selected' : '' }}>
|
||||
{{ $value }}
|
||||
</option>
|
||||
@endforeach
|
||||
</select>
|
||||
|
||||
@if($suffixLabel)
|
||||
<label class="input-group-text" for="{{ $inputId }}">{{ $suffixLabel }}</label>
|
||||
@endif
|
||||
|
||||
@isset($buttonAfter)
|
||||
<button class="btn btn-outline-primary waves-effect" type="button">{{ $buttonAfter }}</button>
|
||||
@endisset
|
||||
</div>
|
||||
@else
|
||||
{{-- Select sin prefijo/sufijo --}}
|
||||
<select {!! $selectAttributes !!} {{ $attributes->get('multiple') ? 'multiple' : '' }} {{ $attributes->get('disabled') ? 'disabled' : '' }} {{ $livewireModel ? "wire:model=$livewireModel" : '' }} {{ $select2 ? 'data-live-search="true"' : '' }}>
|
||||
@if (!$attributes->get('multiple') && $placeholder)
|
||||
<option value="">{{ $placeholder }}</option>
|
||||
@endif
|
||||
@foreach ($options as $key => $value)
|
||||
<option value="{{ $key }}" {{ (string) $key === (string) $selected ? 'selected' : '' }}>
|
||||
{{ $value }}
|
||||
</option>
|
||||
@endforeach
|
||||
</select>
|
||||
@endif
|
||||
|
||||
{{-- Texto de ayuda --}}
|
||||
@isset($helperText)
|
||||
<div class="form-text">{{ $helperText }}</div>
|
||||
@endisset
|
||||
|
||||
{{-- Errores de validación --}}
|
||||
@if ($hasError)
|
||||
<span class="text-danger">{{ $errors->first($errorKey) }}</span>
|
||||
@endif
|
||||
|
||||
@if($inline)
|
||||
</div>
|
||||
@endif
|
||||
</div>
|
||||
178
resources/views/components/form/textarea.blade.php
Normal file
178
resources/views/components/form/textarea.blade.php
Normal file
@ -0,0 +1,178 @@
|
||||
@props([
|
||||
// Identificador único
|
||||
'uid' => uniqid(),
|
||||
|
||||
// Modelo para Livewire
|
||||
'model' => '',
|
||||
|
||||
// Etiqueta y clases de la etiqueta
|
||||
'label' => '',
|
||||
'labelClass' => '',
|
||||
|
||||
// Clases generales
|
||||
'align' => 'start', // Alineación del textarea (start, end)
|
||||
'size' => 'md', // Tamaño del textarea (sm, md, lg)
|
||||
'mb0' => false, // Remover margen inferior
|
||||
'parentClass' => '',
|
||||
|
||||
// Elementos opcionales antes/después del textarea
|
||||
'prefix' => null,
|
||||
'suffix' => null,
|
||||
|
||||
// Íconos dentro del input
|
||||
'prefixIcon' => null, // Ícono fijo a la izquierda
|
||||
'prefixClickableIcon' => null, // Ícono con botón a la izquierda
|
||||
'suffixIcon' => null, // Ícono fijo a la derecha
|
||||
'suffixClickableIcon' => null, // Ícono con botón a la derecha
|
||||
|
||||
// Configuración del textarea
|
||||
'rows' => 3,
|
||||
'maxlength' => null,
|
||||
'autosize' => false, // Autoajuste de altura
|
||||
'resize' => true, // Permitir redimensionar
|
||||
|
||||
// Soporte para etiquetas flotantes
|
||||
'floating' => false, // Si la etiqueta es flotante
|
||||
|
||||
// Texto de ayuda
|
||||
'helperText' => '',
|
||||
|
||||
// Atributos adicionales para el textarea
|
||||
'attributes' => new \Illuminate\View\ComponentAttributeBag([]),
|
||||
])
|
||||
|
||||
@php
|
||||
// **Generación de Name, ID y Model**
|
||||
$livewireModel = $attributes->get('wire:model', $model);
|
||||
$name = $attributes->get('name', $livewireModel);
|
||||
$inputId = $attributes->get('id', $name . '_' . $uid);
|
||||
|
||||
// **Placeholder obligatorio si es flotante**
|
||||
$placeholder = $attributes->get('placeholder', $floating ? ' ' : 'Ingrese ' . strtolower($label));
|
||||
|
||||
// **Manejo de errores**
|
||||
$errorKey = $livewireModel ?: $name;
|
||||
$hasError = $errors->has($errorKey);
|
||||
$errorClass = $hasError ? 'is-invalid' : '';
|
||||
|
||||
// **Clases dinámicas**
|
||||
$sizeClass = match ($size) {
|
||||
'sm' => 'form-control-sm',
|
||||
'lg' => 'form-control-lg',
|
||||
default => '',
|
||||
};
|
||||
|
||||
$alignClass = match ($align) {
|
||||
'center' => 'text-center',
|
||||
'end' => 'text-end',
|
||||
default => '',
|
||||
};
|
||||
|
||||
// **Control de redimensionamiento**
|
||||
$resizeClass = $resize ? '' : 'resize-none';
|
||||
|
||||
// **Fusionar atributos del textarea**
|
||||
$textareaAttributes = $attributes->merge([
|
||||
'id' => $inputId,
|
||||
'name' => $name,
|
||||
'rows' => $rows,
|
||||
'placeholder' => $placeholder,
|
||||
'maxlength' => $maxlength,
|
||||
])->class("form-control $sizeClass $resizeClass $errorClass");
|
||||
|
||||
// **Clases del contenedor flotante**
|
||||
$floatingClass = $floating ? 'form-floating' : '';
|
||||
|
||||
// **Detectar si necesita Input-Group**
|
||||
$requiresInputGroup = $prefix || $suffix || $prefixIcon || $suffixIcon || $prefixClickableIcon || $suffixClickableIcon;
|
||||
@endphp
|
||||
|
||||
{{-- ============================ TEXTAREA ============================ --}}
|
||||
<div class="{{ $mb0 ? '' : 'mb-4' }} {{ $parentClass }} {{ $alignClass }} {{ $floatingClass }}">
|
||||
@if (!$floating && $label)
|
||||
<label for="{{ $inputId }}" class="{{ $labelClass }}">{{ $label }}</label>
|
||||
@endif
|
||||
|
||||
@if ($requiresInputGroup)
|
||||
{{-- Textarea con Input-Group --}}
|
||||
<div class="input-group">
|
||||
{{-- Prefijos (Izquierda) --}}
|
||||
@if ($prefix)
|
||||
<span class="input-group-text">{{ $prefix }}</span>
|
||||
@endif
|
||||
|
||||
@if ($prefixIcon)
|
||||
<span class="input-group-text"><i class="{{ $prefixIcon }}"></i></span>
|
||||
@endif
|
||||
|
||||
@if ($prefixClickableIcon)
|
||||
<button type="button" class="input-group-text cursor-pointer">
|
||||
<i class="{{ $prefixClickableIcon }}"></i>
|
||||
</button>
|
||||
@endif
|
||||
|
||||
{{-- Textarea --}}
|
||||
<textarea
|
||||
{{ $livewireModel ? "wire:model=$livewireModel" : '' }}
|
||||
{!! $textareaAttributes !!}
|
||||
></textarea>
|
||||
|
||||
{{-- Sufijos (Derecha) --}}
|
||||
@if ($suffixClickableIcon)
|
||||
<button type="button" class="input-group-text cursor-pointer">
|
||||
<i class="{{ $suffixClickableIcon }}"></i>
|
||||
</button>
|
||||
@endif
|
||||
|
||||
@if ($suffixIcon)
|
||||
<span class="input-group-text"><i class="{{ $suffixIcon }}"></i></span>
|
||||
@endif
|
||||
|
||||
@if ($suffix)
|
||||
<span class="input-group-text">{{ $suffix }}</span>
|
||||
@endif
|
||||
</div>
|
||||
@else
|
||||
{{-- Textarea simple o flotante --}}
|
||||
<textarea
|
||||
{{ $livewireModel ? "wire:model=$livewireModel" : '' }}
|
||||
{!! $textareaAttributes !!}
|
||||
></textarea>
|
||||
@endif
|
||||
|
||||
{{-- Etiqueta flotante --}}
|
||||
@if ($floating)
|
||||
<label for="{{ $inputId }}">{{ $label }}</label>
|
||||
@endif
|
||||
|
||||
{{-- Longitud máxima permitida --}}
|
||||
@if ($maxlength)
|
||||
<small class="form-text float-end text-muted">Máximo {{ $maxlength }} caracteres</small>
|
||||
@endif
|
||||
|
||||
{{-- Texto de ayuda --}}
|
||||
@if ($helperText)
|
||||
<div class="form-text">{{ $helperText }}</div>
|
||||
@endif
|
||||
|
||||
{{-- Mensaje de error --}}
|
||||
@if ($hasError)
|
||||
<span class="text-danger">{{ $errors->first($errorKey) }}</span>
|
||||
@endif
|
||||
</div>
|
||||
|
||||
{{-- ============================ JAVASCRIPT PARA AUTOSIZE ============================ --}}
|
||||
@if ($autosize)
|
||||
<script>
|
||||
document.addEventListener('DOMContentLoaded', function () {
|
||||
let textarea = document.getElementById('{{ $inputId }}');
|
||||
if (textarea) {
|
||||
textarea.addEventListener('input', function () {
|
||||
this.style.height = 'auto';
|
||||
this.style.height = this.scrollHeight + 'px';
|
||||
});
|
||||
textarea.dispatchEvent(new Event('input')); // Auto-trigger on load
|
||||
}
|
||||
});
|
||||
</script>
|
||||
@endif
|
||||
78
resources/views/components/offcanvas/basic.blade.php
Normal file
78
resources/views/components/offcanvas/basic.blade.php
Normal file
@ -0,0 +1,78 @@
|
||||
@php
|
||||
use Illuminate\Support\Str;
|
||||
@endphp
|
||||
|
||||
@props([
|
||||
'id' => '', // ID único para el offcanvas
|
||||
'title' => '', // Título del offcanvas
|
||||
'position' => 'end', // Posición: 'start', 'end', 'top', 'bottom'
|
||||
'size' => 'md', // Tamaño: sm, md, lg, xl
|
||||
'backdrop' => true, // Si se debe mostrar backdrop
|
||||
'wireIgnore' => true, // Ignorar eventos wire (Livewire)
|
||||
'listener' => '', // Nombre del listener para reload
|
||||
'tagName' => '', // Etiqueta del formHelpers
|
||||
])
|
||||
|
||||
@php
|
||||
$offcanvasClasses = "offcanvas offcanvas-{$position}";
|
||||
|
||||
$offcanvasSize = match ($size) {
|
||||
'sm' => 'offcanvas-sm',
|
||||
'lg' => 'offcanvas-lg',
|
||||
'xl' => 'offcanvas-xl',
|
||||
default => '',
|
||||
};
|
||||
|
||||
$helperTag = Str::kebab($tagName);
|
||||
@endphp
|
||||
|
||||
<div
|
||||
class="{{ $offcanvasClasses }} {{ $offcanvasSize }}"
|
||||
tabindex="-1"
|
||||
id="{{ $id }}"
|
||||
aria-labelledby="{{ $id }}Label"
|
||||
{{ $wireIgnore ? 'wire:ignore.self' : '' }}
|
||||
data-bs-backdrop="{{ $backdrop ? 'true' : 'false' }}">
|
||||
|
||||
{{-- HEADER --}}
|
||||
<div class="offcanvas-header border-bottom">
|
||||
<h5 class="offcanvas-title">{{ $title }}</h5>
|
||||
<button type="button" class="btn-close text-reset" data-bs-dismiss="offcanvas" aria-label="Cerrar"></button>
|
||||
</div>
|
||||
|
||||
{{-- BODY --}}
|
||||
<div class="offcanvas-body p-4">
|
||||
{{ $slot }}
|
||||
</div>
|
||||
|
||||
{{-- FOOTER SLOT OPCIONAL --}}
|
||||
@if (isset($footer))
|
||||
<div class="offcanvas-footer border-top p-3">
|
||||
{{ $footer }}
|
||||
</div>
|
||||
@endif
|
||||
</div>
|
||||
|
||||
@push('page-script')
|
||||
<script>
|
||||
// Evento para inicializar el formulario cuando se carga la página
|
||||
window.addEventListener("DOMContentLoaded", () => {
|
||||
const register{{ $tagName }}FormEvents = () => {
|
||||
document.addEventListener("refresh-{{ $helperTag }}-offcanvas", () => {
|
||||
window.formHelpers['{{ $helperTag }}'].refresh();
|
||||
});
|
||||
|
||||
var myOffcanvas = document.getElementById('{{ $id }}')
|
||||
|
||||
myOffcanvas.addEventListener('show.bs.offcanvas', function () {
|
||||
setTimeout(() => window.formHelpers['{{ $helperTag }}'].reloadOffcanvas(), 20);
|
||||
});
|
||||
}
|
||||
|
||||
window.formHelpers = window.formHelpers || {};
|
||||
window.formHelpers['{{ $helperTag }}'] = new FormCanvasHelper('{{ $id }}', @this);
|
||||
|
||||
register{{ $tagName }}FormEvents();
|
||||
});
|
||||
</script>
|
||||
@endpush
|
||||
66
resources/views/components/table/bootstrap/manager.blade.php
Normal file
66
resources/views/components/table/bootstrap/manager.blade.php
Normal file
@ -0,0 +1,66 @@
|
||||
@php
|
||||
use Illuminate\Support\Str;
|
||||
@endphp
|
||||
|
||||
@props([
|
||||
'id' => uniqid(),
|
||||
'tagName' => '',
|
||||
'datatableConfig' => [],
|
||||
'routes' => [],
|
||||
'noFilterButtons' => false
|
||||
])
|
||||
|
||||
@php
|
||||
if($tagName)
|
||||
$id = 'bt-' . Str::kebab($tagName) . 's';
|
||||
@endphp
|
||||
|
||||
<div id="{{ $id }}" wire:ignore>
|
||||
{{-- Contenedor de notificaciones --}}
|
||||
<div class="notification-container"></div>
|
||||
|
||||
{{-- Toolbar con filtros, agrupación y herramientas --}}
|
||||
<div class="bt-toolbar">
|
||||
<div class="d-flex flex-wrap">
|
||||
{{ $tools ?? '' }}
|
||||
|
||||
@isset($filterButtons)
|
||||
{{ $filterButtons }}
|
||||
|
||||
@elseif($noFilterButtons == false)
|
||||
<div class="my-1 pr-2">
|
||||
<x-vuexy-admin::button.basic variant="secondary" class="bt-btn-refresh" icon="ti ti-zoom-reset" size="sm" label="Refrescar" />
|
||||
</div>
|
||||
<div class="my-1 pr-2">
|
||||
<x-vuexy-admin::button.basic variant="secondary" class="bt-btn-filter-edit" label-style icon="ti ti-filter-edit" size="sm" label="Filtros" />
|
||||
</div>
|
||||
<div class="my-1 pr-2">
|
||||
<x-vuexy-admin::button.basic variant="secondary" class="bt-btn-filter-cancel" text-style icon="ti ti-filter-cancel" size="sm" label="Limpiar filtros" />
|
||||
</div>
|
||||
@endisset
|
||||
|
||||
{{ $postTools ?? '' }}
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{-- Tabla con Bootstrap Table --}}
|
||||
<table class="bootstrap-table"></table>
|
||||
</div>
|
||||
|
||||
@push('page-script')
|
||||
<script>
|
||||
document.addEventListener('DOMContentLoaded', () => {
|
||||
new BootstrapTableManager('#{{ $id }}', {!! json_encode($datatableConfig) !!});
|
||||
|
||||
document.addEventListener("reload-{{ $id }}", () => {
|
||||
$("#{{ $id }} .bootstrap-table").bootstrapTable("refresh");
|
||||
});
|
||||
});
|
||||
</script>
|
||||
@isset($routes)
|
||||
<script id="app-routes" type="application/json">
|
||||
{!! json_encode($routes) !!}
|
||||
</script>
|
||||
@endisset
|
||||
@endpush
|
||||
38
resources/views/errors/400.blade.php
Normal file
38
resources/views/errors/400.blade.php
Normal file
@ -0,0 +1,38 @@
|
||||
@php
|
||||
$customizerHidden = 'customizer-hide';
|
||||
$configData = Helper::appClasses();
|
||||
@endphp
|
||||
|
||||
@extends('vuexy-admin::layouts.vuexy.layoutMaster')
|
||||
|
||||
@section('title', '400 Bad Request')
|
||||
|
||||
@push('page-style')
|
||||
<!-- Page -->
|
||||
@vite(['/resources/scss/pages/page-misc.scss'])
|
||||
@endsection
|
||||
|
||||
@section('content')
|
||||
<!-- Error -->
|
||||
<div class="container-xxl container-p-y">
|
||||
<div class="misc-wrapper">
|
||||
<h1 class="mb-2 mx-2 fs-xxlarge" style="line-height: 6rem;font-size: 6rem;">400</h1>
|
||||
<h4 class="mb-2 mx-2">Solicitud incorrecta ⚠️</h4>
|
||||
<p class="mb-6 mx-2">
|
||||
@if (!empty($exception->getMessage()))
|
||||
{{ __($exception->getMessage()) }}
|
||||
@else
|
||||
{{ __('errors.bad_request') }}
|
||||
@endif
|
||||
</p>
|
||||
<a href="{{ route('admin.core.home.index') }}" class="btn btn-primary mb-10">Regresar al inicio</a>
|
||||
<div class="mt-4">
|
||||
<img src="{{ asset('vendor/vuexy-admin/img/illustrations/page-misc-error.png') }}" alt="page-misc-error" width="225" class="img-fluid">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="container-fluid misc-bg-wrapper">
|
||||
<img src="{{ asset('vendor/vuexy-admin/img/illustrations/bg-shape-image-'.$configData['style'].'.png') }}" height="355" alt="page-misc-error" data-app-light-img="illustrations/bg-shape-image-light.png" data-app-dark-img="illustrations/bg-shape-image-dark.png">
|
||||
</div>
|
||||
<!-- /Error -->
|
||||
@endsection
|
||||
38
resources/views/errors/401.blade.php
Normal file
38
resources/views/errors/401.blade.php
Normal file
@ -0,0 +1,38 @@
|
||||
@php
|
||||
$customizerHidden = 'customizer-hide';
|
||||
$configData = Helper::appClasses();
|
||||
@endphp
|
||||
|
||||
@extends('vuexy-admin::layouts.vuexy.layoutMaster')
|
||||
|
||||
@section('title', '401 Unauthorized')
|
||||
|
||||
@push('page-style')
|
||||
<!-- Page -->
|
||||
@vite(['/resources/scss/pages/page-misc.scss'])
|
||||
@endsection
|
||||
|
||||
@section('content')
|
||||
<!-- Error -->
|
||||
<div class="container-xxl container-p-y">
|
||||
<div class="misc-wrapper">
|
||||
<h1 class="mb-2 mx-2 fs-xxlarge" style="line-height: 6rem;font-size: 6rem;">401</h1>
|
||||
<h4 class="mb-2 mx-2">¡No estás autorizado! 🔐</h4>
|
||||
<p class="mb-6 mx-2">
|
||||
@if (!empty($exception->getMessage()))
|
||||
{{ __($exception->getMessage()) }}
|
||||
@else
|
||||
{{ __('errors.unauthorized') }}
|
||||
@endif
|
||||
</p>
|
||||
<a href="{{ route('admin.core.home.index') }}" class="btn btn-primary mb-10">Regresar al inicio</a>
|
||||
<div class="mt-4">
|
||||
<img src="{{ asset('vendor/vuexy-admin/img/illustrations/page-misc-you-are-not-authorized.png') }}" alt="page-misc-not-authorized" width="170" class="img-fluid">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="container-fluid misc-bg-wrapper">
|
||||
<img src="{{ asset('vendor/vuexy-admin/img/illustrations/bg-shape-image-'.$configData['style'].'.png') }}" height="355" alt="page-misc-not-authorized" data-app-light-img="illustrations/bg-shape-image-light.png" data-app-dark-img="illustrations/bg-shape-image-dark.png">
|
||||
</div>
|
||||
<!-- /Error -->
|
||||
@endsection
|
||||
38
resources/views/errors/403.blade.php
Normal file
38
resources/views/errors/403.blade.php
Normal file
@ -0,0 +1,38 @@
|
||||
@php
|
||||
$customizerHidden = 'customizer-hide';
|
||||
$configData = Helper::appClasses();
|
||||
@endphp
|
||||
|
||||
@extends('vuexy-admin::layouts.vuexy.layoutMaster')
|
||||
|
||||
@section('title', '403 Forbidden')
|
||||
|
||||
@push('page-style')
|
||||
<!-- Page -->
|
||||
@vite(['/resources/scss/pages/page-misc.scss'])
|
||||
@endsection
|
||||
|
||||
@section('content')
|
||||
<!-- Error -->
|
||||
<div class="container-xxl container-p-y">
|
||||
<div class="misc-wrapper">
|
||||
<h1 class="mb-2 mx-2 fs-xxlarge" style="line-height: 6rem;font-size: 6rem;">403</h1>
|
||||
<h4 class="mb-2 mx-2">¡No estás autorizado! 🔐</h4>
|
||||
<p class="mb-6 mx-2">
|
||||
@if (!empty($exception->getMessage()))
|
||||
{{ __($exception->getMessage()) }}
|
||||
@else
|
||||
{{ __('errors.forbidden') }}
|
||||
@endif
|
||||
</p>
|
||||
<a href="{{ route('admin.core.home.index') }}" class="btn btn-primary mb-10">Regresar al inicio</a>
|
||||
<div class="mt-4">
|
||||
<img src="{{ asset('vendor/vuexy-admin/img/illustrations/page-misc-you-are-not-authorized.png') }}" alt="page-misc-not-authorized" width="170" class="img-fluid">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="container-fluid misc-bg-wrapper">
|
||||
<img src="{{ asset('vendor/vuexy-admin/img/illustrations/bg-shape-image-'.$configData['style'].'.png') }}" height="355" alt="page-misc-not-authorized" data-app-light-img="illustrations/bg-shape-image-light.png" data-app-dark-img="illustrations/bg-shape-image-dark.png">
|
||||
</div>
|
||||
<!-- /Error -->
|
||||
@endsection
|
||||
34
resources/views/errors/404.blade.php
Normal file
34
resources/views/errors/404.blade.php
Normal file
@ -0,0 +1,34 @@
|
||||
@php
|
||||
$customizerHidden = 'customizer-hide';
|
||||
$configData = Helper::appClasses();
|
||||
@endphp
|
||||
|
||||
@extends('vuexy-admin::layouts.vuexy.layoutMaster')
|
||||
|
||||
@section('title', '404 Not Found')
|
||||
|
||||
@push('page-style')
|
||||
<!-- Page -->
|
||||
@vite(['/resources/scss/pages/page-misc.scss'])
|
||||
@endsection
|
||||
|
||||
@section('content')
|
||||
<!-- Error -->
|
||||
<div class="container-xxl container-p-y">
|
||||
<div class="misc-wrapper">
|
||||
<h1 class="mb-2 mx-2 fs-xxlarge" style="line-height: 6rem;font-size: 6rem;">404</h1>
|
||||
<h4 class="mb-2 mx-2">Página no encontrada ⚠️</h4>
|
||||
<p class="mb-6 mx-2">
|
||||
{{ __('errors.page_not_found') }}
|
||||
</p>
|
||||
<a href="{{ route('admin.core.home.index') }}" class="btn btn-primary mb-10">Regresar al inicio</a>
|
||||
<div class="mt-4">
|
||||
<img src="{{ asset('vendor/vuexy-admin/img/illustrations/page-misc-error.png') }}" alt="page-misc-error" width="225" class="img-fluid">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="container-fluid misc-bg-wrapper">
|
||||
<img src="{{ asset('vendor/vuexy-admin/img/illustrations/bg-shape-image-'.$configData['style'].'.png') }}" height="355" alt="page-misc-error" data-app-light-img="illustrations/bg-shape-image-light.png" data-app-dark-img="illustrations/bg-shape-image-dark.png">
|
||||
</div>
|
||||
<!-- /Error -->
|
||||
@endsection
|
||||
17
resources/views/layouts/vuexy/blankLayout.blade.php
Normal file
17
resources/views/layouts/vuexy/blankLayout.blade.php
Normal file
@ -0,0 +1,17 @@
|
||||
@isset($pageConfigs)
|
||||
{!! Helper::updatePageConfig($pageConfigs) !!}
|
||||
@endisset
|
||||
@php
|
||||
$configData = Helper::appClasses();
|
||||
|
||||
/* Display elements */
|
||||
$customizerHidden = ($customizerHidden ?? '');
|
||||
@endphp
|
||||
|
||||
@extends('vuexy-admin::layouts.vuexy.commonMaster' )
|
||||
|
||||
@section('layoutContent')
|
||||
<!-- Content -->
|
||||
@yield('content')
|
||||
<!--/ Content -->
|
||||
@endsection
|
||||
58
resources/views/layouts/vuexy/commonMaster.blade.php
Normal file
58
resources/views/layouts/vuexy/commonMaster.blade.php
Normal file
@ -0,0 +1,58 @@
|
||||
<!DOCTYPE html>
|
||||
@php
|
||||
use Illuminate\Support\Facades\Route;
|
||||
|
||||
$menuFixed = ($configData['layout'] === 'vertical') ? ($menuFixed ?? '') : (($configData['layout'] === 'front') ? '' : $configData['headerType']);
|
||||
$navbarType = ($configData['layout'] === 'vertical') ? ($configData['navbarType'] ?? '') : (($configData['layout'] === 'front') ? 'layout-navbar-fixed': '');
|
||||
$isFront = ($isFront ?? '') == true ? 'Front' : '';
|
||||
$contentLayout = (isset($container) ? (($container === 'container-xxl') ? "layout-compact" : "layout-wide") : "");
|
||||
@endphp
|
||||
|
||||
<html lang="{{ session()->get('locale') ?? app()->getLocale() }}"
|
||||
class="{{ $configData['style'] }}-style {{($contentLayout ?? '')}} {{ ($navbarType ?? '') }} {{ ($menuFixed ?? '') }} {{ $menuCollapsed ?? '' }} {{ $menuFlipped ?? '' }} {{ $menuOffcanvas ?? '' }} {{ $footerFixed ?? '' }} {{ $customizerHidden ?? '' }}"
|
||||
dir="{{ $configData['textDirection'] }}"
|
||||
data-theme="{{ $configData['theme'] }}"
|
||||
data-assets-path="{{ asset('/assets') . '/' }}"
|
||||
data-base-url="{{ url('/') . '/' }}"
|
||||
data-quicklinks-update-url="{{ route('admin.core.quicklinks-navbar.update') }}"
|
||||
data-route="{{ Route::currentRouteName() }}"
|
||||
data-framework="laravel"
|
||||
data-template="{{ $configData['layout'] . '-menu-' . $configData['themeOpt'] . '-' . $configData['styleOpt'] }}"
|
||||
data-style="{{$configData['styleOptVal']}}">
|
||||
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0" />
|
||||
|
||||
<title>@hasSection('title') @yield('title') | @endif {{ $_admin['title'] }}</title>
|
||||
<meta name="description" content="{{ $_admin['description'] }}" />
|
||||
|
||||
<!-- laravel CRUD token -->
|
||||
<meta name="csrf-token" content="{{ csrf_token() }}">
|
||||
|
||||
<!-- Favicons-->
|
||||
<link rel="icon" href="{{ asset('storage/' . $_admin['favicon']['16x16']) }}" type="image/x-icon">
|
||||
<link rel="icon" sizes="192x192" href="{{ asset('storage/' . $_admin['favicon']['192x192']) }}">
|
||||
<link rel="apple-touch-icon" type="image/x-icon" sizes="76x76" href="{{ asset('storage/' . $_admin['favicon']['76x76']) }}">
|
||||
<link rel="apple-touch-icon" type="image/x-icon" sizes="120x120" href="{{ asset('storage/' . $_admin['favicon']['120x120']) }}">
|
||||
<link rel="apple-touch-icon" type="image/x-icon" sizes="152x152" href="{{ asset('storage/' . $_admin['favicon']['152x152']) }}">
|
||||
<link rel="apple-touch-icon" type="image/x-icon" sizes="180x180" href="{{ asset('storage/' . $_admin['favicon']['180x180']) }}">
|
||||
|
||||
<!-- Include Styles -->
|
||||
<!-- $isFront is used to append the front layout styles only on the front layout otherwise the variable will be blank -->
|
||||
@include('vuexy-admin::layouts.vuexy.sections.styles' . $isFront)
|
||||
|
||||
<!-- Include Scripts for customizer, helper, analytics, config -->
|
||||
<!-- $isFront is used to append the front layout scriptsIncludes only on the front layout otherwise the variable will be blank -->
|
||||
@include('vuexy-admin::layouts.vuexy.sections.scriptsIncludes' . $isFront)
|
||||
</head>
|
||||
<body>
|
||||
<!-- Layout Content -->
|
||||
@yield('layoutContent')
|
||||
<!--/ Layout Content -->
|
||||
|
||||
<!-- Include Scripts -->
|
||||
<!-- $isFront is used to append the front layout scripts only on the front layout otherwise the variable will be blank -->
|
||||
@include('vuexy-admin::layouts.vuexy.sections.scripts' . $isFront)
|
||||
</body>
|
||||
</html>
|
||||
89
resources/views/layouts/vuexy/contentNavbarLayout.blade.php
Normal file
89
resources/views/layouts/vuexy/contentNavbarLayout.blade.php
Normal file
@ -0,0 +1,89 @@
|
||||
@isset($pageConfigs)
|
||||
{!! Helper::updatePageConfig($pageConfigs) !!}
|
||||
@endisset
|
||||
@php
|
||||
$configData = Helper::appClasses();
|
||||
@endphp
|
||||
@extends('vuexy-admin::layouts.vuexy.commonMaster' )
|
||||
|
||||
@php
|
||||
/* Display elements */
|
||||
$contentNavbar = ($contentNavbar ?? true);
|
||||
$containerNav = ($containerNav ?? 'container-xxl');
|
||||
$isNavbar = ($isNavbar ?? true);
|
||||
$isMenu = ($isMenu ?? true);
|
||||
$isFlex = ($isFlex ?? false);
|
||||
$isFooter = ($isFooter ?? true);
|
||||
$customizerHidden = ($customizerHidden ?? '');
|
||||
|
||||
/* HTML Classes */
|
||||
$navbarDetached = 'navbar-detached';
|
||||
$menuFixed = (isset($configData['menuFixed']) ? $configData['menuFixed'] : '');
|
||||
if(isset($navbarType)) {
|
||||
$configData['navbarType'] = $navbarType;
|
||||
}
|
||||
$navbarType = (isset($configData['navbarType']) ? $configData['navbarType'] : '');
|
||||
$footerFixed = (isset($configData['footerFixed']) ? $configData['footerFixed'] : '');
|
||||
$menuCollapsed = (isset($configData['menuCollapsed']) ? $configData['menuCollapsed'] : '');
|
||||
|
||||
/* Content classes */
|
||||
$container = (isset($configData['contentLayout']) && $configData['contentLayout'] === 'compact') ? 'container-xxl' : 'container-fluid';
|
||||
@endphp
|
||||
|
||||
@section('layoutContent')
|
||||
<div class="layout-wrapper layout-content-navbar {{ $isMenu ? '' : 'layout-without-menu' }}">
|
||||
<div class="layout-container">
|
||||
|
||||
@if ($isMenu)
|
||||
@include('vuexy-admin::layouts.vuexy.sections.menu.verticalMenu')
|
||||
@endif
|
||||
|
||||
<!-- Layout page -->
|
||||
<div class="layout-page">
|
||||
|
||||
<!-- BEGIN: Navbar-->
|
||||
@if ($isNavbar)
|
||||
@include('vuexy-admin::layouts.vuexy.sections.navbar.navbar')
|
||||
@endif
|
||||
<!-- END: Navbar-->
|
||||
|
||||
<!-- Content wrapper -->
|
||||
<div class="content-wrapper">
|
||||
|
||||
<!-- Content -->
|
||||
@if ($isFlex)
|
||||
<div class="{{$container}} d-flex align-items-stretch flex-grow-1 p-0">
|
||||
@else
|
||||
<div class="{{$container}} flex-grow-1 container-p-y">
|
||||
@endif
|
||||
|
||||
<!-- Breadcrumbs -->
|
||||
@include('vuexy-admin::layouts.vuexy.sections.content.breadcrumbs')
|
||||
<!-- / Breadcrumbs -->
|
||||
|
||||
@yield('content')
|
||||
|
||||
</div>
|
||||
<!-- / Content -->
|
||||
|
||||
<!-- Footer -->
|
||||
@if ($isFooter)
|
||||
@include('vuexy-admin::layouts.vuexy.sections.footer.footer')
|
||||
@endif
|
||||
<!-- / Footer -->
|
||||
<div class="content-backdrop fade"></div>
|
||||
</div>
|
||||
<!--/ Content wrapper -->
|
||||
</div>
|
||||
<!-- / Layout page -->
|
||||
</div>
|
||||
|
||||
@if ($isMenu)
|
||||
<!-- Overlay -->
|
||||
<div class="layout-overlay layout-menu-toggle"></div>
|
||||
@endif
|
||||
<!-- Drag Target Area To SlideIn Menu On Small Screens -->
|
||||
<div class="drag-target"></div>
|
||||
</div>
|
||||
<!-- / Layout wrapper -->
|
||||
@endsection
|
||||
87
resources/views/layouts/vuexy/horizontalLayout.blade.php
Normal file
87
resources/views/layouts/vuexy/horizontalLayout.blade.php
Normal file
@ -0,0 +1,87 @@
|
||||
@isset($pageConfigs)
|
||||
{!! Helper::updatePageConfig($pageConfigs) !!}
|
||||
@endisset
|
||||
@php
|
||||
$configData = Helper::appClasses();
|
||||
@endphp
|
||||
|
||||
@extends('vuexy-admin::layouts.vuexy.commonMaster' )
|
||||
|
||||
@php
|
||||
$menuHorizontal = true;
|
||||
$navbarFull = true;
|
||||
|
||||
/* Display elements */
|
||||
$isNavbar = ($isNavbar ?? true);
|
||||
$isMenu = ($isMenu ?? true);
|
||||
$isFlex = ($isFlex ?? false);
|
||||
$isFooter = ($isFooter ?? true);
|
||||
$customizerHidden = ($customizerHidden ?? '');
|
||||
|
||||
/* HTML Classes */
|
||||
$menuFixed = (isset($configData['menuFixed']) ? $configData['menuFixed'] : '');
|
||||
$navbarType = (isset($configData['navbarType']) ? $configData['navbarType'] : '');
|
||||
$footerFixed = (isset($configData['footerFixed']) ? $configData['footerFixed'] : '');
|
||||
$menuCollapsed = (isset($configData['menuCollapsed']) ? $configData['menuCollapsed'] : '');
|
||||
|
||||
/* Content classes */
|
||||
$container = ($configData['contentLayout'] === 'compact') ? 'container-xxl' : 'container-fluid';
|
||||
$containerNav = ($configData['contentLayout'] === 'compact') ? 'container-xxl' : 'container-fluid';
|
||||
@endphp
|
||||
|
||||
@section('layoutContent')
|
||||
<div class="layout-wrapper layout-navbar-full layout-horizontal layout-without-menu">
|
||||
<div class="layout-container">
|
||||
|
||||
<!-- BEGIN: Navbar-->
|
||||
@if ($isNavbar)
|
||||
@include('vuexy-admin::layouts.vuexy.sections.navbar.navbar')
|
||||
@endif
|
||||
<!-- END: Navbar-->
|
||||
|
||||
<!-- Layout page -->
|
||||
<div class="layout-page">
|
||||
|
||||
<!-- Content wrapper -->
|
||||
<div class="content-wrapper">
|
||||
|
||||
@if ($isMenu)
|
||||
@include('vuexy-admin::layouts.vuexy.sections.menu.horizontalMenu')
|
||||
@endif
|
||||
|
||||
<!-- Content -->
|
||||
@if ($isFlex)
|
||||
<div class="{{$container}} d-flex align-items-stretch flex-grow-1 p-0">
|
||||
@else
|
||||
<div class="{{$container}} flex-grow-1 container-p-y">
|
||||
@endif
|
||||
<!-- Breadcrumbs -->
|
||||
@include('vuexy-admin::layouts.vuexy.sections.content.breadcrumbs')
|
||||
<!-- / Breadcrumbs -->
|
||||
|
||||
@yield('content')
|
||||
</div>
|
||||
<!-- / Content -->
|
||||
|
||||
<!-- Footer -->
|
||||
@if ($isFooter)
|
||||
@include('vuexy-admin::layouts.vuexy.sections.footer.footer')
|
||||
@endif
|
||||
<!-- / Footer -->
|
||||
<div class="content-backdrop fade"></div>
|
||||
</div>
|
||||
<!--/ Content wrapper -->
|
||||
</div>
|
||||
<!-- / Layout page -->
|
||||
</div>
|
||||
<!-- / Layout Container -->
|
||||
|
||||
@if ($isMenu)
|
||||
<!-- Overlay -->
|
||||
<div class="layout-overlay layout-menu-toggle"></div>
|
||||
@endif
|
||||
<!-- Drag Target Area To SlideIn Menu On Small Screens -->
|
||||
<div class="drag-target"></div>
|
||||
</div>
|
||||
<!-- / Layout wrapper -->
|
||||
@endsection
|
||||
16
resources/views/layouts/vuexy/layoutMaster.blade.php
Normal file
16
resources/views/layouts/vuexy/layoutMaster.blade.php
Normal file
@ -0,0 +1,16 @@
|
||||
@isset($pageConfigs)
|
||||
{!! Helper::updatePageConfig($pageConfigs) !!}
|
||||
@endisset
|
||||
@php
|
||||
$configData = Helper::appClasses();
|
||||
@endphp
|
||||
|
||||
@isset($configData["layout"])
|
||||
@include((( $configData["layout"] === 'horizontal')
|
||||
? 'vuexy-admin::layouts.vuexy.horizontalLayout'
|
||||
: (( $configData["layout"] === 'blank')
|
||||
? 'vuexy-admin::layouts.vuexy.blankLayout'
|
||||
: (($configData["layout"] === 'front')
|
||||
? 'vuexy-admin::layouts.vuexy.layoutFront'
|
||||
: 'vuexy-admin::layouts.vuexy.contentNavbarLayout') )))
|
||||
@endisset
|
||||
@ -0,0 +1,21 @@
|
||||
<!-- Breadcrumbs: Start -->
|
||||
@if($vuexyBreadcrumbs)
|
||||
<nav aria-label="breadcrumb">
|
||||
<ol class="breadcrumb">
|
||||
@foreach ($vuexyBreadcrumbs as $breadcrumb)
|
||||
<li class="breadcrumb-item {{ isset($breadcrumb['active']) && $breadcrumb['active']? 'active': '' }}">
|
||||
@php
|
||||
if(isset($breadcrumb['route']) && isset($breadcrumb['link']) == false)
|
||||
$breadcrumb['link'] = route($breadcrumb['route']);
|
||||
@endphp
|
||||
@isset($breadcrumb['link'])
|
||||
<a href="{{ $breadcrumb['link'] }}">{{ $breadcrumb['name'] }}</a>
|
||||
@else
|
||||
{{ $breadcrumb['name'] }}
|
||||
@endisset
|
||||
</li>
|
||||
@endforeach
|
||||
</ol>
|
||||
</nav>
|
||||
@endif
|
||||
<!-- Breadcrumbs: End -->
|
||||
@ -0,0 +1,23 @@
|
||||
@php
|
||||
$containerFooter = (isset($configData['contentLayout']) && $configData['contentLayout'] === 'compact') ? 'container-xxl' : 'container-fluid';
|
||||
@endphp
|
||||
|
||||
<!-- Footer-->
|
||||
<footer class="content-footer footer bg-footer-theme">
|
||||
<div class="{{ $containerFooter }}">
|
||||
<div class="footer-container d-flex align-items-center justify-content-between py-4 flex-md-row flex-column">
|
||||
<div class="text-body">
|
||||
© <script>document.write(new Date().getFullYear())</script>, Hecho con ❤️ por <a href="{{ (!empty(config('koneko.creatorUrl')) ? config('koneko.creatorUrl') : '') }}" target="_blank" class="footer-link">{{ (!empty(config('koneko.creatorName')) ? config('koneko.creatorName') : '') }}</a>
|
||||
</div>
|
||||
<div class="d-none d-lg-inline-block">
|
||||
@if (config('koneko.licenseUrl'))
|
||||
<a href="{{ config('koneko.licenseUrl') }}" class="footer-link me-4" target="_blank">Licencia</a>
|
||||
@endif
|
||||
@if (config('koneko.supportUrl'))
|
||||
<a href="{{ config('koneko.supportUrl') }}" target="_blank" class="footer-link d-none d-sm-inline-block">Soporte</a>
|
||||
@endif
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
<!--/ Footer-->
|
||||
@ -0,0 +1,28 @@
|
||||
@php
|
||||
$configData = Helper::appClasses();
|
||||
@endphp
|
||||
|
||||
<!-- Horizontal Menu -->
|
||||
<aside id="layout-menu" class="layout-menu-horizontal menu-horizontal menu bg-menu-theme flex-grow-0">
|
||||
<div class="{{$containerNav}} d-flex h-100">
|
||||
<ul class="menu-inner pb-2 pb-xl-0">
|
||||
@foreach ($vuexyMenu as $menuName => $menu)
|
||||
<li class="menu-item {{ isset($menu['active']) && $menu['active'] ? 'active' : '' }}">
|
||||
<a href="{{ $menu['url'] ?? 'javascript:void(0);' }}" class="menu-link {{ isset($menu['submenu']) ? 'menu-toggle' : '' }}" @if (isset($menu['target']) and !empty($menu['target'])) target="{{ $menu['target'] }}" @endif>
|
||||
@isset($menu['icon'])
|
||||
<i class="{{ $menu['icon'] }}"></i>
|
||||
@endisset
|
||||
<div>{{ $menuName }}</div>
|
||||
@isset($menu['badge'])
|
||||
<div class="badge bg-{{ $menu['badge'][0] }} rounded-pill ms-auto">{{ $menu['badge'][1] }}</div>
|
||||
@endisset
|
||||
</a>
|
||||
@isset($menu['submenu'])
|
||||
@include('vuexy-admin::layouts.vuexy.sections.menu.submenu', ['menu' => $menu['submenu']])
|
||||
@endisset
|
||||
</li>
|
||||
@endforeach
|
||||
</ul>
|
||||
</div>
|
||||
</aside>
|
||||
<!--/ Horizontal Menu -->
|
||||
@ -0,0 +1,18 @@
|
||||
<ul class="menu-sub">
|
||||
@foreach ($menu as $submenuName => $submenu)
|
||||
<li class="menu-item {{ isset($submenu['active']) && $submenu['active'] ? 'active open' : '' }}">
|
||||
<a href="{{ $submenu['url'] ?? 'javascript:void(0);' }}" class="menu-link {{ isset($submenu['submenu']) ? 'menu-toggle' : '' }}" @if (isset($submenu['target']) and !empty($submenu['target'])) target="{{ $submenu['target'] }}" @endif>
|
||||
@isset($submenu['icon'])
|
||||
<i class="{{ $submenu['icon'] }}"></i>
|
||||
@endisset
|
||||
<div>{{ $submenuName }}</div>
|
||||
@isset($submenu['badge'])
|
||||
<div class="badge bg-{{ $submenu['badge'][0] }} rounded-pill ms-auto">{{ $submenu['badge'][1] }}</div>
|
||||
@endisset
|
||||
</a>
|
||||
@isset($submenu['submenu'])
|
||||
@include('vuexy-admin::layouts.vuexy.sections.menu.submenu', ['menu' => $submenu['submenu']])
|
||||
@endisset
|
||||
</li>
|
||||
@endforeach
|
||||
</ul>
|
||||
@ -0,0 +1,51 @@
|
||||
@php
|
||||
$configData = Helper::appClasses();
|
||||
@endphp
|
||||
|
||||
<aside id="layout-menu" class="layout-menu menu-vertical menu bg-menu-theme">
|
||||
|
||||
<!-- ! Hide app brand if navbar-full -->
|
||||
@if(!isset($navbarFull))
|
||||
<div class="app-brand demo">
|
||||
<a href="{{ route('admin.core.home.index') }}" class="app-brand-link">
|
||||
<span class="app-brand-logo demo">
|
||||
<img src="{{ asset('storage/' . $_admin['image_logo']['small']) }}" alt="{{ $_admin['app_name'] }}" />
|
||||
</span>
|
||||
<span class="app-brand-text demo menu-text fw-bold">{{ $_admin['app_name'] }}</span>
|
||||
</a>
|
||||
<a href="javascript:void(0);" class="layout-menu-toggle menu-link text-large ms-auto">
|
||||
<i class="ti menu-toggle-icon d-none d-xl-block align-middle"></i>
|
||||
<i class="ti ti-x d-block d-xl-none ti-md align-middle"></i>
|
||||
</a>
|
||||
</div>
|
||||
@endif
|
||||
|
||||
<div class="menu-inner-shadow"></div>
|
||||
|
||||
<ul class="menu-inner py-1">
|
||||
@foreach ($vuexyMenu as $menuName => $menu)
|
||||
@if (isset($menu->menuHeader))
|
||||
<li class="menu-header small">
|
||||
<span class="menu-header-text">{{ __($menu->menuHeader) }}</span>
|
||||
</li>
|
||||
@else
|
||||
{{-- main menu --}}
|
||||
<li class="menu-item {{ isset($menu['active']) && $menu['active'] ? 'active open' : '' }}">
|
||||
<a href="{{ $menu['url'] ?? 'javascript:void(0);' }}" class="menu-link {{ isset($menu['submenu']) ? 'menu-link menu-toggle' : 'menu-link' }}" @if (isset($menu['target']) and !empty($menu['target'])) target="{{ $menu['target'] }}" @endif>
|
||||
@isset($menu['icon'])
|
||||
<i class="{{ $menu['icon'] }}"></i>
|
||||
@endisset
|
||||
<div>{{ $menuName }}</div>
|
||||
@isset($menu['badge'])
|
||||
<div class="badge bg-{{ $menu['badge'][0] }} rounded-pill ms-auto">{{ $menu['badge'][1] }}</div>
|
||||
@endisset
|
||||
</a>
|
||||
@isset($menu['submenu'])
|
||||
@include('vuexy-admin::layouts.vuexy.sections.menu.submenu', ['menu' => $menu['submenu']])
|
||||
@endisset
|
||||
</li>
|
||||
@endif
|
||||
@endforeach
|
||||
</ul>
|
||||
|
||||
</aside>
|
||||
233
resources/views/layouts/vuexy/sections/navbar/navbar.blade.php
Normal file
233
resources/views/layouts/vuexy/sections/navbar/navbar.blade.php
Normal file
@ -0,0 +1,233 @@
|
||||
@php
|
||||
use Illuminate\Support\Facades\Auth;
|
||||
use Illuminate\Support\Facades\Route;
|
||||
$containerNav = ($configData['contentLayout'] === 'compact') ? 'container-xxl' : 'container-fluid';
|
||||
$navbarDetached = ($navbarDetached ?? '');
|
||||
@endphp
|
||||
|
||||
<!-- Navbar -->
|
||||
@if(isset($navbarDetached) && $navbarDetached == 'navbar-detached')
|
||||
<nav class="layout-navbar {{$containerNav}} navbar navbar-expand-xl {{$navbarDetached}} align-items-center bg-navbar-theme" id="layout-navbar">
|
||||
@endif
|
||||
@if(isset($navbarDetached) && $navbarDetached == '')
|
||||
<nav class="layout-navbar navbar navbar-expand-xl align-items-center bg-navbar-theme" id="layout-navbar">
|
||||
<div class="{{$containerNav}}">
|
||||
@endif
|
||||
|
||||
<!-- Brand demo (display only for navbar-full and hide on below xl) -->
|
||||
@if(isset($navbarFull))
|
||||
<div class="navbar-brand app-brand demo d-none d-xl-flex py-0 me-4">
|
||||
<a href="{{ route('admin.core.home.index') }}" class="app-brand-link">
|
||||
<span class="app-brand-logo demo">
|
||||
<img src="{{ asset('storage/' . $_admin['image_logo']['small']) }}" alt="{{ $_admin['app_name'] }}" />
|
||||
</span>
|
||||
<span class="app-brand-text demo menu-text fw-bold">{{ $_admin['app_name'] }}</span>
|
||||
</a>
|
||||
@if(isset($menuHorizontal))
|
||||
<a href="javascript:void(0);" class="layout-menu-toggle menu-link text-large ms-auto d-xl-none">
|
||||
<i class="ti ti-x ti-md align-middle"></i>
|
||||
</a>
|
||||
@endif
|
||||
</div>
|
||||
@endif
|
||||
|
||||
<!-- ! Not required for layout-without-menu -->
|
||||
@if(!isset($navbarHideToggle))
|
||||
<div class="layout-menu-toggle navbar-nav align-items-xl-center me-3 me-xl-0{{ isset($menuHorizontal) ? ' d-xl-none ' : '' }} {{ isset($contentNavbar) ?' d-xl-none ' : '' }}">
|
||||
<a class="nav-item nav-link px-0 me-xl-4" href="javascript:void(0)">
|
||||
<i class="ti ti-menu-2 ti-md"></i>
|
||||
</a>
|
||||
</div>
|
||||
@endif
|
||||
|
||||
<div class="navbar-nav-right d-flex align-items-center" id="navbar-collapse">
|
||||
@if(!isset($menuHorizontal))
|
||||
<!-- Search -->
|
||||
@if ($vuexySearch)
|
||||
<div class="navbar-nav align-items-center">
|
||||
<div class="nav-item navbar-search-wrapper mb-0">
|
||||
<a class="nav-item nav-link search-toggler d-flex align-items-center px-0" href="javascript:void(0);">
|
||||
<i class="ti ti-search ti-md me-2 me-lg-4 ti-lg"></i>
|
||||
<span class="d-none d-md-inline-block text-muted fw-normal">Buscar (Ctrl+/)</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
@endif
|
||||
<!-- /Search -->
|
||||
@endif
|
||||
<ul class="navbar-nav flex-row align-items-center ms-auto">
|
||||
@if(isset($menuHorizontal))
|
||||
<!-- Search -->
|
||||
@if ($vuexySearch)
|
||||
<li class="nav-item navbar-search-wrapper">
|
||||
<a class="nav-link btn btn-text-secondary btn-icon rounded-pill search-toggler" href="javascript:void(0);">
|
||||
<i class="ti ti-search ti-md"></i>
|
||||
</a>
|
||||
</li>
|
||||
@endif
|
||||
<!-- /Search -->
|
||||
@endif
|
||||
|
||||
@if($configData['hasCustomizer'] == true)
|
||||
<!-- Style Switcher -->
|
||||
<li class="nav-item dropdown-style-switcher dropdown">
|
||||
<a class="nav-link btn btn-text-secondary btn-icon rounded-pill dropdown-toggle hide-arrow" href="javascript:void(0);" data-bs-toggle="dropdown">
|
||||
<i class='ti ti-md'></i>
|
||||
</a>
|
||||
<ul class="dropdown-menu dropdown-menu-end dropdown-styles">
|
||||
<li>
|
||||
<a class="dropdown-item" href="javascript:void(0);" data-theme="light">
|
||||
<span class="align-middle"><i class='ti ti-sun ti-md me-3'></i>Claro</span>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a class="dropdown-item" href="javascript:void(0);" data-theme="dark">
|
||||
<span class="align-middle"><i class="ti ti-moon-stars ti-md me-3"></i>Obscuro</span>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a class="dropdown-item" href="javascript:void(0);" data-theme="system">
|
||||
<span class="align-middle"><i class="ti ti-device-desktop-analytics ti-md me-3"></i>Sistema</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- / Style Switcher -->
|
||||
@endif
|
||||
|
||||
<!-- Quick links -->
|
||||
@if ($vuexyQuickLinks)
|
||||
<li class="nav-item dropdown-shortcuts navbar-dropdown dropdown">
|
||||
<a class="nav-link btn btn-text-secondary btn-icon rounded-pill btn-icon dropdown-toggle hide-arrow" href="javascript:void(0);" data-bs-toggle="dropdown" data-bs-auto-close="outside" aria-expanded="false">
|
||||
<i class='ti ti-layout-grid-add ti-md'></i>
|
||||
</a>
|
||||
<div class="dropdown-menu dropdown-menu-end p-0">
|
||||
<div class="dropdown-menu-header border-bottom">
|
||||
<div class="dropdown-header d-flex align-items-center py-3">
|
||||
<h6 class="mb-0 me-auto">Atajos</h6>
|
||||
@if($vuexyQuickLinks['current_page_in_list'])
|
||||
<a href="javascript:void(0)" class="btn btn-text-secondary rounded-pill btn-icon dropdown-shortcuts-remove" data-bs-toggle="tooltip" data-bs-placement="top" title="Remover atajo"><i class="ti ti-trash text-heading"></i></a>
|
||||
@else
|
||||
@if($vuexyQuickLinks['totalLinks'] < config('vuexy.custom.maxQuickLinks'))
|
||||
<a href="javascript:void(0)" class="btn btn-text-secondary rounded-pill btn-icon dropdown-shortcuts-add" data-bs-toggle="tooltip" data-bs-placement="top" title="Agregar atajo"><i class="ti ti-plus text-heading"></i></a>
|
||||
@endif
|
||||
@endif
|
||||
</div>
|
||||
</div>
|
||||
<div class="dropdown-shortcuts-list scrollable-container">
|
||||
@foreach ($vuexyQuickLinks['rows'] as $quickLinksRow)
|
||||
<div class="row row-bordered overflow-visible g-0">
|
||||
@foreach ($quickLinksRow as $key => $quickLink)
|
||||
<div class="dropdown-shortcuts-item col @if($quickLink['route'] === Route::currentRouteName()) active @endif">
|
||||
<span class="dropdown-shortcuts-icon rounded-circle mb-3">
|
||||
<i class="ti ti-{{ $quickLink['icon'] }} ti-26px text-heading"></i>
|
||||
</span>
|
||||
<a href="{{ $quickLink['url'] }}" class="stretched-link">{{ $quickLink['title'] }}</a>
|
||||
<small>{{ $quickLink['subtitle'] }}</small>
|
||||
</div>
|
||||
@if ($key == 0 && !isset($quickLinksRow[1]))
|
||||
<div class="dropdown-shortcuts-item col"></div>
|
||||
@endif
|
||||
@endforeach
|
||||
</div>
|
||||
@endforeach
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
@endif
|
||||
<!-- Quick links -->
|
||||
|
||||
<!-- Notification -->
|
||||
{!! $vuexyNotifications !!}
|
||||
<!--/ Notification -->
|
||||
|
||||
<!-- User -->
|
||||
<li class="nav-item navbar-dropdown dropdown-user dropdown">
|
||||
<a class="nav-link dropdown-toggle hide-arrow d-flex align-items-center" href="javascript:void(0);" data-bs-toggle="dropdown">
|
||||
@if (Auth::check())
|
||||
<div class="user-nav me-2 d-none d-sm-block">
|
||||
<span class="user-name d-block text-end">{{ Auth::user()->fullname }}</span>
|
||||
<span class="user-email d-block text-end">{{ Auth::user()->email }}</span>
|
||||
</div>
|
||||
@endif
|
||||
<div class="avatar {{ Auth::check()? 'avatar-online': '' }} ">
|
||||
<img src="{{ Auth::user() ? Auth::user()->profile_photo_url : asset('vendor/vuexy-admin/img/avatar/generic.svg') }}" alt class="h-auto rounded-circle">
|
||||
</div>
|
||||
</a>
|
||||
<ul class="dropdown-menu dropdown-menu-end">
|
||||
@if (Auth::check())
|
||||
<li class="d-block d-sm-none">
|
||||
<a class="dropdown-item" href="javascript:;">
|
||||
<div class="d-flex">
|
||||
<div class="flex-shrink-0 me-3">
|
||||
<div class="avatar avatar-online">
|
||||
<img src="{{ Auth::user()->profile_photo_url }}" alt class="h-auto rounded-circle">
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex-grow-1">
|
||||
<span class="fw-medium d-block">
|
||||
{{ Auth::user()->name }}
|
||||
</span>
|
||||
<small class="text-muted">{{ Auth::user()->email }}</small>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li>
|
||||
<li class="d-block d-sm-none">
|
||||
<div class="dropdown-divider"></div>
|
||||
</li>
|
||||
@endif
|
||||
@if (Auth::check())
|
||||
<li>
|
||||
<a class="dropdown-item" href="{{ route('admin.core.user-profile.index') }}">
|
||||
<i class="ti ti-user-cog me-2 ti-sm"></i>
|
||||
<span class="align-middle">Configuración de cuenta</span>
|
||||
</a>
|
||||
</li>
|
||||
@endif
|
||||
<li>
|
||||
<a class="dropdown-item" href="{{ route('admin.core.about.index') }}">
|
||||
<i class='ti ti-cat me-2'></i>
|
||||
<span class="align-middle">Acerca de</span>
|
||||
</a>
|
||||
</li>
|
||||
@if (Auth::check())
|
||||
<li>
|
||||
<div class="dropdown-divider"></div>
|
||||
</li>
|
||||
<li>
|
||||
<a class="btn btn-sm btn-danger d-flex" href="{{ route('logout') }}" onclick="event.preventDefault(); document.getElementById('logout-form').submit();">
|
||||
<i class='ti ti-logout me-2'></i>
|
||||
<span class="align-middle">Cerrar sesión</span>
|
||||
</a>
|
||||
</li>
|
||||
<form method="POST" id="logout-form" action="{{ route('logout') }}">
|
||||
@csrf
|
||||
</form>
|
||||
@else
|
||||
<li>
|
||||
<a class="dropdown-item" href="{{ route('login') }}">
|
||||
<i class='ti ti-login me-2'></i>
|
||||
<span class="align-middle">Iniciar sesión</span>
|
||||
</a>
|
||||
</li>
|
||||
@endif
|
||||
</ul>
|
||||
</li>
|
||||
<!--/ User -->
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
@if ($vuexySearch)
|
||||
<!-- Search Small Screens -->
|
||||
<div class="navbar-search-wrapper search-input-wrapper {{ isset($menuHorizontal) ? $containerNav : '' }} d-none">
|
||||
<input type="text" class="form-control search-input {{ isset($menuHorizontal) ? '' : $containerNav }} border-0" placeholder="Buscar..." aria-label="Buscar...">
|
||||
<i class="ti ti-x search-toggler cursor-pointer"></i>
|
||||
</div>
|
||||
<!--/ Search Small Screens -->
|
||||
@endif
|
||||
@if(isset($navbarDetached) && $navbarDetached == '')
|
||||
</div>
|
||||
@endif
|
||||
</nav>
|
||||
<!-- / Navbar -->
|
||||
24
resources/views/layouts/vuexy/sections/scripts.blade.php
Normal file
24
resources/views/layouts/vuexy/sections/scripts.blade.php
Normal file
@ -0,0 +1,24 @@
|
||||
<!-- BEGIN: Vendor JS-->
|
||||
@vite([
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/jquery/jquery.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/popper/popper.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/js/bootstrap.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/node-waves/node-waves.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/perfect-scrollbar/perfect-scrollbar.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/hammer/hammer.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/typeahead-js/typeahead.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/js/menu.js',
|
||||
])
|
||||
|
||||
@yield('vendor-script')
|
||||
<!-- END: Page Vendor JS-->
|
||||
|
||||
<!-- BEGIN: Theme JS-->
|
||||
@vite('vendor/koneko/laravel-vuexy-admin/resources/assets/js/main.js')
|
||||
<!-- END: Theme JS-->
|
||||
|
||||
@vite('vendor/koneko/laravel-vuexy-admin/resources/js/app.js')
|
||||
|
||||
<!-- BEGIN: Page JS-->
|
||||
@stack('page-script')
|
||||
<!-- END: Page JS-->
|
||||
@ -0,0 +1,45 @@
|
||||
@php
|
||||
$menuCollapsed = ($configData['menuCollapsed'] === 'layout-menu-collapsed') ? json_encode(true) : false;
|
||||
@endphp
|
||||
|
||||
<!-- Laravel Helper Functions -->
|
||||
@vite('vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/js/helpers.js')
|
||||
|
||||
@if ($configData['hasCustomizer'])
|
||||
<!--! Template customizer & Theme config files -->
|
||||
@vite('vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/js/template-customizer.js')
|
||||
@endif
|
||||
|
||||
<!-- Config File -->
|
||||
@vite('vendor/koneko/laravel-vuexy-admin/resources/assets/js/config.js')
|
||||
|
||||
@if ($configData['hasCustomizer'])
|
||||
<script type="module">
|
||||
window.templateCustomizer = new TemplateCustomizer({
|
||||
cssPath: '',
|
||||
themesPath: '',
|
||||
defaultStyle: "{{ $configData['styleOpt'] }}",
|
||||
defaultShowDropdownOnHover: "{{ $configData['showDropdownOnHover'] }}", // true/false (for horizontal layout only)
|
||||
displayCustomizer: "{{ $configData['displayCustomizer'] }}",
|
||||
lang: '{{ app()->getLocale() }}',
|
||||
pathResolver: function(path) {
|
||||
var resolvedPaths = {
|
||||
// Core stylesheets
|
||||
@foreach (['core'] as $name)
|
||||
'{{ $name }}.scss': '{{ Vite::asset('vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/scss'.$configData["rtlSupport"].'/'.$name.'.scss') }}',
|
||||
'{{ $name }}-dark.scss': '{{ Vite::asset('vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/scss'.$configData["rtlSupport"].'/'.$name.'-dark.scss') }}',
|
||||
@endforeach
|
||||
|
||||
// Themes
|
||||
@foreach (['default', 'bordered', 'semi-dark'] as $name)
|
||||
'theme-{{ $name }}.scss': '{{ Vite::asset('vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/scss'.$configData["rtlSupport"].'/theme-'.$name.'.scss') }}',
|
||||
'theme-{{ $name }}-dark.scss': '{{ Vite::asset('vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/scss'.$configData["rtlSupport"].'/theme-'.$name.'-dark.scss') }}',
|
||||
@endforeach
|
||||
};
|
||||
|
||||
return resolvedPaths[path] || path;
|
||||
},
|
||||
'controls': <?php echo json_encode($configData['customizerControls']); ?>,
|
||||
});
|
||||
</script>
|
||||
@endif
|
||||
30
resources/views/layouts/vuexy/sections/styles.blade.php
Normal file
30
resources/views/layouts/vuexy/sections/styles.blade.php
Normal file
@ -0,0 +1,30 @@
|
||||
<!-- BEGIN: Theme CSS-->
|
||||
<!-- Fonts -->
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
||||
<link href="https://fonts.googleapis.com/css2?family=Public+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;1,300;1,400;1,500;1,600;1,700&display=swap" rel="stylesheet">
|
||||
|
||||
@vite([
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/fonts/tabler-icons.scss',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/fonts/fontawesome.scss',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/node-waves/node-waves.scss',
|
||||
])
|
||||
|
||||
<!-- Core CSS -->
|
||||
@vite([
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/scss'.$configData['rtlSupport'].'/core' .($configData['style'] !== 'light' ? '-' . $configData['style'] : '') .'.scss',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/scss'.$configData['rtlSupport'].'/' .$configData['theme'] .($configData['style'] !== 'light' ? '-' . $configData['style'] : '') .'.scss',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/css/demo.css',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/scss/app.scss',
|
||||
])
|
||||
|
||||
<!-- Vendor Styles -->
|
||||
@vite([
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/perfect-scrollbar/perfect-scrollbar.scss',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/typeahead-js/typeahead.scss',
|
||||
])
|
||||
|
||||
@yield('vendor-style')
|
||||
|
||||
<!-- Page Styles -->
|
||||
@stack('page-style')
|
||||
@ -0,0 +1,70 @@
|
||||
<div>
|
||||
<div class="form-custom-listener" id="application-settings-card">
|
||||
<div class="card">
|
||||
<div class="card-body">
|
||||
<h5 class="card-title">Información de aplicación</h5>
|
||||
<div class="fv-row mb-3">
|
||||
<label for="admin_app_name" class="form-label">
|
||||
Titulo de aplicación <span class="text-xs">(Nombre corto)</span>
|
||||
</label>
|
||||
<input type="text" id="admin_app_name" wire:model="admin_app_name" class="form-control" placeholder="Titulo de aplicación">
|
||||
@error('admin_app_name')
|
||||
<span class="text-danger">{{ $message }}</span>
|
||||
@enderror
|
||||
</div>
|
||||
<div class="fv-row mb-6">
|
||||
<h5>Logotipo tema claro</h5>
|
||||
<div class="fv-row mb-4">
|
||||
<input type="file" wire:model="upload_image_logo" id="upload_image_logo" class="form-control" accept="image/*" />
|
||||
@error('upload_image_logo')
|
||||
<span class="text-danger">{{ $message }}</span>
|
||||
@enderror
|
||||
</div>
|
||||
<div class="mb-8 text-center align-items-center">
|
||||
<div class="justify-content-center align-items-center bg-slate-100 p-4">
|
||||
<img src="{{ $upload_image_logo ? $upload_image_logo->temporaryUrl() : asset('storage/' . $admin_image_logo) }}">
|
||||
</div>
|
||||
</div>
|
||||
<h5>Logotipo tema obscuro</h5>
|
||||
<div class="fv-row mb-4">
|
||||
<input type="file" wire:model="upload_image_logo_dark" id="upload_image_logo_dark" class="form-control" accept="image/*" />
|
||||
@error('upload_image_logo_dark')
|
||||
<span class="text-danger">{{ $message }}</span>
|
||||
@enderror
|
||||
</div>
|
||||
<div class="mb-3 text-center align-items-center">
|
||||
<div class="justify-content-center align-items-center bg-slate-800 p-4">
|
||||
<img src="{{ $upload_image_logo_dark ? $upload_image_logo_dark->temporaryUrl() : asset('storage/' . $admin_image_logo_dark) }}">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
{{-- Botones --}}
|
||||
<div class="row my-4">
|
||||
<div class="col-lg-12 text-end">
|
||||
<button
|
||||
type="button"
|
||||
wire:click="save"
|
||||
class="btn btn-primary btn-save btn-sm mt-2 mr-2 waves-effect waves-light"
|
||||
:disabled="{{ $upload_image_logo === null && $upload_image_logo_dark === null ? 'true' : 'false' }}"
|
||||
data-loading-text="Guardando...">
|
||||
<i class="ti ti-device-floppy mr-2"></i>
|
||||
Guardar cambios
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
wire:click="loadSettings"
|
||||
class="btn btn-secondary btn-cancel btn-sm mt-2 mr-2 waves-effect waves-light"
|
||||
:disabled="{{ $upload_image_logo === null && $upload_image_logo_dark === null ? 'true' : 'false' }}">
|
||||
<i class="ti ti-rotate-2 mr-2"></i>
|
||||
Cancelar
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
{{-- Notifications --}}
|
||||
<div class="notification-container" wire:ignore></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -0,0 +1,105 @@
|
||||
<div>
|
||||
<div class="form-custom-listener" id="general-settings-card">
|
||||
<div class="card">
|
||||
<div class="card-body">
|
||||
<h5 class="card-title">Información de página web</h5>
|
||||
<div class="fv-row mb-3">
|
||||
<label for="admin_title" class="form-label">
|
||||
Titulo del sitio <span class="text-xs">(Nombre completo)</span>
|
||||
</label>
|
||||
<input type="text" id="admin_title" wire:model="admin_title" class="form-control"
|
||||
placeholder="Titulo del sitio">
|
||||
@error('admin_title')
|
||||
<span class="text-danger">{{ $message }}</span>
|
||||
@enderror
|
||||
</div>
|
||||
<div class="fv-row mb-6">
|
||||
<label for="upload_image_favicon" class="form-label">
|
||||
Icono de página <span class="text-xs">(Favicon)</span>
|
||||
</label>
|
||||
<input type="file" wire:model="upload_image_favicon" id="upload_image_favicon" class="form-control"
|
||||
accept="image/*" />
|
||||
@error('upload_image_favicon')
|
||||
<span class="text-danger">{{ $message }}</span>
|
||||
@enderror
|
||||
</div>
|
||||
<div class="grid grid-cols-1 sm:grid-cols-2 gap-6">
|
||||
<div class="text-center flex flex-col items-center">
|
||||
<div class="mb-3 text-center d-flex flex-column align-items-center">
|
||||
<div class="image-wrapper-16x16 d-flex justify-content-center align-items-center">
|
||||
<img src="{{ $upload_image_favicon ? $upload_image_favicon->temporaryUrl() : asset('storage/' . $admin_favicon_16x16) }}">
|
||||
</div>
|
||||
<span class="text-muted mt-1">Navegadores web (16x16)</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="text-center flex flex-col items-center">
|
||||
<div class="mb-3 text-center d-flex flex-column align-items-center">
|
||||
<div class="image-wrapper-76x76 d-flex justify-content-center align-items-center">
|
||||
<img src="{{ $upload_image_favicon ? $upload_image_favicon->temporaryUrl() : asset('storage/' . $admin_favicon_76x76) }}">
|
||||
</div>
|
||||
<span class="text-muted mt-1">iPad sin Retina (76x76)</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="text-center flex flex-col items-center">
|
||||
<div class="mb-3 text-center d-flex flex-column align-items-center">
|
||||
<div class="image-wrapper-120x120 d-flex justify-content-center align-items-center">
|
||||
<img src="{{ $upload_image_favicon ? $upload_image_favicon->temporaryUrl() : asset('storage/' . $admin_favicon_120x120) }}">
|
||||
</div>
|
||||
<span class="text-muted mt-1">iPhone (120x120)</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="text-center flex flex-col items-center">
|
||||
<div class="mb-3 text-center d-flex flex-column align-items-center">
|
||||
<div class="image-wrapper-152x152 d-flex justify-content-center align-items-center">
|
||||
<img src="{{ $upload_image_favicon ? $upload_image_favicon->temporaryUrl() : asset('storage/' . $admin_favicon_152x152) }}">
|
||||
</div>
|
||||
<span class="text-muted mt-1">iPad (152x152)</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="text-center flex flex-col items-center">
|
||||
<div class="mb-3 text-center d-flex flex-column align-items-center">
|
||||
<div class="image-wrapper-180x180 d-flex justify-content-center align-items-center">
|
||||
<img src="{{ $upload_image_favicon ? $upload_image_favicon->temporaryUrl() : asset('storage/' . $admin_favicon_180x180) }}">
|
||||
</div>
|
||||
<span class="text-muted mt-1">iPhone con Retina HD (180x180)</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="text-center flex flex-col items-center">
|
||||
<div class="mb-3 text-center d-flex flex-column align-items-center">
|
||||
<div class="image-wrapper-192x192 d-flex justify-content-center align-items-center">
|
||||
<img src="{{ $upload_image_favicon ? $upload_image_favicon->temporaryUrl() : asset('storage/' . $admin_favicon_192x192) }}">
|
||||
</div>
|
||||
<span class="text-muted mt-1">Android y otros dispositivos móviles (192x192)</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
{{-- Botones --}}
|
||||
<div class="row my-4">
|
||||
<div class="col-lg-12 text-end">
|
||||
<button
|
||||
type="button"
|
||||
wire:click="save"
|
||||
class="btn btn-primary btn-save btn-sm mt-2 mr-2 waves-effect waves-light"
|
||||
{{ !$upload_image_favicon ? 'disabled' : '' }}
|
||||
data-loading-text="Guardando...">
|
||||
<i class="ti ti-device-floppy mr-2"></i>
|
||||
Guardar cambios
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
wire:click="loadSettings"
|
||||
class="btn btn-secondary btn-cancel btn-sm mt-2 mr-2 waves-effect waves-light"
|
||||
{{ !$upload_image_favicon ? 'disabled' : '' }}>
|
||||
<i class="ti ti-rotate-2 mr-2"></i>
|
||||
Cancelar
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
{{-- Notifications --}}
|
||||
<div class="notification-container" wire:ignore></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -0,0 +1,196 @@
|
||||
<div>
|
||||
<div class="form-custom-listener" id="interface-settings-card">
|
||||
<div class="card">
|
||||
<div class="card-body">
|
||||
<h5 class="card-title">Ajustes menú y barra superior</h5>
|
||||
|
||||
{{-- Diseño (Layout) --}}
|
||||
<div class="mb-4">
|
||||
<label for="vuexy_myLayout" class="form-label">Diseño</label>
|
||||
<select id="vuexy_myLayout" class="form-select" wire:model="vuexy_myLayout">
|
||||
<option value="vertical">Vertical</option>
|
||||
<option value="horizontal">Horizontal</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
{{-- Campos exclusivos para diseño Horizontal --}}
|
||||
<div x-show="$wire.vuexy_myLayout === 'horizontal'" x-transition>
|
||||
<div class="mb-4">
|
||||
<label for="vuexy_headerType" class="form-label">Tipo de barra superior</label>
|
||||
<select id="vuexy_headerType" class="form-select" wire:model="vuexy_headerType">
|
||||
<option value="static">Estático</option>
|
||||
<option value="fixed">Fijo</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{-- Campos exclusivos para diseño Vertical --}}
|
||||
<div x-show="$wire.vuexy_myLayout === 'vertical'" x-transition>
|
||||
<div class="mb-4">
|
||||
<label for="vuexy_navbarType" class="form-label">Tipo de barra de navegación</label>
|
||||
<select id="vuexy_navbarType" class="form-select" wire:model="vuexy_navbarType">
|
||||
<option value="sticky">Fija</option>
|
||||
<option value="static">Estática</option>
|
||||
<option value="hidden">Oculta</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div x-show="$wire.vuexy_hasCustomizer" x-transition>
|
||||
<div x-show="$wire.vuexy_myLayout === 'horizontal'" x-transition>
|
||||
<div class="mb-3">
|
||||
<x-vuexy-admin::form.checkbox
|
||||
wire:model='vuexy_showDropdownOnHover'
|
||||
parent_class='form-switch'>
|
||||
Mostrar desplegable al pasar el mouse
|
||||
</x-vuexy-admin::form.checkbox>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{-- Campos exclusivos para diseño Vertical --}}
|
||||
<div x-show="$wire.vuexy_myLayout === 'vertical'" x-transition>
|
||||
<div class="mb-3">
|
||||
<x-vuexy-admin::form.checkbox
|
||||
wire:model='vuexy_menuFixed'
|
||||
parent_class='form-switch'>
|
||||
Menú fijo
|
||||
</x-vuexy-admin::form.checkbox>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<x-vuexy-admin::form.checkbox
|
||||
wire:model='vuexy_menuCollapsed'
|
||||
parent_class='form-switch'>
|
||||
Menú colapsado
|
||||
</x-vuexy-admin::form.checkbox>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<hr>
|
||||
|
||||
{{-- Habilitar UI Customizer --}}
|
||||
<div class="mb-3">
|
||||
<x-vuexy-admin::form.checkbox
|
||||
wire:model='vuexy_hasCustomizer'
|
||||
parent_class='form-switch'>
|
||||
Habilitar personalizador de plantilla
|
||||
</x-vuexy-admin::form.checkbox>
|
||||
</div>
|
||||
|
||||
<div x-show="$wire.vuexy_hasCustomizer" x-transition>
|
||||
<div class="mb-3">
|
||||
<x-vuexy-admin::form.checkbox
|
||||
wire:model='vuexy_displayCustomizer'
|
||||
parent_class='form-switch'>
|
||||
Mostrar personalizador de plantilla
|
||||
</x-vuexy-admin::form.checkbox>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{-- Máximo de Enlaces Rápidos --}}
|
||||
<div x-show="$wire.vuexy_myLayout === 'horizontal' || $wire.vuexy_navbarType !== 'hidden'" x-transition>
|
||||
<hr>
|
||||
<div class="mb-4">
|
||||
<label for="vuexy_maxQuickLinks" class="form-label">Máximo de enlaces rápidos</label>
|
||||
<input type="number" id="vuexy_maxQuickLinks" class="form-control" wire:model="vuexy_maxQuickLinks" min="2" max="20">
|
||||
<p class="text-muted">Selecciona un valor entre 2 y 20.</p>
|
||||
@error('vuexy_maxQuickLinks') <span class="text-danger">{{ $message }}</span> @enderror
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<hr>
|
||||
|
||||
<h5 class="card-title mt-6">Ajustes de tema</h5>
|
||||
|
||||
{{-- Tema --}}
|
||||
<div class="mb-4">
|
||||
<label for="vuexy_myTheme" class="form-label">Tema</label>
|
||||
<select id="vuexy_myTheme" class="form-select" wire:model="vuexy_myTheme">
|
||||
<option value="theme-default">Tema predeterminado</option>
|
||||
<option value="theme-bordered">Tema bordeado</option>
|
||||
<option value="theme-semi-dark">Tema semi-oscuro</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
{{-- Estilo --}}
|
||||
<div class="mb-4">
|
||||
<label for="vuexy_myStyle" class="form-label">Estilo</label>
|
||||
<select id="vuexy_myStyle" class="form-select" wire:model="vuexy_myStyle">
|
||||
<option value="light">Claro</option>
|
||||
<option value="dark">Oscuro</option>
|
||||
<option value="system">Modo del sistema</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<hr>
|
||||
|
||||
<h5 class="card-title mt-6">Ajustes de diseño</h5>
|
||||
|
||||
{{-- Vista de Autenticación --}}
|
||||
<div class="mb-4">
|
||||
<label for="vuexy_authViewMode" class="form-label">Modo de vista de autenticación</label>
|
||||
<select id="vuexy_authViewMode" class="form-select" wire:model="vuexy_authViewMode">
|
||||
<option value="cover">Pantalla completa</option>
|
||||
<option value="basic">Básico</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
{{-- Diseño del Contenido --}}
|
||||
<div class="mb-4">
|
||||
<label for="vuexy_contentLayout" class="form-label">Diseño del contenido</label>
|
||||
<select id="vuexy_contentLayout" class="form-select" wire:model="vuexy_contentLayout">
|
||||
<option value="compact">Compacto</option>
|
||||
<option value="wide">Ancho</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
{{-- Pie de Página Fijo --}}
|
||||
<div class="mb-3">
|
||||
<x-vuexy-admin::form.checkbox
|
||||
wire:model='vuexy_footerFixed'
|
||||
parent_class='form-switch'>
|
||||
Pie de página fijo
|
||||
</x-vuexy-admin::form.checkbox>
|
||||
</div>
|
||||
|
||||
{{-- Botones --}}
|
||||
<div class="row mt-6">
|
||||
<div class="col-lg-12 text-end">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
{{-- Botones --}}
|
||||
<div class="row my-4">
|
||||
<div class="col-lg-12 text-end">
|
||||
<button
|
||||
type="button"
|
||||
wire:click="save"
|
||||
disabled
|
||||
class="btn btn-primary btn-save btn-sm mt-2 mr-2 waves-effect waves-light">
|
||||
<i class="ti ti-device-floppy me-1"></i>
|
||||
Guardar cambios
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
wire:click="loadSettings"
|
||||
disabled
|
||||
class="btn btn-secondary btn-cancel btn-sm mt-2 mr-2 waves-effect waves-light">
|
||||
<i class="ti ti-rotate-2 me-1"></i>
|
||||
Cancelar
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
wire:click="clearCustomConfig"
|
||||
class="btn btn-success btn-reset btn-sm mt-2 mr-2 waves-effect waves-light">
|
||||
<i class="ti ti-adjustments-cog me-1"></i>
|
||||
Restaurar valores predeterminados
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
{{-- Notifications --}}
|
||||
<div class="notification-container" wire:ignore></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -0,0 +1,67 @@
|
||||
<div>
|
||||
<form id="mail-sender-response-settings-card">
|
||||
<div class="card">
|
||||
<h5 class="card-header">Correo electrónicos de salida</h5>
|
||||
<div class="card-body">
|
||||
<div class="mb-3 fv-row">
|
||||
<label for="from_address" class="form-label">Correo electrónico</label>
|
||||
<input type="text" name="from_address" id="from_address" wire:model='from_address' class="form-control" placeholder="Correo electrónico">
|
||||
@error('from_address') <span class="text-danger">{{ $message }}</span> @enderror
|
||||
</div>
|
||||
<div class="mb-3 fv-row">
|
||||
<label for="from_name" class="form-label">Nombre</label>
|
||||
<input type="text" name="from_name" id="from_name" wire:model='from_name' class="form-control" placeholder="Nombre">
|
||||
@error('from_name') <span class="text-danger">{{ $message }}</span> @enderror
|
||||
</div>
|
||||
<h5 class="mt-6">Correo electrónico de respuesta</h5>
|
||||
<div class="mb-3 fv-row">
|
||||
<label for="reply_to_method" class="form-label">Correo electrónico de respuesta</label>
|
||||
<x-vuexy-admin::form.select
|
||||
wire:model='reply_to_method'
|
||||
:options="$reply_email_options"
|
||||
placeholder="Selecciona el correo electrónico de respuesta" />
|
||||
@error('reply_to_method') <span class="text-danger">{{ $message }}</span> @enderror
|
||||
</div>
|
||||
<div class="email-custom-div">
|
||||
<div class="mb-3 fv-row">
|
||||
<label for="reply_to_email" class="form-label">Correo electrónico</label>
|
||||
<input type="text" name="reply_to_email" id="reply_to_email" wire:model='reply_to_email' class="form-control" placeholder="Correo electrónico">
|
||||
@error('reply_to_email') <span class="text-danger">{{ $message }}</span> @enderror
|
||||
</div>
|
||||
<div class="fv-row">
|
||||
<label for="reply_to_name" class="form-label">Nombre</label>
|
||||
<input type="text" name="reply_to_name" id="reply_to_name" wire:model='reply_to_name' class="form-control" placeholder="Nombre">
|
||||
@error('reply_to_name') <span class="text-danger">{{ $message }}</span> @enderror
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
{{-- Botones --}}
|
||||
<div class="row my-4">
|
||||
<div class="col-lg-12 text-end">
|
||||
<button
|
||||
type="submit"
|
||||
id="save_sender_response_button"
|
||||
class="btn btn-primary btn-sm mt-2 mr-2 waves-effect waves-light"
|
||||
disabled
|
||||
data-loading-text="Guardando...">
|
||||
<i class="ti ti-device-floppy mr-2"></i>
|
||||
Guardar cambios
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
id="cancel_sender_response_button"
|
||||
class="btn btn-secondary btn-sm mt-2 mr-2 waves-effect waves-light"
|
||||
wire:click="loadSettings"
|
||||
disabled>
|
||||
<i class="ti ti-rotate-2 mr-2"></i>
|
||||
Cancelar
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
{{-- Notifications --}}
|
||||
<div class="notification-container" wire:ignore></div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
@ -0,0 +1,86 @@
|
||||
<div x-data="{
|
||||
changeSmtpSettings: @entangle('change_smtp_settings'),
|
||||
saveButtonDisabled: @entangle('save_button_disabled'),
|
||||
}">
|
||||
<form id="mail-smtp-settings-card">
|
||||
<div class="card mb-6">
|
||||
<h5 class="card-header">Servidor saliente de correo electrónico</h5>
|
||||
<div class="card-body">
|
||||
<div class="mb-3">
|
||||
<x-vuexy-admin::form.checkbox
|
||||
wire:model='change_smtp_settings'
|
||||
parent_class='form-switch'>
|
||||
Cambiar configuración
|
||||
</x-form.checkbox>
|
||||
</div>
|
||||
<div class="mb-3 fv-row">
|
||||
<label for="host" class="form-label">Servidor de correo saliente (SMTP)</label>
|
||||
<input type="text" name="host" id="host" wire:model='host' class="form-control" placeholder="Servidor de salida" :disabled="!changeSmtpSettings">
|
||||
@error('host') <span class="text-danger">{{ $message }}</span> @enderror
|
||||
</div>
|
||||
<div class="mb-3 fv-row">
|
||||
<label for="port" class="form-label">Puerto SMTP</label>
|
||||
<input type="number" name="port" id="port" wire:model='port' class="form-control" placeholder="Puerto SMTP" :disabled="!changeSmtpSettings">
|
||||
@error('port') <span class="text-danger">{{ $message }}</span> @enderror
|
||||
</div>
|
||||
<div class="mb-3 fv-row">
|
||||
<label for="encryption" class="form-label">Encriptación</label>
|
||||
<x-vuexy-admin::form.select
|
||||
wire:model='encryption'
|
||||
:options="$encryption_options"
|
||||
:disabled="!$change_smtp_settings"
|
||||
placeholder="Selecciona el método de encriptación" />
|
||||
@error('encryption') <span class="text-danger">{{ $message }}</span> @enderror
|
||||
</div>
|
||||
|
||||
<div class="mb-3 fv-row">
|
||||
<label for="username" class="form-label">Usuario</label>
|
||||
<input type="text" name="username" id="username" wire:model='username' class="form-control" placeholder="Usuario" autocomplete="username" :disabled="!changeSmtpSettings">
|
||||
@error('username') <span class="text-danger">{{ $message }}</span> @enderror
|
||||
</div>
|
||||
<div class="fv-row">
|
||||
<label for="password" class="form-label">Contraseña</label>
|
||||
<input type="password" name="password" id="password" wire:model='password' class="form-control" placeholder="Contraseña" autocomplete="current-password" :disabled="!changeSmtpSettings">
|
||||
@error('password') <span class="text-danger">{{ $message }}</span> @enderror
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
{{-- Botones --}}
|
||||
<div class="row my-4">
|
||||
<div class="col-lg-12 text-end">
|
||||
<button
|
||||
type="button"
|
||||
id="test_smtp_connection_button"
|
||||
class="btn btn-success btn-sm mt-2 mr-2 waves-effect waves-light"
|
||||
:disabled="!changeSmtpSettings"
|
||||
data-loading-text="Realizando prueba...">
|
||||
<i class="ti ti-flask mr-2"></i>
|
||||
Realizar una prueba
|
||||
</button>
|
||||
<button
|
||||
type="submit"
|
||||
id="save_smtp_connection_button"
|
||||
class="btn btn-primary btn-sm mt-2 mr-2 waves-effect waves-light"
|
||||
:disabled="saveButtonDisabled"
|
||||
wire:click="save"
|
||||
data-loading-text="Guardando...">
|
||||
<i class="ti ti-device-floppy mr-2"></i>
|
||||
Guardar cambios
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
id="cancel_smtp_connection_button"
|
||||
class="btn btn-secondary btn-sm mt-2 mr-2 waves-effect waves-light"
|
||||
wire:click="loadSettings"
|
||||
:disabled="!changeSmtpSettings">
|
||||
<i class="ti ti-rotate-2 mr-2"></i>
|
||||
Cancelar
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
{{-- Notifications --}}
|
||||
<div class="notification-container" wire:ignore></div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
204
resources/views/livewire/cache/cache-functions.blade.php
vendored
Normal file
204
resources/views/livewire/cache/cache-functions.blade.php
vendored
Normal file
@ -0,0 +1,204 @@
|
||||
<div>
|
||||
<div id="cache-functions-card">
|
||||
<div class="card">
|
||||
<div class="card-body">
|
||||
<h5 class="card-title">Resumen de Caché y Funcionalidades</h5>
|
||||
<div class="table-responsive">
|
||||
<table class="table table-bordered">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Tipo</th>
|
||||
<th>Estado</th>
|
||||
<th>Detalles</th>
|
||||
<th>Acción</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{{-- Caché General --}}
|
||||
<tr>
|
||||
<td><strong>Caché general</strong></td>
|
||||
<td class="text-center">
|
||||
<span class="{{ is_numeric($cacheCounts['general']) && $cacheCounts['general'] > 0 ? 'text-success' : 'text-danger' }}">
|
||||
{{ is_numeric($cacheCounts['general']) ? $cacheCounts['general'] : 'Error' }}
|
||||
</span>
|
||||
</td>
|
||||
<td>Elementos almacenados</td>
|
||||
<td>
|
||||
<button
|
||||
class="btn btn-primary btn-sm my-2 mr-2"
|
||||
wire:click="clearLaravelCache"
|
||||
{{ !is_numeric($cacheCounts['general']) || !$cacheCounts['general'] ? 'disabled' : '' }}
|
||||
data-loading-text="Eliminando caché...">
|
||||
Elimina caché de aplicación
|
||||
</button>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
{{-- Configuración --}}
|
||||
<tr>
|
||||
<td><strong>Configuración</strong></td>
|
||||
<td class="text-center">
|
||||
<span class="{{ $cacheCounts['config'] ? 'text-success' : 'text-danger' }}">
|
||||
{{ $cacheCounts['config'] ? 'Habilitada' : 'No habilitada' }}
|
||||
</span>
|
||||
</td>
|
||||
<td>{{ $cacheCounts['config'] ? 'Caché de configuración activa' : 'No se encontró caché de configuración' }}</td>
|
||||
<td>
|
||||
<button
|
||||
class="btn btn-secondary btn-sm my-2 mr-2"
|
||||
wire:click="clearConfigCache"
|
||||
{{ !$cacheCounts['config'] ? 'disabled' : '' }}
|
||||
data-loading-text="Eliminando caché...">
|
||||
Eliminar caché de configuración
|
||||
</button>
|
||||
<button
|
||||
class="btn btn-success btn-config-cache btn-sm my-2 mr-2"
|
||||
data-loading-text="Generando caché...">
|
||||
Generar caché de configuración
|
||||
</button>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
{{-- Rutas --}}
|
||||
<tr>
|
||||
<td><strong>Rutas</strong></td>
|
||||
<td class="text-center">
|
||||
<span class="{{ $cacheCounts['routes'] ? 'text-success' : 'text-danger' }}">
|
||||
{{ $cacheCounts['routes'] ? 'Habilitada' : 'No habilitada' }}
|
||||
</span>
|
||||
</td>
|
||||
<td>{{ $cacheCounts['routes'] ? 'Caché de rutas activa' : 'No se encontró caché de rutas' }}</td>
|
||||
<td>
|
||||
<button
|
||||
class="btn btn-secondary btn-sm my-2 mr-2"
|
||||
wire:click="clearRouteCache"
|
||||
{{ !$cacheCounts['routes'] ? 'disabled' : '' }}
|
||||
data-loading-text="Eliminando caché...">
|
||||
Eliminar caché de rutas
|
||||
</button>
|
||||
<button
|
||||
class="btn btn-success btn-cache-routes btn-sm my-2 mr-2"
|
||||
data-loading-text="Generando caché...">
|
||||
Generar caché de rutas
|
||||
</button>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
{{-- Vistas --}}
|
||||
<tr>
|
||||
<td><strong>Vistas</strong></td>
|
||||
<td class="text-center">
|
||||
<span class="{{ $cacheCounts['views'] > 0 ? 'text-success' : 'text-danger' }}">
|
||||
{{ $cacheCounts['views'] }}
|
||||
</span>
|
||||
</td>
|
||||
<td>Vistas compiladas en el sistema</td>
|
||||
<td>
|
||||
<button
|
||||
class="btn btn-secondary btn-sm my-2 mr-2"
|
||||
wire:click="clearViewCache"
|
||||
{{ !$cacheCounts['views'] ? 'disabled' : '' }}
|
||||
data-loading-text="Eliminando caché...">
|
||||
Eliminar caché de vistas
|
||||
</button>
|
||||
<button
|
||||
class="btn btn-success btn-sm my-2 mr-2"
|
||||
wire:click="cacheViews"
|
||||
data-loading-text="Generando caché...">
|
||||
Generar caché de vistas
|
||||
</button>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
{{-- Eventos --}}
|
||||
<tr>
|
||||
<td><strong>Eventos</strong></td>
|
||||
<td class="text-center">
|
||||
<span class="{{ $cacheCounts['events'] > 0 ? 'text-success' : 'text-danger' }}">
|
||||
{{ $cacheCounts['events'] ? 'Habilitada' : 'No habilitada' }}
|
||||
</span>
|
||||
</td>
|
||||
|
||||
<td>{{ $cacheCounts['events'] ? 'Caché de eventos activa' : 'No se encontró caché de eventos' }}</td>
|
||||
<td>
|
||||
<button
|
||||
class="btn btn-secondary btn-sm my-2 mr-2"
|
||||
wire:click="clearEventCache"
|
||||
{{ !$cacheCounts['events'] ? 'disabled' : '' }}
|
||||
data-loading-text="Eliminando caché...">
|
||||
Eliminar caché de eventos
|
||||
</button>
|
||||
<button class="btn btn-success btn-sm my-2 mr-2"
|
||||
wire:click="cacheEvents"
|
||||
data-loading-text="Generando caché...">
|
||||
Generar caché de eventos
|
||||
</button>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
{{-- Optimización --}}
|
||||
<tr>
|
||||
<td><strong>Optimización</strong></td>
|
||||
<td class="text-center">N/A</td>
|
||||
<td>Eliminación de cacde de archivos optimizados, eventos, compilados, configuración, rutas y vistas.</td>
|
||||
<td>
|
||||
<button
|
||||
class="btn btn-secondary btn-sm my-2 mr-2"
|
||||
wire:click="optimizeClear"
|
||||
data-loading-text="Eliminando caché...">
|
||||
Elimina archivos optimizados
|
||||
</button>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
{{-- Resets de Autenticación --}}
|
||||
<tr>
|
||||
<td><strong>Roles y permisos</strong></td>
|
||||
<td class="text-center">N/A</td>
|
||||
<td>Gestión de roles y permisos (Spatie Permission)</td>
|
||||
<td>
|
||||
<button
|
||||
class="btn btn-secondary btn-sm my-2 mr-2"
|
||||
wire:click="resetPermissionCache"
|
||||
data-loading-text="Eliminando caché...">
|
||||
Eliminar caché de permisos
|
||||
</button>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
{{-- Tokens de restablecimiento --}}
|
||||
<tr>
|
||||
<td><strong>Tokens de restablecimiento</strong></td>
|
||||
<td class="text-center">N/A</td>
|
||||
<td>Eliminación de tokens de restablecimiento</td>
|
||||
<td>
|
||||
<button
|
||||
class="btn btn-secondary btn-sm my-2 mr-2"
|
||||
wire:click="clearResetTokens"
|
||||
data-loading-text="Eliminando caché...">
|
||||
Eliminar tokens de restablecimiento
|
||||
</button>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
{{-- Botones --}}
|
||||
<div class="row my-4">
|
||||
<div class="col-lg-12 text-end">
|
||||
<button
|
||||
class="btn btn-secondary btn-sm mt-2 mr-2 waves-effect waves-light"
|
||||
wire:click="reloadCacheStats"
|
||||
data-loading-text="Actualizando...">
|
||||
Actualizar
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
{{-- Notifications --}}
|
||||
<div class="notification-container" wire:ignore></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
105
resources/views/livewire/cache/cache-stats.blade.php
vendored
Normal file
105
resources/views/livewire/cache/cache-stats.blade.php
vendored
Normal file
@ -0,0 +1,105 @@
|
||||
<div>
|
||||
<div class="form-custom-listener" id="cache-stats-card">
|
||||
{{-- Form Card --}}
|
||||
<div class="card">
|
||||
<div class="card-body">
|
||||
<h5 class="card-title">Gestión de Caché</h5>
|
||||
<div class="table-responsive">
|
||||
<table class="table table-bordered table-sm">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td><strong>Driver</strong></td>
|
||||
<td>{{ $cacheConfig['cache']['default'] }}</td>
|
||||
</tr>
|
||||
@if(in_array($cacheConfig['cache']['default'], ['database', 'memcached', 'redis']))
|
||||
<tr>
|
||||
<td><strong>Versión</strong></td>
|
||||
<td>
|
||||
@if($cacheConfig['cache']['default'] == 'database')
|
||||
{{ $cacheConfig['driver'][$cacheConfig['database']['default']]['version'] }}
|
||||
@else
|
||||
{{ $cacheConfig['driver'][$cacheConfig['cache']['default']]['version'] }}
|
||||
@endif
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><strong>Servidor</strong></td>
|
||||
<td>{{ $cacheConfig['cache']['host'] }}</td>
|
||||
</tr>
|
||||
@endif
|
||||
|
||||
@if(in_array($cacheConfig['cache']['default'], ['database', 'redis']))
|
||||
<tr>
|
||||
<td><strong>Base de datos</strong></td>
|
||||
<td>
|
||||
@if ($cacheConfig['cache']['default'] == 'database')
|
||||
{{ $cacheConfig['database']['connections'][$cacheConfig['database']['default']]['database'] }}
|
||||
@else
|
||||
{{ $cacheConfig['database']['redis']['cache']['database'] }}
|
||||
@endif
|
||||
</td>
|
||||
</tr>
|
||||
@endif
|
||||
|
||||
@if(in_array($cacheConfig['cache']['default'], ['database', 'memcached', 'redis']))
|
||||
<tr>
|
||||
<td><strong>Prefijo</strong></td>
|
||||
<td>{{ $cacheConfig['cache']['prefix'] }}</td>
|
||||
</tr>
|
||||
@endif
|
||||
|
||||
@if($cacheConfig['cache']['default'] == 'file')
|
||||
<tr>
|
||||
<td><strong>Ubicación de la Caché</strong></td>
|
||||
<td>{{ $cacheConfig['cache']['stores']['file']['path'] }}</td>
|
||||
</tr>
|
||||
@endif
|
||||
|
||||
@if($cacheConfig['cache']['default'] == 'database')
|
||||
<tr>
|
||||
<td><strong>Tabla de Caché</strong></td>
|
||||
<td>{{ $cacheConfig['cache']['stores']['database']['table'] }}</td>
|
||||
</tr>
|
||||
@endif
|
||||
|
||||
<tr>
|
||||
<td><strong>Cantidad de Elementos</strong></td>
|
||||
<td>{{ $cacheStats['item_count'] }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><strong>Espacio Utilizado</strong></td>
|
||||
<td>{{ $cacheStats['memory_usage'] }}</td>
|
||||
</tr>
|
||||
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
{{-- Botones --}}
|
||||
<div class="row my-4">
|
||||
<div class="col-lg-12 text-end">
|
||||
@if($cacheConfig['cache']['default'] != 'memcached')
|
||||
<button
|
||||
type="button"
|
||||
wire:click="clearCache"
|
||||
class="btn btn-danger btn-clear-cache btn-sm mt-2 mr-2 waves-effect waves-light"
|
||||
data-loading-text="Eliminando Caché...">
|
||||
Eliminar Caché
|
||||
</button>
|
||||
@endif
|
||||
<button
|
||||
type="button"
|
||||
wire:click="reloadCacheStats"
|
||||
class="btn btn-secondary btn-reload-cache-stats btn-sm mt-2 mr-2 waves-effect waves-light"
|
||||
data-loading-text="Actualizando...">
|
||||
Actualizar
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
{{-- Notifications --}}
|
||||
<div class="notification-container" wire:ignore></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
121
resources/views/livewire/cache/memcached-stats.blade.php
vendored
Normal file
121
resources/views/livewire/cache/memcached-stats.blade.php
vendored
Normal file
@ -0,0 +1,121 @@
|
||||
<div>
|
||||
<div class="form-custom-listener" id="memcached-stats-card">
|
||||
<div class="card">
|
||||
<div class="card-body">
|
||||
<h5 class="card-title">Estadísticas de Memcached</h5>
|
||||
@foreach ($memcachedStats as $stat)
|
||||
<table class="table table-bordered table-sm mb-2">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td><strong>Versión de Memcached</strong></td>
|
||||
<td>{{ $stat['version'] }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><strong>Libevent</strong></td>
|
||||
<td>{{ $stat['libevent'] }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><strong>Servidor</strong></td>
|
||||
<td>{{ $stat['server'] }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><strong>Puerto TCP</strong></td>
|
||||
<td>{{ $stat['tcp_port'] }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><strong>Conexiones máximas</strong></td>
|
||||
<td>{{ $stat['max_connections'] }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><strong>Conexiones totales</strong></td>
|
||||
<td>{{ $stat['total_connections'] }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><strong>Conexiones rechazadas</strong></td>
|
||||
<td>{{ $stat['rejected_connections'] }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><strong>Memoria máxima</strong></td>
|
||||
<td>{{ number_format($stat['limit_maxbytes'] / 1024 / 1024, 2) }} MB</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><strong>Comandos GET ejecutados</strong></td>
|
||||
<td>{{ $stat['cmd_get'] }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><strong>Comandos SET ejecutados</strong></td>
|
||||
<td>{{ $stat['cmd_set'] }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><strong>GET exitosos</strong></td>
|
||||
<td>{{ $stat['get_hits'] }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><strong>GET fallidos</strong></td>
|
||||
<td>{{ $stat['get_misses'] }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><strong>Claves expulsadas</strong></td>
|
||||
<td>{{ $stat['evictions'] }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><strong>Megabytes leídos</strong></td>
|
||||
<td>{{ number_format($stat['bytes_read'] / 1024 / 1024, 2) }} MB</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><strong>Megabytes escritos</strong></td>
|
||||
<td>{{ number_format($stat['bytes_written'] / 1024 / 1024, 2) }} MB</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><strong>Total de objetos</strong></td>
|
||||
<td>{{ $stat['total_items'] }}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<table class="table table-bordered table-sm">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td><strong>Claves almacenadas</strong></td>
|
||||
<td>{{ $stat['curr_items'] }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><strong>Memoria usada</strong></td>
|
||||
<td>
|
||||
<span class="{{ ($stat['bytes'] / $stat['limit_maxbytes']) > 0.8 ? 'text-danger' : 'text-success' }}">
|
||||
{{ number_format($stat['bytes'] / 1024 / 1024, 2) }} MB
|
||||
</span>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><strong>Tiempo de actividad</strong></td>
|
||||
<td>{{ gmdate('H\h i\m s\s', $stat['uptime']) }}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
@endforeach
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
{{-- Botones --}}
|
||||
<div class="row my-4">
|
||||
<div class="col-lg-12 text-end">
|
||||
<button
|
||||
class="btn btn-danger btn-clear-cache btn-sm mt-2 mr-2 waves-effect waves-light"
|
||||
wire:click="clearCache"
|
||||
data-loading-text="Eliminando Caché de Memcached..."
|
||||
{{ $stat['curr_items']? '': 'disabled' }}>
|
||||
Eliminar Caché de Memcached
|
||||
</button>
|
||||
<button
|
||||
class="btn btn-secondary btn-reload-cache-stats btn-sm mt-2 mr-2 waves-effect waves-light"
|
||||
wire:click="reloadCacheStats"
|
||||
data-loading-text="Actualizando...">
|
||||
Actualizar
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
{{-- Notifications --}}
|
||||
<div class="notification-container" wire:ignore></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
144
resources/views/livewire/cache/redis-stats.blade.php
vendored
Normal file
144
resources/views/livewire/cache/redis-stats.blade.php
vendored
Normal file
@ -0,0 +1,144 @@
|
||||
<div>
|
||||
<div class="form-custom-listener" id="redis-stats-card">
|
||||
<div class="card">
|
||||
<div class="card-body">
|
||||
<h5 class="card-title">Estadísticas de Redis</h5>
|
||||
<div class="">
|
||||
<div class="table-responsive">
|
||||
<table class="table table-bordered table-sm mb-2">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td><strong>Versión de Redis</strong></td>
|
||||
<td>{{ $redisStats['redis_version'] }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><strong>Servidor</strong></td>
|
||||
<td>{{ $redisStats['server'] }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><strong>Puerto TCP</strong></td>
|
||||
<td>{{ $redisStats['tcp_port'] }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><strong>Clientes conectados</strong></td>
|
||||
<td>{{ $redisStats['connected_clients'] }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><strong>Clientes bloqueados</strong></td>
|
||||
<td>{{ $redisStats['blocked_clients'] }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><strong>Pico máximo de memoria utilizada</strong></td>
|
||||
<td>
|
||||
@if ($redisStats['maxmemory'] > 0)
|
||||
{{-- Usar maxmemory si está configurado --}}
|
||||
<span class="{{ ($redisStats['used_memory_peak'] / $redisStats['maxmemory']) > 0.8 ? 'text-warning' : 'text-success' }}">
|
||||
{{ $redisStats['used_memory_peak_human'] }}
|
||||
</span>
|
||||
@else
|
||||
{{-- Usar total_system_memory si maxmemory no está configurado --}}
|
||||
<span class="{{ ($redisStats['used_memory_peak'] / $redisStats['total_system_memory']) > 0.8 ? 'text-warning' : 'text-success' }}">
|
||||
{{ $redisStats['used_memory_peak_human'] }}
|
||||
</span>
|
||||
@endif
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><strong>Memoria total del sistema</strong></td>
|
||||
<td>{{ $redisStats['total_system_memory_human'] }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><strong>Límite máximo de memoria</strong></td>
|
||||
<td>
|
||||
@if ($redisStats['maxmemory'] > 0)
|
||||
{{ $redisStats['maxmemory_human'] }}
|
||||
@else
|
||||
<span class="text-info">Sin límite configurado</span>
|
||||
@endif
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><strong>Total de conexiones recibidas</strong></td>
|
||||
<td>{{ $redisStats['total_connections_received'] }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><strong>Total de comandos procesados</strong></td>
|
||||
<td>{{ $redisStats['total_commands_processed'] }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><strong>Política de uso de memoria</strong></td>
|
||||
<td>{{ $redisStats['maxmemory_policy'] }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><strong>Rol del servidor</strong></td>
|
||||
<td>{{ $redisStats['role'] }}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<table class="table table-bordered table-sm">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td><strong>Claves almacenadas</strong></td>
|
||||
<td>{{ $redisStats['keys'] }}</td>
|
||||
</tr>
|
||||
@isset ($redisStats['databases']['default']['database'])
|
||||
<tr>
|
||||
<td><strong>Base de datos general de Redis</strong></td>
|
||||
<td>{{ $redisStats['databases']['default']['database'] }}</td>
|
||||
</tr>
|
||||
@endisset
|
||||
@isset ($redisStats['databases']['cache']['database'])
|
||||
<tr>
|
||||
<td><strong>Base de datos de caché</strong></td>
|
||||
<td>{{ $redisStats['databases']['cache']['database'] }}</td>
|
||||
</tr>
|
||||
@endisset
|
||||
@isset ($redisStats['databases']['sessions']['database'])
|
||||
<tr>
|
||||
<td><strong>Base de datos de sesiones</strong></td>
|
||||
<td>{{ $redisStats['databases']['sessions']['database'] }}</td>
|
||||
</tr>
|
||||
@endisset
|
||||
<tr>
|
||||
<td><strong>Memoria usada</strong></td>
|
||||
<td>
|
||||
@if ($redisStats['maxmemory'] > 0)
|
||||
{{-- Usar maxmemory si está configurado --}}
|
||||
<span class="{{ ($redisStats['used_memory'] / $redisStats['maxmemory']) > 0.8 ? 'text-danger' : 'text-success' }}">
|
||||
{{ $redisStats['used_memory_human'] }}
|
||||
</span>
|
||||
@else
|
||||
{{-- Usar total_system_memory si maxmemory no está configurado --}}
|
||||
<span class="{{ ($redisStats['used_memory'] / $redisStats['total_system_memory']) > 0.8 ? 'text-danger' : 'text-success' }}">
|
||||
{{ $redisStats['used_memory_human'] }}
|
||||
</span>
|
||||
@endif
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><strong>Tiempo de actividad</strong></td>
|
||||
<td>{{ $redisStats['uptime'] }}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
{{-- Botones --}}
|
||||
<div class="row my-4">
|
||||
<div class="col-lg-12 text-end">
|
||||
<button
|
||||
class="btn btn-secondary btn-clear-cache btn-sm mt-2 mr-2 waves-effect waves-light"
|
||||
wire:click="reloadCacheStats"
|
||||
data-loading-text="Actualizando...">
|
||||
Actualizar
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
{{-- Notifications --}}
|
||||
<div class="notification-container" wire:ignore></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
121
resources/views/livewire/cache/session-stats.blade.php
vendored
Normal file
121
resources/views/livewire/cache/session-stats.blade.php
vendored
Normal file
@ -0,0 +1,121 @@
|
||||
<div>
|
||||
<div class="form-custom-listener" id="session-stats-card">
|
||||
<div class="card">
|
||||
<div class="card-body">
|
||||
<h5 class="card-title">Configuraciones de Sesiones</h5>
|
||||
<div class="">
|
||||
<div class="table-responsive">
|
||||
<table class="table table-bordered table-sm">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td><strong>Driver</strong></td>
|
||||
<td>{{ $cacheConfig['session']['driver'] }}</td>
|
||||
</tr>
|
||||
@if(in_array($cacheConfig['session']['driver'], ['database', 'memcached', 'redis']))
|
||||
<tr>
|
||||
<td><strong>Versión</strong></td>
|
||||
<td>
|
||||
@if($cacheConfig['session']['driver'] == 'database')
|
||||
{{ $cacheConfig['driver'][$cacheConfig['database']['default']]['version'] }}
|
||||
@else
|
||||
{{ $cacheConfig['driver'][$cacheConfig['session']['driver']]['version'] }}
|
||||
@endif
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><strong>Servidor</strong></td>
|
||||
<td>{{ $cacheConfig['session']['host'] }}</td>
|
||||
</tr>
|
||||
@endif
|
||||
|
||||
@if(in_array($cacheConfig['session']['driver'], ['database', 'redis']))
|
||||
<tr>
|
||||
<td><strong>Base de datos</strong></td>
|
||||
<td>{{ $cacheConfig['session']['database'] }}</td>
|
||||
</tr>
|
||||
@endif
|
||||
@if($cacheConfig['session']['driver'] == 'database')
|
||||
<tr>
|
||||
<td><strong>Tabla de sessiones</strong></td>
|
||||
<td>{{ $cacheConfig['session']['table'] }}</td>
|
||||
</tr>
|
||||
@endif
|
||||
@if ($cacheConfig['session']['driver'] === 'file')
|
||||
<tr>
|
||||
<td><strong>Ubicación de las sesiones</strong></td>
|
||||
<td>{{ $cacheConfig['session']['files'] }}</td>
|
||||
</tr>
|
||||
@endif
|
||||
|
||||
<tr>
|
||||
<td><strong>Tiempo de vida (Minutos)</strong></td>
|
||||
<td>{{ $cacheConfig['session']['lifetime'] }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><strong>Encriptación habilitada</strong></td>
|
||||
<td>{{ $cacheConfig['session']['encrypt'] ? 'Sí' : 'No' }}</td>
|
||||
</tr>
|
||||
|
||||
{{-- Mostrar solo si el driver utiliza cookies --}}
|
||||
@if (in_array($cacheConfig['session']['driver'], ['cookie', 'database', 'redis']))
|
||||
<tr>
|
||||
<td><strong>Nombre de la cookie</strong></td>
|
||||
<td>{{ $cacheConfig['session']['cookie'] ?? 'No especificado' }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><strong>Path de la Cookie</strong></td>
|
||||
<td>{{ $cacheConfig['session']['path'] }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><strong>Dominio de las sesiones</strong></td>
|
||||
<td>{{ $cacheConfig['session']['domain'] ?? 'No especificado' }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><strong>Cookies seguras</strong></td>
|
||||
<td>{{ $cacheConfig['session']['secure'] ? 'Sí' : 'No' }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><strong>Cookies solo HTTPS</strong></td>
|
||||
<td>{{ $cacheConfig['session']['http_only'] ? 'Sí' : 'No' }}</td>
|
||||
</tr>
|
||||
@endif
|
||||
@if($cacheConfig['session']['driver'] != 'memcached')
|
||||
<tr>
|
||||
<td><strong>Sesiones</strong></td>
|
||||
<td>{{ $sessionStats['session_count'] }}</td>
|
||||
</tr>
|
||||
@endif
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@if($cacheConfig['session']['driver'] != 'memcached')
|
||||
<div>
|
||||
{{-- Botones --}}
|
||||
<div class="row my-4">
|
||||
<div class="col-lg-12 text-end">
|
||||
@if($cacheConfig['cache']['default'] != 'memcached')
|
||||
<button
|
||||
class="btn btn-danger btn-clear-cache btn-sm mt-2 mr-2 waves-effect waves-light"
|
||||
wire:click="clearSessions"
|
||||
{{ $sessionStats['session_count']? '': 'disabled' }}
|
||||
data-loading-text="Eliminando Sesiones...">
|
||||
Eliminar Sesiones
|
||||
</button>
|
||||
@endif
|
||||
<button
|
||||
class="btn btn-secondary btn-reload-cache-stats btn-sm mt-2 mr-2 waves-effect waves-light"
|
||||
wire:click="reloadSessionStats"
|
||||
data-loading-text="Actualizando...">
|
||||
Actualizar
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
{{-- Notifications --}}
|
||||
<div class="notification-container" wire:ignore></div>
|
||||
</div>
|
||||
@endif
|
||||
</div>
|
||||
</div>
|
||||
152
resources/views/livewire/permissions/index.blade.php
Normal file
152
resources/views/livewire/permissions/index.blade.php
Normal file
@ -0,0 +1,152 @@
|
||||
<!-- Permission Table -->
|
||||
<div class="card">
|
||||
<div class="card-datatable table-responsive">
|
||||
<table class="datatables-permissions table border-top">
|
||||
<thead>
|
||||
<tr>
|
||||
<th></th>
|
||||
<th></th>
|
||||
<th>Nombre</th>
|
||||
<th>Asignado a</th>
|
||||
<th>Creado</th>
|
||||
<th>Actions</th>
|
||||
</tr>
|
||||
</thead>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
<!--/ Permission Table -->
|
||||
|
||||
|
||||
<?php
|
||||
/*
|
||||
<script>
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
$(document).ready(function() {
|
||||
// Datatable
|
||||
var dt_permission = $('.datatables-permissions')
|
||||
.DataTable({
|
||||
ajax: '{{ url()->current() }}',
|
||||
columns: [
|
||||
// columns according to JSON
|
||||
{data: ''},
|
||||
{data: 'id'},
|
||||
{data: 'name'},
|
||||
{data: 'assigned_to'},
|
||||
{data: 'created_at'},
|
||||
//{data: ''}
|
||||
],
|
||||
columnDefs: [
|
||||
{
|
||||
// For Responsive
|
||||
className: 'control',
|
||||
orderable: false,
|
||||
searchable: false,
|
||||
responsivePriority: 2,
|
||||
targets: 0,
|
||||
render: function(data, type, full, meta) {
|
||||
return '';
|
||||
}
|
||||
},
|
||||
{
|
||||
targets: 1,
|
||||
searchable: false,
|
||||
visible: false
|
||||
},
|
||||
{
|
||||
// Name
|
||||
targets: 2,
|
||||
render: function(data, type, full, meta) {
|
||||
return "<span data-id=" + full.id + ">" + data + "</span><br>" +
|
||||
'<small>' + (typeof(full['sub_group']) == 'string'? full['sub_group']: '') + "</small>";
|
||||
}
|
||||
},
|
||||
{
|
||||
// assigned_to
|
||||
targets: 3,
|
||||
orderable: false,
|
||||
render: function(data, type, full, meta) {
|
||||
var $assignedTo = full['assigned_to'],
|
||||
$output = '',
|
||||
roleBadgeObj = <?= json_encode($rows_roles) ?>;
|
||||
|
||||
for (var i = 0; i < $assignedTo.length; i++) {
|
||||
var val = $assignedTo[i];
|
||||
|
||||
$output += roleBadgeObj[val];
|
||||
}
|
||||
|
||||
return $output;
|
||||
}
|
||||
},
|
||||
{
|
||||
// Created at
|
||||
targets: 4,
|
||||
orderable: false
|
||||
},
|
||||
],
|
||||
order: [
|
||||
[1, 'asc']
|
||||
],
|
||||
dom:
|
||||
'<"row mx-1"' +
|
||||
'<"col-sm-12 col-md-3" l>' +
|
||||
'<"col-sm-12 col-lg-9"<"dt-action-buttons d-flex align-items-center justify-content-lg-end justify-content-center flex-md-nowrap flex-wrap"<"me-1"f><"user_role mt-50 width-200 me-1">B>>' +
|
||||
'>t' +
|
||||
'<"row mx-2"' +
|
||||
'<"col-sm-12 col-md-6"i>' +
|
||||
'<"col-sm-12 col-md-6"p>' +
|
||||
'>',
|
||||
language: $.fn.dataTable.ext.datatable_spanish_default,
|
||||
// Buttons with Dropdown
|
||||
buttons: [],
|
||||
// For responsive popup
|
||||
responsive: {
|
||||
details: {
|
||||
display: $.fn.dataTable.Responsive.display.modal({
|
||||
header: function(row) {
|
||||
var data = row.data();
|
||||
|
||||
return 'Detalles del permiso';
|
||||
}
|
||||
}),
|
||||
type: 'column',
|
||||
renderer: function(api, rowIdx, columns) {
|
||||
var data = $.map(columns, function(col, i) {
|
||||
return col.title !== ''? // ? Do not show row in modal popup if title is blank (for check box)
|
||||
'<tr data-dt-row="' + col.rowIndex + '" data-dt-column="' + col.columnIndex + '">' +
|
||||
'<td>' + col.name + ':' + '</td> ' +
|
||||
'<td>' + col.data + '</td>' +
|
||||
'</tr>' :
|
||||
'';
|
||||
}).join('');
|
||||
|
||||
return data ? $('<table class="table table-striped"/><tbody />').append(data) : false;
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
initComplete: function() {
|
||||
// Adding role filter once table initialized
|
||||
this.api()
|
||||
.columns(3)
|
||||
.every(function() {
|
||||
var column = this;
|
||||
|
||||
var select = $('{!! $roles_html_select !!}')
|
||||
.appendTo('.user_role')
|
||||
.on('change', function() {
|
||||
var val = $.fn.dataTable.util.escapeRegex($(this).val());
|
||||
|
||||
column.search(val? val: '', true, false).draw();
|
||||
});
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
});
|
||||
});
|
||||
</script>
|
||||
*/
|
||||
|
||||
?>
|
||||
17
resources/views/livewire/permissions/permissions.blade.php
Normal file
17
resources/views/livewire/permissions/permissions.blade.php
Normal file
@ -0,0 +1,17 @@
|
||||
<div>
|
||||
<h2 class="text-xl font-bold">Gestión de Permisos</h2>
|
||||
|
||||
<div class="mb-4">
|
||||
<input type="text" wire:model="permissionName" placeholder="Nombre del permiso" class="border p-2">
|
||||
<button wire:click="createPermission" class="bg-blue-500 text-white px-4 py-2">Crear Permiso</button>
|
||||
</div>
|
||||
|
||||
<ul>
|
||||
@foreach($permissions as $permission)
|
||||
<li>
|
||||
{{ $permission->name }}
|
||||
<button wire:click="deletePermission({{ $permission->id }})" class="text-red-500">Eliminar</button>
|
||||
</li>
|
||||
@endforeach
|
||||
</ul>
|
||||
</div>
|
||||
347
resources/views/livewire/roles/cards.blade.php
Normal file
347
resources/views/livewire/roles/cards.blade.php
Normal file
@ -0,0 +1,347 @@
|
||||
<div>
|
||||
<p class="mb-4">Un rol proporciona acceso a menús y funciones predefinidas para que, según el rol asignado por un administrador, el usuario tener acceso a lo que necesite.</p>
|
||||
|
||||
<!-- Role cards -->
|
||||
<div class="row g-4">
|
||||
@foreach($roles as $role)
|
||||
<div class="col-xl-4 col-lg-6 col-md-6">
|
||||
<div class="card">
|
||||
<div class="card-body">
|
||||
<div class="d-flex justify-content-between">
|
||||
<h6 class="fw-normal mb-2">Total {{ $role->users->count() }} usuario{{ $role->users->count() == 1? '': 's' }}</h6>
|
||||
<ul class="list-unstyled d-flex align-items-center avatar-group mb-0">
|
||||
@foreach($role->users->take(10) as $user)
|
||||
<li data-bs-toggle="tooltip"
|
||||
data-popup="tooltip-custom"
|
||||
data-bs-placement="top"
|
||||
title="{{ $user->name }}"
|
||||
class="avatar avatar-sm pull-up">
|
||||
<img class="rounded-circle" src="{{ asset($user->profile_photo_url) }}" alt="Avatar" />
|
||||
</li>
|
||||
@endforeach
|
||||
</ul>
|
||||
</div>
|
||||
<div class="d-flex justify-content-between align-items-end mt-1">
|
||||
<div class="role-heading">
|
||||
<h4 class="mb-1 role-name">{{ $role->name }}</h4>
|
||||
<span class="badge rounded-pill bg-label-{{ $role->style }}">Style: {{ $role->style }}</span>
|
||||
</div>
|
||||
<div>
|
||||
<a href="javascript:;" data-bs-toggle="modal" data-bs-target="#roleModal" wire:click="loadRoleData('view', {{ $role->id }})"
|
||||
class="text-body ms-2"
|
||||
data-bs-toggle="tooltip"
|
||||
data-popup="tooltip-custom"
|
||||
data-bs-placement="top"
|
||||
title="Ver rol">
|
||||
<i class="fa-regular fa-eye"></i>
|
||||
</a>
|
||||
@can('system.roles.edit')
|
||||
@if ($role->name != 'SuperAdmin' && $role->name != 'Admin')
|
||||
<a href="javascript:;" data-bs-toggle="modal" data-bs-target="#roleModal" wire:click="loadRoleData('edit', {{ $role->id }})"
|
||||
class="text-body ms-2"
|
||||
data-bs-toggle="tooltip"
|
||||
data-popup="tooltip-custom"
|
||||
data-bs-placement="top"
|
||||
title="Editar rol">
|
||||
<i class="fa-regular fa-pen-to-square"></i>
|
||||
</a>
|
||||
@endif
|
||||
@endcan
|
||||
@can('system.roles.create')
|
||||
<a href="javascript:;" data-bs-toggle="modal" data-bs-target="#roleModal" wire:click="loadRoleData('clone', {{ $role->id }})"
|
||||
class="text-body ms-2"
|
||||
data-bs-toggle="tooltip"
|
||||
data-popup="tooltip-custom"
|
||||
data-bs-placement="top"
|
||||
title="Crear una copia">
|
||||
<i class="fa-regular fa-copy"></i>
|
||||
</a>
|
||||
@endcan
|
||||
@can('system.roles.delete')
|
||||
@if ($role->name != 'SuperAdmin' && $role->name != 'Admin')
|
||||
<a href="javascript:;" data-bs-toggle="modal" data-bs-target="#roleDeleteModal" data-id="{{ $role->id }}"
|
||||
class="role-delete-modal text-body ms-2"
|
||||
data-bs-toggle="tooltip"
|
||||
data-popup="tooltip-custom"
|
||||
data-bs-placement="top"
|
||||
title="Eliminar">
|
||||
<i class="fa-regular fa-trash-can"></i>
|
||||
</a>
|
||||
@endif
|
||||
@endcan
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@endforeach
|
||||
@can('system.roles.create')
|
||||
<div class="col-xl-4 col-lg-6 col-md-6">
|
||||
<div class="card h-100">
|
||||
<div class="row h-100">
|
||||
<div class="col-sm-5">
|
||||
<div class="d-flex align-items-end h-100 justify-content-center mt-sm-0 mt-3">
|
||||
<img src="{{ asset('vendor/vuexy-admin/img/illustrations/add-new-roles.png') }}" class="img-fluid mt-sm-4 mt-md-0" alt="add-new-roles" width="83">
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-7">
|
||||
<div class="card-body text-sm-end text-center ps-sm-0">
|
||||
<button data-bs-target="#roleModal" data-bs-toggle="modal" class="btn btn-primary mb-2 text-nowrap add-new-role">
|
||||
<i class="fa-solid fa-plus me-1"></i> Nuevo rol
|
||||
</button>
|
||||
<p class="mb-0 mt-1">Agregar rol, si no existe</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@endcan
|
||||
</div>
|
||||
<!--/ Role cards -->
|
||||
|
||||
<!-- Role Modals -->
|
||||
@include('vuexy-admin::roles._form_modal')
|
||||
@include('vuexy-admin::roles._delete_modal')
|
||||
<!-- / Role Modals -->
|
||||
<div>
|
||||
|
||||
@push('page-script')
|
||||
<script>
|
||||
// Función para obtener elementos del formulario
|
||||
const getFormElements = () => {
|
||||
const form = document.getElementById('roleForm');
|
||||
const formElements = form.querySelectorAll('input, select, textarea, button');
|
||||
|
||||
return {
|
||||
roleModal: document.getElementById('roleModal'),
|
||||
roleTitle: document.querySelector('.role-title'),
|
||||
form: form,
|
||||
inputId: document.querySelector('#roleForm input[name="id"]'),
|
||||
inputName: document.querySelector('#roleForm input[name="name"]'),
|
||||
formElements: formElements,
|
||||
addRoleButton: document.querySelector('.add-new-role'),
|
||||
selectAll: document.querySelector('#selectAll'),
|
||||
submitButton: document.querySelector('#roleForm button[type="submit"]'),
|
||||
deleteRoleButtons: document.querySelectorAll('.role-delete-modal'),
|
||||
deleteRoleModal: document.getElementById('roleDeleteModal'),
|
||||
deleteRoleForm: document.getElementById('deleteRoleForm'),
|
||||
deleteRoleText: document.querySelector('#roleDeleteModal .confirmation-text'),
|
||||
};
|
||||
};
|
||||
|
||||
// Función para habilitar o deshabilitar el formulario
|
||||
const habilitarForm = (enableForm = true) => {
|
||||
const { formElements, submitButton } = getFormElements();
|
||||
|
||||
formElements.forEach(element => {
|
||||
element.disabled = !enableForm;
|
||||
});
|
||||
|
||||
submitButton.disabled = !enableForm;
|
||||
}
|
||||
|
||||
// Función para resetear el formulario
|
||||
const resetForm = () => {
|
||||
const { roleTitle, form, submitButton } = getFormElements();
|
||||
|
||||
roleTitle.textContent = 'Agregar un nuevo rol';
|
||||
submitButton.textContent = 'Crear nuevo rol';
|
||||
|
||||
form.reset();
|
||||
|
||||
// Limpiar errores de validación
|
||||
form.querySelectorAll('.is-invalid').forEach(element => {
|
||||
element.classList.remove('is-invalid');
|
||||
});
|
||||
|
||||
// Restablecer mensajes de error
|
||||
form.querySelectorAll('.invalid-feedback').forEach(element => {
|
||||
element.textContent = '';
|
||||
});
|
||||
};
|
||||
|
||||
// Función para inicializar la validación del formulario
|
||||
const initializeFormValidation = (form) => {
|
||||
const { inputId, inputName } = getFormElements();
|
||||
|
||||
FormValidation.formValidation(form, {
|
||||
fields: {
|
||||
name: {
|
||||
validators: {
|
||||
notEmpty: {
|
||||
message: 'El nombre del rol es requerido'
|
||||
},
|
||||
// Agregar una regla personalizada para la validación AJAX
|
||||
remote: {
|
||||
url: '{{ route('admin.core.roles.check-unique-name') }}',
|
||||
data: function() {
|
||||
return {
|
||||
name: inputName.value,
|
||||
id: inputId.value,
|
||||
};
|
||||
},
|
||||
message: 'Este nombre de rol ya está en uso',
|
||||
method: 'GET'
|
||||
}
|
||||
}
|
||||
},
|
||||
},
|
||||
plugins: {
|
||||
trigger: new FormValidation.plugins.Trigger(),
|
||||
bootstrap5: new FormValidation.plugins.Bootstrap5({
|
||||
rowSelector: '.col-12'
|
||||
}),
|
||||
submitButton: new FormValidation.plugins.SubmitButton(),
|
||||
autoFocus: new FormValidation.plugins.AutoFocus(),
|
||||
}
|
||||
})
|
||||
.on('core.form.valid', function(e) {
|
||||
Livewire.dispatch('saveRole');
|
||||
});
|
||||
};
|
||||
|
||||
// Función para agregar el listener a un botón de eliminación de rol
|
||||
const addDeleteRoleListener = (button) => {
|
||||
button.addEventListener('click', function() {
|
||||
const { deleteRoleText } = getFormElements();
|
||||
|
||||
var roleText = '¿Está seguro que desea eliminar el rol "' + button.closest('.card').querySelector('.role-name').innerHTML.trim() + '"?';
|
||||
|
||||
@this.deleteRoleId = this.dataset.id;
|
||||
deleteRoleText.textContent = roleText;
|
||||
});
|
||||
}
|
||||
|
||||
// Función para cambiar el estado de los checkboxes de permisos
|
||||
const setPermissionCheckboxState = (input, state) => {
|
||||
if(!input)
|
||||
return false;
|
||||
|
||||
let modelName = input.getAttribute('wire:model');
|
||||
|
||||
modelName = modelName.split('.').pop();
|
||||
|
||||
if(modelName)
|
||||
@this.permissionsInputs[modelName] = state;
|
||||
}
|
||||
|
||||
// Inicialización
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
Livewire.on('reloadForm', () => {
|
||||
setTimeout(() => {
|
||||
const { form, selectAll, deleteRoleForm } = getFormElements();
|
||||
|
||||
// Seleccionar/deseleccionar todos los checkboxes
|
||||
selectAll.addEventListener('change', e => {
|
||||
Object.keys(@this.permissionsInputs).forEach(key => {
|
||||
@this.permissionsInputs[key] = e.target.checked;
|
||||
});
|
||||
});
|
||||
|
||||
const checkboxList = document.querySelectorAll('#roleForm .permission-row input[type="checkbox"]');
|
||||
|
||||
checkboxList.forEach(checkbox => {
|
||||
checkbox.addEventListener('change', e => {
|
||||
let permissionType = e.target.dataset.type,
|
||||
permissionsRow = e.target.closest('.permission-row');
|
||||
|
||||
if (permissionType == 'view' && !e.target.checked) {
|
||||
let permissionCheckboxView = permissionsRow.querySelector('input[data-type="view"]'),
|
||||
permissionCheckboxCreate = permissionsRow.querySelector('input[data-type="create"]'),
|
||||
permissionCheckboxEdit = permissionsRow.querySelector('input[data-type="edit"]'),
|
||||
permissionCheckboxCancel = permissionsRow.querySelector('input[data-type="cancel"]'),
|
||||
permissionCheckboxDelete = permissionsRow.querySelector('input[data-type="delete"]');
|
||||
|
||||
if(permissionCheckboxView)
|
||||
setPermissionCheckboxState(permissionCheckboxView, false);
|
||||
|
||||
if(permissionCheckboxCreate)
|
||||
setPermissionCheckboxState(permissionCheckboxCreate, false);
|
||||
|
||||
if(permissionCheckboxEdit)
|
||||
setPermissionCheckboxState(permissionCheckboxEdit, false);
|
||||
|
||||
if(permissionCheckboxCancel)
|
||||
setPermissionCheckboxState(permissionCheckboxCancel, false);
|
||||
|
||||
if(permissionCheckboxDelete)
|
||||
setPermissionCheckboxState(permissionCheckboxDelete, false);
|
||||
}
|
||||
|
||||
if ((permissionType == 'create' || permissionType == 'edit' || permissionType == 'cancel' || permissionType == 'delete') && e.target.checked) {
|
||||
let permissionCheckboxView = permissionsRow.querySelector('input[data-type="view"]');
|
||||
|
||||
setPermissionCheckboxState(permissionCheckboxView, true);
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
// Validación de formulario
|
||||
initializeFormValidation(form);
|
||||
|
||||
deleteRoleForm.addEventListener('submit', function(e) {
|
||||
e.preventDefault();
|
||||
Livewire.dispatch('deleteRole');
|
||||
});
|
||||
}, 1);
|
||||
});
|
||||
|
||||
Livewire.on('habilitarFormulario', () => {
|
||||
habilitarForm();
|
||||
})
|
||||
|
||||
Livewire.on('deshabilitarFormulario', () => {
|
||||
setTimeout(() => {
|
||||
habilitarForm(false);
|
||||
}, 1);
|
||||
})
|
||||
|
||||
Livewire.on('modalHide', () => {
|
||||
const { roleModal } = getFormElements();
|
||||
const modal = bootstrap.Modal.getInstance(roleModal);
|
||||
|
||||
modal.hide();
|
||||
});
|
||||
|
||||
Livewire.on('modalDeleteHide', () => {
|
||||
const { deleteRoleModal } = getFormElements();
|
||||
const modal = bootstrap.Modal.getInstance(deleteRoleModal);
|
||||
|
||||
modal.hide();
|
||||
});
|
||||
|
||||
Livewire.on('saveRole', () => {
|
||||
const { deleteRoleButtons } = getFormElements();
|
||||
|
||||
deleteRoleButtons.forEach(button => {
|
||||
addDeleteRoleListener(button);
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
const { roleModal, addRoleButton, deleteRoleButtons } = getFormElements();
|
||||
|
||||
// Al agregar Rol
|
||||
addRoleButton.addEventListener('click', function() {
|
||||
const { form } = getFormElements();
|
||||
|
||||
resetForm();
|
||||
habilitarForm();
|
||||
});
|
||||
|
||||
// Al abrir el Modal Crear / Editar / Clonar
|
||||
roleModal.addEventListener('shown.bs.modal', function () {
|
||||
const { inputName } = getFormElements();
|
||||
|
||||
inputName.focus();
|
||||
});
|
||||
|
||||
// Eliminar
|
||||
deleteRoleButtons.forEach(button => {
|
||||
addDeleteRoleListener(button);
|
||||
});
|
||||
|
||||
});
|
||||
</script>
|
||||
@endsection
|
||||
46
resources/views/livewire/roles/index.blade.php
Normal file
46
resources/views/livewire/roles/index.blade.php
Normal file
@ -0,0 +1,46 @@
|
||||
<div>
|
||||
<h2 class="text-xl font-bold">Gestión de Roles</h2>
|
||||
|
||||
<!-- Crear Nuevo Rol -->
|
||||
<div class="mb-4">
|
||||
<input type="text" wire:model="roleName" placeholder="Nombre del rol" class="border p-2">
|
||||
<button wire:click="createRole" class="bg-blue-500 text-white px-4 py-2">Crear Rol</button>
|
||||
</div>
|
||||
|
||||
<!-- Tabla de Roles -->
|
||||
<table class="table-auto w-full border">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Nombre</th>
|
||||
<th>Acciones</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
@foreach($roles as $role)
|
||||
<tr>
|
||||
<td>{{ $role->name }}</td>
|
||||
<td>
|
||||
<button wire:click="selectRole({{ $role->id }})" class="text-blue-500">Editar</button>
|
||||
<button wire:click="deleteRole({{ $role->id }})" class="text-red-500">Eliminar</button>
|
||||
</td>
|
||||
</tr>
|
||||
@endforeach
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
{{ $roles->links() }}
|
||||
|
||||
<!-- Editar Permisos del Rol -->
|
||||
@if($selectedRole)
|
||||
<div class="mt-4">
|
||||
<h3>Permisos para {{ $selectedRole->name }}</h3>
|
||||
@foreach($availablePermissions as $permission)
|
||||
<label>
|
||||
<input type="checkbox" wire:model="permissions" value="{{ $permission->id }}">
|
||||
{{ $permission->name }}
|
||||
</label>
|
||||
@endforeach
|
||||
<button wire:click="updateRolePermissions" class="bg-green-500 text-white px-4 py-2 mt-2">Actualizar</button>
|
||||
</div>
|
||||
@endif
|
||||
</div>
|
||||
60
resources/views/livewire/users/count.blade.php
Normal file
60
resources/views/livewire/users/count.blade.php
Normal file
@ -0,0 +1,60 @@
|
||||
<div class="row g-4 mb-4 text-right">
|
||||
<div class="col-sm-6 col-xl-3"></div>
|
||||
<div class="col-sm-6 col-xl-3">
|
||||
<div class="card">
|
||||
<div class="card-body">
|
||||
<div class="d-flex align-items-start justify-content-between">
|
||||
<div class="content-left">
|
||||
<div class="d-flex align-items-center my-2">
|
||||
<h3 class="mb-0 mx-4">{{ $enabled }}</h3>
|
||||
</div>
|
||||
<p class="mb-0">Usuarios activos</p>
|
||||
</div>
|
||||
<div class="avatar">
|
||||
<span class="avatar-initial rounded bg-label-success">
|
||||
<i class="ti ti-user-plus ti-sm"></i>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-6 col-xl-3">
|
||||
<div class="card">
|
||||
<div class="card-body">
|
||||
<div class="d-flex align-items-start justify-content-between">
|
||||
<div class="content-left">
|
||||
<div class="d-flex align-items-center my-2">
|
||||
<h3 class="mb-0 mx-4">{{ $disabled }}</h3>
|
||||
</div>
|
||||
<p class="mb-0">Usuarios suspendidos</p>
|
||||
</div>
|
||||
<div class="avatar">
|
||||
<span class="avatar-initial rounded bg-label-warning">
|
||||
<i class="ti ti-user-check ti-sm"></i>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-6 col-xl-3">
|
||||
<div class="card">
|
||||
<div class="card-body">
|
||||
<div class="d-flex align-items-start justify-content-between">
|
||||
<div class="content-left">
|
||||
<div class="d-flex align-items-center my-2">
|
||||
<h3 class="mb-0 mx-4">{{ $total }}</h3>
|
||||
</div>
|
||||
<p class="mb-0">Total de usuarios</p>
|
||||
</div>
|
||||
<div class="avatar">
|
||||
<span class="avatar-initial rounded bg-label-primary">
|
||||
<i class="ti ti-user ti-sm"></i>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
165
resources/views/livewire/users/form.blade.php
Normal file
165
resources/views/livewire/users/form.blade.php
Normal file
@ -0,0 +1,165 @@
|
||||
<div>
|
||||
<x-vuexy-admin::form id="{{ $formId }}" :mode="$mode" wireSubmit="onSubmit" actionPosition="both">
|
||||
<x-slot name="actions">
|
||||
<x-vuexy-admin::button.offcanvas-buttons :mode="$mode" :tagName="$tagName" />
|
||||
</x-slot>
|
||||
<div class="row">
|
||||
<div class="col-lg-4">
|
||||
{{-- Identificación --}}
|
||||
<x-vuexy-admin::card.basic title="Identificación">
|
||||
<x-vuexy-admin::form.input :uid="$uniqueId" model="code" label="Identificador único" icon="ti ti-tag" placeholder="UID code" autofocus autocomplete="off" />
|
||||
<x-vuexy-admin::form.input :uid="$uniqueId" model="name" label="Nombre de la sucursal" autocomplete="organization" />
|
||||
<x-vuexy-admin::form.textarea :uid="$uniqueId" model="description" label="Descripción" placeholder="Descripción de la sucursal" :autosize=true />
|
||||
</x-vuexy-admin::card.basic>
|
||||
|
||||
{{-- Series de facturación --}}
|
||||
<x-vuexy-admin::card.basic title="Series de facturación">
|
||||
<x-vuexy-admin::form.input :uid="$uniqueId" model="serie_ingresos" label="Serie para Ingresos" inline=true :labelCol=6 :inputCol=6 maxlength="5" autocomplete="off" />
|
||||
<x-vuexy-admin::form.input :uid="$uniqueId" model="serie_egresos" label="Serie para Egresos" inline=true :labelCol=6 :inputCol=6 maxlength="5" autocomplete="off" />
|
||||
<x-vuexy-admin::form.input :uid="$uniqueId" model="serie_pagos" label="Serie para Pagos" inline=true :labelCol=6 :inputCol=6 maxlength="5" autocomplete="off" />
|
||||
</x-vuexy-admin::card.basic>
|
||||
|
||||
{{-- Configuraciones --}}
|
||||
<x-vuexy-admin::card.basic title="Configuraciones">
|
||||
<x-vuexy-admin::form.checkbox uid="random" model="status" label="Habilitar sucursal" switch="true" />
|
||||
<x-vuexy-admin::form.checkbox uid="random" model="show_on_website" label="Mostrar en sitio web" switch="true" />
|
||||
<x-vuexy-admin::form.checkbox uid="random" model="enable_ecommerce" label="eCommerce habilitado en sitio Web" switch="true" />
|
||||
</x-vuexy-admin::card.basic>
|
||||
</div>
|
||||
<div class="col-lg-4">
|
||||
{{-- Información de contacto --}}
|
||||
<x-vuexy-admin::card.basic title="Información de contacto">
|
||||
<x-vuexy-admin::form.input type="tel" :uid="$uniqueId" model="tel" label="Teléfono" icon="ti ti-phone" phoneMode="national" />
|
||||
<x-vuexy-admin::form.input type="tel" :uid="$uniqueId" model="tel2" label="Teléfono alternativo" icon="ti ti-phone" phoneMode="both" />
|
||||
<x-vuexy-admin::form.input type="email" :uid="$uniqueId" model="email" label="Correo electrónico" icon="ti ti-mail" autocomplete="email" inputmode="email" />
|
||||
<x-vuexy-admin::form.select :uid="$uniqueId" model="manager_id" label="Gerente" :options="$manager_id_options" placeholder="Selecciona el gerente" />
|
||||
</x-vuexy-admin::card.basic>
|
||||
|
||||
{{-- Información fiscal --}}
|
||||
<x-vuexy-admin::card.basic title="Información fiscal">
|
||||
<x-vuexy-admin::form.input :uid="$uniqueId" model="rfc" label="RFC" autocomplete="off" pattern="^[A-Z&Ñ]{3,4}[0-9]{6}[A-Z0-9]{3}$" maxlength="13" />
|
||||
<x-vuexy-admin::form.input :uid="$uniqueId" model="nombre_fiscal" label="Nombre fiscal" autocomplete="organization" />
|
||||
<x-vuexy-admin::form.select :uid="$uniqueId" model="c_regimen_fiscal" label="Régimen fiscal" :options="$c_regimen_fiscal_options" placeholder="Selecciona el régimen fiscal" />
|
||||
<x-vuexy-admin::form.input :uid="$uniqueId" model="domicilio_fiscal" label="Domicilio fiscal" autocomplete="address-line1" maxlength="100" />
|
||||
</x-vuexy-admin::card.basic>
|
||||
</div>
|
||||
<div class="col-lg-4">
|
||||
{{-- Dirección --}}
|
||||
<x-vuexy-contacts::card.address :uid="$uniqueId" :paisOptions="$c_pais_options" :estadoOptions="$c_estado_options" :localidadOptions="$c_localidad_options" :municipioOptions="$c_municipio_options" :coloniaOptions="$c_colonia_options"/>
|
||||
|
||||
{{-- Ubicación --}}
|
||||
<x-vuexy-contacts::card.location :uid="$uniqueId" />
|
||||
</div>
|
||||
</div>
|
||||
</x-vuexy-admin::form>
|
||||
</div>
|
||||
|
||||
@push('page-script')
|
||||
<script>
|
||||
const initializeStoreForm = (mode) => {
|
||||
const initializeContactInformation = () => {
|
||||
let $manager_id = $("#manager_id_{{ $uniqueId }}");
|
||||
|
||||
$manager_id
|
||||
.select2({
|
||||
language: "es",
|
||||
placeholder: "Selecciona el gerente",
|
||||
allowClear: true,
|
||||
width: "100%"
|
||||
})
|
||||
.on('select2:select select2:clear', function (e) {
|
||||
@this.manager_id = e.params?.data?.id || null;
|
||||
});
|
||||
}
|
||||
|
||||
const initializeFiscalInformation = () => {
|
||||
let $c_regimen_fiscal = $("#c_regimen_fiscal_{{ $uniqueId }}");
|
||||
|
||||
$c_regimen_fiscal
|
||||
.select2({
|
||||
language: "es",
|
||||
placeholder: "Selecciona el regimen fiscal",
|
||||
allowClear: true,
|
||||
width: "100%"
|
||||
})
|
||||
.on('select2:select select2:clear', function (e) {
|
||||
@this.c_regimen_fiscal = e.params?.data?.id || null;
|
||||
});
|
||||
}
|
||||
|
||||
const initializeLocationIQ = () => {
|
||||
//
|
||||
}
|
||||
|
||||
const initializeAddressFormHandler = () => {
|
||||
const csrfToken = document.querySelector('meta[name="csrf-token"]').getAttribute('content');
|
||||
|
||||
// Definición de selectores AddressFormHandler
|
||||
formSelectors = {
|
||||
c_pais: '#c_pais_{{ $uniqueId }}',
|
||||
c_estado: '#c_estado_{{ $uniqueId }}',
|
||||
c_localidad: '#c_localidad_{{ $uniqueId }}',
|
||||
c_municipio: '#c_municipio_{{ $uniqueId }}',
|
||||
c_colonia: '#c_colonia_{{ $uniqueId }}',
|
||||
c_codigo_postal: '#c_codigo_postal_{{ $uniqueId }}',
|
||||
direccion: '#direccion_{{ $uniqueId }}',
|
||||
notification: '#{{ $formId }} .address-notification'
|
||||
};
|
||||
|
||||
// Definición de rutas AJAX Componente AddressFormHandler
|
||||
const ajaxRoutes = {
|
||||
codigo_postal: "{{ route('admin.core.sat.get.ajax', 'codigo_postal') }}",
|
||||
localidad: "{{ route('admin.core.sat.get.ajax', 'localidad') }}",
|
||||
estado: "{{ route('admin.core.sat.get.ajax', 'estado') }}",
|
||||
municipio: "{{ route('admin.core.sat.get.ajax', 'municipio') }}",
|
||||
colonia: "{{ route('admin.core.sat.get.ajax', 'colonia') }}"
|
||||
};
|
||||
|
||||
// Inicializamos el handler de la información de la dirección
|
||||
new AddressFormHandler(formSelectors, ajaxRoutes, @this, csrfToken);
|
||||
}
|
||||
|
||||
const initializeLocationCard = (mode) => {
|
||||
const locationInputs = {
|
||||
search: '#location_search_{{ $uniqueId }}',
|
||||
btnSearch: '#btn_search_{{ $uniqueId }}',
|
||||
lat: '#lat_{{ $uniqueId }}',
|
||||
lng: '#lng_{{ $uniqueId }}',
|
||||
btnClear: '#{{ $formId }} .btn-clear-coords',
|
||||
mapId: 'locationMap_{{ $uniqueId }}',
|
||||
}
|
||||
|
||||
leafletMap = LeafletMapHelper.initializeMap(locationInputs, mode, @this);
|
||||
}
|
||||
|
||||
|
||||
// Inicializamos Tarjeta de Información de contacto
|
||||
initializeContactInformation();
|
||||
|
||||
// Inicializamos Tarjeta de Información fiscal
|
||||
initializeFiscalInformation();
|
||||
|
||||
// Inicializamos Tarjeta de Dirección
|
||||
initializeAddressFormHandler();
|
||||
|
||||
// Inicializamos Tarjeta de Ubicación
|
||||
initializeLocationCard(mode);
|
||||
|
||||
// Deshabilitamos el formulario si estamos eliminando
|
||||
if (mode === 'delete') {
|
||||
window.disableStoreForm('#{{ $formId }}');
|
||||
}
|
||||
}
|
||||
|
||||
// Evento para inicializar el formulario
|
||||
document.addEventListener("DOMContentLoaded", () => {
|
||||
document.addEventListener('on-failed-validation-store', (event) => {
|
||||
setTimeout(() => {
|
||||
initializeStoreForm('{{ $mode }}');
|
||||
}, 10);
|
||||
});
|
||||
|
||||
initializeStoreForm('{{ $mode }}');
|
||||
});
|
||||
</script>
|
||||
@endpush
|
||||
704
resources/views/livewire/users/index.blade.copy.php
Normal file
704
resources/views/livewire/users/index.blade.copy.php
Normal file
@ -0,0 +1,704 @@
|
||||
<div>
|
||||
<div class="users-index alert-errors">{!! $indexAlert !!}</div>
|
||||
|
||||
<!-- Users List Table -->
|
||||
<div class="card" wire:ignore>
|
||||
<div class="card-datatable table-responsive">
|
||||
<table class="datatables-users table">
|
||||
<thead class="border-top">
|
||||
<tr>
|
||||
<th></th>
|
||||
<th>Id</th>
|
||||
<th>Usuario</th>
|
||||
<th>Roles</th>
|
||||
<th>Estatus</th>
|
||||
<th>Creado</th>
|
||||
<th>Acciones</th>
|
||||
</tr>
|
||||
</thead>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Offcanvas to add new user -->
|
||||
<div class="offcanvas offcanvas-end" tabindex="-1" id="offcanvasUser" aria-labelledby="offcanvasLabel">
|
||||
<div class="offcanvas-header border-bottom">
|
||||
<h5 id="offcanvasLabel" class="offcanvas-title">{{ $modalTitle }}</h5>
|
||||
<button type="button" class="btn-close text-reset" data-bs-dismiss="offcanvas" aria-label="Close"></button>
|
||||
</div>
|
||||
<div class="offcanvas-body mx-0 flex-grow-0 p-6 h-100">
|
||||
<form class="pt-0" id="userForm" autocomplete='off'>
|
||||
<input type="hidden" name="id" wire:model='userId' />
|
||||
|
||||
<div class="mb-3">
|
||||
<label for="name" class="form-label">Nombre completo</label>
|
||||
<div class="input-group input-group-merge">
|
||||
<span class="input-group-text"><i class="ti ti-user"></i></span>
|
||||
<input type="text" name="name" wire:model='name' id="name" class="form-control" placeholder="Pepe Pecas" />
|
||||
</div>
|
||||
<div class="error-message"></div>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label for="email" class="form-label">Correo electrónico</label>
|
||||
<div class="input-group input-group-merge">
|
||||
<span class="input-group-text"><i class="ti ti-mail"></i></span>
|
||||
<input type="text" name="email" wire:model='email' id="email" class="form-control" placeholder="picapapas@mail.com" />
|
||||
</div>
|
||||
<div class="error-message"></div>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label for="password" class="form-label">Contraseña</label>
|
||||
<div class="input-group input-group-merge form-password-toggle">
|
||||
<span class="input-group-text"><i class="ti ti-key"></i></span>
|
||||
<input type="password" name="password" wire:model='password' class="form-control form-control-merge" id="password" placeholder="············" />
|
||||
<span class="input-group-text cursor-pointer"><i class="ti ti-eye"></i></span>
|
||||
</div>
|
||||
<div class="error-message"></div>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label for="roles" class="form-label">Roles del usuario</label>
|
||||
<x-vuexy-admin::form.select
|
||||
id="roles"
|
||||
name="roles[]"
|
||||
wire:model='roles'
|
||||
:options="$roles_options"
|
||||
multiple
|
||||
class="select2 form-select" />
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label for="status" class="form-label">Estatus</label>
|
||||
<div class="input-group input-group-merge">
|
||||
<span class="input-group-text"><i class="ti ti-alert-triangle"></i></span>
|
||||
<x-vuexy-admin::form.select
|
||||
id="status"
|
||||
name="status"
|
||||
wire:model='status'
|
||||
:options="$status_options"
|
||||
class="form-select" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label for="photo" class="form-label">Imagen de perfil</label>
|
||||
<div class="image-wrapper mb-1">
|
||||
<img id="user-image" class="max-w-full" src="{{ $src_photo }}" alt="">
|
||||
</div>
|
||||
<input type="file" name="photo" id="photo" class='form-control' accept='image/*' />
|
||||
</div>
|
||||
|
||||
<div class="alert-errors"></div>
|
||||
|
||||
<button type="submit" class="btn btn-primary me-3 data-submit">{{ $btnSubmitTxt }}</button>
|
||||
<button type="reset" class="btn btn-label-danger" data-bs-dismiss="offcanvas">Cancelar</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Delete User Modal -->
|
||||
<div class="modal fade" id="deleteUserModal" tabindex="-1" aria-hidden="true" wire:ignore>
|
||||
<div class="modal-dialog modal-dialog-centered modal-simple">
|
||||
<div class="modal-content p-3 p-md-5">
|
||||
<div class="modal-body">
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
||||
<div class="text-center mb-4">
|
||||
<h3 class="mb-2">Eliminar usuario</h3>
|
||||
<p class="text-muted">El proceso de eliminación es definitivo e irreversible</p>
|
||||
</div>
|
||||
<form class="row g-3">
|
||||
<div class="col-12">
|
||||
<p class="name text-center font-bold"></p>
|
||||
</div>
|
||||
<div class="col-12 text-center">
|
||||
<button type="submit" class="btn btn-primary me-sm-3 me-1 btn-submit">Eliminar usuario</button>
|
||||
<button type="reset" class="btn btn-secondary btn-reset" data-bs-dismiss="modal" aria-label="Close">Cancelar</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--/ Delete User Modal -->
|
||||
</div>
|
||||
|
||||
@push('page-script')
|
||||
<script type="text/javascript">
|
||||
document.addEventListener("DOMContentLoaded", function() {
|
||||
const store_route = '{{ route('admin.core.users.store') }}',
|
||||
update_route = '{{ route('admin.core.users.update-ajax', '0~0') }}',
|
||||
show_route = '{{ route('admin.core.users.show', '0~0') }}',
|
||||
destroy_route = '{{ route('admin.core.users.destroy', '0~0') }}';
|
||||
|
||||
var statusObj = <?= json_encode($statuses) ?>,
|
||||
$usersIndexAlert = $('.users-index.alert-errors'),
|
||||
$dt_user_table = $('.datatables-users'),
|
||||
dt_user;
|
||||
|
||||
var offcanvasElement = document.getElementById('offcanvasUser'),
|
||||
offcanvasUser = new bootstrap.Offcanvas(offcanvasElement);
|
||||
|
||||
|
||||
load_js_form = () => {
|
||||
$('#userForm .select2')
|
||||
.each(function() {
|
||||
var $this = $(this)
|
||||
|
||||
$this.wrap('<div class="position-relative"></div>')
|
||||
|
||||
$this.select2({
|
||||
dropdownAutoWidth: true,
|
||||
width: '100%',
|
||||
dropdownParent: $this.parent()
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
// Previo de imagenes
|
||||
document.getElementById("photo").addEventListener('change', updatePreviewImage);
|
||||
|
||||
|
||||
// Reset form
|
||||
$("#userForm")
|
||||
.on('reset', function(){
|
||||
setTimeout(function(){
|
||||
$('#roles').trigger('change');
|
||||
}, 250)
|
||||
|
||||
$('#user-image').prop("src", "data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7");
|
||||
|
||||
$('#userForm .alert-errors').html('');
|
||||
});
|
||||
|
||||
|
||||
$("#userForm")
|
||||
.validate({
|
||||
errorClass: 'error',
|
||||
highlight: function(element, errorClass, validClass) {
|
||||
// Agrega la clase de error a la fila (contenedor del campo)
|
||||
$(element).closest('.mb-3').addClass('has-error');
|
||||
},
|
||||
unhighlight: function(element, errorClass, validClass) {
|
||||
// Elimina la clase de error de la fila (contenedor del campo)
|
||||
$(element).closest('.mb-3').removeClass('has-error');
|
||||
},
|
||||
errorPlacement: function(error, element) {
|
||||
// Controla dónde se colocan los mensajes de error
|
||||
error.appendTo(element.closest('.mb-3').find('.error-message'));
|
||||
},
|
||||
rules: {
|
||||
name: {
|
||||
required: true,
|
||||
minlength: 8
|
||||
},
|
||||
email: {
|
||||
required: true,
|
||||
email: true
|
||||
},
|
||||
password: {
|
||||
required: function(element) {
|
||||
return !$("#userForm input[name=id]").val();
|
||||
},
|
||||
minlength: 6
|
||||
}
|
||||
},
|
||||
messages: {
|
||||
name: {
|
||||
required: "Por favor ingrese su nombre completo",
|
||||
minlength: "El nombre completo debe tener al menos 8 caracteres"
|
||||
},
|
||||
email: {
|
||||
required: "Por favor ingrese su correo electrónico",
|
||||
email: "El valor no es una dirección de correo válida"
|
||||
},
|
||||
password: {
|
||||
required: "La contraseña es obligatoria para nuevos usuarios",
|
||||
minlength: "La contraseña debe tener al menos 6 caracteres"
|
||||
}
|
||||
},
|
||||
submitHandler: function(form) {
|
||||
var form = $("#userForm")[0],
|
||||
data = new FormData(form);
|
||||
|
||||
$('#userForm :input').prop('disabled', true);
|
||||
|
||||
var url = $(form.id).val() ?
|
||||
update_route.replace('0~0', $(form.id).val()) :
|
||||
store_route;
|
||||
|
||||
$.ajax({
|
||||
url: url,
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
|
||||
},
|
||||
data: data,
|
||||
contentType: false,
|
||||
processData: false,
|
||||
cache: false,
|
||||
timeout: 3000,
|
||||
success: function(data) {
|
||||
$('#userForm :input').prop('disabled', false);
|
||||
|
||||
if (data.errors) {
|
||||
$('#userForm .alert-errors').html('<div class="alert alert-danger alert-dismissible fade show" role="alert">' +
|
||||
'<div class="alert-body">' + data.errors + '</div>' +
|
||||
'<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>' +
|
||||
'</div>');
|
||||
|
||||
} else {
|
||||
$usersIndexAlert.html('<div class="alert alert-success alert-dismissible fade show" role="alert">' +
|
||||
'<div class="alert-body">' +
|
||||
'<p class="mb-0"><strong>' + data.success + '</strong></p>' +
|
||||
'</div>' +
|
||||
'<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>' +
|
||||
'</div>');
|
||||
|
||||
$('#userForm button[type=reset]').trigger('click');
|
||||
|
||||
//@this.call('refreshUserCount');
|
||||
|
||||
dt_user.ajax.reload();
|
||||
}
|
||||
},
|
||||
error: function(e) {
|
||||
$('#userForm :input').prop('disabled', false);
|
||||
|
||||
$('#userForm .alert-errors').html('<div class="alert alert-danger alert-dismissible fade show" role="alert">' +
|
||||
'<div class="alert-body">' + e.responseJSON.message + '</div>' +
|
||||
'<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>' +
|
||||
'</div>');
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
|
||||
// Previo de imagen de perfil
|
||||
updatePreviewImage = (event) => {
|
||||
var file = event.target.files[0],
|
||||
reader = new FileReader();
|
||||
|
||||
reader.onload = event => {
|
||||
document.getElementById('user-image').setAttribute('src', event.target.result);
|
||||
};
|
||||
|
||||
reader.readAsDataURL(file);
|
||||
}
|
||||
|
||||
// Add User
|
||||
add_user = () => {
|
||||
let $offcanvasUser = $('#offcanvasUser');
|
||||
|
||||
$('.offcanvas-title', $offcanvasUser).html('Crear usuario nuevo');
|
||||
$('.btn-submit', $offcanvasUser).html('Crear usuario');
|
||||
|
||||
if ($('input[name=id]', $offcanvasUser).val()){
|
||||
document.getElementById('userForm').reset();
|
||||
|
||||
$('input[name=id]', $offcanvasUser).val('');
|
||||
|
||||
$('#roles').trigger('change');
|
||||
|
||||
$('#user-image').prop("src", "data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7");
|
||||
|
||||
$('.alert-errors', $offcanvasUser).html('');
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
Livewire.on('openModal', () => {
|
||||
setTimeout(() =>{
|
||||
offcanvasUser.show();
|
||||
|
||||
load_js_form();
|
||||
|
||||
dt_user.ajax.reload();
|
||||
}, 1)
|
||||
});
|
||||
|
||||
Livewire.on('afterDelete', () => {
|
||||
setTimeout(() =>{
|
||||
var modalElement = document.getElementById('deleteUserModal'),
|
||||
modalDelete = bootstrap.Modal.getInstance(modalElement);
|
||||
|
||||
modalDelete.hide();
|
||||
|
||||
load_js_form();
|
||||
|
||||
dt_user.ajax.reload();
|
||||
}, 1)
|
||||
});
|
||||
|
||||
|
||||
// (jquery)
|
||||
$(function () {
|
||||
let borderColor, bodyBg, headingColor;
|
||||
|
||||
if (isDarkStyle) {
|
||||
borderColor = config.colors_dark.borderColor;
|
||||
bodyBg = config.colors_dark.bodyBg;
|
||||
headingColor = config.colors_dark.headingColor;
|
||||
} else {
|
||||
borderColor = config.colors.borderColor;
|
||||
bodyBg = config.colors.bodyBg;
|
||||
headingColor = config.colors.headingColor;
|
||||
}
|
||||
|
||||
// Users datatable
|
||||
dt_user = $dt_user_table.DataTable({
|
||||
ajax: '{{ url()->current() }}',
|
||||
columns: [
|
||||
// columns according to JSON
|
||||
{ data: 'id' },
|
||||
{ data: 'id' },
|
||||
{ data: 'name' },
|
||||
{ data: 'roles' },
|
||||
{ data: 'status' },
|
||||
{ data: 'created_at' },
|
||||
{ data: 'action' }
|
||||
],
|
||||
columnDefs: [
|
||||
{
|
||||
// For Responsive
|
||||
className: 'control',
|
||||
searchable: false,
|
||||
orderable: false,
|
||||
responsivePriority: 2,
|
||||
targets: 0,
|
||||
render: function (data, type, full, meta) {
|
||||
return '';
|
||||
}
|
||||
},
|
||||
{
|
||||
// User name and email
|
||||
targets: 2,
|
||||
responsivePriority: 3,
|
||||
render: function (data, type, full, meta) {
|
||||
var $name = full['name'],
|
||||
$email = full['email'],
|
||||
$image = full['avatar'];
|
||||
|
||||
if ($image) {
|
||||
// For Avatar image
|
||||
var $output =
|
||||
'<img src="' + $image + '" alt="Avatar" class="rounded-circle">';
|
||||
} else {
|
||||
// For Avatar badge
|
||||
var $name = full['full_name'],
|
||||
$initials = $name.match(/\b\w/g) || [];
|
||||
$initials = (($initials.shift() || '') + ($initials.pop() || '')).toUpperCase();
|
||||
$output = '<span class="avatar-initial rounded-circle>' + $initials + '</span>';
|
||||
}
|
||||
|
||||
// Creates full output for row
|
||||
var $row_output =
|
||||
'<div class="d-flex justify-content-start align-items-center user-name">' +
|
||||
'<div class="avatar-wrapper">' +
|
||||
'<div class="avatar avatar-sm me-4">' + $output + '</div>' +
|
||||
'</div>' +
|
||||
'<div class="d-flex flex-column">' +
|
||||
'<a href="' + show_route.replace('0~0', full['id']) + '" class="text-heading text-truncate"><span class="fw-medium">' + $name + '</span></a>' +
|
||||
'<small>' + $email + '</small>' +
|
||||
'</div>' +
|
||||
'</div>';
|
||||
|
||||
return $row_output;
|
||||
}
|
||||
},
|
||||
{
|
||||
// User Role
|
||||
targets: 3,
|
||||
render: function(data, type, full, meta) {
|
||||
var $assignedTo = full['roles'],
|
||||
$output = '',
|
||||
roleBadgeObj = <?= json_encode($rows_roles) ?>;
|
||||
|
||||
for (var i = 0; i < $assignedTo.length; i++) {
|
||||
var val = $assignedTo[i];
|
||||
|
||||
$output += roleBadgeObj[val];
|
||||
}
|
||||
|
||||
return $output;
|
||||
}
|
||||
},
|
||||
{
|
||||
// User Status
|
||||
targets: 4,
|
||||
render: function (data, type, full, meta) {
|
||||
var $status = full['status'];
|
||||
|
||||
return ('<span class="badge rounded-pill ' + statusObj[$status].class + '" text-capitalized>' + statusObj[$status].title + '</span>');
|
||||
|
||||
}
|
||||
},
|
||||
{
|
||||
// Created
|
||||
targets: 5,
|
||||
render: function (data, type, full, meta) {
|
||||
return full['created_at'];
|
||||
}
|
||||
},
|
||||
{
|
||||
// Actions
|
||||
targets: -1,
|
||||
title: 'Acciones',
|
||||
searchable: false,
|
||||
orderable: false,
|
||||
render: function (data, type, full, meta) {
|
||||
return ('<div class="d-flex align-items-center">' +
|
||||
'<a href="' + show_route.replace('0~0', full['id']) + '" class="btn btn-icon btn-text-secondary waves-effect waves-light rounded-pill"><i class="ti ti-eye ti-md"></i></a>' +
|
||||
'<a href="javascript:;"" wire:click.prevent="edit(' + full['id'] + ')" class="btn btn-icon btn-text-secondary waves-effect waves-light rounded-pill"><i class="ti ti-edit ti-md"></i></a>' +
|
||||
@can('system.users.destroy')
|
||||
'<a href="javascript:;" class="btn btn-icon btn-text-secondary waves-effect waves-light rounded-pill dropdown-toggle hide-arrow" data-bs-toggle="dropdown"><i class="ti ti-dots-vertical ti-md"></i></a>' +
|
||||
'<div class="dropdown-menu dropdown-menu-end m-0">' +
|
||||
'<a href="javascript:;" class="dropdown-item delete-record">Eliminar</a>' +
|
||||
'</div>' +
|
||||
@endcan
|
||||
'</div>');
|
||||
}
|
||||
}
|
||||
],
|
||||
order: [[2, 'desc']],
|
||||
dom:
|
||||
'<"row"' +
|
||||
'<"col-md-2"<"ms-n2"l>>' +
|
||||
'<"col-md-10"<"dt-action-buttons text-xl-end text-lg-start text-md-end text-start d-flex align-items-center justify-content-end flex-md-row flex-column mb-6 mb-md-0 mt-n6 mt-md-0"<"user_role dataTables_filter">fB>>' +
|
||||
'>t' +
|
||||
'<"row"' +
|
||||
'<"col-sm-12 col-md-6"i>' +
|
||||
'<"col-sm-12 col-md-6"p>' +
|
||||
'>',
|
||||
language: $.fn.dataTable.ext.datatable_spanish_default,
|
||||
// Buttons with Dropdown
|
||||
buttons: [
|
||||
{
|
||||
extend: 'collection',
|
||||
className: 'btn btn-label-secondary dropdown-toggle mx-4 waves-effect waves-light',
|
||||
text: '<i class="ti ti-upload me-2 ti-xs"></i>Exportar',
|
||||
buttons: [
|
||||
{
|
||||
extend: 'print',
|
||||
text: '<i class="ti ti-printer me-2" ></i>Imprimir',
|
||||
className: 'dropdown-item',
|
||||
exportOptions: {
|
||||
columns: [1, 2, 3, 4, 5],
|
||||
// prevent avatar to be print
|
||||
format: {
|
||||
body: function (inner, coldex, rowdex) {
|
||||
if (inner.length <= 0) return inner;
|
||||
var el = $.parseHTML(inner);
|
||||
var result = '';
|
||||
$.each(el, function (index, item) {
|
||||
if (item.classList !== undefined && item.classList.contains('user-name')) {
|
||||
result = result + item.lastChild.firstChild.textContent;
|
||||
} else if (item.innerText === undefined) {
|
||||
result = result + item.textContent;
|
||||
} else result = result + item.innerText;
|
||||
});
|
||||
return result;
|
||||
}
|
||||
}
|
||||
},
|
||||
customize: function (win) {
|
||||
//customize print view for dark
|
||||
$(win.document.body)
|
||||
.css('color', headingColor)
|
||||
.css('border-color', borderColor)
|
||||
.css('background-color', bodyBg);
|
||||
$(win.document.body)
|
||||
.find('table')
|
||||
.addClass('compact')
|
||||
.css('color', 'inherit')
|
||||
.css('border-color', 'inherit')
|
||||
.css('background-color', 'inherit');
|
||||
}
|
||||
},
|
||||
{
|
||||
extend: 'csv',
|
||||
text: '<i class="ti ti-file-text me-2" ></i>Csv',
|
||||
className: 'dropdown-item',
|
||||
exportOptions: {
|
||||
columns: [1, 2, 3, 4, 5],
|
||||
// prevent avatar to be display
|
||||
format: {
|
||||
body: function (inner, coldex, rowdex) {
|
||||
if (inner.length <= 0) return inner;
|
||||
var el = $.parseHTML(inner);
|
||||
var result = '';
|
||||
$.each(el, function (index, item) {
|
||||
if (item.classList !== undefined && item.classList.contains('user-name')) {
|
||||
result = result + item.lastChild.firstChild.textContent;
|
||||
} else if (item.innerText === undefined) {
|
||||
result = result + item.textContent;
|
||||
} else result = result + item.innerText;
|
||||
});
|
||||
return result;
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
extend: 'excel',
|
||||
text: '<i class="ti ti-file-spreadsheet me-2"></i>Excel',
|
||||
className: 'dropdown-item',
|
||||
exportOptions: {
|
||||
columns: [1, 2, 3, 4, 5],
|
||||
// prevent avatar to be display
|
||||
format: {
|
||||
body: function (inner, coldex, rowdex) {
|
||||
if (inner.length <= 0) return inner;
|
||||
var el = $.parseHTML(inner);
|
||||
var result = '';
|
||||
$.each(el, function (index, item) {
|
||||
if (item.classList !== undefined && item.classList.contains('user-name')) {
|
||||
result = result + item.lastChild.firstChild.textContent;
|
||||
} else if (item.innerText === undefined) {
|
||||
result = result + item.textContent;
|
||||
} else result = result + item.innerText;
|
||||
});
|
||||
return result;
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
/*
|
||||
{
|
||||
extend: 'pdf',
|
||||
text: '<i class="ti ti-file-code-2 me-2"></i>Pdf',
|
||||
className: 'dropdown-item',
|
||||
exportOptions: {
|
||||
columns: [1, 2, 3, 4, 5],
|
||||
// prevent avatar to be display
|
||||
format: {
|
||||
body: function (inner, coldex, rowdex) {
|
||||
if (inner.length <= 0) return inner;
|
||||
var el = $.parseHTML(inner);
|
||||
var result = '';
|
||||
$.each(el, function (index, item) {
|
||||
if (item.classList !== undefined && item.classList.contains('user-name')) {
|
||||
result = result + item.lastChild.firstChild.textContent;
|
||||
} else if (item.innerText === undefined) {
|
||||
result = result + item.textContent;
|
||||
} else result = result + item.innerText;
|
||||
});
|
||||
return result;
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
*/
|
||||
{
|
||||
extend: 'copy',
|
||||
text: '<i class="ti ti-copy me-2" ></i>Copiar',
|
||||
className: 'dropdown-item',
|
||||
exportOptions: {
|
||||
columns: [1, 2, 3, 4, 5],
|
||||
// prevent avatar to be display
|
||||
format: {
|
||||
body: function (inner, coldex, rowdex) {
|
||||
if (inner.length <= 0) return inner;
|
||||
var el = $.parseHTML(inner);
|
||||
var result = '';
|
||||
$.each(el, function (index, item) {
|
||||
if (item.classList !== undefined && item.classList.contains('user-name')) {
|
||||
result = result + item.lastChild.firstChild.textContent;
|
||||
} else if (item.innerText === undefined) {
|
||||
result = result + item.textContent;
|
||||
} else result = result + item.innerText;
|
||||
});
|
||||
return result;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
},
|
||||
@can('system.users.create') {
|
||||
text: '<i class="ti ti-plus me-0 me-sm-1 ti-xs"></i><span class="d-none d-sm-inline-block">Nuevo usuario</span>',
|
||||
className: 'add-new btn btn-primary waves-effect waves-light',
|
||||
attr: {
|
||||
'onclick': 'add_user()',
|
||||
'data-bs-toggle': 'offcanvas',
|
||||
'data-bs-target': '#offcanvasUser'
|
||||
}
|
||||
}
|
||||
@endcan
|
||||
],
|
||||
// For responsive popup
|
||||
responsive: {
|
||||
details: {
|
||||
display: $.fn.dataTable.Responsive.display.modal({
|
||||
header: function (row) {
|
||||
var data = row.data();
|
||||
return 'Details of ' + data['full_name'];
|
||||
}
|
||||
}),
|
||||
type: 'column',
|
||||
renderer: function (api, rowIdx, columns) {
|
||||
var data = $.map(columns, function (col, i) {
|
||||
return col.title !== '' // ? Do not show row in modal popup if title is blank (for check box)
|
||||
? '<tr data-dt-row="' + col.rowIndex + '" data-dt-column="' + col.columnIndex + '">' +
|
||||
'<td>' + col.title + ':' + '</td> ' +
|
||||
'<td>' + col.data + '</td>' +
|
||||
'</tr>'
|
||||
: '';
|
||||
}).join('');
|
||||
|
||||
return data ? $('<table class="table"/><tbody />').append(data) : false;
|
||||
}
|
||||
}
|
||||
},
|
||||
initComplete: function () {
|
||||
this.api()
|
||||
.columns(3)
|
||||
.every(function () {
|
||||
var column = this,
|
||||
select = $('{!! $roles_html_select !!}')
|
||||
.appendTo('.user_role')
|
||||
.on('change', function() {
|
||||
var val = $.fn.dataTable.util.escapeRegex($(this).val());
|
||||
|
||||
column.search(val? val: '', true, false).draw();
|
||||
});
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
// Delete Record
|
||||
$('.datatables-users tbody')
|
||||
.on('click', '.delete-record', function () {
|
||||
var tr = $(this).closest('tr'),
|
||||
data = dt_user.row(tr).data();
|
||||
|
||||
$('#deleteUserModal').modal('show');
|
||||
$('#deleteUserModal .name').html(data.id + ': ' + data.name);
|
||||
|
||||
$('#deleteUserModal').data('userId', data.id);
|
||||
});
|
||||
|
||||
|
||||
// Attach the event listener to the submit button
|
||||
$('#deleteUserModal .btn-submit')
|
||||
.on('click', function (e) {
|
||||
e.preventDefault();
|
||||
|
||||
@this.call('delete', $('#deleteUserModal').data('userId'));
|
||||
});
|
||||
|
||||
|
||||
// Filter form control to default size
|
||||
// ? setTimeout used for multilingual table initialization
|
||||
setTimeout(() => {
|
||||
$('.dataTables_filter .form-control').removeClass('form-control-sm');
|
||||
$('.dataTables_length .form-select').removeClass('form-select-sm');
|
||||
}, 300);
|
||||
|
||||
|
||||
load_js_form();
|
||||
});
|
||||
|
||||
});
|
||||
</script>
|
||||
@endpush
|
||||
7
resources/views/livewire/users/index.blade.php
Normal file
7
resources/views/livewire/users/index.blade.php
Normal file
@ -0,0 +1,7 @@
|
||||
<x-vuexy-admin::table.bootstrap.manager :tagName="$tagName" :datatableConfig="$bt_datatable" :routes="$routes" >
|
||||
<x-slot name="tools">
|
||||
<div class="mb-4 pr-2">
|
||||
<x-vuexy-admin::button.index-off-canvas :label="$singularName" :tagName="$tagName" />
|
||||
</div>
|
||||
</x-slot>
|
||||
</x-vuexy-admin::table.bootstrap.manager>
|
||||
52
resources/views/livewire/users/offcanvas-form.blade.php
Normal file
52
resources/views/livewire/users/offcanvas-form.blade.php
Normal file
@ -0,0 +1,52 @@
|
||||
<div>
|
||||
<x-vuexy-admin::offcanvas.basic :id="$offcanvasId" :tag-name="$tagName">
|
||||
<x-vuexy-admin::form :uid="$uniqueId" :id="$formId" :mode="$mode" wireSubmit="onSubmit">
|
||||
<x-slot name="actions">
|
||||
<x-vuexy-admin::button.offcanvas-buttons :mode="$mode" :tagName="$tagName" />
|
||||
</x-slot>
|
||||
{{-- Usuario --}}
|
||||
<div class="row">
|
||||
<x-vuexy-admin::form.input :uid="$uniqueId" model="code" label="Código de usuario" icon="ti ti-tag" parent-class="col-md-8" autocomplete="off" />
|
||||
</div>
|
||||
<x-vuexy-admin::form.input :uid="$uniqueId" model="name" label="Nombre(s)" />
|
||||
<x-vuexy-admin::form.input :uid="$uniqueId" model="last_name" label="Apellidos" />
|
||||
<hr>
|
||||
|
||||
{{-- Teléfonos y Correos --}}
|
||||
<x-vuexy-admin::form.input type="tel" :uid="$uniqueId" model="tel" label="Teléfono" icon="ti ti-phone" phoneMode="both" />
|
||||
<x-vuexy-admin::form.input type="email" :uid="$uniqueId" model="email" label="Correo electrónico" icon="ti ti-mail" autocomplete="email" inputmode="email" />
|
||||
<hr>
|
||||
|
||||
|
||||
<x-vuexy-admin::form.textarea :uid="$uniqueId" model="notes" label="Notas / Observaciones" />
|
||||
<hr>
|
||||
|
||||
{{-- Estado del Centro de Trabajo --}}
|
||||
<x-vuexy-admin::form.checkbox :uid="$uniqueId" model="is_partner" label="Es socio" switch />
|
||||
<x-vuexy-admin::form.checkbox :uid="$uniqueId" model="is_employee" label="Es empleado" switch />
|
||||
<x-vuexy-admin::form.checkbox :uid="$uniqueId" model="is_prospect" label="Es prospecto" switch />
|
||||
<x-vuexy-admin::form.checkbox :uid="$uniqueId" model="is_customer" label="Es cliente" switch />
|
||||
<x-vuexy-admin::form.checkbox :uid="$uniqueId" model="is_provider" label="Es proveedor" switch />
|
||||
<hr>
|
||||
|
||||
</x-vuexy-admin::form>
|
||||
</x-vuexy-admin::offcanvas.basic>
|
||||
</div>
|
||||
|
||||
@push('page-script')
|
||||
<script>
|
||||
// Evento para inicializar el formulario cuando se carga la página
|
||||
document.addEventListener("DOMContentLoaded", function () {
|
||||
const initializeUserForm = () => {
|
||||
|
||||
};
|
||||
|
||||
var myOffcanvas = document.getElementById('{{ $offcanvasId }}');
|
||||
|
||||
myOffcanvas.addEventListener('show.bs.offcanvas', function () {
|
||||
initializeUserForm();
|
||||
});
|
||||
});
|
||||
|
||||
</script>
|
||||
@endpush
|
||||
1685
resources/views/livewire/users/show.blade.php
Normal file
1685
resources/views/livewire/users/show.blade.php
Normal file
File diff suppressed because it is too large
Load Diff
65
resources/views/notifications/email.blade.php
Normal file
65
resources/views/notifications/email.blade.php
Normal file
@ -0,0 +1,65 @@
|
||||
<x-mail::message>
|
||||
{{-- Imagen con URL o Base64 --}}
|
||||
@if (! empty($image))
|
||||
<img src="{{ $image }}"
|
||||
alt="{{ config('app.name') }}"
|
||||
style="max-width: 85%; height: auto; display: block; margin: 0 auto 10px auto;">
|
||||
@endif
|
||||
|
||||
{{-- Greeting --}}
|
||||
@if (! empty($greeting))
|
||||
# {{ $greeting }}
|
||||
@else
|
||||
@if ($level === 'error')
|
||||
# @lang('Whoops!')
|
||||
@else
|
||||
# @lang('Hello!')
|
||||
@endif
|
||||
@endif
|
||||
|
||||
{{-- Intro Lines --}}
|
||||
@foreach ($introLines as $line)
|
||||
{{ $line }}
|
||||
|
||||
@endforeach
|
||||
|
||||
{{-- Action Button --}}
|
||||
@isset($actionText)
|
||||
<?php
|
||||
$color = match ($level) {
|
||||
'success', 'error' => $level,
|
||||
default => 'primary',
|
||||
};
|
||||
?>
|
||||
<x-mail::button :url="$actionUrl" :color="$color">
|
||||
{{ $actionText }}
|
||||
</x-mail::button>
|
||||
@endisset
|
||||
|
||||
{{-- Outro Lines --}}
|
||||
@foreach ($outroLines as $line)
|
||||
{{ $line }}
|
||||
|
||||
@endforeach
|
||||
|
||||
{{-- Salutation --}}
|
||||
@if (! empty($salutation))
|
||||
{{ $salutation }}
|
||||
@else
|
||||
@lang('Regards,')<br>
|
||||
{{ config('app.name') }}
|
||||
@endif
|
||||
|
||||
{{-- Subcopy --}}
|
||||
@isset($actionText)
|
||||
<x-slot:subcopy>
|
||||
@lang(
|
||||
"If you're having trouble clicking the \":actionText\" button, copy and paste the URL below\n".
|
||||
'into your web browser:',
|
||||
[
|
||||
'actionText' => $actionText,
|
||||
]
|
||||
) <span class="break-all">[{{ $displayableActionUrl }}]({{ $actionUrl }})</span>
|
||||
</x-slot:subcopy>
|
||||
@endisset
|
||||
</x-mail::message>
|
||||
9
resources/views/pages/about.blade.php
Normal file
9
resources/views/pages/about.blade.php
Normal file
@ -0,0 +1,9 @@
|
||||
@php
|
||||
$configData = Helper::appClasses();
|
||||
@endphp
|
||||
|
||||
@extends('vuexy-admin::layouts.vuexy.layoutMaster')
|
||||
|
||||
@section('content')
|
||||
hola
|
||||
@endsection
|
||||
37
resources/views/pages/comingsoon.blade.php
Normal file
37
resources/views/pages/comingsoon.blade.php
Normal file
@ -0,0 +1,37 @@
|
||||
@php
|
||||
$customizerHidden = 'customizer-hide';
|
||||
$configData = Helper::appClasses();
|
||||
@endphp
|
||||
|
||||
@extends('vuexy-admin::layouts.vuexy.layoutMaster')
|
||||
|
||||
@section('title', 'Muy pronto!')
|
||||
|
||||
@push('page-style')
|
||||
@vite(['/resources/scss/pages/page-misc.scss'])
|
||||
@endsection
|
||||
|
||||
@section('content')
|
||||
<!-- Coming Soon -->
|
||||
<div class="container-xxl container-p-y py-4">
|
||||
<div class="misc-wrapper">
|
||||
<h4 class="mb-2 mx-2">Lanzaremos pronto 🚀</h4>
|
||||
<p class="mb-6 mx-2">Nuestro sitio web se inaugurará pronto. ¡Regístrese para recibir una notificación cuando esté listo!</p>
|
||||
<form onsubmit="return false">
|
||||
<div class="mb-0">
|
||||
<div class="mb-0 d-flex gap-4">
|
||||
<input type="text" class="form-control" placeholder="Ingresa tu correo electrónico" autofocus>
|
||||
<button type="submit" class="btn btn-primary">Notificar</button>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
<div class="mt-12">
|
||||
<img src="{{ asset('vendor/vuexy-admin/img/illustrations/page-misc-launching-soon.png') }}" alt="page-misc-launching-soon" width="263" class="img-fluid">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="container-fluid misc-bg-wrapper">
|
||||
<img src="{{ asset('vendor/vuexy-admin/img/illustrations/bg-shape-image-'.$configData['style'].'.png') }}" height="355" alt="page-misc-coming-soon" data-app-light-img="illustrations/bg-shape-image-light.png" data-app-dark-img="illustrations/bg-shape-image-dark.png">
|
||||
</div>
|
||||
<!-- /Coming soon -->
|
||||
@endsection
|
||||
49
resources/views/pages/home.blade.php
Normal file
49
resources/views/pages/home.blade.php
Normal file
@ -0,0 +1,49 @@
|
||||
@php
|
||||
$configData = Helper::appClasses();
|
||||
@endphp
|
||||
|
||||
@extends('vuexy-admin::layouts.vuexy.layoutMaster')
|
||||
|
||||
@section('content')
|
||||
|
||||
<div class="row">
|
||||
<h4>{{ $_admin['title'] }}</h4>
|
||||
<p>Para mayor información al respecto consulta la <a href="{{ config('koneko.documentation') }}" target="_blank" rel="noopener noreferrer">documentación</a>.</p>
|
||||
|
||||
@php
|
||||
use Illuminate\Support\Facades\Auth;
|
||||
|
||||
// Obtener el usuario autenticado
|
||||
$user = Auth::user();
|
||||
|
||||
echo '<pre>';
|
||||
if ($user) {
|
||||
// Imprimir información del usuario
|
||||
echo "Usuario: {$user->name}\n";
|
||||
echo "Email: {$user->email}\n\n";
|
||||
|
||||
// Obtener todos los roles del usuario
|
||||
$roles = $user->roles;
|
||||
|
||||
// Iterar sobre los roles del usuario
|
||||
foreach ($roles as $role) {
|
||||
echo "Rol: {$role->name}\n";
|
||||
|
||||
// Obtener todos los permisos del rol
|
||||
$permissions = $role->permissions;
|
||||
|
||||
// Imprimir los permisos del rol
|
||||
foreach ($permissions as $permission) {
|
||||
echo " - Permiso: {$permission->name}\n";
|
||||
}
|
||||
|
||||
echo "\n";
|
||||
}
|
||||
|
||||
} else {
|
||||
echo "Usuario no autenticado\n";
|
||||
}
|
||||
echo '</pre>';
|
||||
@endphp
|
||||
|
||||
@endsection
|
||||
30
resources/views/pages/under-maintenance.blade.php
Normal file
30
resources/views/pages/under-maintenance.blade.php
Normal file
@ -0,0 +1,30 @@
|
||||
@php
|
||||
$customizerHidden = 'customizer-hide';
|
||||
$configData = Helper::appClasses();
|
||||
@endphp
|
||||
|
||||
@extends('vuexy-admin::layouts.vuexy.layoutMaster')
|
||||
|
||||
@section('title', '¡En mantenimiento!')
|
||||
|
||||
@push('page-style')
|
||||
@vite(['/resources/scss/pages/page-misc.scss'])
|
||||
@endsection
|
||||
|
||||
@section('content')
|
||||
<!--Under Maintenance -->
|
||||
<div class="container-xxl container-p-y">
|
||||
<div class="misc-wrapper">
|
||||
<h4 class="mb-2 mx-2">¡En mantenimiento! 🚧</h4>
|
||||
<p class="mb-6 mx-2">Disculpe las molestias, pero estamos realizando tareas de mantenimiento en estos momentos.</p>
|
||||
<a href="{{ route('admin.core.home.index') }}" class="btn btn-primary">Regresar al inicio</a>
|
||||
<div class="mt-12">
|
||||
<img src="{{ asset('vendor/vuexy-admin/img/illustrations/page-misc-under-maintenance.png') }}" alt="page-misc-under-maintenance" width="550" class="img-fluid">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="container-fluid misc-bg-wrapper misc-under-maintenance-bg-wrapper">
|
||||
<img src="{{ asset('vendor/vuexy-admin/img/illustrations/bg-shape-image-'.$configData['style'].'.png') }}" height="355" alt="page-misc-under-maintenance" data-app-light-img="illustrations/bg-shape-image-light.png" data-app-dark-img="illustrations/bg-shape-image-dark.png">
|
||||
</div>
|
||||
<!-- /Under Maintenance -->
|
||||
@endsection
|
||||
30
resources/views/permissions/index.blade.php
Normal file
30
resources/views/permissions/index.blade.php
Normal file
@ -0,0 +1,30 @@
|
||||
@extends('vuexy-admin::layouts.vuexy.layoutMaster')
|
||||
|
||||
@section('title', 'Permisos del sistema')
|
||||
|
||||
@section('vendor-style')
|
||||
@vite([
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/datatables-bs5/datatables.bootstrap5.scss',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/datatables-responsive-bs5/responsive.bootstrap5.scss',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/datatables-buttons-bs5/buttons.bootstrap5.scss',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/form-validation.scss',
|
||||
])
|
||||
@endsection
|
||||
|
||||
@section('vendor-script')
|
||||
@vite([
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/datatables-bs5/datatables-bootstrap5.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/popular.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/bootstrap5.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/auto-focus.js',
|
||||
])
|
||||
@endsection
|
||||
|
||||
@push('page-script')
|
||||
@vite('vendor/koneko/laravel-vuexy-admin/resources/js/pages/roles-scripts.js/permissions-scripts.js')
|
||||
@endpush
|
||||
|
||||
|
||||
@section('content')
|
||||
@livewire('permissions-index')
|
||||
@endsection
|
||||
38
resources/views/profile/index.blade.php
Normal file
38
resources/views/profile/index.blade.php
Normal file
@ -0,0 +1,38 @@
|
||||
@extends('layouts.vuexy.layoutMaster')
|
||||
|
||||
@php
|
||||
$breadcrumbs = [['link' => 'home', 'name' => 'Home'], ['link' => 'javascript:void(0)', 'name' => 'User'], ['name' => 'Profile']];
|
||||
@endphp
|
||||
|
||||
@section('title', 'Profile')
|
||||
|
||||
|
||||
@section('content')
|
||||
|
||||
@if (Laravel\Fortify\Features::canUpdateProfileInformation())
|
||||
<div class="mb-6">
|
||||
@livewire('profile.update-profile-information-form')
|
||||
</div>
|
||||
@endif
|
||||
|
||||
@if (Laravel\Fortify\Features::enabled(Laravel\Fortify\Features::updatePasswords()))
|
||||
<div class="mb-6">
|
||||
@livewire('profile.update-password-form')
|
||||
</div>
|
||||
@endif
|
||||
|
||||
@if (Laravel\Fortify\Features::canManageTwoFactorAuthentication())
|
||||
<div class="mb-6">
|
||||
@livewire('profile.two-factor-authentication-form')
|
||||
</div>
|
||||
@endif
|
||||
|
||||
<div class="mb-6">
|
||||
@livewire('profile.logout-other-browser-sessions-form')
|
||||
</div>
|
||||
|
||||
@if (Laravel\Jetstream\Jetstream::hasAccountDeletionFeatures())
|
||||
@livewire('profile.delete-user-form')
|
||||
@endif
|
||||
|
||||
@endsection
|
||||
25
resources/views/roles/_delete_modal.blade.php
Normal file
25
resources/views/roles/_delete_modal.blade.php
Normal file
@ -0,0 +1,25 @@
|
||||
<!-- Delete Role Card Modal -->
|
||||
<div class="modal fade" id="roleDeleteModal" tabindex="-1" aria-hidden="true">
|
||||
<div class="modal-dialog modal-dialog-centered1 modal-simple modal-delete-role">
|
||||
<div class="modal-content p-3 p-md-5">
|
||||
<div class="modal-body">
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
||||
<div class="text-center mb-4">
|
||||
<h3 class="role-title mb-2">Eliminar Rol</h3>
|
||||
<p class="role-subtitle text-muted">Se eliminará de forma definitiva</p>
|
||||
</div>
|
||||
<form id="deleteRoleForm" class="row g-3">
|
||||
<input type="hidden" name="id" wire:model='deleteRoleId'>
|
||||
<div class="col-12">
|
||||
<p class="confirmation-text"></p>
|
||||
</div>
|
||||
<div class="col-12 text-center">
|
||||
<button type="submit" class="btn btn-danger me-sm-3 me-1">Eliminar rol</button>
|
||||
<button type="reset" class="btn btn-label-secondary btn-reset" data-bs-dismiss="modal" aria-label="Close">Cancelar</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--/ Delete Role Card Modal -->
|
||||
116
resources/views/roles/_form_modal.blade.php
Normal file
116
resources/views/roles/_form_modal.blade.php
Normal file
@ -0,0 +1,116 @@
|
||||
<!-- Add Role Modal -->
|
||||
<div class="modal fade" id="roleModal" tabindex="-1" aria-hidden="true">
|
||||
<div class="modal-dialog modal-xl modal-dialog-centered modal-add-new-role">
|
||||
<div class="modal-content p-3 p-md-5">
|
||||
<button type="button" class="btn-close btn-pinned" data-bs-dismiss="modal" aria-label="Close"></button>
|
||||
<div class="modal-body">
|
||||
<div class="text-center mb-4">
|
||||
<h3 class="role-title mb-2">{{ $title }}</h3>
|
||||
<p class="role-subtitle text-muted">Configuración de rol de usuario</p>
|
||||
</div>
|
||||
<!-- Role form -->
|
||||
<form id="roleForm" class="row g-3" method="POST">
|
||||
<input type="hidden" name="id" wire:model='roleId'>
|
||||
<div class="col-xl-4 col-md-6 col-12 col-inputs">
|
||||
<div class="mb-1">
|
||||
<label for="name" class="form-label">Nombre del rol</label>
|
||||
<input type="text" name="name" value="" class="form-control" placeholder="Nombre del rol" tabindex="-1" wire:model="name">
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-xl-4 col-md-6 col-12 col-inputs">
|
||||
<div class="mb-1">
|
||||
<label for="style" class="form-label">CSS style</label>
|
||||
<select id="style" name="style" wire:model="style" class="form-select">
|
||||
<option value="">Estilos CSS</option>
|
||||
<option value="info">.info</option>
|
||||
<option value="success">.success</option>
|
||||
<option value="primary">.primary</option>
|
||||
<option value="secondary">.secondary</option>
|
||||
<option value="dark">.dark</option>
|
||||
<option value="danger">.danger</option>
|
||||
<option value="warning">.warning</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<!-- Permission table -->
|
||||
<div class="table-responsive">
|
||||
<table class="table table-flush-spacing">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="text-nowrap fw-bolder">
|
||||
<h4 class="mt-2 pt-50">Permisos de usuario</h4>
|
||||
</td>
|
||||
<td>
|
||||
<div class="form-check">
|
||||
<input class="form-check-input" type="checkbox" id="selectAll" />
|
||||
<label class="form-check-label" for="selectAll">Seleccionar todo</label>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
@foreach ($permissions as $key => $permission)
|
||||
<tr class="permission-row">
|
||||
<td class="text-nowrap fw-bolder">{{ $permission['group_name'] }} - {{ $permission['sub_group_name'] }}</td>
|
||||
<td>
|
||||
<div class="d-flex">
|
||||
@isset($permission['allow'])
|
||||
<div class="form-check me-3 me-lg-5">
|
||||
<label class="form-check-label"> Permitir
|
||||
<input class="form-check-input" type="checkbox" data-type="allow" wire:model="permissionsInputs.{{ str_replace('.', '_', $permission['allow']) }}">
|
||||
</label>
|
||||
</div>
|
||||
@endisset
|
||||
@isset($permission['view'])
|
||||
<div class="form-check me-3 me-lg-5">
|
||||
<label class="form-check-label"> Leer
|
||||
<input class="form-check-input" type="checkbox" data-type="view" wire:model="permissionsInputs.{{ str_replace('.', '_', $permission['view']) }}">
|
||||
</label>
|
||||
</div>
|
||||
@endisset
|
||||
@isset($permission['create'])
|
||||
<div class="form-check me-3 me-lg-5">
|
||||
<label class="form-check-label"> Crear
|
||||
<input class="form-check-input" type="checkbox" data-type="create" wire:model="permissionsInputs.{{ str_replace('.', '_', $permission['create']) }}">
|
||||
</label>
|
||||
</div>
|
||||
@endisset
|
||||
@isset($permission['edit'])
|
||||
<div class="form-check me-3 me-lg-5">
|
||||
<label class="form-check-label"> Modificar
|
||||
<input class="form-check-input" type="checkbox" data-type="edit" wire:model="permissionsInputs.{{ str_replace('.', '_', $permission['edit']) }}">
|
||||
</label>
|
||||
</div>
|
||||
@endisset
|
||||
@isset($permission['cancel'])
|
||||
<div class="form-check me-3 me-lg-5">
|
||||
<label class="form-check-label"> Cancelar
|
||||
<input class="form-check-input" type="checkbox" data-type="cancel" wire:model="permissionsInputs.{{ str_replace('.', '_', $permission['cancel']) }}">
|
||||
</label>
|
||||
</div>
|
||||
@endisset
|
||||
@isset($permission['delete'])
|
||||
<div class="form-check me-3 me-lg-5">
|
||||
<label class="form-check-label"> Eliminar
|
||||
<input class="form-check-input" type="checkbox" data-type="delete" wire:model="permissionsInputs.{{ str_replace('.', '_', $permission['delete']) }}">
|
||||
</label>
|
||||
</div>
|
||||
@endisset
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
@endforeach
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 text-center mt-4">
|
||||
<button type="submit" class="btn btn-primary me-sm-3 me-1">{{ $btn_submit_text }}</button>
|
||||
<button type="reset" class="btn btn-label-secondary" data-bs-dismiss="modal" aria-label="Close">Cancelar</button>
|
||||
</div>
|
||||
</form>
|
||||
<!--/ Add role form -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--/ Add Role Modal -->
|
||||
21
resources/views/roles/index.blade.php
Normal file
21
resources/views/roles/index.blade.php
Normal file
@ -0,0 +1,21 @@
|
||||
@extends('vuexy-admin::layouts.vuexy.layoutMaster')
|
||||
|
||||
@section('title', 'Roles de usuarios')
|
||||
|
||||
@section('vendor-style')
|
||||
@vite([
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/form-validation.scss',
|
||||
])
|
||||
@endsection
|
||||
|
||||
@section('vendor-script')
|
||||
@vite([
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/popular.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/bootstrap5.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/auto-focus.js',
|
||||
])
|
||||
@endsection
|
||||
|
||||
@section('content')
|
||||
@livewire('role-card')
|
||||
@endsection
|
||||
57
resources/views/user-profile/app-access-permission.blade.php
Normal file
57
resources/views/user-profile/app-access-permission.blade.php
Normal file
@ -0,0 +1,57 @@
|
||||
@extends('vuexy-admin::layouts.vuexy.layoutMaster')
|
||||
|
||||
@section('title', 'Permission - Apps')
|
||||
|
||||
@section('vendor-style')
|
||||
@vite([
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/datatables-bs5/datatables.bootstrap5.scss',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/datatables-responsive-bs5/responsive.bootstrap5.scss',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/datatables-buttons-bs5/buttons.bootstrap5.scss',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/form-validation.scss',
|
||||
])
|
||||
@endsection
|
||||
|
||||
@section('vendor-script')
|
||||
@vite([
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/datatables-bs5/datatables-bootstrap5.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/popular.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/bootstrap5.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/auto-focus.js',
|
||||
])
|
||||
@endsection
|
||||
|
||||
@push('page-script')
|
||||
@vite([
|
||||
'Resources/js/app-access-permission.js',
|
||||
'Resources/js/modal-add-permission.js',
|
||||
'Resources/js/modal-edit-permission.js',
|
||||
])
|
||||
@endpush
|
||||
|
||||
@section('content')
|
||||
|
||||
|
||||
<!-- Permission Table -->
|
||||
<div class="card">
|
||||
<div class="card-datatable table-responsive">
|
||||
<table class="datatables-permissions table border-top">
|
||||
<thead>
|
||||
<tr>
|
||||
<th></th>
|
||||
<th></th>
|
||||
<th>Name</th>
|
||||
<th>Assigned To</th>
|
||||
<th>Created Date</th>
|
||||
<th>Actions</th>
|
||||
</tr>
|
||||
</thead>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
<!--/ Permission Table -->
|
||||
|
||||
<!-- Modal -->
|
||||
@include('_partials/_modals/modal-add-permission')
|
||||
@include('_partials/_modals/modal-edit-permission')
|
||||
<!-- /Modal -->
|
||||
@endsection
|
||||
239
resources/views/user-profile/app-access-roles.blade.php
Normal file
239
resources/views/user-profile/app-access-roles.blade.php
Normal file
@ -0,0 +1,239 @@
|
||||
@php
|
||||
$configData = Helper::appClasses();
|
||||
@endphp
|
||||
|
||||
@extends('vuexy-admin::layouts.vuexy.layoutMaster')
|
||||
|
||||
@section('title', 'Roles - Apps')
|
||||
|
||||
@section('vendor-style')
|
||||
@vite([
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/datatables-bs5/datatables.bootstrap5.scss',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/datatables-responsive-bs5/responsive.bootstrap5.scss',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/form-validation.scss',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/datatables-buttons-bs5/buttons.bootstrap5.scss',
|
||||
])
|
||||
@endsection
|
||||
|
||||
@section('vendor-script')
|
||||
@vite([
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/datatables-bs5/datatables-bootstrap5.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/popular.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/bootstrap5.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/auto-focus.js',
|
||||
])
|
||||
@endsection
|
||||
|
||||
@push('page-script')
|
||||
@vite([
|
||||
'Resources/js/app-access-roles.js',
|
||||
'Resources/js/modal-add-role.js',
|
||||
])
|
||||
@endpush
|
||||
|
||||
@section('content')
|
||||
<h4 class="mb-1">Roles List</h4>
|
||||
|
||||
<p class="mb-6">A role provided access to predefined menus and features so that depending on <br> assigned role an administrator can have access to what user needs.</p>
|
||||
<!-- Role cards -->
|
||||
<div class="row g-6">
|
||||
<div class="col-xl-4 col-lg-6 col-md-6">
|
||||
<div class="card">
|
||||
<div class="card-body">
|
||||
<div class="d-flex justify-content-between align-items-center mb-4">
|
||||
<h6 class="fw-normal mb-0 text-body">Total 4 users</h6>
|
||||
<ul class="list-unstyled d-flex align-items-center avatar-group mb-0">
|
||||
<li data-bs-toggle="tooltip" data-popup="tooltip-custom" data-bs-placement="top" title="Vinnie Mostowy" class="avatar pull-up">
|
||||
<img class="rounded-circle" src="{{ asset('assets/img/avatars/5.png') }}" alt="Avatar">
|
||||
</li>
|
||||
<li data-bs-toggle="tooltip" data-popup="tooltip-custom" data-bs-placement="top" title="Allen Rieske" class="avatar pull-up">
|
||||
<img class="rounded-circle" src="{{ asset('assets/img/avatars/12.png') }}" alt="Avatar">
|
||||
</li>
|
||||
<li data-bs-toggle="tooltip" data-popup="tooltip-custom" data-bs-placement="top" title="Julee Rossignol" class="avatar pull-up">
|
||||
<img class="rounded-circle" src="{{ asset('assets/img/avatars/6.png') }}" alt="Avatar">
|
||||
</li>
|
||||
<li data-bs-toggle="tooltip" data-popup="tooltip-custom" data-bs-placement="top" title="Kaith D'souza" class="avatar pull-up">
|
||||
<img class="rounded-circle" src="{{ asset('assets/img/avatars/3.png') }}" alt="Avatar">
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="d-flex justify-content-between align-items-end">
|
||||
<div class="role-heading">
|
||||
<h5 class="mb-1">Administrator</h5>
|
||||
<a href="javascript:;" data-bs-toggle="modal" data-bs-target="#addRoleModal" class="role-edit-modal"><span>Edit Role</span></a>
|
||||
</div>
|
||||
<a href="javascript:void(0);"><i class="ti ti-copy ti-md text-heading"></i></a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-xl-4 col-lg-6 col-md-6">
|
||||
<div class="card">
|
||||
<div class="card-body">
|
||||
<div class="d-flex justify-content-between align-items-center mb-4">
|
||||
<h6 class="fw-normal mb-0 text-body">Total 7 users</h6>
|
||||
<ul class="list-unstyled d-flex align-items-center avatar-group mb-0">
|
||||
<li data-bs-toggle="tooltip" data-popup="tooltip-custom" data-bs-placement="top" title="Jimmy Ressula" class="avatar pull-up">
|
||||
<img class="rounded-circle" src="{{ asset('assets/img/avatars/4.png') }}" alt="Avatar">
|
||||
</li>
|
||||
<li data-bs-toggle="tooltip" data-popup="tooltip-custom" data-bs-placement="top" title="John Doe" class="avatar pull-up">
|
||||
<img class="rounded-circle" src="{{ asset('assets/img/avatars/1.png') }}" alt="Avatar">
|
||||
</li>
|
||||
<li data-bs-toggle="tooltip" data-popup="tooltip-custom" data-bs-placement="top" title="Kristi Lawker" class="avatar pull-up">
|
||||
<img class="rounded-circle" src="{{ asset('assets/img/avatars/2.png') }}" alt="Avatar">
|
||||
</li>
|
||||
<li class="avatar">
|
||||
<span class="avatar-initial rounded-circle pull-up" data-bs-toggle="tooltip" data-bs-placement="bottom" title="4 more">+4</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="d-flex justify-content-between align-items-end">
|
||||
<div class="role-heading">
|
||||
<h5 class="mb-1">Manager</h5>
|
||||
<a href="javascript:;" data-bs-toggle="modal" data-bs-target="#addRoleModal" class="role-edit-modal"><span>Edit Role</span></a>
|
||||
</div>
|
||||
<a href="javascript:void(0);"><i class="ti ti-copy ti-md text-heading"></i></a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-xl-4 col-lg-6 col-md-6">
|
||||
<div class="card">
|
||||
<div class="card-body">
|
||||
<div class="d-flex justify-content-between align-items-center mb-4">
|
||||
<h6 class="fw-normal mb-0 text-body">Total 5 users</h6>
|
||||
<ul class="list-unstyled d-flex align-items-center avatar-group mb-0">
|
||||
<li data-bs-toggle="tooltip" data-popup="tooltip-custom" data-bs-placement="top" title="Andrew Tye" class="avatar pull-up">
|
||||
<img class="rounded-circle" src="{{ asset('assets/img/avatars/6.png') }}" alt="Avatar">
|
||||
</li>
|
||||
<li data-bs-toggle="tooltip" data-popup="tooltip-custom" data-bs-placement="top" title="Rishi Swaat" class="avatar pull-up">
|
||||
<img class="rounded-circle" src="{{ asset('assets/img/avatars/9.png') }}" alt="Avatar">
|
||||
</li>
|
||||
<li data-bs-toggle="tooltip" data-popup="tooltip-custom" data-bs-placement="top" title="Rossie Kim" class="avatar pull-up">
|
||||
<img class="rounded-circle" src="{{ asset('assets/img/avatars/12.png') }}" alt="Avatar">
|
||||
</li>
|
||||
<li class="avatar">
|
||||
<span class="avatar-initial rounded-circle pull-up" data-bs-toggle="tooltip" data-bs-placement="bottom" title="2 more">+2</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="d-flex justify-content-between align-items-end">
|
||||
<div class="role-heading">
|
||||
<h5 class="mb-1">Users</h5>
|
||||
<a href="javascript:;" data-bs-toggle="modal" data-bs-target="#addRoleModal" class="role-edit-modal"><span>Edit Role</span></a>
|
||||
</div>
|
||||
<a href="javascript:void(0);"><i class="ti ti-copy ti-md text-heading"></i></a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-xl-4 col-lg-6 col-md-6">
|
||||
<div class="card">
|
||||
<div class="card-body">
|
||||
<div class="d-flex justify-content-between align-items-center mb-4">
|
||||
<h6 class="fw-normal mb-0 text-body">Total 3 users</h6>
|
||||
<ul class="list-unstyled d-flex align-items-center avatar-group mb-0">
|
||||
<li data-bs-toggle="tooltip" data-popup="tooltip-custom" data-bs-placement="top" title="Kim Karlos" class="avatar pull-up">
|
||||
<img class="rounded-circle" src="{{ asset('assets/img/avatars/3.png') }}" alt="Avatar">
|
||||
</li>
|
||||
<li data-bs-toggle="tooltip" data-popup="tooltip-custom" data-bs-placement="top" title="Katy Turner" class="avatar pull-up">
|
||||
<img class="rounded-circle" src="{{ asset('assets/img/avatars/9.png') }}" alt="Avatar">
|
||||
</li>
|
||||
<li data-bs-toggle="tooltip" data-popup="tooltip-custom" data-bs-placement="top" title="Peter Adward" class="avatar pull-up">
|
||||
<img class="rounded-circle" src="{{ asset('assets/img/avatars/4.png') }}" alt="Avatar">
|
||||
</li>
|
||||
<li class="avatar">
|
||||
<span class="avatar-initial rounded-circle pull-up" data-bs-toggle="tooltip" data-bs-placement="bottom" title="3 more">+3</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="d-flex justify-content-between align-items-end">
|
||||
<div class="role-heading">
|
||||
<h5 class="mb-1">Support</h5>
|
||||
<a href="javascript:;" data-bs-toggle="modal" data-bs-target="#addRoleModal" class="role-edit-modal"><span>Edit Role</span></a>
|
||||
</div>
|
||||
<a href="javascript:void(0);"><i class="ti ti-copy ti-md text-heading"></i></a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-xl-4 col-lg-6 col-md-6">
|
||||
<div class="card">
|
||||
<div class="card-body">
|
||||
<div class="d-flex justify-content-between align-items-center mb-4">
|
||||
<h6 class="fw-normal mb-0 text-body">Total 2 users</h6>
|
||||
<ul class="list-unstyled d-flex align-items-center avatar-group mb-0">
|
||||
<li data-bs-toggle="tooltip" data-popup="tooltip-custom" data-bs-placement="top" title="Kim Merchent" class="avatar pull-up">
|
||||
<img class="rounded-circle" src="{{ asset('assets/img/avatars/10.png') }}" alt="Avatar">
|
||||
</li>
|
||||
<li data-bs-toggle="tooltip" data-popup="tooltip-custom" data-bs-placement="top" title="Sam D'souza" class="avatar pull-up">
|
||||
<img class="rounded-circle" src="{{ asset('assets/img/avatars/13.png') }}" alt="Avatar">
|
||||
</li>
|
||||
<li data-bs-toggle="tooltip" data-popup="tooltip-custom" data-bs-placement="top" title="Nurvi Karlos" class="avatar pull-up">
|
||||
<img class="rounded-circle" src="{{ asset('assets/img/avatars/5.png') }}" alt="Avatar">
|
||||
</li>
|
||||
<li class="avatar">
|
||||
<span class="avatar-initial rounded-circle pull-up" data-bs-toggle="tooltip" data-bs-placement="bottom" title="7 more">+7</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="d-flex justify-content-between align-items-end">
|
||||
<div class="role-heading">
|
||||
<h5 class="mb-1">Restricted User</h5>
|
||||
<a href="javascript:;" data-bs-toggle="modal" data-bs-target="#addRoleModal" class="role-edit-modal"><span>Edit Role</span></a>
|
||||
</div>
|
||||
<a href="javascript:void(0);"><i class="ti ti-copy ti-md text-heading"></i></a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-xl-4 col-lg-6 col-md-6">
|
||||
<div class="card h-100">
|
||||
<div class="row h-100">
|
||||
<div class="col-sm-5">
|
||||
<div class="d-flex align-items-end h-100 justify-content-center mt-sm-0 mt-4">
|
||||
<img src="{{ asset('vendor/vuexy-admin/img/illustrations/add-new-roles.png') }}" class="img-fluid mt-sm-4 mt-md-0" alt="add-new-roles" width="83">
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-7">
|
||||
<div class="card-body text-sm-end text-center ps-sm-0">
|
||||
<button data-bs-target="#addRoleModal" data-bs-toggle="modal" class="btn btn-sm btn-primary mb-4 text-nowrap add-new-role">Add New Role</button>
|
||||
<p class="mb-0"> Add new role, <br> if it doesn't exist.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<h4 class="mt-6 mb-1">Total users with their roles</h4>
|
||||
<p class="mb-0">Find all of your company’s administrator accounts and their associate roles.</p>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<!-- Role Table -->
|
||||
<div class="card">
|
||||
<div class="card-datatable table-responsive">
|
||||
<table class="datatables-users table border-top">
|
||||
<thead>
|
||||
<tr>
|
||||
<th></th>
|
||||
<th></th>
|
||||
<th>User</th>
|
||||
<th>Role</th>
|
||||
<th>Plan</th>
|
||||
<th>Billing</th>
|
||||
<th>Status</th>
|
||||
<th>Actions</th>
|
||||
</tr>
|
||||
</thead>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
<!--/ Role Table -->
|
||||
</div>
|
||||
</div>
|
||||
<!--/ Role cards -->
|
||||
|
||||
<!-- Add Role Modal -->
|
||||
@include('_partials/_modals/modal-add-role')
|
||||
<!-- / Add Role Modal -->
|
||||
@endsection
|
||||
226
resources/views/user-profile/app-user-list.blade.php
Normal file
226
resources/views/user-profile/app-user-list.blade.php
Normal file
@ -0,0 +1,226 @@
|
||||
@extends('vuexy-admin::layouts.vuexy.layoutMaster')
|
||||
|
||||
@section('title', 'User List - Pages')
|
||||
|
||||
@section('vendor-style')
|
||||
@vite([
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/datatables-bs5/datatables.bootstrap5.scss',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/datatables-responsive-bs5/responsive.bootstrap5.scss',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/datatables-buttons-bs5/buttons.bootstrap5.scss',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/select2/select2.scss',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/form-validation.scss'
|
||||
])
|
||||
@endsection
|
||||
|
||||
@section('vendor-script')
|
||||
@vite([
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/moment/moment.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/datatables-bs5/datatables-bootstrap5.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/select2/select2.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/popular.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/bootstrap5.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/auto-focus.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/cleavejs/cleave.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/cleavejs/cleave-phone.js'
|
||||
])
|
||||
@endsection
|
||||
|
||||
@push('page-script')
|
||||
@vite('Resources/js/app-user-list.js')
|
||||
@endpush
|
||||
|
||||
@section('content')
|
||||
|
||||
<div class="row g-6 mb-6">
|
||||
<div class="col-sm-6 col-xl-3">
|
||||
<div class="card">
|
||||
<div class="card-body">
|
||||
<div class="d-flex align-items-start justify-content-between">
|
||||
<div class="content-left">
|
||||
<span class="text-heading">Session</span>
|
||||
<div class="d-flex align-items-center my-1">
|
||||
<h4 class="mb-0 me-2">21,459</h4>
|
||||
<p class="text-success mb-0">(+29%)</p>
|
||||
</div>
|
||||
<small class="mb-0">Total Users</small>
|
||||
</div>
|
||||
<div class="avatar">
|
||||
<span class="avatar-initial rounded bg-label-primary">
|
||||
<i class="ti ti-users ti-26px"></i>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-6 col-xl-3">
|
||||
<div class="card">
|
||||
<div class="card-body">
|
||||
<div class="d-flex align-items-start justify-content-between">
|
||||
<div class="content-left">
|
||||
<span class="text-heading">Paid Users</span>
|
||||
<div class="d-flex align-items-center my-1">
|
||||
<h4 class="mb-0 me-2">4,567</h4>
|
||||
<p class="text-success mb-0">(+18%)</p>
|
||||
</div>
|
||||
<small class="mb-0">Last week analytics </small>
|
||||
</div>
|
||||
<div class="avatar">
|
||||
<span class="avatar-initial rounded bg-label-danger">
|
||||
<i class="ti ti-user-plus ti-26px"></i>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-6 col-xl-3">
|
||||
<div class="card">
|
||||
<div class="card-body">
|
||||
<div class="d-flex align-items-start justify-content-between">
|
||||
<div class="content-left">
|
||||
<span class="text-heading">Active Users</span>
|
||||
<div class="d-flex align-items-center my-1">
|
||||
<h4 class="mb-0 me-2">19,860</h4>
|
||||
<p class="text-danger mb-0">(-14%)</p>
|
||||
</div>
|
||||
<small class="mb-0">Last week analytics</small>
|
||||
</div>
|
||||
<div class="avatar">
|
||||
<span class="avatar-initial rounded bg-label-success">
|
||||
<i class="ti ti-user-check ti-26px"></i>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-6 col-xl-3">
|
||||
<div class="card">
|
||||
<div class="card-body">
|
||||
<div class="d-flex align-items-start justify-content-between">
|
||||
<div class="content-left">
|
||||
<span class="text-heading">Pending Users</span>
|
||||
<div class="d-flex align-items-center my-1">
|
||||
<h4 class="mb-0 me-2">237</h4>
|
||||
<p class="text-success mb-0">(+42%)</p>
|
||||
</div>
|
||||
<small class="mb-0">Last week analytics</small>
|
||||
</div>
|
||||
<div class="avatar">
|
||||
<span class="avatar-initial rounded bg-label-warning">
|
||||
<i class="ti ti-user-search ti-26px"></i>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Users List Table -->
|
||||
<div class="card">
|
||||
<div class="card-header border-bottom">
|
||||
<h5 class="card-title mb-0">Filters</h5>
|
||||
<div class="d-flex justify-content-between align-items-center row pt-4 gap-4 gap-md-0">
|
||||
<div class="col-md-4 user_role"></div>
|
||||
<div class="col-md-4 user_plan"></div>
|
||||
<div class="col-md-4 user_status"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-datatable table-responsive">
|
||||
<table class="datatables-users table">
|
||||
<thead class="border-top">
|
||||
<tr>
|
||||
<th></th>
|
||||
<th></th>
|
||||
<th>User</th>
|
||||
<th>Role</th>
|
||||
<th>Plan</th>
|
||||
<th>Billing</th>
|
||||
<th>Status</th>
|
||||
<th>Actions</th>
|
||||
</tr>
|
||||
</thead>
|
||||
</table>
|
||||
</div>
|
||||
<!-- Offcanvas to add new user -->
|
||||
<div class="offcanvas offcanvas-end" tabindex="-1" id="offcanvasAddUser" aria-labelledby="offcanvasAddUserLabel">
|
||||
<div class="offcanvas-header border-bottom">
|
||||
<h5 id="offcanvasAddUserLabel" class="offcanvas-title">Add User</h5>
|
||||
<button type="button" class="btn-close text-reset" data-bs-dismiss="offcanvas" aria-label="Close"></button>
|
||||
</div>
|
||||
<div class="offcanvas-body mx-0 flex-grow-0 p-6 h-100">
|
||||
<form class="add-new-user pt-0" id="addNewUserForm" onsubmit="return false">
|
||||
<div class="mb-6">
|
||||
<label class="form-label" for="add-user-fullname">Full Name</label>
|
||||
<input type="text" class="form-control" id="add-user-fullname" placeholder="John Doe" name="userFullname" aria-label="John Doe" />
|
||||
</div>
|
||||
<div class="mb-6">
|
||||
<label class="form-label" for="add-user-email">Email</label>
|
||||
<input type="text" id="add-user-email" class="form-control" placeholder="john.doe@example.com" aria-label="john.doe@example.com" name="userEmail" />
|
||||
</div>
|
||||
<div class="mb-6">
|
||||
<label class="form-label" for="add-user-contact">Contact</label>
|
||||
<input type="text" id="add-user-contact" class="form-control phone-mask" placeholder="+1 (609) 988-44-11" aria-label="john.doe@example.com" name="userContact" />
|
||||
</div>
|
||||
<div class="mb-6">
|
||||
<label class="form-label" for="add-user-company">Company</label>
|
||||
<input type="text" id="add-user-company" class="form-control" placeholder="Web Developer" aria-label="jdoe1" name="companyName" />
|
||||
</div>
|
||||
<div class="mb-6">
|
||||
<label class="form-label" for="country">Country</label>
|
||||
<select id="country" class="select2 form-select">
|
||||
<option value="">Select</option>
|
||||
<option value="Australia">Australia</option>
|
||||
<option value="Bangladesh">Bangladesh</option>
|
||||
<option value="Belarus">Belarus</option>
|
||||
<option value="Brazil">Brazil</option>
|
||||
<option value="Canada">Canada</option>
|
||||
<option value="China">China</option>
|
||||
<option value="France">France</option>
|
||||
<option value="Germany">Germany</option>
|
||||
<option value="India">India</option>
|
||||
<option value="Indonesia">Indonesia</option>
|
||||
<option value="Israel">Israel</option>
|
||||
<option value="Italy">Italy</option>
|
||||
<option value="Japan">Japan</option>
|
||||
<option value="Korea">Korea, Republic of</option>
|
||||
<option value="Mexico">Mexico</option>
|
||||
<option value="Philippines">Philippines</option>
|
||||
<option value="Russia">Russian Federation</option>
|
||||
<option value="South Africa">South Africa</option>
|
||||
<option value="Thailand">Thailand</option>
|
||||
<option value="Turkey">Turkey</option>
|
||||
<option value="Ukraine">Ukraine</option>
|
||||
<option value="United Arab Emirates">United Arab Emirates</option>
|
||||
<option value="United Kingdom">United Kingdom</option>
|
||||
<option value="United States">United States</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="mb-6">
|
||||
<label class="form-label" for="user-role">User Role</label>
|
||||
<select id="user-role" class="form-select">
|
||||
<option value="subscriber">Subscriber</option>
|
||||
<option value="editor">Editor</option>
|
||||
<option value="maintainer">Maintainer</option>
|
||||
<option value="author">Author</option>
|
||||
<option value="admin">Admin</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="mb-6">
|
||||
<label class="form-label" for="user-plan">Select Plan</label>
|
||||
<select id="user-plan" class="form-select">
|
||||
<option value="basic">Basic</option>
|
||||
<option value="enterprise">Enterprise</option>
|
||||
<option value="company">Company</option>
|
||||
<option value="team">Team</option>
|
||||
</select>
|
||||
</div>
|
||||
<button type="submit" class="btn btn-primary me-3 data-submit">Submit</button>
|
||||
<button type="reset" class="btn btn-label-danger" data-bs-dismiss="offcanvas">Cancel</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@endsection
|
||||
305
resources/views/user-profile/app-user-view-account.blade.php
Normal file
305
resources/views/user-profile/app-user-view-account.blade.php
Normal file
@ -0,0 +1,305 @@
|
||||
@extends('vuexy-admin::layouts.vuexy.layoutMaster')
|
||||
|
||||
@section('title', 'User View - Pages')
|
||||
|
||||
@section('vendor-style')
|
||||
@vite([
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/datatables-bs5/datatables.bootstrap5.scss',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/datatables-responsive-bs5/responsive.bootstrap5.scss',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/datatables-buttons-bs5/buttons.bootstrap5.scss',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/animate-css/animate.scss',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/select2/select2.scss',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/form-validation.scss'
|
||||
])
|
||||
@endsection
|
||||
|
||||
@push('page-style')
|
||||
@vite([
|
||||
'Resources/vendor/scss/pages/page-user-view.scss'
|
||||
])
|
||||
@endsection
|
||||
|
||||
@section('vendor-script')
|
||||
@vite([
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/moment/moment.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/datatables-bs5/datatables-bootstrap5.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/cleavejs/cleave.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/cleavejs/cleave-phone.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/select2/select2.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/popular.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/bootstrap5.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/auto-focus.js'
|
||||
])
|
||||
@endsection
|
||||
|
||||
@push('page-script')
|
||||
@vite([
|
||||
'Resources/js/modal-edit-user.js',
|
||||
'Resources/js/app-user-view.js',
|
||||
'Resources/js/app-user-view-account.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/js/auth/pages-profile.js'
|
||||
])
|
||||
@endpush
|
||||
|
||||
@section('content')
|
||||
<div class="row">
|
||||
<!-- User Sidebar -->
|
||||
<div class="col-xl-4 col-lg-5 order-1 order-md-0">
|
||||
<!-- User Card -->
|
||||
<div class="card mb-6">
|
||||
<div class="card-body pt-12">
|
||||
<div class="user-avatar-section">
|
||||
<div class=" d-flex align-items-center flex-column">
|
||||
<img class="img-fluid rounded mb-4" src="{{ asset('assets/img/avatars/1.png') }}" height="120" width="120" alt="User avatar" />
|
||||
<div class="user-info text-center">
|
||||
<h5>Violet Mendoza</h5>
|
||||
<span class="badge bg-label-secondary">Author</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="d-flex justify-content-around flex-wrap my-6 gap-0 gap-md-3 gap-lg-4">
|
||||
<div class="d-flex align-items-center me-5 gap-4">
|
||||
<div class="avatar">
|
||||
<div class="avatar-initial bg-label-primary rounded">
|
||||
<i class='ti ti-checkbox ti-lg'></i>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<h5 class="mb-0">1.23k</h5>
|
||||
<span>Task Done</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="d-flex align-items-center gap-4">
|
||||
<div class="avatar">
|
||||
<div class="avatar-initial bg-label-primary rounded">
|
||||
<i class='ti ti-briefcase ti-lg'></i>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<h5 class="mb-0">568</h5>
|
||||
<span>Project Done</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<h5 class="pb-4 border-bottom mb-4">Details</h5>
|
||||
<div class="info-container">
|
||||
<ul class="list-unstyled mb-6">
|
||||
<li class="mb-2">
|
||||
<span class="h6">Username:</span>
|
||||
<span>@violet.dev</span>
|
||||
</li>
|
||||
<li class="mb-2">
|
||||
<span class="h6">Email:</span>
|
||||
<span>vafgot@vultukir.org</span>
|
||||
</li>
|
||||
<li class="mb-2">
|
||||
<span class="h6">Status:</span>
|
||||
<span>Active</span>
|
||||
</li>
|
||||
<li class="mb-2">
|
||||
<span class="h6">Role:</span>
|
||||
<span>Author</span>
|
||||
</li>
|
||||
<li class="mb-2">
|
||||
<span class="h6">Tax id:</span>
|
||||
<span>Tax-8965</span>
|
||||
</li>
|
||||
<li class="mb-2">
|
||||
<span class="h6">Contact:</span>
|
||||
<span>(123) 456-7890</span>
|
||||
</li>
|
||||
<li class="mb-2">
|
||||
<span class="h6">Languages:</span>
|
||||
<span>French</span>
|
||||
</li>
|
||||
<li class="mb-2">
|
||||
<span class="h6">Country:</span>
|
||||
<span>England</span>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="d-flex justify-content-center">
|
||||
<a href="javascript:;" class="btn btn-primary me-4" data-bs-target="#editUser" data-bs-toggle="modal">Edit</a>
|
||||
<a href="javascript:;" class="btn btn-label-danger suspend-user">Suspend</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- /User Card -->
|
||||
<!-- Plan Card -->
|
||||
<div class="card mb-6 border border-2 border-primary rounded primary-shadow">
|
||||
<div class="card-body">
|
||||
<div class="d-flex justify-content-between align-items-start">
|
||||
<span class="badge bg-label-primary">Standard</span>
|
||||
<div class="d-flex justify-content-center">
|
||||
<sub class="h5 pricing-currency mb-auto mt-1 text-primary">$</sub>
|
||||
<h1 class="mb-0 text-primary">99</h1>
|
||||
<sub class="h6 pricing-duration mt-auto mb-3 fw-normal">month</sub>
|
||||
</div>
|
||||
</div>
|
||||
<ul class="list-unstyled g-2 my-6">
|
||||
<li class="mb-2 d-flex align-items-center"><i class="ti ti-circle-filled ti-10px text-secondary me-2"></i><span>10 Users</span></li>
|
||||
<li class="mb-2 d-flex align-items-center"><i class="ti ti-circle-filled ti-10px text-secondary me-2"></i><span>Up to 10 GB storage</span></li>
|
||||
<li class="mb-2 d-flex align-items-center"><i class="ti ti-circle-filled ti-10px text-secondary me-2"></i><span>Basic Support</span></li>
|
||||
</ul>
|
||||
<div class="d-flex justify-content-between align-items-center mb-1">
|
||||
<span class="h6 mb-0">Days</span>
|
||||
<span class="h6 mb-0">26 of 30 Days</span>
|
||||
</div>
|
||||
<div class="progress mb-1 bg-label-primary" style="height: 6px;">
|
||||
<div class="progress-bar" role="progressbar" style="width: 65%;" aria-valuenow="65" aria-valuemin="0" aria-valuemax="100"></div>
|
||||
</div>
|
||||
<small>4 days remaining</small>
|
||||
<div class="d-grid w-100 mt-6">
|
||||
<button class="btn btn-primary" data-bs-target="#upgradePlanModal" data-bs-toggle="modal">Upgrade Plan</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- /Plan Card -->
|
||||
</div>
|
||||
<!--/ User Sidebar -->
|
||||
|
||||
|
||||
<!-- User Content -->
|
||||
<div class="col-xl-8 col-lg-7 order-0 order-md-1">
|
||||
<!-- User Pills -->
|
||||
<div class="nav-align-top">
|
||||
<ul class="nav nav-pills flex-column flex-md-row flex-wrap mb-6 row-gap-2">
|
||||
<li class="nav-item"><a class="nav-link active" href="javascript:void(0);"><i class="ti ti-user-check ti-sm me-1_5"></i>Account</a></li>
|
||||
<li class="nav-item"><a class="nav-link" href="{{url('app/user/view/security')}}"><i class="ti ti-lock ti-sm me-1_5"></i>Security</a></li>
|
||||
<li class="nav-item"><a class="nav-link" href="{{url('app/user/view/billing')}}"><i class="ti ti-bookmark ti-sm me-1_5"></i>Billing & Plans</a></li>
|
||||
<li class="nav-item"><a class="nav-link" href="{{url('app/user/view/notifications')}}"><i class="ti ti-bell ti-sm me-1_5"></i>Notifications</a></li>
|
||||
<li class="nav-item"><a class="nav-link" href="{{url('app/user/view/connections')}}"><i class="ti ti-link ti-sm me-1_5"></i>Connections</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!--/ User Pills -->
|
||||
|
||||
<!-- Project table -->
|
||||
<div class="card mb-6">
|
||||
<div class="card-datatable table-responsive">
|
||||
<table class="datatables-projects table border-top">
|
||||
<thead>
|
||||
<tr>
|
||||
<th></th>
|
||||
<th></th>
|
||||
<th>Project</th>
|
||||
<th>Leader</th>
|
||||
<th>Team</th>
|
||||
<th class="w-px-200">Progress</th>
|
||||
<th>Action</th>
|
||||
</tr>
|
||||
</thead>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
<!-- /Project table -->
|
||||
|
||||
<!-- Activity Timeline -->
|
||||
<div class="card mb-6">
|
||||
<h5 class="card-header">User Activity Timeline</h5>
|
||||
<div class="card-body pt-1">
|
||||
<ul class="timeline mb-0">
|
||||
<li class="timeline-item timeline-item-transparent">
|
||||
<span class="timeline-point timeline-point-primary"></span>
|
||||
<div class="timeline-event">
|
||||
<div class="timeline-header mb-3">
|
||||
<h6 class="mb-0">12 Invoices have been paid</h6>
|
||||
<small class="text-muted">12 min ago</small>
|
||||
</div>
|
||||
<p class="mb-2">
|
||||
Invoices have been paid to the company
|
||||
</p>
|
||||
<div class="d-flex align-items-center mb-2">
|
||||
<div class="badge bg-lighter rounded d-flex align-items-center">
|
||||
<img src="{{asset('assets/img/icons/misc/pdf.png')}}" alt="img" width="15" class="me-2">
|
||||
<span class="h6 mb-0 text-body">invoices.pdf</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
<li class="timeline-item timeline-item-transparent">
|
||||
<span class="timeline-point timeline-point-success"></span>
|
||||
<div class="timeline-event">
|
||||
<div class="timeline-header mb-3">
|
||||
<h6 class="mb-0">Client Meeting</h6>
|
||||
<small class="text-muted">45 min ago</small>
|
||||
</div>
|
||||
<p class="mb-2">
|
||||
Project meeting with john @10:15am
|
||||
</p>
|
||||
<div class="d-flex justify-content-between flex-wrap gap-2 mb-2">
|
||||
<div class="d-flex flex-wrap align-items-center mb-50">
|
||||
<div class="avatar avatar-sm me-2">
|
||||
<img src="{{ asset('assets/img/avatars/1.png') }}" alt="Avatar" class="rounded-circle" />
|
||||
</div>
|
||||
<div>
|
||||
<p class="mb-0 small fw-medium">Lester McCarthy (Client)</p>
|
||||
<small>CEO of {{ config('koneko.creatorName') }}</small>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
<li class="timeline-item timeline-item-transparent">
|
||||
<span class="timeline-point timeline-point-info"></span>
|
||||
<div class="timeline-event">
|
||||
<div class="timeline-header mb-3">
|
||||
<h6 class="mb-0">Create a new project for client</h6>
|
||||
<small class="text-muted">2 Day Ago</small>
|
||||
</div>
|
||||
<p class="mb-2">
|
||||
6 team members in a project
|
||||
</p>
|
||||
<ul class="list-group list-group-flush">
|
||||
<li class="list-group-item d-flex justify-content-between align-items-center flex-wrap border-top-0 p-0">
|
||||
<div class="d-flex flex-wrap align-items-center">
|
||||
<ul class="list-unstyled users-list d-flex align-items-center avatar-group m-0 me-2">
|
||||
<li data-bs-toggle="tooltip" data-popup="tooltip-custom" data-bs-placement="top" title="Vinnie Mostowy" class="avatar pull-up">
|
||||
<img class="rounded-circle" src="{{ asset('assets/img/avatars/5.png') }}" alt="Avatar" />
|
||||
</li>
|
||||
<li data-bs-toggle="tooltip" data-popup="tooltip-custom" data-bs-placement="top" title="Allen Rieske" class="avatar pull-up">
|
||||
<img class="rounded-circle" src="{{ asset('assets/img/avatars/12.png') }}" alt="Avatar" />
|
||||
</li>
|
||||
<li data-bs-toggle="tooltip" data-popup="tooltip-custom" data-bs-placement="top" title="Julee Rossignol" class="avatar pull-up">
|
||||
<img class="rounded-circle" src="{{ asset('assets/img/avatars/6.png') }}" alt="Avatar" />
|
||||
</li>
|
||||
<li class="avatar">
|
||||
<span class="avatar-initial rounded-circle pull-up text-heading" data-bs-toggle="tooltip" data-bs-placement="bottom" title="3 more">+3</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<!-- /Activity Timeline -->
|
||||
|
||||
<!-- Invoice table -->
|
||||
<div class="card mb-4">
|
||||
<div class="card-datatable table-responsive">
|
||||
<table class="table datatable-invoice">
|
||||
<thead>
|
||||
<tr>
|
||||
<th></th>
|
||||
<th>#</th>
|
||||
<th>Status</th>
|
||||
<th>Total</th>
|
||||
<th>Issued Date</th>
|
||||
<th>Action</th>
|
||||
</tr>
|
||||
</thead>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
<!-- /Invoice table -->
|
||||
</div>
|
||||
<!--/ User Content -->
|
||||
</div>
|
||||
|
||||
<!-- Modal -->
|
||||
@include('_partials/_modals/modal-edit-user')
|
||||
@include('_partials/_modals/modal-upgrade-plan')
|
||||
<!-- /Modal -->
|
||||
@endsection
|
||||
345
resources/views/user-profile/app-user-view-connections.blade.php
Normal file
345
resources/views/user-profile/app-user-view-connections.blade.php
Normal file
@ -0,0 +1,345 @@
|
||||
@extends('vuexy-admin::layouts.vuexy.layoutMaster')
|
||||
|
||||
@section('title', 'User View - Pages')
|
||||
|
||||
@section('vendor-style')
|
||||
@vite([
|
||||
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/select2/select2.scss',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/form-validation.scss'
|
||||
])
|
||||
@endsection
|
||||
|
||||
@push('page-style')
|
||||
@vite('Resources/vendor/scss/pages/page-user-view.scss')
|
||||
@endsection
|
||||
|
||||
@section('vendor-script')
|
||||
@vite([
|
||||
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/cleavejs/cleave.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/cleavejs/cleave-phone.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/select2/select2.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/popular.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/bootstrap5.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/auto-focus.js'
|
||||
])
|
||||
@endsection
|
||||
|
||||
@push('page-script')
|
||||
@vite([
|
||||
'Resources/js/modal-edit-user.js',
|
||||
'Resources/js/app-user-view.js'
|
||||
])
|
||||
@endpush
|
||||
|
||||
@section('content')
|
||||
<div class="row">
|
||||
<!-- User Sidebar -->
|
||||
<div class="col-xl-4 col-lg-5 order-1 order-md-0">
|
||||
<!-- User Card -->
|
||||
<div class="card mb-6">
|
||||
<div class="card-body pt-12">
|
||||
<div class="user-avatar-section">
|
||||
<div class=" d-flex align-items-center flex-column">
|
||||
<img class="img-fluid rounded mb-4" src="{{ asset('assets/img/avatars/1.png') }}" height="120" width="120" alt="User avatar" />
|
||||
<div class="user-info text-center">
|
||||
<h5>Violet Mendoza</h5>
|
||||
<span class="badge bg-label-secondary">Author</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="d-flex justify-content-around flex-wrap my-6 gap-0 gap-md-3 gap-lg-4">
|
||||
<div class="d-flex align-items-center me-5 gap-4">
|
||||
<div class="avatar">
|
||||
<div class="avatar-initial bg-label-primary rounded">
|
||||
<i class='ti ti-checkbox ti-lg'></i>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<h5 class="mb-0">1.23k</h5>
|
||||
<span>Task Done</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="d-flex align-items-center gap-4">
|
||||
<div class="avatar">
|
||||
<div class="avatar-initial bg-label-primary rounded">
|
||||
<i class='ti ti-briefcase ti-lg'></i>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<h5 class="mb-0">568</h5>
|
||||
<span>Project Done</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<h5 class="pb-4 border-bottom mb-4">Details</h5>
|
||||
<div class="info-container">
|
||||
<ul class="list-unstyled mb-6">
|
||||
<li class="mb-2">
|
||||
<span class="h6">Username:</span>
|
||||
<span>@violet.dev</span>
|
||||
</li>
|
||||
<li class="mb-2">
|
||||
<span class="h6">Email:</span>
|
||||
<span>vafgot@vultukir.org</span>
|
||||
</li>
|
||||
<li class="mb-2">
|
||||
<span class="h6">Status:</span>
|
||||
<span>Active</span>
|
||||
</li>
|
||||
<li class="mb-2">
|
||||
<span class="h6">Role:</span>
|
||||
<span>Author</span>
|
||||
</li>
|
||||
<li class="mb-2">
|
||||
<span class="h6">Tax id:</span>
|
||||
<span>Tax-8965</span>
|
||||
</li>
|
||||
<li class="mb-2">
|
||||
<span class="h6">Contact:</span>
|
||||
<span>(123) 456-7890</span>
|
||||
</li>
|
||||
<li class="mb-2">
|
||||
<span class="h6">Languages:</span>
|
||||
<span>French</span>
|
||||
</li>
|
||||
<li class="mb-2">
|
||||
<span class="h6">Country:</span>
|
||||
<span>England</span>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="d-flex justify-content-center">
|
||||
<a href="javascript:;" class="btn btn-primary me-4" data-bs-target="#editUser" data-bs-toggle="modal">Edit</a>
|
||||
<a href="javascript:;" class="btn btn-label-danger suspend-user">Suspend</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- /User Card -->
|
||||
<!-- Plan Card -->
|
||||
<div class="card mb-6 border border-2 border-primary rounded primary-shadow">
|
||||
<div class="card-body">
|
||||
<div class="d-flex justify-content-between align-items-start">
|
||||
<span class="badge bg-label-primary">Standard</span>
|
||||
<div class="d-flex justify-content-center">
|
||||
<sub class="h5 pricing-currency mb-auto mt-1 text-primary">$</sub>
|
||||
<h1 class="mb-0 text-primary">99</h1>
|
||||
<sub class="h6 pricing-duration mt-auto mb-3 fw-normal">month</sub>
|
||||
</div>
|
||||
</div>
|
||||
<ul class="list-unstyled g-2 my-6">
|
||||
<li class="mb-2 d-flex align-items-center"><i class="ti ti-circle-filled ti-10px text-secondary me-2"></i><span>10 Users</span></li>
|
||||
<li class="mb-2 d-flex align-items-center"><i class="ti ti-circle-filled ti-10px text-secondary me-2"></i><span>Up to 10 GB storage</span></li>
|
||||
<li class="mb-2 d-flex align-items-center"><i class="ti ti-circle-filled ti-10px text-secondary me-2"></i><span>Basic Support</span></li>
|
||||
</ul>
|
||||
<div class="d-flex justify-content-between align-items-center mb-1">
|
||||
<span class="h6 mb-0">Days</span>
|
||||
<span class="h6 mb-0">26 of 30 Days</span>
|
||||
</div>
|
||||
<div class="progress mb-1 bg-label-primary" style="height: 6px;">
|
||||
<div class="progress-bar" role="progressbar" style="width: 65%;" aria-valuenow="65" aria-valuemin="0" aria-valuemax="100"></div>
|
||||
</div>
|
||||
<small>4 days remaining</small>
|
||||
<div class="d-grid w-100 mt-6">
|
||||
<button class="btn btn-primary" data-bs-target="#upgradePlanModal" data-bs-toggle="modal">Upgrade Plan</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- /Plan Card -->
|
||||
</div>
|
||||
<!--/ User Sidebar -->
|
||||
|
||||
|
||||
<!-- User Content -->
|
||||
<div class="col-xl-8 col-lg-7 order-0 order-md-1">
|
||||
<!-- User Pills -->
|
||||
<div class="nav-align-top">
|
||||
<ul class="nav nav-pills flex-column flex-md-row mb-6 row-gap-2">
|
||||
<li class="nav-item"><a class="nav-link" href="{{url('app/user/view/account')}}"><i class="ti ti-user-check ti-sm me-1_5"></i>Account</a></li>
|
||||
<li class="nav-item"><a class="nav-link" href="{{url('app/user/view/security')}}"><i class="ti ti-lock ti-sm me-1_5"></i>Security</a></li>
|
||||
<li class="nav-item"><a class="nav-link" href="{{url('app/user/view/billing')}}"><i class="ti ti-bookmark ti-sm me-1_5"></i>Billing & Plans</a></li>
|
||||
<li class="nav-item"><a class="nav-link" href="{{url('app/user/view/notifications')}}"><i class="ti ti-bell ti-sm me-1_5"></i>Notifications</a></li>
|
||||
<li class="nav-item"><a class="nav-link active" href="javascript:void(0);"><i class="ti ti-link ti-sm me-1_5"></i>Connections</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!--/ User Pills -->
|
||||
<!-- Connected Accounts -->
|
||||
<div class="card mb-6">
|
||||
<div class="card-header">
|
||||
<h5 class="mb-0">Connected Accounts</h5>
|
||||
<p class="my-0 card-subtitle">Display content from your connected accounts on your site</p>
|
||||
</div>
|
||||
<div class="card-body pt-0">
|
||||
<div class="d-flex mb-4">
|
||||
<div class="flex-shrink-0">
|
||||
<img src="{{ asset('assets/img/icons/brands/google.png')}}" alt="google" class="me-4" height="36">
|
||||
</div>
|
||||
<div class="flex-grow-1 d-flex align-items-center justify-content-between">
|
||||
<div class="mb-sm-0 mb-2">
|
||||
<h6 class="mb-50">Google</h6>
|
||||
<span class="small">Calendar and contacts</span>
|
||||
</div>
|
||||
<div>
|
||||
<div class="form-check form-switch mb-0">
|
||||
<input type="checkbox" class="form-check-input" checked />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="d-flex mb-4 align-items-center">
|
||||
<div class="flex-shrink-0">
|
||||
<img src="{{ asset('assets/img/icons/brands/slack.png')}}" alt="slack" class="me-4" height="36">
|
||||
</div>
|
||||
<div class="flex-grow-1 d-flex align-items-center justify-content-between">
|
||||
<div class="mb-sm-0 mb-2">
|
||||
<h6 class="mb-50">Slack</h6>
|
||||
<span class="small">Communication</span>
|
||||
</div>
|
||||
<div>
|
||||
<div class="form-check form-switch mb-0">
|
||||
<input type="checkbox" class="form-check-input" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="d-flex mb-4 align-items-center">
|
||||
<div class="flex-shrink-0">
|
||||
<img src="{{ asset('assets/img/icons/brands/github.png')}}" alt="github" class="me-4" height="36">
|
||||
</div>
|
||||
<div class="flex-grow-1 d-flex align-items-center justify-content-between">
|
||||
<div class="mb-sm-0 mb-2">
|
||||
<h6 class="mb-50">Github</h6>
|
||||
<span class="small">Manage your Git repositories</span>
|
||||
</div>
|
||||
<div>
|
||||
<div class="form-check form-switch mb-0">
|
||||
<input type="checkbox" class="form-check-input" checked />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="d-flex mb-4 align-items-center">
|
||||
<div class="flex-shrink-0">
|
||||
<img src="{{ asset('assets/img/icons/brands/mailchimp.png')}}" alt="mailchimp" class="me-4" height="36">
|
||||
</div>
|
||||
<div class="flex-grow-1 d-flex align-items-center justify-content-between">
|
||||
<div class="mb-sm-0 mb-2">
|
||||
<h6 class="mb-50">Mailchimp</h6>
|
||||
<span class="small">Email marketing service</span>
|
||||
</div>
|
||||
<div>
|
||||
<div class="form-check form-switch mb-0">
|
||||
<input type="checkbox" class="form-check-input" checked />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="d-flex align-items-center">
|
||||
<div class="flex-shrink-0">
|
||||
<img src="{{ asset('assets/img/icons/brands/asana.png')}}" alt="asana" class="me-4" height="36">
|
||||
</div>
|
||||
<div class="flex-grow-1 d-flex align-items-center justify-content-between">
|
||||
<div class="mb-sm-0 mb-2">
|
||||
<h6 class="mb-50">Asana</h6>
|
||||
<span class="small">Communication</span>
|
||||
</div>
|
||||
<div>
|
||||
<div class="form-check form-switch mb-0">
|
||||
<input type="checkbox" class="form-check-input" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- /Connected Accounts -->
|
||||
|
||||
<!-- Social Accounts -->
|
||||
<div class="card mb-6">
|
||||
<div class="card-header">
|
||||
<h5 class="mb-0">Social Accounts</h5>
|
||||
<p class="my-0 card-subtitle">Display content from social accounts on your site</p>
|
||||
</div>
|
||||
<div class="card-body pt-0">
|
||||
<div class="d-flex mb-4 align-items-center">
|
||||
<div class="flex-shrink-0">
|
||||
<img src="{{ asset('assets/img/icons/brands/facebook.png')}}" alt="facebook" class="me-4" height="36">
|
||||
</div>
|
||||
<div class="flex-grow-1 row align-items-center me-n1">
|
||||
<div class="col-7 mb-sm-0 mb-2">
|
||||
<h6 class="mb-50">Facebook</h6>
|
||||
<span class="small">Not Connected</span>
|
||||
</div>
|
||||
<div class="col-5 text-end">
|
||||
<button class="btn btn-label-secondary btn-icon"><i class="ti ti-link ti-md"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="d-flex mb-4 align-items-center">
|
||||
<div class="flex-shrink-0">
|
||||
<img src="{{ asset('assets/img/icons/brands/twitter.png')}}" alt="twitter" class="me-4" height="36">
|
||||
</div>
|
||||
<div class="flex-grow-1 row align-items-center me-n1">
|
||||
<div class="col-7 mb-sm-0 mb-2">
|
||||
<h6 class="mb-1">Twitter</h6>
|
||||
<a href="{{config('koneko.twitterUrl')}}" class="small" target="_blank">{{ (!empty(config('koneko.creatorName')) ? config('koneko.creatorName') : '') }}</a>
|
||||
</div>
|
||||
<div class="col-5 text-end">
|
||||
<button class="btn btn-label-danger btn-icon"><i class="ti ti-trash ti-md"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="d-flex mb-4 align-items-center">
|
||||
<div class="flex-shrink-0">
|
||||
<img src="{{ asset('assets/img/icons/brands/linkedin.png')}}" alt="linkedin" class="me-4" height="36">
|
||||
</div>
|
||||
<div class="flex-grow-1 row align-items-center me-n1">
|
||||
<div class="col-7 mb-sm-0 mb-2">
|
||||
<h6 class="mb-1">linkedin</h6>
|
||||
<a href="{{config('koneko.linkedinUrl')}}" class="small" target="_blank">{{ (!empty(config('koneko.creatorName')) ? config('koneko.creatorName') : '') }}</a>
|
||||
</div>
|
||||
<div class="col-5 text-end">
|
||||
<button class="btn btn-label-danger btn-icon"><i class="ti ti-trash ti-md"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="d-flex mb-4 align-items-center">
|
||||
<div class="flex-shrink-0">
|
||||
<img src="{{ asset('assets/img/icons/brands/dribbble.png')}}" alt="dribbble" class="me-4" height="36">
|
||||
</div>
|
||||
<div class="flex-grow-1 row align-items-center me-n1">
|
||||
<div class="col-7 mb-sm-0 mb-2">
|
||||
<h6 class="mb-50">Dribbble</h6>
|
||||
<span class="small">Not Connected</span>
|
||||
</div>
|
||||
<div class="col-5 text-end">
|
||||
<button class="btn btn-label-secondary btn-icon"><i class="ti ti-link ti-md"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="d-flex align-items-center">
|
||||
<div class="flex-shrink-0">
|
||||
<img src="{{ asset('assets/img/icons/brands/behance.png')}}" alt="behance" class="me-4" height="36">
|
||||
</div>
|
||||
<div class="flex-grow-1 row align-items-center me-n1">
|
||||
<div class="col-7 mb-sm-0 mb-2">
|
||||
<h6 class="mb-50">Behance</h6>
|
||||
<span class="small">Not Connected</span>
|
||||
</div>
|
||||
<div class="col-5 text-end">
|
||||
<button class="btn btn-label-secondary btn-icon"><i class="ti ti-link ti-md"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- /Social Accounts -->
|
||||
</div>
|
||||
|
||||
<!-- Modals -->
|
||||
@include('_partials/_modals/modal-edit-user')
|
||||
@include('_partials/_modals/modal-upgrade-plan')
|
||||
<!-- /Modals -->
|
||||
@endsection
|
||||
@ -0,0 +1,277 @@
|
||||
@extends('vuexy-admin::layouts.vuexy.layoutMaster')
|
||||
|
||||
@section('title', 'User View - Pages')
|
||||
|
||||
@section('vendor-style')
|
||||
@vite([
|
||||
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/select2/select2.scss',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/form-validation.scss'
|
||||
])
|
||||
@endsection
|
||||
|
||||
@push('page-style')
|
||||
@vite('Resources/vendor/scss/pages/page-user-view.scss')
|
||||
@endsection
|
||||
|
||||
@section('vendor-script')
|
||||
@vite([
|
||||
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/cleavejs/cleave.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/cleavejs/cleave-phone.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/select2/select2.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/popular.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/bootstrap5.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/auto-focus.js'
|
||||
])
|
||||
@endsection
|
||||
|
||||
@push('page-script')
|
||||
@vite([
|
||||
'Resources/js/modal-edit-user.js',
|
||||
'Resources/js/app-user-view.js'
|
||||
])
|
||||
@endpush
|
||||
|
||||
@section('content')
|
||||
<div class="row">
|
||||
<!-- User Sidebar -->
|
||||
<div class="col-xl-4 col-lg-5 order-1 order-md-0">
|
||||
<!-- User Card -->
|
||||
<div class="card mb-6">
|
||||
<div class="card-body pt-12">
|
||||
<div class="user-avatar-section">
|
||||
<div class=" d-flex align-items-center flex-column">
|
||||
<img class="img-fluid rounded mb-4" src="{{ asset('assets/img/avatars/1.png')}}" height="120" width="120" alt="User avatar" />
|
||||
<div class="user-info text-center">
|
||||
<h5>Violet Mendoza</h5>
|
||||
<span class="badge bg-label-secondary">Author</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="d-flex justify-content-around flex-wrap my-6 gap-0 gap-md-3 gap-lg-4">
|
||||
<div class="d-flex align-items-center me-5 gap-4">
|
||||
<div class="avatar">
|
||||
<div class="avatar-initial bg-label-primary rounded">
|
||||
<i class='ti ti-checkbox ti-lg'></i>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<h5 class="mb-0">1.23k</h5>
|
||||
<span>Task Done</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="d-flex align-items-center gap-4">
|
||||
<div class="avatar">
|
||||
<div class="avatar-initial bg-label-primary rounded">
|
||||
<i class='ti ti-briefcase ti-lg'></i>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<h5 class="mb-0">568</h5>
|
||||
<span>Project Done</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<h5 class="pb-4 border-bottom mb-4">Details</h5>
|
||||
<div class="info-container">
|
||||
<ul class="list-unstyled mb-6">
|
||||
<li class="mb-2">
|
||||
<span class="h6">Username:</span>
|
||||
<span>@violet.dev</span>
|
||||
</li>
|
||||
<li class="mb-2">
|
||||
<span class="h6">Email:</span>
|
||||
<span>vafgot@vultukir.org</span>
|
||||
</li>
|
||||
<li class="mb-2">
|
||||
<span class="h6">Status:</span>
|
||||
<span>Active</span>
|
||||
</li>
|
||||
<li class="mb-2">
|
||||
<span class="h6">Role:</span>
|
||||
<span>Author</span>
|
||||
</li>
|
||||
<li class="mb-2">
|
||||
<span class="h6">Tax id:</span>
|
||||
<span>Tax-8965</span>
|
||||
</li>
|
||||
<li class="mb-2">
|
||||
<span class="h6">Contact:</span>
|
||||
<span>(123) 456-7890</span>
|
||||
</li>
|
||||
<li class="mb-2">
|
||||
<span class="h6">Languages:</span>
|
||||
<span>French</span>
|
||||
</li>
|
||||
<li class="mb-2">
|
||||
<span class="h6">Country:</span>
|
||||
<span>England</span>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="d-flex justify-content-center">
|
||||
<a href="javascript:;" class="btn btn-primary me-4" data-bs-target="#editUser" data-bs-toggle="modal">Edit</a>
|
||||
<a href="javascript:;" class="btn btn-label-danger suspend-user">Suspend</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- /User Card -->
|
||||
<!-- Plan Card -->
|
||||
<div class="card mb-6 border border-2 border-primary rounded primary-shadow">
|
||||
<div class="card-body">
|
||||
<div class="d-flex justify-content-between align-items-start">
|
||||
<span class="badge bg-label-primary">Standard</span>
|
||||
<div class="d-flex justify-content-center">
|
||||
<sub class="h5 pricing-currency mb-auto mt-1 text-primary">$</sub>
|
||||
<h1 class="mb-0 text-primary">99</h1>
|
||||
<sub class="h6 pricing-duration mt-auto mb-3 fw-normal">month</sub>
|
||||
</div>
|
||||
</div>
|
||||
<ul class="list-unstyled g-2 my-6">
|
||||
<li class="mb-2 d-flex align-items-center"><i class="ti ti-circle-filled ti-10px text-secondary me-2"></i><span>10 Users</span></li>
|
||||
<li class="mb-2 d-flex align-items-center"><i class="ti ti-circle-filled ti-10px text-secondary me-2"></i><span>Up to 10 GB storage</span></li>
|
||||
<li class="mb-2 d-flex align-items-center"><i class="ti ti-circle-filled ti-10px text-secondary me-2"></i><span>Basic Support</span></li>
|
||||
</ul>
|
||||
<div class="d-flex justify-content-between align-items-center mb-1">
|
||||
<span class="h6 mb-0">Days</span>
|
||||
<span class="h6 mb-0">26 of 30 Days</span>
|
||||
</div>
|
||||
<div class="progress mb-1 bg-label-primary" style="height: 6px;">
|
||||
<div class="progress-bar" role="progressbar" style="width: 65%;" aria-valuenow="65" aria-valuemin="0" aria-valuemax="100"></div>
|
||||
</div>
|
||||
<small>4 days remaining</small>
|
||||
<div class="d-grid w-100 mt-6">
|
||||
<button class="btn btn-primary" data-bs-target="#upgradePlanModal" data-bs-toggle="modal">Upgrade Plan</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- /Plan Card -->
|
||||
</div>
|
||||
<!--/ User Sidebar -->
|
||||
|
||||
|
||||
<!-- User Content -->
|
||||
<div class="col-xl-8 col-lg-7 order-0 order-md-1">
|
||||
<!-- User Pills -->
|
||||
<div class="nav-align-top">
|
||||
<ul class="nav nav-pills flex-column flex-md-row mb-6 row-gap-2">
|
||||
<li class="nav-item"><a class="nav-link" href="{{url('app/user/view/account')}}"><i class="ti ti-user-check me-1_5 ti-sm"></i>Account</a></li>
|
||||
<li class="nav-item"><a class="nav-link" href="{{url('app/user/view/security')}}"><i class="ti ti-lock me-1_5 ti-sm"></i>Security</a></li>
|
||||
<li class="nav-item"><a class="nav-link" href="{{url('app/user/view/billing')}}"><i class="ti ti-bookmark me-1_5 ti-sm"></i>Billing & Plans</a></li>
|
||||
<li class="nav-item"><a class="nav-link active" href="javascript:void(0);"><i class="ti ti-bell me-1_5 ti-sm"></i>Notifications</a></li>
|
||||
<li class="nav-item"><a class="nav-link" href="{{url('app/user/view/connections')}}"><i class="ti ti-link me-1_5 ti-sm"></i>Connections</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!--/ User Pills -->
|
||||
|
||||
<!-- Project table -->
|
||||
<div class="card mb-6">
|
||||
<!-- Notifications -->
|
||||
<div class="card-header">
|
||||
<h5 class="mb-0">Notifications</h5>
|
||||
<span class="card-subtitle fw-medium">Change to notification settings, the user will get the update</span>
|
||||
</div>
|
||||
<div class="table-responsive">
|
||||
<table class="table">
|
||||
<thead class="border-top">
|
||||
<tr>
|
||||
<th class="text-nowrap">Type</th>
|
||||
<th class="text-nowrap text-center">Email</th>
|
||||
<th class="text-nowrap text-center">Browser</th>
|
||||
<th class="text-nowrap text-center">App</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="text-nowrap text-heading">New for you</td>
|
||||
<td>
|
||||
<div class="form-check d-flex justify-content-center">
|
||||
<input class="form-check-input" type="checkbox" id="defaultCheck1" checked />
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
<div class="form-check d-flex justify-content-center">
|
||||
<input class="form-check-input" type="checkbox" id="defaultCheck2" checked />
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
<div class="form-check d-flex justify-content-center">
|
||||
<input class="form-check-input" type="checkbox" id="defaultCheck3" checked />
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="text-nowrap text-heading">Account activity</td>
|
||||
<td>
|
||||
<div class="form-check d-flex justify-content-center">
|
||||
<input class="form-check-input" type="checkbox" id="defaultCheck4" checked />
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
<div class="form-check d-flex justify-content-center">
|
||||
<input class="form-check-input" type="checkbox" id="defaultCheck5" checked />
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
<div class="form-check d-flex justify-content-center">
|
||||
<input class="form-check-input" type="checkbox" id="defaultCheck6" checked />
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="text-nowrap text-heading">A new browser used to sign in</td>
|
||||
<td>
|
||||
<div class="form-check d-flex justify-content-center">
|
||||
<input class="form-check-input" type="checkbox" id="defaultCheck7" checked />
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
<div class="form-check d-flex justify-content-center">
|
||||
<input class="form-check-input" type="checkbox" id="defaultCheck8" checked />
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
<div class="form-check d-flex justify-content-center">
|
||||
<input class="form-check-input" type="checkbox" id="defaultCheck9" />
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="text-nowrap text-heading">A new device is linked</td>
|
||||
<td>
|
||||
<div class="form-check d-flex justify-content-center">
|
||||
<input class="form-check-input" type="checkbox" id="defaultCheck10" checked />
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
<div class="form-check d-flex justify-content-center">
|
||||
<input class="form-check-input" type="checkbox" id="defaultCheck11" />
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
<div class="form-check d-flex justify-content-center">
|
||||
<input class="form-check-input" type="checkbox" id="defaultCheck12" />
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<button type="submit" class="btn btn-primary me-3">Save changes</button>
|
||||
<button type="reset" class="btn btn-label-secondary">Discard</button>
|
||||
</div>
|
||||
<!-- /Notifications -->
|
||||
</div>
|
||||
<!-- /Project table -->
|
||||
</div>
|
||||
<!--/ User Content -->
|
||||
</div>
|
||||
|
||||
<!-- Modals -->
|
||||
@include('_partials/_modals/modal-edit-user')
|
||||
@include('_partials/_modals/modal-upgrade-plan')
|
||||
<!-- /Modals -->
|
||||
|
||||
@endsection
|
||||
280
resources/views/user-profile/app-user-view-security.blade.php
Normal file
280
resources/views/user-profile/app-user-view-security.blade.php
Normal file
@ -0,0 +1,280 @@
|
||||
@extends('vuexy-admin::layouts.vuexy.layoutMaster')
|
||||
|
||||
@section('title', 'Vista de pagia de usuarios')
|
||||
|
||||
@section('vendor-style')
|
||||
@vite([
|
||||
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/select2/select2.scss',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/form-validation.scss'
|
||||
])
|
||||
@endsection
|
||||
|
||||
@push('page-style')
|
||||
@vite('Resources/vendor/scss/pages/page-user-view.scss')
|
||||
@endsection
|
||||
|
||||
@section('vendor-script')
|
||||
@vite([
|
||||
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/cleavejs/cleave.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/cleavejs/cleave-phone.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/select2/select2.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/popular.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/bootstrap5.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/auto-focus.js'
|
||||
])
|
||||
@endsection
|
||||
|
||||
@push('page-script')
|
||||
@vite([
|
||||
'Resources/js/modal-edit-user.js',
|
||||
'Resources/js/modal-enable-otp.js',
|
||||
'Resources/js/app-user-view.js',
|
||||
'Resources/js/app-user-view-security.js'
|
||||
])
|
||||
@endpush
|
||||
|
||||
@section('content')
|
||||
<div class="row">
|
||||
<!-- User Sidebar -->
|
||||
<div class="col-xl-4 col-lg-5 order-1 order-md-0">
|
||||
<!-- User Card -->
|
||||
<div class="card mb-6">
|
||||
<div class="card-body pt-12">
|
||||
<div class="user-avatar-section">
|
||||
<div class=" d-flex align-items-center flex-column">
|
||||
<img class="img-fluid rounded mb-4" src="{{ asset('assets/img/avatars/1.png') }}" height="120" width="120" alt="User avatar" />
|
||||
<div class="user-info text-center">
|
||||
<h5>Violet Mendoza</h5>
|
||||
<span class="badge bg-label-secondary">Author</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="d-flex justify-content-around flex-wrap my-6 gap-0 gap-md-3 gap-lg-4">
|
||||
<div class="d-flex align-items-center me-5 gap-4">
|
||||
<div class="avatar">
|
||||
<div class="avatar-initial bg-label-primary rounded">
|
||||
<i class='ti ti-checkbox ti-lg'></i>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<h5 class="mb-0">1.23k</h5>
|
||||
<span>Task Done</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="d-flex align-items-center gap-4">
|
||||
<div class="avatar">
|
||||
<div class="avatar-initial bg-label-primary rounded">
|
||||
<i class='ti ti-briefcase ti-lg'></i>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<h5 class="mb-0">568</h5>
|
||||
<span>Project Done</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<h5 class="pb-4 border-bottom mb-4">Details</h5>
|
||||
<div class="info-container">
|
||||
<ul class="list-unstyled mb-6">
|
||||
<li class="mb-2">
|
||||
<span class="h6">Username:</span>
|
||||
<span>@violet.dev</span>
|
||||
</li>
|
||||
<li class="mb-2">
|
||||
<span class="h6">Email:</span>
|
||||
<span>vafgot@vultukir.org</span>
|
||||
</li>
|
||||
<li class="mb-2">
|
||||
<span class="h6">Status:</span>
|
||||
<span>Active</span>
|
||||
</li>
|
||||
<li class="mb-2">
|
||||
<span class="h6">Role:</span>
|
||||
<span>Author</span>
|
||||
</li>
|
||||
<li class="mb-2">
|
||||
<span class="h6">Tax id:</span>
|
||||
<span>Tax-8965</span>
|
||||
</li>
|
||||
<li class="mb-2">
|
||||
<span class="h6">Contact:</span>
|
||||
<span>(123) 456-7890</span>
|
||||
</li>
|
||||
<li class="mb-2">
|
||||
<span class="h6">Languages:</span>
|
||||
<span>French</span>
|
||||
</li>
|
||||
<li class="mb-2">
|
||||
<span class="h6">Country:</span>
|
||||
<span>England</span>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="d-flex justify-content-center">
|
||||
<a href="javascript:;" class="btn btn-primary me-4" data-bs-target="#editUser" data-bs-toggle="modal">Edit</a>
|
||||
<a href="javascript:;" class="btn btn-label-danger suspend-user">Suspend</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- /User Card -->
|
||||
<!-- Plan Card -->
|
||||
<div class="card mb-6 border border-2 border-primary rounded primary-shadow">
|
||||
<div class="card-body">
|
||||
<div class="d-flex justify-content-between align-items-start">
|
||||
<span class="badge bg-label-primary">Standard</span>
|
||||
<div class="d-flex justify-content-center">
|
||||
<sub class="h5 pricing-currency mb-auto mt-1 text-primary">$</sub>
|
||||
<h1 class="mb-0 text-primary">99</h1>
|
||||
<sub class="h6 pricing-duration mt-auto mb-3 fw-normal">month</sub>
|
||||
</div>
|
||||
</div>
|
||||
<ul class="list-unstyled g-2 my-6">
|
||||
<li class="mb-2 d-flex align-items-center"><i class="ti ti-circle-filled ti-10px text-secondary me-2"></i><span>10 Users</span></li>
|
||||
<li class="mb-2 d-flex align-items-center"><i class="ti ti-circle-filled ti-10px text-secondary me-2"></i><span>Up to 10 GB storage</span></li>
|
||||
<li class="mb-2 d-flex align-items-center"><i class="ti ti-circle-filled ti-10px text-secondary me-2"></i><span>Basic Support</span></li>
|
||||
</ul>
|
||||
<div class="d-flex justify-content-between align-items-center mb-1">
|
||||
<span class="h6 mb-0">Days</span>
|
||||
<span class="h6 mb-0">26 of 30 Days</span>
|
||||
</div>
|
||||
<div class="progress mb-1 bg-label-primary" style="height: 6px;">
|
||||
<div class="progress-bar" role="progressbar" style="width: 65%;" aria-valuenow="65" aria-valuemin="0" aria-valuemax="100"></div>
|
||||
</div>
|
||||
<small>4 days remaining</small>
|
||||
<div class="d-grid w-100 mt-6">
|
||||
<button class="btn btn-primary" data-bs-target="#upgradePlanModal" data-bs-toggle="modal">Upgrade Plan</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- /Plan Card -->
|
||||
</div>
|
||||
<!--/ User Sidebar -->
|
||||
|
||||
|
||||
<!-- User Content -->
|
||||
<div class="col-xl-8 col-lg-7 order-0 order-md-1">
|
||||
<!-- User Pills -->
|
||||
<div class="nav-align-top">
|
||||
<ul class="nav nav-pills flex-column flex-md-row mb-6 row-gap-2">
|
||||
<li class="nav-item"><a class="nav-link" href="{{url('app/user/view/account')}}"><i class="ti ti-user-check me-1_5 ti-sm"></i>Account</a></li>
|
||||
<li class="nav-item"><a class="nav-link active" href="javascript:void(0);"><i class="ti ti-lock me-1_5 ti-sm"></i>Security</a></li>
|
||||
<li class="nav-item"><a class="nav-link" href="{{url('app/user/view/billing')}}"><i class="ti ti-bookmark me-1_5 ti-sm"></i>Billing & Plans</a></li>
|
||||
<li class="nav-item"><a class="nav-link" href="{{url('app/user/view/notifications')}}"><i class="ti ti-bell me-1_5 ti-sm"></i>Notifications</a></li>
|
||||
<li class="nav-item"><a class="nav-link" href="{{url('app/user/view/connections')}}"><i class="ti ti-link me-1_5 ti-sm"></i>Connections</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!--/ User Pills -->
|
||||
|
||||
<!-- Change Password -->
|
||||
<div class="card mb-6">
|
||||
<h5 class="card-header">Change Password</h5>
|
||||
<div class="card-body">
|
||||
<form id="formChangePassword" method="POST" onsubmit="return false">
|
||||
<div class="alert alert-warning alert-dismissible" role="alert">
|
||||
<h5 class="alert-heading mb-1">Ensure that these requirements are met</h5>
|
||||
<span>Minimum 8 characters long, uppercase & symbol</span>
|
||||
<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
|
||||
</div>
|
||||
<div class="row gx-6">
|
||||
<div class="mb-4 col-12 col-sm-6 form-password-toggle">
|
||||
<label class="form-label" for="newPassword">New Password</label>
|
||||
<div class="input-group input-group-merge">
|
||||
<input class="form-control" type="password" id="newPassword" name="newPassword" placeholder="············" />
|
||||
<span class="input-group-text cursor-pointer"><i class="ti ti-eye-off"></i></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mb-4 col-12 col-sm-6 form-password-toggle">
|
||||
<label class="form-label" for="confirmPassword">Confirm New Password</label>
|
||||
<div class="input-group input-group-merge">
|
||||
<input class="form-control" type="password" name="confirmPassword" id="confirmPassword" placeholder="············" />
|
||||
<span class="input-group-text cursor-pointer"><i class="ti ti-eye-off"></i></span>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<button type="submit" class="btn btn-primary me-2">Change Password</button>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
<!--/ Change Password -->
|
||||
|
||||
<!-- Two-steps verification -->
|
||||
<div class="card mb-6">
|
||||
<div class="card-header">
|
||||
<h5 class="mb-0">Two-steps verification</h5>
|
||||
<span class="card-subtitle mt-0">Keep your account secure with authentication step.</span>
|
||||
</div>
|
||||
<div class="card-body pt-0">
|
||||
<h6 class="mb-1">SMS</h6>
|
||||
<div class="mb-4">
|
||||
<div class="d-flex w-100 action-icons">
|
||||
<input id="defaultInput" class="form-control me-4" type="text" placeholder="+1(968) 945-8832">
|
||||
<a href="javascript:;" class="btn btn-icon btn-text-secondary" data-bs-target="#enableOTP" data-bs-toggle="modal"><i class="ti ti-edit ti-md"></i></a>
|
||||
<a href="javascript:;" class="btn btn-icon btn-text-secondary"><i class="ti ti-trash ti-md"></i></a>
|
||||
</div>
|
||||
</div>
|
||||
<p class="mb-0">Two-factor authentication adds an additional layer of security to your account by requiring more than just a password to log in.
|
||||
<a href="javascript:void(0);" class="text-primary">Learn more.</a>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<!--/ Two-steps verification -->
|
||||
|
||||
<!-- Recent Devices -->
|
||||
<div class="card mb-6">
|
||||
<h5 class="card-header">Recent Devices</h5>
|
||||
<div class="table-responsive table-border-bottom-0">
|
||||
<table class="table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th class="text-truncate">Browser</th>
|
||||
<th class="text-truncate">Device</th>
|
||||
<th class="text-truncate">Location</th>
|
||||
<th class="text-truncate">Recent Activities</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="text-truncate"><i class='ti ti-brand-windows ti-md text-info me-4'></i> <span class="text-heading">Chrome on Windows</span></td>
|
||||
<td class="text-truncate">HP Spectre 360</td>
|
||||
<td class="text-truncate">Switzerland</td>
|
||||
<td class="text-truncate">10, July 2021 20:07</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="text-truncate"><i class='ti ti-device-mobile ti-md text-danger me-4'></i> <span class="text-heading">Chrome on iPhone</span></td>
|
||||
<td class="text-truncate">iPhone 12x</td>
|
||||
<td class="text-truncate">Australia</td>
|
||||
<td class="text-truncate">13, July 2021 10:10</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="text-truncate"><i class='ti ti-brand-android ti-md text-success me-4'></i> <span class="text-heading">Chrome on Android</span></td>
|
||||
<td class="text-truncate">Oneplus 9 Pro</td>
|
||||
<td class="text-truncate">Dubai</td>
|
||||
<td class="text-truncate">14, July 2021 15:15</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="text-truncate"><i class='ti ti-brand-apple ti-md me-4'></i> <span class="text-heading">Chrome on MacOS</span></td>
|
||||
<td class="text-truncate">Apple iMac</td>
|
||||
<td class="text-truncate">India</td>
|
||||
<td class="text-truncate">16, July 2021 16:17</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
<!--/ Recent Devices -->
|
||||
</div>
|
||||
<!--/ User Content -->
|
||||
</div>
|
||||
|
||||
<!-- Modals -->
|
||||
@include('_partials/_modals/modal-edit-user')
|
||||
@include('_partials/_modals/modal-enable-otp')
|
||||
@include('_partials/_modals/modal-upgrade-plan')
|
||||
<!-- /Modals -->
|
||||
|
||||
@endsection
|
||||
7
resources/views/user-profile/index.blade.php
Normal file
7
resources/views/user-profile/index.blade.php
Normal file
@ -0,0 +1,7 @@
|
||||
@extends('vuexy-admin::layouts.vuexy.layoutMaster')
|
||||
|
||||
@section('title', 'Configuraciones de cuenta | ' . $user->name)
|
||||
|
||||
@section('content')
|
||||
|
||||
@endsection
|
||||
29
resources/views/users/index.blade.php
Normal file
29
resources/views/users/index.blade.php
Normal file
@ -0,0 +1,29 @@
|
||||
@extends('vuexy-admin::layouts.vuexy.layoutMaster')
|
||||
|
||||
@section('title', 'Usuarios')
|
||||
|
||||
@section('vendor-style')
|
||||
@vite([
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/select2/select2.scss',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/bootstrap-table/bootstrap-table.scss',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/fonts/bootstrap-icons.scss',
|
||||
])
|
||||
@endsection
|
||||
|
||||
@section('vendor-script')
|
||||
@vite([
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/select2/select2.js',
|
||||
])
|
||||
@endsection
|
||||
|
||||
@push('page-script')
|
||||
@vite([
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/js/bootstrap-table/bootstrapTableManager.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/js/forms/formConvasHelper.js',
|
||||
])
|
||||
@endpush
|
||||
|
||||
@section('content')
|
||||
@livewire('user-index')
|
||||
@livewire('user-offcanvas-form')
|
||||
@endsection
|
||||
214
resources/views/users/show.blade.php
Normal file
214
resources/views/users/show.blade.php
Normal file
@ -0,0 +1,214 @@
|
||||
@extends('vuexy-admin::layouts.vuexy.layoutMaster')
|
||||
|
||||
@section('title', 'Usuario | ' . $user->name)
|
||||
|
||||
@section('vendor-style')
|
||||
{{-- Page Css files --}}
|
||||
@vite([
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/datatables-bs5/datatables.bootstrap5.scss',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/datatables-responsive-bs5/responsive.bootstrap5.scss',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/datatables-buttons-bs5/buttons.bootstrap5.scss',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/animate-css/animate.scss',
|
||||
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/select2/select2.scss',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/form-validation.scss'
|
||||
])
|
||||
@endsection
|
||||
|
||||
@push('page-style')
|
||||
{{-- Page Css files --}}
|
||||
@vite([
|
||||
'Resources/vendor/scss/pages/page-user-view.scss'
|
||||
])
|
||||
@endsection
|
||||
|
||||
@section('content')
|
||||
<section class="app-user-view-account">
|
||||
<div class="row">
|
||||
<!-- User Sidebar -->
|
||||
<div class="col-xl-4 col-lg-5 col-md-5 order-1 order-md-0">
|
||||
<!-- User Card -->
|
||||
<div class="card">
|
||||
<div class="card-body">
|
||||
<div class="user-avatar-section">
|
||||
<div class="d-flex align-items-center flex-column">
|
||||
<img class="img-fluid rounded mt-3 mb-2"
|
||||
src="{{ $user->profile_photo_url }}"
|
||||
height="110"
|
||||
width="110"
|
||||
alt="User avatar"/>
|
||||
<div class="user-info text-center">
|
||||
<h4>{{ $user->name }}</h4>
|
||||
<span class="badge bg-light-secondary">Author</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="d-flex justify-content-around my-2 pt-75">
|
||||
<div class="d-flex align-items-start me-2">
|
||||
<span class="badge bg-light-primary p-75 rounded">
|
||||
<i data-feather="check" class="font-medium-2"></i>
|
||||
</span>
|
||||
<div class="ms-75">
|
||||
<h4 class="mb-0">1.23k</h4>
|
||||
<small>Tasks Done</small>
|
||||
</div>
|
||||
</div>
|
||||
<div class="d-flex align-items-start">
|
||||
<span class="badge bg-light-primary p-75 rounded">
|
||||
<i data-feather="briefcase" class="font-medium-2"></i>
|
||||
</span>
|
||||
<div class="ms-75">
|
||||
<h4 class="mb-0">568</h4>
|
||||
<small>Projects Done</small>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<h4 class="fw-bolder border-bottom pb-50 mb-1">Detalles</h4>
|
||||
<div class="info-container">
|
||||
<ul class="list-unstyled">
|
||||
<li class="mb-75">
|
||||
<span class="fw-bolder me-25">Nombre:</span>
|
||||
<span>{{ $user->name }}</span>
|
||||
</li>
|
||||
<li class="mb-75">
|
||||
<span class="fw-bolder me-25">Correo eletrónico:</span>
|
||||
<span>{{ $user->email }}</span>
|
||||
</li>
|
||||
<li class="mb-75">
|
||||
<span class="fw-bolder me-25">Status:</span>
|
||||
@if ($user->status)
|
||||
<span class="badge bg-light-{{ Koneko\VuexyAdmin\Models\User::$statusListClass[$user->status] }}">{{ Koneko\VuexyAdmin\Models\User::$statusList[$user->status] }}</span>
|
||||
@endif
|
||||
</li>
|
||||
<li class="mb-75">
|
||||
<span class="fw-bolder me-25">Role:</span>
|
||||
@foreach ($user->getRoleNames() as $role)
|
||||
<span class="badge bg-light-{{ Spatie\Permission\Models\Role::where('name', $role)->first()->style }}">{{ $role }}</span>
|
||||
@endforeach
|
||||
</li>
|
||||
</ul>
|
||||
<div class="d-flex justify-content-center pt-2">
|
||||
<a href="javascript:;" class="btn btn-primary me-1" data-bs-target="#editUser" data-bs-toggle="modal">Editar</a>
|
||||
<a href="javascript:;" class="btn btn-outline-danger suspend-user">Suspender</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- /User Card -->
|
||||
</div>
|
||||
<!--/ User Sidebar -->
|
||||
|
||||
<!-- User Content -->
|
||||
<div class="col-xl-8 col-lg-7 col-md-7 order-0 order-md-1">
|
||||
<!-- User Pills -->
|
||||
<ul class="nav nav-pills mb-2">
|
||||
<li class="nav-item">
|
||||
<a class="nav-link active" href="{{asset('app/user/view/account')}}">
|
||||
<i data-feather="user" class="font-medium-3 me-50"></i>
|
||||
<span class="fw-bold">Account</span></a
|
||||
>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="{{asset('app/user/view/security')}}">
|
||||
<i data-feather="lock" class="font-medium-3 me-50"></i>
|
||||
<span class="fw-bold">Security</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<!--/ User Pills -->
|
||||
|
||||
<!-- Activity Timeline -->
|
||||
<div class="card">
|
||||
<h4 class="card-header">User Activity Timeline</h4>
|
||||
<div class="card-body pt-1">
|
||||
<ul class="timeline ms-50">
|
||||
<li class="timeline-item">
|
||||
<span class="timeline-point timeline-point-indicator"></span>
|
||||
<div class="timeline-event">
|
||||
<div class="d-flex justify-content-between flex-sm-row flex-column mb-sm-0 mb-1">
|
||||
<h6>User login</h6>
|
||||
<span class="timeline-event-time me-1">12 min ago</span>
|
||||
</div>
|
||||
<p>User login at 2:12pm</p>
|
||||
</div>
|
||||
</li>
|
||||
<li class="timeline-item">
|
||||
<span class="timeline-point timeline-point-warning timeline-point-indicator"></span>
|
||||
<div class="timeline-event">
|
||||
<div class="d-flex justify-content-between flex-sm-row flex-column mb-sm-0 mb-1">
|
||||
<h6>Meeting with john</h6>
|
||||
<span class="timeline-event-time me-1">45 min ago</span>
|
||||
</div>
|
||||
<p>React Project meeting with john @10:15am</p>
|
||||
<div class="d-flex flex-row align-items-center mb-50">
|
||||
<div class="avatar me-50">
|
||||
<img
|
||||
src="{{asset('images/portrait/small/avatar-s-7.jpg')}}"
|
||||
alt="Avatar"
|
||||
width="38"
|
||||
height="38"
|
||||
/>
|
||||
</div>
|
||||
<div class="user-info">
|
||||
<h6 class="mb-0">Leona Watkins (Client)</h6>
|
||||
<p class="mb-0">CEO of pixinvent</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
<li class="timeline-item">
|
||||
<span class="timeline-point timeline-point-info timeline-point-indicator"></span>
|
||||
<div class="timeline-event">
|
||||
<div class="d-flex justify-content-between flex-sm-row flex-column mb-sm-0 mb-1">
|
||||
<h6>Create a new react project for client</h6>
|
||||
<span class="timeline-event-time me-1">2 day ago</span>
|
||||
</div>
|
||||
<p>Add files to new design folder</p>
|
||||
</div>
|
||||
</li>
|
||||
<li class="timeline-item">
|
||||
<span class="timeline-point timeline-point-danger timeline-point-indicator"></span>
|
||||
<div class="timeline-event">
|
||||
<div class="d-flex justify-content-between flex-sm-row flex-column mb-sm-0 mb-1">
|
||||
<h6>Create Invoices for client</h6>
|
||||
<span class="timeline-event-time me-1">12 min ago</span>
|
||||
</div>
|
||||
<p class="mb-0">Create new Invoices and send to Leona Watkins</p>
|
||||
<div class="d-flex flex-row align-items-center mt-50">
|
||||
<img class="me-1" src="{{asset('images/icons/pdf.png')}}" alt="data.json" height="25" />
|
||||
<h6 class="mb-0">Invoices.pdf</h6>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<!-- /Activity Timeline -->
|
||||
</div>
|
||||
<!--/ User Content -->
|
||||
</div>
|
||||
</section>
|
||||
@endsection
|
||||
|
||||
@section('vendor-script')
|
||||
@vite([
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/moment/moment.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/datatables-bs5/datatables-bootstrap5.js',
|
||||
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/cleavejs/cleave.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/cleavejs/cleave-phone.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/select2/select2.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/popular.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/bootstrap5.js',
|
||||
'vendor/koneko/laravel-vuexy-admin/resources/assets/vendor/libs/@form-validation/auto-focus.js'
|
||||
])
|
||||
@endsection
|
||||
|
||||
@push('page-script')
|
||||
@vite([
|
||||
'Resources/js/modal-edit-user.js',
|
||||
'Resources/js/app-user-view.js',
|
||||
'Resources/js/app-user-view-account.js',
|
||||
'Resources/js/pages-profile.js'
|
||||
])
|
||||
@endpush
|
||||
Reference in New Issue
Block a user