@extends('admin.layouts.index')



@section('content')
<section id="main-content">
    <section class="wrapper">
        <div class="panel-heading">
                Attendance
            </div>
        <div class="table-agile-info" style="padding: 4em;">
            <h4 style="margin-bottom: 20px;">Select Date</h4>
            <div class="col-lg-4" style="">
                <input type="Date" class="form-control" id="inputfirstname" placeholder="First Name">
                
            </div>
            <div class="col-lg-6">
                <div class="col-lg-3">
                    <div class="form-group">
                        <select class="form-control">
                            <option>Section</option>
                            <option>A</option>
                            <option>B</option>
                        </select>
                    </div>
                </div>
                <div class="col-lg-3">
                    <div class="form-group">
                        <select class="form-control">
                            <option>Class</option>
                            <option>1st</option>
                            <option>2st</option>
                        </select>
                    </div>
                </div>
                <div class="col-lg-3">
                    <input class="btn btn-success" type="submit" value="Search" name="login" data-toggle="modal" data-target="#myModaladdteacher" />
                </div>
                <div class="col-lg-3">
                    <input class="btn btn-success" type="submit" value="Monthly Report" name="login" data-toggle="modal" data-target="#myModaladdteacher" />
                </div>
                
            </div>
        </div>
        <div class="panel panel-default" style="margin-top: 15px;">
            <div class="panel-heading">
                Detail
            </div>
            <div>
                <table
                    class="table"
                    ui-jq="footable"
                    ui-options='{
        "paging": {
          "enabled": true
        },
        "filtering": {
          "enabled": true
        },
        "sorting": {
          "enabled": true
        }}'
                >
                    <thead>
                        <tr>
                            <th>SR</th>
                            <th>Roll</th>
                            <th>Cls</th>
                            <th>Sec</th>
                            <th>Name</th>
                            <th>Mobile</th>
                            <th>Father Name</th>
                            <th>P</th>
                            <th>A</th>
                            <th>L</th>
                            <th>HD</th>
                            <th>Comment(Max 20 Char)</th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr data-expanded="true">
                            <td>520</td>
                            <td>Akhikpemelo Muniratu</td>
                            <td>Female</td>
                            <td>Basic 6 Love</td>
                            <td>English Language</td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                        </tr>
                    </tbody>
                </table>
                <nav aria-label="Page navigation example">
                    <ul class="pagination">
                        <li class="page-item"><a class="page-link" href="#">Previous</a></li>
                        <li class="page-item"><a class="page-link" href="#">1</a></li>
                        <li class="page-item"><a class="page-link" href="#">2</a></li>
                        <li class="page-item"><a class="page-link" href="#">3</a></li>
                        <li class="page-item"><a class="page-link" href="#">Next</a></li>
                    </ul>
                </nav>
            </div>
        </div>
    </section>
    <!--modal-->
    <div style="z-index: 999999; margin-top: 2%;" class="modal fade" id="myModaladdteacher" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
        <div style="width: 900px;" class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h4 class="modal-title" id="myModalLabel" style="margin-right: 40px;">Create New Teacher</h4>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>

                    <div class="row">
                        <div class="panel-body">
                            <h2 class="text-center mx-2 bg-warning">Personal Information</h2>
                            <div class="form" style="margin-top: 25px;">
                                <form class="cmxform form-horizontal" id="signupForm" method="get" action="">
                                    <div class="form-group">
                                        <label for="lastname" class="control-label col-lg-4 pull-left">File Input:</label>
                                        <div class="col-lg-8">
                                            <input type="file" for="currrentsession" class="col-lg-12" id="currentsession" name="" value="" />
                                        </div>
                                    </div>

                                    <div class="form-group">
                                        <label for="password" class="control-label col-lg-4 pull-left">First Name: </label>
                                        <div class="col-lg-8">
                                            <input type="text" for="currrentsession" class="col-lg-12" id="currentsession" name="" />
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label for="password" class="control-label col-lg-4 pull-left">Last Name</label>
                                        <div class="col-lg-8">
                                            <input type="text" for="currrentsession" class="col-lg-12" id="currentsession" name="" />
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label for="password" class="control-label col-lg-4 pull-left">Gander:</label>
                                        <div class="col-lg-8">
                                            <select class="form-control">
                                                <option>Not Assign</option>
                                                <option>ABZ</option>
                                            </select>
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label for="password" class="control-label col-lg-4 pull-left">Marital Status: :</label>
                                        <div class="col-lg-8">
                                            <select class="form-control">
                                                <option>Not Assign</option>
                                                <option>1699</option>
                                            </select>
                                        </div>
                                    </div>
                                    <h2 class="text-center mx-2 bg-warning" style="margin-bottom: 20px;">Contact Information</h2>
                                    <div class="form-group">
                                        <label for="lastname" class="control-label col-lg-4 pull-left">Residence Address: </label>
                                        <div class="col-lg-8">
                                            <input type="text" for="currrentsession" class="col-lg-12" id="currentsession" name="" value="" />
                                        </div>
                                    </div>

                                    <div class="form-group">
                                        <label for="password" class="control-label col-lg-4 pull-left">City: </label>
                                        <div class="col-lg-8">
                                            <input type="text" for="currrentsession" class="col-lg-12" id="currentsession" name="" />
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label for="password" class="control-label col-lg-4 pull-left">State: </label>
                                        <div class="col-lg-8">
                                            <input type="text" for="currrentsession" class="col-lg-12" id="currentsession" name="" />
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label for="password" class="control-label col-lg-4 pull-left">Country: </label>
                                        <div class="col-lg-8">
                                            <select class="form-control">
                                                <option>Not Assign</option>
                                                <option>ABZ</option>
                                            </select>
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label for="mobile" type="number" class="control-label col-lg-4 pull-left">Mobile Phone Number: :</label>
                                        <div class="col-lg-8">
                                            <input type="mobile" for="currrentsession" class="col-lg-12" id="currentsession" name="" />
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label for="password" class="control-label col-lg-4 pull-left">Email : :</label>
                                        <div class="col-lg-8">
                                            <input type="email" for="currrentsession" class="col-lg-12" id="currentsession" name="" />
                                        </div>
                                    </div>
                                    <h2 class="text-center mx-2 bg-warning" style="margin-bottom: 20px;">Monthly Salary Information</h2>
                                    <div class="form-group">
                                        <label for="lastname" class="control-label col-lg-4 pull-left">Basic Salary: In ₦ </label>
                                        <div class="col-lg-8">
                                            <input type="text" for="currrentsession" class="col-lg-12" id="currentsession" name="" value="" />
                                        </div>
                                    </div>

                                    <div class="form-group">
                                        <label for="password" class="control-label col-lg-4 pull-left">Other Allowances: In ₦ </label>
                                        <div class="col-lg-8">
                                            <input type="text" for="currrentsession" class="col-lg-12" id="currentsession" name="" />
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label for="password" class="control-label col-lg-4 pull-left">Employee Tax (PAYE): In ₦ </label>
                                        <div class="col-lg-8">
                                            <input type="text" for="currrentsession" class="col-lg-12" id="currentsession" name="" />
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label for="password" class="control-label col-lg-4 pull-left">Other Deductions: In ₦ </label>
                                        <div class="col-lg-8">
                                            <select class="form-control">
                                                <option>Not Assign</option>
                                                <option>ABZ</option>
                                            </select>
                                        </div>
                                    </div>

                                    <h2 class="text-center mx-2 bg-warning" style="margin-bottom: 20px;">Salary Account Information</h2>
                                    <div class="form-group">
                                        <label for="lastname" class="control-label col-lg-4 pull-left">Account Title: </label>
                                        <div class="col-lg-8">
                                            <input type="text" for="currrentsession" class="col-lg-12" id="currentsession" name="" value="" />
                                        </div>
                                    </div>

                                    <div class="form-group">
                                        <label for="password" class="control-label col-lg-4 pull-left">Account Number: </label>
                                        <div class="col-lg-8">
                                            <input type="text" for="currrentsession" class="col-lg-12" id="currentsession" name="" />
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label for="password" class="control-label col-lg-4 pull-left">Banker: </label>
                                        <div class="col-lg-8">
                                            <input type="text" for="currrentsession" class="col-lg-12" id="currentsession" name="" />
                                        </div>
                                    </div>
                                    <h2 class="text-center mx-2 bg-warning" style="margin-bottom: 20px;">Other Information</h2>
                                    <div class="form-group">
                                        <label for="lastname" class="control-label col-lg-4 pull-left">Date of Employment: </label>
                                        <div class="col-lg-8">
                                            <input type="date " for="currrentsession" class="col-lg-12" id="currentsession" name="" value="" />
                                        </div>
                                    </div>

                                    <div class="form-group">
                                        <label for="password" class="control-label col-lg-4 pull-left">Designation : </label>
                                        <div class="col-lg-8">
                                            <input type="text" for="currrentsession" class="col-lg-12" id="currentsession" name="" />
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label for="password" class="control-label col-lg-4 pull-left">Qualifications : </label>
                                        <div class="col-lg-8">
                                            <input type="text" for="currrentsession" class="col-lg-12" id="currentsession" name="" />
                                        </div>
                                    </div>
                                    <div class="form-check">
                                        <div class="form-group">
                                            <label for="firstname" class="control-label col-lg-4 pull-left">Introduction:</label>
                                            <div class="col-lg-8">
                                                <textarea cols="65" id="" name="" rows="10"></textarea>
                                            </div>
                                        </div>
                                    </div>

                                    <div class="form-group">
                                        <div class="col-lg-offset-3 col-lg-6" style="margin-top: 15px;">
                                            <button class="btn btn-primary" type="submit">Create Teacher</button>
                                            <button class="btn btn-default" type="button">Cancel</button>
                                        </div>
                                    </div>
                                </form>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <div style="padding: 10px;" class="modal-body"></div>
        </div>
    </div>

    <!--modal-->
    <!--modal-->
    <div style="z-index: 999999; margin-top: 2%;" class="modal fade" id="myModaladdstaff" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
        <div style="width: 900px;" class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h4 class="modal-title" id="myModalLabel" style="margin-right: 40px;">Create New Staff</h4>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>

                    <div class="row">
                        <div class="panel-body">
                            <h2 class="text-center mx-2 bg-warning">Personal Information</h2>
                            <div class="form" style="margin-top: 25px;">
                                <form class="cmxform form-horizontal" id="signupForm" method="get" action="">
                                    <div class="form-group">
                                        <label for="lastname" class="control-label col-lg-4 pull-left">File Input:</label>
                                        <div class="col-lg-8">
                                            <input type="file" for="currrentsession" class="col-lg-12" id="currentsession" name="" value="" />
                                        </div>
                                    </div>

                                    <div class="form-group">
                                        <label for="password" class="control-label col-lg-4 pull-left">First Name: </label>
                                        <div class="col-lg-8">
                                            <input type="text" for="currrentsession" class="col-lg-12" id="currentsession" name="" />
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label for="password" class="control-label col-lg-4 pull-left">Last Name</label>
                                        <div class="col-lg-8">
                                            <input type="text" for="currrentsession" class="col-lg-12" id="currentsession" name="" />
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label for="password" class="control-label col-lg-4 pull-left">Gander:</label>
                                        <div class="col-lg-8">
                                            <select class="form-control">
                                                <option>Not Assign</option>
                                                <option>ABZ</option>
                                            </select>
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label for="password" class="control-label col-lg-4 pull-left">Marital Status: :</label>
                                        <div class="col-lg-8">
                                            <select class="form-control">
                                                <option>Not Assign</option>
                                                <option>1699</option>
                                            </select>
                                        </div>
                                    </div>
                                    <h2 class="text-center mx-2 bg-warning" style="margin-bottom: 20px;">Contact Information</h2>
                                    <div class="form-group">
                                        <label for="lastname" class="control-label col-lg-4 pull-left">Residence Address: </label>
                                        <div class="col-lg-8">
                                            <input type="text" for="currrentsession" class="col-lg-12" id="currentsession" name="" value="" />
                                        </div>
                                    </div>

                                    <div class="form-group">
                                        <label for="password" class="control-label col-lg-4 pull-left">City: </label>
                                        <div class="col-lg-8">
                                            <input type="text" for="currrentsession" class="col-lg-12" id="currentsession" name="" />
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label for="password" class="control-label col-lg-4 pull-left">State: </label>
                                        <div class="col-lg-8">
                                            <input type="text" for="currrentsession" class="col-lg-12" id="currentsession" name="" />
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label for="password" class="control-label col-lg-4 pull-left">Country: </label>
                                        <div class="col-lg-8">
                                            <select class="form-control">
                                                <option>Not Assign</option>
                                                <option>ABZ</option>
                                            </select>
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label for="mobile" type="number" class="control-label col-lg-4 pull-left">Mobile Phone Number: :</label>
                                        <div class="col-lg-8">
                                            <input type="mobile" for="currrentsession" class="col-lg-12" id="currentsession" name="" />
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label for="password" class="control-label col-lg-4 pull-left">Email : :</label>
                                        <div class="col-lg-8">
                                            <input type="email" for="currrentsession" class="col-lg-12" id="currentsession" name="" />
                                        </div>
                                    </div>
                                    <h2 class="text-center mx-2 bg-warning" style="margin-bottom: 20px;">Monthly Salary Information</h2>
                                    <div class="form-group">
                                        <label for="lastname" class="control-label col-lg-4 pull-left">Basic Salary: In ₦ </label>
                                        <div class="col-lg-8">
                                            <input type="text" for="currrentsession" class="col-lg-12" id="currentsession" name="" value="" />
                                        </div>
                                    </div>

                                    <div class="form-group">
                                        <label for="password" class="control-label col-lg-4 pull-left">Other Allowances: In ₦ </label>
                                        <div class="col-lg-8">
                                            <input type="text" for="currrentsession" class="col-lg-12" id="currentsession" name="" />
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label for="password" class="control-label col-lg-4 pull-left">Employee Tax (PAYE): In ₦ </label>
                                        <div class="col-lg-8">
                                            <input type="text" for="currrentsession" class="col-lg-12" id="currentsession" name="" />
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label for="password" class="control-label col-lg-4 pull-left">Other Deductions: In ₦ </label>
                                        <div class="col-lg-8">
                                            <select class="form-control">
                                                <option>Not Assign</option>
                                                <option>ABZ</option>
                                            </select>
                                        </div>
                                    </div>

                                    <h2 class="text-center mx-2 bg-warning" style="margin-bottom: 20px;">Salary Account Information</h2>
                                    <div class="form-group">
                                        <label for="lastname" class="control-label col-lg-4 pull-left">Account Title: </label>
                                        <div class="col-lg-8">
                                            <input type="text" for="currrentsession" class="col-lg-12" id="currentsession" name="" value="" />
                                        </div>
                                    </div>

                                    <div class="form-group">
                                        <label for="password" class="control-label col-lg-4 pull-left">Account Number: </label>
                                        <div class="col-lg-8">
                                            <input type="text" for="currrentsession" class="col-lg-12" id="currentsession" name="" />
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label for="password" class="control-label col-lg-4 pull-left">Banker: </label>
                                        <div class="col-lg-8">
                                            <input type="text" for="currrentsession" class="col-lg-12" id="currentsession" name="" />
                                        </div>
                                    </div>
                                    <h2 class="text-center mx-2 bg-warning" style="margin-bottom: 20px;">Other Information</h2>
                                    <div class="form-group">
                                        <label for="lastname" class="control-label col-lg-4 pull-left">Date of Employment: </label>
                                        <div class="col-lg-8">
                                            <input type="date " for="currrentsession" class="col-lg-12" id="currentsession" name="" value="" />
                                        </div>
                                    </div>

                                    <div class="form-group">
                                        <label for="password" class="control-label col-lg-4 pull-left">Designation : </label>
                                        <div class="col-lg-8">
                                            <input type="text" for="currrentsession" class="col-lg-12" id="currentsession" name="" />
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label for="password" class="control-label col-lg-4 pull-left">Qualifications : </label>
                                        <div class="col-lg-8">
                                            <input type="text" for="currrentsession" class="col-lg-12" id="currentsession" name="" />
                                        </div>
                                    </div>
                                    <div class="form-check">
                                        <div class="form-group">
                                            <label for="firstname" class="control-label col-lg-4 pull-left">Introduction:</label>
                                            <div class="col-lg-8">
                                                <textarea cols="65" id="" name="" rows="10"></textarea>
                                            </div>
                                        </div>
                                    </div>

                                    <div class="form-group">
                                        <div class="col-lg-offset-3 col-lg-6" style="margin-top: 15px;">
                                            <button class="btn btn-primary" type="submit">Create Staff</button>
                                            <button class="btn btn-default" type="button">Cancel</button>
                                        </div>
                                    </div>
                                </form>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <div style="padding: 10px;" class="modal-body"></div>
        </div>
    </div>
</section>

@endsection