first commit

This commit is contained in:
benjibennn
2023-12-22 12:35:55 +08:00
commit 9f89a732d6
872 changed files with 156291 additions and 0 deletions

View File

@@ -0,0 +1,215 @@
@extends('theme::user.layouts.app')
@section('style')
<style>
.pagination-link {
padding: 35px;
padding-top: 0px;
}
.pagination-link .flex.justify-between.flex-1.sm\:hidden {
justify-content: unset !important;
}
.pagination-link p.text-sm.text-gray-700.leading-5 {
margin-right: 20px;
}
img.doc-file-img {
width: 100%;
}
</style>
@endsection
@section('content')
<div class="document-library-page">
<div class="title-wrapper">
<form action="{{ Request::url() }}" method="GET" class="theme-form search-wrapper mb-2">
<span class="search-title">Document/Record search</span>
<div class="search-input-wrapper">
<a class="filter-modal" href="#" data-bs-toggle="modal" data-bs-target="#searchFilterModal">
<img src="{{ asset('themes/tailwind/images/filter-icon.png') }}">
</a>
<input type="text" name="s" value="{{ $search }}" class="form-control" required>
</div>
<button type="submit" class="btn blue-btn">Search</button>
</form>
<div class="title-actions-wrapper">
<a href="{{ route('wave.user.book-keeping.list') }}" class="btn yellow-btn mb-2">Back to list</a>
</div>
</div>
<div class="card-wrapper">
<div class="table-responsive mb-5">
<table class="table custom-table">
<thead>
<tr>
<th scope="col">
<div class="d-flex align-items-center">
<div class="custom-radio-checkbox">
<input type="checkbox" id="checkAll" value="all">
<label for="checkAll"></label>
</div>
Document Name
</div>
</th>
<th scope="col">Document Category</th>
<th scope="col">Document Size</th>
<th scope="col">Date Uploaded</th>
<th scope="col">Action</th>
</tr>
</thead>
<tbody>
@foreach($documents as $doc)
<tr>
<td>
<div class="d-flex align-items-center">
<div class="custom-radio-checkbox">
<input type="checkbox" class="download-checkbox" id="row-{{ $doc->id }}" value="{{ $doc->id }}">
<label for="row-{{ $doc->id }}"></label>
</div>
<img class="img-fluid mr-2" width="30" src="{{ asset('themes/tailwind/images/jpg.svg') }}">
{{ $doc->file_name }}
</div>
</td>
<td>{{ $doc->category->name }}</td>
<td><span class="green-text">{{ $doc->file_size }}</span></td>
<td>{{ $doc->created_at }}</td>
<td>
<div class="table-actions">
<a href="#" class="action-btn text-underline sky-blue-text" data-bs-toggle="modal" data-bs-target="#pdfViewModal-{{ $doc->id }}" >View</a>
<span class="action-separator">|</span>
<a href="{{ $doc->url }}" id="download-doc-{{ $doc->id }}" class="action-btn text-underline sky-blue-text" target="_blank" >Download</a>
</div>
<div class="modal fade doc-file-img-modal" id="pdfViewModal-{{ $doc->id }}" tabindex="-1" role="dialog" aria-labelledby="pdfViewModal-{{ $doc->id }}Label" aria-hidden="true">
<div class="modal-dialog modal-lg" role="document">
<div class="modal-content">
<div class="modal-body">
<img class="doc-file-img" src="{{ $doc->url }}" style="margin: 0 auto;" alt="">
</div>
</div>
</div>
</div>
</td>
</tr>
@endforeach
</tbody>
</table>
</div>
<button type="button" class="btn blue-btn mx-auto mb-5" id="download-all-file" >Download</button>
<div class="pagination-link" >{{ $documents->links() }}</div>
</div>
</div>
{{-- Add Search Filter Modal --}}
<div class="modal fade custom-modal style2" id="searchFilterModal" tabindex="-1" aria-labelledby="searchFilterModalLabel" aria-hidden="true">
<div class="modal-dialog modal-740px modal-dialog-centered">
<div class="modal-content mx-auto">
<div class="modal-body p-0">
<p class="modal-title">Search</p>
<form action="{{ url('/user/book-keeping/document-library') }}" method="get" class="theme-form">
<div class="row mb-5 align-items-center">
<div class="col-auto">
<label class="col-form-label">Document category</label>
</div>
<div class="col">
<select class="w-100" name="category_id" >
<option value="all" selected >Any</option>
@foreach($document_category as $category)
<option value="{{ $category->id }}">{{ $category->name }}</option>
@endforeach
</select>
</div>
</div>
<div class="row mb-5 align-items-center">
<div class="col-auto">
<label class="col-form-label">Status</label>
</div>
<div class="col">
<select class="w-100" name="status" >
<option value="all" selected>All</option>
<option value="completed" >ORC Completed</option>
</select>
</div>
</div>
<div class="row mb-5 align-items-center">
<div class="col-auto">
<label class="col-form-label">Keyword</label>
</div>
<div class="col">
<input type="text" class="form-control" name="s" value="">
</div>
</div>
<div class="mb-5">
<div class="row align-items-center">
<div class="col-auto">
<label class="col-form-label">Date uploaded</label>
</div>
<div class="col">
<select class="w-100" name="fix_date" id="dateFilter">
<option value="all" selected >Any Time</option>
<option value="today">Today</option>
<option value="2">Yesterday</option>
<option value="7">Last 7 days</option>
<option value="30">Last 30 days</option>
<option value="90">Last 90 days</option>
<option value="custom">Custom...</option>
</select>
</div>
</div>
<div class="row mt-3" id="customDateFields" style="display: none;">
<div class="col-md-12">
<label class="col-form-label">Between</label>
</div>
<div class="col-md-12">
<div class="row align-items-center">
<div class="col date-picker-wrapper">
<img src="{{ asset('themes/tailwind/images/calendar-2.png') }}">
<input type="date" class="form-control" name="data_from" placeholder="After">
</div>
<div class="col date-picker-wrapper">
<img src="{{ asset('themes/tailwind/images/calendar-2.png') }}">
<input type="date" class="form-control" name="date_to" placeholder="Before">
</div>
</div>
</div>
</div>
</div>
<div class="d-flex align-items-center justify-content-center">
<button type="submit" class="btn blue-btn mx-3">Search</button>
<button type="button" class="btn red-btn mx-3" data-bs-dismiss="modal">Cancel</button>
</div>
</form>
</div>
</div>
</div>
</div>
@endsection
@section('script')
<script>
$(function() {
$('#searchFilterModal #dateFilter').change(function() {
if ($(this).val() == 'custom') {
$('#searchFilterModal #customDateFields').show();
}
else {
$('#searchFilterModal #customDateFields').hide();
}
});
$('#checkAll').click(function(){
$('.download-checkbox').prop('checked', $(this).prop('checked'));
});
$('#download-all-file').click(function(){
console.log('testtest');
$('.download-checkbox').each(function(){
if ($(this).prop('checked')) {
console.log('#download-doc-' + $(this).val());
$('#download-doc-' + $(this).val())[0].click();
}
});
});
});
</script>
@endsection