From f198fff80349a71ccc7529c1dbcf53a67bd7084e Mon Sep 17 00:00:00 2001
From: Daeng Deni Mardaeni <ddeni05@gmail.com>
Date: Tue, 14 Jan 2025 09:23:42 +0700
Subject: [PATCH] fix(view): perbaiki format dan penamaan elemen dalam tampilan
 otorisator

- Mengubah urutan kelas CSS untuk konsistensi.
- Menambahkan kolom 'Penilai' pada tabel.
- Memperbaiki render data untuk kolom 'Penilai'.
- Menyusun ulang elemen footer untuk tata letak yang lebih baik.
---
 .../penilaian/otorisator/index.blade.php      | 28 +++++++++++++++----
 1 file changed, 22 insertions(+), 6 deletions(-)

diff --git a/resources/views/penilaian/otorisator/index.blade.php b/resources/views/penilaian/otorisator/index.blade.php
index 4864478..713c5dc 100644
--- a/resources/views/penilaian/otorisator/index.blade.php
+++ b/resources/views/penilaian/otorisator/index.blade.php
@@ -7,10 +7,10 @@
 @section('content')
     <div class="w-full grid gap-5 lg:gap-7.5 mx-auto">
         <div class="card border border-agi-100 pb-2.5">
-            <div class=" card-grid min-w-full" data-datatable="false" data-datatable-page-size="10"
+            <div class="min-w-full card-grid" data-datatable="false" data-datatable-page-size="10"
                  data-datatable-state-save="false" id="permohonan-table"
                  data-api-url="{{ route('otorisator.datatables', ['otorisator' => $header]) }}">
-                <div class="card-header bg-agi-50 py-5 flex-wrap">
+                <div class="flex-wrap py-5 card-header bg-agi-50">
                     <h3 class="card-title">
                         Daftar {{ $header }}
                     </h3>
@@ -29,7 +29,7 @@
 
                 <div class="card-body">
                     <div class="scrollable-x-auto">
-                        <table class="table table-auto table-border align-middle text-gray-700 font-medium text-sm"
+                        <table class="table text-sm font-medium text-gray-700 align-middle table-auto table-border"
                                data-datatable-table="true">
                             <thead>
                             <tr>
@@ -61,6 +61,11 @@
                                         <span class="sort-icon"> </span> </span>
                                 </th>
 
+                                <th class="min-w-[150px]" data-datatable-column="penilai">
+                                    <span class="sort"> <span class="sort-label"> Penilai </span>
+                                        <span class="sort-icon"> </span> </span>
+                                </th>
+
                                 <th class="min-w-[150px]" data-datatable-column="tujuan_penilaian_id">
                                     <span class="sort"> <span class="sort-label"> Status Bayar </span>
                                         <span class="sort-icon"> </span> </span>
@@ -87,10 +92,10 @@
                         </table>
                     </div>
                     <div
-                        class="card-footer justify-center md:justify-between flex-col md:flex-row gap-3 text-gray-600 text-2sm font-medium">
+                        class="flex-col justify-center gap-3 font-medium text-gray-600 card-footer md:justify-between md:flex-row text-2sm">
                         <div class="flex items-center gap-2">
                             Show
-                            <select class="select select-sm w-16" data-datatable-size="true" name="perpage"> </select> per
+                            <select class="w-16 select select-sm" data-datatable-size="true" name="perpage"> </select> per
                             page
                         </div>
                         <div class="flex items-center gap-4">
@@ -195,6 +200,17 @@
                         return `${data.tujuan_penilaian.name}`;
                     },
                 },
+                penilai: {
+                    title: 'Penilai',
+                    render: (item, data) => {
+                        if(data.penilaian.user_penilai[0]){
+                            console.log(data.penilaian.user_penilai[0]);
+                            return `${data.penilaian.user_penilai[0].user.name} | ${data.penilaian.user_penilai[0].team.name} | ${data.penilaian.user_penilai[0].team.regions.name}`;
+                        }
+
+                        return '';
+                    },
+                },
                 status_bayar: {
                     title: 'Status Bayar',
                     render: (item, data) => {
@@ -241,7 +257,7 @@
                         const isAdmin = userRoles.includes('administrator');
 
                         let buttons = `
-        <div class="flex flex-nowrap justify-center">
+        <div class="flex justify-center flex-nowrap">
             <a class="btn btn-sm btn-icon btn-clear btn-warning" href="otorisator/show/${data.id}/${dataHeader}">
                 <i class="ki-outline ki-eye"></i>
             </a>