481 lines
39 KiB
PHP
481 lines
39 KiB
PHP
@extends('layout.layout')
|
|
@php
|
|
$title='Calendar';
|
|
$subTitle = 'Components / Calendar';
|
|
$script = '<script src="' . asset('assets/js/full-calendar.js') . '"></script>
|
|
<script src="' . asset('assets/js/flatpickr.js') . '"></script>
|
|
<script>
|
|
// Flat pickr or date picker js
|
|
function getDatePicker(receiveID) {
|
|
flatpickr(receiveID, {
|
|
enableTime: true,
|
|
dateFormat: "d/m/Y H:i",
|
|
});
|
|
}
|
|
getDatePicker("#startDate");
|
|
getDatePicker("#endDate");
|
|
getDatePicker("#editstartDate");
|
|
getDatePicker("#editendDate");
|
|
</script>';
|
|
@endphp
|
|
|
|
@section('content')
|
|
|
|
<div class="grid grid-cols-1 lg:grid-cols-12 gap-6">
|
|
<div class="col-span-12 lg:col-span-4 2xl:col-span-3">
|
|
<div class="card h-full p-0 border-0">
|
|
<div class="card-body p-6">
|
|
<button type="button" data-modal-target="popup-modal" data-modal-toggle="popup-modal" class="btn btn-primary text-sm btn-sm px-3 py-3 w-full rounded-lg flex items-center gap-2 mb-8">
|
|
<iconify-icon icon="fa6-regular:square-plus" class="icon text-lg line-height-1"></iconify-icon>
|
|
Add Currency
|
|
</button>
|
|
<div class="mt-8">
|
|
<div class="event-item flex items-center justify-between gap-4 pb-4 mb-4 border-b border-neutral-200 dark:border-neutral-600">
|
|
<div class="">
|
|
<div class="flex items-center gap-2.5">
|
|
<span class="w-3 h-3 bg-warning-600 rounded-full font-medium"></span>
|
|
<span class="text-secondary-light">Today, 10:30 PM - 02:30 AM</span>
|
|
</div>
|
|
<span class="text-neutral-600 dark:text-neutral-200 font-semibold text-base mt-1.5">Design Conference</span>
|
|
</div>
|
|
<div class="dropdown">
|
|
<button data-dropdown-toggle="dropdownDotsZero" class="inline-flex items-center p-2 text-xl font-medium text-center text-gray-900 bg-white rounded-lg hover:bg-gray-100 focus:ring-4 focus:outline-none dark:text-white focus:ring-gray-50 dark:bg-gray-800 dark:hover:bg-gray-700 dark:focus:ring-gray-600" type="button">
|
|
<i class="ri-more-2-fill"></i>
|
|
</button>
|
|
|
|
<div id="dropdownDotsZero" class="z-10 hidden bg-white divide-y divide-gray-100 rounded-lg shadow-lg border border-neutral-100 dark:border-neutral-600 w-44 dark:bg-gray-700">
|
|
<ul class="py-2 text-sm text-gray-700 dark:text-gray-200">
|
|
<li>
|
|
<button data-modal-target="view-popup-modal" data-modal-toggle="view-popup-modal" type="submit" class="w-full text-start px-4 py-2 hover:bg-gray-100 dark:hover:bg-gray-600 dark:hover:text-white flex items-center gap-2">
|
|
<span class="text-lg flex"><i class="ri-eye-line"></i></span>
|
|
View
|
|
</button>
|
|
</li>
|
|
<li>
|
|
<button data-modal-target="edit-popup-modal" data-modal-toggle="edit-popup-modal" type="button" class="w-full text-start px-4 py-2 hover:bg-gray-100 dark:hover:bg-gray-600 dark:hover:text-white flex items-center gap-2">
|
|
<span class="text-lg flex"><i class="ri-edit-line"></i></span>
|
|
Edit
|
|
</button>
|
|
</li>
|
|
<li>
|
|
<button data-modal-target="delete-popup-modal" data-modal-toggle="delete-popup-modal" type="button" class="w-full text-start px-4 py-2 hover:bg-gray-100 dark:hover:bg-gray-600 dark:hover:text-white flex items-center gap-2">
|
|
<span class="text-lg flex"><i class="ri-delete-bin-5-line"></i></span>
|
|
Delete
|
|
</button>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="event-item flex items-center justify-between gap-4 pb-4 mb-4 border-b border-neutral-200 dark:border-neutral-600">
|
|
<div class="">
|
|
<div class="flex items-center gap-2.5">
|
|
<span class="w-3 h-3 bg-success-600 rounded-full font-medium"></span>
|
|
<span class="text-secondary-light">Today, 10:30 PM - 02:30 AM</span>
|
|
</div>
|
|
<span class="text-neutral-600 dark:text-neutral-200 font-semibold text-base mt-1.5">Weekend Festival</span>
|
|
</div>
|
|
<div class="dropdown">
|
|
<button data-dropdown-toggle="dropdownDotsOne" class="inline-flex items-center p-2 text-xl font-medium text-center text-gray-900 bg-white rounded-lg hover:bg-gray-100 focus:ring-4 focus:outline-none dark:text-white focus:ring-gray-50 dark:bg-gray-800 dark:hover:bg-gray-700 dark:focus:ring-gray-600" type="button">
|
|
<i class="ri-more-2-fill"></i>
|
|
</button>
|
|
|
|
<div id="dropdownDotsOne" class="z-10 hidden bg-white divide-y divide-gray-100 rounded-lg shadow-lg border border-neutral-100 dark:border-neutral-600 w-44 dark:bg-gray-700">
|
|
<ul class="py-2 text-sm text-gray-700 dark:text-gray-200">
|
|
<li>
|
|
<button data-modal-target="view-popup-modal" data-modal-toggle="view-popup-modal" type="submit" class="w-full text-start px-4 py-2 hover:bg-gray-100 dark:hover:bg-gray-600 dark:hover:text-white flex items-center gap-2">
|
|
<span class="text-lg flex"><i class="ri-eye-line"></i></span>
|
|
View
|
|
</button>
|
|
</li>
|
|
<li>
|
|
<button data-modal-target="edit-popup-modal" data-modal-toggle="edit-popup-modal" type="button" class="w-full text-start px-4 py-2 hover:bg-gray-100 dark:hover:bg-gray-600 dark:hover:text-white flex items-center gap-2">
|
|
<span class="text-lg flex"><i class="ri-edit-line"></i></span>
|
|
Edit
|
|
</button>
|
|
</li>
|
|
<li>
|
|
<button data-modal-target="delete-popup-modal" data-modal-toggle="delete-popup-modal" type="button" class="w-full text-start px-4 py-2 hover:bg-gray-100 dark:hover:bg-gray-600 dark:hover:text-white flex items-center gap-2">
|
|
<span class="text-lg flex"><i class="ri-delete-bin-5-line"></i></span>
|
|
Delete
|
|
</button>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="event-item flex items-center justify-between gap-4 pb-4 mb-4 border-b border-neutral-200 dark:border-neutral-600">
|
|
<div class="">
|
|
<div class="flex items-center gap-2.5">
|
|
<span class="w-3 h-3 bg-info-600 rounded-full font-medium"></span>
|
|
<span class="text-secondary-light">Today, 10:30 PM - 02:30 AM</span>
|
|
</div>
|
|
<span class="text-neutral-600 dark:text-neutral-200 font-semibold text-base mt-1.5">Design Conference</span>
|
|
</div>
|
|
<div class="dropdown">
|
|
<button data-dropdown-toggle="dropdownDotsTwo" class="inline-flex items-center p-2 text-xl font-medium text-center text-gray-900 bg-white rounded-lg hover:bg-gray-100 focus:ring-4 focus:outline-none dark:text-white focus:ring-gray-50 dark:bg-gray-800 dark:hover:bg-gray-700 dark:focus:ring-gray-600" type="button">
|
|
<i class="ri-more-2-fill"></i>
|
|
</button>
|
|
|
|
<div id="dropdownDotsTwo" class="z-10 hidden bg-white divide-y divide-gray-100 rounded-lg shadow-lg border border-neutral-100 dark:border-neutral-600 w-44 dark:bg-gray-700">
|
|
<ul class="py-2 text-sm text-gray-700 dark:text-gray-200">
|
|
<li>
|
|
<button data-modal-target="view-popup-modal" data-modal-toggle="view-popup-modal" type="submit" class="w-full text-start px-4 py-2 hover:bg-gray-100 dark:hover:bg-gray-600 dark:hover:text-white flex items-center gap-2">
|
|
<span class="text-lg flex"><i class="ri-eye-line"></i></span>
|
|
View
|
|
</button>
|
|
</li>
|
|
<li>
|
|
<button data-modal-target="edit-popup-modal" data-modal-toggle="edit-popup-modal" type="button" class="w-full text-start px-4 py-2 hover:bg-gray-100 dark:hover:bg-gray-600 dark:hover:text-white flex items-center gap-2">
|
|
<span class="text-lg flex"><i class="ri-edit-line"></i></span>
|
|
Edit
|
|
</button>
|
|
</li>
|
|
<li>
|
|
<button data-modal-target="delete-popup-modal" data-modal-toggle="delete-popup-modal" type="button" class="w-full text-start px-4 py-2 hover:bg-gray-100 dark:hover:bg-gray-600 dark:hover:text-white flex items-center gap-2">
|
|
<span class="text-lg flex"><i class="ri-delete-bin-5-line"></i></span>
|
|
Delete
|
|
</button>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="event-item flex items-center justify-between gap-4 pb-4 mb-4 border-b border-neutral-200 dark:border-neutral-600">
|
|
<div class="">
|
|
<div class="flex items-center gap-2.5">
|
|
<span class="w-3 h-3 bg-warning-600 rounded-full font-medium"></span>
|
|
<span class="text-secondary-light">Today, 10:30 PM - 02:30 AM</span>
|
|
</div>
|
|
<span class="text-neutral-600 dark:text-neutral-200 font-semibold text-base mt-1.5">Ultra Europe 2019</span>
|
|
</div>
|
|
<div class="dropdown">
|
|
<button data-dropdown-toggle="dropdownDotsThree" class="inline-flex items-center p-2 text-xl font-medium text-center text-gray-900 bg-white rounded-lg hover:bg-gray-100 focus:ring-4 focus:outline-none dark:text-white focus:ring-gray-50 dark:bg-gray-800 dark:hover:bg-gray-700 dark:focus:ring-gray-600" type="button">
|
|
<i class="ri-more-2-fill"></i>
|
|
</button>
|
|
|
|
<div id="dropdownDotsThree" class="z-10 hidden bg-white divide-y divide-gray-100 rounded-lg shadow-lg border border-neutral-100 dark:border-neutral-600 w-44 dark:bg-gray-700">
|
|
<ul class="py-2 text-sm text-gray-700 dark:text-gray-200">
|
|
<li>
|
|
<button data-modal-target="view-popup-modal" data-modal-toggle="view-popup-modal" type="submit" class="w-full text-start px-4 py-2 hover:bg-gray-100 dark:hover:bg-gray-600 dark:hover:text-white flex items-center gap-2">
|
|
<span class="text-lg flex"><i class="ri-eye-line"></i></span>
|
|
View
|
|
</button>
|
|
</li>
|
|
<li>
|
|
<button data-modal-target="edit-popup-modal" data-modal-toggle="edit-popup-modal" type="button" class="w-full text-start px-4 py-2 hover:bg-gray-100 dark:hover:bg-gray-600 dark:hover:text-white flex items-center gap-2">
|
|
<span class="text-lg flex"><i class="ri-edit-line"></i></span>
|
|
Edit
|
|
</button>
|
|
</li>
|
|
<li>
|
|
<button data-modal-target="delete-popup-modal" data-modal-toggle="delete-popup-modal" type="button" class="w-full text-start px-4 py-2 hover:bg-gray-100 dark:hover:bg-gray-600 dark:hover:text-white flex items-center gap-2">
|
|
<span class="text-lg flex"><i class="ri-delete-bin-5-line"></i></span>
|
|
Delete
|
|
</button>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="event-item flex items-center justify-between gap-4 pb-4 mb-4 border-b border-neutral-200 dark:border-neutral-600">
|
|
<div class="">
|
|
<div class="flex items-center gap-2.5">
|
|
<span class="w-3 h-3 bg-warning-600 rounded-full font-medium"></span>
|
|
<span class="text-secondary-light">Today, 10:30 PM - 02:30 AM</span>
|
|
</div>
|
|
<span class="text-neutral-600 dark:text-neutral-200 font-semibold text-base mt-1.5">Design Conference</span>
|
|
</div>
|
|
<div class="dropdown">
|
|
<button data-dropdown-toggle="dropdownDotsFour" class="inline-flex items-center p-2 text-xl font-medium text-center text-gray-900 bg-white rounded-lg hover:bg-gray-100 focus:ring-4 focus:outline-none dark:text-white focus:ring-gray-50 dark:bg-gray-800 dark:hover:bg-gray-700 dark:focus:ring-gray-600" type="button">
|
|
<i class="ri-more-2-fill"></i>
|
|
</button>
|
|
|
|
<div id="dropdownDotsFour" class="z-10 hidden bg-white divide-y divide-gray-100 rounded-lg shadow-lg border border-neutral-100 dark:border-neutral-600 w-44 dark:bg-gray-700">
|
|
<ul class="py-2 text-sm text-gray-700 dark:text-gray-200">
|
|
<li>
|
|
<button data-modal-target="view-popup-modal" data-modal-toggle="view-popup-modal" type="submit" class="w-full text-start px-4 py-2 hover:bg-gray-100 dark:hover:bg-gray-600 dark:hover:text-white flex items-center gap-2">
|
|
<span class="text-lg flex"><i class="ri-eye-line"></i></span>
|
|
View
|
|
</button>
|
|
</li>
|
|
<li>
|
|
<button data-modal-target="edit-popup-modal" data-modal-toggle="edit-popup-modal" type="button" class="w-full text-start px-4 py-2 hover:bg-gray-100 dark:hover:bg-gray-600 dark:hover:text-white flex items-center gap-2">
|
|
<span class="text-lg flex"><i class="ri-edit-line"></i></span>
|
|
Edit
|
|
</button>
|
|
</li>
|
|
<li>
|
|
<button data-modal-target="delete-popup-modal" data-modal-toggle="delete-popup-modal" type="button" class="w-full text-start px-4 py-2 hover:bg-gray-100 dark:hover:bg-gray-600 dark:hover:text-white flex items-center gap-2">
|
|
<span class="text-lg flex"><i class="ri-delete-bin-5-line"></i></span>
|
|
Delete
|
|
</button>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-span-12 lg:col-span-8 2xl:col-span-9">
|
|
<div class="card h-full p-0 border-0">
|
|
<div class="card-body p-6">
|
|
<div id='wrap'>
|
|
<div id='calendar'></div>
|
|
<div style='clear:both'></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Modal Add Event -->
|
|
<div id="popup-modal" tabindex="-1" class="hidden overflow-y-auto overflow-x-hidden fixed top-0 right-0 left-0 z-50 justify-center items-center w-full md:inset-0 h-[calc(100%-1rem)] max-h-full">
|
|
<div class="rounded-2xl bg-white dark:bg-neutral-700 max-w-[800px] w-full">
|
|
<div class="py-4 px-6 border-b border-neutral-200 dark:border-neutral-600 flex items-center justify-between">
|
|
<h1 class="text-xl">Add New Event</h1>
|
|
<button data-modal-hide="popup-modal" type="button" class="text-gray-400 bg-transparent hover:bg-gray-200 hover:text-gray-900 rounded-lg text-sm w-8 h-8 ms-auto inline-flex justify-center items-center dark:hover:bg-gray-600 dark:hover:text-white">
|
|
<svg class="w-3 h-3" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 14">
|
|
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m1 1 6 6m0 0 6 6M7 7l6-6M7 7l-6 6"></path>
|
|
</svg>
|
|
<span class="sr-only">Close modal</span>
|
|
</button>
|
|
</div>
|
|
<div class="p-6">
|
|
<form action="#">
|
|
<div class="grid grid-cols-1 md:grid-cols-12 gap-6">
|
|
<div class="col-span-12 mb-5">
|
|
<label for="title" class="inline-block font-semibold text-neutral-600 dark:text-neutral-200 text-sm mb-2">Event Title : </label>
|
|
<input type="text" id="title" class="form-control bg-white dark:bg-neutral-700 rounded-lg" placeholder="Enter Event Title ">
|
|
</div>
|
|
<div class="col-span-12 md:col-span-6 mb-5">
|
|
<label for="startDate" class="inline-block font-semibold text-neutral-600 dark:text-neutral-200 text-sm mb-2">Start Date</label>
|
|
<div class=" relative">
|
|
<input class="form-control rounded-lg bg-white dark:bg-neutral-700" id="startDate" type="text" placeholder="03/12/2025, 10:30 AM">
|
|
<span class="absolute end-0 top-1/2 -translate-y-1/2 me-3 line-height-1"><iconify-icon icon="solar:calendar-linear" class="icon text-lg"></iconify-icon></span>
|
|
</div>
|
|
</div>
|
|
<div class="col-span-12 md:col-span-6 mb-5">
|
|
<label for="endDate" class="inline-block font-semibold text-neutral-600 dark:text-neutral-200 text-sm mb-2">End Date </label>
|
|
<div class=" relative">
|
|
<input class="form-control rounded-lg bg-white dark:bg-neutral-700" id="endDate" type="text" placeholder="03/12/2025, 2:30 PM">
|
|
<span class="absolute end-0 top-1/2 -translate-y-1/2 me-3 line-height-1"><iconify-icon icon="solar:calendar-linear" class="icon text-lg"></iconify-icon></span>
|
|
</div>
|
|
</div>
|
|
<div class="col-span-12 mb-5">
|
|
<label for="endDate" class="inline-block font-semibold text-neutral-600 dark:text-neutral-200 text-sm mb-2">Label </label>
|
|
<div class="flex items-center flex-wrap gap-7">
|
|
<div class="form-check checked-success flex items-center gap-2">
|
|
<input class="form-check-input rounded-full" type="radio" name="label" id="Personal">
|
|
<label class="form-check-label line-height-1 font-medium text-secondary-light text-sm flex items-center gap-1" for="Personal">
|
|
<span class="w-2 h-2 bg-success-600 rounded-full"></span>
|
|
Personal
|
|
</label>
|
|
</div>
|
|
<div class="form-check checked-primary flex items-center gap-2">
|
|
<input class="form-check-input rounded-full" type="radio" name="label" id="Business">
|
|
<label class="form-check-label line-height-1 font-medium text-secondary-light text-sm flex items-center gap-1" for="Business">
|
|
<span class="w-2 h-2 bg-primary-600 rounded-full"></span>
|
|
Business
|
|
</label>
|
|
</div>
|
|
<div class="form-check checked-warning flex items-center gap-2">
|
|
<input class="form-check-input rounded-full" type="radio" name="label" id="Family">
|
|
<label class="form-check-label line-height-1 font-medium text-secondary-light text-sm flex items-center gap-1" for="Family">
|
|
<span class="w-2 h-2 bg-warning-600 rounded-full"></span>
|
|
Family
|
|
</label>
|
|
</div>
|
|
<div class="form-check checked-secondary flex items-center gap-2">
|
|
<input class="form-check-input rounded-full" type="radio" name="label" id="Important">
|
|
<label class="form-check-label line-height-1 font-medium text-secondary-light text-sm flex items-center gap-1" for="Important">
|
|
<span class="w-2 h-2 bg-purple-600 rounded-full"></span>
|
|
Important
|
|
</label>
|
|
</div>
|
|
<div class="form-check checked-danger flex items-center gap-2">
|
|
<input class="form-check-input rounded-full" type="radio" name="label" id="Holiday">
|
|
<label class="form-check-label line-height-1 font-medium text-secondary-light text-sm flex items-center gap-1" for="Holiday">
|
|
<span class="w-2 h-2 bg-danger-600 rounded-full"></span>
|
|
Holiday
|
|
</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-span-12 mb-5">
|
|
<label for="desc" class="inline-block font-semibold text-neutral-600 dark:text-neutral-200 text-sm mb-2">Description</label>
|
|
<textarea class="form-control bg-white dark:bg-neutral-700" id="desc" rows="4" cols="50" placeholder="Write some text"></textarea>
|
|
</div>
|
|
<div class="col-span-12">
|
|
<div class="flex items-center justify-center gap-3 mt-6">
|
|
<button type="reset" data-modal-hide="edit-popup-modal" class="border border-danger-600 hover:bg-danger-100 text-danger-600 text-base px-10 py-[11px] rounded-lg">
|
|
Cancel
|
|
</button>
|
|
<button type="submit" class="btn btn-primary border border-primary-600 text-base px-6 py-3 rounded-lg">
|
|
Save
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- View Details Event -->
|
|
<div id="view-popup-modal" tabindex="-1" class="hidden overflow-y-auto overflow-x-hidden fixed top-0 right-0 left-0 z-50 justify-center items-center w-full md:inset-0 h-[calc(100%-1rem)] max-h-full">
|
|
<div class="rounded-2xl bg-white dark:bg-neutral-700 max-w-[600px] w-full">
|
|
<div class="py-4 px-6 border-b border-neutral-200 dark:border-neutral-600 flex items-center justify-between">
|
|
<h1 class="text-xl">View Details</h1>
|
|
<button data-modal-hide="view-popup-modal" type="button" class="text-gray-400 bg-transparent hover:bg-gray-200 hover:text-gray-900 rounded-lg text-sm w-8 h-8 ms-auto inline-flex justify-center items-center dark:hover:bg-gray-600 dark:hover:text-white">
|
|
<svg class="w-3 h-3" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 14">
|
|
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m1 1 6 6m0 0 6 6M7 7l6-6M7 7l-6 6"></path>
|
|
</svg>
|
|
<span class="sr-only">Close modal</span>
|
|
</button>
|
|
</div>
|
|
<div class="p-6">
|
|
<div class="mb-3">
|
|
<span class="text-secondary-light txt-sm font-medium">Title</span>
|
|
<h6 class="text-neutral-600 dark:text-neutral-200 font-semibold text-base mb-0 mt-6">Design Conference</h6>
|
|
</div>
|
|
<div class="mb-3">
|
|
<span class="text-secondary-light txt-sm font-medium">Start Date</span>
|
|
<h6 class="text-neutral-600 dark:text-neutral-200 font-semibold text-base mb-0 mt-6">25 Jan 2025, 10:30AM</h6>
|
|
</div>
|
|
<div class="mb-3">
|
|
<span class="text-secondary-light txt-sm font-medium">End Date</span>
|
|
<h6 class="text-neutral-600 dark:text-neutral-200 font-semibold text-base mb-0 mt-6">25 Jan 2025, 2:30AM</h6>
|
|
</div>
|
|
<div class="mb-3">
|
|
<span class="text-secondary-light txt-sm font-medium">Description</span>
|
|
<h6 class="text-neutral-600 dark:text-neutral-200 font-semibold text-base mb-0 mt-6">N/A</h6>
|
|
</div>
|
|
<div class="mb-3">
|
|
<span class="text-secondary-light txt-sm font-medium">Label</span>
|
|
<h6 class="text-neutral-600 dark:text-neutral-200 font-semibold text-base mb-0 mt-6 flex items-center gap-2">
|
|
<span class="w-2 h-2 bg-success-600 rounded-full"></span>
|
|
Business
|
|
</h6>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Edit Modal Event -->
|
|
<div id="edit-popup-modal" tabindex="-1" class="hidden overflow-y-auto overflow-x-hidden fixed top-0 right-0 left-0 z-50 justify-center items-center w-full md:inset-0 h-[calc(100%-1rem)] max-h-full">
|
|
<div class="rounded-2xl bg-white dark:bg-neutral-700 max-w-[800px] w-full">
|
|
<div class="py-4 px-6 border-b border-neutral-200 dark:border-neutral-600 flex items-center justify-between">
|
|
<h1 class="text-xl">Edit Event</h1>
|
|
<button data-modal-hide="edit-popup-modal" type="button" class="text-gray-400 bg-transparent hover:bg-gray-200 hover:text-gray-900 rounded-lg text-sm w-8 h-8 ms-auto inline-flex justify-center items-center dark:hover:bg-gray-600 dark:hover:text-white">
|
|
<svg class="w-3 h-3" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 14">
|
|
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m1 1 6 6m0 0 6 6M7 7l6-6M7 7l-6 6"></path>
|
|
</svg>
|
|
<span class="sr-only">Close modal</span>
|
|
</button>
|
|
</div>
|
|
<div class="p-6">
|
|
<form action="#">
|
|
<div class="grid grid-cols-1 md:grid-cols-12 gap-6">
|
|
<div class="col-span-12 mb-5">
|
|
<label class="inline-block font-semibold text-neutral-600 dark:text-neutral-200 text-sm mb-2">Event Title : </label>
|
|
<input type="text" class="form-control bg-white dark:bg-neutral-700 rounded-lg" placeholder="Enter Event Title ">
|
|
</div>
|
|
<div class="col-span-12 md:col-span-6 mb-5">
|
|
<label for="editstartDate" class="inline-block font-semibold text-neutral-600 dark:text-neutral-200 text-sm mb-2">Start Date</label>
|
|
<div class=" relative">
|
|
<input class="form-control rounded-lg bg-white dark:bg-neutral-700" id="editstartDate" type="text" placeholder="03/12/2025, 10:30 AM">
|
|
<span class="absolute end-0 top-1/2 -translate-y-1/2 me-3 line-height-1"><iconify-icon icon="solar:calendar-linear" class="icon text-lg"></iconify-icon></span>
|
|
</div>
|
|
</div>
|
|
<div class="col-span-12 md:col-span-6 mb-5">
|
|
<label for="editendDate" class="inline-block font-semibold text-neutral-600 dark:text-neutral-200 text-sm mb-2">End Date </label>
|
|
<div class=" relative">
|
|
<input class="form-control rounded-lg bg-white dark:bg-neutral-700" id="editendDate" type="text" placeholder="03/12/2025, 2:30 PM">
|
|
<span class="absolute end-0 top-1/2 -translate-y-1/2 me-3 line-height-1"><iconify-icon icon="solar:calendar-linear" class="icon text-lg"></iconify-icon></span>
|
|
</div>
|
|
</div>
|
|
<div class="col-span-12 mb-5">
|
|
<label class="inline-block font-semibold text-neutral-600 dark:text-neutral-200 text-sm mb-2">Label </label>
|
|
<div class="flex items-center flex-wrap gap-7">
|
|
<div class="form-check checked-success flex items-center gap-2">
|
|
<input class="form-check-input rounded-full" type="radio" name="label" id="editPersonal">
|
|
<label class="form-check-label line-height-1 font-medium text-secondary-light text-sm flex items-center gap-1" for="editPersonal">
|
|
<span class="w-2 h-2 bg-success-600 rounded-full"></span>
|
|
Personal
|
|
</label>
|
|
</div>
|
|
<div class="form-check checked-primary flex items-center gap-2">
|
|
<input class="form-check-input rounded-full" type="radio" name="label" id="editBusiness">
|
|
<label class="form-check-label line-height-1 font-medium text-secondary-light text-sm flex items-center gap-1" for="editBusiness">
|
|
<span class="w-2 h-2 bg-primary-600 rounded-full"></span>
|
|
Business
|
|
</label>
|
|
</div>
|
|
<div class="form-check checked-warning flex items-center gap-2">
|
|
<input class="form-check-input rounded-full" type="radio" name="label" id="editFamily">
|
|
<label class="form-check-label line-height-1 font-medium text-secondary-light text-sm flex items-center gap-1" for="editFamily">
|
|
<span class="w-2 h-2 bg-warning-600 rounded-full"></span>
|
|
Family
|
|
</label>
|
|
</div>
|
|
<div class="form-check checked-secondary flex items-center gap-2">
|
|
<input class="form-check-input rounded-full" type="radio" name="label" id="editImportant">
|
|
<label class="form-check-label line-height-1 font-medium text-secondary-light text-sm flex items-center gap-1" for="editImportant">
|
|
<span class="w-2 h-2 bg-purple-600 rounded-full"></span>
|
|
Important
|
|
</label>
|
|
</div>
|
|
<div class="form-check checked-danger flex items-center gap-2">
|
|
<input class="form-check-input rounded-full" type="radio" name="label" id="editHoliday">
|
|
<label class="form-check-label line-height-1 font-medium text-secondary-light text-sm flex items-center gap-1" for="editHoliday">
|
|
<span class="w-2 h-2 bg-danger-600 rounded-full"></span>
|
|
Holiday
|
|
</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-span-12 mb-5">
|
|
<label for="desc" class="inline-block font-semibold text-neutral-600 dark:text-neutral-200 text-sm mb-2">Description</label>
|
|
<textarea class="form-control bg-white dark:bg-neutral-700" id="editdesc" rows="4" cols="50" placeholder="Write some text"></textarea>
|
|
</div>
|
|
<div class="col-span-12">
|
|
<div class="flex items-center justify-center gap-3 mt-6">
|
|
<button type="reset" data-modal-hide="edit-popup-modal" class="border border-danger-600 hover:bg-danger-100 text-danger-600 text-base px-10 py-[11px] rounded-lg">
|
|
Cancel
|
|
</button>
|
|
<button type="submit" class="btn btn-primary border border-primary-600 text-base px-6 py-3 rounded-lg">
|
|
Save
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Delete Modal Event -->
|
|
<div id="delete-popup-modal" tabindex="-1" class="hidden overflow-y-auto overflow-x-hidden fixed top-0 right-0 left-0 z-50 justify-center items-center w-full md:inset-0 h-[calc(100%-1rem)] max-h-full">
|
|
<div class="rounded-2xl bg-white dark:bg-neutral-700 max-w-[400px] w-full">
|
|
<div class="p-6 text-center">
|
|
<span class="mb-4 text-[40px] line-height-1 text-danger-600">
|
|
<iconify-icon icon="fluent:delete-24-regular" class="menu-icon"></iconify-icon>
|
|
</span>
|
|
<h6 class="text-lg font-semibold text-neutral-600 dark:text-neutral-200 mb-0">Are your sure you want to delete this event</h6>
|
|
<div class="flex items-center justify-center gap-3 mt-6">
|
|
<button type="reset" data-modal-hide="delete-popup-modal" class="w-1/2 border border-danger-600 hover:bg-danger-100 text-danger-600 text-base px-10 py-[11px] rounded-lg">
|
|
Cancel
|
|
</button>
|
|
<button type="button" class="w-1/2 btn btn-primary border border-primary-600 text-base px-6 py-3 rounded-lg">
|
|
Delete
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
@endsection
|