@extends('layouts.app')
@section('title', 'All Cli Records')
@section('content')
<style>
  .word-wrap {
    word-wrap: break-word;
    word-break: break-all;
  }
</style>

<section class="content">
			<div class="row">			  
				<div class="col-lg-12 col-12">
					  <div class="box"> 
                      <div id="preloader"style="display:none;">
                      <div id="preloader-status">
                        <img  src="assets/images/loader-30px.gif">
                        </div>  
                        </div>                          
							<div class="box-body">
								<h4 class="box-title text-info mb-0"><i class="fa fa-edit me-15"></i>All Cli Records</h4>

								<hr class="my-15">
							  
<div class="row"> 
  <div class="col-lg-12 col-12">
    <div class="box">
     <div class="box-body">           
        <div class="table-responsive">
        <table id="tickets" class="table mt-0 table-hover no-wrap did_list_table" data-page-size="10">
            <thead>
              <tr>
                        <th>id</th>
                        <th>Cli</th>
                        <th>Webhook</th>
                        <th>Openai key</th>                       
                        <th>Telnyx key</th>                       
                        <th>Telnyx Public key</th>                       
                        <th>Twilio account sid </th>                       
                        <th>Twilio auth token </th>                       
                        <th>Action </th>                       

                      </tr>
            </thead>
            <tbody>
            @foreach($cli_list as $k => $list)
            <tr>
                <td>{{ $k + 1 }}</td>
                <td>{{ $list->cli }}</td>
                <td>{{ $list->webhook }}</td>
                <td>{{ $list->openai_key }}</td>
                <td>{{ $list->telnyx_key }}</td>
                <td>{{ $list->telnyx_public_key }}</td>
                <td>{{ $list->twilio_account_sid }}</td>
                <td>{{ $list->twilio_auth_token }}</td>
                <td><a  type="button" data-bs-toggle="modal" data-bs-target="#myModal-{{ $k }}"data-id="{{$k}}" class="list-icons-item me-10"><i class="fa fa-eye fa-lg"></i></a>
                </td>
                
                <div id="myModal-{{ $k }}" class="modal fade in" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-xl">
      <div class="modal-content">
        
        
        <!-- /.box-header -->
          <div class="box-body">
        

        <!-- form itself -->
        <form id="test-form" class="mfp-hide white-popup-block">
          <h4><i class="icon-Add-user"><span class="path1"></span><span class="path2"></span></i> All Cli Details <button style="padding: 5px 11px 5px 11px;" type="button" class="btn btn-danger float-end" data-bs-dismiss="modal">X</button></h4>
          <hr>
          <div class="row">
          <div class="col-md-6">
           
            <div class="form-group">
              <i style="color:black;" class="ti-mobile"></i> <label class="form-label" for="inputName">Cli</label>
              <p class="word-wrap"><span class="badge badge-md badge-primary">{{$list->cli}}<span></p>
            </div>
            <div class="form-group">
              <i style="color:black;" class="ti-mobile"></i> <label class="form-label" for="inputEmail">Open Ai Key</label>
              @if($list->openai_key)
              <p><span class="badge badge-md badge-primary">{{$list->openai_key}}<span></p>
              @else<p>-</p>
             @endif
            </div>
            <div class="form-group">
              <i style="color:black;" class="ti-mobile"></i> <label class="form-label" for="inputPhone">Telnyx Key</label>
              @if($list->telnyx_key)
              <p class="word-wrap"><span class="badge badge-md badge-primary">{{$list->telnyx_key}}<span></p>
              @else<p>-</p>
              @endif
            </div>
            <div class="form-group">
              <i style="color:black;" class="ti-mobile"></i> <label class="form-label" for="inputPhone">Twilio Auth Token</label>
              @if($list->twilio_auth_token)
              <p class="word-wrap"><span class="badge badge-md badge-primary mobile">{{$list->twilio_auth_token}}<span></p>
              @else<p>-</p>
              @endif
            </div>
           
          </div>

          <div class="col-md-6">
          <div class="form-group">
            <i style="color:black;" class="ti-mobile"></i> <label class="form-label" for="inputName">Webhook</label>
            @if($list->webhook)
              <p class="word-wrap"><span class="badge badge-md badge-primary">{{$list->webhook}}</span></p>
              @else<p>-</p>
              @endif
            </div>
            <div class="form-group">
            <i style="color:black;" class="ti-mobile"></i> <label class="form-label" for="inputName">Telnyx Public key</label>
           
            @if($list->telnyx_public_key)
              <p class="word-wrap"><span class="badge badge-md badge-primary">{{$list->telnyx_public_key}}</span></p>
              @else<p>-</p>
              @endif                              

                                                    
            </div>
            <div class="form-group">
              <i style="color:black;" class="ti-mobile"></i> <label class="form-label" for="inputPhone">Twilio Account sid</label>
              @if($list->twilio_account_sid)
              <p class="word-wrap"><span class="badge badge-md badge-primary">{{$list->twilio_account_sid}}<span></p>
              @else<p>-</p>
              @endif 
            </div>
          
           
         
         
          </div>
          </div>

            
        </form>
      </div>
        <!-- /.box-body -->
        <!-- /.box -->
        
      </div>
      <!-- /.modal-content -->
    </div>
    <!-- /.modal-dialog -->
  </div>
            </tr>
        @endforeach
            </tbody>
                            
          </table>

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

</div>
</section>


@endsection