EVOLUTION-NINJA

Edit File: project_uploads.php

<?php echo view('includes/sidebar'); ?>
<script type="text/javascript" src="<?php echo base_url('public/assets/js/jquery-3.6.0.min.js'); ?>"></script>
<script src="<?php echo base_url('public/assets/toastr/toastr.min.js');?>"></script>
<link rel="stylesheet" href="<?php echo base_url('public/assets/toastr/toastr.min.css');?>">
<link rel="stylesheet" href="https://cdn.datatables.net/1.11.5/css/jquery.dataTables.min.css">

<script src="https://cdn.datatables.net/1.11.5/js/jquery.dataTables.min.js"></script>
<link rel="stylesheet" href="<?php echo base_url('public/assets/css/createproject.css');?>">
<link rel="stylesheet" href="<?php echo base_url('public/assets/css/font-awesome.min.css');?>">
<link rel="stylesheet" href="<?php echo base_url('public/assets/css/bootstrap.min.css');?>">
<link rel="stylesheet" href="<?php echo base_url('public/assets/css/sidebar.css');?>">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">

<section class="home-section">
    <div class="home-content">
        <i class='bx bx-menu'></i>
        
    </div>
    <div class="row m-0">
        <div class="col-sm-12">
            <h1 class="crt-pjt">Project Uploads</h1>
        </div>
    </div>

<style>

.document-preview {
        width: 40%; /* Reduce the width of the preview */
        height: 400px; /* Adjust height if needed */
        border: 1px solid #ddd;
        margin: 0 auto 20px; /* Center the preview and add space below */
    }
    .img-fluid {
        width: 40%;

display: block;
    }
    
    .uploads{
        
        display:flex;
        flex-direction:row;
    }

@media (min-width: 768px) and (max-width: 1024px) {

.inpfieldname {
                font-size: 15px;
            }

.fieldsbox {
                border-radius: 23px !important;
                padding: 5px 10px !important;
                height: 45px;
                width: 100%;
            }

}

@media only screen and (max-width:620px) {
            .fieldsbox {
                width: 100%
            }

.home-section {
                height: 100%
            }
        }

/* ----------------------header styles  */

body {
            margin: 0px;
            padding: 0px;
            overflow-x: hidden;
        }

/* CSS adjustments */
        @media (max-width: 767px) {
            .logo-mobile {
                margin-right: auto;
                /* Align logo to the left */
            }

.navbar-toggler {
                margin-left: auto;
                /* Align hamburger menu to the right */
            }
        }

/* Logo styling */
        .logo {
            width: 100%;
            height: auto;
        }

/* Image styling */
        .header-image {
            width: 100%;
            height: auto;
        }

/* Center the search bar */
        .search-container {
            flex: 1;
            display: flex;
            justify-content: center;
        }

.search-bar {
            max-width: 500px;
            width: 100%;
        }

/* Align items on the right side */
        .right-side {
            display: flex;
            align-items: center;
        }

/* Hide elements in mobile view for header */
        @media (max-width: 767px) {
            .desktop-only {
                display: none;
            }

.header-image {
                width: 50% !important;
                height: auto;
            }

.navbar-nav {
                display: grid !important;
                grid-template-columns: auto auto auto !important;
                margin-left: 11px !important;
            }

.navbar-nav .nav-item {
                margin-bottom: 10px;
            }

.navbar-toggler {
                margin-left: auto;
            }

.logo-mobile {
                display: block;
                margin-bottom: 10px;
                text-align: center;
            }

.search-container {
                margin-bottom: 10px;
            }
        }

@media (min-width: 768px) {
            .navbar-toggler {
                display: none;
            }

.navbar-brand {
                margin-right: auto;
            }
        }

.img-notf,
        .notify-number {
            position: absolute;
        }

.notify-number {
            position: relative;
            left: 13px;
            font-size: 11px;
            top: -8px;
        }

.notify-number {
            position: relative !important;
            top: -6px;
            left: -11px;
            font-size: small;
            border-radius: 50%;
            color: red;
        }

.notify-number {
            position: relative;
            left: 14px;
            top: -6px;
        }

.search-bar {
            border-radius: 18px !important;
            border: none;
            box-shadow: 1px 1px 6px 0px #00000040;
            height: 35px;
        }

.lang {
            font-family: Poppins;
            font-size: 17px;
            font-weight: 600;
            line-height: 30px;
            text-align: left;
            position: relative;
            color: #464646;
        }

.admin {
            font-family: Poppins;
            font-size: 17px;
            font-weight: 600;
            line-height: 30px;
            text-align: left;
            position: relative;
            color: #464646;
        }

.lang:hover {
            color: #464646;
        }

.searc-top {
            position: relative;
            top: 8px;
            left: -27px;
            font-size: 18px;
        }

