Ümit Tunç
293 lines
9.6 KiB
PHP
293 lines
9.6 KiB
PHP
<?php
|
||
$folderPath = request('folder_path');
|
||
$storagePath = storage_path("documents/$folderPath");
|
||
|
||
$files = [];
|
||
if (is_dir($storagePath)) {
|
||
$items = scandir($storagePath);
|
||
foreach ($items as $item) {
|
||
if ($item != '.' && $item != '..') {
|
||
$fullPath = $storagePath . '/' . $item;
|
||
$relativePath = 'documents/' . $folderPath . '/' . $item;
|
||
|
||
if (is_file($fullPath)) {
|
||
$extension = strtolower(pathinfo($item, PATHINFO_EXTENSION));
|
||
$fileType = '';
|
||
$icon = '';
|
||
|
||
if (in_array($extension, ['xlsx', 'xls'])) {
|
||
$fileType = 'Excel';
|
||
$icon = 'fa-file-excel';
|
||
} elseif ($extension == 'pdf') {
|
||
$fileType = 'PDF';
|
||
$icon = 'fa-file-pdf';
|
||
} else {
|
||
$fileType = 'Other';
|
||
$icon = 'fa-file';
|
||
}
|
||
|
||
$fileSize = file_exists($fullPath) ? filesize($fullPath) : 0;
|
||
|
||
$files[] = [
|
||
'id' => count($files) + 1,
|
||
'name' => $item,
|
||
'type' => $fileType,
|
||
'extension' => $extension,
|
||
'size' => $fileSize,
|
||
'modified' => date('Y-m-d H:i:s', filemtime($fullPath)),
|
||
'path' => $relativePath,
|
||
'full_path' => $fullPath
|
||
];
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
// Dosyaları tarihe göre sırala (en yeni önce)
|
||
usort($files, function($a, $b) {
|
||
return strtotime($b['modified']) - strtotime($a['modified']);
|
||
});
|
||
?>
|
||
|
||
<style>
|
||
.file-grid-container {
|
||
margin-bottom: 20px;
|
||
}
|
||
.pdf-viewer-container {
|
||
margin-top: 20px;
|
||
border: 1px solid #ddd;
|
||
border-radius: 5px;
|
||
overflow: hidden;
|
||
box-shadow: 0 2px 8px rgba(0,0,0,0.1);
|
||
}
|
||
.pdf-viewer-container iframe {
|
||
width: 100%;
|
||
height: 600px;
|
||
border: none;
|
||
}
|
||
.pdf-viewer-header {
|
||
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
|
||
color: white;
|
||
padding: 10px 15px;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
}
|
||
.pdf-viewer-header h6 {
|
||
margin: 0;
|
||
font-weight: 600;
|
||
}
|
||
.pdf-viewer-close {
|
||
background: none;
|
||
border: none;
|
||
color: white;
|
||
font-size: 1.2em;
|
||
cursor: pointer;
|
||
padding: 0;
|
||
width: 30px;
|
||
height: 30px;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
border-radius: 50%;
|
||
transition: background 0.2s;
|
||
}
|
||
.pdf-viewer-close:hover {
|
||
background: rgba(255,255,255,0.2);
|
||
}
|
||
.file-action-btn {
|
||
margin-right: 5px;
|
||
margin-bottom: 5px;
|
||
transition: all 0.2s;
|
||
}
|
||
.file-action-btn:hover {
|
||
transform: translateY(-1px);
|
||
box-shadow: 0 2px 4px rgba(0,0,0,0.1);
|
||
}
|
||
.no-files-message {
|
||
text-align: center;
|
||
padding: 40px;
|
||
color: #666;
|
||
}
|
||
@media (max-width: 768px) {
|
||
.pdf-viewer-container iframe {
|
||
height: 400px;
|
||
}
|
||
.file-action-btn {
|
||
margin-bottom: 8px;
|
||
}
|
||
}
|
||
</style>
|
||
|
||
@if(empty($files))
|
||
<div class="no-files-message">
|
||
<i class="fa fa-folder-open fa-3x mb-3"></i>
|
||
<h5>No files found in this folder</h5>
|
||
<p>Path: {{ $folderPath }}</p>
|
||
</div>
|
||
@else
|
||
<div class="file-grid-container">
|
||
<div id="fileDataGrid"></div>
|
||
</div>
|
||
|
||
<div class="pdf-viewer-container" id="pdfViewerContainer" style="display: none;">
|
||
<div class="pdf-viewer-header">
|
||
<h6>
|
||
<i class="fa fa-file-pdf"></i>
|
||
<span id="pdfFileName">PDF Viewer</span>
|
||
</h6>
|
||
<button type="button" class="pdf-viewer-close" onclick="closePdfViewer()">
|
||
<i class="fa fa-times"></i>
|
||
</button>
|
||
</div>
|
||
<iframe id="pdfViewer" src=""></iframe>
|
||
</div>
|
||
@endif
|
||
|
||
<script>
|
||
@if(!empty($files))
|
||
$(document).ready(function() {
|
||
var fileData = @json($files);
|
||
|
||
$("#fileDataGrid").dxDataGrid({
|
||
dataSource: fileData,
|
||
keyExpr: "id",
|
||
showBorders: true,
|
||
filterRow: {
|
||
visible: true
|
||
},
|
||
searchPanel: {
|
||
visible: true,
|
||
placeholder: "Search files..."
|
||
},
|
||
paging: {
|
||
pageSize: 10
|
||
},
|
||
pager: {
|
||
showPageSizeSelector: true,
|
||
allowedPageSizes: [5, 10, 20, 50],
|
||
showInfo: true,
|
||
infoText: "Showing {0}-{1} of {2} files"
|
||
},
|
||
sorting: {
|
||
mode: "multiple"
|
||
},
|
||
columnAutoWidth: true,
|
||
rowAlternationEnabled: true,
|
||
hoverStateEnabled: true,
|
||
showColumnLines: true,
|
||
showRowLines: true,
|
||
columns: [
|
||
{
|
||
dataField: "name",
|
||
caption: "File Name",
|
||
cellTemplate: function(container, options) {
|
||
var icon = '';
|
||
var iconClass = '';
|
||
if (options.data.type === 'Excel') {
|
||
icon = '<i class="fa fa-file-excel"></i>';
|
||
iconClass = 'text-success';
|
||
} else if (options.data.type === 'PDF') {
|
||
icon = '<i class="fa fa-file-pdf"></i>';
|
||
iconClass = 'text-danger';
|
||
} else {
|
||
icon = '<i class="fa fa-file"></i>';
|
||
iconClass = 'text-secondary';
|
||
}
|
||
|
||
container.html('<span class="' + iconClass + '">' + icon + '</span> <strong>' + options.data.name + '</strong>');
|
||
}
|
||
},
|
||
{
|
||
dataField: "type",
|
||
caption: "Type",
|
||
width: 80
|
||
},
|
||
{
|
||
dataField: "size",
|
||
caption: "Size",
|
||
width: 100,
|
||
dataType: "number",
|
||
format: function(value) {
|
||
if (value < 1024) return value + ' B';
|
||
if (value < 1024 * 1024) return (value / 1024).toFixed(1) + ' KB';
|
||
return (value / (1024 * 1024)).toFixed(1) + ' MB';
|
||
}
|
||
},
|
||
{
|
||
dataField: "modified",
|
||
caption: "Modified",
|
||
width: 150,
|
||
dataType: "datetime",
|
||
format: "dd.MM.yyyy HH:mm"
|
||
},
|
||
{
|
||
caption: "Actions",
|
||
width: 150,
|
||
cellTemplate: function(container, options) {
|
||
var html = '';
|
||
|
||
// Download button for Excel files
|
||
if (options.data.type === 'Excel') {
|
||
html += '<button class="btn btn-success btn-sm file-action-btn" onclick="downloadFile(\'' + options.data.path + '\', \'' + options.data.name + '\')" title="Download Excel">';
|
||
html += '<i class="fa fa-download"></i> Download';
|
||
html += '</button>';
|
||
}
|
||
|
||
// View button for PDF files
|
||
if (options.data.type === 'PDF') {
|
||
html += '<button class="btn btn-danger btn-sm file-action-btn" onclick="viewPdf(\'' + options.data.path + '\', \'' + options.data.name + '\')" title="View PDF">';
|
||
html += '<i class="fa fa-eye"></i> View';
|
||
html += '</button>';
|
||
}
|
||
|
||
container.html(html);
|
||
}
|
||
}
|
||
],
|
||
summary: {
|
||
totalItems: [{
|
||
column: "name",
|
||
summaryType: "count",
|
||
displayFormat: "Total: {0} files"
|
||
}]
|
||
}
|
||
});
|
||
});
|
||
@endif
|
||
|
||
function downloadFile(filePath, fileName) {
|
||
var downloadUrl = '{{ url("storage/") }}/' + filePath;
|
||
var link = document.createElement('a');
|
||
link.href = downloadUrl;
|
||
link.download = fileName;
|
||
link.target = '_blank';
|
||
document.body.appendChild(link);
|
||
link.click();
|
||
document.body.removeChild(link);
|
||
|
||
// Başarı mesajı göster
|
||
DevExpress.ui.notify('File download started: ' + fileName, 'success', 3000);
|
||
}
|
||
|
||
function viewPdf(filePath, fileName) {
|
||
var pdfUrl = '{{ url("storage/") }}/' + filePath;
|
||
$('#pdfFileName').text(fileName);
|
||
$('#pdfViewer').attr('src', pdfUrl);
|
||
$('#pdfViewerContainer').show();
|
||
|
||
// Scroll to PDF viewer
|
||
$('#pdfViewerContainer')[0].scrollIntoView({ behavior: 'smooth' });
|
||
|
||
// Başarı mesajı göster
|
||
DevExpress.ui.notify('PDF opened: ' + fileName, 'success', 3000);
|
||
}
|
||
|
||
function closePdfViewer() {
|
||
$('#pdfViewerContainer').hide();
|
||
$('#pdfViewer').attr('src', '');
|
||
|
||
// Başarı mesajı göster
|
||
DevExpress.ui.notify('PDF viewer closed', 'info', 2000);
|
||
}
|
||
</script>
|