CasperSecurity
<div class="row">
<div class="xl:w-1/2 sm:w-1/2 w-half">
<div class="card z-auto flex flex-col hover:shadow-[rgba(0,0,0,0.1)_0px_10px_15px_-3px,rgba(0,0,0,0.05)_0px_4px_6px_-2px]">
<div class="card-body p-5">
<div class="flex items-center justify-between text-center">
<div class="px-4">
<h1 class="heading text-[1.8rem] font-medium uppercase">Wage Import</h1>
</div>
<div class="total-projects ml-[-0.888rem] px-4">
<a class="btn btn-primary duration-500 hover:bg-hover-warning py-[5px] px-4 text-[13px] rounded text-white bg-warning leading-[18px] inline-block border border-warning ml-2 cursor-pointer dz-modal-btn" data-dz-modal="wagemodal">Upload</a>
</div>
</div>
</div>
</div>
</div>
<div class="xl:w-1/2 sm:w-1/2 w-half">
<div class="card z-auto flex flex-col hover:shadow-[rgba(0,0,0,0.1)_0px_10px_15px_-3px,rgba(0,0,0,0.05)_0px_4px_6px_-2px]">
<div class="card-body p-5">
<div class="flex items-center justify-between text-center">
<div class="px-4">
<h1 class="heading text-[1.8rem] font-medium uppercase">Leave list Request</h1>
</div>
<div class="total-projects ml-[-0.888rem] px-4">
<a class="btn btn-primary duration-500 hover:bg-hover-warning py-[5px] px-4 text-[13px] rounded text-white bg-warning leading-[18px] inline-block border border-warning ml-2 cursor-pointer dz-modal-btn" data-dz-modal="leavemodal">Upload</a>
</div>
</div>
</div>
</div>
</div>
<div class="xl:w-1/2 sm:w-1/2 w-half">
<div class="card z-auto flex flex-col hover:shadow-[rgba(0,0,0,0.1)_0px_10px_15px_-3px,rgba(0,0,0,0.05)_0px_4px_6px_-2px]">
<div class="card-body p-5">
<div class="flex items-center justify-between text-center">
<div class="px-4">
<h1 class="heading text-[1.8rem] font-medium uppercase">OD Request</h1>
</div>
<div class="total-projects ml-[-0.888rem] px-4">
<a class="btn btn-primary duration-500 hover:bg-hover-warning py-[5px] px-4 text-[13px] rounded text-white bg-warning leading-[18px] inline-block border border-warning ml-2 cursor-pointer dz-modal-btn" data-dz-modal="odmodal">Upload</a>
</div>
</div>
</div>
</div>
</div>
<div class="xl:w-1/2 sm:w-1/2 w-half">
<div class="card z-auto flex flex-col hover:shadow-[rgba(0,0,0,0.1)_0px_10px_15px_-3px,rgba(0,0,0,0.05)_0px_4px_6px_-2px]">
<div class="card-body p-5">
<div class="flex items-center justify-between text-center">
<div class="px-4">
<h1 class="heading text-[1.8rem] font-medium uppercase">OT Request</h1>
</div>
<div class="total-projects ml-[-0.888rem] px-4">
<a class="btn btn-primary duration-500 hover:bg-hover-warning py-[5px] px-4 text-[13px] rounded text-white bg-warning leading-[18px] inline-block border border-warning ml-2 cursor-pointer dz-modal-btn" data-dz-modal="otmodal">Upload</a>
</div>
</div>
</div>
</div>
</div>
<div class="xl:w-1/2 sm:w-1/2 w-half">
<div class="card z-auto flex flex-col hover:shadow-[rgba(0,0,0,0.1)_0px_10px_15px_-3px,rgba(0,0,0,0.05)_0px_4px_6px_-2px]">
<div class="card-body p-5">
<div class="flex items-center justify-between text-center">
<div class="px-4">
<h1 class="heading text-[1.8rem] font-medium uppercase">Travel Request</h1>
</div>
<div class="total-projects ml-[-0.888rem] px-4">
<a class="btn btn-primary duration-500 hover:bg-hover-warning py-[5px] px-4 text-[13px] rounded text-white bg-warning leading-[18px] inline-block border border-warning ml-2 cursor-pointer dz-modal-btn" data-dz-modal="travelmodal">Upload</a>
</div>
</div>
</div>
</div>
</div>
<div wire:ignore.self class="modal fade fixed top-0 right-0 overflow-y-auto overflow-x-hidden dz-scroll w-full h-full z-[1055] translate-y-[-50px] dz-modal-box model-close" id="leavemodal">
<div class="modal-dialog modal-dialog-center max-w-[500px] mx-auto my-[1.75rem] w-auto relative pointer-events-none">
<div class="modal-content mx-[10px] flex flex-col relative rounded-md bg-white dark:bg-[#242424] w-full pointer-events-auto">
<div class="modal-header flex justify-between items-center flex-wrap py-4 px-[1.875rem] relative z-[2] border-b border-b-color">
<h1 class="modal-title text-base" id="exampleModalLabel">Upload Leave List</h1>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close">x</button>
</div>
<div class="modal-body relative p-[1.875rem]">
<div class="row">
<div class="w-full">
<label class="text-body-color mt-4">Leave List<span class="text-danger">*</span></label>
<input class="form-control relative text-[13px] text-body-color h-[2.813rem] border border-b-color block rounded-md py-1.5 px-3 duration-500 focus:border-primary dark:hover:border-b-color outline-none w-full" wire:model.defer="leave_employee" type="file">
</div>
</div>
</div>
<div class="modal-footer flex items-center justify-end flex-wrap py-4 px-[1.875rem] border-t border-b-color">
<button type="button" class="close-btn btn xl:py-[0.719rem] py-2.5 xl:px-[1.563rem] px-4 m-1 duration-300 xl:text-[15px] text-[13px] font-medium rounded text-danger bg-danger-light leading-5 inline-block border border-danger-light btn-danger light hover:text-white hover:bg-danger">Close</button>
<button type="button" class="save-btn btn btn-primary xl:py-[0.719rem] py-2.5 xl:px-[1.563rem] px-4 m-1 duration-300 xl:text-[15px] text-[13px] font-medium rounded text-white bg-primary leading-5 inline-block border border-primary hover:bg-hover-primary" wire:click="leaveUpload">Upload</button>
</div>
</div>
</div>
</div>
<div wire:ignore.self class="modal fade fixed top-0 right-0 overflow-y-auto overflow-x-hidden dz-scroll w-full h-full z-[1055] translate-y-[-50px] dz-modal-box model-close" id="odmodal">
<div class="modal-dialog modal-dialog-center max-w-[500px] mx-auto my-[1.75rem] w-auto relative pointer-events-none">
<div class="modal-content mx-[10px] flex flex-col relative rounded-md bg-white dark:bg-[#242424] w-full pointer-events-auto">
<div class="modal-header flex justify-between items-center flex-wrap py-4 px-[1.875rem] relative z-[2] border-b border-b-color">
<h1 class="modal-title text-base" id="exampleModalLabel">Upload OD Request</h1>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close">x</button>
</div>
<div class="modal-body relative p-[1.875rem]">
<div class="row">
<div class="w-full">
<label class="text-body-color mt-4">OD Details<span class="text-danger">*</span></label>
<input class="form-control relative text-[13px] text-body-color h-[2.813rem] border border-b-color block rounded-md py-1.5 px-3 duration-500 focus:border-primary dark:hover:border-b-color outline-none w-full" wire:model.defer="od_employee" type="file">
</div>
</div>
</div>
<div class="modal-footer flex items-center justify-end flex-wrap py-4 px-[1.875rem] border-t border-b-color">
<button type="button" class="close-btn btn xl:py-[0.719rem] py-2.5 xl:px-[1.563rem] px-4 m-1 duration-300 xl:text-[15px] text-[13px] font-medium rounded text-danger bg-danger-light leading-5 inline-block border border-danger-light btn-danger light hover:text-white hover:bg-danger">Close</button>
<button type="button" class="save-btn btn btn-primary xl:py-[0.719rem] py-2.5 xl:px-[1.563rem] px-4 m-1 duration-300 xl:text-[15px] text-[13px] font-medium rounded text-white bg-primary leading-5 inline-block border border-primary hover:bg-hover-primary" wire:click="odUpload">Upload</button>
</div>
</div>
</div>
</div>
<div wire:ignore.self class="modal fade fixed top-0 right-0 overflow-y-auto overflow-x-hidden dz-scroll w-full h-full z-[1055] translate-y-[-50px] dz-modal-box model-close" id="otmodal">
<div class="modal-dialog modal-dialog-center max-w-[500px] mx-auto my-[1.75rem] w-auto relative pointer-events-none">
<div class="modal-content mx-[10px] flex flex-col relative rounded-md bg-white dark:bg-[#242424] w-full pointer-events-auto">
<div class="modal-header flex justify-between items-center flex-wrap py-4 px-[1.875rem] relative z-[2] border-b border-b-color">
<h1 class="modal-title text-base" id="exampleModalLabel">Upload OT Request</h1>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close">x</button>
</div>
<div class="modal-body relative p-[1.875rem]">
<div class="row">
<div class="w-full">
<label class="text-body-color mt-4">OT Details<span class="text-danger">*</span></label>
<input class="form-control relative text-[13px] text-body-color h-[2.813rem] border border-b-color block rounded-md py-1.5 px-3 duration-500 focus:border-primary dark:hover:border-b-color outline-none w-full" wire:model.defer="ot_employee" type="file">
</div>
</div>
</div>
<div class="modal-footer flex items-center justify-end flex-wrap py-4 px-[1.875rem] border-t border-b-color">
<button type="button" class="close-btn btn xl:py-[0.719rem] py-2.5 xl:px-[1.563rem] px-4 m-1 duration-300 xl:text-[15px] text-[13px] font-medium rounded text-danger bg-danger-light leading-5 inline-block border border-danger-light btn-danger light hover:text-white hover:bg-danger">Close</button>
<button type="button" class="save-btn btn btn-primary xl:py-[0.719rem] py-2.5 xl:px-[1.563rem] px-4 m-1 duration-300 xl:text-[15px] text-[13px] font-medium rounded text-white bg-primary leading-5 inline-block border border-primary hover:bg-hover-primary" wire:click="otUpload">Upload</button>
</div>
</div>
</div>
</div>
<div wire:ignore.self class="modal fade fixed top-0 right-0 overflow-y-auto overflow-x-hidden dz-scroll w-full h-full z-[1055] translate-y-[-50px] dz-modal-box model-close" id="travelmodal">
<div class="modal-dialog modal-dialog-center max-w-[500px] mx-auto my-[1.75rem] w-auto relative pointer-events-none">
<div class="modal-content mx-[10px] flex flex-col relative rounded-md bg-white dark:bg-[#242424] w-full pointer-events-auto">
<div class="modal-header flex justify-between items-center flex-wrap py-4 px-[1.875rem] relative z-[2] border-b border-b-color">
<h1 class="modal-title text-base" id="exampleModalLabel">Upload Travel Request</h1>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close">x</button>
</div>
<div class="modal-body relative p-[1.875rem]">
<div class="row">
<div class="w-full">
<label class="text-body-color mt-4">Travel Details<span class="text-danger">*</span></label>
<input class="form-control relative text-[13px] text-body-color h-[2.813rem] border border-b-color block rounded-md py-1.5 px-3 duration-500 focus:border-primary dark:hover:border-b-color outline-none w-full" wire:model.defer="travel_employee" type="file">
</div>
</div>
</div>
<div class="modal-footer flex items-center justify-end flex-wrap py-4 px-[1.875rem] border-t border-b-color">
<button type="button" class="close-btn btn xl:py-[0.719rem] py-2.5 xl:px-[1.563rem] px-4 m-1 duration-300 xl:text-[15px] text-[13px] font-medium rounded text-danger bg-danger-light leading-5 inline-block border border-danger-light btn-danger light hover:text-white hover:bg-danger">Close</button>
<button type="button" class="save-btn btn btn-primary xl:py-[0.719rem] py-2.5 xl:px-[1.563rem] px-4 m-1 duration-300 xl:text-[15px] text-[13px] font-medium rounded text-white bg-primary leading-5 inline-block border border-primary hover:bg-hover-primary" wire:click="travelUpload">Upload</button>
</div>
</div>
</div>
</div>
<div wire:ignore.self class="modal fade fixed top-0 right-0 overflow-y-auto overflow-x-hidden dz-scroll w-full h-full z-[1055] translate-y-[-50px] dz-modal-box model-close" id="wagemodal">
<div class="modal-dialog modal-dialog-center max-w-[500px] mx-auto my-[1.75rem] w-auto relative pointer-events-none">
<div class="modal-content mx-[10px] flex flex-col relative rounded-md bg-white dark:bg-[#242424] w-full pointer-events-auto">
<div class="modal-header flex justify-between items-center flex-wrap py-4 px-[1.875rem] relative z-[2] border-b border-b-color">
<h1 class="modal-title text-base" id="exampleModalLabel">Upload Monthly Wage details</h1>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close">x</button>
</div>
<div class="flex justify-end px-8 py-2">
<p class="modal-title text-base text-danger cursor-pointer" id="exampleModalLabel" wire:click="exportWage">Download wage sheet format</p>
</div>
<div class="modal-body relative p-[1.875rem]">
<div class="row">
<div class="w-1/2">
<label class="text-body-color mt-4">Enter Month<span class="text-danger">*</span></label>
<input class="form-control relative text-[13px] text-body-color h-[2.813rem] border border-b-color block rounded-md py-1.5 px-3 duration-500 focus:border-primary dark:hover:border-b-color outline-none w-full" wire:model.defer="month_year" type="month">
</div>
<div class="w-1/2">
<label class="text-body-color mt-4">Wage details<span class="text-danger">*</span></label>
<input class="form-control relative text-[13px] text-body-color h-[2.813rem] border border-b-color block rounded-md py-1.5 px-3 duration-500 focus:border-primary dark:hover:border-b-color outline-none w-full" wire:model.defer="employee_wages" type="file">
</div>
</div>
</div>
<div class="modal-footer flex items-center justify-end flex-wrap py-4 px-[1.875rem] border-t border-b-color">
<button type="button" class="close-btn btn xl:py-[0.719rem] py-2.5 xl:px-[1.563rem] px-4 m-1 duration-300 xl:text-[15px] text-[13px] font-medium rounded text-danger bg-danger-light leading-5 inline-block border border-danger-light btn-danger light hover:text-white hover:bg-danger">Close</button>
<button type="button" class="save-btn btn btn-primary xl:py-[0.719rem] py-2.5 xl:px-[1.563rem] px-4 m-1 duration-300 xl:text-[15px] text-[13px] font-medium rounded text-white bg-primary leading-5 inline-block border border-primary hover:bg-hover-primary" wire:click="importWageSheet">Upload</button>
</div>
</div>
</div>
</div>
</div>
@section('externaljs')
<script>
window.addEventListener('closeModal', event => {
$('#wagemodal').modal('hide');
});
</script>
@endsection