@media only screen and (max-width: 600px) {
            .header-image {
                width: 50% !important;
                height: auto;
            }
        }

@media (min-width: 768px) and (max-width: 1024px) {
            .logo {
                width: 80% !important;
                height: auto;
            }
        }

@media (min-width: 768px) and (max-width: 1024px) {}

</style>
    <div class="container mt-5">
        <h5 class="mb-4">Project: <?= esc($project['project_name'] ?? 'Unknown Project') ?></h5>

<div class="card mb-4">
    <div class="card-header">
        <h4>Approval Documents</h4>
    </div>

<div class="card-body">
    <?php if (!empty($approval_documents)) : ?>
        <div class="uploads d-flex flex-row flex-wrap">
            <?php foreach ($approval_documents as $doc) : ?>
                <div class="document-item mb-4" style="flex: 1 1 22%; margin-right: 1%; margin-bottom: 20px;">
                    <h5><?= esc($doc['document_name']) ?></h5>
                    <?php if (in_array(pathinfo($doc['document_name'], PATHINFO_EXTENSION), ['pdf'])) : ?>
                        <iframe 
                            class="document-preview" 
                            src="<?= base_url('public/approval_documents/' . esc($doc['document_name'])) ?>"
                            style="width: 100%; height: 200px;"></iframe>
                    <?php elseif (in_array(pathinfo($doc['document_name'], PATHINFO_EXTENSION), ['jpg', 'jpeg', 'png', 'gif'])) : ?>
                        <img 
                            class="img-fluid mb-3" 
                            src="<?= base_url('public/approval_documents/' . esc($doc['document_name'])) ?>" 
                            alt="Document Preview" 
                            style="width: 100%; height: 200px; object-fit: cover;">
                    <?php elseif (in_array(pathinfo($doc['document_name'], PATHINFO_EXTENSION), ['doc', 'docx', 'xls', 'xlsx'])) : ?>
                        <iframe 
                            class="document-preview" 
                            src="https://docs.google.com/viewer?url=<?= urlencode(base_url('public/approval_documents/' . esc($doc['document_name']))) ?>&embedded=true"
                            style="width: 100%; height: 200px;"></iframe>
                    <?php else : ?>
                        <p>Preview not supported for this file type.</p>
                    <?php endif; ?>
                    
                    <a href="<?= base_url('public/approval_documents/' . esc($doc['document_name'])) ?>" 
                       target="_blank" class="btn btn-primary mt-2">View Document</a>
                </div>
            <?php endforeach; ?>
        </div>
    <?php else : ?>
        <p>No approval documents uploaded.</p>
    <?php endif; ?>
</div>

<div class="card mb-4">
    <div class="card-header">
        <h4>Proposal Documents</h4>
    </div>

<div class="card-body">
    <?php if (!empty($proposal_documents)) : ?>
        <div class="uploads d-flex flex-row flex-wrap">
            <?php foreach ($proposal_documents as $doc) : ?>
                <div class="document-item mb-4" style="flex: 1 1 22%; margin-right: 1%; margin-bottom: 20px;">
                    <h5><?= esc($doc['document_name']) ?></h5>
                    <?php if (in_array(pathinfo($doc['document_name'], PATHINFO_EXTENSION), ['pdf'])) : ?>
                        <iframe 
                            class="document-preview" 
                            src="<?= base_url('public/proposal_documents/' . esc($doc['document_name'])) ?>"
                            style="width: 100%; height: 200px;"></iframe>
                    <?php elseif (in_array(pathinfo($doc['document_name'], PATHINFO_EXTENSION), ['jpg', 'jpeg', 'png', 'gif'])) : ?>
                        <img 
                            class="img-fluid mb-3" 
                            src="<?= base_url('public/proposal_documents/' . esc($doc['document_name'])) ?>" 
                            alt="Document Preview" 
                            style="width: 100%; height: 200px; object-fit: cover;">
                    <?php elseif (in_array(pathinfo($doc['document_name'], PATHINFO_EXTENSION), ['doc', 'docx', 'xls', 'xlsx'])) : ?>
                        <iframe 
                            class="document-preview" 
                            src="https://docs.google.com/viewer?url=<?= urlencode(base_url('public/proposal_documents/' . esc($doc['document_name']))) ?>&embedded=true"
                            style="width: 100%; height: 200px;"></iframe>
                    <?php else : ?>
                        <p>Preview not supported for this file type.</p>
                    <?php endif; ?>
                    
                    <a href="<?= base_url('public/proposal_documents/' . esc($doc['document_name'])) ?>" 
                       target="_blank" class="btn btn-primary mt-2">View Document</a>
                </div>
            <?php endforeach; ?>
        </div>
    <?php else : ?>
        <p>No proposal documents uploaded.</p>
    <?php endif; ?>
