spatie form packages

This commit is contained in:
Ranjan 2024-04-07 13:43:06 +05:45
parent cfd2147536
commit 4f34db3381
7 changed files with 403 additions and 24 deletions

View File

@ -5,7 +5,6 @@ namespace Modules\Employee\Http\Controllers;
use App\Http\Controllers\Controller;
use Illuminate\Http\RedirectResponse;
use Illuminate\Http\Request;
use Illuminate\Http\Response;
class EmployeeController extends Controller
{
@ -22,7 +21,8 @@ class EmployeeController extends Controller
*/
public function create()
{
return view('employee::create');
$data['title'] = 'Create Employee';
return view('employee::create', $data);
}
/**

View File

@ -0,0 +1,26 @@
@extends('layouts.app')
@section('content')
<div class="page-content">
<div class="container-fluid">
<!-- start page title -->
@include('layouts.partials.breadcrumb', ['title' => $title])
<!-- end page title -->
<form action="{{ route('employee.store') }}" class="needs-validation" novalidate method="post">
@csrf
@include('employee::partials.action')
</form>
<!--end row-->
</div>
<!-- container-fluid -->
</div>
@endsection
@push('js')
<script src="{{ asset('assets/js/pages/form-validation.init.js') }}"></script>
@endpush

View File

@ -14,8 +14,7 @@
<div class="row g-2">
<div class="col-sm-4">
<div class="search-box">
<input type="text" class="form-control" id="searchMemberList"
placeholder="Search for name or designation...">
<input type="text" class="form-control" id="searchMemberList" placeholder="Search for name...">
<i class="ri-search-line search-icon"></i>
</div>
</div>
@ -23,8 +22,8 @@
<div class="col-sm-auto ms-auto">
<div class="list-grid-nav hstack gap-1">
<button class="btn btn-success addMembers-modal" data-bs-toggle="modal"
data-bs-target="#addmemberModal"><i class="ri-add-fill me-1 align-bottom"></i> Create Employee</button>
<a class="btn btn-success" href="{{ route('employee.create') }}"><i
class="ri-add-fill me-1 align-bottom"></i> Create Employee</a>
</div>
</div>
@ -221,13 +220,8 @@
</div>
</div>
</div>
</div>
</div>
</div>
</div><!-- end col -->
</div>

View File

@ -0,0 +1,279 @@
<div class="row">
<div class="col-lg-12">
<div class="card">
<div class="card-header">
<h4 class="card-title mb-0">Personal Details</h4>
</div>
<div class="card-body row">
<div class="col-md-4">
{{ html()->label('First name')->class('form-label') }}
{{ html()->text('first_name')->class('form-control')->placeholder('Enter First Name')->required() }}
</div>
<div class="col-md-4">
{{ html()->label('Middle name')->class('form-label') }}
{{ html()->text('middle_name')->class('form-control')->placeholder('Enter Middle Name') }}
</div>
<div class="col-md-4">
<label class="form-label" for="project-title-input">Project Title</label>
<input type="text" class="form-control" id="project-title-input" placeholder="Enter project title">
</div>
<div class="col-md-4">
<label class="form-label" for="project-thumbnail-img">Thumbnail Image</label>
<input class="form-control" id="project-thumbnail-img" type="file"
accept="image/png, image/gif, image/jpeg">
</div>
</div>
<!-- end card body -->
</div>
<!-- end card -->
<div class="card">
<div class="card-header">
<h5 class="card-title mb-0">Attached files</h5>
</div>
<div class="card-body">
<div>
<p class="text-muted">Add Attached files here.</p>
<div class="dropzone dz-clickable">
<div class="dz-message needsclick">
<div class="mb-3">
<i class="display-4 text-muted ri-upload-cloud-2-fill"></i>
</div>
<h5>Drop files here or click to upload.</h5>
</div>
</div>
<ul class="list-unstyled mb-0" id="dropzone-preview">
</ul>
<!-- end dropzon-preview -->
</div>
</div>
</div>
<!-- end card -->
<div class="mb-4 text-start">
<button type="submit" class="btn btn-danger w-sm">Delete</button>
<button type="submit" class="btn btn-secondary w-sm">Draft</button>
<button type="submit" class="btn btn-success w-sm">Create</button>
</div>
</div>
<!-- end col -->
<div class="col-lg-4">
<div class="card">
<div class="card-header">
<h5 class="card-title mb-0">Privacy</h5>
</div>
<div class="card-body">
<div>
<label for="choices-privacy-status-input" class="form-label">Status</label>
<div class="choices" data-type="select-one" tabindex="0" role="listbox" aria-haspopup="true"
aria-expanded="false">
<div class="choices__inner"><select class="form-select choices__input" data-choices=""
data-choices-search-false="" id="choices-privacy-status-input" hidden="" tabindex="-1"
data-choice="active">
<option value="Private" data-custom-properties="[object Object]">Private</option>
</select>
<div class="choices__list choices__list--single">
<div class="choices__item choices__item--selectable" data-item="" data-id="1" data-value="Private"
data-custom-properties="[object Object]" aria-selected="true">Private</div>
</div>
</div>
<div class="choices__list choices__list--dropdown" aria-expanded="false">
<div class="choices__list" role="listbox">
<div id="choices--choices-privacy-status-input-item-choice-1"
class="choices__item choices__item--choice is-selected choices__item--selectable is-highlighted"
role="option" data-choice="" data-id="1" data-value="Private" data-select-text="Press to select"
data-choice-selectable="" aria-selected="true">Private</div>
<div id="choices--choices-privacy-status-input-item-choice-2"
class="choices__item choices__item--choice choices__item--selectable" role="option" data-choice=""
data-id="2" data-value="Public" data-select-text="Press to select" data-choice-selectable="">
Public</div>
<div id="choices--choices-privacy-status-input-item-choice-3"
class="choices__item choices__item--choice choices__item--selectable" role="option" data-choice=""
data-id="3" data-value="Team" data-select-text="Press to select" data-choice-selectable="">Team
</div>
</div>
</div>
</div>
</div>
</div>
<!-- end card body -->
</div>
<!-- end card -->
<div class="card">
<div class="card-header">
<h5 class="card-title mb-0">Tags</h5>
</div>
<div class="card-body">
<div class="mb-3">
<label for="choices-categories-input" class="form-label">Categories</label>
<div class="choices" data-type="select-one" tabindex="0" role="listbox" aria-haspopup="true"
aria-expanded="false">
<div class="choices__inner"><select class="form-select choices__input" data-choices=""
data-choices-search-false="" id="choices-categories-input" hidden="" tabindex="-1"
data-choice="active">
<option value="Designing" data-custom-properties="[object Object]">Designing</option>
</select>
<div class="choices__list choices__list--single">
<div class="choices__item choices__item--selectable" data-item="" data-id="1"
data-value="Designing" data-custom-properties="[object Object]" aria-selected="true">Designing
</div>
</div>
</div>
<div class="choices__list choices__list--dropdown" aria-expanded="false">
<div class="choices__list" role="listbox">
<div id="choices--choices-categories-input-item-choice-1"
class="choices__item choices__item--choice is-selected choices__item--selectable is-highlighted"
role="option" data-choice="" data-id="1" data-value="Designing"
data-select-text="Press to select" data-choice-selectable="" aria-selected="true">Designing</div>
<div id="choices--choices-categories-input-item-choice-2"
class="choices__item choices__item--choice choices__item--selectable" role="option" data-choice=""
data-id="2" data-value="Development" data-select-text="Press to select"
data-choice-selectable="">Development</div>
</div>
</div>
</div>
</div>
<div>
<label for="choices-text-input" class="form-label">Skills</label>
<div class="choices" data-type="text" aria-haspopup="true" aria-expanded="false">
<div class="choices__inner"><input class="form-control choices__input" id="choices-text-input"
data-choices="" data-choices-limit="Required Limit" placeholder="Enter Skills" type="text"
value="UI/UX,Figma,HTML,CSS,Javascript,C#,Nodejs" hidden="" tabindex="-1"
data-choice="active">
<div class="choices__list choices__list--multiple">
<div class="choices__item choices__item--selectable" data-item="" data-id="1"
data-value="UI/UX" data-custom-properties="[object Object]" aria-selected="true">UI/UX</div>
<div class="choices__item choices__item--selectable" data-item="" data-id="2"
data-value="Figma" data-custom-properties="[object Object]" aria-selected="true">Figma</div>
<div class="choices__item choices__item--selectable" data-item="" data-id="3" data-value="HTML"
data-custom-properties="[object Object]" aria-selected="true">HTML</div>
<div class="choices__item choices__item--selectable" data-item="" data-id="4" data-value="CSS"
data-custom-properties="[object Object]" aria-selected="true">CSS</div>
<div class="choices__item choices__item--selectable" data-item="" data-id="5"
data-value="Javascript" data-custom-properties="[object Object]" aria-selected="true">Javascript
</div>
<div class="choices__item choices__item--selectable" data-item="" data-id="6" data-value="C#"
data-custom-properties="[object Object]" aria-selected="true">C#</div>
<div class="choices__item choices__item--selectable" data-item="" data-id="7"
data-value="Nodejs" data-custom-properties="[object Object]" aria-selected="true">Nodejs</div>
</div><input type="search" name="search_terms" class="choices__input choices__input--cloned"
autocomplete="off" autocapitalize="off" spellcheck="false" role="textbox" aria-autocomplete="list"
aria-label="null">
</div>
<div class="choices__list choices__list--dropdown" aria-expanded="false"></div>
</div>
</div>
</div>
<!-- end card body -->
</div>
<!-- end card -->
<div class="card">
<div class="card-header">
<h5 class="card-title mb-0">Members</h5>
</div>
<div class="card-body">
<div class="mb-3">
<label for="choices-lead-input" class="form-label">Team Lead</label>
<div class="choices" data-type="select-one" tabindex="0" role="listbox" aria-haspopup="true"
aria-expanded="false">
<div class="choices__inner"><select class="form-select choices__input" data-choices=""
data-choices-search-false="" id="choices-lead-input" hidden="" tabindex="-1"
data-choice="active">
<option value="Brent Gonzalez" data-custom-properties="[object Object]">Brent Gonzalez</option>
</select>
<div class="choices__list choices__list--single">
<div class="choices__item choices__item--selectable" data-item="" data-id="1"
data-value="Brent Gonzalez" data-custom-properties="[object Object]" aria-selected="true">Brent
Gonzalez</div>
</div>
</div>
<div class="choices__list choices__list--dropdown" aria-expanded="false">
<div class="choices__list" role="listbox">
<div id="choices--choices-lead-input-item-choice-1"
class="choices__item choices__item--choice is-selected choices__item--selectable is-highlighted"
role="option" data-choice="" data-id="1" data-value="Brent Gonzalez"
data-select-text="Press to select" data-choice-selectable="" aria-selected="true">Brent Gonzalez
</div>
<div id="choices--choices-lead-input-item-choice-2"
class="choices__item choices__item--choice choices__item--selectable" role="option" data-choice=""
data-id="2" data-value="Darline Williams" data-select-text="Press to select"
data-choice-selectable="">Darline Williams</div>
<div id="choices--choices-lead-input-item-choice-3"
class="choices__item choices__item--choice choices__item--selectable" role="option" data-choice=""
data-id="3" data-value="Ellen Smith" data-select-text="Press to select"
data-choice-selectable="">Ellen Smith</div>
<div id="choices--choices-lead-input-item-choice-4"
class="choices__item choices__item--choice choices__item--selectable" role="option" data-choice=""
data-id="4" data-value="Jeffrey Salazar" data-select-text="Press to select"
data-choice-selectable="">Jeffrey Salazar</div>
<div id="choices--choices-lead-input-item-choice-5"
class="choices__item choices__item--choice choices__item--selectable" role="option" data-choice=""
data-id="5" data-value="Mark Williams" data-select-text="Press to select"
data-choice-selectable="">Mark Williams</div>
<div id="choices--choices-lead-input-item-choice-6"
class="choices__item choices__item--choice choices__item--selectable" role="option" data-choice=""
data-id="6" data-value="Sylvia Wright" data-select-text="Press to select"
data-choice-selectable="">Sylvia Wright</div>
</div>
</div>
</div>
</div>
<div>
<label class="form-label">Team Members</label>
<div class="avatar-group">
<a href="javascript: void(0);" class="avatar-group-item material-shadow" data-bs-toggle="tooltip"
data-bs-trigger="hover" data-bs-placement="top" aria-label="Brent Gonzalez"
data-bs-original-title="Brent Gonzalez">
<div class="avatar-xs">
<img src="assets/images/users/avatar-3.jpg" alt="" class="rounded-circle img-fluid">
</div>
</a>
<a href="javascript: void(0);" class="avatar-group-item material-shadow" data-bs-toggle="tooltip"
data-bs-trigger="hover" data-bs-placement="top" data-bs-original-title="Sylvia Wright">
<div class="avatar-xs">
<div class="avatar-title rounded-circle bg-secondary">
S
</div>
</div>
</a>
<a href="javascript: void(0);" class="avatar-group-item material-shadow" data-bs-toggle="tooltip"
data-bs-trigger="hover" data-bs-placement="top" aria-label="Ellen Smith"
data-bs-original-title="Ellen Smith">
<div class="avatar-xs">
<img src="assets/images/users/avatar-4.jpg" alt="" class="rounded-circle img-fluid">
</div>
</a>
<a href="javascript: void(0);" class="avatar-group-item material-shadow" data-bs-toggle="tooltip"
data-bs-trigger="hover" data-bs-placement="top" data-bs-original-title="Add Members">
<div class="avatar-xs" data-bs-toggle="modal" data-bs-target="#inviteMembersModal">
<div class="avatar-title fs-16 rounded-circle bg-light text-primary border border-dashed">
+
</div>
</div>
</a>
</div>
</div>
</div>
<!-- end card body -->
</div>
<!-- end card -->
</div>
<!-- end col -->
</div>

View File

@ -13,6 +13,7 @@
"laravel/tinker": "^2.8",
"laravel/ui": "^4.5",
"nwidart/laravel-modules": "^11.0",
"spatie/laravel-html": "^3.7",
"spatie/laravel-permission": "^6.4",
"yoeunes/toastr": "^2.3"
},

80
composer.lock generated
View File

@ -4,7 +4,7 @@
"Read more about it at https://getcomposer.org/doc/01-basic-usage.md#installing-dependencies",
"This file is @generated automatically"
],
"content-hash": "8382101c555e42e8fbbf188fa8b7b1c6",
"content-hash": "6dc3e011b2ee18ecf5f0987aba384f2b",
"packages": [
{
"name": "barryvdh/laravel-debugbar",
@ -3675,6 +3675,84 @@
],
"time": "2023-11-08T05:53:05+00:00"
},
{
"name": "spatie/laravel-html",
"version": "3.7.0",
"source": {
"type": "git",
"url": "https://github.com/spatie/laravel-html.git",
"reference": "df15763c190954ee46a74e0bf5b4b5bbf2e1f170"
},
"dist": {
"type": "zip",
"url": "https://api.github.com/repos/spatie/laravel-html/zipball/df15763c190954ee46a74e0bf5b4b5bbf2e1f170",
"reference": "df15763c190954ee46a74e0bf5b4b5bbf2e1f170",
"shasum": ""
},
"require": {
"illuminate/http": "^10.0|^11.0",
"illuminate/support": "^10.0|^11.0",
"php": "^8.2"
},
"require-dev": {
"mockery/mockery": "^1.3",
"orchestra/testbench": "^8.0|^9.0",
"pestphp/pest": "^2.34"
},
"type": "library",
"extra": {
"laravel": {
"providers": [
"Spatie\\Html\\HtmlServiceProvider"
],
"aliases": {
"Html": "Spatie\\Html\\Facades\\Html"
}
}
},
"autoload": {
"files": [
"src/helpers.php"
],
"psr-4": {
"Spatie\\Html\\": "src"
}
},
"notification-url": "https://packagist.org/downloads/",
"license": [
"MIT"
],
"authors": [
{
"name": "Sebastian De Deyne",
"email": "sebastian@spatie.be",
"homepage": "https://spatie.be",
"role": "Developer"
},
{
"name": "Freek Van der Herten",
"email": "freek@spatie.be",
"homepage": "https://spatie.be",
"role": "Developer"
}
],
"description": "A fluent html builder",
"homepage": "https://github.com/spatie/laravel-html",
"keywords": [
"html",
"spatie"
],
"support": {
"source": "https://github.com/spatie/laravel-html/tree/3.7.0"
},
"funding": [
{
"url": "https://spatie.be/open-source/support-us",
"type": "custom"
}
],
"time": "2024-03-23T11:28:29+00:00"
},
{
"name": "spatie/laravel-permission",
"version": "6.4.0",

View File

@ -13,7 +13,7 @@ return [
| framework needs to place the application's name in a notification or
| any other location as required by the application or its packages.
|
*/
*/
'name' => env('APP_NAME', 'Laravel'),
@ -26,7 +26,7 @@ return [
| running in. This may determine how you prefer to configure various
| services the application utilizes. Set this in your ".env" file.
|
*/
*/
'env' => env('APP_ENV', 'production'),
@ -39,7 +39,7 @@ return [
| stack traces will be shown on every error that occurs within your
| application. If disabled, a simple generic error page is shown.
|
*/
*/
'debug' => (bool) env('APP_DEBUG', false),
@ -52,7 +52,7 @@ return [
| the Artisan command line tool. You should set this to the root of
| your application so that it is used when running Artisan tasks.
|
*/
*/
'url' => env('APP_URL', 'http://localhost'),
@ -67,7 +67,7 @@ return [
| will be used by the PHP date and date-time functions. We have gone
| ahead and set this to a sensible default for you out of the box.
|
*/
*/
'timezone' => 'UTC',
@ -80,7 +80,7 @@ return [
| by the translation service provider. You are free to set this value
| to any of the locales which will be supported by the application.
|
*/
*/
'locale' => 'en',
@ -93,7 +93,7 @@ return [
| is not available. You may change the value to correspond to any of
| the language folders that are provided through your application.
|
*/
*/
'fallback_locale' => 'en',
@ -106,7 +106,7 @@ return [
| data for your database seeds. For example, this will be used to get
| localized telephone numbers, street address information and more.
|
*/
*/
'faker_locale' => 'en_US',
@ -119,7 +119,7 @@ return [
| to a random, 32 character string, otherwise these encrypted strings
| will not be safe. Please do this before deploying an application!
|
*/
*/
'key' => env('APP_KEY'),
@ -136,7 +136,7 @@ return [
|
| Supported drivers: "file", "cache"
|
*/
*/
'maintenance' => [
'driver' => 'file',
@ -152,7 +152,7 @@ return [
| request to your application. Feel free to add your own services to
| this array to grant expanded functionality to your applications.
|
*/
*/
'providers' => [
@ -194,6 +194,7 @@ return [
// App\Providers\BroadcastServiceProvider::class,
App\Providers\EventServiceProvider::class,
App\Providers\RouteServiceProvider::class,
Spatie\Html\HtmlServiceProvider::class,
],
@ -206,7 +207,7 @@ return [
| is started. However, feel free to register as many as you wish as
| the aliases are "lazy" loaded so they don't hinder performance.
|
*/
*/
'aliases' => Facade::defaultAliases()->merge([
// 'ExampleClass' => App\Example\ExampleClass::class,