@extends('layouts.master')
@section('page_title')
    @if(isset($page_title))
        {{ $page_title }}
    @endif
@endsection
@section('css')
@endsection('css')
@section('content')
<div class="">
    <div class="page-title">
      <div class="title_left" style="width:800px !important;">
        <ol class="breadcrumb">
          <li><a href="{!! url('dashboard') !!}">Dashboard</a></li>
          <li class="active">Servers</li>
        </ol>
      </div>
    </div>
<div class="x_content">
    <div class="col-md-6 col-sm-6 col-xs-12">
        <div class="x_panel">
          <div class="x_title">
            <h2><i class="fa fa-align-left"></i> Server Details</h2>
            <ul class="nav navbar-right panel_toolbox">
              <li><a class="collapse-link"><i class="fa fa-chevron-up"></i></a>
              </li>
              <li class="dropdown">
                <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false"><i class="fa fa-wrench"></i></a>
                <ul class="dropdown-menu" role="menu">
                  <li><a href="#">Settings 1</a>
                  </li>
                  <li><a href="#">Settings 2</a>
                  </li>
                </ul>
              </li>
              <li><a class="close-link"><i class="fa fa-close"></i></a>
              </li>
            </ul>
            <div class="clearfix"></div>
          </div>
          <div class="x_content">

            <!-- start accordion -->
            <div class="accordion" id="accordion1" role="tablist" aria-multiselectable="true">
              <div class="panel">
                <a class="panel-heading" role="tab" id="headingOne1" data-toggle="collapse" data-parent="#accordion1" href="#collapseOne1" aria-expanded="true" aria-controls="collapseOne">
                  <h4 class="panel-title">SMSC (UCM) #1 - 206.225.81.36</h4>
                </a>
                <div id="collapseOne1" class="panel-collapse collapse in" role="tabpanel" aria-labelledby="headingOne">
                  <div class="panel-body">
                    <div>
                        <div class="col-md-6"><input type="text" class="form-control" readonly="" value="encripted password" name=""></div>
                        <button class="btn btn-sm btn-primary" title="click to descript password"><i class="fa fa-eye"></i></button>
                    </div>

                    <table class="table table-striped">
                      <thead>
                        <tr>
                          <th>#</th>
                          <th>Direct Connections</th>
                          <th>Connection Type</th>
                          <th>Peer/Domain</th>
                          <th>VPN Form</th>
                          <th>Action</th>
                        </tr>
                      </thead>
                      <tbody>
                        <tr>
                            <th scope="row">1</th>
                            <td>TNM MALAWI</td>
                            <td>VPN</td>
                            <td>45.22.33.2</td>
                            <td>N/A</td>
                            <td>
                                <a href="" class="btn btn-warning btn-sm"><i class="fa fa-edit"></i> </a> 
                                <a href="" class="btn btn-danger btn-sm"><i class="fa fa-trash"></i> </a>
                            </td>
                        </tr>
                        <tr>
                          <th scope="row">3</th>
                          <td>Orange Botswana</td>
                          <td>VPN</td>
                          <td>32.22.22.1</td>
                          <td><a href="" class="btn btn-sm btn-success"><i class="fa fa-file-word-o"></i> </a></td>
                          <td><a href="" class="btn btn-warning btn-sm"><i class="fa fa-edit"></i> </a> <a href="" class="btn btn-danger btn-sm"><i class="fa fa-trash"></i> </a></td>
                        </tr>
                        <tr>
                          <th scope="row">4</th>
                          <td>Mascom Botswana</td>
                          <td>VPN</td>
                          <td>32.22.22.1</td>
                          <td><a href="" class="btn btn-sm btn-success"><i class="fa fa-file-word-o"></i> </a></td>
                          <td><a href="" class="btn btn-warning btn-sm"><i class="fa fa-edit"></i> </a> <a href="" class="btn btn-danger btn-sm"><i class="fa fa-trash"></i> </a></td>
                        </tr>
                        
                        <tr>
                          <th scope="row">5</th>
                          <td>MTN Zambia</td>
                          <td>VPN</td>
                          <td>32.22.22.1</td>
                          <td><a href="" class="btn btn-sm btn-success"><i class="fa fa-file-word-o"></i> </a></td>
                          <td><a href="" class="btn btn-warning btn-sm"><i class="fa fa-edit"></i> </a> <a href="" class="btn btn-danger btn-sm"><i class="fa fa-trash"></i> </a></td>
                        </tr>
                        <tr>
                          <th scope="row">6</th>
                          <td>Zamtel Zambia</td>
                          <td>VPN</td>
                          <td>32.22.22.1</td>
                          <td><a href="" class="btn btn-sm btn-success"><i class="fa fa-file-word-o"></i> </a></td>
                          <td><a href="" class="btn btn-warning btn-sm"><i class="fa fa-edit"></i> </a> <a href="" class="btn btn-danger btn-sm"><i class="fa fa-trash"></i> </a></td>
                        </tr>
                        <tr>
                          <th scope="row">7</th>
                          <td>AirtelTigo GHANA</td>
                          <td>VPN</td>
                          <td>32.22.22.1</td>
                          <td><a href="" class="btn btn-sm btn-success"><i class="fa fa-file-word-o"></i> </a></td>
                          <td><a href="" class="btn btn-warning btn-sm"><i class="fa fa-edit"></i> </a> <a href="" class="btn btn-danger btn-sm"><i class="fa fa-trash"></i> </a></td>
                        </tr>
                        <tr>
                          <th scope="row">8</th>
                          <td>MTN GHANA</td>
                          <td>VPN</td>
                          <td>32.22.22.1</td>
                          <td><a href=""><i class="fa fa-file-word-o fa-2x"></i></a></td>
                          <td><a href="" class="btn btn-warning btn-sm"><i class="fa fa-edit"></i> </a> <a href="" class="btn btn-danger btn-sm"><i class="fa fa-trash"></i> </a></td>
                        </tr>
                      </tbody>
                    </table>
                  </div>
                </div>
              </div>
              <div class="panel">
                <a class="panel-heading collapsed" role="tab" id="headingTwo1" data-toggle="collapse" data-parent="#accordion1" href="#collapseTwo1" aria-expanded="false" aria-controls="collapseTwo">
                  <h4 class="panel-title">SMSC (UCM) #2 - 206.225.94.150</h4>
                </a>
                <div id="collapseTwo1" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingTwo">
                  <div class="panel-body">
                     <table class="table table-striped">
                      <thead>
                        <tr>
                          <th>#</th>
                          <th>Direct Connections</th>
                          <th>Connection Type</th>
                          <th>Peer/Domain</th>
                        </tr>
                      </thead>
                      <tbody>
                          <tr>
                          <th scope="row">2</th>
                          <td>Airtel MALAWI</td>
                          <td>FQDN</td>
                          <td>airtel.mw</td>
                            </tr>
                            <tr>
                              <th scope="row">4</th>
                              <td>Airtel Zambia</td>
                              <td>VPN</td>
                              <td>32.22.22.1</td>
                            </tr>
                      </tbody>

                  </table>
                  </div>
                </div>
              </div>
              <div class="panel">
                <a class="panel-heading collapsed" role="tab" id="headingThree1" data-toggle="collapse" data-parent="#accordion1" href="#collapseThree1" aria-expanded="false" aria-controls="collapseThree">
                  <h4 class="panel-title">USSD Gateway - 206.225.87.174</h4>
                </a>
                <div id="collapseThree1" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingThree">
                  <div class="panel-body">
                    <table class="table table-striped">
                      <thead>
                        <tr>
                          <th>#</th>
                          <th>Direct Connections</th>
                          <th>Connection Type</th>
                          <th>Peer/Domain</th>
                          <th>VPN Form</th>
                          <th>Action</th>
                        </tr>
                      </thead>
                      <tbody>
                        <tr>
                          <th scope="row">1</th>
                          <td>TNM MALAWI</td>
                          <td>VPN</td>
                          <td>45.22.33.2</td>
                          <td>N/A</td>
                          <td><a href="" class="btn btn-warning btn-sm"><i class="fa fa-edit"></i> </a> <a href="" class="btn btn-danger btn-sm"><i class="fa fa-trash"></i> </a></td>
                        </tr>
                        <tr>
                          <th scope="row">3</th>
                          <td>Orange Botswana</td>
                          <td>VPN</td>
                          <td>32.22.22.1</td>
                          <td><a href="" class="btn btn-sm btn-success"><i class="fa fa-file-word-o"></i> </a></td>
                          <td><a href="" class="btn btn-warning btn-sm"><i class="fa fa-edit"></i> </a> <a href="" class="btn btn-danger btn-sm"><i class="fa fa-trash"></i> </a></td>
                        </tr>
                        <tr>
                          <th scope="row">4</th>
                          <td>Mascom Botswana</td>
                          <td>VPN</td>
                          <td>32.22.22.1</td>
                          <td><a href="" class="btn btn-sm btn-success"><i class="fa fa-file-word-o"></i> </a></td>
                          <td><a href="" class="btn btn-warning btn-sm"><i class="fa fa-edit"></i> </a> <a href="" class="btn btn-danger btn-sm"><i class="fa fa-trash"></i> </a></td>
                        </tr>
                        
                        <tr>
                          <th scope="row">5</th>
                          <td>MTN Zambia</td>
                          <td>VPN</td>
                          <td>32.22.22.1</td>
                          <td><a href="" class="btn btn-sm btn-success"><i class="fa fa-file-word-o"></i> </a></td>
                          <td><a href="" class="btn btn-warning btn-sm"><i class="fa fa-edit"></i> </a> <a href="" class="btn btn-danger btn-sm"><i class="fa fa-trash"></i> </a></td>
                        </tr>
                        <tr>
                          <th scope="row">6</th>
                          <td>Zamtel Zambia</td>
                          <td>VPN</td>
                          <td>32.22.22.1</td>
                          <td><a href="" class="btn btn-sm btn-success"><i class="fa fa-file-word-o"></i> </a></td>
                          <td><a href="" class="btn btn-warning btn-sm"><i class="fa fa-edit"></i> </a> <a href="" class="btn btn-danger btn-sm"><i class="fa fa-trash"></i> </a></td>
                        </tr>
                        
                      </tbody>
                    </table>
                  </div>
                </div>
              </div>
              <div class="panel">
                <a class="panel-heading collapsed" role="tab" id="headingThree1" data-toggle="collapse" data-parent="#accordion1" href="#collapseThree2" aria-expanded="false" aria-controls="collapseThree">
                  <h4 class="panel-title">Billing Server - 206.225.95.171</h4>
                </a>
                <div id="collapseThree2" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingThree">
                  <div class="panel-body">
                    <table class="table table-striped">
                      <thead>
                        <tr>
                          <th>#</th>
                          <th>Direct Connections</th>
                          <th>Connection Type</th>
                          <th>Peer/Domain</th>
                        </tr>
                      </thead>
                      <tbody>
                          <tr>
                            <th scope="row">2</th>
                            <td>TNM MALAWI</td>
                            <td>VPN</td>
                            <td>121.212.11.1</td>
                            </tr>
                            <tr>
                              <th scope="row">4</th>
                              <td>Airtel Malawo</td>
                              <td>FQDN</td>
                              <td>airtel.billing.mw</td>
                            </tr>
                            <tr>
                              <th scope="row">4</th>
                              <td>Orange Botswant</td>
                              <td>VPN</td>
                              <td>32.22.22.1</td>
                            </tr>
                      </tbody>

                  </table>
                  </div>
                </div>
              </div>
              <div class="panel">
                <a class="panel-heading collapsed" role="tab" id="headingThree1" data-toggle="collapse" data-parent="#accordion1" href="#collapseThree3" aria-expanded="false" aria-controls="collapseThree">
                  <h4 class="panel-title">Mobile Money Server - 206.225.95.109</h4>
                </a>
                <div id="collapseThree3" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingThree">
                  <div class="panel-body">
                    <table class="table table-striped">
                        <thead>
                            <tr>
                                <th>#</th>
                                <th>Direct Connections</th>
                                <th>Connection Type</th>
                                <th>Peer/Domain</th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr>
                                <th scope="row">2</th>
                                <td>TNM MALAWI</td>
                                <td>VPN</td>
                                <td>121.212.11.1</td>
                            </tr>
                            <tr>
                              <th scope="row">4</th>
                              <td>Airtel Malawo</td>
                              <td>FQDN</td>
                              <td>airtel.billing.mw</td>
                            </tr>
                        </tbody>
                    </table>
                  </div>
                </div>
              </div>
            </div>
            <!-- end of accordion -->


          </div>
        </div>
    </div>
     <div class="col-md-6 col-sm-6 col-xs-12">
        <div class="x_panel">
          <div class="x_title">
            <h2><i class="fa fa-server"></i> Architectural Overview </h2>
            <ul class="nav navbar-right panel_toolbox">
              <li><a class="collapse-link"><i class="fa fa-chevron-up"></i></a>
              </li>
              <li class="dropdown">
                <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false"><i class="fa fa-wrench"></i></a>
                <ul class="dropdown-menu" role="menu">
                  <li><a href="#">Settings 1</a>
                  </li>
                  <li><a href="#">Settings 2</a>
                  </li>
                </ul>
              </li>
              <li><a class="close-link"><i class="fa fa-close"></i></a>
              </li>
            </ul>
            <div class="clearfix"></div>
          </div>
          <div class="x_content">

            <!-- start accordion -->
            <div class="" id="" role="" >
              <img src="{!! url('public/assets/img/overview.jpg') !!}" alt="server overview">
            </div>
            <!-- end of accordion -->


          </div>
        </div>
    </div>
</div>
    
</div>
 
@endsection
@section('javascript')
<script>
    
</script>
@endsection