<div class="row">
    <div class="col-md-12 mt-2">
        <div class="row">
            <div class="col-md-3 offset-md-9">
                <div class="card w-50 float-right mb-2">

                </div>
            </div>
        </div>
        <div class="card card-info">
            <div class="card-header">
                <h3 class="card-title">
                    <%=sectionTitle%>
                </h3>
            </div>

            <div class="card-body">
                <div class="row">
                    <div class="col-md-12 mt-2">
                        <form name="" id="bannerForm" method="post" action="/jobseeker/professional-details/save"
                            enctype="multipart/form-data" novalidate>
                            <div class="card card-info">
                                <div class="card-body">
                                    <div class="form-row">
                                        <div class="form-group col-md-3">
                                            <label class="required" for="inputName">Designation</label>
                                            <select id="designation_id" name="designation_id" class="form-control"
                                                required>
                                                <option selected disabled>Select Designation</option>
                                                <%for(let item of designationData){%>
                                                    <option value="<%=item.id%>"
                                                        <%=professionalData?.designation_id?.toString()==item?.id?.toString()
                                                        ? 'selected' : '' %> ><%=item?.title%>
                                                    </option>
                                                    <%}%>
                                            </select>
                                        </div>
                                        <div class="form-group col-md-3">
                                            <label class="required" for="inputName">Organization Name</label>
                                            <input type="text" id="organization_name" name="organization_name"
                                                class="form-control" placeholder="Enter Organization Name"
                                                value="<%=professionalData.organization_name%>" required>
                                        </div>
                                        <div class="form-group col-md-3">
                                            <label class="required" for="inputName">From Date</label>
                                            <input type="date" id="jobseeker_from_date" name="from_date" class="form-control"
                                                placeholder="Enter Date" value="<%=professionalData.from_date%>"
                                                max="<%=new Date(new Date().getTime() - new Date().getTimezoneOffset() * 60000).toISOString().split("T")[0]%>" required>
                                        </div>
                                        <div class="form-group col-md-3">
                                            <label class="required" for="inputName">To Date</label>
                                            <input type="date" id="jobseeker_to_date" name="to_date" class="form-control"
                                                placeholder="Enter Date" value="<%=professionalData.to_date%>" max="<%=new Date(new Date().getTime() - new Date().getTimezoneOffset() * 60000).toISOString().split("T")[0]%>" required>
                                        </div>
                                        <div class="form-group col-md-6">
                                            <label for="inputName">Role Description</label>
                                            <textarea type="text" rows="5" cols="5" id="role"
                                            name="role" class="form-control" placeholder="Enter role description"
                                             oninput="validate(this)"><%=professionalData.role%></textarea>
                                        </div>
                                        <!-- <div class="form-group col-md-3">
                                            <label class="required" for="inputName">Salary</label>
                                            <input type="text" id="salary" name="salary" class="form-control"
                                                placeholder="Enter Salary" value="<%=professionalData.salary%>"
                                                required>
                                        </div>
                                        <div class="form-group col-md-3">
                                            <label class="required" for="inputName">CTC(LPA)</label>
                                            <input type="text" id="ctc" name="ctc" class="form-control"
                                                placeholder="Enter CTC" value="<%=professionalData.ctc%>" required>
                                        </div>
                                        <div class="form-group col-md-3">
                                            <label class="required" for="inputName">Resume Details</label>
                                            <input type="text" id="resume_details" name="resume_details"
                                                class="form-control" placeholder="Enter Resume Details"
                                                value="<%=professionalData.resume_details%>" required>
                                        </div> -->
                                        <div class="form-group col-md-6 align-content-end">
                                            <input type="hidden" id="user_id" name="user_id" value="<%=userData.id%>" />
                                            <input type="hidden" id="user_id" name="professional_id"
                                                value="<%=professionalData?.id ? professionalData?.id : ''%>" />
                                            <button type="submit" class="btn btn-info mr-2" id="adduser"
                                                style="margin-top: 30px;">Save</button>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </form>
                    </div>
                </div>
            </div>

            <div class="card-body table-responsive">
                <table class="table table-hover table-head-fixed datatable" id="Organization_table">
                    <thead>
                        <tr>
                            <th style="width: 1%">
                                #
                            </th>
                            <th>
                                Organization Name
                            </th>
                            <th>
                                Designation
                            </th>
                            <th>
                                From Date
                            </th>
                            <th>
                                To Date
                            </th>
                            <!-- <th>
                                Salary
                            </th>
                            <th>
                                CTC(LPA)
                            </th>
                            <th>
                                Resume Details
                            </th> -->
                            <th data-orderable="false">
                                Actions
                            </th>
                        </tr>
                    </thead>
                    <tbody>
                        <% let index=1;%>
                            <% for (data of dataList){ %>
                                <tr>
                                    <td>
                                        <%=index++%>
                                    </td>
                                    <td>
                                        <%= data?.organization_name %>
                                    </td>
                                    <td>
                                        <%= data?.designation_name %>
                                    </td>
                                    <td>
                                        <%= data?.from_date %>
                                    </td>
                                    <td>
                                        <%= data?.to_date %>
                                    </td>
                                    <!-- <td>
                                        <%= data?.salary %>
                                    </td>
                                    <td>
                                        <%= data?.ctc %>
                                    </td>
                                    <td>
                                        <%= data?.resume_details %>
                                    </td> -->
                                    <td>
                                        <a class="btn btn-info btn-sm mr-2"
                                            href="/jobseeker/professional-details/<%=userData.id%>?professional_id=<%=data.id%>"
                                            data-toggle="tooltip" title="Edit">
                                            <i class="fas fa-pencil-alt">
                                            </i>
                                        </a>
                                        <a class="btn btn-danger btn-sm" id="delete_<%=data.id%>"
                                            onclick="deleteDataFunc(`<%=data.id%>`,`jobseeker/professional-details/delete/<%=userData.id%>/<%=data.id%>`)"
                                            data-toggle="tooltip" title="Delete">
                                            <i class="fas fa-trash">
                                            </i>
                                        </a>
                                    </td>
                                </tr>
                            <% } %>
                    </tbody>
                </table>
            </div>
        </div>
        <!-- /.card -->
    </div>
    <!-- /.col -->
</div>
<!-- /.row -->


<%- contentFor('pageModalSection')%>
    <%- contentFor('pageScriptsSection')%>