Files
gps-frontend/resources/views/menu_v2/Finance/_viewPaymentSingle.blade.php.bak
meusinfirmary b9891d2f81 Initial commit
2025-04-22 14:33:37 +07:00

2672 lines
150 KiB
PHP
Executable File
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

@extends('app.app')
@section('title')
Finance - Payment
@endsection
@section('content')
<div class="container-fluid">
<div class="content">
<div class="row">
<div class="col-sm-4" id="">
<div class="card">
<div class="card-header">
<div class="row d-flex align-items-center">
<div class="col">
<p class="card-title text-bold mb-0">Detail Pesanan (#{{ $order->ord_code }})</p>
<p class="mb-0" style="margin-top: 0.25rem;">
@if ($order->crt_type_order === \App\Models\Orders::CRT_TYPE_ORDER_ADMIN_SPECIAL)
<span class="badge bg-warning text-dark">Pesanan Khusus</span>
@endif
</p>
</div>
<div class="col text-end">
<button class="btn btn-secondary btn-sm"
onclick="location.href='{{ route('view_keuangan_payment') }}'">Kembali</button>
</div>
</div>
</div>
<div class="card-body pb-0">
<div class="row d-flex">
<div class="col-5 mb-3">
<div class="row">
<div class="col-sm-12 mb-3">
<p class="text-danger text-bold mb-0">Penjemputan dan Pengantaran</p>
</div>
<div class="col-sm-12 mb-3">
<label for="" class="form-label">Tanggal Penjemputan</label>
<div class="card bg-light border mb-0">
<div class="card-body">
<p class="mb-0"><span id="view-pickup_date_at">22 Apr
2022</span></p>
</div>
</div>
</div>
<div class="col-sm-12 mb-3">
<label for="" class="form-label">Waktu Penjemputan</label>
<div class="card bg-light border mb-0">
<div class="card-body">
<p class="mb-0"><span id="view-pickup_time_at">19.20</span>
</p>
</div>
</div>
</div>
</div>
</div>
<div class="col-sm-2"></div>
<div class="col-sm-5 mb-3">
<div class="row">
<div class="col-sm-12 col-12 mb-3">
<p class="text-danger text-bold mb-0">Layanan Yang Dipilih</p>
</div>
<div class="col-sm-12 col-6 mb-3">
<label for="" class="form-label">Durasi Pengantaran & Harga Vendor</label>
<div class="card bg-light border mb-0 w-100">
<div class="card-body d-flex justify-content-between">
<p class="mb-0">{{ $order->lead_time }} Hari</p>
<p class="mb-0">
Rp{{ number_format($order->buy_price, 0, ',', '.') }}
</p>
</div>
</div>
</div>
<div class="col-sm-12 col-6 mb-3">
<label for="" class="form-label">Tipe Kendaraan</label>
<div class="card bg-light border mb-0 w-100">
<div class="card-body d-flex justify-content-between">
{{-- <p class="mb-0">{{ $order->prefer_truck_type_name }}</p> --}}
<p class="mb-0">{{ $order->vhc_type_name }}</p>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="row mb-3 d-flex align-items-center">
<div class="col-5 mb-3">
<label for="" class="form-label">Lokasi Penjemputan</label>
<div class="card bg-light border mb-0">
<div class="card-body">
{{-- <p class="text-bold mb-2">Gudang Pluit SiCepat (Jakarta)</p> --}}
<p class="text-bold mb-2">{{ $order->pck_name }}</p>
{{-- <p class="mb-0">Jl. Pluit Karang Karya 2 No.33, RT.7/RW.16, Pejagalan, Kec. Penjaringan, Kota Jkt Utara, Daerah Khusus Ibukota Jakarta 14440</p> --}}
<p class="mb-0">{{ $order->pck_addr }}</p>
</div>
</div>
</div>
<div class="col-2 text-center">
<label for="" class="form-label mb-0 mt-0">&nbsp;</label>
{{-- <p class="mb-0">to</p> --}}
<span class="ion-arrow-right-c text-danger" style="font-size: 15px"></span>
</div>
<div class="col-5 mb-3">
<label for="" class="form-label">Lokasi Pengantaran</label>
<div class="card bg-light border mb-0">
<div class="card-body">
{{-- <p class="text-bold mb-2">Kantor Pusat SiCepat (yogyakarta)</p> --}}
<p class="text-bold mb-2">{{ $order->drop_name }}</p>
{{-- <p class="mb-0">Jl. Prof. Herman Yohanes No.989, Terban, Gondokusuman, Kota Yogyakarta, Daerah Istimewa Yogyakarta 55223, Indonesia</p> --}}
<p class="mb-0">{{ $order->drop_addr }}</p>
</div>
</div>
</div>
</div>
@foreach ($adtPoints as $i => $p)
<div class="row d-flex align-items-center">
<div class="col-12 mb-3">
<p class="text-danger text-bold mb-0">Infomasi Penjemputan dan Pengantaran Lainnya ({{ $i + 2 }})</p>
</div>
<div class="col-5 mb-3">
<div class="row">
<div class="col-12 mb-3">
<label for="" class="form-label">Tanggal Penjemputan</label>
<div class="card bg-light border mb-0">
<div class="card-body">
<p class="mb-0"><span id="view-pickup_date_at{{ $i + 1 }}"></span></p>
</div>
</div>
</div>
<div class="col-12">
<label for="" class="form-label">Waktu Penjemputan</label>
<div class="card bg-light border mb-0">
<div class="card-body">
<p class="mb-0"><span id="view-pickup_time_at{{ $i + 1 }}"></span></p>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="row mb-3 d-flex align-items-center">
<div class="col-5 mb-3">
<label for="" class="form-label">Lokasi Penjemputan</label>
<div class="card bg-light border mb-0">
<div class="card-body">
<p class="text-bold mb-2">{{ $p->pck_name }}</p>
<p class="mb-0">{{ $p->pck_addr }}</p>
</div>
</div>
</div>
<div class="col-2 text-center">
<label for="" class="form-label mb-0 mt-0">&nbsp;</label>
{{-- <p class="mb-0">to</p> --}}
<span class="ion-arrow-right-c text-danger" style="font-size: 15px"></span>
</div>
<div class="col-5 mb-3">
<label for="" class="form-label">Lokasi Pengantaran</label>
<div class="card bg-light border mb-0">
<div class="card-body">
<p class="text-bold mb-2">{{ $p->drop_name }}</p>
<p class="mb-0">{{ $p->drop_addr }}</p>
</div>
</div>
</div>
</div>
@endforeach
<div class="row">
<div class="col-sm-5">
<div class="row d-flex align-items-center mb-3">
<div class="col-12 mb-3">
<p class="text-danger text-bold mb-0">Infomasi Vendor</p>
</div>
<div class="col-sm-12 mb-3">
<label for="" class="form-label">Nama Vendor</label>
<div class="card bg-light border mb-0">
<div class="card-body">
{{-- <p class="mb-0">CV Karya Expedisi Bangsa</p> --}}
@if ($order->vdr_name)
<p class="mb-0">{{ $order->vdr_name }}</p>
@else
<p class="mb-0 text-primary">belum ditugaskan</p>
@endif
</div>
</div>
</div>
<div class="col-sm-12 mb-3">
<label for="" class="form-label">Kendaraan</label>
<div class="card bg-light border mb-0">
<div class="card-body">
@if ($order->vhc_nopol1)
<p class="mb-0">
{{ $order->vhc_nopol1 . ' ' . $order->vhc_nopol2 . ' ' . $order->vhc_nopol3 }}
</p>
@else
<p class="mb-0 text-primary">belum ditugaskan</p>
@endif
</div>
</div>
</div>
<div class="col-sm-12 mb-3">
<label for="" class="form-label">Nama Pengemudi 1</label>
<div class="card bg-light border mb-0">
<div class="card-body">
@if ($order->drv_name)
<p class="mb-0"> {{ $order->drv_name }} </p>
<p class="mb-0">
<a href="tel:0{{ $order->drv_phone_val }}">
<i class="text-dark ion-ios-telephone"></i>&nbsp;
{{ implode(' ', str_split('0' . $order->drv_phone_val, 4)) }}
</a>
</p>
<p class="mb-0">
<a href="https://api.whatsapp.com/send/?phone=62{{ $order->drv_phone_val }}&text=Halo&app_absent=0"
class="" target="_blank"><i
class="text-success ion-social-whatsapp"></i>
{{ implode(' ', str_split('0' . $order->drv_phone_val, 4)) }}</a>
</p>
@else
<p class="mb-0 text-primary">belum ditugaskan</p>
@endif
</div>
</div>
@if ($order->drv_name2)
<label for="" class="form-label">Nama Pengemudi 2</label>
<div class="card bg-light border mb-0">
<div class="card-body">
@if ($order->drv_name2)
<p class="mb-0"> {{ $order->drv_name2 }} </p>
<p class="mb-0">
<a href="tel:0{{ $order->drv_phone2_val }}">
<i class="text-dark ion-ios-telephone"></i>&nbsp;
{{ implode(' ', str_split('0' . $order->drv_phone2_val, 4)) }}
</a>
</p>
<p class="mb-0">
<a href="https://api.whatsapp.com/send/?phone=62{{ $order->drv_phone2_val }}&text=Halo&app_absent=0"
class="" target="_blank"><i
class="text-success ion-social-whatsapp"></i>
{{ implode(' ', str_split('0' . $order->drv_phone2_val, 4)) }}</a>
</p>
@else
<p class="mb-0 text-primary">belum ditugaskan</p>
@endif
</div>
</div>
@endif
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-sm-8">
{{-- old view pembayaran --}}
{{-- <div class="card">
<div class="card-header">
<div class="row d-flex align-items-center">
<div class="col">
<p class="card-title text-bold mb-0">Pembayaran</p>
</div>
</div>
</div>
<div class="card-body pb-0">
<div class="row">
<div class="col-sm-5">
<div class="row d-flex align-items-center mb-3">
<div class="col-12 mb-3">
<p class="text-danger text-bold mb-0">Infomasi Bank</p>
</div>
<div class="col-sm-12 mb-3" id="bankAcc">
<label for="" class="form-label">Akun Bank</label>
<div class="card bg-light border mb-0">
<div class="card-body">
<p class="mb-0">Bank Central Asia (BCA)</p>
<p class="mb-0">5270860721</p>
<p class="mb-0">A/N. Karya Expedisi Bangsa CV</p>
</div>
</div>
</div>
</div>
</div>
<div class="col-sm-2">&nbsp;</div>
<div class="col-sm-5">
<div class="row d-flex align-items-center mb-3">
<div class="col-12 mb-3">
<p class="text-danger text-bold mb-0">Catatan</p>
</div>
<div class="col-sm-12 mb-3" id="bankAcc">
<label for="" class="form-label">Catatan Finance</label>
<textarea name="" id="" cols="30" rows="4" class="form-control radius"></textarea>
<button class="btn btn-sm btn-primary mt-3">Simpan</button>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-12 mb-3">
<p class="text-danger text-bold mb-0">Pembayaran</p>
</div>
<div class="col-sm-5">
<div class="row d-flex align-items-center mb-3">
<div id="term1Wrapper">
<div class="col-sm-12 mb-3">
<label for="" class="form-label">Pembayaran Termin I</label>
<div class="card bg-light border mb-0">
<div class="card-body">
<p class="mb-0">Rp721.000</p>
</div>
</div>
</div>
<div class="col-sm-12 mb-3">
<label for="" class="form-label">Tenggang Waktu Pembayaran</label>
<div class="card bg-light border mb-0">
<div class="card-body">
<div class="d-flex align-items-center justify-content-between">
<p class="mb-0">22 Apr 2022 17:18</p>
</div>
</div>
</div>
</div>
<div class="col-sm-12">
<button class="btn btn-sm btn-primary" data-bs-toggle="modal" data-bs-target="#mdlTerm1">Bayar</button>
</div>
</div>
</div>
</div>
<div class="col-sm-5 offset-sm-2">
<div class="row d-flex align-items-center mb-3">
<div class="col-sm-12 mb-3" id="bankAcc">
<label for="" class="form-label">Pembayaran Termin II</label>
<div class="card bg-light border mb-0">
<div class="card-body">
<p class="mb-0">Rp309.000</p>
</div>
</div>
</div>
<div class="col-sm-12 mb-3">
<label for="" class="form-label">Tenggang Waktu Pembayaran</label>
<div class="card bg-light border mb-0">
<div class="card-body">
<div class="d-flex align-items-center justify-content-between">
<p class="mb-0 text-danger">Menunggu pengantaran selesai.</p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div> --}}
{{-- additional items --}}
<div class="card">
<div class="card-header">
<div class="row d-flex align-items-center">
<div class="col">
<p class="card-title text-bold mb-0">Pembayaran</p>
</div>
<div class="col-auto text-end ps-0">
{{-- <button class="btn btn-sm btn-primary" data-bs-toggle="modal" data-bs-target="#mdlAddItem">Tambah Item</button> --}}
<button id="btnMdlNewAdtItem" class="btn btn-sm btn-primary">Tambah Item</button>
</div>
</div>
</div>
<div class="card-body">
<div class="table-responsive mb-3">
<table class="table table-striped" id="tblAdditional">
<thead>
<tr class="">
<th class="text-center">#</th>
<th class="text-center"></th>
<th class="w-50">Deskripsi</th>
<th class="text-center">Jumlah</th>
<th class="text-center">Tenggat Waktu</th>
<th class="text-nowrap">Bayarkan ke</th>
<th class="">Status</th>
</tr>
</thead>
<tbody>
<tr class="">
<td class="text-center small">1</td>
<td class="text-center" id="tblColAction">
<a href="javascript:void(0)"
class="btn btn-primary btn-sm text-nowrap small w-100"
data-bs-toggle="modal" data-bs-target="#mdlpayAdd">Bayar</a>
</td>
<td class="small">Biaya inap kendaraan</td>
<td class="text-nowrap small text-end">Rp350.000</td>
<td class="text-nowrap small">23 Apr 2022 06:00</td>
<td class="">
<p class="mb-0 text-nowrap small">Bank Central Asia (BCA)</p>
<p class="mb-0 text-nowrap small">5270860721</p>
<p class="mb-0 text-nowrap small">A/N. Karya Expedisi Bangsa CV</p>
</td>
<td class="text-nowrap" id="tblColStatus">
<p class="text-danger mb-0 text-nowrap small">Belum Bayar</p>
</td>
</tr>
<tr class="">
<td class="text-center small">2</td>
<td class="text-center small">
<a href="javascript:void(0)" class="text-nowrap text-success"
data-bs-toggle="modal" data-bs-target="#mdlViewAdd">Lihat Bukti</a>
</td>
<td class="small">Biaya pengemudi tambahan</td>
<td class="text-nowrap small text-end">Rp530.000</td>
<td class="text-nowrap small">23 Apr 2022 04:00</td>
<td class="">
<p class="mb-0 text-nowrap small">Bank Central Asia (BCA)</p>
<p class="mb-0 text-nowrap small">5270860721</p>
<p class="mb-0 text-nowrap small">A/N. Karya Expedisi Bangsa CV</p>
</td>
<td class="text-nowrap">
<p class="mb-0 text-success text-nowrap small">Lunas</p>
<p class="mb-0 text-nowrap small text-muted">23 Apr 2022 06:00</p>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<div class="card">
<div class="card-body">
<div class="row d-flex align-items-center mb-3">
<div class="col-12">
<p class="card-title text-bold mb-0">Arsip Pembayaran</p>
</div>
</div>
<div class="row d-flex align-items-center mb-3">
<div class="col-12">
<div class="table-responsive mb-3">
<table class="table table-striped" id="tblAdditionalArchv">
<thead>
<tr class="">
<th class="text-center">#</th>
<th class="text-center"></th>
<th class="w-50">Deskripsi</th>
<th class="text-center">Jumlah</th>
<th class="text-center">Tenggat Waktu</th>
<th class="text-nowrap">Bayarkan ke</th>
<th class="">Status</th>
</tr>
</thead>
<tbody>
<tr class="">
<td class="text-center small">1</td>
<td class="text-center" id="tblColAction">
<a href="javascript:void(0)"
class="btn btn-primary btn-sm text-nowrap small w-100"
data-bs-toggle="modal" data-bs-target="#mdlpayAdd">Bayar</a>
</td>
<td class="small">Biaya inap kendaraan</td>
<td class="text-nowrap small text-end">Rp350.000</td>
<td class="text-nowrap small">23 Apr 2022 06:00</td>
<td class="">
<p class="mb-0 text-nowrap small">Bank Central Asia (BCA)</p>
<p class="mb-0 text-nowrap small">5270860721</p>
<p class="mb-0 text-nowrap small">A/N. Karya Expedisi Bangsa CV</p>
</td>
<td class="text-nowrap" id="tblColStatus">
<p class="text-danger mb-0 text-nowrap small">Belum Bayar</p>
</td>
</tr>
<tr class="">
<td class="text-center small">2</td>
<td class="text-center small">
<a href="javascript:void(0)" class="text-nowrap text-success"
data-bs-toggle="modal" data-bs-target="#mdlViewAdd">Lihat Bukti</a>
</td>
<td class="small">Biaya pengemudi tambahan</td>
<td class="text-nowrap small text-end">Rp530.000</td>
<td class="text-nowrap small">23 Apr 2022 04:00</td>
<td class="">
<p class="mb-0 text-nowrap small">Bank Central Asia (BCA)</p>
<p class="mb-0 text-nowrap small">5270860721</p>
<p class="mb-0 text-nowrap small">A/N. Karya Expedisi Bangsa CV</p>
</td>
<td class="text-nowrap">
<p class="mb-0 text-success text-nowrap small">Lunas</p>
<p class="mb-0 text-nowrap small text-muted">23 Apr 2022 06:00</p>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<div class="row d-flex align-items-center mb-3">
<div class="col-12 mb-2">
<p class="text-danger text-bold mb-0">Catatan</p>
</div>
<div class="col-sm-12 col-md-12 col-lg-12" id="bankAcc">
<label for="fnnc-note" class="form-label">Catatan Finance</label>
<textarea name="fnnc-note" id="fnnc-note" cols="30" rows="2" class="form-control radius">{{ $order->fnnc_note }}</textarea>
<button id="btnSaveFnncNote" class="btn btn-sm btn-primary mt-3">Simpan</button>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
{{-- Modal Term 1 --}}
<div class="modal" id="mdlTerm1" tabindex="-1" data-bs-backdrop="static" data-bs-keyboard="false"
aria-labelledby="mdlTerm1Label" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="mdlTerm1Label"></h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="mb-3">
<label for="" class="form-label">Unggah Bukti Pembayaran</label>
<input class="form-control" type="file" id="">
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-sm btn-secondary" data-bs-dismiss="modal">Tutup</button>
<button type="button" class="btn btn-sm btn-primary" id="btnSaveTerm1">Simpan</button>
</div>
</div>
</div>
</div>
<div class="modal" id="mdlpayAdd" tabindex="-1" data-bs-backdrop="static" data-bs-keyboard="false"
aria-labelledby="mdlpayAddLabel" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="mdlpayAddLabel"></h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="mb-3">
<label for="up_paid_ref_no">Nomor Referensi <span class="text-danger">*</span></label>
<input type="number" id="up_paid_ref_no" name="up_paid_ref_no" class="form-control">
<small>Bisa didapatkan dari vendor, bisa berupa no invoice atau lainnya terkait nomor pembayaran</small>
</div>
<div class="mb-3">
<label for="up_paid_proof" class="col-form-label">Unggah Bukti Pembayaran <span class="text-danger">*</span></label>
<br>
<img id="inpt-up_paid_proof-img" class="img-fluid d-none" src="#"
alt="inpt-up_paid_proof-img">
<div id="inpt-group_up_paid_proof_spinner" class="d-none">
<div class="spinner-border" role="status">
<span class="visually-hidden">Loading...</span>
</div>
</div>
<div>
<span id="inpt-up_paid_proof-status" class="d-none"></span>
<span id="inpt-up_paid_proof-filesize" class="d-none"></span>
</div>
<div id="inpt-group_rotate_up_paid_proof" class="pt-2 d-flex justify-content-start d-none">
<button type="button" class="btnRotateLeft btn btn-sm btn-outline-primary ml-1"
style="padding:0.25rem 0.5rem;border-radius:0.25rem;"><i
class="icon ion-arrow-return-left"></i></button>
<button type="button" class="btnRotateRight btn btn-sm btn-outline-primary ml-1"
style="padding:0.25rem 0.5rem;border-radius:0.25rem;"><i
class="icon ion-arrow-return-right"></i></button>
</div>
<input type="file" id="inpt-up_paid_proof-file" class="form-control form-control-sm">
<input type="text" id="inpt-up_paid_proof-base64" class="form-control" hidden>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-sm btn-secondary" data-bs-dismiss="modal">Tutup</button>
<button type="button" class="btn btn-sm btn-primary" id="btnPayAdd">Simpan</button>
</div>
</div>
</div>
</div>
<div class="modal" id="mdlViewAdd" tabindex="-1" data-bs-backdrop="static" data-bs-keyboard="false"
aria-labelledby="mdlViewAddLabel" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="mdlViewAddLabel"></h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div id="groupViewPaidRefNo" class="row mb-3">
<div class="col-12">
<label><strong>Nomor Referensi</strong></label>
<p id="view-paid_ref_no" class="mb-0"></p>
</div>
</div>
<div class="row mb-3">
<div class="col-12">
<label><strong id="txtProofOrSubmsn">Bukti Pembayaran</strong></label>
<br>
<img id="imgViewProofImg" src="https://i.pinimg.com/736x/a5/0e/5e/a50e5e839949d2f19271d83c12bd0abc.jpg"
class="img-fluid" alt="" />
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-sm btn-secondary" data-bs-dismiss="modal">Tutup</button>
</div>
</div>
</div>
</div>
{{-- ./Modal Term 1 --}}
{{-- Modal Item --}}
<div class="modal" id="mdlAddItem" tabindex="-1" data-bs-backdrop="static" data-bs-keyboard="false" aria-labelledby="mdlAddItemLabel" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered modal-dialog-scrollable">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="mdlAddItemLabel"></h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div id="addSlcItemWrapper" class="mb-3">
<label for="slcItem" class="form-label w-100">Pilih Item <span class="text-danger">*</span></label>
<select name="slcItem" id="slcItem" class="select2 form-control" style="width: 100% !important">
<option value="" selected disabled>Belum ada item yang dipilih</option>
@foreach ($items as $item)
<option value="{{ $item->id }}" data-name="{{ $item->name }}" data-type="{{ $item->type }}" data-price="{{ $item->price }}" data-is_adm_price="{{ $item->is_adm_price }}">{{ $item->name }}</option>
@endforeach
<option value="new"><span class="text-danger">Tambah item baru</span></option>
</select>
<small id="slcItemPrice"></small>
</div>
<div id="addNewItemWrapper" class="d-none">
<div class="mb-3">
<label for="add-item_name" class="form-label">Nama Item <span class="text-danger">*</span></label>
<input type="text" name="add-item_name" id="add-item_name" class="form-control">
</div>
<div class="mb-3">
<label for="add-item_type" class="form-label">Satuan <span class="text-danger">*</span></label>
<select name="add-item_type" id="add-item_type" class="select2 form-control" style="width: 100% !important">
<option value="" selected disabled>Belum ada satuan yang dipilih</option>
@foreach ($unitTypes as $type)
<option value="{{ $type->id }}">{{ $type->name }}</option>
@endforeach
</select>
</div>
<div>
<label for="add-item_price" class="form-label">Harga Satuan <span class="text-danger">*</span></label>
<input type="text" name="add-item_price" id="add-item_price" class="form-control">
</div>
<div class="mb-3">
<div class="form-check">
<input class="form-check-input" name="add-item_isAdmPrice" type="checkbox" value="yes" id="add-item_isAdmPrice">
<label class="form-check-label text-danger" for="add-item_isAdmPrice">
Biaya admin bank ?
</label>
</div>
</div>
</div>
<div class="mb-3">
<label for="add-item_qty" class="form-label">Jumlah Item <span class="text-danger">*</span></label>
<input type="number" name="add-item_qty" id="add-item_qty" class="form-control">
</div>
<div id="groupFillDdln" class="d-none">
<div class="mb-3">
<label for="ddln_pay_date" class="form-label">Tenggat Tanggal Pembayaran <span class="text-danger">*</span></label>
<input type="date" name="ddln_pay_date" id="ddln_pay_date" class="form-control">
</div>
<div class="mb-3">
<label for="add-ddln_pay_time" class="form-label text-nowrap">Tenggat Waktu Pembayaran <span class="text-danger">*</span></label>
<div class="row">
<div class="col-sm-6 col-md-4 col-lg-3" style="padding:0 0 0 0.75rem;">
<select name="ddln_pay_time_hour" id="ddln_pay_time_hour" class="form-control">
<option value="" selected disabled hidden>--</option>
@for ($i=0; $i<24; $i++)
<option value="{{ str_pad($i, 2, '0', STR_PAD_LEFT) }}">{{ str_pad($i, 2, '0', STR_PAD_LEFT) }}</option>
@endfor
</select>
</div>
<div class="col-sm-6 col-md-4 col-lg-3" style="padding:0 0 0 0.75rem;">
<select name="ddln_pay_time_minute" id="ddln_pay_time_minute" class="form-control">
<option value="" selected disabled hidden>--</option>
@for ($i=0; $i<60; $i++)
<option value="{{ str_pad($i, 2, '0', STR_PAD_LEFT) }}">{{ str_pad($i, 2, '0', STR_PAD_LEFT) }}</option>
@endfor
</select>
</div>
</div>
</div>
</div>
<div id="groupSubmissionProof">
<div class="mb-3">
<label for="submission_proof" class="col-form-label">Unggah Bukti Pengajuan <span class="text-danger">*</span></label>
<br>
<img id="inpt-submission_proof-img" class="img-fluid d-none" src="#"
alt="inpt-submission_proof-img">
<div id="inpt-group_submission_proof_spinner" class="d-none">
<div class="spinner-border" role="status">
<span class="visually-hidden">Loading...</span>
</div>
</div>
<div>
<span id="inpt-submission_proof-status" class="d-none"></span>
<span id="inpt-submission_proof-filesize" class="d-none"></span>
</div>
<div id="inpt-group_rotate_submission_proof" class="pt-2 d-flex justify-content-start d-none">
<button type="button" class="btnRotateLeft btn btn-sm btn-outline-primary ml-1"
style="padding:0.25rem 0.5rem;border-radius:0.25rem;"><i
class="icon ion-arrow-return-left"></i></button>
<button type="button" class="btnRotateRight btn btn-sm btn-outline-primary ml-1"
style="padding:0.25rem 0.5rem;border-radius:0.25rem;"><i
class="icon ion-arrow-return-right"></i></button>
</div>
<input type="file" id="inpt-submission_proof-file" class="form-control form-control-sm">
<input type="text" id="inpt-submission_proof-base64" class="form-control" hidden>
</div>
</div>
<div id="groupPayPurpose" class="mb-3">
<label for="slcPayPurpose" class="form-label">Tujuan Pembayaran</label>
<select name="slcPayPurpose" id="slcPayPurpose" class="select2 form-control" style="width: 100% !important">
<option value="none" disabled>Tidak ada</option>
<option value="fill" selected>Isi data penerima</option>
</select>
</div>
<div id="fillReceiverWrapper">
<div class="mb-3">
<label for="bank" class="form-label">Bank <span class="text-danger">*</span></label>
<select id="bank" name="bank" class="form-control select2" style="width:100%;">
<option value="" selected disabled>Pilih</option>
@foreach ($banks as $bank)
<option value="{{ $bank->bank_code }}" data-id="{{ $bank->id }}" data-code="{{ $bank->bank_code }}" data-short="{{ $bank->bank_short_name }}" data-name="{{ $bank->bank_name }}">{{ $bank->bank_short_name . ' (' . $bank->bank_code . ')' }}</option>
@endforeach
</select>
</div>
<div class="mb-3">
<label for="bank_acc_number" class="form-label">Nomor Rekening <span class="text-danger">*</span></label>
<input type="number" class="form-control form-control-sm" name="bank_acc_number"
id="bank_acc_number">
</div>
<div class="mb-3">
<label for="bank_acc_name" class="form-label">Pemilik Rekening <span class="text-danger">*</span></label>
<input type="text" class="form-control form-control-sm" name="bank_acc_name"
id="bank_acc_name">
</div>
</div>
<div class="mb-3">
<div class="form-group">
<label for="is_paid" class="form-label">Status Pembayaran</label>
<div class="form-check form-switch">
<input class="form-check-input" type="checkbox" id="is_paid">
<label class="form-check-label" for="is_paid"><span class="text-dark"
id="txtIsPaid">Belum dibayar</span></label>
</div>
</div>
<div id="groupIsPaid" class="form-group d-none">
<div class="mb-3">
<label for="inpt-paid_proof_ref_no">Nomor Referensi <span class="text-danger">*</span></label>
<input type="number" id="inpt-paid_proof_ref_no" name="inpt-paid_proof_ref_no" class="form-control">
<small>Bisa didapatkan dari vendor, bisa berupa no invoice atau lainnya terkait nomor pembayaran</small>
</div>
<div class="mb-3">
<label for="is_paid_proof" class="col-form-label">Unggah Bukti Pembayaran <span class="text-danger">*</span></label>
<br>
<img id="inpt-is_paid_proof-img" class="img-fluid d-none" src="#"
alt="inpt-is_paid_proof-img">
<div id="inpt-group_is_paid_proof_spinner" class="d-none">
<div class="spinner-border" role="status">
<span class="visually-hidden">Loading...</span>
</div>
</div>
<div>
<span id="inpt-is_paid_proof-status" class="d-none"></span>
<span id="inpt-is_paid_proof-filesize" class="d-none"></span>
</div>
<div id="inpt-group_rotate_is_paid_proof" class="pt-2 d-flex justify-content-start d-none">
<button type="button" class="btnRotateLeft btn btn-sm btn-outline-primary ml-1"
style="padding:0.25rem 0.5rem;border-radius:0.25rem;"><i
class="icon ion-arrow-return-left"></i></button>
<button type="button" class="btnRotateRight btn btn-sm btn-outline-primary ml-1"
style="padding:0.25rem 0.5rem;border-radius:0.25rem;"><i
class="icon ion-arrow-return-right"></i></button>
</div>
<input type="file" id="inpt-is_paid_proof-file" class="form-control form-control-sm">
<input type="text" id="inpt-is_paid_proof-base64" class="form-control" hidden>
</div>
{{-- <div class="mb-3">
<label for="is_paid_date" class="form-label">Tanggal Dibayar <span class="text-danger">*</span></label>
<input type="date" name="is_paid_date" id="is_paid_date" class="form-control">
</div>
<div class="mb-3">
<label for="is_paid_time" class="form-label text-nowrap">Waktu Dibayar <span class="text-danger">*</span></label>
<div class="row">
<div class="col-sm-6 col-md-4 col-lg-3" style="padding:0 0 0 0.75rem;">
<select name="is_paid_time_hour" id="is_paid_time_hour" class="form-control">
<option value="" selected disabled hidden>--</option>
@for ($i=0; $i<24; $i++)
<option value="{{ str_pad($i, 2, '0', STR_PAD_LEFT) }}">{{ str_pad($i, 2, '0', STR_PAD_LEFT) }}</option>
@endfor
</select>
</div>
<div class="col-sm-6 col-md-4 col-lg-3" style="padding:0 0 0 0.75rem;">
<select name="is_paid_time_minute" id="is_paid_time_minute" class="form-control">
<option value="" selected disabled hidden>--</option>
@for ($i=0; $i<60; $i++)
<option value="{{ str_pad($i, 2, '0', STR_PAD_LEFT) }}">{{ str_pad($i, 2, '0', STR_PAD_LEFT) }}</option>
@endfor
</select>
</div>
</div>
</div> --}}
</div>
</div>
<div class="mb-3">
<div class="form-check">
<input class="form-check-input" name="invcToClient" type="checkbox" value="yes" id="invcToClient">
<label class="form-check-label text-danger" for="invcToClient">
Ditagihkan ke client ?
</label>
</div>
</div>
<div id="groupPriceToClient" class="d-none">
<div class="mb-3">
<label for="add-invc_item_price" class="form-label">Harga Satuan yang Ditagihkan <span class="text-danger">*</span></label>
<input type="number" class="form-control form-control-sm" name="add-invc_item_price"
id="add-invc_item_price">
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" id="btnDelItem_updt" class="btn btn-sm btn-warning">Hapus ?</button>
<button type="button" class="btn btn-sm btn-secondary" data-bs-dismiss="modal">Tutup</button>
<button type="button" class="btn btn-sm btn-primary" id="btnSubmitAddItem">Simpan</button>
</div>
</div>
</div>
</div>
<div class="modal fade" data-bs-backdrop="static" data-bs-keyboard="false" id="mdlDelItem" aria-labelledby="mdlDelItemLabel" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered modal-sm">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="mdlDelItemLabel">Hapus Item</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="d-flex justify-content-center">
<p class="mb-0">
Apakah kamu yakin menghapus item ini
<a href="#" class="text-danger">
<span id="del-name"></span>
</a> ?
</p>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-sm btn-danger" data-bs-dismiss="modal">Tutup</button>
<button id="btnSubmitDelItem" type="button" class="btn btn-sm btn-secondary">Ya, hapus</button>
</div>
</div>
</div>
</div>
<div class="modal fade" data-bs-backdrop="static" data-bs-keyboard="false" id="mdlRjctItem" aria-labelledby="mdlRjctItemLabel" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered modal-sm">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="mdlRjctItemLabel">Tolak Item</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="d-flex justify-content-center">
<div class="row">
<div class="col-12">
<p class="mb-2">
Apakah kamu yakin menolak item ini
<a href="#" class="text-danger">
<span id="reject-name"></span>
</a> ?
</p>
<p class="mb-0">
Diajukan oleh
<a href="#" class="text-danger">
<span id="reject-crt_name"></span>
</a>
</p>
<p class="mb-0">
Pada tanggal
<a href="#" class="text-danger">
<span id="reject-crt_at"></span>
</a>
</p>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-sm btn-danger" data-bs-dismiss="modal">Tutup</button>
<button id="btnSubmitRejectItem" type="button" class="btn btn-sm btn-secondary">Ya, tolak</button>
</div>
</div>
</div>
</div>
<div class="modal fade" data-bs-backdrop="static" data-bs-keyboard="false" id="mdlMrgItem" aria-labelledby="mdlMrgItemLabel" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered modal-sm">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="mdlMrgItemLabel">Merge Item</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="d-flex justify-content-center flex-column">
<div class="row mb-3">
<div class="col-12">
<p class="mb-2">
Apakah kamu yakin melakukan merge pada item ini
<a href="#" class="text-danger">
<span id="mrg-name"></span>
</a> ?
</p>
<p class="mb-0">
Status pembayaran
<div id="mrg-stts_pay"></div>
</p>
</div>
</div>
<div class="row">
<div class="col-12">
<div class="mb-3">
<label for="mrg-sel_trx_code" class="form-label">Merge ke transaksi <span class="text-danger">*</span></label>
<select name="mrg-sel_trx_code" id="mrg-sel_trx_code" class="select2 form-control" style="width: 100% !important">
<option value="" selected disabled>Belum ada transaksi yang dipilih</option>
@foreach ($availOrdToMerge as $row)
<option value="{{ $row->code }}" data-id="{{ $row->id }}" data-code="{{ $row->code }}">{{ $row->code }}</option>
@endforeach
</select>
<small><span class="text-danger">Proses merge</span> adalah dimana item pada pembayaran ini akan dimunculkan pada transaksi tersebut.
Namun <span class="text-danger">setelah proses merge</span> jika ada perubahan pada salah satu item, tidak akan mempengaruhi item lainnya.
Melainkan <span class="text-danger">menjadi item yang independen</span> dengan catatan code dari item sebelumnya</small>
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-sm btn-danger" data-bs-dismiss="modal">Tutup</button>
<button id="btnSubmitMergeItem" type="button" class="btn btn-sm btn-warning">Ya, merge</button>
</div>
</div>
</div>
</div>
{{-- ./Modal Item --}}
@endsection
@section('customcss')
@endsection
@section('customjs')
<script src="{{ asset('assets/js/load-image.all.min.js') }}"></script>
<script>
// $('#tblAdditional').DataTable({
// "columnDefs": [{
// "targets": 1,
// "orderable": false
// }]
// });
$('#btnSaveTerm1').on('click', function() {
let a = `
<div class="col-sm-12 mb-3">
<div class="d-flex align-items-center justify-content-between">
<label for="" class="form-label">Pembayaran Termin I</label>
<label for="" class="form-label text-success"><span class="ion-checkmark-circled me-2"></span>Lunas</label>
</div>
<div class="card bg-light border mb-0">
<div class="card-body">
<img src="https://i.pinimg.com/736x/a5/0e/5e/a50e5e839949d2f19271d83c12bd0abc.jpg" class="img-fluid mb-3" alt="" />
<p class="mb-0">Dibayar pada 22 Apr 2022 17:18</p>
</div>
</div>
</div>
`
$('#term1Wrapper').html(a)
$('#mdlTerm1').modal('hide');
})
// $('#btnPayAdd').on('click', function() {
// let a = `
// <a href="javascript:void(0)" class="text-nowrap text-success" data-bs-toggle="modal" data-bs-target="#mdlViewAdd">Lihat Bukti</a>
// `
// let b = `
// <p class="mb-0 text-success text-nowrap small">Lunas</p>
// <p class="mb-0 text-nowrap small text-muted">23 Apr 2022 06:00</p>
// `
// $('#tblColAction').html(a)
// $('#tblColStatus').html(b)
// $('#mdlpayAdd').modal('hide');
// })
</script>
<script>
'use strict'
const State = {
ord_id: "{{ $order->ord_id }}",
set_pck_at: "{{ $order->set_pck_at }}",
fix_price_at: "{{ $order->fix_price_at }}",
order_place_at: "{{ $order->crt }}",
is_paid: {
not: "{{ App\Models\OrdersAItems::IS_PAID_NO }}",
paid: "{{ App\Models\OrdersAItems::IS_PAID_YES }}",
},
ddln_pay_type: {
time: "{{ App\Models\OrdersAItems::DDLN_PAY_TYPE_TIME }}",
ord_finish: "{{ App\Models\OrdersAItems::DDLN_PAY_TYPE_ORD_FINISH }}",
},
invc_to_client: {
not: "{{ App\Models\OrdersAItems::INVC_TO_CLIENT_NO }}",
yes: "{{ App\Models\OrdersAItems::INVC_TO_CLIENT_YES }}",
},
calc_to_vdr: {
not: "{{ App\Models\OrdersAItems::CALC_TO_VDR_NO }}",
yes: "{{ App\Models\OrdersAItems::CALC_TO_VDR_YES }}",
},
is_adm_price: {
no: "{{ App\Models\AItems::IS_ADM_PRICE_NO }}",
yes: "{{ App\Models\AItems::IS_ADM_PRICE_YES }}",
},
crt_type: {
system: "{{ App\Models\OrdersAItems::CRT_TYPE_SYSTEM }}",
admin: "{{ App\Models\OrdersAItems::CRT_TYPE_ADMIN }}",
finance: "{{ App\Models\OrdersAItems::CRT_TYPE_FINANCE }}",
},
flow_type: {
payment: "{{ App\Models\OrdersAItems::FLOW_TYPE_PAYMENT }}",
billing: "{{ App\Models\OrdersAItems::FLOW_TYPE_BILLING }}",
hybrid: "{{ App\Models\OrdersAItems::FLOW_TYPE_HYBRID }}",
},
cash_type: {
out: "{{ App\Models\OrdersAItems::TYPE_CASH_OUT }}",
in: "{{ App\Models\OrdersAItems::TYPE_CASH_IN }}",
hybrid: "{{ App\Models\OrdersAItems::TYPE_CASH_HYBRID }}",
},
a_item_type: {
main: "{{ App\Models\OrdersAItems::A_TYPE_PRIMARY }}",
second: "{{ App\Models\OrdersAItems::A_TYPE_SECONDARY }}",
},
is_aprv: {
no: "{{ App\Models\OrdersAItems::IS_APRV_NO }}",
yes: "{{ App\Models\OrdersAItems::IS_APRV_YES }}",
},
is_merge: {
no: "{{ App\Models\OrdersAItems::IS_MERGE_NO }}",
yes: "{{ App\Models\OrdersAItems::IS_MERGE_YES }}",
},
adtPoints: JSON.parse('{!! $adtPointsJson !!}'),
storage_lara: "{{ asset('storage') }}/",
file_jimp_worker: "{{ asset('assets/js/worker/jimp.js') }}",
};
const Wrapper = {
activate: function() {
Wrapper.event();
OrdView.activate();
ATable.activate();
OrdAItem.activate();
FileUploadSingle.activate('submission_proof');
FileUploadSingle.activate('is_paid_proof');
OrdPaidItem.activate();
FileUploadSingle.activate('up_paid_proof');
OrdNoteFnnc.activate();
ArcvTable.activate();
},
event: function() {
$('#view-pickup_at').text(moment.unix(State.set_pck_at).format('DD MMM YYYY HH:mm:ss'));
$('#view-pickup_date_at').text(moment.unix(State.set_pck_at).format('DD MMM YYYY'));
$('#view-pickup_time_at').text(moment.unix(State.set_pck_at).format('HH:mm:ss'));
$('#btnMdlNewAdtItem').on('click', function() {
$('#inpt-is_paid_proof-base64').val('');
$('#inpt-is_paid_proof-file').val('');
$('#inpt-group_rotate_is_paid_proof').addClass('d-none');
$('#inpt-is_paid_proof-img').addClass('d-none');
$('#inpt-submission_proof-base64').val('');
$('#inpt-submission_proof-file').val('');
$('#inpt-group_rotate_submission_proof').addClass('d-none');
$('#inpt-submission_proof-img').addClass('d-none');
OrdAItem.toggleSlcItem('show');
OrdAItem.toggleInvcToClient('undisabled');
OrdAItem.toggleDelItem('hide');
$('#mdlAddItem').modal('show');
});
$('#mrg-sel_trx_code').select2({
dropdownParent: $('#mdlMrgItem'),
});
},
};
const OrdView = {
activate: function() {
OrdView.event();
OrdView.initDateAdtPoints();
},
event: function() {},
reqShowAItem: function(params) {
return new Promise((resolve, reject) => {
$.ajax({
url: "{{ route('api_finance_show_a_item', '') }}/" + params.ord_a_item_id,
method: 'GET',
crossDomain: true,
processData: true,
headers: {
'x-api-key': Helper.getCookie('_trtk'),
},
data: params,
success: (data, textStatus, jqXHR) => {
if (data.meta.type != 'success') {
resolve({
type: 'fail'
});
Helper.toast('Warning', 'just now', data.meta.message);
return false;
}
resolve({
type: 'success',
data: data.data
});
},
error: (jqXHR, textStatus, error) => {
if (jqXHR.status >= 500) {
Helper.toast('Error', 'just now', 'please try again');
} else {
Helper.toast('Error', 'just now', jqXHR.responseJSON.meta
.message);
}
resolve({
type: 'error'
});
}
})
});
},
viewProofPayment: function(data) {
if (data.img_proof_payment) {
let proof = JSON.parse(data.img_proof_payment);
if (proof.length > 0) $('#imgViewProofImg').attr('src', State.storage_lara + proof[0]);
}
$('#txtProofOrSubmsn').text('Bukti pembayaran');
$('#groupViewPaidRefNo').removeClass('d-none');
$('#view-paid_ref_no').text(data.paid_ref_no);
$('#mdlViewAdd').data('ord_a_item_id', data.ord_a_item_id);
$('#mdlViewAdd').modal('show');
},
viewProofSubmission: function(data) {
if (data.img_proof_submission) {
let proof = JSON.parse(data.img_proof_submission);
if (proof.length > 0) $('#imgViewProofImg').attr('src', State.storage_lara + proof[0]);
}
$('#txtProofOrSubmsn').text('Bukti pengajuan');
$('#groupViewPaidRefNo').addClass('d-none');
$('#mdlViewAdd').data('ord_a_item_id', data.ord_a_item_id);
$('#mdlViewAdd').modal('show');
},
initDateAdtPoints: function() {
for (let iAdtPoint in State.adtPoints) {
iAdtPoint = Number(iAdtPoint);
$(`#view-pickup_date_at${iAdtPoint+1}`).text(moment.unix(State.adtPoints[iAdtPoint].set_pck_at).format('DD MMM YYYY'));
$(`#view-pickup_time_at${iAdtPoint+1}`).text(moment.unix(State.adtPoints[iAdtPoint].set_pck_at).format('HH:mm:ss'));
}
},
};
const OrdPaidItem = {
activate: function() {
OrdPaidItem.event();
},
event: function() {
$(document).on('click', '.upPaidProof', async function(e) {
let ord_a_item_id = $(e.target).closest('tr').find('td[data-ord_a_item_id]').data('ord_a_item_id');
let resp = await OrdView.reqShowAItem({
ord_a_item_id
});
if (resp.type != 'success') {
Helper.toast('Item tidak ditemukan', 'just now', 'please try again');
return false;
}
$('#up_paid_ref_no').val('');
$('#inpt-up_paid_proof-base64').val('');
$('#inpt-up_paid_proof-file').val('');
$('#inpt-group_rotate_up_paid_proof').addClass('d-none');
$('#inpt-up_paid_proof-img').addClass('d-none');
OrdPaidItem.passDataToView(resp.data);
});
$('#btnPayAdd').on('click', function(e) {
e.preventDefault();
let data = OrdPaidItem.getData();
let isValid = OrdPaidItem.checkData(data, true);
if (!isValid) return false;
OrdPaidItem.submitData(data);
});
},
getData: function() {
const data = {};
data.ord_a_item_id = $('#mdlpayAdd').data('ord_a_item_id');
data.up_paid_ref_no = $('#up_paid_ref_no').val();
data.up_paid_proof_base64 = [];
let up_paid_proof_base64 = $('#inpt-up_paid_proof-base64').val();
if (up_paid_proof_base64.indexOf('data:image') > -1) {
data.up_paid_proof_base64.push(up_paid_proof_base64.replace(/^data:image\/(png|jpg|jpeg);base64,/, ''));
}
return data;
},
checkData: function(data, isAlert = false) {
if (data.up_paid_ref_no.length < 1) {
if (isAlert) Helper.toast('Warning', 'just now', 'Nomor referensi wajib diisi');
return false;
}
if (data.up_paid_proof_base64.length < 1) {
if (isAlert) Helper.toast('Warning', 'just now', 'Bukti pembayaran wajib diisi');
return false;
}
return true;
},
passDataToView: function(data) {
$('#mdlpayAdd').data('ord_a_item_id', data.ord_a_item_id);
$('#mdlpayAdd').modal('show');
},
submitData: async function(data) {
return new Promise((resolve, reject) => {
if (typeof $('#btnPayAdd').attr('disabed') != 'undefined') {
resolve({
type: 'fail'
});
return false;
}
$('#btnPayAdd').attr('disabed', true);
$.ajax({
url: "{{ route('api_finance_pay_a_items', '') }}/" + data.ord_a_item_id,
method: 'PUT',
crossDomain: true,
processData: true,
headers: {
'x-api-key': Helper.getCookie('_trtk'),
'x-csrf-token': $('meta[name="csrf-token"]').attr('content'),
},
data: data,
success: (data, textStatus, jqXHR) => {
$('#btnPayAdd').removeAttr('disabed');
if (data.meta.type != 'success') {
resolve({
type: 'fail'
});
Helper.toast('Warning', 'just now', data.meta.message);
return false;
}
Helper.toast('Success', 'just now', 'success pay item');
$('#mdlpayAdd').modal('hide');
ATable.reload();
resolve({
type: 'success'
});
},
error: (jqXHR, textStatus, error) => {
$('#btnPayAdd').removeAttr('disabed');
if (jqXHR.status >= 500) {
Helper.toast('Error', 'just now', 'Please try again');
} else {
Helper.toast('Error', 'just now', jqXHR.responseJSON.meta
.message);
}
resolve({
type: 'error'
});
}
})
})
},
}
/**
* Event Toggle
* Jika new item => show input add item
* Jika new item is adm price => hide tenggat pembayaran, bukti pengajuan, tujuan pembayaran
* Jika select existing item => clear input add item
* Jika existing item is adm price => hide tenggat pembayaran, bukti pengajuan, tujuan pembayaran
* Jika is adm price (dari manapun) yes => tujuan pembayaran none
* Jika tujuan pembayaran fill => show input penerima
* Jika tujuan pembayaran none => hide and clear input penerima
* Jika status pembayaran belum bayar => hide unggah bukti pembayaran
* Jika status pembayaran lunas => show unggah bukti pembayaran
*/
const OrdAItem = {
activate: function() {
OrdAItem.event();
},
event: function() {
// init select2
$('#slcItem').select2({
dropdownParent: $('#mdlAddItem'),
});
$('#add-item_type').select2({
dropdownParent: $('#mdlAddItem'),
});
$('#slcPayPurpose').select2({
dropdownParent: $('#mdlAddItem'),
});
$('#bank').select2({
dropdownParent: $('#mdlAddItem'),
});
// event select
$('#slcItem').on('change', function() {
let slc = $('#slcItem option:selected');
if (slc.val() === 'new') {
$('#addNewItemWrapper').removeClass('d-none');
OrdAItem.toggleAddItemIsAdmPrice('unchecked');
OrdAItem.toggleGroupPayPurpose('show');
$('#slcItemPrice').text('');
} else {
$('#addNewItemWrapper').addClass('d-none');
OrdAItem.clearInputAddNewItem();
if (slc.data('is_adm_price') == State.is_adm_price.yes) {
OrdAItem.toggleGroupFillDdln('hide');
OrdAItem.toggleGroupPayPurpose('hide');
OrdAItem.toggleGroupSubmissionProof('hide');
} else {
OrdAItem.toggleGroupFillDdln('show');
OrdAItem.toggleGroupPayPurpose('show');
OrdAItem.toggleGroupSubmissionProof('show');
}
$('#slcItemPrice').text('Harga: Rp' + (new Intl.NumberFormat('id-ID')).format(slc.data('price')));
}
});
$('#slcPayPurpose').on('change', function() {
let slc = $('#slcPayPurpose option:selected');
if (slc.val() === 'fill') {
$('#fillReceiverWrapper').removeClass('d-none');
} else {
$('#fillReceiverWrapper').addClass('d-none');
OrdAItem.clearInputBank();
}
});
// event switch
$('#is_paid').bind('change', function() {
if ($(this).is(':checked')) {
$('#groupIsPaid').removeClass('d-none');
$('#txtIsPaid').html('Lunas');
} else {
$('#groupIsPaid').addClass('d-none');
$('#txtIsPaid').html('Belum dibayar');
OrdAItem.clearInputIsPaid();
}
});
// event checklist
$('#add-item_isAdmPrice').on('change', function() {
$('#invcToClient').prop('checked', false).trigger('change');
if($('#add-item_isAdmPrice').prop('checked')) {
OrdAItem.toggleGroupPayPurpose('hide');
OrdAItem.toggleGroupSubmissionProof('hide');
OrdAItem.toggleGroupFillDdln('hide');
} else {
OrdAItem.toggleGroupPayPurpose('show');
OrdAItem.toggleGroupSubmissionProof('show');
OrdAItem.toggleGroupFillDdln('show');
}
});
$('#invcToClient').on('change', function() {
$('#add-invc_item_price').val('');
if ($('#invcToClient').prop('checked')) {
$('#groupPriceToClient').removeClass('d-none');
} else {
$('#groupPriceToClient').addClass('d-none');
}
});
// input
$('#add-item_price').on('keyup', function() {
let price = $('#add-item_price').val().split('.').join('');
$('#add-item_price').val((new Intl.NumberFormat('id-ID')).format(price));
});
$('#add-invc_item_price').on('keyup', function() {
let price = $('#add-invc_item_price').val().split('.').join('');
$('#add-invc_item_price').val((new Intl.NumberFormat('id-ID')).format(price));
});
// min date is today
let TimeISOString = moment().toISOString().split('T');
let time = TimeISOString[1].split('.')[0].split(':');
// $('#ddln_pay_date').attr('min', TimeISOString[0]); // bypass_date
TimeISOString = moment().toISOString().split('T');
time = TimeISOString[1].split('.')[0].split(':');
// $('#is_paid_date').attr('min', TimeISOString[0]); // bypass_date
// submit
$('#btnSubmitAddItem').on('click', function(e) {
e.preventDefault();
let data = OrdAItem.getData();
let isValid = OrdAItem.checkData(data, true);
if (!isValid) return false;
OrdAItem.submitData(data);
});
$('#btnSubmitDelItem').on('click', function(e) {
e.preventDefault();
let data = {};
data.is_del = 2;
data.ord_a_item_id = $('#mdlDelItem').data('ord_a_item_id');
OrdAItem.submitDelData(data);
});
$('#btnSubmitRejectItem').on('click', function(e) {
e.preventDefault();
let data = {};
data.is_rjct = 2;
data.ord_a_item_id = $('#mdlRjctItem').data('ord_a_item_id');
OrdAItem.submitRejectData(data);
});
$('#btnSubmitMergeItem').on('click', function(e) {
e.preventDefault();
let data = {};
data.ord_a_item_id = $('#mdlMrgItem').data('ord_a_item_id');
const selTrx = $('#mrg-sel_trx_code :selected');
data.mrg_to_ord_id = selTrx.data('id');
data.mrg_to_ord_code = selTrx.data('code');
if (typeof data.mrg_to_ord_code === 'undefined' || data.mrg_to_ord_code == '') {
Helper.toast('Warning', 'just now', 'transaksi belum dipilih');
return false;
}
OrdAItem.submitMergeData(data);
});
},
getData: function() {
const data = {};
let slcType = $('#slcItem option:selected');
if (slcType.val() === 'new') {
data.a_id = '00';
data.a_name = $('#add-item_name').val();
data.a_type = $('#add-item_type').val();
data.a_price = $('#add-item_price').val().split('.').join('');
if($('#add-item_isAdmPrice').prop('checked')) {
data.is_adm_price = State.is_adm_price.yes
} else {
data.is_adm_price = State.is_adm_price.no
}
} else if (slcType.val() === '') {
} else {
data.a_id = slcType.val(); // id
data.a_name = slcType.data('name');
data.a_type = slcType.data('type');
data.a_price = slcType.data('price');
data.is_adm_price = slcType.data('is_adm_price');
}
data.a_qty = $('#add-item_qty').val();
if (data.is_adm_price != State.is_adm_price.yes) {
data.ddln_pay_date = $('#ddln_pay_date').val().trim();
data.ddln_pay_time_hour = $('#ddln_pay_time_hour').val()?.trim();
data.ddln_pay_time_minute = $('#ddln_pay_time_minute').val()?.trim();
data.ddln_pay_time = `${data.ddln_pay_time_hour}:${data.ddln_pay_time_minute}`;
data.ddln_pay_at = moment(data.ddln_pay_date + ' ' + data.ddln_pay_time).unix();
data.submission_proof_base64 = [];
let submission_proof_base64 = $('#inpt-submission_proof-base64').val();
if (submission_proof_base64.indexOf('data:image') > -1) {
data.submission_proof_base64.push(submission_proof_base64.replace(/^data:image\/(png|jpg|jpeg);base64,/, ''));
}
}
data.slc_pay_purpose = $('#slcPayPurpose').val();
if (data.slc_pay_purpose === 'fill') {
let selectedBank = $('#bank :selected');
if (selectedBank && selectedBank.val() != '') {
data.bank_id = selectedBank.data('id');
data.bank_code = selectedBank.data('code');
data.bank_short = selectedBank.data('short');
data.bank_name = selectedBank.data('name');
}
data.bank_acc_number = $('#bank_acc_number').val();
data.bank_acc_name = $('#bank_acc_name').val();
}
let is_paid = $('#is_paid').prop('checked');
data.is_paid = State.is_paid.not;
if (is_paid) {
data.is_paid = State.is_paid.paid;
data.paid_proof_ref_no = $('#inpt-paid_proof_ref_no').val();
data.is_paid_proof_base64 = [];
let is_paid_proof_base64 = $('#inpt-is_paid_proof-base64').val();
if (is_paid_proof_base64.indexOf('data:image') > -1) {
data.is_paid_proof_base64.push(is_paid_proof_base64.replace(/^data:image\/(png|jpg|jpeg);base64,/, ''));
}
// data.is_paid_date = $('#is_paid_date').val().trim();
// data.is_paid_time_hour = $('#is_paid_time_hour').val()?.trim();
// data.is_paid_time_minute = $('#is_paid_time_minute').val()?.trim();
// data.is_paid_time = `${data.is_paid_time_hour}:${data.is_paid_time_minute}`;
// data.is_paid_at = moment(data.is_paid_date + ' ' + data.is_paid_time).unix();
}
let is_invc_to_client = $('#invcToClient').prop('checked');
data.is_invc_to_client = State.invc_to_client.not;
data.flow_type = State.flow_type.payment;
data.cash_type = State.cash_type.out;
if (is_invc_to_client) {
data.is_invc_to_client = State.invc_to_client.yes;
data.cash_type = State.cash_type.hybrid;
data.flow_type = State.flow_type.hybrid;
data.a_invc_price = $('#add-invc_item_price').val().split('.').join('');
}
data.ord_id = State.ord_id;
data.ddln_pay_type = State.ddln_pay_type.time;
data.is_calc_to_vdr = State.calc_to_vdr.yes;
data.crt_type = State.crt_type.finance;
return data;
},
checkData: function(data, isAlert = false) {
if (typeof data.a_id == 'undefined') {
if (isAlert) Helper.toast('Warning', 'just now', 'Item wajib diisi');
return false;
}
if (data.a_name == '' || data.a_name == null) {
if (isAlert) Helper.toast('Warning', 'just now', 'Item nama wajib diisi');
return false;
}
if (data.a_type == '' || data.a_type == null) {
if (isAlert) Helper.toast('Warning', 'just now', 'Item satuan wajib diisi');
return false;
}
if (data.a_price == '' || data.a_price == null) {
if (isAlert) Helper.toast('Warning', 'just now', 'Item harga wajib diisi');
return false;
}
if (typeof data.a_qty == 'undefined' || Number(data.a_qty) < 1) {
if (isAlert) Helper.toast('Warning', 'just now', 'Jumlah wajib diisi');
return false;
}
if (data.is_adm_price != State.is_adm_price.yes) {
if (data.ddln_pay_at < 1 || isNaN(data.ddln_pay_at)) {
if (isAlert) Helper.toast('Warning', 'just now', 'Tenggat pembayaran tidak valid');
return false;
}
// start bypass_date
// if (data.ddln_pay_at < moment().unix()) {
// if (isAlert) Helper.toast('Warning', 'just now', 'Tenggat pembayaran tidak bisa kurang dari saat ini');
// return false;
// }
// end bypass_date
// if (data.ddln_pay_at < moment().add(5, 'minutes').unix()) {
// if (isAlert) Helper.toast('Warning', 'just now', 'Minimal tenggat pembayaran 5 menit dari sekarang');
// return false;
// }
if (data.submission_proof_base64.length < 1) {
if (isAlert) Helper.toast('Warning', 'just now', 'Bukti pengajuan wajib diisi');
return false;
}
if (data.slc_pay_purpose === 'fill') {
if (!data.bank_id) {
if (isAlert) Helper.toast('Warning', 'just now', 'Bank wajib dipilih');
return false;
}
if (data.bank_acc_number == '') {
if (isAlert) Helper.toast('Warning', 'just now', 'Nomor rekening wajib diisi');
return false;
}
if (data.bank_acc_name == '') {
if (isAlert) Helper.toast('Warning', 'just now', 'Pemilik rekening wajib diisi');
return false;
}
}
}
if (data.is_invc_to_client == State.invc_to_client.yes) {
if (data.a_invc_price < 0) {
if (isAlert) Helper.toast('Warning', 'just now', 'Harga yang ditagihkan ke client wajib diisi');
return false;
}
}
if (data.is_paid === State.is_paid.paid) {
if (data.paid_proof_ref_no.length < 2) {
if (isAlert) Helper.toast('Warning', 'just now', 'Nomor referensi wajib diisi');
return false;
}
if (data.is_paid_proof_base64.length < 1) {
if (isAlert) Helper.toast('Warning', 'just now', 'Bukti pembayaran wajib diisi');
return false;
}
}
return true;
},
submitData: async function(data) {
return new Promise((resolve, reject) => {
if (typeof $('#btnSubmitAddItem').attr('disabed') != 'undefined') {
resolve({
type: 'fail'
});
return false;
}
$('#btnSubmitAddItem').attr('disabed', true);
$.ajax({
url: "{{ route('api_finance_add_a_items') }}",
method: 'POST',
crossDomain: true,
processData: true,
headers: {
'x-api-key': Helper.getCookie('_trtk'),
'x-csrf-token': $('meta[name="csrf-token"]').attr('content'),
},
data: data,
success: (data, textStatus, jqXHR) => {
$('#btnSubmitAddItem').removeAttr('disabed');
if (data.meta.type != 'success') {
resolve({
type: 'fail'
});
Helper.toast('Warning', 'just now', data.meta.message);
return false;
}
Helper.toast('Success', 'just now', 'success add item');
$('#mdlAddItem').modal('hide');
// ATable.reload();
window.location.href = window.location.href;
resolve({
type: 'success'
});
},
error: (jqXHR, textStatus, error) => {
$('#btnSubmitAddItem').removeAttr('disabed');
if (jqXHR.status >= 500) {
Helper.toast('Error', 'just now', 'Please try again');
} else {
Helper.toast('Error', 'just now', jqXHR.responseJSON.meta
.message);
}
resolve({
type: 'error'
});
}
})
})
},
clearInputIsPaid: function() {
$('#is_paid_proof').val('');
$('#is_paid_date').val('');
$('#is_paid_time_hour').val('').trigger('change');
$('#is_paid_time_minute').val('').trigger('change');
},
toggleGroupPayPurpose: function(toggle = 'show') {
if (toggle === 'show') {
$('#groupPayPurpose').removeClass('d-none');
} else {
$('#groupPayPurpose').addClass('d-none');
$('#slcPayPurpose').val('none').trigger('change');
}
},
toggleGroupSubmissionProof: function(toggle = 'show') {
if (toggle === 'show') {
$('#groupSubmissionProof').removeClass('d-none');
} else {
$('#groupSubmissionProof').addClass('d-none');
}
},
clearInputBank: function() {
$('#bank').val('').trigger('change');
$('#bank_acc_name').val('');
$('#bank_acc_number').val('');
},
clearAllInput: function() {
$('#slcItem').val('').trigger('change');
OrdAItem.clearInputBank();
$('#add-item_name').val('');
$('#add-item_type').val('').trigger('change');
$('#add-item_price').val('');
$('#add-item_qty').val('');
$('#ddln_pay_date').val('');
$('#ddln_pay_time_hour').val('');
$('#ddln_pay_time_minute').val('');
$('#inpt-submission_proof-base64').val('');
$('#inpt-submission_proof-file').val('');
$('#inpt-group_rotate_submission_proof').addClass('d-none');
$('#inpt-submission_proof-img').addClass('d-none');
$('#invcToClient').prop('checked', false).trigger('change');
$('#add-invc_item_price').val('');
},
toggleAddItemIsAdmPrice: function(toggle = 'checked') {
if (toggle === 'checked') {
$('#add-item_isAdmPrice').prop('checked', true).trigger('change');
} else {
$('#add-item_isAdmPrice').prop('checked', false).trigger('change');
}
},
clearInputAddNewItem: function() {
$('#add-item_name').val('');
$('#add-item_type').val('').trigger('change');
$('#add-item_price').val('');
$('#add-item_qty').val('');
OrdAItem.toggleAddItemIsAdmPrice('unchecked');
},
toggleGroupFillDdln: function(toggle = 'show') {
if (toggle === 'show') {
$('#groupFillDdln').removeClass('d-none');
} else {
$('#groupFillDdln').addClass('d-none');
}
},
toggleSlcItem: function(toggle = 'show') {
if (toggle === 'show') {
$('#addSlcItemWrapper').removeAttr('disabed');
$('#addSlcItemWrapper').removeClass('d-none');
} else {
$('#addSlcItemWrapper').attr('disabed', true);
$('#addSlcItemWrapper').addClass('d-none');
}
},
toggleInvcToClient: function(toggle = 'disabled') {
if (toggle === 'disabled') {
$('#invcToClient').attr('disabled', true);
$('#add-invc_item_price').attr('disabled', true);
} else {
$('#invcToClient').removeAttr('disabled');
$('#add-invc_item_price').removeAttr('disabled');
}
},
toggleDelItem: function(toggle = 'show') {
if (toggle === 'show') {
$('#btnDelItem_updt').removeClass('d-none');
} else {
$('#btnDelItem_updt').addClass('d-none');
}
},
submitDelData: async function(data) {
return new Promise((resolve, reject) => {
if (typeof $('#btnSubmitDelItem').attr('disabed') != 'undefined') {
resolve({
type: 'fail'
});
return false;
}
$('#btnSubmitDelItem').attr('disabed', true);
$.ajax({
url: "{{ route('api_finance_del_a_items', '') }}/" + data.ord_a_item_id,
method: 'DELETE',
crossDomain: true,
processData: true,
headers: {
'x-api-key': Helper.getCookie('_trtk'),
'x-csrf-token': $('meta[name="csrf-token"]').attr('content'),
},
data: data,
success: (data, textStatus, jqXHR) => {
$('#btnSubmitDelItem').removeAttr('disabed');
if (data.meta.type != 'success') {
resolve({
type: 'fail'
});
Helper.toast('Warning', 'just now', data.meta.message);
return false;
}
Helper.toast('Success', 'just now', 'sukses hapus item');
$('#mdlDelItem').modal('hide');
$('#mdlAddItem').modal('hide');
ATable.reload();
resolve({
type: 'success'
});
},
error: (jqXHR, textStatus, error) => {
$('#btnSubmitDelItem').removeAttr('disabed');
if (jqXHR.status >= 500) {
Helper.toast('Error', 'just now', 'Please try again');
} else {
Helper.toast('Error', 'just now', jqXHR.responseJSON.meta
.message);
}
resolve({
type: 'error'
});
}
})
})
},
submitRejectData: async function(data) {
return new Promise((resolve, reject) => {
if (typeof $('#btnSubmitRejectItem').attr('disabed') != 'undefined') {
resolve({
type: 'fail'
});
return false;
}
$('#btnSubmitRejectItem').attr('disabed', true);
$.ajax({
url: "{{ route('api_finance_rjct_a_items', '') }}/" + data.ord_a_item_id,
method: 'PUT',
crossDomain: true,
processData: true,
headers: {
'x-api-key': Helper.getCookie('_trtk'),
'x-csrf-token': $('meta[name="csrf-token"]').attr('content'),
},
data: data,
success: (data, textStatus, jqXHR) => {
$('#btnSubmitRejectItem').removeAttr('disabed');
if (data.meta.type != 'success') {
resolve({
type: 'fail'
});
Helper.toast('Warning', 'just now', data.meta.message);
return false;
}
Helper.toast('Success', 'just now', 'sukses tolak item');
$('#mdlDelItem').modal('hide');
$('#mdlAddItem').modal('hide');
$('#mdlRjctItem').modal('hide');
ATable.reload();
ArcvTable.reload();
resolve({
type: 'success'
});
},
error: (jqXHR, textStatus, error) => {
$('#btnSubmitRejectItem').removeAttr('disabed');
if (jqXHR.status >= 500) {
Helper.toast('Error', 'just now', 'Please try again');
} else {
Helper.toast('Error', 'just now', jqXHR.responseJSON.meta
.message);
}
resolve({
type: 'error'
});
}
})
})
},
submitMergeData: async function(data) {
return new Promise((resolve, reject) => {
if (typeof $('#btnSubmitMergeItem').attr('disabed') != 'undefined') {
resolve({
type: 'fail'
});
return false;
}
$('#btnSubmitMergeItem').attr('disabed', true);
$.ajax({
url: "{{ route('api_finance_merger_a_items', '') }}/" + data.ord_a_item_id,
method: 'POST',
crossDomain: true,
processData: true,
headers: {
'x-api-key': Helper.getCookie('_trtk'),
'x-csrf-token': $('meta[name="csrf-token"]').attr('content'),
},
data: data,
success: (data, textStatus, jqXHR) => {
$('#btnSubmitMergeItem').removeAttr('disabed');
if (data.meta.type != 'success') {
resolve({
type: 'fail'
});
Helper.toast('Warning', 'just now', data.meta.message);
return false;
}
Helper.toast('Success', 'just now', 'sukses merge item');
$('#mdlMrgItem').modal('hide');
ATable.reload();
$('#mrg-sel_trx_code').val('').trigger('change');
resolve({
type: 'success'
});
},
error: (jqXHR, textStatus, error) => {
$('#btnSubmitMergeItem').removeAttr('disabed');
if (jqXHR.status >= 500) {
Helper.toast('Error', 'just now', 'Please try again');
} else {
Helper.toast('Error', 'just now', jqXHR.responseJSON.meta
.message);
}
resolve({
type: 'error'
});
}
})
})
},
};
const ATable = {
activate: function() {
ATable.reload();
ATable.event();
},
event: function() {
$(document).on('click', '.viewPaidProof', async function(e) {
let ord_a_item_id = $(e.target).closest('tr').find('td[data-ord_a_item_id]').data('ord_a_item_id');
let resp = await OrdView.reqShowAItem({
ord_a_item_id
});
if (resp.type != 'success') {
Helper.toast('Item tidak ditemukan', 'just now', 'please try again');
return false;
}
OrdView.viewProofPayment(resp.data);
});
$(document).on('click', '.viewSubmissionProof', async function(e) {
let ord_a_item_id = $(e.target).closest('tr').find('td[data-ord_a_item_id]').data('ord_a_item_id');
let resp = await OrdView.reqShowAItem({
ord_a_item_id
});
if (resp.type != 'success') {
Helper.toast('Item tidak ditemukan', 'just now', 'please try again');
return false;
}
OrdView.viewProofSubmission(resp.data);
});
$(document).on('click', '.btnDelItem', async function(e) {
let ord_a_item_id = $(e.target).closest('tr').find('td[data-ord_a_item_id]').data('ord_a_item_id');
let resp = await OrdView.reqShowAItem({
ord_a_item_id
});
if (resp.type != 'success') {
Helper.toast('Item tidak ditemukan', 'just now', 'please try again');
return false;
}
$('#del-name').text(resp.data.desc);
$('#mdlDelItem').data('ord_a_item_id', resp.data.ord_a_item_id);
$('#mdlDelItem').modal('show');
});
$(document).on('click', '.btnRejectItem', async function(e) {
let ord_a_item_id = $(e.target).closest('tr').find('td[data-ord_a_item_id]').data('ord_a_item_id');
let resp = await OrdView.reqShowAItem({
ord_a_item_id
});
if (resp.type != 'success') {
Helper.toast('Item tidak ditemukan', 'just now', 'please try again');
return false;
}
$('#reject-name').text(resp.data.desc);
$('#reject-crt_name').text(resp.data.ucrt_name);
$('#reject-crt_at').text(moment.unix(resp.data.crt).format('DD MMM YYYY HH:mm:ss'));
$('#mdlRjctItem').data('ord_a_item_id', resp.data.ord_a_item_id);
$('#mdlRjctItem').modal('show');
});
$(document).on('click', '.btnMergeItem', async function(e) {
let ord_a_item_id = $(e.target).closest('tr').find('td[data-ord_a_item_id]').data('ord_a_item_id');
let resp = await OrdView.reqShowAItem({
ord_a_item_id
});
if (resp.type != 'success') {
Helper.toast('Item tidak ditemukan', 'just now', 'please try again');
return false;
}
$('#mrg-name').text(resp.data.desc);
if (resp.data.is_paid == State.is_paid.paid) {
$('#mrg-stts_pay').html(`
<p class="mb-0 text-success text-nowrap small">Lunas</p>
<p class="mb-0 text-nowrap small text-muted">${moment.unix(resp.data.paid_at).format('DD MMM YYYY HH:mm')}</p>
`);
} else {
$('#mrg-stts_pay').html(`
<p class="mb-0 text-danger text-nowrap small">Belum Bayar</p>
`);
}
$('#mdlMrgItem').data('ord_a_item_id', resp.data.ord_a_item_id);
$('#mdlMrgItem').modal('show');
});
},
reload: function() {
// $('#tblAdditional').DataTable();
// if (Driver.Table.firstInitDataTable == 1) { loadTableSkeletonLoading() } else { Driver.Table.firstInitDataTable = 1; }
$('#tblAdditional').DataTable({
processing: true,
serverSide: false,
bLengthChange: true,
deferRender: true,
destroy: true,
ajax: {
url: "{{ route('api_finance_list_adt_items_payments') }}?ord_id=" + State.ord_id + "&is_aprv=" + State.is_aprv.yes,
type: 'GET',
complete: function(jqXHR, textStatus, c) {
// const data = jqXHR.responseJSON;
// removeTableSkeletonLoading()
},
},
deferRender: true,
columns: [{
data: 'DT_RowIndex',
className: 'text-end',
visible: true,
orderable: true,
searchable: true,
},
{
data: 'action',
className: 'text-center',
visible: true,
orderable: true,
searchable: true,
render: function(data, type, row, meta) {
let action = '';
if (State.is_paid.paid == row.is_paid) {
action += `
<a href="javascript:void(0)" class="text-nowrap text-success viewPaidProof">Lihat Bukti<br>Pembayaran</a>
`;
} else {
if (State.ddln_pay_type.ord_finish == row.ddln_pay_type) {
if (row.drop_chk_at != 0) {
action += `
<a href="javascript:void(0)" class="btn btn-primary btn-sm text-nowrap small w-100 upPaidProof">Bayar</a>
`;
let img_proof_submission = null;
try {
img_proof_submission = JSON.parse(row.img_proof_submission);
} catch (e) {}
if (row.img_proof_submission) {
if (img_proof_submission.length > 0) {
action += `
<a href="javascript:void(0)" class="text-nowrap text-danger viewSubmissionProof">Lihat Bukti<br>Pengajuan</a>
`;
}
}
} else {
// action += '<p class="mb-0 text-danger small">Menunggu pengantaran selesai</p>';
action += '-';
}
} else {
action += `
<a href="javascript:void(0)" class="btn btn-primary btn-sm text-nowrap small w-100 upPaidProof">Bayar</a>
`;
let img_proof_submission = null;
try {
img_proof_submission = JSON.parse(row.img_proof_submission);
} catch (e) {}
if (row.img_proof_submission) {
if (img_proof_submission.length > 0) {
action += `
<a href="javascript:void(0)" class="text-nowrap text-danger viewSubmissionProof">Lihat Bukti<br>Pengajuan</a>
`;
}
}
}
if (State.a_item_type.main != row.a_item_type) {
if (State.is_paid.paid != row.is_bill_paid) {
if (State.crt_type.admin == row.a_item_crt_type) {
action += `
<br><br>
<a href="javascript:void(0)" class="btn btn-secondary btn-sm text-nowrap small w-100 btnRejectItem">Tolak</a>
`;
} else if (State.crt_type.finance == row.a_item_crt_type) {
action += `
<br><br>
<a href="javascript:void(0)" class="btn btn-secondary btn-sm text-nowrap small w-100 btnDelItem">Hapus</a>
`;
}
}
}
}
// if (State.a_item_type.second == row.a_item_type) {
// if (row.is_merge_to == State.is_merge.yes || row.is_merge_from == State.is_merge.yes) {} else {
// action += `
// <br>
// <a href="javascript:void(0)" class="btn btn-warning btn-sm text-nowrap small mt-2 w-100 btnMergeItem">Merge</a>
// `;
// }
// }
return action;
}
},
{
data: 'desc',
className: 'text-start text-nowrap',
visible: true,
orderable: true,
searchable: true,
createdCell: function(td, cellData, rowData, row, col) {
$(td).attr('data-ord_a_item_id', rowData.ord_a_item_id);
$(td).attr('data-ord_id', rowData.ord_id);
$(td).attr('data-ord_code', rowData.ord_code);
$(td).attr('data-v_termin_id', rowData.v_termin_id);
},
render: function(data, type, row, meta) {
let text = data;
// if (row.is_merge_to == State.is_merge.yes) {
// text += '<div class="mb-2"></div><small class="mt-2">Telah di merge pada<br>' + moment.unix(row.merge_to_at).format('DD MMM YYYY HH:mm:ss') + '<br>Ke trx <span class="text-danger">' + row.merge_to_ord_code + '</span></small>';
// } else if (row.is_merge_from == State.is_merge.yes) {
// text += '<div class="mb-2"></div><small class="mt-2">Telah di merge pada<br>' + moment.unix(row.merge_from_at).format('DD MMM YYYY HH:mm:ss') + '<br>Dari trx <span class="text-danger">' + row.merge_from_ord_code + '</span></small>';
// }
if (row.invc_to_client == State.invc_to_client.yes) {
if (State.is_paid.paid == row.is_bill_paid) {
text += '<div class="mb-2"></div><small class="mt-2">Tagihan<br>ke client lunas pada<br>' + moment.unix(row.paid_bill_at).format('DD MMM YYYY HH:mm:ss') + '</small>';
} else {
text += '<div class="mb-2"></div><small class="mt-2">Akan ditagihkan<br>ke client</small>';
}
}
return text;
},
},
{
data: 'amt_total_flat',
className: 'text-start text-nowrap',
visible: true,
orderable: true,
searchable: true,
render: function(data, type, row, meta) {
let action = 'Rp' + (new Intl.NumberFormat('id-ID')).format(data);
return action;
},
},
{
data: 'ddln_pay_at',
className: 'text-start',
visible: true,
orderable: true,
searchable: true,
render: function(data, type, row, meta) {
if (State.ddln_pay_type.time == row.ddln_pay_type) {
if (data == 0) {
return '-';
}
return moment.unix(data).format('DD MMM YYYY HH:mm');
} else if (State.ddln_pay_type.ord_finish == row.ddln_pay_type) {
if (row.drop_chk_at != 0) {
return `
<p class="mb-0 text-success small">Pengantaran selesai</p>
<p class="mb-0 text-nowrap small text-muted">${moment.unix(row.drop_chk_at).format('DD MMM YYYY HH:mm')}</p>
`;
} else {
return '<p class="mb-0 text-danger small">Menunggu pengantaran selesai</p>';
}
} else {
return '<p class="mb-0 text-success text-nowrap small">Kapan saja</p>';
}
},
},
{
data: 'bank_acc_name',
className: 'text-end text-nowrap',
visible: true,
orderable: true,
searchable: true,
render: function(data, type, row, meta) {
if (row.bank_acc_name) {
return `
<p class="mb-0 text-nowrap small">${row.bank_name} (${row.bank_short_name})</p>
<p class="mb-0 text-nowrap small">${row.bank_acc_number}</p>
<p class="mb-0 text-nowrap small">A/N. ${row.bank_acc_name}</p>
`;
}
return '-';
},
},
{
data: 'is_paid',
className: 'text-end text-nowrap',
visible: true,
orderable: true,
searchable: true,
render: function(data, type, row, meta) {
if (State.is_paid.paid == data) {
return `
<p class="mb-0 text-success text-nowrap small">Lunas</p>
<p class="mb-0 text-nowrap small text-muted">${moment.unix(row.paid_at).format('DD MMM YYYY HH:mm')}</p>
`;
} else {
return `
<p class="mb-0 text-danger text-nowrap small">Belum Bayar</p>
`;
}
},
},
],
});
},
};
const ArcvTable = {
activate: function() {
ArcvTable.reload();
},
reload: function() {
// $('#tblAdditionalArchv').DataTable();
// if (Driver.Table.firstInitDataTable == 1) { loadTableSkeletonLoading() } else { Driver.Table.firstInitDataTable = 1; }
$('#tblAdditionalArchv').DataTable({
processing: true,
serverSide: false,
bLengthChange: true,
deferRender: true,
destroy: true,
ajax: {
url: "{{ route('api_finance_list_adt_items_payments') }}?ord_id=" + State.ord_id + "&is_aprv=" + State.is_aprv.no,
type: 'GET',
complete: function(jqXHR, textStatus, c) {
// const data = jqXHR.responseJSON;
// removeTableSkeletonLoading()
},
},
deferRender: true,
columns: [{
data: 'DT_RowIndex',
className: 'text-end',
visible: true,
orderable: true,
searchable: true,
},
{
data: 'action',
className: 'text-center',
visible: true,
orderable: true,
searchable: true,
render: function(data, type, row, meta) {
let action = '';
if (State.is_aprv.yes != row.is_aprv) {
action += `
<p class="mb-0 text-muted small">Pengajuan ditolak oleh ${row.urjct_name} pada tanggal ${moment.unix(row.rjct_at).format('DD MMM YYYY HH:mm:ss')}</p>
`;
return action;
}
return action;
}
},
{
data: 'desc',
className: 'text-start text-nowrap',
visible: true,
orderable: true,
searchable: true,
createdCell: function(td, cellData, rowData, row, col) {
$(td).attr('data-ord_a_item_id', rowData.ord_a_item_id);
$(td).attr('data-ord_id', rowData.ord_id);
$(td).attr('data-ord_code', rowData.ord_code);
$(td).attr('data-v_termin_id', rowData.v_termin_id);
},
render: function(data, type, row, meta) {
let action = data;
if (row.invc_to_client == State.invc_to_client.yes) {
if (State.is_paid.paid == row.is_bill_paid) {
action += '<div class="mb-2"></div><small class="mt-2">Tagihan<br>ke client lunas pada<br>' + moment.unix(row.paid_bill_at).format('DD MMM YYYY HH:mm:ss') + '</small>';
} else {
action += '<div class="mb-2"></div><small class="mt-2">Akan ditagihkan<br>ke client</small>';
}
}
return action;
},
},
{
data: 'amt_total_flat',
className: 'text-start text-nowrap',
visible: true,
orderable: true,
searchable: true,
render: function(data, type, row, meta) {
let action = 'Rp' + (new Intl.NumberFormat('id-ID')).format(data);
return action;
},
},
{
data: 'ddln_pay_at',
className: 'text-start',
visible: true,
orderable: true,
searchable: true,
render: function(data, type, row, meta) {
if (State.ddln_pay_type.time == row.ddln_pay_type) {
if (data == 0) {
return '-';
}
return moment.unix(data).format('DD MMM YYYY HH:mm');
} else if (State.ddln_pay_type.ord_finish == row.ddln_pay_type) {
if (row.drop_chk_at != 0) {
return `
<p class="mb-0 text-success small">Pengantaran selesai</p>
<p class="mb-0 text-nowrap small text-muted">${moment.unix(row.drop_chk_at).format('DD MMM YYYY HH:mm')}</p>
`;
} else {
return '<p class="mb-0 text-danger small">Menunggu pengantaran selesai</p>';
}
} else {
return '<p class="mb-0 text-success text-nowrap small">Kapan saja</p>';
}
},
},
{
data: 'bank_acc_name',
className: 'text-end text-nowrap',
visible: true,
orderable: true,
searchable: true,
render: function(data, type, row, meta) {
if (row.bank_acc_name) {
return `
<p class="mb-0 text-nowrap small">${row.bank_name} (${row.bank_short_name})</p>
<p class="mb-0 text-nowrap small">${row.bank_acc_number}</p>
<p class="mb-0 text-nowrap small">A/N. ${row.bank_acc_name}</p>
`;
}
return '-';
},
},
{
data: 'is_paid',
className: 'text-end text-nowrap',
visible: true,
orderable: true,
searchable: true,
render: function(data, type, row, meta) {
if (State.is_paid.paid == data) {
return `
<p class="mb-0 text-success text-nowrap small">Lunas</p>
<p class="mb-0 text-nowrap small text-muted">${moment.unix(row.paid_at).format('DD MMM YYYY HH:mm')}</p>
`;
} else {
return `
<p class="mb-0 text-danger text-nowrap small">Belum Bayar</p>
`;
}
},
},
],
});
},
};
const OrdNoteFnnc = {
activate: function() {
OrdNoteFnnc.event();
},
event: function() {
$('#btnSaveFnncNote').on('click', function(e) {
e.preventDefault();
let data = OrdNoteFnnc.getData();
let isValid = OrdNoteFnnc.checkData(data, true);
if (!isValid) return false;
OrdNoteFnnc.submitData(data);
});
},
getData: function() {
const data = {};
data.fnnc_note = $('#fnnc-note').val();
return data;
},
checkData: function(data, isAlert = false) {
if (data.fnnc_note.length < 2) {
if (isAlert) Helper.toast('Warning', 'just now', 'Catatan minimal 2 karakter');
return false;
}
return true;
},
submitData: async function(data) {
return new Promise((resolve, reject) => {
if (typeof $('#btnSaveFnncNote').attr('disabed') != 'undefined') {
resolve({
type: 'fail'
});
return false;
}
$('#btnSaveFnncNote').attr('disabed', true);
$.ajax({
url: "{{ route('api_finance_save_note', '') }}/" + State.ord_id,
method: 'PUT',
crossDomain: true,
processData: true,
headers: {
'x-api-key': Helper.getCookie('_trtk'),
'x-csrf-token': $('meta[name="csrf-token"]').attr('content'),
},
data: data,
success: (data, textStatus, jqXHR) => {
$('#btnSaveFnncNote').removeAttr('disabed');
if (data.meta.type != 'success') {
resolve({
type: 'fail'
});
Helper.toast('Warning', 'just now', data.meta.message);
return false;
}
Helper.toast('Success', 'just now', 'success menyimpan catatan');
$('#mdlpayAdd').modal('hide');
ATable.reload();
resolve({
type: 'success'
});
},
error: (jqXHR, textStatus, error) => {
$('#btnSaveFnncNote').removeAttr('disabed');
if (jqXHR.status >= 500) {
Helper.toast('Error', 'just now', 'Please try again');
} else {
Helper.toast('Error', 'just now', jqXHR.responseJSON.meta
.message);
}
resolve({
type: 'error'
});
}
})
})
},
}
// Compress image
async function convertImgHtmlToFile(imgHtml, imgWidth, imgHeight, mimeType, fileName) {
return new Promise((resolve, reject) => {
try {
let canvas = document.createElement("canvas")
// Draw image to canvas.
canvas.width = imgWidth
canvas.height = imgHeight
let ctx = canvas.getContext('2d')
ctx.drawImage(imgHtml, 0, 0)
// Convert canvas to ImageState.
let imageData = ctx.getImageData(0, 0, imgWidth, imgHeight)
// console.log(imageState.data.byteLength + ' bytes.')
// Convert canvas to Blob
canvas.toBlob((blob) => {
let newReader = new FileReader();
newReader.addEventListener('loadend', () => {
// Convert canvas to ArrayBuffer
let arrayBuffer = newReader.result
// console.log(arrayBuffer.byteLength + ' bytes.')
// Convert ArrayBuffer to Blob
// let blob = new Blob([arrayBuffer], {type: mimeType})
// Dispay Blob content in an Image.
// console.log(URL.createObjectURL(blob))
// Generate as file
let newFile = new File([arrayBuffer], fileName, {
type: mimeType,
lastModified: new Date(),
size: arrayBuffer.byteLength,
})
resolve(newFile)
});
newReader.readAsArrayBuffer(blob);
}, mimeType);
} catch (e) {
reject(e.message)
}
});
}
const JimpWorkerSingle = {
worker_up_paid_proof: null,
// add item
worker_is_paid_proof: null,
worker_submission_proof: null,
activate: function(x) {
let linkWorker = State.file_jimp_worker
this.setWorker(linkWorker, x, function(res) {
if (res.stts) {
let pureDataURL = res.data.replace(/^data:image\/(png|jpg|jpeg);base64,/, '')
let fileSize = window.atob(pureDataURL).length // in Byte
// (fileSize/1000) + ' Kb'
$('#inpt-group_' + x + '_spinner').addClass('d-none');
$('#inpt-' + x + '-status').html('Compressed')
$('#inpt-' + x + '-filesize').html('<samp>(' + fileSize / 1000 + ' Kb)</samp>')
$('#inpt-' + x + '-img').removeClass('d-none')
$('#inpt-' + x + '-img').attr('src', res.data)
$('#inpt-' + x + '-base64').val(res.data)
} else {
console.error(res.data)
}
$('.page-loader-wrapper').fadeOut()
});
},
runWorker: function(dataURL, x) {
$('#inpt-group_' + x + '_spinner').removeClass('d-none');
this['worker_' + x].postMessage(dataURL)
},
setWorker: function(urlFileJs, x, cbFinish) {
let worker = new Worker(urlFileJs);
worker.onmessage = function(e) {
// e = {status:(true,false), data:(dataURL)}
// append a new img element using the base 64 image
// let img = document.createElement('img');
// img.setAttribute('src', e.data);
// document.body.appendChild(img);
cbFinish(e.data);
};
this['worker_' + x] = worker
}
}
const FileUploadSingle = {
activate: function(x) {
this.initReader(x)
JimpWorkerSingle.activate(x)
this.event(x)
RotateImgSingle.activate(x)
},
event: function(x) {
$('#inpt-' + x + '-choose').on('click', function(e) {
$('#inpt-' + x + '-file').trigger('click')
})
// $('#inpt-' + x + '-file').on('click', function() {
// $('#inpt-' + x + '-file').val();
// })
},
initReader: function(x) {
let reader = new FileReader();
reader = this.setEventFile(reader, x);
$('#inpt-' + x + '-file').on('change', async function(e) {
try {
if (browserBack()) return false;
let file = e.target.files[0];
let type = file.type.split('/');
if (type[1] == 'jpeg' || type[1] == 'png' || type[1] == 'jpg') {
$('.page-loader-wrapper').fadeIn()
// fix auto rotate when select file
let newImg = await loadImage(file, {
orientation: true
})
let newFile = await convertImgHtmlToFile(newImg.image, newImg
.originalWidth, newImg.originalHeight, file.type, file
.name)
FileUploadSingle.readFile(reader, newFile);
$('#inpt-' + x + '-filesize').html('')
$('#inpt-' + x + '-status').html('Loading on compressing...')
// $('#inpt-' + x + '-img').attr('src', '')
$('#inpt-' + x + '-base64').val('')
} else {
Helper.toast('Validasi', 'just-now', 'Gambar tidak valid');
}
} catch (e) {
console.error(e.message)
}
})
},
setEventFile: function(reader, x) {
reader.onload = function(e) {
let data = e.target.result;
$('#inpt-' + x + '-img-old').attr('src',
data) // preview, -old mungkin kedepannya bakal diganti jadi -new
// $('#inpt-'+x+'-img-base64').val(data) // real-data
console.log('Compressing ' + x);
JimpWorkerSingle.runWorker(data, x)
RotateImgSingle.toggleBtnRotate(x, 'show');
};
reader.onerror = function(err) {
$('.page-loader-wrapper').fadeOut()
$('#' + x).attr('hidden', true)
console.error(err);
};
reader.onabort = function(err) {
console.log(err);
}
return reader;
},
readFile: function(reader, file) {
// reader.readAsArrayBuffer(file);
reader.readAsDataURL(file);
},
}
const RotateImgSingle = {
activate: function(id) {
this.event(id)
},
event: function(id) {
$('#inpt-group_rotate_' + id).on('click', '.btnRotateRight', function(e) {
$('#inpt-' + id + '-img').addClass('d-none')
RotateImgSingle.rotateBase64Image($('#inpt-' + id + '-base64').val(), 90).then(
function(base64) {
RotateImgSingle.updateImg(id, base64)
})
})
$('#inpt-group_rotate_' + id).on('click', '.btnRotateLeft', function(e) {
$('#inpt-' + id + '-img').addClass('d-none')
RotateImgSingle.rotateBase64Image($('#inpt-' + id + '-base64').val(), -90).then(
function(base64) {
RotateImgSingle.updateImg(id, base64)
})
})
},
rotateBase64Image: function(base64data, degrees) {
return new Promise((resolve, reject) => {
try {
let x = 0,
y = 0,
w = 0,
h = 0;
let canvas = document.createElement("canvas");
let image = document.createElement("img"); // new Image();
image.src = base64data; // image.src = 'data:image/jpg;base64,' + base64data;
image.onload = function() {
// current image size for processing rotate
w = image.width;
h = image.height;
let angle = degrees * Math.PI / 180.0; // angle/rads
let ctx = canvas.getContext("2d");
// new image size for after cropped
let c = Math.cos(angle);
let s = Math.sin(angle);
if (s < 0) {
s = -s;
}
if (c < 0) {
c = -c;
}
let rw = h * s + w * c;
let rh = h * c + w * s;
// set canvas size
canvas.width = rw;
canvas.height = rh;
// save the unrotated context of the canvas so we can restore it later
// the alternative is to untranslate & unrotate after drawing
ctx.save();
// draw the rect in the center of the newly sized canvas
ctx.clearRect(0, 0, canvas.width, canvas.height);
// move to the center of the canvas
// ctx.translate(x+w/2, y+h/2); // ctx.translate(x, h);
// move to the upper left corner when rotating in 90deg increments
ctx.translate(Math.abs(w / 2 * Math.cos(angle) + h / 2 * Math.sin(angle)),
Math.abs(h / 2 * Math.cos(angle) + w / 2 * Math.sin(angle)));
// rotate the canvas to the specified degrees
ctx.rotate(angle); // ctx.rotate(180 * Math.PI / 180);
// move to the center of the canvas (origin)
ctx.translate(-x - w / 2, -y - h / 2);
// since the context is rotated, the image will be rotated also
ctx.drawImage(image, 0, 0, w, h);
// were done with the rotating so restore the unrotated context
ctx.restore();
// convert to base64
resolve(canvas.toDataURL('image/jpeg', 1.0));
};
} catch (err) {
reject(err);
}
});
},
updateImg: function(id, base64) {
// update data
let pureDataURL = base64.replace(/^data:image\/(png|jpg|jpeg);base64,/, '')
let fileSize = window.atob(pureDataURL).length // in Byte
// (fileSize/1000) + ' Kb'
$('#inpt-' + id + '-status').html('Compressing...')
$('#inpt-' + id + '-filesize').html('<samp>(' + fileSize / 1000 + ' Kb)</samp>')
$('#inpt-' + id + '-img').attr('src', base64)
$('#inpt-' + id + '-base64').val(base64) // real-data
// compress again because base64 from rotate is rather bigger in range 200kb than compress 50kb
JimpWorkerSingle.runWorker(base64, id);
},
toggleBtnRotate: function(id, hide = 'hidden') {
if (hide == 'show') {
$('#inpt-group_rotate_' + id).removeClass('d-none')
return true;
}
$('#inpt-group_rotate_' + id).addClass('d-none')
return true;
},
}
Wrapper.activate();
</script>
@endsection