1 | @extends('layouts.app')
|
---|
2 |
|
---|
3 | @section("title", "SaveSpace - Dashboard")
|
---|
4 |
|
---|
5 | @section('head')
|
---|
6 |
|
---|
7 | <!-- DataTable -->
|
---|
8 | <link rel="stylesheet" href="{{ url('vendors/dataTable/datatables.min.css') }}" type="text/css">
|
---|
9 | @endsection
|
---|
10 |
|
---|
11 | @section('content')
|
---|
12 |
|
---|
13 | <div class="page-header">
|
---|
14 | <nav aria-label="breadcrumb">
|
---|
15 | <ol class="breadcrumb">
|
---|
16 | <li class="breadcrumb-item">
|
---|
17 | <a href="{{ url('/') }}">Dashboard</a>
|
---|
18 | </li>
|
---|
19 | </ol>
|
---|
20 | </nav>
|
---|
21 | </div>
|
---|
22 |
|
---|
23 | <div class="row">
|
---|
24 | <div class="col-md-12">
|
---|
25 |
|
---|
26 | <div class="row">
|
---|
27 | <div class="col-lg-4 col-md-12">
|
---|
28 | <div class="card">
|
---|
29 | <div class="card-body">
|
---|
30 | <div class="d-flex justify-content-between mb-3">
|
---|
31 | <div>
|
---|
32 | <p class="text-muted">Total Departments</p>
|
---|
33 | <h2 class="font-weight-bold">{{ $departments->count() }}</h2>
|
---|
34 | </div>
|
---|
35 | <div>
|
---|
36 | <figure class="avatar">
|
---|
37 | <span class="avatar-title bg-success-bright text-success rounded-circle">
|
---|
38 | <i class="ti-layout-grid2"></i>
|
---|
39 | </span>
|
---|
40 | </figure>
|
---|
41 | </div>
|
---|
42 | </div>
|
---|
43 | <div class="d-inline-flex align-items-center">
|
---|
44 | <a href="{{ route("dashboard.departments.index") }}" class="text-linkedin"><i class="fa fa-arrow-right text-linkedin pr-1" aria-hidden="true"></i> Show departments</a>
|
---|
45 | </div>
|
---|
46 | </div>
|
---|
47 | </div>
|
---|
48 | </div>
|
---|
49 | <div class="col-lg-4 col-md-12">
|
---|
50 | <div class="card">
|
---|
51 | <div class="card-body">
|
---|
52 | <div class="d-flex justify-content-between mb-3">
|
---|
53 | <div>
|
---|
54 | <p class="text-muted">Number of folders</p>
|
---|
55 | <h2 class="font-weight-bold">{{ $folders->count() }}</h2>
|
---|
56 | </div>
|
---|
57 | <div>
|
---|
58 | <figure class="avatar">
|
---|
59 | <span class="avatar-title bg-info-bright text-info rounded-circle">
|
---|
60 | <i class="ti-folder"></i>
|
---|
61 | </span>
|
---|
62 | </figure>
|
---|
63 | </div>
|
---|
64 | </div>
|
---|
65 | <div class="d-inline-flex align-items-center">
|
---|
66 | <a href="{{ route("dashboard.folders.index") }}" class="text-linkedin"><i class="fa fa-arrow-right text-linkedin pr-1" aria-hidden="true"></i> Show folders</a>
|
---|
67 | </div>
|
---|
68 | </div>
|
---|
69 | </div>
|
---|
70 | </div>
|
---|
71 | <div class="col-lg-4 col-md-12">
|
---|
72 | <div class="card">
|
---|
73 | <div class="card-body">
|
---|
74 | <div class="d-flex justify-content-between mb-3">
|
---|
75 | <div>
|
---|
76 | <p class="text-muted">Total Files</p>
|
---|
77 | <h2 class="font-weight-bold">{{ $files->count() }}</h2>
|
---|
78 | </div>
|
---|
79 | <div>
|
---|
80 | <figure class="avatar">
|
---|
81 | <span class="avatar-title bg-warning-bright text-warning rounded-circle">
|
---|
82 | <i class="ti-files"></i>
|
---|
83 | </span>
|
---|
84 | </figure>
|
---|
85 | </div>
|
---|
86 | </div>
|
---|
87 | <div class="d-inline-flex align-items-center">
|
---|
88 | <a href="{{ route("dashboard.files.index") }}" class="text-linkedin"><i class="fa fa-arrow-right text-linkedin pr-1" aria-hidden="true"></i> Show files</a>
|
---|
89 | </div>
|
---|
90 | </div>
|
---|
91 | </div>
|
---|
92 | </div>
|
---|
93 |
|
---|
94 | </div>
|
---|
95 |
|
---|
96 | </div>
|
---|
97 | </div>
|
---|
98 |
|
---|
99 |
|
---|
100 | <div class="card">
|
---|
101 | <div class="card-body">
|
---|
102 | <div class="d-flex justify-content-between">
|
---|
103 | <h6 class="card-title">Recent Files</h6>
|
---|
104 | <div>
|
---|
105 | <a href="{{route("dashboard.index")}}" class="btn btn-outline-light btn-sm mr-2">
|
---|
106 | <i class="fa fa-refresh"></i>
|
---|
107 | </a>
|
---|
108 | </div>
|
---|
109 | </div>
|
---|
110 | <div class="row">
|
---|
111 | <div class="col-md-12">
|
---|
112 | <div class="table-responsive">
|
---|
113 | <table id="recent-orders" class="table table-lg">
|
---|
114 | <thead>
|
---|
115 | <tr>
|
---|
116 | <th>
|
---|
117 | </th>
|
---|
118 | <th>Image</th>
|
---|
119 | <th>Name</th>
|
---|
120 | <th>Created at</th>
|
---|
121 | <th>Updated at</th>
|
---|
122 | <th>Folder name</th>
|
---|
123 | <th>Folder archive ID</th>
|
---|
124 | <th>Directory</th>
|
---|
125 | <th>Actions</th>
|
---|
126 | </tr>
|
---|
127 | </thead>
|
---|
128 | <tbody>
|
---|
129 | @foreach($recentFiles as $file)
|
---|
130 | <tr>
|
---|
131 | <td></td>
|
---|
132 | <td>
|
---|
133 | @if(in_array(explode('.', $file->name)[1], $excelExt))
|
---|
134 | <div class="col-xl-1 col-lg-1 col-md-1 col-sm-2">
|
---|
135 | <i class="fa fa-file-excel-o text-success fa-2x"></i>
|
---|
136 | </div>
|
---|
137 | @else @if(in_array(explode('.', $file->name)[1], $textExt))
|
---|
138 | <div class="col-xl-1 col-lg-1 col-md-1 col-sm-2">
|
---|
139 | <i class="fa fa-file-word-o text-info fa-2x"></i>
|
---|
140 | </div>
|
---|
141 | @else @if(explode('.', $file->name)[1] == 'pdf')
|
---|
142 | <div class="col-xl-1 col-lg-1 col-md-1 col-sm-2">
|
---|
143 | <i class="fa fa-file-pdf-o text-danger fa-2x"></i>
|
---|
144 | </div>
|
---|
145 | @else @if(in_array(explode('.', $file->name)[1], $imageExt))
|
---|
146 | <div class="col-xl-1 col-lg-1 col-md-1 col-sm-2">
|
---|
147 | <a href="{{ url('/uploads/' . $file->location) }}" class="image-popup-gallery-item">
|
---|
148 | <div class="image-hover">
|
---|
149 | <img src="{{ url('/uploads/' . $file->location) }}" class="rounded" width="30" alt="image">
|
---|
150 | </div>
|
---|
151 | </a>
|
---|
152 | </div>
|
---|
153 | @else
|
---|
154 | <div class="col-xl-1 col-lg-1 col-md-1 col-sm-2">
|
---|
155 | <i class="fa fa-file-text-o text-warning fa-2x"></i>
|
---|
156 | </div>
|
---|
157 | @endif
|
---|
158 | @endif
|
---|
159 | @endif
|
---|
160 | @endif
|
---|
161 |
|
---|
162 |
|
---|
163 | </td>
|
---|
164 | <td>{{ $file->name }}</td>
|
---|
165 | <td>{{ date('d.m.Y - H:i', strtotime($file->created_at)) }}</td>
|
---|
166 | @if($file->updated_at==NULL)
|
---|
167 | <td>/</td>
|
---|
168 | @else
|
---|
169 | <td>{{ date('d.m.Y - H:i', strtotime($file->updated_at)) }}</td>
|
---|
170 | @endif
|
---|
171 | <td><a href="{{ route('dashboard.folders.files', ['id' => $file->folder_id]) }}" class="text-linkedin">{{ \App\Models\Folder::find($file->folder_id)->name }}</a></td>
|
---|
172 | <td>{{ \App\Models\Folder::find($file->folder_id)->arch_id }}</td>
|
---|
173 | <!-- Trigger -->
|
---|
174 | <td><button data-clipboard-text="{{$file->location}}" class="btn btn-sm btn-primary text-white" data-toggle="tooltip" data-placement="right" title="{{$file->location}}"><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-clipboard" viewBox="0 0 16 16">
|
---|
175 | <path d="M4 1.5H3a2 2 0 0 0-2 2V14a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V3.5a2 2 0 0 0-2-2h-1v1h1a1 1 0 0 1 1 1V14a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V3.5a1 1 0 0 1 1-1h1v-1z"/>
|
---|
176 | <path d="M9.5 1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-3a.5.5 0 0 1-.5-.5v-1a.5.5 0 0 1 .5-.5h3zm-3-1A1.5 1.5 0 0 0 5 1.5v1A1.5 1.5 0 0 0 6.5 4h3A1.5 1.5 0 0 0 11 2.5v-1A1.5 1.5 0 0 0 9.5 0h-3z"/>
|
---|
177 | </svg></button>
|
---|
178 | </td>
|
---|
179 | <td>
|
---|
180 | <a href="javascript:void(0)" class="text-secondary" data-toggle="modal" data-target="#editModal_{{$file->id}}" title="Edit">
|
---|
181 | <i class="ti-pencil"></i>
|
---|
182 | </a>
|
---|
183 | <a href="{{ route("dashboard.files.downloadFile", ['id' => $file->id]) }}" class="text-danger ml-2"title="Download">
|
---|
184 | <i class="ti-download"></i>
|
---|
185 | </a>
|
---|
186 | <a href="javascript:void(0)" class="text-danger ml-2" data-toggle="modal" data-target="#deleteModal_{{$file->id}}" title="Delete">
|
---|
187 | <i class="ti-trash"></i>
|
---|
188 | </a>
|
---|
189 | </td>
|
---|
190 | </tr>
|
---|
191 | <div class="modal fade" id="deleteModal_{{$file->id}}" tabindex="-1" role="dialog" aria-hidden="true">
|
---|
192 | <div class="modal-dialog modal-dialog-centered" role="document">
|
---|
193 | <div class="modal-content">
|
---|
194 | <div class="modal-header">
|
---|
195 | <h5 class="modal-title" id="exampleModalCenterTitle">Delete confirmation</h5>
|
---|
196 | <button type="button" class="close" data-dismiss="modal" aria-label="Close">
|
---|
197 | <i class="ti-close"></i>
|
---|
198 | </button>
|
---|
199 | </div>
|
---|
200 | <div class="modal-body">
|
---|
201 | <form action="{{ route("dashboard.files.deleteFile", $file->id) }}" method="POST">
|
---|
202 | @csrf
|
---|
203 | @method('DELETE')
|
---|
204 | <p>Are you sure you want to delete file {{$file->name}}?</p>
|
---|
205 | <p>Location: <span class="pr-1">{{$file->location}}</span></p>
|
---|
206 | <div class="modal-footer">
|
---|
207 | <button type="button" class="btn btn-secondary" data-dismiss="modal">Close
|
---|
208 | </button>
|
---|
209 | <button type="submit" class="btn btn-primary">Save changes</button>
|
---|
210 | </div>
|
---|
211 | </form>
|
---|
212 | </div>
|
---|
213 |
|
---|
214 | </div>
|
---|
215 | </div>
|
---|
216 | </div>
|
---|
217 |
|
---|
218 | <div class="modal fade" id="editModal_{{$file->id}}" tabindex="-1" role="dialog" aria-hidden="true">
|
---|
219 | <div class="modal-dialog modal-dialog-centered" role="document">
|
---|
220 | <div class="modal-content">
|
---|
221 | <div class="modal-header">
|
---|
222 | <h5 class="modal-title" id="exampleModalCenterTitle">Rename file</h5>
|
---|
223 | <button type="button" class="close" data-dismiss="modal" aria-label="Close">
|
---|
224 | <i class="ti-close"></i>
|
---|
225 | </button>
|
---|
226 | </div>
|
---|
227 | <div class="modal-body">
|
---|
228 | <form action="{{ route("dashboard.files.renameFile", ["id" =>$file->id]) }}" method="post" accept-charset="utf-8">
|
---|
229 | @method("patch")
|
---|
230 | @csrf
|
---|
231 | <div class="row">
|
---|
232 | <div class="col-md-12">
|
---|
233 | <div class="form-group">
|
---|
234 | <label class="form-label">Current name: {{$file->name}}</label>
|
---|
235 | <input type="text" name="name" value="{{ explode('.', $file->name)[0] }}" maxlength="255" title="Don't include: '\/.|'" pattern="^[^.\/|]+$" class="form-control" required>
|
---|
236 | </div>
|
---|
237 | </div>
|
---|
238 | </div>
|
---|
239 | <br/>
|
---|
240 | <div class="modal-footer">
|
---|
241 | <button type="button" class="btn btn-secondary" data-dismiss="modal">Close
|
---|
242 | </button>
|
---|
243 | <button type="submit" class="btn btn-primary">Save changes</button>
|
---|
244 | </div>
|
---|
245 | </form>
|
---|
246 | </div>
|
---|
247 |
|
---|
248 | </div>
|
---|
249 | </div>
|
---|
250 | </div>
|
---|
251 | @endforeach
|
---|
252 | </tbody>
|
---|
253 | </table>
|
---|
254 | </div>
|
---|
255 | </div>
|
---|
256 | </div>
|
---|
257 | </div>
|
---|
258 | </div>
|
---|
259 |
|
---|
260 | <div class="row">
|
---|
261 | <div class="col-lg-8 col-md-12">
|
---|
262 | <div class="card">
|
---|
263 | <div class="card-body">
|
---|
264 | <div class="d-md-flex mb-2 mb-sm-0 justify-content-between">
|
---|
265 | <canvas id="canvas"></canvas>
|
---|
266 | </div>
|
---|
267 | </div>
|
---|
268 | </div>
|
---|
269 | </div>
|
---|
270 | <div class="col-lg-4 col-md-12">
|
---|
271 | <div class="card">
|
---|
272 | <div class="card-body pb-0">
|
---|
273 | <div class="d-flex justify-content-between align-items-start mb-3">
|
---|
274 | <h6 class="card-title mb-0">Largest departments</h6>
|
---|
275 | <a href="{{route("dashboard.departments.index")}}" class="small text-linkedin">View</a>
|
---|
276 | </div>
|
---|
277 | </div>
|
---|
278 | <div class="table-responsive">
|
---|
279 | <table class="table table-striped mb-0">
|
---|
280 | <thead>
|
---|
281 | <tr>
|
---|
282 | <th>Department</th>
|
---|
283 | <th>Number of folders</th>
|
---|
284 | </tr>
|
---|
285 | </thead>
|
---|
286 | <tbody>
|
---|
287 | @foreach($largestDepartments as $department)
|
---|
288 | <tr>
|
---|
289 |
|
---|
290 | <td>
|
---|
291 | <a href="#">{{$department->name}}</a>
|
---|
292 | </td>
|
---|
293 | <td>
|
---|
294 | <a href="#">{{$department->no_of_folders}}</a>
|
---|
295 | </td>
|
---|
296 | </tr>
|
---|
297 | @endforeach
|
---|
298 | </tbody>
|
---|
299 | </table>
|
---|
300 | </div>
|
---|
301 | </div>
|
---|
302 | </div>
|
---|
303 | </div>
|
---|
304 | @endsection
|
---|
305 |
|
---|
306 | @section('script')
|
---|
307 |
|
---|
308 | <!-- Apex chart -->
|
---|
309 | <script src="https://apexcharts.com/samples/assets/irregular-data-series.js"></script>
|
---|
310 | <script src="{{ url('/vendors/charts/apex/apexcharts.min.js') }}"></script>
|
---|
311 |
|
---|
312 | <!-- Daterangepicker -->
|
---|
313 | <script src="{{ url('vendors/datepicker/daterangepicker.js') }}"></script>
|
---|
314 |
|
---|
315 | <!-- DataTable -->
|
---|
316 | <script src="{{ url('vendors/dataTable/datatables.min.js') }}"></script>
|
---|
317 |
|
---|
318 | <!-- Dashboard scripts -->
|
---|
319 | <script src="{{ url('/assets/js/examples/dashboard.js') }}"></script>
|
---|
320 |
|
---|
321 | <!-- Vamp -->
|
---|
322 | <script src="{{ url('vendors/vmap/jquery.vmap.min.js') }}"></script>
|
---|
323 | <script src="{{ url('vendors/vmap/maps/jquery.vmap.usa.js') }}"></script>
|
---|
324 | <script src="{{ url('assets/js/examples/vmap.js') }}"></script>
|
---|
325 |
|
---|
326 | <!-- To use theme colors with Javascript -->
|
---|
327 | <div class="colors">
|
---|
328 | <div class="bg-primary"></div>
|
---|
329 | <div class="bg-primary-bright"></div>
|
---|
330 | <div class="bg-secondary"></div>
|
---|
331 | <div class="bg-secondary-bright"></div>
|
---|
332 | <div class="bg-info"></div>
|
---|
333 | <div class="bg-info-bright"></div>
|
---|
334 | <div class="bg-success"></div>
|
---|
335 | <div class="bg-success-bright"></div>
|
---|
336 | <div class="bg-danger"></div>
|
---|
337 | <div class="bg-danger-bright"></div>
|
---|
338 | <div class="bg-warning"></div>
|
---|
339 | <div class="bg-warning-bright"></div>
|
---|
340 | </div>
|
---|
341 |
|
---|
342 | <script src="{{ url('assets/js/examples/pages/ecommerce-dashboard.js') }}"></script>
|
---|
343 | <script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.9.3/Chart.min.js"></script>
|
---|
344 | <script>
|
---|
345 | var year = <?php echo $year; ?>;
|
---|
346 | var file = <?php echo $file; ?>;
|
---|
347 | var barChartData = {
|
---|
348 | labels: year,
|
---|
349 | datasets: [{
|
---|
350 | label: 'File',
|
---|
351 | backgroundColor: "red",
|
---|
352 | data: file
|
---|
353 | }]
|
---|
354 | };
|
---|
355 |
|
---|
356 | window.onload = function() {
|
---|
357 | var ctx = document.getElementById("canvas").getContext("2d");
|
---|
358 | window.myBar = new Chart(ctx, {
|
---|
359 | type: 'bar',
|
---|
360 | data: barChartData,
|
---|
361 | options: {
|
---|
362 | elements: {
|
---|
363 | rectangle: {
|
---|
364 | borderWidth: 2,
|
---|
365 | borderColor: '#c1c1c1',
|
---|
366 | borderSkipped: 'bottom'
|
---|
367 | }
|
---|
368 | },
|
---|
369 | responsive: true,
|
---|
370 | title: {
|
---|
371 | display: true,
|
---|
372 | text: 'Yearly uploaded files'
|
---|
373 | }
|
---|
374 | }
|
---|
375 | });
|
---|
376 | };
|
---|
377 | </script>
|
---|
378 | @endsection
|
---|