@extends('layouts.main')

@section('title')
डिजिटल पालिका | नगर प्रोफाइल
@endsection

@section('custom-css')
<style>
  .asterik {
    color: red;
  }



  .asterik {
    color: red;
  }

  form {
    box-shadow: 0 0 0 rgba(240,240,240,0);
  }

  .card {
    box-shadow: 0 10px 25px rgba(92,99,105,.2);
  }

  .btns {
    font-size: 1.2rem !important;
    border-radius: 0px !important;
  }

  table > tbody > td {
    font-size: 20px !important;
  }
</style>
@endsection

@section('content')
<section class="mr-4 mt-2">
  <div class="card">
    <div class="card-header">



        <a href="{{ route('home') }}" style="float:left;"><i class="fas fa-arrow-left arrow"></i></a>
        <span class="card-title">नगर प्रोफाइल</span>
        <a href="{{ route('municipality-profile.create') }}" class="btn_palika" style="float: right"> <i class="fas fa-plus-square"></i> नयाँ थप गर्नुहोस</a>


    </div>
    <form>
    </form>
    <div class="card-body table-responsive" id="municipality-profile-data-table-wrapper">
      <table class="table table-hover municipality-profile-data-table">
        <thead>
        <tr>
            <th class="main_th">संरचना</th>
            <th class="main_th">नाम</th>
            <th class="main_th">वार्ड_नं</th>
            <th class="main_th"> इमेल</th>
            <th class="main_th"> मोबाइल नं</th>
            <th class="main_th">Action</th>
        </tr>
        </thead>
        <tbody>
        </tbody>
      </table>
    </div>
  </div>
</section>
@endsection

@section('custom-script')
<script>

  $(function () {
    $.ajaxSetup({
      headers: {
        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
      }
    });

    var table = $('.municipality-profile-data-table').DataTable({
      processing: true,
      serverSide: true,

      ajax: {
        url: "{{ route('municipality-profile.index') }}",
        type: 'GET',
        data: function(d) {
        }
      },

      columns: [
         {data: 'structure_name', name: 'structure_name'},
         {data: 'name', name: 'name'},
         {data: 'ward_id', name: 'ward_id'},
         {data: 'head_member_email', name: 'head_member_email'},
         {data: 'head_member_phone', name: 'head_member_phone'},
        {data: 'actions', name: 'actions', orderable: false, searchable: true},
      ],
    });


 
    

    $(document).on('click','#deletemunicipalityProfile',function () {
      var id=$(this).data('id');
      Swal.fire({
        title: 'Warning',
        text: 'के तपाइँ यसलाई मेटाउन निश्चित हुनुहुन्छ? एक पटक मेटाइ पुन: प्राप्त गर्न सकिँदैन।',
        showDenyButton: true,
        showCancelButton: true,
        confirmButtonText: 'Delete गर्नुहोस्',
        denyButtonText: `Delete नगर्नुहोस्`,

      }).then((result) => {
        /* Read more about isConfirmed, isDenied below */
        if (result.isConfirmed) {
          var data = {
            id: $('#deletemunicipalityProfile').attr('data-id'),
            _token: "{{ csrf_token() }}",
          }
          $.ajax({
            type: "delete",
            url: "{{ route('municipality-profile.destroy', '') }}" + "/" + id,
            data: data,
            success: function(response) {
              $('.municipality-profile-data-table').DataTable().ajax.reload();
              if (response.status == 200) {

                Swal.fire(response.message, '', 'success')
              } else {
                Swal.fire({
                  position: 'top-end',
                  icon: 'error',
                  title: 'Oops...',
                  text: response.message,
                  showConfirmButton: false,
                  timer: 1500
                })
              }
            }
          });
        } else if (result.isDenied) {

          Swal.fire('रद्द गरियो  ! ', '', 'info')

        }
      })
    })

  });
</script>
@endsection