@model IEnumerable<EMPDETAILS.Models.EmployeeDetails>

@{
    ViewBag.Title = "Employee Records";
}

<h4 class="text-center mb-4">Employee Records</h4>

<!-- DataTable HTML -->
<table id="employeeTable" class="table table-bordered table-striped">
    <thead class="thead-dark">
        <tr>
            <th>Full Name</th>
            <th>Date of Birth</th>
            <th>Gender</th>
            <th>Phone Number</th>
            <th>Address</th>
            <th>District</th>
            <th>PinCode</th>
            <th>Email ID</th>
            <th>Marital Status</th>
            <th>Blood Group</th>
            <th>Pan Card No</th>
            <th>Aadhar Card No</th>
            <th>Company Name</th>
            <th>Department</th>
            <th>PF Number</th>
            <th>UAN Number</th>
            <th>HR Name</th>
            <th>HR Contact Number</th>
            <th>HR Email ID</th>
            <th>Reporting Manager Name</th>
            <th>Reporting Manager Contact No</th>
            <th>Reporting Manager Email ID</th>
            <th>Reference Name</th>
            <th>Reference Phone No</th>
            <th>Reference Email ID</th>
            <th>Family Name</th>
            <th>Family Relation</th>
            <th>Family DOB</th>
            <th>Nominee Name</th>
            <th>Nominee Relation</th>
            <th>Nominee DOB</th>
            <th>Nominee Contact No</th>
            <th>Emergency Contact Name</th>
            <th>Emergency Contact Relation</th>
            <th>Emergency Contact Phone No</th>
            <th>Document Pan File</th>
            <th>Document Aadhar File</th>
            <th>Document License File</th>
            <th>Document Passport File</th>
            <th>Document Bank Details File</th>
            <th>Educational Certificate File</th>
            <th>Relieving Letter File</th>
            <th>Position</th>
            <th>Joining Date</th>
            <th>Location</th>
            <th>Manager</th>
            <th>Actions</th> <!-- New column for the View Details Button -->
        </tr>
    </thead>
    <tbody>
        @foreach (var employee in Model)
        {
            <tr>
                <td>@employee.FullName</td>
                <td>@Convert.ToDateTime(employee.DateOfBirth).ToString("dd-MM-yyyy")</td>
                <td>@employee.Gender</td>
                <td>@employee.PhoneNumber</td>
                <td>@employee.Address</td>
                <td>@employee.District</td>
                <td>@employee.PinCode</td>
                <td>@employee.EmailId</td>
                <td>@employee.MaritalStatus</td>
                <td>@employee.BloodGroup</td>
                <td>@employee.PanCardNo</td>
                <td>@employee.AadharCardNo</td>
                <td>@employee.CompanyName</td>
                <td>@employee.Department</td>
                <td>@employee.PFNumber</td>
                <td>@employee.UANNumber</td>
                <td>@employee.HRName</td>
                <td>@employee.HRContactNumber</td>
                <td>@employee.HREmailId</td>
                <td>@employee.ReportingManagerName</td>
                <td>@employee.ReportingManagerContactNo</td>
                <td>@employee.ReportingManagerEmailId</td>
                <td>@employee.ReferenceName</td>
                <td>@employee.ReferencePhoneNo</td>
                <td>@employee.ReferenceEmailId</td>
                <td>@employee.FamilyName</td>
                <td>@employee.FamilyRelation</td>
                <td>@Convert.ToDateTime(employee.FamilyDOB).ToString("dd-MM-yyyy")</td>
                <td>@employee.NomineeName</td>
                <td>@employee.NomineeRelation</td>
                <td>@Convert.ToDateTime(employee.NomineeDOB).ToString("dd-MM-yyyy")</td>
                <td>@employee.NomineeContactNo</td>
                <td>@employee.EmergencyContactName</td>
                <td>@employee.EmergencyContactRelation</td>
                <td>@employee.EmergencyContactPhoneNo</td>
                <td>
                    @(string.IsNullOrEmpty(employee.DocumentPanFilePath) ? "" :
                    "<a href='" + Url.Action("DownloadFile", new { fileName = Path.GetFileName(employee.DocumentPanFilePath) }) + "' download>Download</a>")
                </td>
                <td>
                    @(string.IsNullOrEmpty(employee.DocumentAadharFilePath) ? "" :
                    "<a href='" + Url.Action("DownloadFile", new { fileName = Path.GetFileName(employee.DocumentAadharFilePath) }) + "' download>Download</a>")
                </td>
                <td>
                    @(string.IsNullOrEmpty(employee.DocumentLicenseFilePath) ? "" :
                    "<a href='" + Url.Action("DownloadFile", new { fileName = Path.GetFileName(employee.DocumentLicenseFilePath) }) + "' download>Download</a>")
                </td>
                <td>
                    @(string.IsNullOrEmpty(employee.DocumentPassportFilePath) ? "" :
                    "<a href='" + Url.Action("DownloadFile", new { fileName = Path.GetFileName(employee.DocumentPassportFilePath) }) + "' download>Download</a>")
                </td>
                <td>
                    @(string.IsNullOrEmpty(employee.DocumentBankDetailsFilePath) ? "" :
                    "<a href='" + Url.Action("DownloadFile", new { fileName = Path.GetFileName(employee.DocumentBankDetailsFilePath) }) + "' download>Download</a>")
                </td>
                <td>
                    @(string.IsNullOrEmpty(employee.EducationalCertificateFilePath) ? "" :
                    "<a href='" + Url.Action("DownloadFile", new { fileName = Path.GetFileName(employee.EducationalCertificateFilePath) }) + "' download>Download</a>")
                </td>
                <td>
                    @(string.IsNullOrEmpty(employee.RelievingLetterFilePath) ? "" :
                    "<a href='" + Url.Action("DownloadFile", new { fileName = Path.GetFileName(employee.RelievingLetterFilePath) }) + "' download>Download</a>")
                </td>
                <td>@employee.Position</td>
                <td>@Convert.ToDateTime(employee.JoiningDate).ToString("dd-MM-yyyy")</td>
                <td>@employee.Location</td>
                <td>@employee.Manager</td>
                <td>
                    <!-- View Details Button -->
                    <button class="btn btn-info btn-sm"
                            data-toggle="modal"
                            data-target="#employeeModal"
                            data-id="@employee.EMPId"
                            data-fullname="@employee.FullName"
                            data-dob="@Convert.ToDateTime(employee.DateOfBirth).ToString("dd-MM-yyyy")"
                            data-gender="@employee.Gender"
                            data-phone="@employee.PhoneNumber"
                            data-address="@employee.Address"
                            data-district="@employee.District"
                            data-pincode="@employee.PinCode"
                            data-email="@employee.EmailId"
                            data-maritalstatus="@employee.MaritalStatus"
                            data-bloodgroup="@employee.BloodGroup"
                            data-pancard="@employee.PanCardNo"
                            data-aadharcard="@employee.AadharCardNo"
                            data-companyname="@employee.CompanyName"
                            data-department="@employee.Department"
                            data-pfnumber="@employee.PFNumber"
                            data-uannumber="@employee.UANNumber"
                            data-hrname="@employee.HRName"
                            data-hrcontact="@employee.HRContactNumber"
                            data-hremail="@employee.HREmailId"
                            data-reportingmanager="@employee.ReportingManagerName"
                            data-reportingcontact="@employee.ReportingManagerContactNo"
                            data-reportingemail="@employee.ReportingManagerEmailId"
                            data-referencename="@employee.ReferenceName"
                            data-referencephone="@employee.ReferencePhoneNo"
                            data-referenceemail="@employee.ReferenceEmailId"
                            data-familyname="@employee.FamilyName"
                            data-familyrelation="@employee.FamilyRelation"
                            data-familydob="@Convert.ToDateTime(employee.FamilyDOB).ToString("dd-MM-yyyy")"
                            data-nomineename="@employee.NomineeName"
                            data-nomineerelation="@employee.NomineeRelation"
                            data-nomineedob="@Convert.ToDateTime(employee.NomineeDOB).ToString("dd-MM-yyyy")"
                            data-nomineecontact="@employee.NomineeContactNo"
                            data-emergencycontact="@employee.EmergencyContactName"
                            data-emergencyrelation="@employee.EmergencyContactRelation"
                            data-emergencyphone="@employee.EmergencyContactPhoneNo"
                            data-position="@employee.Position"
                            data-joiningdate="@Convert.ToDateTime(employee.JoiningDate).ToString("dd-MM-yyyy")"
                            data-location="@employee.Location"
                            data-manager="@employee.Manager">
                        View Details
                    </button>
                </td>
            </tr>
        }
    </tbody>
