@extends('layouts.app')

@section('content')
<link rel="stylesheet" href="{{ asset('css/number-provisioning.css?' . time()) }}">
<h2>Number Provisioning</h2>

<div class="container mt-5">

    <div class="processing_div">
        <h2 class="no-preview-available">Processing...</h2>
    </div>
    <div class="provisioning-table-div">
        
        <div class="user_find_replace_div">

            <div class="filters-wrapper">
                <div class="left-filters">
                    <div class="filter-group partner_dd">
                        <label for="partnerSelect">Partners</label>
                        <select class="user_dropdown select2" id="partnerSelect">
                            <option value="" selected>Select Partner</option>
                            @foreach ($partners as $customer)
                                <option value="{{ $customer['user_id'] }}" data-id="{{ $customer['id'] }}">{{ $customer['account_name'] . ' (' . $customer['email'] . ')' }}</option>
                            @endforeach
                        </select>
                    </div>
                    <div class="filter-group account_dd" style="display: none;">
                        <label for="accountSelect">Accounts</label>
                        <select class="user_dropdown select2" id="accountSelect">
                            <option value="" selected>Select Account</option>
                            
                        </select>
                    </div>
                    <div class="filter-group service_instance_dd" style="display: none;">
                        <label for="userSelect">Service Instances</label>
                        <select class="user_dropdown select2" id="userSelect">
                            <option value="" selected>Select Instance</option>
                            
                        </select>
                    </div>
                    <button class="btn-fetch fetch-btn">FETCH</button>

                    <div class="filter-group">
                        <label>Incoming Call Control</label>
                        <select id="my-active-status" autocomplete="off">
                            <option value="10" selected="">Loadshare</option>
                            <option value="9">Weighted</option>
                            <option value="4">Overflow</option>
                        </select>
                    </div>
                    <button class="icon-btn filter"><i class="far fa-filter"></i></button>
                </div>
                <div class="right-filters">
                    <button class="btn-columns" title="This is under development" disabled>Report</button>
                    <button class="btn-columns" title="This is under development" disabled>History</button>
                    <button class="btn-columns columns-filter-btn"><i class="far fa-columns"></i> COLUMNS</button>
                </div>
            </div>



        </div>
        
        
        
        
        
    </div>
</div>

<div id="loaderModal" class="modal">
    <img class="loader-img" src="../images/ajax-spinner.gif">
    <span class="loader-text">Please wait ...</span>
</div>


<!-- Scripts -->
<script type="text/javascript" charset="utf8" src="https://cdn.datatables.net/1.11.1/js/jquery.dataTables.js"></script>
<script>
    var baseURL = "{{ URL::to('/') }}" + "/";
    let usersShieldNumbers = @json($shieldNumbers);
    let accounts = @json($accounts);
    let serviceInstance = @json($serviceInstance);
</script>
<script src="{{ asset('js/number-provisioning.js?'.time()) }}"></script>
@endsection