@extends('admin.admin_app')

@section('content')
<div class="content-wrapper">

    <div class="container-xxl flex-grow-1 container-p-y">
        <div class="card">
        <h5 class="card-header">Fields Report   &nbsp;&nbsp;&nbsp;
            <a href="{{ route('admin.attributes.add_field') }}" type="button" class="btn btn-primary">
                <span class="tf-icons bx bx-plus"></span>&nbsp; Add new Field
            </a>
        </h5>
        <div  class="card-body">

        <div id="login_success">
            @if(session()->has('success'))
            <div class="alert alert-success" role="alert">
                {{ session()->get('success') }}
            </div>
            @endif
        </div>

            <div class="table-responsive text-nowrap">
                <table class="table table-bordered data-table">
                <caption class="ms-4">
                    Attribute
                </caption>
                <thead>
                    <tr>
                        <th>Sr No.</th>
                        <th>Field Title</th>
                        <th>Field Name</th>
                        <th>Field Type</th>
                        <th>Field length</th>
                        <!-- <th>Option</th> -->
                        <th>Status</th>
                        <th>Create At</th>
                        <th>Update At</th>
                        <th>Action</th>
                    </tr>
                </thead>
                <tbody>
                    
                </tbody>
                </table>
            </div>
        </div>
    </div>
    </div>
</div>
@endsection

@section('script')
<script type="text/javascript">
  $(function () {
    
    var table = $('.data-table').DataTable({
        processing: true,
        serverSide: true,
        stateSave: true,
        ajax: "",
        columns: [
            {data: 'DT_RowIndex', name: 'DT_RowIndex'},
            {data: 'field_title', name: 'field_title'},
            {data: 'field_name', name: 'field_name'},
            {data: 'field_type', name: 'field_type'},
            {data: 'field_length', name: 'field_length'},
            // {data: 'options', name: 'options'},
            {data: 'status', name: 'status'},
            {data: 'created_at', name: 'created_at'},
            {data: 'updated_at', name: 'updated_at'},
            {data: 'action', name: 'action', orderable: false, searchable: false},
        ]
    });
  });

  function delete_field(id){
    var idd = id;
    $.ajax({
        url : '{{ route("field.delete") }}',
        type : "POST",
        data : {id:idd,"_token": "{{ csrf_token() }}"},
        success:function(data){
            $('#login_success').html('<div class="alert alert-success" role="alert">Field Deleted successfully.</div>');
            $('.data-table').DataTable().ajax.reload();
        }
    })
  }
  
</script>
@endsection