</table>

<!-- Bootstrap Modal for displaying employee details -->
<div class="modal fade" id="employeeModal" tabindex="-1" role="dialog" aria-labelledby="employeeModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-lg" role="document">
        <div class="modal-content">
            <div class="modal-header bg-primary text-white">
                <h5 class="modal-title" id="employeeModalLabel">Employee Details</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <!-- Employee Details Will Be Dynamically Loaded Here -->
                <div id="employeeDetailsContent">
                    <p><strong>Full Name:</strong> <span id="empFullName"></span></p>
                    <p><strong>Date of Birth:</strong> <span id="empDOB"></span></p>
                    <p><strong>Gender:</strong> <span id="empGender"></span></p>
                    <p><strong>Phone Number:</strong> <span id="empPhone"></span></p>
                    <p><strong>Address:</strong> <span id="empAddress"></span></p>
                    <p><strong>District:</strong> <span id="empDistrict"></span></p>
                    <p><strong>PinCode:</strong> <span id="empPinCode"></span></p>
                    <p><strong>Email ID:</strong> <span id="empEmail"></span></p>
                    <p><strong>Marital Status:</strong> <span id="empMaritalStatus"></span></p>
                    <p><strong>Blood Group:</strong> <span id="empBloodGroup"></span></p>
                    <p><strong>Pan Card No:</strong> <span id="empPanCard"></span></p>
                    <p><strong>Aadhar Card No:</strong> <span id="empAadharCard"></span></p>
                    <p><strong>Company Name:</strong> <span id="empCompanyName"></span></p>
                    <p><strong>Department:</strong> <span id="empDepartment"></span></p>
                    <p><strong>PF Number:</strong> <span id="empPFNumber"></span></p>
                    <p><strong>UAN Number:</strong> <span id="empUANNumber"></span></p>
                    <p><strong>HR Name:</strong> <span id="empHRName"></span></p>
                    <p><strong>HR Contact Number:</strong> <span id="empHRContact"></span></p>
                    <p><strong>HR Email ID:</strong> <span id="empHREmail"></span></p>
                    <p><strong>Reporting Manager Name:</strong> <span id="empReportingManager"></span></p>
                    <p><strong>Reporting Manager Contact:</strong> <span id="empReportingContact"></span></p>
                    <p><strong>Reporting Manager Email:</strong> <span id="empReportingEmail"></span></p>
                    <p><strong>Reference Name:</strong> <span id="empReferenceName"></span></p>
                    <p><strong>Reference Phone No:</strong> <span id="empReferencePhone"></span></p>
                    <p><strong>Reference Email ID:</strong> <span id="empReferenceEmail"></span></p>
                    <p><strong>Family Name:</strong> <span id="empFamilyName"></span></p>
                    <p><strong>Family Relation:</strong> <span id="empFamilyRelation"></span></p>
                    <p><strong>Family DOB:</strong> <span id="empFamilyDOB"></span></p>
                    <p><strong>Nominee Name:</strong> <span id="empNomineeName"></span></p>
                    <p><strong>Nominee Relation:</strong> <span id="empNomineeRelation"></span></p>
                    <p><strong>Nominee DOB:</strong> <span id="empNomineeDOB"></span></p>
                    <p><strong>Nominee Contact No:</strong> <span id="empNomineeContact"></span></p>
                    <p><strong>Emergency Contact Name:</strong> <span id="empEmergencyContact"></span></p>
                    <p><strong>Emergency Contact Relation:</strong> <span id="empEmergencyRelation"></span></p>
                    <p><strong>Emergency Contact Phone No:</strong> <span id="empEmergencyPhone"></span></p>
                    <p><strong>Position:</strong> <span id="empPosition"></span></p>
                    <p><strong>Joining Date:</strong> <span id="empJoiningDate"></span></p>
                    <p><strong>Location:</strong> <span id="empLocation"></span></p>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
                <button type="button" class="btn btn-success" id="printButton">Print</button>
            </div>
        </div>
    </div>
