Files
lpj/resources/views/persetujuan_penawaran/index.blade.php
Daeng Deni Mardaeni 9c0fb13837 Tambah Kolom Dokumen Persetujuan dan Proses Data
Menambahkan kolom baru "Dokumen Persetujuan" pada tampilan tabel persetujuan penawaran untuk dapat mengunduh dokumen terkait. Juga menambahkan fungsi JavaScript "prosesData" yang menggunakan Swal untuk konfirmasi persetujuan atau pengembalian data penawaran untuk dikaji ulang. Fungsi render untuk beberapa kolom diperbarui untuk menampilkan data dengan format yang lebih sesuai.
2024-11-21 11:19:21 +07:00

230 lines
12 KiB
PHP

@extends('layouts.main')
@section('breadcrumbs')
{{ Breadcrumbs::render('persetujuan-penawaran') }}
@endsection
@section('content')
<div class="w-full grid gap-5 lg:gap-7.5 mx-auto">
<div class="card card-grid min-w-full" data-datatable="false" data-datatable-page-size="5" data-datatable-state-save="false" id="persetujuan-penawaran-table" data-api-url="{{ route('persetujuan-penawaran.datatables') }}">
<div class="card-header py-5 flex-wrap">
<h3 class="card-title">
Daftar Persetujuan Penawaran
</h3>
<div class="flex flex-wrap gap-2 lg:gap-5">
<div class="flex">
<label class="input input-sm"> <i class="ki-filled ki-magnifier"> </i>
<input placeholder="Search Persetujuan Penawaran" id="search" type="text" value="">
</label>
</div>
<div class="flex flex-wrap gap-2.5">
<div class="h-[24px] border border-r-gray-200"></div>
<a class="btn btn-sm btn-light" href="#"> Export to Excel </a>
</div>
</div>
</div>
<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" data-datatable-table="true">
<thead>
<tr>
<th class="w-14">
<input class="checkbox checkbox-sm" data-datatable-check="true" type="checkbox"/>
</th>
<th class="min-w-[150px]" data-datatable-column="nomor_registrasi">
<span class="sort"> <span class="sort-label"> Nomor Registrasi </span>
<span class="sort-icon"> </span> </span>
</th>
<th class="min-w-[150px]" data-datatable-column="nama_debitur">
<span class="sort"> <span class="sort-label"> Nama Debitur </span>
<span class="sort-icon"> </span> </span>
</th>
<th class="min-w-[150px]" data-datatable-column="nomor_proposal_penawaran">
<span class="sort"> <span class="sort-label"> Nomor Proposal </span>
<span class="sort-icon"> </span> </span>
</th>
<th class="min-w-[150px]" data-datatable-column="tanggal_proposal_penawaran">
<span class="sort"> <span class="sort-label"> Tanggal Proposal </span>
<span class="sort-icon"> </span> </span>
</th>
<th class="min-w-[150px]" data-datatable-column="dokumen_persetujuan">
<span class="sort"> <span class="sort-label"> Dokumen Persetujuan </span>
<span class="sort-icon"> </span> </span>
</th>
<th class="min-w-[150px]" data-datatable-column="biaya_final">
<span class="sort"> <span class="sort-label"> Biaya Final </span>
<span class="sort-icon"> </span> </span>
</th>
<th class="min-w-[150px]" data-datatable-column="sla_resume">
<span class="sort"> <span class="sort-label"> SLA Resume </span>
<span class="sort-icon"> </span> </span>
</th>
<th class="min-w-[150px]" data-datatable-column="sla_final">
<span class="sort"> <span class="sort-label"> SLA Final </span>
<span class="sort-icon"> </span> </span>
</th>
<th class="min-w-[150px]" data-datatable-column="catatan">
<span class="sort"> <span class="sort-label"> Catatan </span>
<span class="sort-icon"> </span> </span>
</th>
<th class="min-w-[50px] text-center" data-datatable-column="actions">Action</th>
</tr>
</thead>
</table>
</div>
</div>
</div>
@endsection
@push('scripts')
<script type="text/javascript">
function prosesData(data) {
Swal.fire({
title: 'Persetujuan Penawaran',
text: "Apakah Anda yakin ingin menyetujui data penawaran ini?",
icon: 'info',
showCancelButton: true,
confirmButtonColor: '#3085d6',
cancelButtonColor: '#d33',
confirmButtonText: 'Ya',
cancelButtonText: 'Tidak'
}).then((result) => {
if (result.isConfirmed) {
window.location.href = `persetujuan-penawaran/${data}/edit`;
} else if (result.isCancelled) {
$.ajaxSetup({
headers: {
'X-CSRF-TOKEN': '{{ csrf_token() }}'
}
});
$.ajax(`persetujuan-penawaran/${data}`, {
type: 'GET',
data: {'status': 'tender'}
}).then((response) => {
swal.fire('Success!', 'Data Persetujuan telah dikembalikan untuk di kaji ulang', 'success').then(() => {
window.location.reload();
});
}).catch((error) => {
console.error('Error:', error);
Swal.fire('Error!', 'An error occurred while deleting the file.', 'error');
});
}
})
}
</script>
<script type="module">
const element = document.querySelector('#persetujuan-penawaran-table');
const searchInput = document.getElementById('search');
const apiUrl = element.getAttribute('data-api-url');
const dataTableOptions = {
apiEndpoint: apiUrl,
pageSize: 5,
columns: {
select: {
render: (item, data, context) => {
const checkbox = document.createElement('input');
checkbox.className = 'checkbox checkbox-sm';
checkbox.type = 'checkbox';
checkbox.value = data.id.toString();
checkbox.setAttribute('data-datatable-row-check', 'true');
return checkbox.outerHTML.trim();
},
},
nomor_registrasi: {
title: 'Nomor Registrasi',
},
nama_debitur: {
title: 'Nama Debitur',
render: (item, data) => {
return `${data.debiture.name}`;
},
},
nomor_proposal_penawaran: {
title: 'Nomor Proposal',
render: (item, data) => {
return `${data.penawaran_tender.detail.no_proposal}`;
},
},
tanggal_proposal_penawaran: {
title: 'Tanggal Proposal',
render: (item, data) => {
return window.formatTanggalIndonesia(`${data.penawaran_tender.detail.tgl_proposal}`);
},
},
dokumen_persetujuan: {
title: 'Dokumen Persetujuan',
render: (item, data) => {
if (data.penawaran_tender.detail.dokumen_persetujuan) {
return `<a href="${data.penawaran_tender.detail.dokumen_persetujuan}" download="${data.penawaran_tender.detail.dokumen_persetujuan}" target="_blank" class="badge badge-sm badge-outline">
Download <i class="ki-filled ki-cloud-download"></i>
</a>`;
} else {
return 'Tidak ada dokumen';
}
},
},
biaya_final: {
title: 'Biaya Final',
render: (item, data) => {
return window.formatRupiah(`${data.penawaran_tender.detail.biaya_penawaran}`);
},
},
sla_resume: {
title: 'SLA Resume',
render: (item, data) => {
if(data.penawaran_tender.persetujuan) {
if (data.penawaran_tender.persetujuan.sla_resume) {
return window.formatTanggalIndonesia(`${data.penawaran_tender.persetujuan.sla_resume}`);
}
}
return '-';
},
},
sla_final: {
title: 'SLA Final',
render: (item, data) => {
if(data.penawaran_tender.persetujuan) {
if (data.penawaran_tender.persetujuan.sla_final) {
return window.formatTanggalIndonesia(`${data.penawaran_tender.persetujuan.sla_final}`);
}
}
return '-';
}
},
catatan: {
title: 'Catatan',
render: (item, data) => {
if(data.penawaran_tender.persetujuan) {
return data.penawaran_tender.persetujuan.catatan;
}
return '-';
},
},
actions: {
title: 'Action',
render: (item, data) => {
return `<div class="flex flex-nowrap justify-center">
<a class="btn btn-sm btn-outline btn-info" onclick="prosesData(${data.id})">
<i class="ki-filled ki-double-check"></i>
</a>
</div>`;
},
}
},
};
let dataTable = new KTDataTable(element, dataTableOptions);
// Custom search functionality
searchInput.addEventListener('input', function () {
const searchValue = this.value.trim();
dataTable.search(searchValue, true);
});
</script>
@endpush