Sorting laporan member dan perbaikan minor

app/Http/Controllers/Report/LaporanStiker.php

@@ -53,7 +53,8 @@ public function dataStiker(Request $request)
             )
             ->when($request->jenis_stiker, fn ($q, $v) =>
                 $q->whereIn('a.unit_kerja', $v)
-            );
+            )
+            ->orderBy('a.nama');
 
         // 🪵 Debug (aktifkan hanya saat local)
         if (app()->isLocal()) {

app/Http/Controllers/StikerController.php

@@ -4,6 +4,7 @@
 
 use Illuminate\Http\Request;
 use Illuminate\Support\Facades\DB;
+use Illuminate\Support\Facades\Log;
 
 class StikerController extends Controller
 {
@@ -14,12 +15,12 @@ class StikerController extends Controller
      */
     public function index()
     {
-        $vehicleSelect = DB::table('jenis_mobil')->get();
+        $vehicleSelect = DB::table('jenis_mobil')->orderBy('id')->get();
         $departmentSelect = DB::table('stasiunkerja')->get();
         $memberSelect = DB::table('jenis_langganan')->get();
         $jenisStiker = DB::table('tarif_stiker')->get();
         
-        return view('stiker', compact([
+        return view('stiker.stiker', compact([
         // return view('member.member', compact([
             'vehicleSelect',
             'departmentSelect',
@@ -58,7 +59,7 @@ public function store(Request $request)
      */
     public function show($id)
     {
-        //
+        Log::info($id);
     }
 
     /**

public/js/member/index.js

@@ -1,6 +1,6 @@
 $(document).ready(function () {
 
-    $(document).on('change', '.select-option', function () {
+    $(document).on('change', '.form-select', function () {
         if ($('option:selected', this).val() == '') {
             $(".nama").css('display', 'none');
             $(".nopol").css('display', 'none');
@@ -56,6 +56,7 @@ $(document).ready(function () {
                 return; // Hentikan proses jika input kosong
             }
         }
+        console.log(option);
 
         var formData = $('#search-form .input-default:visible').val();
         console.log(formData);
@@ -63,7 +64,6 @@ $(document).ready(function () {
         $.ajax({
             url: url,
             type: "POST",
-            // data: $('#search-form .input-default:visible').serialize(),
             data: $('#search-form').serialize(),
             headers: {'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')},
             dataType: 'json',
@@ -88,7 +88,16 @@ $(document).ready(function () {
 
                         rows.forEach((element, rowIndex) => {
                             var rowHtml = `
-                                <tr class="mb-2">
+                                <tr class="mb-2"
+                                        data-notrans="${element.notrans}"
+                                        data-nama="${element.nama}"
+                                        data-alamat="${element.alamat}"
+                                        data-telp="${element.telepon}"
+                                        data-jmember="${element.jmember}"
+                                        data-dept="${element.dept}"
+                                        data-awal="${element.awal}"
+                                        data-akhir="${element.akhir}"
+                                    >
                                     ${rowIndex === 0 ? `<td rowspan="${rowspan}" class="p2" style="text-align: center;">${index + 1}</td>` : ''}
                                     ${rowIndex === 0 ? `<td rowspan="${rowspan}" class="p2" style="padding: 2px;">${element.notrans}</td>` : ''}
                                     ${rowIndex === 0 ? `<td rowspan="${rowspan}" style="padding: 2px;">${element.nama}</td>` : ''}
@@ -99,13 +108,13 @@ $(document).ready(function () {
                                     ${rowIndex === 0 ? `<td rowspan="${rowspan}" width="200" style="text-align: center; padding: 2px;">${element.awal} <br> ${element.akhir}</td>` : ''}
                                     ${rowIndex === 0 ? `<td rowspan="${rowspan}" class="p-2" style="padding: 2px;"> ${[...new Set(rows.map(r => `${r.nopol || 'No. Polisi tidak ada'} (${r.vehicle || ''})`))].join('<br>')} </td>` : ''}                                        
                                     ${rowIndex === 0 ? `<td rowspan="${rowspan}" style="padding: 2px;">${[...new Set(rows.map(r => r.no_card || 'Tidak ada kartu'))].join('<br>')}</td>` : ''}
-                                    ${rowIndex === 0 ? `<td rowspan="${rowspan}" class="p-2" style="text-align: center;">
-                                        <button class="btn btn-secondary btn-xs extend-button mb-1" data-id="${element.notrans}">Extend</button>
-                                        <button class="btn btn-primary btn-xs edit-button mb-1" data-id="${element.notrans}">Edit</button>
-                                        <button class="btn btn-danger btn-xs delete-button mb-1" data-id="${element.notrans}">Delete</button>
-                                    </td>` : ''}
                                     </tr>
                                     `;
+                                    // ${rowIndex === 0 ? `<td rowspan="${rowspan}" class="p-2" style="text-align: center;">
+                                    //     <button class="btn btn-secondary btn-xs extend-button mb-1" data-id="${element.notrans}">Extend</button>
+                                    //     <button class="btn btn-primary btn-xs edit-button mb-1" data-id="${element.notrans}">Edit</button>
+                                    //     <button class="btn btn-danger btn-xs delete-button mb-1" data-id="${element.notrans}">Delete</button>
+                                    // </td>` : ''}
                             tbody.append(rowHtml);
                         });
                     });

resources/views/apps/modified-trans.blade.php

@@ -34,6 +34,17 @@
             12% { transform: rotate(-5deg); }
             100% { transform: rotate(-270deg); }
         }
+        .logo-img {
+            max-height: 70px;
+            width: auto;
+            object-fit: contain;
+        }
+
+        @media (max-width: 576px) {
+            .logo-img {
+                max-height: 55px;
+            }
+        }
     </style>
 @endsection
 
@@ -48,8 +59,8 @@
                             <div class="auth-form-light text-left py-5 px-4 px-sm-5">
                                 <div class="text-center mb-1">
                                     <img src="{{ asset('images/parkq-systems.png') }}" 
-                                        alt="Logo Perusahaan"
+                                        alt="Logo parkq-systems"
-                                        style="max-height: 80px;">
+                                        class="img-fluid logo-img">
                                 </div>
                                 <!-- Tampilan Jika Berhasil (Success Card) -->
                                 @if(session('status_update'))
@@ -97,7 +108,7 @@
                                                                 {{ $data->no_pol }}
                                                                 <input type="hidden" name="no_transaksi" value="{{ $data->no_pol }}">
                                                             @else
-                                                                <div id="reader" style="width:150px; height=100px;"></div>
+                                                                <div id="reader" class="w-100" style="max-width:300px;"></div>
 
                                                                 <input type="text" id="barcode_result" name="barcode_result" class="form-control mt-3" placeholder="Hasil scan muncul disini">
                                                                 {{-- <input type="file" id="barcode_result" name="foto_kamera" accept="image/*" capture="environment" class="form-control mb-2" placeholder="Hasil scan muncul disini"> --}}
@@ -172,14 +183,14 @@
                                                 </div>
 
                                                 {{-- Tombol --}}
-                                                <div class="d-flex justify-content-end gap-2 mt-4">
+                                                <div class="d-flex flex-column flex-md-row justify-content-md-end gap-2 mt-4">
                                                     <a href="{{ route('apps.index') }}" 
-                                                    class="btn btn-outline-secondary px-4">
+                                                    class="btn btn-outline-secondary w-100 w-md-auto">
                                                     Batal
                                                     </a>
 
                                                     <button type="submit" 
-                                                            class="btn btn-primary px-4 shadow-sm">
+                                                            class="btn btn-primary w-100 w-md-auto shadow-sm">
                                                             Simpan Perubahan
                                                     </button>
                                                 </div>

resources/views/layouts/partial/horizontal-menu.blade.php

@@ -12,13 +12,13 @@
                                 <li class="nav-item">
                                     <a href="#" class="nav-link">
                                         <i class="mdi mdi-account-multiple menu-icon"></i>
-                                        <span class="menu-title">Operasional</span>
+                                        <span class="menu-title">Transaksi</span>
                                         <i class="menu-arrow"></i>
                                     </a>
                                     <div class="submenu">
                                         <ul>
-                                            <li class="nav-item"><a class="nav-link" href="/transaksi/parkir">Transaksi Parkir</a></li>
+                                            <li class="nav-item"><a class="nav-link" href="/transaksi/parkir">Parkir</a></li>
-                                            <li class="nav-item"><a class="nav-link" href="/transaksi/stiker">Transaksi Stiker</a></li>
+                                            <li class="nav-item"><a class="nav-link" href="/transaksi/stiker">Member / Stiker</a></li>
                                             <li class="nav-item"><a class="nav-link" href="/transaksi/member">Member</a></li>
                                         </ul>
                                     </div> 

resources/views/report/stiker/stiker-harian.blade.php

@@ -85,7 +85,7 @@ class="btn btn-light btn-lg w-100">
                                                 <div class="col-sm-2"> 
                                                     <div class="form-group">
                                                         <p>Jumlah Pendapatan : </p> <h3 id="pendapatan"></h3><br>
-                                                        <p>Jumlah Transaksi : </p> <h3 id="pendapatan"></h3>
+                                                        <p>Jumlah Transaksi : </p> <h3 id="jmlTrans"></h3>
                                                     </div>
                                                 </div>
                                                 <div class="col-sm-1"> 
@@ -146,6 +146,7 @@ class="btn btn-light btn-lg w-100">
             let awal = '';
             let akhir = '';
             let pendapatan = 0;
+            let jmlTrans = 0;
             let pdfData = [];
 
             $('#btnProses').on('click', function () {
@@ -234,6 +235,7 @@ class="btn btn-light btn-lg w-100">
                         $.each(response.data, function (i, row) {
 
                             pendapatan += parseInt(row.harga || 0, 10);
+                            jmlTrans += 1;
                             awalDate = row.awal.toString('YYYY-MM-DD');
                             tbody.append(`
                                 <tr>
@@ -259,6 +261,8 @@ class="btn btn-light btn-lg w-100">
                         });
 
                         $('#pendapatan').text('Rp. ' + rupiah(pendapatan));
+                        $('#jmlTrans').text('Rp. ' + rupiah(jmlTrans));
+                        // console.log(jmlTrans);
 
                         btn.prop('disabled', false).text('Proses');
 
@@ -329,6 +333,7 @@ function rupiah(angka) {
                     );
 
                     doc.text(`Jumlah Pendapatan : ${rupiah(pendapatan)}`, marginLeft, 38);
+                    doc.text(`Jumlah Transaksi : ${rupiah(jmlTrans)}`, marginLeft, 38);
 
                     // garis pemisah
                     doc.line(marginLeft, 40, pageWidth - marginRight, 40);
@@ -395,7 +400,7 @@ function rupiah(angka) {
                     },
 
                     columnStyles: {
-                        0: { halign: 'center', cellWidth: 8 },
+                        0: { halign: 'center', cellWidth: 10 },
                         7: { halign: 'right' }
                     },
 
@@ -421,6 +426,12 @@ function rupiah(angka) {
                             );
 
                             doc.text(`Jumlah Pendapatan : ${rupiah(pendapatan)}`, marginLeft, 38);
+                            doc.text(
+                                `Jumlah Transaksi : ${rupiah(jmlTrans)}`, 
+                                pageWidth - marginRight, 
+                                38,
+                                { align: 'right'}
+                            );
 
                             doc.line(marginLeft, 40, pageWidth - marginRight, 40);
                         }

resources/views/stiker/stiker.blade.php

@@ -1,5 +1,42 @@
 @extends('layouts.master')
 
+@section('styles')
+    <style>
+        .card-body label {
+            font-size: 13px;
+            color: #6c757d;
+        }
+
+        .card-body .form-control,
+        .card-body .form-select {
+            font-size: 14px;
+        }
+
+        #search-button {
+            font-weight: 600;
+            letter-spacing: .3px;
+        }
+
+        .table-selectable tbody tr {
+            cursor: pointer;
+            transition: 0.15s;
+        }
+
+        .table-selectable tbody tr:hover {
+            background-color: #f2f6ff;
+        }
+
+        .table-selectable tbody tr.selected {
+            background-color: #0d6efd !important;
+            color: #fff;
+        }
+
+        .table-selectable tbody tr.selected td {
+            color: #fff !important;
+        }
+    </style>
+@endsection
+
 @section('content')
     <!-- partial -->
     <div class="container-fluid page-body-wrapper">
@@ -7,51 +44,103 @@
             <div class="content-wrapper">
                 <div class="row">
                     <div class="col-md-2 grid-margin stretch-card">
-                        <div class="card">
+                        <div class="card shadow-sm h-100">
                             <div class="card-body">
-                                <h4 class="card-title">Daftar Transaksi Langganan</h4>
+
-                                <div class="form-group">
+                                <h5 class="card-title mb-4">Metode Pencarian Transaksi</h5>
-                                    <label>Dasar Pencarian</label>
+
-                                    <div class="row">
+                                <!-- DASAR PENCARIAN -->
-                                        <div class="col-md-9">
+                                <div class="mb-3">
-                                            <select name="" id="">
+                                    <label class="form-label fw-semibold">Dasar Pencarian</label>
-                                                <option value="">Alamat</option>
+
+                                    <select class="form-select mb-2" id="search-by">
+                                        <option selected value="">Pencarian Data... (Semua)</option>
+                                        <option value="nama">Nama</option>
+                                        <option value="alamat">Alamat</option>
+                                        <option value="nopol">No. Polisi</option>
+                                        <option value="nocard">No. Card</option>
+                                        <option value="notrans">No. Transaksi</option>
+                                    </select>
+
+                                    <input type="text" class="form-control" id="search-value" placeholder="Masukkan kata kunci...">
+                                </div>
+
+                                <hr class="my-3">
+
+                                <!-- JENIS LANGGANAN -->
+                                <div class="mb-3">
+                                    <label class="form-label fw-semibold">Jenis Langganan</label>
+                                    <select class="form-select" id="member-type">
+                                        <option value="">Semua</option>
+                                        @foreach ($memberSelect as $jenisLangganan)
+                                            <option value="{{ $jenisLangganan->id }}">
+                                                {{ $jenisLangganan->nama }}
+                                            </option>
+                                        @endforeach
                                     </select>
                                 </div>
-                                        <div class="col-md-9">
+
-                                            <input type="text" class="form-control form-control-lg" placeholder="Username" aria-label="Username">
+                                <!-- UNIT KERJA -->
+                                <div class="mb-3">
+                                    <label class="form-label fw-semibold">Unit Kerja</label>
+                                    <select class="form-select" id="department">
+                                        <option value="">Semua</option>
+                                        @foreach ($departmentSelect as $jeniStiker)
+                                            <option value="{{ $jeniStiker->kode }}">
+                                                {{ $jeniStiker->nama }}
+                                            </option>
+                                        @endforeach
+                                    </select>
                                 </div>
+
+                                <!-- KENDARAAN -->
+                                <div class="mb-3">
+                                    <label class="form-label fw-semibold">Kendaraan</label>
+                                    <select class="form-select" id="vehicle">
+                                        <option value="">Semua</option>
+                                        @foreach ($vehicleSelect as $vehicle)
+                                            <option value="{{ $vehicle->id }}">
+                                                {{ $vehicle->nama }}
+                                            </option>
+                                        @endforeach
+                                    </select>
                                 </div>
+
+                                <!-- KATEGORI -->
+                                {{-- <div class="mb-4">
+                                    <label class="form-label fw-semibold">Kategori</label>
+                                    <input type="text"
+                                        class="form-control"
+                                        id="category"
+                                        placeholder="Masukkan kategori...">
+                                </div> --}}
+
+                                <!-- BUTTON -->
+                                <div class="d-grid">
+                                    <button type="button" id="search-button" class="btn btn-primary">
+                                        <i class="fa fa-search me-2"></i> Cari Data
+                                    </button>
                                 </div>
-                                </hr>
+
-                                <div class="form-group">
-                                    <label>Jenis Langganan</label>
-                                    <input type="text" class="form-control" placeholder="Username" aria-label="Username">
-                                </div>
-                                <div class="form-group">
-                                    <label>Unit Kerja</label>
-                                    <input type="text" class="form-control form-control-sm" placeholder="Username" aria-label="Username">
-                                </div>
-                                <div class="form-group">
-                                    <label>Kendaraan</label>
-                                    <input type="text" class="form-control" placeholder="Username" aria-label="Username">
-                                </div>
-                                <div class="form-group">
-                                    <label>Kategori</label>
-                                    <input type="text" class="form-control form-control-sm" placeholder="Username" aria-label="Username">
-                                </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">
-                            <h4 class="card-title">Bordered table</h4>
+                            <h4 class="card-title">Transaksi Stiker / Langganan</h4>
+                            <div class="d-flex justify-content-between align-items-center mb-2">
+                                <div>
+                                    <button class="btn btn-primary btn-sm add-button" data-bs-toggle="modal" data-bs-target=".bd-example-modal-lg">Tambah</button>
+                                </div>
+                                <div id="rowActions" class="d-none">
+                                    <button class="btn btn-warning btn-sm edit-button" id="btnEdit" data-bs-toggle="modal" data-bs-target=".bd-ubah-modal-lg">Edit</button>
+                                    <button class="btn btn-danger btn-sm" id="btnDelete">Hapus</button>
+                                    <button class="btn btn-info btn-sm" id="btnDetail">Detail</button>
+                                </div>
+                            </div>
                             <div class="table-responsive pt-3">
-                                <table class="table table-bordered" id="example" data-url="{{ route('getMember') }}">
+                                <table class="table table-bordered table-selectable" id="example" data-url="{{ route('getMember') }}">
                                     <thead>
                                         <tr>
                                             <th class="p-3" style="text-align: center;">No.</th>
@@ -63,14 +152,18 @@
                                             <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 style="text-align: center;">No. Kartu</th>
-                                            <th width="11%" style="text-align: center;">Action</th>
+                                            {{-- <th width="11%" style="text-align: center;">Action</th> --}}
                                         </tr>
                                     </thead>
                                     <tbody>
                                         </tbody>
                                 </table>
                             </div>
+                                <!-- ADD MEMMBER MODAL -->
+                                    @include('stiker.tambah-stiker')
+                                    @include('stiker.ubah-stiker')
+                                <!-- END MEMMBER MODAL -->
                             </div>
                         </div>
                     </div>
@@ -102,6 +195,30 @@
         $(document).ready(function () {
             var vehicle = @json($vehicleSelect);
 
+            let selectedRowData = null;
+
+            $('#example tbody').on('click', 'tr', function () {
+
+                const notrans = $(this).data('notrans');
+
+                // hapus semua highlight
+                $('#example tbody tr').removeClass('selected');
+
+                // highlight semua row dalam 1 grup
+                $(`#example tbody tr[data-notrans="${notrans}"]`).addClass('selected');
+
+                // ambil data dari row pertama grup
+                const firstRow = $(`#example tbody tr[data-notrans="${notrans}"]`).first();
+
+                selectedRowData = {
+                    notrans : firstRow.data('notrans')
+                };
+
+                console.log('Selected transaksi:', selectedRowData);
+
+                $('#rowActions').removeClass('d-none');
+            });
+
             $(document).on('click', '.extend-button', function () {
                 var rawId = $(this).data('id');
                 let id = rawId.substring(0, rawId.indexOf('/'));
@@ -259,6 +376,95 @@
                     },
                 });
             });
+
+            $(document).on('click', '.edit-button', function () {
+                let id = selectedRowData;
+                $('#edit-member').attr('action', '/transaksi/member/' + id);
+                $('#ubah-member').modal('show');
+                // console.log(selectedRowData);
+                // console.log(id);
+                $.get(`/transaksi/member/${selectedRowData}`, function(res){
+
+                    fillMemberModal(res);
+
+                    $('#modal-member').modal('show');
+
                 });
+            });
+            // $('#btnEdit').on('click', function(){
+
+            //     if(!selectedRowData) {
+            //         alert('Pilih data dulu');
+            //         return;
+            //     }
+            //     console.log(selectedRowData);
+
+            //     $.get(`/member/${selectedRowData.notrans}`, function(res){
+
+            //         fillMemberModal(res);
+
+            //         $('#modal-member').modal('show');
+
+            //     });
+            // });
+
+            function fillMemberModal(res){
+
+                let m = res.member;
+
+                // TAB 1 - DATA PENGUNJUNG
+                $('[name="nama"]').val(m.nama);
+                $('[name="address"]').val(m.alamat);
+                $('[name="daterange"]').val(m.awal + ' - ' + m.akhir);
+                $('[name="member"]').val(m.jenis_langganan).trigger('change');
+                $('[name="depart"]').val(m.dept).trigger('change');
+                $('[name="note"]').val(m.note);
+                $('[name="harga"]').val(m.harga);
+
+                // =========================
+                // TAB 2 - KENDARAAN
+                // =========================
+                $('#list-nopol').empty();
+
+                res.kendaraan.forEach(v => {
+                    $('#list-nopol').append(`
+                        <tr>
+                            <td>${v.nopol}</td>
+                            <td>${v.jenis}</td>
+                            <td>${v.merk}</td>
+                            <td>${v.member}</td>
+                            <td>
+                                <button class="btn btn-danger btn-sm remove-nopol" data-id="${v.id}">Hapus</button>
+                            </td>
+                        </tr>
+                    `);
+                });
+
+                // =========================
+                // TAB 3 - KARTU
+                // =========================
+                $('#list-card').empty();
+
+                res.kartu.forEach(k => {
+                    $('#list-card').append(`
+                        <tr>
+                            <td>${k.kartu}</td>
+                            <td>${k.nourut}</td>
+                            <td>
+                                <button class="btn btn-danger btn-sm remove-card" data-id="${k.id}">Hapus</button>
+                            </td>
+                        </tr>
+                    `);
+                });
+
+            }
+
+            $('#modal-member').on('hidden.bs.modal', function () {
+                $(this).find('form')[0].reset();
+                $('#list-nopol').empty();
+                $('#list-card').empty();
+            });
+        });
+
     </script>
 @endsection

resources/views/stiker/tambah-stiker.blade.php

@@ -0,0 +1,196 @@
+<div class="modal fade bd-example-modal-lg" id="modal-member" 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">Tambah 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="#home1"><i class="la la-user me-2"></i>Data Pengunjung</a>
+                        </li>
+                        <li class="nav-item">
+                            <a class="nav-link" data-bs-toggle="tab" href="#profile1"><i class="la la-home me-2"></i> Data Kendaraan</a>
+                        </li>
+                        <li class="nav-item">
+                            <a class="nav-link" data-bs-toggle="tab" href="#contact1"><i class="la la-phone me-2"></i>Data Akses</a>
+                        </li>
+                    </ul>
+                    <form class="tambah-member" id="add-member" action="{{route('member.store')}}">
+                        <div class="tab-content">
+                            <div class="tab-pane fade show active" id="home1" 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">Jenis Transaksi</label>
+                                                <div class="col-lg-8">
+                                                    <input type="text" class="form-control" value="BARU" readonly>
+                                                    <input type="hidden" class="form-control" name="jenis_transaksi" value="0" readonly>
+                                                </div>
+                                            </div>
+                                            <div class="mb-3 row">
+                                                <label class="col-lg-3 col-form-label form-label required">Nama</label>
+                                                <div class="col-lg-8">
+                                                    <input type="text" class="form-control" name="nama"  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" rows="3" name="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"  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" 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">
+                                                        <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">
+                                                        <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="profile1">
+                                <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>
+                                                    <th class="col-2 text-center">Aksi</th>
+                                                </tr>
+                                            </thead>
+                                            <tbody  id="list-nopol">
+                                            </tbody>
+                                        </table>
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="tab-pane fade" id="contact1">
+                                <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>
+                                                        <th class="col-2 text-center">Aksi</th>
+                                                    </tr>
+                                                </thead>
+                                                <tbody  id="list-card">
+                                                </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 simpan">Save changes</button>
+            </div>
+        </div>
+    </div>
+</div>

resources/views/stiker/ubah-stiker.blade.php

@@ -0,0 +1,188 @@
+<div class="modal fade bd-ubah-modal-lg" id="ubah-member" 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">Ubah Data Stiker/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="#home1"><i class="la la-user me-2"></i>Data Pengunjung</a>
+                        </li>
+                        <li class="nav-item">
+                            <a class="nav-link" data-bs-toggle="tab" href="#profile1"><i class="la la-home me-2"></i> Data Kendaraan</a>
+                        </li>
+                        <li class="nav-item">
+                            <a class="nav-link" data-bs-toggle="tab" href="#contact1"><i class="la la-phone me-2"></i>Data Akses</a>
+                        </li>
+                    </ul>
+                    <form class="ubah-member" id="edit-member" methode="POST">
+                        @csrf
+                        @method('PUT')
+                        <div class="tab-content">
+                            <div class="tab-pane fade show active" id="home1" 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">Jenis Transaksi</label>
+                                                <div class="col-lg-8">
+                                                    <input type="text" class="form-control" value="BARU" readonly>
+                                                    <input type="hidden" class="form-control" name="jenis_transaksi" value="0" readonly>
+                                                </div>
+                                            </div>
+                                            <div class="mb-3 row">
+                                                <label class="col-lg-3 col-form-label form-label required">Nama</label>
+                                                <div class="col-lg-8">
+                                                    <input type="text" class="form-control" name="nama"  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" rows="3" name="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"  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" 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">
+                                                        <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">
+                                                        <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>
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="tab-pane fade" id="profile1">
+                                <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>
+                                                    <th class="col-2 text-center">Aksi</th>
+                                                </tr>
+                                            </thead>
+                                            <tbody  id="list-nopol">
+                                            </tbody>
+                                        </table>
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="tab-pane fade" id="contact1">
+                                <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>
+                                                        <th class="col-2 text-center">Aksi</th>
+                                                    </tr>
+                                                </thead>
+                                                <tbody  id="list-card">
+                                                </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 simpan">Simpan Perubahan</button>
+            </div>
+        </div>
+    </div>
+</div>