@extends('layouts.app')

@section('title', 'Business Dashboard')

@section('content')
<div class="top_bar page-content">
    <!-- LOADER -->
    <div class="loader">
        <div class="top_status_bar load">
            <div class="progress_bar bar" style="left: 0px;">
            </div>
        </div>
    </div>
    <!-- END LOADER -->
    <!-- BREADCRUMBS -->
    <div class="breadcrumbs">
        <ul>
            <li><a href="">Home</a></li>
            <li><a href="#" class="">team</a></li>
        </ul>
        <button class="btn btn-large pull-right help theme_btn help_btn">?</button>
    </div>
    <!-- END BREADCRUMBS -->
</div>
<!-- END TOPBAR -->
<!-- PAGE CONTENT -->
<div class="page-content">
    <div class="row">
        <div class="col-md-12">
            <!-- Begin: life time stats -->
            <div class="portlet">
                <div class="portlet-title">
                    <div class="caption">
                        <h2>Team List
                            <span class="subtitle"> All the team members registered under employee section listed here, you can filter results based on values for better management.</span>
                        </h2>
                    </div>
                    <div class="actions success_actions" style="">
                        <a href="javascript:void(0);" data-toggle="modal" data-target="#new_filesAdd" class="add_new portal_add_btn">
                            <i class="fa fa-plus"></i>
                        </a>
                        <ul class="nav navbar-nav netsec_menucontent">
                            <li class="actions_dropdown dropdown">
                                <a href="#">Actions</a>
                                <ul class="actions_list dropdown-menu">
                                    <li>
                                        <a href="javascript:void(0);" data-toggle="modal" data-target="#new_filesAdd" class="add_new">New Employee</a>
                                    </li>
                                </ul>
                            </li>
                        </ul>
                    </div>
                </div>

                <div class="portlet-body flip-scroll">
                    <!--------------------FILTER---------------------->
                    <div class="row form-group">
                        <div class="col-md-2">
                            <select name="column_drop" id="column_drop" class="form-control select2 column_drop select2-hidden-accessible" tabindex="-1" aria-hidden="true">
                                <option value=""></option>
                                <option value="display_name">Name</option>
                                <option value="department_uuid">Department</option>
                                <option value="designation_uuid">Designation</option>
                                <option value="status">Employee status</option>
                                <option value="email">Email</option>
                                <option value="mobile">Mobile</option>
                                <option value="whatsapp">Whatsapp</option>
                            </select>
                            
                        </div>
                        <div class="col-md-2 value-drop">
                            <select name="value_drop" id="value_drop" disabled="" class="form-control select2 option_filters select2-hidden-accessible" tabindex="-1" aria-hidden="true">
                                <option value=""></option>
                            </select>
                        </div>
                        <div class="col-md-4 pr_0">
                            <button class="theme_btn_round btn filter_all" type="button" name="load" value="Filter" style="">Filter</button>
                            <button class="theme_btn_round btn reset_filter" type="button" name="" value="Clear All" >Clear All</button>
                            <form id="export_excel" method="post" action="" style="display: inline-block;">
                                <input type="hidden" name="_token" value="">                                            
                                <button class="theme_btn_round btn export_excel" style="" type="submit">
                                    Export
                                </button>
                            </form>
                        </div>
                        <div class="column_filters" style="display: block;">
                            <span class="each_filter" data-index="display_name" data-filter="value_drop" data-selected_text="Mr Hazem Galal" data-selected_val="Mr Hazem Galal">
                                Mr Hazem Galal 
                                <i class="fa fa-trash remove_filter"></i>
                            </span>
                        </div>
                        
                        <div class="leads_action_grey actions_selected">
                            <div class="actions_dropdown_grey">
                                <span>Lead options</span>
                                <ul class="actions_list_grey">
                                    <li class="option 1">Option 1</li>
                                </ul>
                            </div>
                        </div>
                    </div>
                    <!--------------------FILTER---------------------->

                    <!--------------------Search---------------------->
                    <div class="tb_search">
                        <input type="text" id="search_input_all" onkeyup="FilterkeyWord_all_table()" placeholder="Search.." class="form-control">
                    </div>
                    <table id="table-id" class="table filterable table-striped table-bordered table-hover custom_table">
                        <thead class="flip-content thead">
                            <tr>
                                <th></th>
                                <th class="th_2 ">Name</th>
                                <th class="th_3 ">Employee Id</th>
                                <th class="th_4 ">Department</th>
                                <th class="th_5 ">Designation</th>
                                <th class="th_6 ">Status</th>
                                <th class="th_7 ">Email</th>
                                <th class="th_8 ">Mobile</th>
                                <th class="th_9 ">Whatsapp</th>
                                <th class="th_10 ">Time Spent</th>
                                <th class="th_11 ">Tasks</th>
                                <th class="th_12 ">Opportunities</th>
                                <th class="th_13 ">Leads</th>
                                <th>
                                    <img class="dots_menu_grey" src="images/dots_menu_grey.png">
                                    <div class="dropdown_row table_option_checkboxes" style="">
                                        <span class="dropdown_row_option head">Select Columns</span>
                                        <span class="dropdown_row_option">
                                            <section title="" class="section_squaredThree">
                                                <div class="squaredThree">
                                                    <input type="checkbox" checked="" style="height: auto !important;" name="table_option[]" class="tb_options" value="Name^2" id="Name">
                                                    <label for="Name"></label>
                                                </div>
                                            </section>
                                            <span>Name</span>
                                        </span>
                                        <span class="dropdown_row_option">
                                            <section title="" class="section_squaredThree">
                                                <div class="squaredThree">
                                                    <input type="checkbox" checked="" style="height: auto !important;" name="table_option[]" class="tb_options" value="Employee Id^3" id="Employee Id">
                                                    <label for="Employee Id"></label>
                                                </div>
                                            </section>
                                            <span>Employee Id</span>
                                        </span>
                                        <span class="dropdown_row_option">
                                            <section title="" class="section_squaredThree">
                                                <div class="squaredThree">
                                                    <input type="checkbox" style="height: auto !important;" name="table_option[]" class="tb_options" value="Department^4" id="Department">
                                                    <label for="Department"></label>
                                                </div>
                                            </section>
                                            <span>Department</span>
                                        </span>
                                        <span class="dropdown_row_option">
                                            <section title="" class="section_squaredThree">
                                                <div class="squaredThree">
                                                    <input type="checkbox" style="height: auto !important;" name="table_option[]" class="tb_options" value="Designation^5" id="Designation">
                                                    <label for="Designation"></label>
                                                </div>
                                            </section>
                                            <span>Designation</span>
                                        </span>
                                        
                                        <span class="dropdown_row_option">
                                            <section title="" class="section_squaredThree">
                                                <div class="squaredThree">
                                                    <input type="checkbox" style="height: auto !important;" name="table_option[]" class="tb_options" value="Status^6" id="Status">
                                                    <label for="Status"></label>
                                                </div>
                                            </section>
                                            <span>Status</span>
                                        </span>
                                        
                                        <span class="dropdown_row_option">
                                            <section title="" class="section_squaredThree">
                                                <div class="squaredThree">
                                                    <input type="checkbox" checked="" style="height: auto !important;" name="table_option[]" class="tb_options" value="Email^7" id="Email">
                                                    <label for="Email"></label>
                                                </div>
                                            </section>
                                            <span>Email</span>
                                        </span>
                                        
                                        <span class="dropdown_row_option">
                                            <section title="" class="section_squaredThree">
                                                <div class="squaredThree">
                                                    <input type="checkbox" checked="" style="height: auto !important;" name="table_option[]" class="tb_options" value="Mobile^8" id="Mobile">
                                                    <label for="Mobile"></label>
                                                </div>
                                            </section>
                                            <span>Mobile</span>
                                        </span>
                                        
                                        <span class="dropdown_row_option">
                                            <section title="" class="section_squaredThree">
                                                <div class="squaredThree">
                                                    <input type="checkbox" checked="" style="height: auto !important;" name="table_option[]" class="tb_options" value="Whatsapp^9" id="Whatsapp">
                                                    <label for="Whatsapp"></label>
                                                </div>
                                            </section>
                                            <span>Whatsapp</span>
                                        </span>
                                        
                                        <span class="dropdown_row_option">
                                            <section title="" class="section_squaredThree">
                                                <div class="squaredThree">
                                                    <input type="checkbox" style="height: auto !important;" name="table_option[]" class="tb_options" value="Time Spent^10" id="Time Spent">
                                                    <label for="Time Spent"></label>
                                                </div>
                                            </section>
                                            <span>Time Spent</span>
                                        </span>
                                        
                                        <span class="dropdown_row_option">
                                            <section title="" class="section_squaredThree">
                                                <div class="squaredThree">
                                                    <input type="checkbox" style="height: auto !important;" name="table_option[]" class="tb_options" value="Tasks^11" id="Tasks">
                                                    <label for="Tasks"></label>
                                                </div>
                                            </section>
                                            <span>Tasks</span>
                                        </span>
                                        
                                        <span class="dropdown_row_option">
                                            <section title="" class="section_squaredThree">
                                                <div class="squaredThree">
                                                    <input type="checkbox" style="height: auto !important;" name="table_option[]" class="tb_options" value="Opportunities^12" id="Opportunities">
                                                    <label for="Opportunities"></label>
                                                </div>
                                            </section>
                                            <span>Opportunities</span>
                                        </span>
                                        
                                        <span class="dropdown_row_option">
                                            <section title="" class="section_squaredThree">
                                                <div class="squaredThree">
                                                    <input type="checkbox" style="height: auto !important;" name="table_option[]" class="tb_options" value="Leads^13" id="Leads">
                                                    <label for="Leads"></label>
                                                </div>
                                            </section>
                                            <span>Leads</span>
                                        </span>
                                        <div class="tbl_actions">
                                            <button class="tbl_btn cancel_tbl_option">Cancel</button>
                                            <button class="tbl_btn apply_tbl_option">Apply</button>
                                        </div>
                                    </div>
                                </th>
                            </tr>
                        </thead>
                        <tbody class="tbody">
                        <!--=====================-->
                        <!--=====================-->
                            <tr> 
                                <td> 
                                    <div class="img_wrap contact_list">
                                        <div class="dp_name">
                                            <img src="images/avatar1.png" class="dp">
                                        </div>
                                    </div> 
                                </td> 
                                <td> 
                                    <a href="team_view.php" class="editable_name edit restrict_edit">Mr Ahmed Rizvi</a> 
                                    <span class="address designation_title">Account Manager</span> 
                                </td>
                                <td><span class="employee_id">100098</span></td>
                                <td><span class="department">Sales</span></td>
                                <td><span class="designation_">Account Manager</span></td> 
                                <td ><span class="status">Active</span></td> 
                                <td class="color_theme"><span class="email">rizvi@gbs.com.sa</span></td> 
                                <td class="color_theme"><span class="mobile">+966550887085</span></td>
                                <td class=""><span class="whatsapp">+966550887085</span></td>
                                <td class=""><span class="spent_time">00:00</span></td>
                                <td class=""><span class="total_tasks">0</span></td>
                                <td class=""><span class="ongoing_number_opp">0</span></td>
                                <td class=""><span class="ongoing_number_lead">0</span></td> 
                                <td style="width: 20px;"> 
                                    <img class="dots_menu_grey" src="images/dots_menu_grey.png">
                                    <div class="dropdown_row" style="">
                                        <span class="dropdown_row_option delete_from_list" data-uuid="">Delete</span> 
                                        <span class="dropdown_row_option update_load_form" data-uuid="">Update</span>
                                        <span class="dropdown_row_option view_employee" data-uuid="">View</span>
                                    </div>
                                </td>
                            </tr>
                            <tr> 
                                <td> 
                                    <div class="img_wrap contact_list">
                                        <div class="dp_name">
                                            <img src="{{ asset('images/avatar2.png') }}" class="dp">
                                        </div>
                                    </div> 
                                </td> 
                                <td> 
                                    <a href="team_view.php" class="editable_name edit restrict_edit">Mr Hazem Galal</a> 
                                    <span class="address designation_title">Account Manager</span> 
                                </td> 
                                <td><span class="employee_id">100145</span></td>
                                <td><span class="department">Sales</span></td>
                                <td><span class="designation_">Account Manager</span></td> 
                                <td><span class="status">Active</span></td> 
                                <td class="color_theme"><span class="email">hazem@gbs.com.sa</span></td> 
                                <td class="color_theme"><span class="mobile">+966596993369</span></td>
                                <td class=""><span class="whatsapp">+966596993369</span></td>
                                <td class=""><span class="spent_time">00:00</span></td>
                                <td class=""><span class="total_tasks">0</span></td>
                                <td class=""><span class="ongoing_number_opp">54</span></td>
                                <td class=""><span class="ongoing_number_lead">0</span></td> 
                                <td style="width: 20px;"> 
                                    <img class="dots_menu_grey" src="images/dots_menu_grey.png">
                                    <div class="dropdown_row">
                                        <span class="dropdown_row_option delete_from_list" data-uuid="">Delete</span> 
                                        <span class="dropdown_row_option update_load_form" data-uuid="">Update</span>
                                        <span class="dropdown_row_option view_employee" data-uuid="">View</span>
                                    </div>
                                </td>
                            </tr>


                            
                        </tbody>
                    </table>

                    <div class="bottom_custom">
                        <div class="rows">
                            <select class="form-control" name="state" id="maxRows">
                                <option value="10">10</option>
                                <option value="15">15</option>
                                <option value="20">20</option>
                                <option value="50" selected="">50</option>
                                <option value="100">100</option>
                                <option value="1000">1000</option>
                            </select>
                            <span>Records</span>
                        </div>
                        <div class="pagination-container">
                            <button class="load_more_listing" last_id="2" disabled="disabled">
                                <span class="load_more_list" style="display: inline;">Load More</span> 
                                <span class="list_loading" style="display: none;">Loading 
                                    <i class="fa fa-spinner fa-spin"></i>
                                </span>
                            </button>
                        </div>
                        <div class="rows_count">Showing 10 of 37 entries</div>
                        <span class="now_showing_count hide">37</span>
                        <span class="total_records hide">37</span>
                    </div>
                </div>
            </div>
            <!-- End: life time stats -->
        </div>
    </div>
