@extends('layouts.app') 
@section('title', 'Account Management')
@section('breadcrumb')
    <style type="text/css">
        .textStyle {
            border: 1px solid #EDEADE;
            padding: 10px;
        }
        .headerLinkLeft {
            line-height: 44px;
            
            padding: 14px;
            color: black;
            text-decoration: none;
            margin: -2px;
        }
        .headerLinkLeft:hover{
            text-decoration: none;
            background-color: crimson;
            color: white;
        }
        .testColorCrimson{
            color: crimson;
            font-weight: bold;
        }
        .IpTable{
        width: 100% !important;
    }
     
    </style>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">

 <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.5.2/css/bootstrap.css">
<link rel ="stylesheet" href="https://cdn.datatables.net/1.12.1/css/dataTables.bootstrap4.min.css">
<script src="https://code.jquery.com/jquery-3.5.1.js"></script>
<script src="https://cdn.datatables.net/1.12.1/js/jquery.dataTables.min.js"></script>
<script src="https://cdn.datatables.net/1.12.1/js/dataTables.bootstrap4.min.js"></script>
    <ol class="breadcrumb border-0 m-0 px-0 px-md-3">
        <li class="breadcrumb-item">Home</li>
        <li class="breadcrumb-item"><a href="{{ route('admin.dashboard') }}">Admin</a></li>
        <li class="breadcrumb-item"><a href="{{ route('admin.account') }}">Account Management</a></li>
        <li class="breadcrumb-item active">Active Services</li>
    </ol>
@endsection
@section('content')
<!--<div class="row">
    <div class="col-md-12" style="background-color:#D0D0D0;padding-left: 0px;padding-right: 6px;">
        <div class="float-left">
          <a href="javascript:void(0)" class="headerLinkLeft addBackGround1 removeBackGround" onclick="changeColor(1)">All Services</a>
          <a href="javascript:void(0)" class="headerLinkLeft addBackGround2 removeBackGround" onclick="changeColor(2)">Internet</a>
          <a href="{{url('/iptv')}}" class="headerLinkLeft addBackGround3 removeBackGround" onclick="changeColor(3)">IPTV</a>
          <a href="{{url('/catv')}}" class="headerLinkLeft addBackGround4 removeBackGround" onclick="changeColor(4)">CATV</a>
          <a href="{{url('/dvbc')}}" class="headerLinkLeft addBackGround5 removeBackGround" onclick="changeColor(5)">DVBC</a>
          <a href="{{url('/volp')}}" class="headerLinkLeft addBackGround6 removeBackGround" onclick="changeColor(6)">VOIP</a>
          <a href="{{url('/service')}}" class="headerLinkLeft addBackGround7 removeBackGround" onclick="changeColor(7)">Services</a>
          <a href="{{url('/moblie')}}" class="headerLinkLeft addBackGround8 removeBackGround" onclick="changeColor(8)">Mobile</a>
        </div>
        <div class="float-right"> 
            <select class="btn btn-success align-middle getFormName" style="line-height: 14px;padding: 7px;margin-top: 4PX;" onchange="getFormName()">
                <option> + Add New Service </option>
                <option style="background-color: #D0D0D0;color: black;" value="Internet">Internet</a></option>
                <option style="background-color: #D0D0D0;color: black;" value="Iptv">IPTV</option>
                <option style="background-color: #D0D0D0;color: black;" value="Catv">CATV</option>
                <option style="background-color: #D0D0D0;color: black;" value="Dvbc">DVBC</option>
                <option style="background-color: #D0D0D0;color: black;" value="Voip">VOIP</option>
                <option style="background-color: #D0D0D0;color: black;" value="Service">Services</a></option>

                <!-- <option style="background-color: #D0D0D0;color: black;"><a href="{{url('/addservice')}}">Services</a></option> -->
               <!-- <option style="background-color: #D0D0D0;color: black;" value="Mobile">Mobile</option>
            </select>
            <button class="btn btn-light align-middle" style="line-height: 14px;padding: 8px;margin-top: 4PX;">
                <svg class="c-sidebar-nav-icon" style="margin-left: -9rem;margin-right: -9rem;">
                    <use xlink:href="{{ url('public/assets/vendors/@coreui/icons/svg/free.svg#cil-search') }}"></use>
                </svg>
                Search Deleted Services (0) 
            </button>
        </div>
    </div>
</div>
<div class="row">
    <div class="alert alert-success mt-2" role="alert">
    Total Monthly Charges <span class="testColorCrimson">5 999 HUF Inc. Tax</span> (5 705 HUF exc. Tax)
    </div> 
</div> -->
@include('layouts.navbar')
<div class="IpTable"> 

         <h1   style=" border-bottom: outset;border-bottom-width: thin;">
          <center> Additional IP Address Of Clients</center>
        </h1>
        <center><button type="button" class="btn btn-success">+ Add New IP Address For Customer</button></center>

</div></center>
 <center> <div>
    <table id="example" class="table table-striped table-bordered" style="width:70%">
        <thead>
            <tr>
                <th>Description</th>
                <th>IP Address</th>
                <th>Router Mac Address</th>
                <th>Mac Address Of Modem</th>
                <th>Address</th>
                <th>Router</th>
                <th>Connected From</th>
                <th>Line Not Aggregated</th>
                <th>Price</th>
            </tr>

        </thead>
        
        <tdata>
          <td>jkhjhkhkj</td> 
          <td>jkhjhkhkj</td> 
          <td>jkhjhkhkj</td> 
          <td>jkhjhkhkj</td> 
          <td>jkhjhkhkj</td>  
          <td>jkhjhkhkj</td> 
          <td>jkhjhkhkj</td> 
          <td>jkhjhkhkj</td> 
        </tdata>
        <tfoot>
            
        </tfoot>
    </table>

    </div></center>
    <center><button type="button" class="btn btn-light">Back</button></center>
    <script   type="text/javascript">
   

 function getFormName()
        {
            if($(".getFormName").val()=='Internet')
            {
                window.location.href = "{{url('/addInternetService')}}";
            }
            if($(".getFormName").val()=='Iptv')
            {
                window.location.href = "{{url('/iptv')}}";
            }
             if($(".getFormName").val()=='Catv')
            {
                window.location.href = "{{url('/catv')}}";
            }
            if($(".getFormName").val()=='Dvbc')
            {
                window.location.href = "{{url('/dvbc')}}";
            }
             if($(".getFormName").val()=='Voip')
            {
                window.location.href = "{{url('/volp')}}";
            }
            if($(".getFormName").val()=='Service')
            {
                window.location.href = "{{url('/addservice')}}";
            }
        }


$(document).ready(function() {
    $('#example').DataTable({
        dom: 'Plfrtip',
        language: {
            searchPanes: {
                emptyPanes: 'There are no panes to display. :/'
            }
        }
    });
});
</script>   
@endsection