</div>

@section scripts {
    <script>
        $(document).ready(function () {
            // Initialize DataTable with responsive design and export buttons
            $('#employeeTable').DataTable({
                "scrollX": true,
                "pageLength": 10,
                "lengthMenu": [10, 25, 50, 100],
                "columnDefs": [
                    { "targets": [46], "orderable": false, "className": "dt-center" }
                ],
                "dom": 'Bfrtip',
                "buttons": ['copy', 'csv', 'excel', 'pdf', 'print'],
                "responsive": true,
                "ordering": true,
            });

            // When the "View Details" button is clicked, populate the modal with employee details
            $('#employeeModal').on('show.bs.modal', function (event) {
                var button = $(event.relatedTarget); // Button that triggered the modal
                // Fetch employee data from the button attributes and set it to modal
                $('#empFullName').text(button.data('fullname'));
                $('#empDOB').text(button.data('dob'));
                $('#empGender').text(button.data('gender'));
                $('#empPhone').text(button.data('phone'));
                $('#empAddress').text(button.data('address'));
                $('#empDistrict').text(button.data('district'));
                $('#empPinCode').text(button.data('pincode'));
                $('#empEmail').text(button.data('email'));
                $('#empMaritalStatus').text(button.data('maritalstatus'));
                $('#empBloodGroup').text(button.data('bloodgroup'));
                $('#empPanCard').text(button.data('pancard'));
                $('#empAadharCard').text(button.data('aadharcard'));
                $('#empCompanyName').text(button.data('companyname'));
                $('#empDepartment').text(button.data('department'));
                $('#empPFNumber').text(button.data('pfnumber'));
                $('#empUANNumber').text(button.data('uannumber'));
                $('#empHRName').text(button.data('hrname'));
                $('#empHRContact').text(button.data('hrcontact'));
                $('#empHREmail').text(button.data('hremail'));
                $('#empReportingManager').text(button.data('reportingmanager'));
                $('#empReportingContact').text(button.data('reportingcontact'));
                $('#empReportingEmail').text(button.data('reportingemail'));
                $('#empReferenceName').text(button.data('referencename'));
                $('#empReferencePhone').text(button.data('referencephone'));
                $('#empReferenceEmail').text(button.data('referenceemail'));
                $('#empFamilyName').text(button.data('familyname'));
                $('#empFamilyRelation').text(button.data('familyrelation'));
                $('#empFamilyDOB').text(button.data('familydob'));
                $('#empNomineeName').text(button.data('nomineename'));
                $('#empNomineeRelation').text(button.data('nomineerelation'));
                $('#empNomineeDOB').text(button.data('nomineedob'));
                $('#empNomineeContact').text(button.data('nomineecontact'));
                $('#empEmergencyContact').text(button.data('emergencycontact'));
                $('#empEmergencyRelation').text(button.data('emergencyrelation'));
                $('#empEmergencyPhone').text(button.data('emergencyphone'));
                $('#empPosition').text(button.data('position'));
                $('#empJoiningDate').text(button.data('joiningdate'));
                $('#empLocation').text(button.data('location'));
            });

            // Print button functionality inside modal
            $('#printButton').click(function () {
                var printContent = document.getElementById("employeeDetailsContent").innerHTML;
                var printWindow = window.open('', '', 'height=600,width=800');
                printWindow.document.write('<html><head><title>Employee Details</title></head><body>');
                printWindow.document.write(printContent);
                printWindow.document.write('</body></html>');
                printWindow.document.close();
                printWindow.print();
            });
        });
    </script>
}