Files
backend_parkir/resources/views/note_usemember/member.blade.php
T
pand03-CEOandClaude Sonnet 5 2a9b28581c Rapihin setup/member/lot-parking + fitur intercom, exclude WIP controller & file sampah dari git
Kumpulan perubahan yang udah numpuk di working tree: refactor Setup
(Gate/Vehicle/Member), rapihin memberin & stiker, service parking baru
(ParkingUtilsServices, NetworkService), model/migration lot-parking &
DHCP reservation, dan fitur baru Intercom (controller/model/migration/
view).

ReportTransaksiController versi lokal ini WIP (~90%, masih didebug) -
versi yang bener ada di server, jadi dikeluarin dari git (ditambahin
ke .gitignore) biar gak numpuk nindihin punya server pas git pull di
sana. Sekalian keluarin dump mentah tabel softseting (1.8MB, nyasar
ke-commit), file .bak, dan arsip ad-hoc (api.tgz, c.zip) yang emang
bukan source code.

Co-Authored-By: Claude Sonnet 5 <[email protected]>
Claude-Session: https://claude.ai/code/session_01EAJc2mrpj2cSTe4oowLPzQ
2026-10-04 07:15:54 +07:00

530 lines
34 KiB
PHP

@extends('layouts.master')
@section('styles')
<link href="{{asset ('vendor/bootstrap-daterangepicker/daterangepicker.css') }}" rel="stylesheet">
<link rel="stylesheet" href="vendor/pickadate/themes/default.css">
<link rel="stylesheet" href="vendor/pickadate/themes/default.date.css">
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
@endsection
@section('content')
<!-- partial -->
<div class="container-fluid page-body-wrapper">
<div class="main-panel">
<div class="content-wrapper">
<div class="row">
<div class="col-md-2 grid-margin stretch-card">
<div class="card">
<div class="card-body">
<h4 class="card-title">Daftar Transaksi Langganan</h4>
<div class="form-group">
<label>Dasar Pencarian</label>
<div class="row">
<div class="col-md-5">
<select class="select-option form-control">
<option selected value="">Pencarian Data... (Semua)</option>
<option value="nama">Nama</option>
<option value="nopol">No. Polisi</option>
<option value="nocard">No. Card</option>
<option value="notrans">No. Transaksi</option>
</select>
</div>
{{-- <div class="col-md-7">
<input type="text" class="form-control form-control-sm" placeholder="Username" aria-label="Username">
</div> --}}
<div class="col-md-7 p2 nama" style="display: none">
<input type="text" class="form-control form-control-sm" value="" name="nama" placeholder="Cari Nama...">
</div>
<div class="col-md-7 p2 nopol" style="display: none">
<input type="text" class="form-control form-control-sm" onkeyup="this.value = this.value.toUpperCase();" value="" name="nopol" placeholder="Cari No. Polisi...">
</div>
<div class="col-md-7 p2 nocard" style="display: none">
<input type="text" class="form-control form-control-sm" value="" name="nocard" placeholder="Cari No Kartu...">
</div>
<div class="col-md-7 p2 notrans" style="display: none">
<input type="text" class="form-control form-control-sm" value="" name="notrans" placeholder="Cari No. Trans...">
</div>
</div>
</div>
</hr>
<div class="form-group">
<label>Jenis Langganan</label>
<select class="select form-control" id="vehicle" name="vehicle" >
<option selected value="">Semua Kendaraan</option>
@foreach ($vehicleSelect as $kendaraan)
<option value="{{ $kendaraan->id }}">{{ $kendaraan->nama }}</option>
@endforeach
</select>
</div>
<div class="form-group">
<label>Unit Kerja</label>
<select class="select-data form-control" name="depart" id="department">
<option selected value="">Semua Departemen</option>
@foreach ($departmentSelect as $department)
<option value="{{ $department->kode }}">{{ $department->nama }}</option>
@endforeach
</select>
</div>
<div class="form-group">
<label>Kendaraan</label>
<select class="select-data form-control" name="member" id="member">
<option selected value="">Semua Member</option>
@foreach ($memberSelect as $member)
<option value="{{ $member->id }}">{{ $member->nama }}</option>
@endforeach
</select>
</div>
<div class="form-group">
<label>Kategori</label>
<div class="form-check custom-checkbox p-2 checkbox-primary">
<input type="hidden" name="isactive" value="0">
<input type="checkbox" class="form-check-input" checked name="isactive" value="1" id="isactive" required>
<label class="form-check-label" for="customCheckBox1">Active</label>
</div>
</div>
<div class="form-group">
<button type="button" id="search-button" class="btn btn-primary">Cari Data</button>
</div>
</div>
</div>
</div>
<div class="col-10 grid-margin stretch-card">
<div class="card">
<div class="card-body">
<div class="mb-3">
<button type="button" class="btn btn-primary btn-xs btn-right" data-bs-toggle="modal" data-bs-target=".bd-example-modal-lg">Tambah</button>
</div>
<table class="table-bordered" id="example" class="display" style="width:100%" data-url="{{ route('getMember') }}" >
<thead>
<tr>
<th class="p-3" style="text-align: center;">No.</th>
<th style="text-align: center;">No. Transaksi</th>
<th style="text-align: center;">Nama</th>
<th style="text-align: center;">Alamat</th>
<th style="text-align: center;">Telepone</th>
<th style="text-align: center;">Jenis Langganan</th>
<th style="text-align: center;">Departement</th>
<th style="text-align: center;">Periode</th>
<th style="text-align: center;">Details Kendaraan</th>
<th width="130" style="text-align: center;">No. Kartu</th>
<th width="250" style="text-align: center;">Action</th>
</tr>
</thead>
<tbody>
</tobdy>
</table>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="content-body">
<div class="container-fluid">
<div class="row page-titles">
<ol class="breadcrumb">
<li class="breadcrumb-item"><a href="javascript:void(0)">Table</a></li>
<li class="breadcrumb-item active"><a href="javascript:void(0)">Datatable</a></li>
</ol>
</div>
<!-- ADD MEMMBER MODAL -->
@include('member.modal-add')
<!-- END MEMMBER MODAL -->
<!-- ADD MEMMBER MODAL -->
<div class="modal fade bd-example-modal-lg" id="modal-member-extend" tabindex="-1" role="dialog" data-bs-backdrop="static" data-keyboard="false">
<div class="modal-dialog modal-xl">
<div class="modal-content">
<div class="modal-header">
<h4 class="card-title">Perpanjang Member</h4>
<button type="button" class="btn-close" data-bs-dismiss="modal">
</button>
</div>
<div class="modal-body">
<div class="custom-tab-1">
<ul class="nav nav-tabs">
<li class="nav-item">
<a class="nav-link active" data-bs-toggle="tab" href="#home-ext"><i class="la la-user me-2"></i>Profile</a>
</li>
<li class="nav-item">
<a class="nav-link" data-bs-toggle="tab" href="#profile-ext"><i class="la la-home me-2"></i> Profile</a>
</li>
<li class="nav-item">
<a class="nav-link" data-bs-toggle="tab" href="#contact-ext"><i class="la la-phone me-2"></i> Contact</a>
</li>
</ul>
<form class="perpanjang-member" id="extend-member" action="{{route('member.store')}}">
<div class="tab-content">
<div class="tab-pane fade show active" id="home-ext" role="tabpanel">
<div class="pt-4">
<div class="row">
<div class="col-xl-6">
<div class="mb-3 row">
<label class="col-lg-3 col-form-label form-label">No. Trans</label>
<div class="col-lg-8">
<input type="text" class="form-control" name="notrans" id="notransnya" readonly>
</div>
</div>
<div class="mb-3 row">
<label class="col-lg-3 col-form-label form-label">Jenis Transaksi</label>
<div class="col-lg-8">
<input type="text" class="form-control" value="PERPANJANGAN" readonly>
<input type="hidden" class="form-control" name="jenis_transaksi" value="1">
</div>
</div>
<div class="mb-3 row">
<label class="col-lg-3 col-form-label form-label">Nama</label>
<div class="col-lg-8">
<input type="text" class="form-control nama" name="nama" id="namanya" placeholder="Masuk kan nama...." required>
</div>
</div>
<div class="mb-3 row">
<label class="col-lg-3 col-form-label form-label">Alamat</label>
<div class="col-lg-8">
<textarea type="text" class="form-control address" rows="3" name="address" id="address" placeholder="JL. Hati hati raya..."></textarea>
</div>
</div>
<div class="mb-3 row">
<label class="col-lg-3 col-form-label form-label">Telepon</label>
<div class="col-lg-8">
<input type="number" class="form-control phone" phone="phone" placeholder="+62 81/081...">
</div>
</div>
<div class="mb-3 row">
<label class="col-lg-3 col-form-label form-label required">Periode :</label>
<div class="col-lg-8">
<input class="form-control input-daterange-timepicker" id="periode" type="text" name="daterange" value="">
</div>
</div>
</div>
<div class="col-xl-6">
<div class="mb-3 row">
<label class="col-lg-3 col-form-label form-label">Jenis</label>
<div class="col-lg-6">
<select class="select-data form-control" name="member" id="member-ext">
<option selected value="">Pilih Jenis</option>
@foreach ($memberSelect as $member)
<option value="{{ $member->id }}">{{ $member->nama }}</option>
@endforeach
</select>
</div>
</div>
<div class="mb-3 row">
<label class="col-lg-3 col-form-label form-label">Dept</label>
<div class="col-lg-6">
<select class="select-data form-control" name="depart" id="department-ext">
<option selected value="">Pilih Departemen</option>
@foreach ($departmentSelect as $department)
<option value="{{ $department->kode }}">{{ $department->nama }}</option>
@endforeach
</select>
</div>
</div>
<div class="mb-3 row">
<label class="col-lg-3 col-form-label form-label">Note :</label>
<div class="col-lg-6">
<input type="text" class="form-control" name="note" placeholder="Catatan...">
</div>
</div>
<div class="mb-3 row">
<label class="col-lg-3 col-form-label form-label">Harga (Rp.):</label>
<div class="col-lg-6">
<input type="text" class="form-control" name="harga" placeholder="10.000">
</div>
</div>
<div class="mb-3 row">
<label class="col-lg-3 col-form-label form-label required">Best Skill</label>
<div class="col-lg-6">
<select class="default-select wide form-control" id="validationCustom05">
<option data-display="Select">Please select</option>
<option value="html">HTML</option>
<option value="css">CSS</option>
</select>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="tab-pane fade" id="profile-ext">
<div class="pt-4">
<h4>Tambahkan Kendaraan</h4>
<div class="row form-material">
<div class="col-xl-3 col-md-6 mb-3">
<label class="form-label">Nomer Polisi</label>
<input type="text" class="form-control nopol-add" onkeyup="this.value = this.value.toUpperCase();" placeholder="No. Polisi">
<div class="invalid-feedback">Nomer Polisi sudah ada</div>
</div>
<div class="col-xl-3 col-md-6 mb-3">
<label class="form-label">Jenis Kendaraan :</label>
<select class="select form-control" id="jenisVehicle">
<option selected value="">Jenis Kendaraan</option>
@foreach ($vehicleSelect as $kendaraan)
<option value="{{ $kendaraan->id }}">{{ $kendaraan->nama }}</option>
@endforeach
</select>
</div>
<div class="col-xl-3 col-md-6 mb-3">
<label class="form-label">Jenis Member :</label>
<select class="select-data form-control member" id="jenis-member">
</select>
</div>
<div class="col-xl-3 col-md-6 mb-3">
<label class="form-label">Merk : </label>
<input type="text" class="form-control merk" onkeyup="this.value = this.value.toUpperCase();" placeholder="Honda...">
</div>
<div class="col-xl-3 col-md-6 mb-3">
<label class="form-label"></label>
<button type="button" id="nopol-add" class="btn btn-primary btn-xs">Tambah</button>
</div>
<hr>
<table class="table-bordered table-striped">
<thead>
<tr>
<th class="col-2 text-center p-2">Nomer Polisi</th>
<th class="col-2 text-center">Jenis Kendaraan</th>
<th class="col-2 text-center">Merk Kendaraan</th>
<th class="col-2 text-center">Type Member</th>
</tr>
</thead>
<tbody id="list-nopol-ext">
</tbody>
</table>
</div>
</div>
</div>
<div class="tab-pane fade" id="contact-ext">
<div class="pt-4">
<h4>Tambahkan Kartu</h4>
<div class="row form-material">
<div class="col-xl-6 col-md-6 mb-3">
<label class="form-label">Nomer Kartu</label>
<input type="text" class="form-control kartu" placeholder="01234567...">
</div>
<div class="col-xl-6 col-md-6 mb-3">
<label class="form-label">Nomer Urut</label>
<input type="text" class="form-control nourut" placeholder="01234567...">
</div>
<hr>
{{-- <div class="table-responsive"> --}}
<table class="table-bordered">
<thead>
<tr>
<th class="col-5 text-center p-2" >Nomer Kartu</th>
<th class="col-5 text-center">No. Urut</th>
</tr>
</thead>
<tbody id="list-card-ext">
</tbody>
</table>
{{-- </div> --}}
</div>
</div>
</div>
</div>
</form>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-danger light" data-bs-dismiss="modal">Close</button>
<button type="button" class="btn btn-primary extend">Perpanjang Member</button>
</div>
</div>
</div>
</div>
<!-- END MEMMBER MODAL -->
</div>
</div>
@endsection
@section('javascript')
<!--********* Scripts *********-->
<!-- Datatable -->
<!--********* Scripts *********-->
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.4/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.19.5/jquery.validate.js"></script>
<script src="{{asset ('vendor/moment/moment.min.js') }}"></script>
<script src="vendor/bootstrap-daterangepicker/daterangepicker.js"></script>
{{-- <script src="{{asset ('vendor/datatables/js/jquery.dataTables.min.js') }}"></script> --}}
{{-- <script src="{{asset ('vendor/datatables/responsive/responsive.js') }}"></script> --}}
<script src="{{asset ('vendor/bootstrap-select/dist/js/bootstrap-select.min.js') }}"></script>
{{-- <script src="{{asset ('vendor/bootstrap-material-datetimepicker/js/bootstrap-material-datetimepicker.js') }}"></script> --}}
{{-- <script src="{{asset ('vendor/bootstrap-datepicker-master/js/bootstrap-datepicker.min.js') }}"></script> --}}
<script src="{{asset ('vendor/sweetalert2/dist/sweetalert2.min.js') }}"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/metisMenu/3.0.7/metisMenu.min.js"></script>
<script src="{{asset ('js/custom.min.js') }}"></script>
<script src="{{asset ('js/dlabnav-init.js') }}"></script>
<script src="{{asset ('js/member/index.js') }}"></script>
<script>
var member = @json($jenisStiker);
</script>
<script src="{{asset ('js/member/member-register.js') }}"></script>
<script>
$(document).ready(function () {
var vehicle = @json($vehicleSelect);
$(document).on('click', '.extend-button', function () {
var rawId = $(this).data('id');
let id = rawId.substring(0, rawId.indexOf('/'));
var kendaraan = vehicle;
console.log('Data ID : ', id);
var actionUrl = '{{ route("member.show", ":id") }}';
actionUrl = actionUrl.replace(':id', id);
console.log('Action URL : ', actionUrl);
// $('#extend-member').attr('action'), actionUrl;
$.ajax({
url: actionUrl,
type: 'GET',
success: function (r) {
if (r) {
$('#extend-member').val('');
$('#list-nopol-ext').empty();
$('#list-card-ext').empty();
console.log(r.nama);
$('#notransnya').val(r.notrans);
$('#namanya').val(r.nama);
$('#address').val(r.alamat);
$('#periode').val(`${moment(r.awal).format('DD-MM-YYYY HH:mm')} - ${moment(r.akhir).format('DD-MM-YYYY HH:mm')}`);
$('#member-ext').val(r.unit_kerja);
$('#department-ext').val(r.jenis_langganan);
var rows = r.stiker_details;
if (rows.length !== 0) {
rows.forEach(row => {
var vehicleName = vehicle.find(v => v.id === row.jenis_mobil)?.nama || 'Unknown';
$('#list-nopol-ext').append(`
<tr>
<td class="text-center p-2">${row.nopol}</td>
<td class="text-center p-2" data-value="${row.jenis_mobil}">${vehicleName}</td>
<td class="text-center p-2">${row.merk}</td>
<td class="text-center p-2">${row.jenis_member}</td>
</tr>
`);
});
} else {
$('#list-nopol-ext').append(`
<tr>
<td class="text-center p-2">Tidak ada data</td>
<td class="text-center p-2">Tidak ada data</td>
<td class="text-center p-2">Tidak ada data</td>
<td class="text-center p-2">Tidak ada data</td>
</tr>
`);
}
var rowss = r.member_card;
if (rowss.length !== 0) {
rowss.forEach(ro => {
$('#list-card-ext').append(`
<tr>
<td class="text-center p-2">${ro.no_card}</td>
<td class="text-center p-2">${ro.no_urut}</td>
</tr>
`);
});
} else {
$('#list-card-ext').append(`
<tr>
<td class="text-center p-2">Tidak ada data</td>
<td class="text-center p-2">Tidak ada data</td>
</tr>
`);
}
console.log('Data : ', r);
}
},
error: function (xhr) {
console.error('Error : ', xhr);
},
});
$('#modal-member-extend').modal('show');
});
$('.extend').on('click', function () {
// $('#modal-member-extend').modal('show');
var url = $('#extend-member').attr('action').replace(":notrans",$("#extend-member").data('notrans'));
var extend = $(this);
var formExtend = $('#extend-member').serialize();
var nopolData = [];
var cardData = [];
$('#list-nopol-ext tr').each(function () {
var row = $(this);
var rowData = {
nopol: row.find('td:nth-child(1)').text().trim(),
vehicle: row.find('td:nth-child(2)').data('value'),
member: row.find('td:nth-child(3)').text().trim(),
merk: row.find('td:nth-child(4)').text().trim(),
};
nopolData.push(rowData);
});
console.log(nopolData);
$('#list-card-ext tr').each(function () {
var row = $(this);
var rowCard = {
nocard: row.find('td:nth-child(1)').text(),
nourut: row.find('td:nth-child(2)').text(),
};
cardData.push(rowCard);
});
const stringDataExt = formExtend;
// Mengonversi query string menjadi objek
const formDataExt = {};
const searchExtend = new URLSearchParams(stringDataExt);
searchExtend.forEach((value, key) => {
formDataExt[key] = value;
});
// console.log(formDataExt);
var extData = {
formData: formDataExt,
nopolData: nopolData,
cardNumber: cardData,
};
$.ajax({
url: url,
type: 'POST',
data: extData,
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
},
berforeSend: function () {
extend.text('Loading...');
},
success: function (data) {
if (data.response === true) {
Swal.fire({
icon: 'success',
title: 'Berhasil',
text: data.message,
});
$('#modal-member-extend').modal('hide');
} else {
Swal.fire({
icon: 'error',
title: 'Gagal',
text: data.message,
});
}
console.log(data);
},
error: function (xhr) {
console.error('Error : ', xhr);
},
});
});
});
</script>
@endsection