djid_siput/resources/views/definisi-satuan/index.blade.php

<?php $getStatus = \App\Model\Privillage\Role::where('id',Auth::user()->role_id)->value('akses'); ?>
@extends('dev.core.using')
@section('content')
<style>

 .parent-list {
   list-style: none;
 }
 .arr-btn{
   font-size: 20px;
   margin-right: .5em;
   cursor: pointer;
   width: 1.3rem;
   height: 1.3rem;
   border-radius: .5rem;
   text-align: center;
 }
 .arr-btn:hover{
  background: #cdcdcd
 }
 .ic-container{
   /* margin-top: .3em; */
   gap:.5em;
 }
 .ic-container > .ic {
   width: 1.5rem;
   height: 1.3rem;
   border-radius: .5rem;
   text-align: center;
   cursor:pointer;
   background: #cdcdcd;
   /* padding-top: .3rem; */
   font-size: .8em;
   list-style: none;
   color: #000;
 }
 .ic-container > .ic:hover {
  background: #eee;
 }

 @media only screen and (max-width: 700px) {
 .option-item{
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 200px;
  padding-left:0px !important;
 }
}
</style>
<br/>
<br/>
<div class="card card-stats">
 <div class="card-body">
  <div class="row">
    <div class="col-md-12">
        <a type="button" href="{{route('definisi-satuan.add')}}" class="btn btn-primary" style="background: #193865;color: #fff"><i class="fa fa-plus"></i> Tambah Baru</a>
    </div>
  </div><br>	
    <ul class="parent-list" id="par-list">
    @foreach($data as $row)
      <li class="row" style="padding-top:7px">
        <div class="col-xs-4 col-sm-4 col-md-7 option-item"><b>{{$row->label}}</b></div>
        <div class="ic-container" style="display:flex">
        <a href="{{route('definisi-satuan.edit',$row->id)}}" class="ic"><i class="fas fa-edit" ></i></a>
        <a href="{{route('definisi-satuan.detail',$row->id)}}" class="ic"><i class="fas fa-eye" ></i></a>
        <a href="#" data-toggle="modal" id="btn-delete-{{$row->id}}" data-nama="{{$row->label}}" data-target="#modal-delete" onClick="deleteData({{$row->id}})" class="ic"><i class="fas fa-trash" ></i></a>
        </div>
      </li>
    @endforeach
      
    </ul>
</div>
</div>

<div class="modal fade" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true" id="modal-delete">
  <form action="" method="POST" id="form-delete">
  @csrf
    <div class="modal-dialog" role="document">
      <div class="modal-content">
        <div class="modal-header">
          <h5 class="modal-title" id="exampleModalLabel">Konfirmasi</h5>
          <button type="button" class="close" data-dismiss="modal" aria-label="Close">
            <span aria-hidden="true">&times;</span>
          </button>
        </div>
        <div class="modal-body">
          <input type="hidden" id="delete-id">
          <center>Anda yakin akan menghapus Program <span id="delete-nama" style="font-weight:bold"></span> ?</center>
        </div>
        <div class="modal-footer">
          <div class="form-group center">
            <button type="button" class="btn btn-secondary" data-dismiss="modal">Batalkan</button>
            <button type="submit" class="btn btn-danger">Hapus Data</button>
          </div>
        </div>
      </div>
    </div>
  </form>
</div>

<script>
 function deleteData(id){
    var nama = $('#btn-delete-'+id).attr('data-nama');
    $('#form-delete').attr("action","{{url('pengaturan/definisi-satuan/delete')}}/"+id);
    $('#delete-id').val(id);
    $('#delete-nama').text();
    $('#delete-nama').text(nama);
 }
</script>
@endsection