</div>
<!-- END PAGE CONTENT -->
<!-- //UPDATE CONTACT MODAL START// -->
<div class="modal scrollable fade bs-modal right modal-fullscreen r_u_sure in" id="new_filesAdd" role="dialog" aria-hidden="false" style="">
    <div class="sweet-overlay" tabindex="-1"></div>
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <form method="post" id="updateEmployee" class="employee_update_form">
                <div class="modal-header">
                    <button type="button" class="close close_popup" data-dismiss="modal">×</button>
                    <h3 class="pop_heading">ADD NEW STAFF</h3>
                </div>
                <div class="modal-body">
                    <div class="body_wrap">
                        <div class="row">
                            <!--LEFT SIDE-->
                            <div class="col-md-4 left_side_task p_0">
                                <div class="rows_wrap">
                                    <div class="sidebar_list">
                                        <div class="display_pic">
                                            <a class="overlay btn-image-upload" data-toggle="modal" href="#modal_image_uplaod" data-modal-name="Customer Profile Images" data-modal-field="customer_profile_pic_path">
                                                <i class="fa fa-camera"></i>
                                            </a>
                                            <img class="display_picture" src="{{ asset('images/avatar2.png') }}">
                                        </div>


                                        <!-- <div class="display_pic">
                                            <a class="overlay btn-image-upload" data-toggle="modal" href="#modal_image_uplaod" data-modal-name="Customer Profile Images" data-modal-field="customer_profile_pic_path">
                                                <i class="fa fa-camera"></i>
                                            </a>
                                            <img class="display_picture" src="{{ asset('images/avatar2.png') }}" />
                                        </div> -->
                                        <span class="each_option basic_info active_option" id_attr="basic_info">Basic information</span>
                                        <span class="each_option staff_info" id_attr="staff_info">Staff information</span>
                                        <span class="each_option system_user_info" id_attr="system_user_info">System user information</span>
                                        <span class="each_option social_profile" id_attr="social_profile">Social profile</span>
                                        <span class="each_option additional_information" id_attr="additional_information" style="display: none;">Additional information</span>
                                    </div>
                                </div>
                            </div>
                            <!--LEFT SIDE-->
                            <!--RIGHT SIDE-->
                            <div class="col-md-8 pl_pr_0 right_side_task update_staff_data ">
                                <div id="basic_info">
                                    <span class="main_label">Basic Information</span>
                                    <div class="rows_wrap">
                                        <div class="row m_0">
                                            <div class="col-md-12">
                                                <div class="form-group">
                                                    <label for="title">Title *</label>
                                                    <select class="form-control select2 title filter validate select2-hidden-accessible" name="title" id="title" tabindex="-1" aria-hidden="true">
                                                        <option value=""></option>
                                                        <option value="Mr">Mr</option>
                                                        <option value="Mrs">Mrs</option>
                                                        <option value="Ms">Ms</option>
                                                        <option value="Dr">Dr</option>
                                                        <option value="Sh">Sh</option>
                                                    </select>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="row m_0">
                                            <div class="col-md-12">
                                                <div class="form-group">
                                                    <label for="firstname">First name *</label>
                                                    <input class="form-control first_name validate" id="first_name" type="text" name="first_name" value="" autocomplete="off">
                                                </div>
                                            </div>
                                        </div>
                                        <div class="row m_0">
                                            <div class="col-md-12">
                                                <div class="form-group">
                                                    <label for="lastname">Last name *</label>
                                                    <input class="form-control last_name validate" id="last_name" type="text" name="last_name" value="" autocomplete="off">
                                                </div>
                                            </div>
                                        </div>
                                        <div class="row m_0">
                                            <div class="col-md-12">
                                                <div class="form-group">
                                                    <label for="mobile">Mobile *</label>
                                                    <!-- <input id="int_phone" name="phone" type="tel"> -->
                                                    <input id="int_phone" name="mobile" type="tel" class="form-control just_number mobile validate phone" value="">
                                                    <!-- <input id="mobile" name="mobile" class="form-control just_number mobile validate phone" type="text" value=""> -->
                                                </div>
                                            </div>
                                        </div>
                                        <div class="row m_0">
                                            <div class="col-md-12">
                                                <div class="form-group">
                                                    <label for="whatsapp">WhatsApp</label>
                                                    <input class="form-control last_name validate" id="whatsApp" type="text" name="whatsApp" value="" autocomplete="off">
                                                    <div class="intl-tel-input allow-dropdown">
                                                        <div class="flag-container">
                                                            <div class="selected-flag" tabindex="0" title="Saudi Arabia (&#8235;المملكة العربية السعودية&#8236;&lrm;): +966">
                                                                <div class="iti-flag sa"></div>
                                                                <div class="iti-arrow"></div>
                                                            </div>
                                                            <ul class="country-list hide">
                                                                <li class="country preferred" data-dial-code="971" data-country-code="ae">
                                                                    <div class="flag-box">
                                                                        <div class="iti-flag ae"></div>
                                                                    </div>
                                                                    <span class="country-name">United Arab Emirates (&#8235;الإمارات العربية المتحدة&#8236;&lrm;)</span>
                                                                    <span class="dial-code">+971</span>
                                                                </li>
                                                                <li class="country preferred active" data-dial-code="966" data-country-code="sa">
                                                                    <div class="flag-box">
                                                                        <div class="iti-flag sa"></div>
                                                                    </div>
                                                                    <span class="country-name">Saudi Arabia (&#8235;المملكة العربية السعودية&#8236;&lrm;)</span>
                                                                    <span class="dial-code">+966</span>
                                                                </li>
                                                                <li class="divider"></li>
                                                                <li class="country" data-dial-code="93" data-country-code="af">
                                                                    <div class="flag-box">
                                                                        <div class="iti-flag af"></div>
                                                                    </div>
                                                                    <span class="country-name">Afghanistan (&#8235;افغانستان&#8236;&lrm;)</span>
                                                                    <span class="dial-code">+93</span>
                                                                </li>
                                                                <li class="country" data-dial-code="355" data-country-code="al">
                                                                    <div class="flag-box">
                                                                        <div class="iti-flag al"></div>
                                                                    </div>
                                                                    <span class="country-name">Albania (Shqipëri)</span>
                                                                    <span class="dial-code">+355</span>
                                                                </li>
                                                                <li class="country" data-dial-code="213" data-country-code="dz">
                                                                    <div class="flag-box">
                                                                        <div class="iti-flag dz"></div>
                                                                    </div>
                                                                    <span class="country-name">Algeria (&#8235;الجزائر&#8236;&lrm;)</span>
                                                                    <span class="dial-code">+213</span>
                                                                </li>
                                                            </ul>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="row m_0">
                                            <div class="col-md-12">
                                                <div class="form-group">
                                                    <label for="email">Email *</label>
                                                    <input name="email" class="form-control validate email" type="text" value="">
                                                </div>
                                            </div>
                                        </div>
                                        <div class="row m_0">
                                            <div class="col-md-12">
                                                <div class="form-group">
                                                    <label for="conferencing">Conferencing</label>
                                                    <input name="conferencing" class="form-control conferencing" type="text" value="">
                                                </div>
                                            </div>
                                        </div>
                                        <div class="row m_0">
                                            <div class="col-md-12">
                                                <div class="form-group">
                                                    <label for="country">Country *</label>
                                                    <select name="country" class="select2 gbs_country staff_country validate select2-hidden-accessible" tabindex="-1" aria-hidden="true">
                                                        <option value=""></option>
                                                        <option value="1">Afghanistan</option>
                                                        <option value="2">Albania</option>
                                                        <option value="3">Algeria</option>
                                                        <option value="4">American Samoa</option>
                                                        <option value="5">Andorra</option>
                                                    </select>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="row m_0">
                                            <div class="col-md-12">
                                                <div class="form-group">
                                                    <label for="state">State / Province*</label>
                                                    <select name="state" class="select2 state validate select2-hidden-accessible" tabindex="-1" aria-hidden="true">
                                                        <option value=""></option>
                                                        <option value="3151">Eastern Province</option>
                                                        <option value="3152">Hail</option>
                                                        <option value="3153">Jawf</option>
                                                        <option value="3154">Jizan</option>
                                                    </select>
                                                    <span class="spin_icon" style="display: none;"><i class="fa fa-spinner fa-spin"></i></span>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="row m_0">
                                            <div class="col-md-12">
                                                <div class="form-group">
                                                    <label for="city">City *</label>
                                                    <select name="city" class="select2 city validate select2-hidden-accessible" tabindex="-1" aria-hidden="true">
                                                        <option value=""></option>
                                                    </select>
                                                    <span class="spin_icon"><i class="fa fa-spinner fa-spin"></i></span>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="row m_0">
                                            <div class="col-md-12">
                                                <div class="form-group">
                                                    <label for="address">Address</label>
                                                    <input id="address" name="address" class="form-control address" type="text" value="" maxlength="100">
                                                </div>
                                            </div>
                                        </div>
                                        <div class="row m_0">
                                            <div class="col-md-12">
                                                <div class="form-group">
                                                    <label for="zip_code">Zip-code</label>
                                                    <input id="zip_code" name="zip_code" class="form-control zip_code" type="text" value="">
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div id="staff_info">
                                    <span class="main_label">Staff Information</span>
                                    <div class="rows_wrap">
                                        <div class="row m_0">
                                            <div class="col-md-12">
                                                <div class="form-group">
                                                    <label for="employee_id">Employee ID *</label>
                                                    <input class="form-control employee_id validate" type="text" name="employee_id" value="" autocomplete="off">
                                                </div>
                                            </div>
                                        </div>
                                        <div class="row m_0">
                                            <div class="col-md-12">
                                                <div class="form-group">
                                                    <label for="department">Department *</label>
                                                    <select class="form-control select2 department filter validate select2-hidden-accessible" name="department" tabindex="-1" aria-hidden="true">
                                                        <option value=""></option>
                                                        <option value="">Information Technology</option>
                                                        <option value="">Technical</option>
                                                        <option value="">Service</option>
                                                        <option value="">Human Resources</option>
                                                    </select>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="row m_0">
                                            <div class="col-md-12">
                                                <div class="form-group">
                                                    <label for="designation">Designation *</label>
                                                    <select class="form-control select2 designation filter validate select2-hidden-accessible" name="department" tabindex="-1" aria-hidden="true">
                                                        <option value=""></option>
                                                        <option value="">Information Technology</option>
                                                        <option value="">Technical</option>
                                                    </select>
                                                    <span class="spin_icon"><i class="fa fa-spinner fa-spin"></i></span>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="row m_0">
                                            <div class="col-md-12">
                                                <div class="form-group">
                                                    <label for="work_location">Work Location *</label>
                                                    <select class="form-control select2 designation filter validate select2-hidden-accessible" name="department" tabindex="-1" aria-hidden="true">
                                                        <option value=""></option>
                                                        <option value="">Saudi Arabia</option>
                                                        <option value="">Al Khobar</option>
                                                        <option value="">Riyadh</option>
                                                    </select>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="row m_0">
                                            <div class="col-md-12">
                                                <div class="form-group">
                                                    <label for="date_of_joining">Date of Joining *</label>
                                                    <div class="input-group datepicker_wrap">
                                                        <input id="date_joining_wrap" name="date_of_joining" class="form-control date_of_joining validate calender_popup_date_open" value="" type="text">
                                                        <span class="input-group-btn">
                                                            <button class="btn default custom_calender_date_open" type="button" style="margin: 0" value="">
                                                                <i class="fa fa-calendar"></i>
                                                            </button>
                                                        </span>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div id="system_user_info">
                                    <span class="main_label">System user information <span class="pass_change green">Change Password</span></span>
                                    <!-- <span class="main_label">System user information</span> -->
                                    <div class="rows_wrap">
                                        <div class="row m_0">
                                            <div class="col-md-12">
                                                <div class="form-group">
                                                    <label for="system_user_name">User name</label>
                                                    <input type="hidden" id="user_name_updated" value="">
                                                    <input class="form-control system_user_name" type="text" name="system_user_name" value="" autocomplete="off">
                                                </div>
                                            </div>
                                        </div>
                                        <div class="row m_0">
                                            <div class="col-md-12">
                                                <div class="form-group">
                                                    <label for="group">Group</label>
                                                    <select class="form-control select2 group filter select2-hidden-accessible" name="group" tabindex="-1" aria-hidden="true">
                                                        <option value=""></option>
                                                        <option value="ab67a780-9185-11e9-a233-75d199b69f0e">Management</option>
                                                        <option value="a1fa8ec0-918a-11e9-8096-3f0ab41313f9">Technical</option>
                                                        <option value="4d5e9a40-918c-11e9-aab8-1dd2a840d2ca">Head Of Projects</option>
                                                        <option value="cc37dee0-918d-11e9-a175-43af8b862eb6">Riyadh Branch Team</option>
                                                    </select>
                                                    <span class="spin_icon"><i class="fa fa-spinner fa-spin"></i></span>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="row m_0 password_wrap" style="display: none;">
                                            <div class="col-md-12">
                                                <div class="form-group">
                                                    <label for="password">Password</label>
                                                    <input class="form-control password" type="password" name="password" value="" autocomplete="off">
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div id="social_profile">
                                    <span class="main_label">Social Profile</span>
                                    <div class="rows_wrap">
                                        <div class="row m_0">
                                            <div class="col-md-12">
                                                <div class="form-group">
                                                    <label for="linked_in">Linked-in</label>
                                                    <input id="linked_in" name="linked_in" class="form-control url linked_in" type="text" placeholder="https://www.linkedin.com/">
                                                    <input type="hidden" class="update_social_link linked_in_update" name="linked_in_update" value="0">
                                                </div>
                                            </div>
                                        </div>
                                        <div class="row m_0">
                                            <div class="col-md-12">
                                                <div class="form-group">
                                                    <label for="twitter">Twitter</label>
                                                    <input id="twitter" name="twitter" class="form-control url twitter" type="text" placeholder="https://twitter.com/">
                                                    <input type="hidden" class="update_social_link twitter_update" name="twitter_update" value="0">
                                                </div>
                                            </div>
                                        </div>
                                        <div class="row m_0">
                                            <div class="col-md-12">
                                                <div class="form-group">
                                                    <label for="facebook">Facebook</label>
                                                    <input id="facebook" name="facebook" class="form-control url facebook" type="text" placeholder="https://www.facebook.com/">
                                                    <input type="hidden" class="update_social_link facebook_update" name="facebook_update" value="0">
                                                </div>
                                            </div>
                                        </div>
                                        <div class="row m_0">
                                            <div class="col-md-12">
                                                <div class="form-group">
                                                    <label for="google">Google</label>
                                                    <input name="google" class="form-control url google" type="text" placeholder="https://plus.google.com">
                                                    <input type="hidden" class="update_social_link google_update" name="google_update" value="0">
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div id="additional_information" style="display: none;">
                                    <span class="main_label">Additional information</span>
                                    <div class="rows_wrap">
                                        <div class="row m_0">
                                            <div class="col-md-12">
                                                <div class="form-group">
                                                    <label for="created_by">Created by</label>
                                                    <input class="form-control created_by" value="" id="created_by" disabled="disabled" type="text" name="created_by" autocomplete="off">
                                                </div>
                                            </div>
                                        </div>
                                        <div class="row m_0">
                                            <div class="col-md-12">
                                                <div class="form-group">
                                                    <label for="created_at">Created at</label>
                                                    <input class="form-control created_at" id="created_at" disabled="disabled" type="text" name="created_at" value="" autocomplete="off">
                                                </div>
                                            </div>
                                        </div>

                                    </div>
                                </div>
                            </div>
                            <!--RIGHT SIDE-->
                        </div>
                    </div>
                </div>
                <div class="modal-footer">
                    <div class="row" style="">
                        <div class="col-sm-6">
                            <div class="alert_box">There are errors on page</div>
                        </div>
                        <div class="col-sm-6">
                            <button type="button" class="btn dismiss" data-dismiss="modal">Cancel</button>
                            <button type="submit" class="btn theme_btn_round save_staff" data-save="1"> Save</button>
                        </div>
                    </div>
                </div>
            </form>
        </div>
        <!-- /.modal-Task -->
        <!-- <div class="alert_box">There are errors on page</div>-->
    </div>
    <!-- /.modal-dialog -->
</div>
<!-- //UPDATE CONTACT MODAL END// -->
@stop
@section('styles')
   
@stop
@section('admin_js')

@stop