</div>

<div class="card mb-4">
    <div class="card-header">
        <h4>Estimation Documents</h4>
    </div>

<div class="card-body">
    <?php if (!empty($estimation_documents)) : ?>
        <div class="uploads d-flex flex-row flex-wrap">
            <?php foreach ($estimation_documents as $doc) : ?>
                <div class="document-item mb-4" style="flex: 1 1 22%; margin-right: 1%; margin-bottom: 20px;">
                    <h5><?= esc($doc['document_name']) ?></h5>
                    <?php if (in_array(pathinfo($doc['document_name'], PATHINFO_EXTENSION), ['pdf'])) : ?>
                        <iframe 
                            class="document-preview" 
                            src="<?= base_url('public/estimation_documents/' . esc($doc['document_name'])) ?>"
                            style="width: 100%; height: 200px;"></iframe>
                    <?php elseif (in_array(pathinfo($doc['document_name'], PATHINFO_EXTENSION), ['jpg', 'jpeg', 'png', 'gif'])) : ?>
                        <img 
                            class="img-fluid mb-3" 
                            src="<?= base_url('public/estimation_documents/' . esc($doc['document_name'])) ?>" 
                            alt="Document Preview" 
                            style="width: 100%; height: 200px; object-fit: cover;">
                    <?php elseif (in_array(pathinfo($doc['document_name'], PATHINFO_EXTENSION), ['doc', 'docx', 'xls', 'xlsx'])) : ?>
                        <iframe 
                            class="document-preview" 
                            src="https://docs.google.com/viewer?url=<?= urlencode(base_url('public/estimation_documents/' . esc($doc['document_name']))) ?>&embedded=true"
                            style="width: 100%; height: 200px;"></iframe>
                    <?php else : ?>
                        <p>Preview not supported for this file type.</p>
                    <?php endif; ?>
                    
                    <a href="<?= base_url('public/estimation_documents/' . esc($doc['document_name'])) ?>" 
                       target="_blank" class="btn btn-primary mt-2">View Document</a>
                </div>
            <?php endforeach; ?>
        </div>
    <?php else : ?>
        <p>No estimation documents uploaded.</p>
    <?php endif; ?>
</div>

<div class="card mb-4">
    <div class="card-header">
        <h4>Progress Documents</h4>
    </div>

<div class="card-body">
    <?php if (!empty($progress_documents)) : ?>
        <div class="uploads d-flex flex-row flex-wrap">
            <?php foreach ($progress_documents as $doc) : ?>
                <div class="document-item mb-4" style="flex: 1 1 22%; margin-right: 1%; margin-bottom: 20px;">
                    <h5><?= esc($doc['document_name']) ?></h5>
                    <?php if (in_array(pathinfo($doc['document_name'], PATHINFO_EXTENSION), ['pdf'])) : ?>
                        <iframe 
                            class="document-preview" 
                            src="<?= base_url('public/Progress_documents/' . esc($doc['document_name'])) ?>"
                            style="width: 100%; height: 200px;"></iframe>
                    <?php elseif (in_array(pathinfo($doc['document_name'], PATHINFO_EXTENSION), ['jpg', 'jpeg', 'png', 'gif'])) : ?>
                        <img 
                            class="img-fluid mb-3" 
                            src="<?= base_url('public/Progress_documents/' . esc($doc['document_name'])) ?>" 
                            alt="Document Preview" 
                            style="width: 100%; height: 200px; object-fit: cover;">
                    <?php elseif (in_array(pathinfo($doc['document_name'], PATHINFO_EXTENSION), ['doc', 'docx', 'xls', 'xlsx'])) : ?>
                        <iframe 
                            class="document-preview" 
                            src="https://docs.google.com/viewer?url=<?= urlencode(base_url('public/Progress_documents/' . esc($doc['document_name']))) ?>&embedded=true"
                            style="width: 100%; height: 200px;"></iframe>
                    <?php else : ?>
                        <p>Preview not supported for this file type.</p>
                    <?php endif; ?>
                    
                    <a href="<?= base_url('public/Progress_documents/' . esc($doc['document_name'])) ?>" 
                       target="_blank" class="btn btn-primary mt-2">View Document</a>
                </div>
            <?php endforeach; ?>
        </div>
    <?php else : ?>
        <p>No progress documents uploaded.</p>
    <?php endif; ?>
</div>

<a href="<?= base_url('projectlist') ?>" class="btn btn-secondary" style="width:200px;margin:10px;">Back to Projects</a>
    </div>
    <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11.10.8/dist/sweetalert2.all.min.js"></script>
    <link href="https://cdn.jsdelivr.net/npm/sweetalert2@11.10.8/dist/sweetalert2.min.css" rel="stylesheet">

<?php echo view('includes/footer'); ?>