Penambahan FrontEnd All-New-Manufacture

This commit is contained in:
pand03
2026-01-31 14:23:04 +07:00
parent 1b2e320b2b
commit 4feb21dcbc
2891 changed files with 426849 additions and 135 deletions

BIN
resources/views/.DS_Store vendored Normal file

Binary file not shown.

View File

@@ -0,0 +1,136 @@
@extends('layouts.apps')
@section('styles')
<!-- CSS untuk Efek Ceklist -->
<style>
.success-checkmark {
width: 80px;
height: 80px;
margin: 0 auto;
}
.check-icon {
width: 80px;
height: 80px;
position: relative;
border-radius: 50%;
box-sizing: content-box;
border: 4px solid #4CAF50;
}
.check-icon::before {
top: 3px; left: -2px; width: 30px; transform-origin: 100% 50%; border-radius: 100px 0 0 100px;
}
.check-icon::after {
top: 0; left: 30px; width: 60px; transform-origin: 0 50%; border-radius: 0 100px 100px 0; animation: rotateCircle 4.25s ease-in;
}
.icon-line {
height: 5px; background-color: #4CAF50; display: block; border-radius: 2px; position: absolute; z-index: 10;
}
.line-tip { top: 46px; left: 14px; width: 25px; transform: rotate(45deg); }
.line-long { top: 38px; right: 8px; width: 47px; transform: rotate(-45deg); }
@keyframes rotateCircle {
0% { transform: rotate(0deg); }
5% { transform: rotate(0deg); }
12% { transform: rotate(-5deg); }
100% { transform: rotate(-270deg); }
}
</style>
@endsection
@section('content')
<div class="container-scroller">
<div class="container-fluid page-body-wrapper full-page-wrapper">
<div class="main-panel">
<div class="content-wrapper d-flex align-items-center auth px-0">
<div class="row w-100 mx-0">
<div class="col-lg-4 mx-auto">
<div class="auth-form-light text-left py-5 px-4 px-sm-5">
<!-- Tampilan Jika Berhasil (Success Card) -->
@if(session('status_update'))
<div class="card border-success mb-4 shadow animate__animated animate__fadeIn">
<div class="card-body text-center">
<!-- Animasi Ceklist Sederhana -->
<div class="success-checkmark">
<div class="check-icon">
<span class="icon-line line-tip"></span>
<span class="icon-line line-long"></span>
<div class="icon-circle"></div>
<div class="icon-fix"></div>
</div>
</div>
<h4 class="text-success mt-3">{{ session('status_update') }}</h4>
<p class="text-muted">Jenis kendaraan telah berhasil diubah di sistem.</p>
<a href="{{ route('apps.index') }}" class="btn btn-outline-success btn-sm">Kembali ke Beranda</a>
</div>
</div>
@endif
@if($data)
<h3>Ubah Jenis kendaraan</h3>
<hr>
<form action="{{ route('apps.update', $data->no_pol) }}" method="POST" class="pt-3">
@csrf
@method('PUT')
{{-- Menampilkan No. Transaksi sebagai info (Read Only) --}}
<div class="form-group row mb-0">
<strong class="col-md-6 col-form-label">No. Transaksi</strong>
<div class="col-md-6 text-right">
<p class="form-control-plaintext text-primary font-weight-bold">{{ $data->no_pol }}</p>
{{-- Input hidden jika Anda butuh no_pol terkirim ke backend --}}
<input type="hidden" name="no_transaksi" value="{{ $data->no_pol }}">
</div>
</div>
<div class="form-group row mb-0">
<strong class="col-md-6 col-form-label">Jam Masuk</strong>
<p class="col-md-6 form-control-plaintext text-right">
{{ date('Y-m-d H:i:s', strtotime($data->waktu_masuk)) }}
</p>
</div>
<div class="form-group row mb-3">
<strong class="col-md-6 col-form-label">Pintu Masuk</strong>
<p class="col-md-6 form-control-plaintext text-right">
{{ $data->gateIn }} (Gate : {{ $data->id_pintu_masuk }})
</p>
</div>
<div class="form-group">
<label class="font-weight-bold">Ubah Jenis Kendaraan Menjadi:</label>
<select name="id_kendaraan_baru" class="form-control shadow-sm" required>
<option value="" disabled selected>-- Pilih Jenis Kendaraan --</option>
@foreach ($vehicle as $kendaraan)
<option value="{{ $kendaraan->id }}" {{ $data->id_kendaraan == $kendaraan->id ? 'selected' : '' }}>
{{ $kendaraan->nama }}
</option>
@endforeach
</select>
</div>
<div class="row mt-4">
<div class="col-12">
<button type="submit" class="btn btn-primary btn-block shadow">Simpan Perubahan</button>
<a href="{{ route('apps.index') }}" class="btn btn-light btn-block">Batal</a>
</div>
</div>
</form>
@else
<h1>Halaman Utama Apps</h1>
<p>Ini adalah tampilan standar ketika tidak ada ID yang dipilih.</p>
@endif
</div>
</div>
</div>
</div>
</div>
</div>
</div>
@endsection
@section('javascript')
<script>
$(document).ready(function () {
});
</script>
@endsection

View File

@@ -0,0 +1,90 @@
@extends('layouts.guest')
@section('content')
<div class="container-scroller">
<div class="container-fluid page-body-wrapper full-page-wrapper">
<div class="main-panel">
<div class="content-wrapper d-flex align-items-center auth px-0">
<div class="row w-100 mx-0">
<div class="col-lg-4 mx-auto">
<div class="auth-form-light text-left py-5 px-4 px-sm-5">
<div class="card mb-0 h-auto">
<div class="card-body">
<div class="text-center mb-3">
{{-- <h1>{{ ucfirst(strtolower($LocationSettings->namaperusahaan)) }} </h1> --}}
{{-- <a href="index.html"><img class="logo-auth" src="images/logo-full.png" alt=""></a> --}}
</div>
<h4 class="text-center mb-4">Silahkan login untuk mengakses halaman</h4>
<form method="POST" action="{{ route('login') }}">
@csrf
<div class="form-group mb-4">
<label for="login">Email or Username</label>
<input id="login" type="text" class="form-control @error('login') is-invalid @enderror" name="login" value="{{ old('login') }}" required autocomplete="login" autofocus>
@error('login')
<span class="invalid-feedback" role="alert">
<strong>{{ $message }}</strong>
</span>
@enderror
{{-- <label for="username">Username</label>
<input id="username" type="text" class="form-control @error('username') is-invalid @enderror" name="username" value="{{ old('username') }}" required autofocus>
@error('username')
<span class="invalid-feedback" role="alert">
<strong>{{ $message }}</strong>
</span>
@enderror --}}
{{-- <label class="form-label" for="email">{{ __('Email Address') }}</label>
<input id="email" type="email" class="form-control @error('email') is-invalid @enderror" name="email" value="{{ old('email') }}" required autocomplete="email" autofocus>
@error('email')
<span class="invalid-feedback" role="alert">
<strong>{{ $message }}</strong>
</span>
@enderror --}}
{{-- <input type="text" class="form-control" placeholder="Enter username" id="username"> --}}
</div>
<div class="mb-sm-4 mb-3 position-relative">
<label class="form-label" for="dlab-password">Password</label>
<input type="password" id="password" class="form-control" value="123456" @error('password') is-invalid @enderror" name="password" required autocomplete="current-password">
<span class="show-pass eye">
<i class="fa fa-eye-slash"></i>
<i class="fa fa-eye"></i>
</span>
</div>
{{-- <div class="form-row d-flex flex-wrap justify-content-between mb-2">
<div class="form-group mb-sm-4 mb-1">
<div class="form-check custom-checkbox ms-1">
<input type="checkbox" class="form-check-input" id="basic_checkbox_1">
<label class="form-check-label" for="basic_checkbox_1">Remember my preference</label>
</div>
</div>
<div class="form-group ms-2">
<a class="text-hover" href="page-forgot-password.html">Forgot Password?</a>
</div>
</div> --}}
{{-- <div class="text-center">
<button type="submit" class="btn btn-primary btn-block">Sign In</button>
</div> --}}
<div class="row mb-0">
<div class="col-md-12 text-center">
<button type="submit" class="btn btn-primary">
{{ __('Login') }}
</button>
@if (Route::has('password.request'))
<a class="btn btn-link d-block" href="{{ route('password.request') }}">
{{ __('Forgot Your Password?') }}
</a>
@endif
</div>
</div>
</form>
<div class="new-account mt-3">
<p>Don't have an account? <a class="text-primary" href="{{ route('register') }}">Sign up</a></p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
@endsection

View File

@@ -0,0 +1,49 @@
@extends('layouts.app')
@section('content')
<div class="container">
<div class="row justify-content-center">
<div class="col-md-8">
<div class="card">
<div class="card-header">{{ __('Confirm Password') }}</div>
<div class="card-body">
{{ __('Please confirm your password before continuing.') }}
<form method="POST" action="{{ route('password.confirm') }}">
@csrf
<div class="row mb-3">
<label for="password" class="col-md-4 col-form-label text-md-end">{{ __('Password') }}</label>
<div class="col-md-6">
<input id="password" type="password" class="form-control @error('password') is-invalid @enderror" name="password" required autocomplete="current-password">
@error('password')
<span class="invalid-feedback" role="alert">
<strong>{{ $message }}</strong>
</span>
@enderror
</div>
</div>
<div class="row mb-0">
<div class="col-md-8 offset-md-4">
<button type="submit" class="btn btn-primary">
{{ __('Confirm Password') }}
</button>
@if (Route::has('password.request'))
<a class="btn btn-link" href="{{ route('password.request') }}">
{{ __('Forgot Your Password?') }}
</a>
@endif
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
@endsection

View File

@@ -0,0 +1,47 @@
@extends('layouts.app')
@section('content')
<div class="container">
<div class="row justify-content-center">
<div class="col-md-8">
<div class="card">
<div class="card-header">{{ __('Reset Password') }}</div>
<div class="card-body">
@if (session('status'))
<div class="alert alert-success" role="alert">
{{ session('status') }}
</div>
@endif
<form method="POST" action="{{ route('password.email') }}">
@csrf
<div class="row mb-3">
<label for="email" class="col-md-4 col-form-label text-md-end">{{ __('Email Address') }}</label>
<div class="col-md-6">
<input id="email" type="email" class="form-control @error('email') is-invalid @enderror" name="email" value="{{ old('email') }}" required autocomplete="email" autofocus>
@error('email')
<span class="invalid-feedback" role="alert">
<strong>{{ $message }}</strong>
</span>
@enderror
</div>
</div>
<div class="row mb-0">
<div class="col-md-6 offset-md-4">
<button type="submit" class="btn btn-primary">
{{ __('Send Password Reset Link') }}
</button>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
@endsection

View File

@@ -0,0 +1,65 @@
@extends('layouts.app')
@section('content')
<div class="container">
<div class="row justify-content-center">
<div class="col-md-8">
<div class="card">
<div class="card-header">{{ __('Reset Password') }}</div>
<div class="card-body">
<form method="POST" action="{{ route('password.update') }}">
@csrf
<input type="hidden" name="token" value="{{ $token }}">
<div class="row mb-3">
<label for="email" class="col-md-4 col-form-label text-md-end">{{ __('Email Address') }}</label>
<div class="col-md-6">
<input id="email" type="email" class="form-control @error('email') is-invalid @enderror" name="email" value="{{ $email ?? old('email') }}" required autocomplete="email" autofocus>
@error('email')
<span class="invalid-feedback" role="alert">
<strong>{{ $message }}</strong>
</span>
@enderror
</div>
</div>
<div class="row mb-3">
<label for="password" class="col-md-4 col-form-label text-md-end">{{ __('Password') }}</label>
<div class="col-md-6">
<input id="password" type="password" class="form-control @error('password') is-invalid @enderror" name="password" required autocomplete="new-password">
@error('password')
<span class="invalid-feedback" role="alert">
<strong>{{ $message }}</strong>
</span>
@enderror
</div>
</div>
<div class="row mb-3">
<label for="password-confirm" class="col-md-4 col-form-label text-md-end">{{ __('Confirm Password') }}</label>
<div class="col-md-6">
<input id="password-confirm" type="password" class="form-control" name="password_confirmation" required autocomplete="new-password">
</div>
</div>
<div class="row mb-0">
<div class="col-md-6 offset-md-4">
<button type="submit" class="btn btn-primary">
{{ __('Reset Password') }}
</button>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
@endsection

View File

@@ -0,0 +1,93 @@
@extends('layouts.guest')
@section('content')
<div class="fix-wrapper">
<div class="container">
<div class="row justify-content-center">
<div class="col-md-8">
<div class="card">
<div class="card-header">{{ __('Register') }}</div>
<div class="card-body">
<form method="POST" action="{{ route('register') }}">
@csrf
<div class="row mb-3">
<label for="name" class="col-md-4 col-form-label text-md-end">{{ __('Name') }}</label>
<div class="col-md-6">
<input id="name" type="text" class="form-control @error('name') is-invalid @enderror" name="name" value="{{ old('name') }}" required autocomplete="name" autofocus>
@error('name')
<span class="invalid-feedback" role="alert">
<strong>{{ $message }}</strong>
</span>
@enderror
</div>
</div>
<div class="row mb-3">
<label for="username" class="col-md-4 col-form-label text-md-end">{{ __('Username') }}</label>
<div class="col-md-6">
<input id="username" type="text" class="form-control @error('username') is-invalid @enderror" name="username" value="{{ old('username') }}" required autocomplete="username" autofocus>
@error('username')
<span class="invalid-feedback" role="alert">
<strong>{{ $message }}</strong>
</span>
@enderror
</div>
</div>
<div class="row mb-3">
<label for="email" class="col-md-4 col-form-label text-md-end">{{ __('Email Address') }}</label>
<div class="col-md-6">
<input id="email" type="email" class="form-control @error('email') is-invalid @enderror" name="email" value="{{ old('email') }}" required autocomplete="email">
@error('email')
<span class="invalid-feedback" role="alert">
<strong>{{ $message }}</strong>
</span>
@enderror
</div>
</div>
<div class="row mb-3">
<label for="password" class="col-md-4 col-form-label text-md-end">{{ __('Password') }}</label>
<div class="col-md-6">
<input id="password" type="password" class="form-control @error('password') is-invalid @enderror" name="password" required autocomplete="new-password">
@error('password')
<span class="invalid-feedback" role="alert">
<strong>{{ $message }}</strong>
</span>
@enderror
</div>
</div>
<div class="row mb-3">
<label for="password-confirm" class="col-md-4 col-form-label text-md-end">{{ __('Confirm Password') }}</label>
<div class="col-md-6">
<input id="password-confirm" type="password" class="form-control" name="password_confirmation" required autocomplete="new-password">
</div>
</div>
<div class="row mb-0">
<div class="col-md-6 offset-md-4">
<button type="submit" class="btn btn-primary">
{{ __('Register') }}
</button>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
@endsection

View File

@@ -0,0 +1,28 @@
@extends('layouts.app')
@section('content')
<div class="container">
<div class="row justify-content-center">
<div class="col-md-8">
<div class="card">
<div class="card-header">{{ __('Verify Your Email Address') }}</div>
<div class="card-body">
@if (session('resent'))
<div class="alert alert-success" role="alert">
{{ __('A fresh verification link has been sent to your email address.') }}
</div>
@endif
{{ __('Before proceeding, please check your email for a verification link.') }}
{{ __('If you did not receive the email') }},
<form class="d-inline" method="POST" action="{{ route('verification.resend') }}">
@csrf
<button type="submit" class="btn btn-link p-0 m-0 align-baseline">{{ __('click here to request another') }}</button>.
</form>
</div>
</div>
</div>
</div>
</div>
@endsection

View File

@@ -0,0 +1,442 @@
@extends('layouts.master')
@section('content')
<!-- partial -->
<div class="container-fluid page-body-wrapper">
<div class="main-panel">
<div class="content-wrapper">
<div class="row">
<div class="col-sm-6 mb-4 mb-xl-0">
<div class="d-lg-flex align-items-center">
<div>
<h3 class="text-dark font-weight-bold mb-2">Hi, welcome back!</h3>
<h6 class="font-weight-normal mb-2">Last login was 23 hours ago. View details</h6>
</div>
<div class="ms-lg-5 d-lg-flex d-none">
<button type="button" class="btn bg-white btn-icon">
<i class="mdi mdi-view-grid text-success"></i>
</button>
<button type="button" class="btn bg-white btn-icon ms-2">
<i class="mdi mdi-format-list-bulleted font-weight-bold text-primary"></i>
</button>
</div>
</div>
</div>
<div class="col-sm-6">
<div class="d-flex align-items-center justify-content-md-end">
<div class="pe-1 mb-3 mb-xl-0">
<button type="button" class="btn btn-outline-inverse-info btn-icon-text">
Feedback
<i class="mdi mdi-message-outline btn-icon-append"></i>
</button>
</div>
<div class="pe-1 mb-3 mb-xl-0">
<button type="button" class="btn btn-outline-inverse-info btn-icon-text">
Help
<i class="mdi mdi-help-circle-outline btn-icon-append"></i>
</button>
</div>
<div class="pe-1 mb-3 mb-xl-0">
<button type="button" class="btn btn-outline-inverse-info btn-icon-text">
Print
<i class="mdi mdi-printer btn-icon-append"></i>
</button>
</div>
</div>
</div>
</div>
<div class="row mt-4">
<div class="col-lg-8 grid-margin stretch-card">
<div class="card">
<div class="card-body">
<div class="row">
<div class="col-lg-4">
<h4 class="card-title">Sales Difference</h4>
<canvas id="salesDifference"></canvas>
<p class="mt-3 mb-4 mb-lg-0">Lorem ipsum dolor sit amet,
consectetur adipisicing elit.
</p>
</div>
<div class="col-lg-5">
<h4 class="card-title">Best Sellers</h4>
<div class="row">
<div class="col-sm-4">
<ul class="graphl-legend-rectangle">
<li><span class="bg-danger"></span>Automotive</li>
<li><span class="bg-warning"></span>Books</li>
<li><span class="bg-info"></span>Software</li>
<li><span class="bg-success"></span>Video games</li>
</ul>
</div>
<div class="col-sm-8 grid-margin">
<canvas id="bestSellers"></canvas>
</div>
</div>
<p class="mt-3 mb-4 mb-lg-0">Lorem ipsum dolor sit amet,
consectetur adipisicing elit.
</p>
</div>
<div class="col-lg-3">
<h4 class="card-title">Social Media Statistics</h4>
<div class="row">
<div class="col-sm-12">
<div class="progress progress-lg grouped mb-2">
<div class="progress-bar bg-danger" role="progressbar" style="width: 40%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div>
<div class="progress-bar bg-info" role="progressbar" style="width: 10%" aria-valuenow="50" aria-valuemin="0" aria-valuemax="100"></div>
<div class="progress-bar bg-warning" role="progressbar" style="width: 20%" aria-valuenow="50" aria-valuemin="0" aria-valuemax="100"></div>
<div class="progress-bar bg-success" role="progressbar" style="width: 30%" aria-valuenow="50" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</div>
<div class="col-sm-12">
<ul class="graphl-legend-rectangle">
<li><span class="bg-danger"></span>Instagram (15%)</li>
<li><span class="bg-warning"></span>Facebook (20%)</li>
<li><span class="bg-info"></span>Website (25%)</li>
<li><span class="bg-success"></span>Youtube (40%)</li>
</ul>
</div>
</div>
<p class="mb-0 mt-2">Lorem ipsum dolor sit amet,
consectetur adipisicing elit.
</p>
</div>
</div>
</div>
</div>
</div>
<div class="col-lg-4 mb-3 mb-lg-0">
<div class="card congratulation-bg text-center">
<div class="card-body pb-0">
<img src="images/dashboard/face29.png" alt="">
<h2 class="mt-3 text-white mb-3 font-weight-bold">Congratulations
Johnson
</h2>
<p>You have done 57.6% more sales today.
Check your new badge in your profile.
</p>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-sm-8 flex-column d-flex stretch-card">
<div class="row">
<div class="col-lg-4 d-flex grid-margin stretch-card">
<div class="card bg-primary">
<div class="card-body text-white">
<h3 class="font-weight-bold mb-3">18,39 (75GB)</h3>
<div class="progress mb-3">
<div class="progress-bar bg-warning" role="progressbar" style="width: 40%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div>
</div>
<p class="pb-0 mb-0">Bandwidth usage</p>
</div>
</div>
</div>
<div class="col-lg-4 d-flex grid-margin stretch-card">
<div class="card sale-diffrence-border">
<div class="card-body">
<h2 class="text-dark mb-2 font-weight-bold">$6475</h2>
<h4 class="card-title mb-2">Sales Difference</h4>
<small class="text-muted">APRIL 2019</small>
</div>
</div>
</div>
<div class="col-lg-4 d-flex grid-margin stretch-card">
<div class="card sale-visit-statistics-border">
<div class="card-body">
<h2 class="text-dark mb-2 font-weight-bold">$3479</h2>
<h4 class="card-title mb-2">Visit Statistics</h4>
<small class="text-muted">APRIL 2019</small>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-sm-12 grid-margin d-flex stretch-card">
<div class="card">
<div class="card-body">
<div class="d-flex align-items-center justify-content-between">
<h4 class="card-title mb-2">Sales Difference</h4>
<div class="dropdown">
<a href="#" class="text-success btn btn-link px-1"><i class="mdi mdi-refresh"></i></a>
<a href="#" class="text-success btn btn-link px-1 dropdown-toggle dropdown-arrow-none" data-bs-toggle="dropdown" id="settingsDropdownsales">
<i class="mdi mdi-dots-horizontal"></i></a>
<div class="dropdown-menu dropdown-menu-right navbar-dropdown" aria-labelledby="settingsDropdownsales">
<a class="dropdown-item">
<i class="mdi mdi-grease-pencil text-primary"></i>
Edit
</a>
<a class="dropdown-item">
<i class="mdi mdi-delete text-primary"></i>
Delete
</a>
</div>
</div>
</div>
<div>
<ul class="nav nav-tabs tab-no-active-fill" role="tablist">
<li class="nav-item">
<a class="nav-link active ps-2 pe-2" id="revenue-for-last-month-tab" data-bs-toggle="tab" href="#revenue-for-last-month" role="tab" aria-controls="revenue-for-last-month" aria-selected="true">Revenue for last month</a>
</li>
<li class="nav-item">
<a class="nav-link ps-2 pe-2" id="server-loading-tab" data-bs-toggle="tab" href="#server-loading" role="tab" aria-controls="server-loading" aria-selected="false">Server loading</a>
</li>
<li class="nav-item">
<a class="nav-link ps-2 pe-2" id="data-managed-tab" data-bs-toggle="tab" href="#data-managed" role="tab" aria-controls="data-managed" aria-selected="false">Data managed</a>
</li>
<li class="nav-item">
<a class="nav-link ps-2 pe-2" id="sales-by-traffic-tab" data-bs-toggle="tab" href="#sales-by-traffic" role="tab" aria-controls="sales-by-traffic" aria-selected="false">Sales by traffic</a>
</li>
</ul>
<div class="tab-content tab-no-active-fill-tab-content">
<div class="tab-pane fade show active" id="revenue-for-last-month" role="tabpanel" aria-labelledby="revenue-for-last-month-tab">
<div class="d-lg-flex justify-content-between">
<p class="mb-4">+5.2% vs last 7 days</p>
<div id="revenuechart-legend" class="revenuechart-legend">f</div>
</div>
<canvas id="revenue-for-last-month-chart"></canvas>
</div>
<div class="tab-pane fade" id="server-loading" role="tabpanel" aria-labelledby="server-loading-tab">
<div class="d-flex justify-content-between">
<p class="mb-4">+5.2% vs last 7 days</p>
<div id="serveLoading-legend" class="revenuechart-legend">f</div>
</div>
<canvas id="serveLoading"></canvas>
</div>
<div class="tab-pane fade" id="data-managed" role="tabpanel" aria-labelledby="data-managed-tab">
<div class="d-flex justify-content-between">
<p class="mb-4">+5.2% vs last 7 days</p>
<div id="dataManaged-legend" class="revenuechart-legend">f</div>
</div>
<canvas id="dataManaged"></canvas>
</div>
<div class="tab-pane fade" id="sales-by-traffic" role="tabpanel" aria-labelledby="sales-by-traffic-tab">
<div class="d-flex justify-content-between">
<p class="mb-4">+5.2% vs last 7 days</p>
<div id="salesTrafic-legend" class="revenuechart-legend">f</div>
</div>
<canvas id="salesTrafic"></canvas>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-sm-4 flex-column d-flex stretch-card">
<div class="row flex-grow">
<div class="col-sm-12 grid-margin stretch-card">
<div class="card">
<div class="card-body">
<div class="row">
<div class="col-lg-8">
<h3 class="font-weight-bold text-dark">Canada,Ontario</h3>
<p class="text-dark">Monday 3.00 PM</p>
<div class="d-lg-flex align-items-baseline mb-3">
<h1 class="text-dark font-weight-bold">23<sup class="font-weight-light"><small>o</small><small class="font-weight-medium">c</small></sup></h1>
<p class="text-muted ms-3">Partly cloudy</p>
</div>
</div>
<div class="col-lg-4">
<div class="position-relative">
<img src="images/dashboard/live.png" class="w-100" alt="">
<div class="live-info badge badge-success">Live</div>
</div>
</div>
</div>
<div class="row">
<div class="col-sm-12 mt-4 mt-lg-0">
<div class="bg-primary text-white px-4 py-4 card">
<div class="row">
<div class="col-sm-6 pl-lg-5">
<h2>$1635</h2>
<p class="mb-0">Your Iincome</p>
</div>
<div class="col-sm-6 climate-info-border mt-lg-0 mt-2">
<h2>$2650</h2>
<p class="mb-0">Your Spending</p>
</div>
</div>
</div>
</div>
</div>
<div class="row pt-3 mt-md-1">
<div class="col">
<div class="d-flex purchase-detail-legend align-items-center">
<div id="circleProgress1" class="p-2"></div>
<div>
<p class="font-weight-medium text-dark text-small">Sessions</p>
<h3 class="font-weight-bold text-dark mb-0">26.80%</h3>
</div>
</div>
</div>
<div class="col">
<div class="d-flex purchase-detail-legend align-items-center">
<div id="circleProgress2" class="p-2"></div>
<div>
<p class="font-weight-medium text-dark text-small">Users</p>
<h3 class="font-weight-bold text-dark mb-0">56.80%</h3>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-sm-12 grid-margin stretch-card">
<div class="card">
<div class="card-body">
<div class="row">
<div class="col-sm-12">
<div class="d-flex align-items-center justify-content-between">
<h4 class="card-title mb-0">Visits Today</h4>
<div class="dropdown">
<a href="#" class="text-success btn btn-link px-1"><i class="mdi mdi-refresh"></i></a>
<a href="#" class="text-success btn btn-link px-1 dropdown-toggle dropdown-arrow-none" data-bs-toggle="dropdown" id="profileDropdownvisittoday"><i class="mdi mdi-dots-horizontal"></i></a>
<div class="dropdown-menu dropdown-menu-right navbar-dropdown" aria-labelledby="profileDropdownvisittoday">
<a class="dropdown-item">
<i class="mdi mdi-grease-pencil text-primary"></i>
Edit
</a>
<a class="dropdown-item">
<i class="mdi mdi-delete text-primary"></i>
Delete
</a>
</div>
</div>
</div>
<p class="mt-1">Calculated in last 30 days</p>
<div class="d-lg-flex align-items-center justify-content-between">
<h1 class="font-weight-bold text-dark">4332</h1>
<div class="mb-3">
<button type="button" class="btn btn-outline-light text-dark font-weight-normal">Day</button>
<button type="button" class="btn btn-outline-light text-dark font-weight-normal">Month</button>
</div>
</div>
<canvas id="visitorsToday"></canvas>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-lg-2 grid-margin stretch-card">
<div class="card">
<div class="card-body pb-0">
<div class="d-flex align-items-center justify-content-between">
<h2 class="text-success font-weight-bold">18390</h2>
<i class="mdi mdi-account-outline mdi-18px text-dark"></i>
</div>
</div>
<canvas id="newClient"></canvas>
<div class="line-chart-row-title">MY NEW CLIENTS</div>
</div>
</div>
<div class="col-lg-2 grid-margin stretch-card">
<div class="card">
<div class="card-body pb-0">
<div class="d-flex align-items-center justify-content-between">
<h2 class="text-danger font-weight-bold">839</h2>
<i class="mdi mdi-refresh mdi-18px text-dark"></i>
</div>
</div>
<canvas id="allProducts"></canvas>
<div class="line-chart-row-title">All Products</div>
</div>
</div>
<div class="col-lg-2 grid-margin stretch-card">
<div class="card">
<div class="card-body pb-0">
<div class="d-flex align-items-center justify-content-between">
<h2 class="text-info font-weight-bold">244</h2>
<i class="mdi mdi-file-document-outline mdi-18px text-dark"></i>
</div>
</div>
<canvas id="invoices"></canvas>
<div class="line-chart-row-title">NEW INVOICES</div>
</div>
</div>
<div class="col-lg-2 grid-margin stretch-card">
<div class="card">
<div class="card-body pb-0">
<div class="d-flex align-items-center justify-content-between">
<h2 class="text-warning font-weight-bold">3259</h2>
<i class="mdi mdi-folder-outline mdi-18px text-dark"></i>
</div>
</div>
<canvas id="projects"></canvas>
<div class="line-chart-row-title">All PROJECTS</div>
</div>
</div>
<div class="col-lg-2 grid-margin stretch-card">
<div class="card">
<div class="card-body pb-0">
<div class="d-flex align-items-center justify-content-between">
<h2 class="text-secondary font-weight-bold">586</h2>
<i class="mdi mdi-cart-outline mdi-18px text-dark"></i>
</div>
</div>
<canvas id="orderRecieved"></canvas>
<div class="line-chart-row-title">Orders Received</div>
</div>
</div>
<div class="col-lg-2 grid-margin stretch-card">
<div class="card">
<div class="card-body pb-0">
<div class="d-flex align-items-center justify-content-between">
<h2 class="text-dark font-weight-bold">7826</h2>
<i class="mdi mdi-cash text-dark mdi-18px"></i>
</div>
</div>
<canvas id="transactions"></canvas>
<div class="line-chart-row-title">TRANSACTIONS</div>
</div>
</div>
</div>
<div class="row">
<div class="col-sm-6 grid-margin grid-margin-md-0 stretch-card">
<div class="card">
<div class="card-body">
<div class="d-flex align-items-center justify-content-between">
<h4 class="card-title">Support Tracker</h4>
<h4 class="text-success font-weight-bold">Tickets<span class="text-dark ms-3">163</span></h4>
</div>
<div id="support-tracker-legend" class="support-tracker-legend"></div>
<canvas id="supportTracker"></canvas>
</div>
</div>
</div>
<div class="col-sm-6 grid-margin grid-margin-md-0 stretch-card">
<div class="card">
<div class="card-body">
<div class="d-lg-flex align-items-center justify-content-between mb-4">
<h4 class="card-title">Product Orders</h4>
<p class="text-dark">+5.2% vs last 7 days</p>
</div>
<div class="product-order-wrap padding-reduced">
<div id="productorder-gage" class="gauge productorder-gage"></div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- content-wrapper ends -->
<!-- partial:partials/_footer.html -->
<footer class="footer">
<div class="footer-wrap">
<div class="d-sm-flex justify-content-center justify-content-sm-between">
<span class="text-muted text-center text-sm-left d-block d-sm-inline-block">Copyright © <a href="https://www.bootstrapdash.com/" target="_blank">bootstrapdash.com </a>2021</span>
<span class="float-none float-sm-right d-block mt-1 mt-sm-0 text-center">Only the best <a href="https://www.bootstrapdash.com/" target="_blank"> Bootstrap dashboard </a> templates</span>
</div>
</div>
</footer>
<!-- partial -->
</div>
<!-- main-panel ends -->
</div>
@endsection

315
resources/views/home.bak Normal file
View File

@@ -0,0 +1,315 @@
@extends('layouts.master')
@section('content')
<div class="content-body">
<!-- row -->
<div class="container-fluid">
<div class="d-flex align-items-center mb-4 flex-wrap">
{{-- <h3 class="me-auto">RSUI Kustati </h3> --}}
<h3 class="me-auto">{{ $parameter->namalokasi ?? '' }} </h3>
{{-- <div>
<a href="new-job.html" class="btn btn-primary me-3"><i class="fas fa-plus me-2"></i>Add New Job</a>
<a href="javascript:void(0);" class="icon-btn me-3"> <i class="fas fa-envelope"></i></a>
<a href="javascript:void(0);" class="icon-btn me-3"><i class="fas fa-phone-alt"></i></a>
<a href="javascript:void(0);" class="icon-btn"><i class="fas fa-info"></i></a>
</div> --}}
</div>
<div class="row">
<div class="col-xl-6">
<div class="row">
<div class="col-xl-12">
<div class="card">
<div class="card-body">
<div class="row separate-row">
<div class="col-sm-6">
<div class="job-icon pb-4 d-flex justify-content-between">
<div>
<div class="d-flex align-items-center mb-1">
<h2 class="mb-0 lh-1">{{ $VeriTrans ?? '' }}</h2>
{{-- <span class="ms-3 badge badge-success light">+0.5%</span> --}}
</div>
<span class="badge badge-secondary">Verified Transaction</span>
</div>
<div id="NewCustomers"></div>
</div>
</div>
<div class="col-sm-6">
<div class="job-icon pb-4 pt-4 pt-sm-0 d-flex justify-content-between">
<div>
<div class="d-flex align-items-center mb-1">
<h2 class="mb-0 lh-1">{{ $incidenTrans ?? '' }}</h2>
</div>
<span class="badge light badge-danger">Incident Today</span>
</div>
<div id="NewCustomers1"></div>
</div>
</div>
{{-- <div class="col-sm-3">
</div> --}}
<div class="col-sm-6">
<div class="job-icon pt-4 pb-sm-0 pb-4 d-flex justify-content-between">
<div>
<div class="d-flex align-items-center mb-1">
<h2 class="mb-0 lh-1">{{ $pendingTrans ?? '' }}</h2>
<span class="ms-3 badge badge-danger light">-2.0%</span>
</div>
<span class="badge light badge-warning">Pending Transaction</span>
</div>
<div id="NewCustomers2"></div>
</div>
</div>
{{-- <div class="col-sm-3">
</div> --}}
<div class="col-sm-6">
<div class="job-icon pt-4 d-flex justify-content-between">
<div>
<div class="d-flex align-items-center mb-1">
<h2 class="mb-0 lh-1">{{ $inSite ?? '' }}</h2>
</div>
<span class="badge light badge-warning">Kendaraan belum keluar</span>
</div>
<div id="NewCustomers3"></div>
</div>
</div>
</div>
</div>
</div>
</div>
{{-- <div class="col-xl-12">
<div class="card " id="user-activity">
<div class="card-header border-0 pb-0 flex-wrap">
<h4 class="card-title mb-0">Vacancy Stats</h4>
<div class="mt-3 mt-sm-0">
<ul class="nav nav-tabs vacany-tabs style-1" role="tablist">
<li class="nav-item">
<a class="nav-link " data-bs-toggle="tab" data-series="Daily" href="#Daily" role="tab">Daily</a>
</li>
<li class="nav-item">
<a class="nav-link " data-bs-toggle="tab" data-series="Weekly" href="#Weekly" role="tab" >Weekly</a>
</li>
<li class="nav-item">
<a class="nav-link active" data-bs-toggle="tab" data-series="Monthly" href="#Monthly" role="tab" >Monthly</a>
</li>
</ul>
</div>
</div>
<div class="card-body pt-3 px-sm-3 px-0 pb-1">
<div class="pb-sm-4 mb-3 d-flex flex-wrap px-3">
<div class="d-flex align-items-center">
<svg class="me-2" xmlns="http://www.w3.org/2000/svg" width="13" height="13" viewBox="0 0 13 13">
<rect width="13" height="13" rx="6.5" fill="#35c556"/>
</svg>
<span class="text-dark fs-13 font-w500">Application Sent</span>
</div>
<div class="application d-flex align-items-center">
<svg class="me-1" xmlns="http://www.w3.org/2000/svg" width="13" height="13" viewBox="0 0 13 13">
<rect width="13" height="13" rx="6.5" fill="#3f4cfe"/>
</svg>
<span class="text-dark fs-13 font-w500">Interviews</span>
</div>
<div class="application d-flex align-items-center">
<svg class="me-1" xmlns="http://www.w3.org/2000/svg" width="13" height="13" viewBox="0 0 13 13">
<rect width="13" height="13" rx="6.5" fill="#f34040"/>
</svg>
<span class="text-dark fs-13 font-w500">Rejected</span>
</div>
</div>
<div class="">
<div id="vacancyChart" class="ltr"></div>
</div>
</div>
</div>
</div> --}}
</div>
</div>
<div class="col-xl-6">
<div class="row">
{{-- <div class="col-xl-12">
<div class="card">
<div class="card-header border-0 pb-0">
<h4 class="card-title">Network</h4>
</div>
<div class="card-body pb-2">
<div class="row sp10">
<div class="col-xl-3 col-md-3 col-6 mb-4 text-center">
<div class="d-inline-block ms-auto me-auto mb-md-3 mb-2 db-donut-chart-sale me-4">
<span class="donut" data-peity='{ "fill": ["var(--primary)", "var(--light)"], "innerRadius": 38, "radius": 10}'>6/9</span>
<h4 class="mb-0 pie-label">66%</h4>
</div>
<h5 class="mb-1">Engineer</h5>
<p class="mb-0">5,050 Vacancy</p>
</div>
<div class="col-xl-3 col-md-3 col-6 mb-4 text-center">
<div class="d-inline-block ms-auto me-auto mb-md-3 mb-2 db-donut-chart-sale me-4">
<span class="donut" data-peity='{ "fill": ["var(--primary)", "var(--light)"], "innerRadius": 38, "radius": 10}'>3/9</span>
<h4 class="mb-0 pie-label">31%</h4>
</div>
<h5 class="mb-1">Designer</h5>
<p class="mb-0">10,524 Vacany</p>
</div>
<div class="col-xl-3 col-md-3 col-6 mb-4 text-center">
<div class="d-inline-block ms-auto me-auto mb-md-3 mb-2 db-donut-chart-sale me-4">
<span class="donut" data-peity='{ "fill": ["var(--primary)", "var(--light)"], "innerRadius": 38, "radius": 10}'>6/8</span>
<h4 class="mb-0 pie-label">75%</h4>
</div>
<h5 class="mb-1">Manager</h5>
<p class="mb-0">621 Vacancy</p>
</div>
<div class="col-xl-3 col-md-3 col-6 mb-4 text-center">
<div class="d-inline-block ms-auto me-auto mb-md-3 mb-2 db-donut-chart-sale me-4">
<span class="donut" data-peity='{ "fill": ["var(--primary)", "var(--light)"], "innerRadius": 38, "radius": 10}'>7/10</span>
<h4 class="mb-0 pie-label">62%</h4>
</div>
<h5 class="mb-1">Programmer</h5>
<p class="mb-0">9,662 Vacancy</p>
</div>
</div>
</div>
</div>
</div> --}}
{{-- <div class="col-xl-12">
<div class="card">
<div class="card-body">
<div class="row ">
<div class="col-xl-8 col-xxl-7 col-sm-7">
<div class="update-profile d-flex">
<img src="images/profile/pic1.jpg" alt="">
<div class="ms-4">
<h3 class="mb-0">Franklin Jr</h3>
<span class="text-primary d-block mb-xl-3 mb-1">UI / UX Designer</span>
<span><i class="fas fa-map-marker-alt me-1"></i>Medan, Sumatera Utara - ID</span>
</div>
</div>
</div>
<div class="col-xl-4 col-xxl-5 col-sm-5 sm-mt-auto mt-3 text-sm-end">
<a href="javascript:void(0);" class="btn btn-primary">Update Profile</a>
</div>
</div>
<div class="row mt-4 align-items-center">
<h4 class="fs-20 mb-0 mt-1">Skills</h4>
<div class="col-xl-6 col-sm-6">
<div class="progress default-progress">
<div class="progress-bar bg-green progress-animated" style="width: 90%; height:8px;" role="progressbar">
<span class="sr-only">90% Complete</span>
</div>
</div>
<div class="d-flex align-items-end mt-2 pb-4 justify-content-between">
<span class="font-w500">Figma</span>
<h6 class="mb-0">90%</h6>
</div>
<div class="progress default-progress">
<div class="progress-bar bg-info progress-animated" style="width: 68%; height:8px;" role="progressbar">
<span class="sr-only">45% Complete</span>
</div>
</div>
<div class="d-flex align-items-end mt-2 pb-4 justify-content-between">
<span class="font-w500">Adobe XD</span>
<h6 class="mb-0">68%</h6>
</div>
<div class="progress default-progress">
<div class="progress-bar bg-blue progress-animated" style="width: 85%; height:8px;" role="progressbar">
<span class="sr-only">85% Complete</span>
</div>
</div>
<div class="d-flex align-items-end mt-2 justify-content-between">
<span class="font-w500">Photoshop</span>
<h6 class="mb-0">85%</h6>
</div>
</div>
<div class="col-xl-6 col-sm-6">
<div id="pieChart1"></div>
</div>
</div>
</div>
</div>
</div> --}}
</div>
</div>
</div>
</div>
</div>
{{-- <div class="container">
<div class="row justify-content-center">
<div class="col-md-8">
<div class="card">
<div class="card-header">{{ __('Dashboard') }}</div>
<div class="card-body">
@if (session('status'))
<div class="alert alert-success" role="alert">
{{ session('status') }}
</div>
@endif
{{ __('You are logged in!') }}
</div>
</div>
</div>
</div>
</div> --}}
@endsection
@section('javascript')
<script src="vendor/bootstrap-select/dist/js/bootstrap-select.min.js"></script>
<script src="vendor/bootstrap-datepicker-master/js/bootstrap-datepicker.min.js"></script>
<!-- Apex Chart -->
<script src="vendor/apexchart/apexchart.js"></script>
<script src="vendor/chartjs/chart.bundle.min.js"></script>
<!-- Chart piety plugin files -->
<script src="vendor/peity/jquery.peity.min.js"></script>
<!-- Dashboard 1 -->
<script src="js/dashboard/dashboard-1.js"></script>
<script src="vendor/owl-carousel/owl.carousel.js"></script>
<script src="js/custom.min.js"></script>
<script src="js/dlabnav-init.js"></script>
<script>
function JobickCarousel()
{
/* testimonial one function by = owl.carousel.js */
jQuery('.front-view-slider').owlCarousel({
loop:false,
margin:30,
nav:false,
autoplaySpeed: 3000,
navSpeed: 3000,
autoWidth:true,
paginationSpeed: 3000,
slideSpeed: 3000,
smartSpeed: 3000,
autoplay: false,
animateOut: 'fadeOut',
dots:false,
navText: ['', ''],
responsive:{
0:{
items:1,
margin:10
},
480:{
items:1
},
767:{
items:3
},
1750:{
items:3
}
}
})
}
jQuery(window).on('load',function(){
setTimeout(function(){
JobickCarousel();
}, 1000);
});
</script>
@endsection

View File

@@ -0,0 +1,83 @@
<!doctype html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- CSRF Token -->
<meta name="csrf-token" content="{{ csrf_token() }}">
<title>{{ config('app.name', 'Laravel') }}</title>
<!-- Scripts -->
<script src="{{ asset('js/app.js') }}" defer></script>
<!-- Fonts -->
<link rel="dns-prefetch" href="//fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css?family=Nunito" rel="stylesheet">
<!-- Styles -->
<link href="{{ asset('css/app.css') }}" rel="stylesheet">
</head>
<body>
<div id="app">
<nav class="navbar navbar-expand-md navbar-light bg-white shadow-sm">
<div class="container">
<a class="navbar-brand" href="{{ url('/') }}">
{{ config('app.name', 'Laravel') }}
</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="{{ __('Toggle navigation') }}">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<!-- Left Side Of Navbar -->
<ul class="navbar-nav me-auto">
</ul>
<!-- Right Side Of Navbar -->
<ul class="navbar-nav ms-auto">
<!-- Authentication Links -->
@guest
@if (Route::has('login'))
<li class="nav-item">
<a class="nav-link" href="{{ route('login') }}">{{ __('Login') }}</a>
</li>
@endif
@if (Route::has('register'))
<li class="nav-item">
<a class="nav-link" href="{{ route('register') }}">{{ __('Register') }}</a>
</li>
@endif
@else
<li class="nav-item dropdown">
<a id="navbarDropdown" class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false" v-pre>
{{ Auth::user()->name }}
</a>
<div class="dropdown-menu dropdown-menu-end" aria-labelledby="navbarDropdown">
<a class="dropdown-item" href="{{ route('logout') }}"
onclick="event.preventDefault();
document.getElementById('logout-form').submit();">
{{ __('Logout') }}
</a>
<form id="logout-form" action="{{ route('logout') }}" method="POST" class="d-none">
@csrf
</form>
</div>
</li>
@endguest
</ul>
</div>
</div>
</nav>
<main class="py-4">
@yield('content')
</main>
</div>
</body>
</html>

View File

@@ -0,0 +1,105 @@
<!DOCTYPE html>
<html lang="id">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="csrf-token" content="{{ csrf_token() }}">
<title>Application</title>
<!-- base:css -->
<link rel="stylesheet" href="{{ asset('vendors/mdi/css/materialdesignicons.min.css') }}">
<link rel="stylesheet" href="{{ asset('vendors/base/vendor.bundle.base.css') }}">
<!-- endinject -->
<!-- plugin css for this page -->
<!-- End plugin css for this page -->
<!-- inject:css -->
<link rel="stylesheet" href="{{ asset('css/style.css') }}">
<!-- endinject -->
<link rel="shortcut icon" href="{{ asset('images/logo.ico') }}" />
@yield('styles')
</head>
<body>
<div class="container-scroller">
<div class="horizontal-menu">
<nav class="navbar top-navbar col-lg-12 col-12 p-0">
<div class="container-fluid">
<div class="navbar-menu-wrapper d-flex align-items-center justify-content-between">
<ul class="navbar-nav navbar-nav-left">\<li class="nav-item dropdown">
<a class="nav-link count-indicator dropdown-toggle d-flex align-items-center justify-content-center" id="notificationDropdown" href="#" data-bs-toggle="dropdown">
<i class="mdi mdi-bell mx-0"></i>
<span class="count bg-success">2</span>
</a>
<div class="dropdown-menu dropdown-menu-right navbar-dropdown preview-list" aria-labelledby="notificationDropdown">
<p class="mb-0 font-weight-normal float-left dropdown-header">Notifications</p>
<a class="dropdown-item preview-item">
<div class="preview-thumbnail">
<div class="preview-icon bg-success">
<i class="mdi mdi-information mx-0"></i>
</div>
</div>
<div class="preview-item-content">
<h6 class="preview-subject font-weight-normal">Application Error</h6>
<p class="font-weight-light small-text mb-0 text-muted">
Just now
</p>
</div>
</a>
</div>
</li>
<li class="nav-item dropdown">
<a href="#" class="nav-link count-indicator "><i class="mdi mdi-message-reply-text"></i></a>
</li>
</ul>
<ul class="navbar-nav navbar-nav-right">
<li class="nav-item nav-profile dropdown">
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown" id="profileDropdown">
<span class="nav-profile-name">Johnson</span>
<span class="online-status"></span>
<img src="../../images/faces/face28.png" alt="profile"/>
</a>
<div class="dropdown-menu dropdown-menu-right navbar-dropdown" aria-labelledby="profileDropdown">
<a class="dropdown-item">
<i class="mdi mdi-settings text-primary"></i>
Settings
</a>
<a class="dropdown-item">
<i class="mdi mdi-logout text-primary"></i>
Logout
</a>
</div>
</li>
</ul>
</div>
</div>
</nav>
</div>
{{-- @include('layouts.partial.horizontal-menu') --}}
@yield('content')
<!-- page-body-wrapper ends -->
</div>
<!-- container-scroller -->
<!-- base:js -->
<script src="{{ asset('vendors/base/vendor.bundle.base.js') }}"></script>
<!-- endinject -->
<!-- Plugin js for this page-->
<!-- End plugin js for this page-->
<!-- inject:js -->
{{-- <script src="{{ asset('js/template.js') }}"></script> --}}
<!-- endinject -->
<!-- plugin js for this page -->
<!-- End plugin js for this page -->
<script src="{{ asset('vendors/chart.js/Chart.min.js') }}"></script>
<script src="{{ asset('vendors/progressbar.js/progressbar.min.js') }}"></script>
<script src="{{ asset('vendors/chartjs-plugin-datalabels/chartjs-plugin-datalabels.js') }}"></script>
<script src="{{ asset('vendors/justgage/raphael-2.1.4.min.js') }}"></script>
<script src="{{ asset('vendors/justgage/justgage.js') }}"></script>
<script src="{{ asset('js/jquery.cookie.js') }}" type="text/javascript"></script>
<!-- Custom js for this page-->
{{-- <script src="{{ asset('js/dashboard.js') }}"></script> --}}
<!-- End custom js for this page-->
@yield('javascript')
</body>
</html>

View File

@@ -0,0 +1,51 @@
<!DOCTYPE html>
<html lang="en">
<head>
<!-- Meta -->
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="author" content="DexignLab">
<meta name="robots" content="" >
<meta name="keywords" content="admin dashboard, admin template, analytics, bootstrap, bootstrap 5, bootstrap 5 admin template, job board admin, job portal admin, modern, responsive admin dashboard, sales dashboard, sass, ui kit, web app, frontend">
<meta name="description" content="We proudly present Jobick, a Job Admin dashboard HTML Template, If you are hiring a job expert you would like to build a superb website for your Jobick, it's a best choice.">
<meta property="og:title" content="Jobick : Job Admin Dashboard Bootstrap 5 Template + FrontEnd">
<meta property="og:description" content="We proudly present Jobick, a Job Admin dashboard HTML Template, If you are hiring a job expert you would like to build a superb website for your Jobick, it's a best choice." >
<meta property="og:image" content="https://jobick.dexignlab.com/xhtml/social-image.png">
<meta name="format-detection" content="telephone=no">
<meta name="twitter:title" content="Jobick : Job Admin Dashboard Bootstrap 5 Template + FrontEnd">
<meta name="twitter:description" content="We proudly present Jobick, a Job Admin dashboard HTML Template, If you are hiring a job expert you would like to build a superb website for your Jobick, it's a best choice.">
<meta name="twitter:image" content="https://jobick.dexignlab.com/xhtml/social-image.png">
<meta name="twitter:card" content="summary_large_image">
<!-- Mobile Specific -->
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- PAGE TITLE HERE -->
<title>PCMS - {{ $locationSettings->namaperusahaan }} | Powered by ITCN Parking Support</title>
<!-- Favicon icon -->
<link rel="shortcut icon" type="image/png" href="{{asset('images/favicon.png') }}">
<link href="{{asset('vendor/bootstrap-select/dist/css/bootstrap-select.min.css') }}" rel="stylesheet">
<link class="main-css" href="{{asset('css/style.css') }}" rel="stylesheet">
</head>
<body>
@yield('content')
<!--**********************************
Scripts
***********************************-->
<!-- Required vendors -->
<script src="{{asset('vendor/global/global.min.js')}}"></script>
<script src="{{asset('vendor/bootstrap-select/dist/js/bootstrap-select.min.js')}}"></script>
<script src="{{asset('js/custom.min.js')}}"></script>
<script src="{{asset('js/dlabnav-init.js')}}"></script>
</body>
</html>

View File

@@ -0,0 +1,141 @@
<!DOCTYPE html>
<html lang="en">
<head>
<!-- Meta -->
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="author" content="ItcnDevs">
<meta name="robots" content="" >
<meta name="keywords" content="parkir control, parkir monitoring, control system">
<meta name="description" content="Control and MOnitoring your parking system easy">
<meta property="og:title" content="ITCN Parking Support">
<meta property="og:description" content="We proudly present Jobick, a Job Admin dashboard HTML Template, If you are hiring a job expert you would like to build a superb website for your Jobick, it's a best choice." >
<meta property="og:image" content="https://itcn.co.id">
<meta name="format-detection" content="telephone=+62 812 97797 957">
<meta name="csrf-token" content="{{ csrf_token() }}">
<!-- Mobile Specific -->
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Page Title -->
<title>PCMS - {{ $parameter->namaperusahaan }} | Powered by ITCN Parking Support</title>
<!-- Favicon icon -->
<link rel="shortcut icon" type="image/png" href="images/favicon.png">
<!-- All StyleSheet -->
<link href="{{asset('vendor/bootstrap-select/dist/css/bootstrap-select.min.css') }}" rel="stylesheet">
<link href="{{asset('vendor/bootstrap-datepicker-master/css/bootstrap-datepicker.min.css') }}" rel="stylesheet">
<link href="{{asset('vendor/owl-carousel/owl.carousel.css') }}" rel="stylesheet">
<!-- Globle CSS -->
<link class="main-css" href="{{asset('css/style.css') }}" rel="stylesheet">
@yield('styles')
<style>
.logo {
padding-top: 1em;
}
.indented {
display: inline-block;
padding-left: 2em; /* Atur padding sesuai kebutuhan */
}
.text-1 {
display: inline-block;
}
.text-2 {
display: inline-block;
padding-left: 2em; /* Atur padding sesuai kebutuhan */
}
@media (max-width: 768px) {
.word2 {
padding-left: 0;
}
}
</style>
<livewire:styles />
</head>
<body>
{{-- <livewire:scripts /> --}}
<!--*******************
Preloader start
********************-->
<div id="preloader">
<div class="lds-ripple">
<div></div>
<div></div>
</div>
</div>
<!--*******************
Preloader end
********************-->
<!--**********************************
Main wrapper start
***********************************-->
<div id="main-wrapper">
<!--**********************************
Nav header start
***********************************-->
<div class="nav-header">
<a href="javascript:void(0)" class="brand-logo">
<img src="images/profile/posthink-logo.jpeg" width="50" alt="Logo">
<h3>
<span class="text-1">{{ strtok($parameter->namaperusahaan, ' ') }}</span><br>
<span class="text-2">{{ str_replace(strtok($parameter->namaperusahaan, ' '), '', $parameter->namaperusahaan) }}</span>
</h3>
</a>
<div class="nav-control">
<div class="hamburger">
<span class="line"></span><span class="line"></span><span class="line"></span>
</div>
</div>
</div>
<!--************ Header start *****************-->
@include('layouts.partial.header')
<!--******** Header end ti-comment-alt ********************-->
<!--******* Sidebar start ***************-->
@include('layouts.partial.sidebar')
<!--******* Sidebar end **************-->
<!--*************** Content body start **********************-->
@yield('content')
<!--*************** Content body end *****************-->
<!--**********************************
Footer start
***********************************-->
@include('layouts.partial.footer')
<!--**********************************
Footer end
***********************************-->
<!--**********************************
Support ticket button start
***********************************-->
<!--**********************************
Support ticket button end
***********************************-->
</div>
<!--**********************************
Scripts
***********************************-->
<!-- Required vendors -->
<script src="vendor/global/global.min.js"></script>
@yield('javascript')
</body>
</html>

View File

@@ -0,0 +1,53 @@
<!DOCTYPE html>
<html lang="en">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="csrf-token" content="{{ csrf_token() }}">
<title>All New Manufacture</title>
<!-- base:css -->
<link rel="stylesheet" href="{{ asset('vendors/mdi/css/materialdesignicons.min.css') }}">
<link rel="stylesheet" href="{{ asset('vendors/base/vendor.bundle.base.css') }}">
<!-- endinject -->
<!-- plugin css for this page -->
<!-- End plugin css for this page -->
<!-- inject:css -->
<link rel="stylesheet" href="{{ asset('css/style.css') }}">
<!-- endinject -->
<link rel="shortcut icon" href="{{ asset('images/logo.ico') }}" />
@yield('styles')
</head>
<body>
<div class="container-scroller">
<!-- partial:partials/_horizontal-navbar.html -->
@include('layouts.partial.horizontal-menu')
@yield('content')
<!-- page-body-wrapper ends -->
</div>
<!-- container-scroller -->
<!-- base:js -->
<script src="{{ asset('vendors/base/vendor.bundle.base.js') }}"></script>
<!-- endinject -->
<!-- Plugin js for this page-->
<!-- End plugin js for this page-->
<!-- inject:js -->
{{-- <script src="{{ asset('js/template.js') }}"></script> --}}
<!-- endinject -->
<!-- plugin js for this page -->
<!-- End plugin js for this page -->
<script src="{{ asset('vendors/chart.js/Chart.min.js') }}"></script>
<script src="{{ asset('vendors/progressbar.js/progressbar.min.js') }}"></script>
<script src="{{ asset('vendors/chartjs-plugin-datalabels/chartjs-plugin-datalabels.js') }}"></script>
<script src="{{ asset('vendors/justgage/raphael-2.1.4.min.js') }}"></script>
<script src="{{ asset('vendors/justgage/justgage.js') }}"></script>
<script src="{{ asset('js/jquery.cookie.js') }}" type="text/javascript"></script>
<!-- Custom js for this page-->
{{-- <script src="{{ asset('js/dashboard.js') }}"></script> --}}
<!-- End custom js for this page-->
@yield('javascript')
</body>
</html>

View File

@@ -0,0 +1,5 @@
<div class="footer">
<div class="copyright">
<p>Copyright © Designed &amp; Developed by <a href="https://itcn.co.id/" target="_blank">itcn.co.id</a> 2024 | All Right Reserved</p>
</div>
</div>

View File

@@ -0,0 +1,46 @@
<div class="header">
<div class="header-content">
<nav class="navbar navbar-expand">
<div class="collapse navbar-collapse justify-content-between">
<div class="header-left">
<div class="dashboard_bar">
Parking Control and Monitoring System
</div>
</div>
<ul class="navbar-nav header-right">
<li class="nav-item dropdown notification_dropdown">
<a class="nav-link bell dlab-theme-mode p-0" href="javascript:void(0);">
<i id="icon-light" class="fas fa-sun"></i>
<i id="icon-dark" class="fas fa-moon"></i>
</a>
</li>
<li class="nav-item dropdown header-profile">
<a class="nav-link" href="javascript:void(0);" role="button" data-bs-toggle="dropdown">
<img src="images/profile/smile.png" width="7" alt="">
</a>
<div class="dropdown-menu dropdown-menu-end">
<a href="app-profile.html" class="dropdown-item ai-icon">
<svg id="icon-user2" xmlns="http://www.w3.org/2000/svg" class="text-primary" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2"></path><circle cx="12" cy="7" r="4"></circle></svg>
<span class="ms-2">Profile </span>
</a>
<a href="email-inbox.html" class="dropdown-item ai-icon">
<svg id="icon-inbox1" xmlns="http://www.w3.org/2000/svg" class="text-success" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z"></path><polyline points="22,6 12,13 2,6"></polyline></svg>
<span class="ms-2">Inbox </span>
</a>
<a href="{{ route('logout') }}" class="dropdown-item ai-icon" onclick="event.preventDefault(); document.getElementById('logout-form').submit();">
<svg xmlns="http://www.w3.org/2000/svg" class="text-danger" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4"></path><polyline points="16 17 21 12 16 7"></polyline><line x1="21" y1="12" x2="9" y2="12"></line></svg>
<span class="ms-2">Logout </span>
</a>
<form id="logout-form" action="{{ route('logout') }}" method="POST" class="d-none">
@csrf
</form>
</div>
</li>
</ul>
</div>
</nav>
</div>
</div>

View File

@@ -0,0 +1,120 @@
<div class="horizontal-menu">
<nav class="bottom-navbar">
<div class="container">
<ul class="nav page-navigation">
<li class="nav-item">
<a class="nav-link" href="/dashboard">
<i class="mdi mdi-file-document-box menu-icon"></i>
<span class="menu-title">Dashboard</span>
</a>
</li>
<li class="nav-item">
<a href="#" class="nav-link">
<i class="mdi mdi-account-multiple menu-icon"></i>
<span class="menu-title">Operasional</span>
<i class="menu-arrow"></i>
</a>
<div class="submenu">
<ul>
<li class="nav-item"><a class="nav-link" href="pages/ui-features/buttons.html">Transaksi 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/member">Member</a></li>
</ul>
</div>
</li>
<li class="nav-item">
<a href="#" class="nav-link">
<i class="mdi mdi-cube-outline menu-icon"></i>
<span class="menu-title">UI Elements</span>
<i class="menu-arrow"></i>
</a>
<div class="submenu">
<ul>
<li class="nav-item"><a class="nav-link" href="/report/laporan-semua-transaksi">Buttons</a></li>
<li class="nav-item"><a class="nav-link" href="pages/ui-features/typography.html">Typography</a></li>
</ul>
</div>
</li>
<li class="nav-item">
<a href="pages/forms/basic_elements.html" class="nav-link">
<i class="mdi mdi-chart-areaspline menu-icon"></i>
<span class="menu-title">Laporan</span>
<i class="menu-arrow"></i>
</a>
<div class="submenu">
<ul>
<li class="nav-item"><a class="nav-link" href="/report/stiker/harian">Laporan Transaksi harian</a></li>
<li class="nav-item"><a class="nav-link" href="pages/ui-features/typography.html">Typography</a></li>
</ul>
</div>
</li>
<li class="nav-item">
<a href="pages/charts/chartjs.html" class="nav-link">
<i class="mdi mdi-finance menu-icon"></i>
<span class="menu-title">Charts</span>
<i class="menu-arrow"></i>
</a>
</li>
<li class="nav-item">
<a href="pages/tables/basic-table.html" class="nav-link">
<i class="mdi mdi-grid menu-icon"></i>
<span class="menu-title">Tables</span>
<i class="menu-arrow"></i>
</a>
</li>
<li class="nav-item">
<a href="pages/icons/mdi.html" class="nav-link">
<i class="mdi mdi-emoticon menu-icon"></i>
<span class="menu-title">Icons</span>
<i class="menu-arrow"></i>
</a>
</li>
<li class="nav-item">
<a href="#" class="nav-link">
<i class="mdi mdi-codepen menu-icon"></i>
<span class="menu-title">Sample Pages</span>
<i class="menu-arrow"></i>
</a>
<div class="submenu">
<ul class="submenu-item">
<li class="nav-item"><a class="nav-link" href="pages/samples/login.html">Login</a></li>
<li class="nav-item"><a class="nav-link" href="pages/samples/login-2.html">Login 2</a></li>
<li class="nav-item"><a class="nav-link" href="pages/samples/register.html">Register</a></li>
<li class="nav-item"><a class="nav-link" href="pages/samples/register-2.html">Register 2</a></li>
<li class="nav-item"><a class="nav-link" href="pages/samples/lock-screen.html">Lockscreen</a></li>
</ul>
</div>
</li>
<li class="nav-item">
<a href="docs/documentation.html" class="nav-link">
<i class="mdi mdi-file-document-box-outline menu-icon"></i>
<span class="menu-title">Documentation</span></a>
</li>
</ul>
</div>
<div class="navbar-menu-wrapper d-flex align-items-center justify-content-between">
<ul class="navbar-nav navbar-nav-right">
<li class="nav-item nav-profile dropdown">
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown" id="profileDropdown">
<span class="nav-profile-name">Johnson</span>
<span class="online-status"></span>
<img src="{{ asset('images/faces/face28.png') }}" alt="profile"/>
</a>
<div class="dropdown-menu dropdown-menu-right navbar-dropdown" aria-labelledby="profileDropdown">
<a class="dropdown-item">
<i class="mdi mdi-settings text-primary"></i>
Settings
</a>
<a href="{{ route('logout') }}" class="dropdown-item ai-icon" onclick="event.preventDefault(); document.getElementById('logout-form').submit();">
<svg xmlns="http://www.w3.org/2000/svg" class="text-danger" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4"></path><polyline points="16 17 21 12 16 7"></polyline><line x1="21" y1="12" x2="9" y2="12"></line></svg>
<span class="ms-2">Logout </span>
</a>
</div>
</li>
</ul>
<button class="navbar-toggler navbar-toggler-right d-lg-none align-self-center" type="button" data-toggle="horizontal-menu-toggle">
<span class="mdi mdi-menu"></span>
</button>
</div>
</nav>
</div>

View File

@@ -0,0 +1,64 @@
<div class="dlabnav">
<div class="dlabnav-scroll">
<div class="dropdown header-profile2 ">
<a class="nav-link " href="javascript:void(0);" role="button" data-bs-toggle="dropdown">
<div class="header-info2 d-flex align-items-center">
<img src="images/profile/smile.png" alt="">
<div class="d-flex align-items-center sidebar-info">
<div>
<span class="font-w400 d-block">{{ Auth::user()->nama }}</span>
<small class="text-end font-w400">{{ Auth::user()->levelPegawai->level_name ?? '' }}</small>
</div>
<i class="fas fa-chevron-down"></i>
</div>
</div>
</a>
<div class="dropdown-menu dropdown-menu-end">
<a href="app-profile.html" class="dropdown-item ai-icon ">
<svg xmlns="http://www.w3.org/2000/svg" class="text-primary" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2"></path><circle cx="12" cy="7" r="4"></circle></svg>
<span class="ms-2">Profile </span>
</a>
<a href="email-inbox.html" class="dropdown-item ai-icon">
<svg xmlns="http://www.w3.org/2000/svg" class="text-success" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z"></path><polyline points="22,6 12,13 2,6"></polyline></svg>
<span class="ms-2">Inbox </span>
</a>
<a href="page-register.html" class="dropdown-item ai-icon">
<svg xmlns="http://www.w3.org/2000/svg" class="text-danger" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4"></path><polyline points="16 17 21 12 16 7"></polyline><line x1="21" y1="12" x2="9" y2="12"></line></svg>
<span class="ms-2">Logout </span>
</a>
</div>
</div>
<ul class="metismenu" id="menu">
<li><a href="/home" aria-expanded="false">
<i class="flaticon-025-dashboard"></i>
<span class="nav-text">Dashboard</span>
</a>
</li>
<li><a href="verify" class="" aria-expanded="false">
<i class="flaticon-013-checkmark"></i>
<span class="nav-text">Verification</span>
</a>
</li>
<li><a href="losttiket" class="" aria-expanded="false">
<i class="flaticon-013-checkmark"></i>
<span class="nav-text">Lost Ticket</span>
</a>
<li><a href="member" class="" aria-expanded="false">
<i class="flaticon-013-checkmark"></i>
<span class="nav-text">Register</span>
</a>
<li><a href="javascript:void(0);" class="has-arrow" aria-expanded="false">
<i class="fa-solid fa-gear"></i>
<span class="nav-text">Settings</span>
</a>
<ul aria-expanded="false">
<li><a href="settings-register">Pendaftaran</a></li>
<li><a href="content.html">Parameter</a></li>
<li><a href="content-add.html">Gate</a></li>
<li><a href="menu.html">Hardware</a></li>
</ul>
</li>
</ul>
</div>
</div>

View File

@@ -0,0 +1,86 @@
@extends('layouts.master')
@section('content')
<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>
<!-- row -->
<div class="row">
<div class="col-12">
<div class="card">
{{-- <div class="card-header">
<h4 class="card-title">Basic Datatable</h4>
</div> --}}
<div class="card-body">
<div class="table-responsive">
<table id="example" class="display" >
<thead>
<tr>
<th>Name</th>
<th>Position</th>
<th>Office</th>
<th>Age</th>
<th>Start date</th>
<th>Salary</th>
<th>Age</th>
<th>Start date</th>
<th>Salary</th>
</tr>
</thead>
<tbody>
<tr>
<td>Tiger Nixon</td>
<td>System Architect</td>
<td>Edinburgh</td>
<td>61</td>
<td>2011/04/25</td>
<td>$320,800</td>
</tr>
<tr>
<td>Garrett Winters</td>
<td>Accountant</td>
<td>Tokyo</td>
<td>63</td>
<td>2011/07/25</td>
<td>$170,750</td>
</tr>
</table>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
@endsection
@section('javascript')
<!--**********************************
Scripts
***********************************-->
<!-- Required vendors -->
<script src="vendor/global/global.min.js"></script>
<script src="vendor/chartjs/chart.bundle.min.js"></script>
<!-- Apex Chart -->
<script src="vendor/apexchart/apexchart.js"></script>
<!-- Datatable -->
<script src="vendor/datatables/js/jquery.dataTables.min.js"></script>
<script src="vendor/datatables/responsive/responsive.js"></script>
<script src="js/plugins-init/datatables.init.js"></script>
<script src="vendor/bootstrap-select/dist/js/bootstrap-select.min.js"></script>
<script src="vendor/bootstrap-datepicker-master/js/bootstrap-datepicker.min.js"></script>
<script src="js/custom.min.js"></script>
<script src="js/dlabnav-init.js"></script>
@endsection

View File

@@ -0,0 +1,530 @@
@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

View File

@@ -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>Profile</a>
</li>
<li class="nav-item">
<a class="nav-link" data-bs-toggle="tab" href="#profile1"><i class="la la-home me-2"></i> Profile</a>
</li>
<li class="nav-item">
<a class="nav-link" data-bs-toggle="tab" href="#contact1"><i class="la la-phone me-2"></i> Contact</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>

View File

@@ -0,0 +1,94 @@
@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">
<style>
.th {
text-align: center;
}
#example td {
text-align: center;
}
</style>
@endsection
@section('content')
<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>
<div class="row">
<div class="col-12">
<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%" >
<thead>
<tr>
<th class="p-2" style="text-align: center;" width="3%">No.</th>
<th style="text-align: center;">Jenis Produk</th>
<th style="text-align: center;">Jumlah Hari</th>
<th style="text-align: center;">Pola Member</th>
<th style="text-align: center;">Jenis Kendaraan</th>
<th style="text-align: center;">Jenis Langganan</th>
<th style="text-align: center;">Tarif</th>
<th style="text-align: center;">Periode</th>
<th width="250" style="text-align: center;">Action</th>
</tr>
</thead>
{{ json_encode($products) }}
<tbody>
@foreach ($products as $member)
<tr>
<td class="p-3">{{ $loop->index+1 }}</td>
<td class="p-3">{{ $member->name }}</td>
<td class="p-3">{{ $member->value }}</td>
<td class="p-3">{{ $member->ismonth === true ? 'Kalender' : 'Relative' }}</td>
<td class="p-3">{{ $member->nama }}</td>
<td class="p-3">{{ $member->jenis_langganan }}</td>
<td class="p-3">{{ $member->last_member }}</td>
<td class="p-3">{{ $member->tgl_akhir }}</td>
<td class="p-3"></td>
</tr>
@endforeach
</tobdy>
</table>
</div>
</div>
</div>
</div>
</div>
</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>
@endsection

View File

@@ -0,0 +1,498 @@
@extends('layouts.master')
@section('styles')
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<style>
.table th {
text-align: center;
}
.table td {
text-align: right;
}
</style>
@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-12 grid-margin stretch-card">
<div class="card">
<div class="card-header">
<div class="col d-flex align-items-center gap-2">
<div class="col-sm-2">
<input type="date" class="form-control" id="tanggalCari" name="tanggal_mulai" required>
</div>
<p class="mb-0 me-2 ms-auto">Harian</p>
<label class="toggle-switch toggle-switch-success">
<input type="checkbox" id="harianToggle" checked>
<span class="toggle-slider round" checked></span>
</label>
<div class="me-2">
{{-- <button type="button" class="btn btn-sm btn-primary" data-dismiss="modal">Cetak</button>--}}
<div class="btn-list text-right" style="float: right; display: flex; gap: 10px; margin-bottom: 10px; display: block;">
<button type="button" class="btn btn-icon btn-success btn-export-excel"><i class="fa fa-file-excel-o"></i></button>
<button type="button" class="btn btn-icon btn-danger btn-export-pdf"><i class="fa fa-file-pdf-o"></i></button>
</div>
</div>
</div>
</div>
<div class="card-body" id="cetak">
<h4 class="card-title">
{{ ($locationSettings->namalokasi) ?? '' }} - {{ ($locationSettings->namaperusahaan) ?? '' }}
</h4>
<h5 class="text-center">
<strong>Rekap Transaksi Kendaraan</strong>
<div class="mx-auto mt-1" id="tanggal-trans"></div>
</h5>
<!-- BARIS TANGGAL & BY -->
<div class="d-flex align-items-center">
<div class="ms-auto mb-1" id="harian"></div>
</div>
<div class="table-bordered mb-5">
<table class="table table-striped" id="cash">
<thead>
<tr>
<th rowspan="2" colspan="2">Jenis Kend</th>
<th colspan="2">Jenis Transaksi</th>
<th colspan="2">Casual</th>
<th colspan="2">Tiket Hilang</th>
<th colspan="2">Member</th>
<th colspan="2">Manual Input</th>
<th colspan="2">Manual Mix</th>
<th colspan="2">Tiket Masalah</th>
<th rowspan="2">Pendapatan</th>
</tr>
<tr>
<th>Masuk</th>
<th>Keluar</th>
<th>JML</th>
<th>Nilai</th>
<th>JML</th>
<th>Nilai</th>
<th>JML</th>
<th>Nilai</th>
<th>JML</th>
<th>Nilai</th>
<th>JML</th>
<th>Nilai</th>
<th>JML</th>
<th>Nilai</th>
</tr>
</thead>
<tbody id="table-data">
</tbody>
</table>
</div>
<div class="row">
<div class="col-md-5">
<h5 class="card-title text-center">Kendaraan yang masih menginap (Over Night)</h5>
<div class="table-bordered">
<table class="table table-on" id="cashless">
<thead>
<tr>
<th>Jenis Kend</th>
<th>Menginap</th>
<th>ON (Expired)</th>
<th>Total</th>
</tr>
</thead>
<tbody id="table-overnight">
</tbody>
</table>
</div>
</div>
</div>
{{-- <h5 class="card-title text-center">Rekap Transaksi Kendaraan (Non Tunai)</h5>
<div class="table-bordered">
<table class="table" id="cashless">
<thead>
<tr>
<th rowspan="2">Jenis Kend</th>
<th colspan="2">Jenis Transaksi</th>
<th colspan="2">Casual</th>
<th colspan="2">Tiket Hilang</th>
<th colspan="2">Member</th>
<th colspan="2">Manual Input</th>
<th colspan="2">Manual Mix</th>
<th colspan="2">Tiket Masalah</th>
<th rowspan="2">Pendapatan</th>
</tr>
<tr>
<th>Masuk</th>
<th>Keluar</th>
<th>JML</th>
<th>Nilai</th>
<th>JML</th>
<th>Nilai</th>
<th>JML</th>
<th>Nilai</th>
<th>JML</th>
<th>Nilai</th>
<th>JML</th>
<th>Nilai</th>
<th>JML</th>
<th>Nilai</th>
</tr>
</thead>
<tbody id="table-data">
</tbody>
</table>
</div> --}}
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Modal -->
<div class="modal fade show" id="modaltanggal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="false">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Pilih Tanggal</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
<form id="formTanggal">
<div class="form-group">
<div class="row">
<div class="col-sm-6">
<label for="tanggalMulai">Tanggal pencarian</label>
</div>
<div class="col-sm-6">
<input type="date" class="form-control" id="tanggalCari" name="tanggal_mulai" required>
</div>
</div>
</div>
</form>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Batal</button>
<button type="button" class="btn btn-primary" id="btnTampilkan">Tampilkan</button>
</div>
</div>
</div>
</div>
@endsection
@section('javascript')
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/1.4.1/html2canvas.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/2.5.1/jspdf.umd.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/xlsx/0.18.5/xlsx.full.min.js"></script>
<script>
$(document).ready(function () {
// $('#modaltanggal').modal('show');
// Set tanggal default ke hari ini
// realtime trigger
$('#tanggalCari').on('change', loadData);
$('#harianToggle').on('change', loadData);
var today = new Date().toISOString().split('T')[0];
$('#tanggalCari').val(today);
loadData();
// $('.btn-export-excel').on('click', function () {
$(document).on('click', '.btn-export-excel', function (e) {
// e.preventDefault();
$('#cash td').each(function () {
const raw = $(this).data('value');
if (raw !== undefined) {
$(this).text(raw);
}
});
const table = document.getElementById('cetak');
const wb = XLSX.utils.table_to_book(table, { sheet: 'Sheet 1'});
XLSX.writeFile(wb, `monthlyReport.xlsx`);
console.log(e);
});
$('.btn-export-pdf').on('click', async function () {
// $('.cetak').css('display','block');
// $('.user').css('display','block');
const { jsPDF } = window.jspdf;
const doc = new jsPDF('l', 'pt', 'a4');
// ambil elemen tabel
const table = document.getElementById('cetak');
const canvas = await html2canvas(table, { scale: 2 });
const imgData = canvas.toDataURL('image/png');
const imgWidth = doc.internal.pageSize.getWidth();
const imgHeight = (canvas.height * imgWidth) / canvas.width;
doc.addImage(imgData, 'PNG', 0, 20, imgWidth, imgHeight);
doc.save(`Rekap Harian.pdf`);
});
console.log(document.getElementById('cetak'));
console.log(document.getElementById('date-table'));
// }
});
function loadData(tanggalMulai, tanggalAkhir) {
let tanggal = $('#tanggalCari').val();
let harian = $('#harianToggle').is(':checked') ? 1 : 0;
if (harian == 1)
$('#harian').text('By : Harian');
else
$('#harian').text('By : Shift');
// console.log(harian);
// console.log(tanggal);
$('#tanggal-trans').text('Tanggal : ' + tanggal);
if (!tanggal) return;
// Contoh: Load data dengan AJAX
$.ajax({
url: '{{ route("getData") }}', // Ganti dengan route Anda
type: 'GET',
data: {
tanggal: tanggal,
harian: harian
},
beforeSend: function () {
console.log('Loading data...');
},
success: function(response) {
// Update tabel dengan data yang diterima
let html = '';
let onData = '';
let jmlCashCasual = 0;
let incomeCashCasual = 0;
let jmlCashlessCasual = 0;
let incomeCashlessCasual = 0;
let grandTotal = 0;
response.tunai.forEach(function (cash) {
// cari pasangan non tunai
let cashless = response.nontunai.find(
nt => String(nt.id_kendaraan) === String(cash.id_kendaraan)
);
// fallback aman
cashless = cashless || {
nontunai: 0,
nonTunaiOut: 0,
keluar: {
casual: { jumlah: 0, income: 0 },
lost: { jumlah: 0, income: 0 },
member: { jumlah: 0, income: 0 }
},
totalCashless: 0
};
let casualIn = cash.total;
let tunaiOut = cash.tunaiOut;
// ===== DATA TUNAI =====
let tCasual = cash.keluar.casual;
let tLost = cash.keluar.lost;
let tMember = cash.keluar.member;
let tManual = cash.keluar.manual;
// ===== DATA NON TUNAI =====
let nonTunaiOut = cashless.nonTunaiOut;
let nCasual = cashless.keluar.casual;
let nLost = cashless.keluar.lost;
let nMember = cashless.keluar.member;
let nManual = cashless.keluar.manual;
let totalTunai = cash.totalCash || 0;
let totalNonTunai = cashless.totalCashless || 0;
jmlCashCasual += cash.keluar.casual.jumlah;
incomeCashCasual += cash.keluar.casual.income;
jmlCashlessCasual += cashless.keluar.casual.jumlah;
incomeCashlessCasual += cashless.keluar.casual.income;
grandTotal += totalTunai + totalNonTunai;
// let casualCash = cash.keluar.casual;
// let lostCash = cash.keluar.lost;
// let memberCash = cash.keluar.member;
// let casualIn = cash.total;
// let casualNon = cashless ? cashless.keluar.casual : { jumlah: 0, income: 0 };
// let lostNon = cashless ? cashless.keluar.lost : { jumlah: 0, income: 0 };
// let memberNon = cashless ? cashless.keluar.member : { jumlah: 0, income: 0 };
// let totalIncome =
// (cash.totalCash || 0);
// html += `
// <tr>
// <td style="text-align: left;">${cash.jenis_mobil}</td>
// <!-- Jenis Transaksi -->
// <td>${casualIn}</td>
// <td>${cash.tunaiOut}</td>
// <!-- Casual -->
// <td>${casualCash.jumlah}</td>
// <td>${rupiah(casualCash.income)}</td>
// <!-- Tiket Hilang -->
// <td>${lostCash.jumlah}</td>
// <td>${rupiah(lostCash.income)}</td>
// <!-- Member -->
// <td>${memberCash.jumlah}</td>
// <td>${rupiah(memberCash.income)}</td>
// <!-- Manual Input -->
// <td>0</td>
// <td>0</td>
// <!-- Manual Mix -->
// <td>0</td>
// <td>0</td>
// <!-- Tiket Masalah -->
// <td>0</td>
// <td>0</td>
// <!-- Pendapatan -->
// <td><strong>${rupiah(totalIncome)}</strong></td>
// </tr>
// `;
html += `
<tr>
<td rowspan="2" style="text-align: left;"><strong>${cash.jenis_mobil}</strong></td>
<td style="text-align: left;"><span class="badge bg-success">Tunai</span></td>
<td>${casualIn}</td>
<td>${tunaiOut}</td>
<td>${tCasual.jumlah}</td>
<td data-value="${tCasual.income}">${rupiah(tCasual.income)}</td>
<td>${tLost.jumlah}</td>
<td data-value="${tLost.income}">${rupiah(tLost.income)}</td>
<td>${tMember.jumlah}</td>
<td data-value="${tMember.income}">${rupiah(tMember.income)}</td>
<td>${tManual.jumlah}</td>
<td data-value="${tManual.income}">${rupiah(tManual.income)}</td>
<td>0</td>
<td data-value="0}">0</td>
<td>0</td>
<td data-value="0">0</td>
<td data-value="${totalTunai}"><strong>${rupiah(totalTunai)}</strong></td>
</tr>
<tr>
<td style="text-align: left;"><span class="badge bg-warning">Non Tunai</span></td>
<td>${casualIn}</td>
<td>${nonTunaiOut}</td>
<td>${nCasual.jumlah}</td>
<td data-value="${nCasual.income}">${rupiah(nCasual.income)}</td>
<td>${nLost.jumlah}</td>
<td>${rupiah(nLost.income)}</td>
<td>${nMember.jumlah}</td>
<td>${rupiah(nMember.income)}</td>
<td>${nManual.jumlah}</td>
<td data-value="${nManual.income}">${rupiah(nManual.income)}</td>
<td>0</td>
<td data-value="0">0</td>
<td>0</td>
<td data-value="0">0</td>
<td data-value="${totalNonTunai}"><strong>${rupiah(totalNonTunai)}</strong></td>
</tr>
`;
});
// ===== FOOTER TOTAL =====
html += `
<tr class="table">
<td rowspan="2" style="text-align: center;"><strong>TOTAL</strong></td>
<td style="text-align: left;"><span class="badge bg-success">Tunai</span></td>
<td>0</td>
<td>0</td>
<td data-value="${jmlCashCasual}">${rupiah(jmlCashCasual)}</td>
<td data-value="${incomeCashCasual}">${rupiah(incomeCashCasual)}</td>
<td colspan="11">0</td>
</tr>
<tr>
<td style="text-align: left;"><span class="badge bg-warning">NON TUNAI</td>
<td>0</td>
<td>0</td>
<td>${jmlCashlessCasual}</td>
<td data-value="${incomeCashlessCasual}">${rupiah(incomeCashlessCasual)}</td>
<td colspan="11">0</td>
</tr>
<tr class="table">
<td colspan="3" class="text-center"><strong>GRAND TOTAL</strong></td>
<td colspan="0"></td>
<td colspan="0">${jmlCashCasual+jmlCashlessCasual}</td>
<td colspan="0" data-value="${incomeCashCasual+incomeCashlessCasual}">${rupiah(incomeCashCasual+incomeCashlessCasual)}</td>
<td colspan="0"></td>
<td colspan="0"></td>
<td colspan="0"></td>
<td colspan="0"></td>
<td colspan="0"></td>
<td colspan="0"></td>
<td colspan="0"></td>
<td colspan="0"></td>
<td colspan="0"></td>
<td colspan="0"></td>
<td><strong>${rupiah(grandTotal)}</strong></td>
</tr>
`;
// console.log('TUNAI:', cash.id_kendaraan, cash);
// console.log('CASHLESS FOUND:', cashless);
$('#table-data').html(html);
response.overNight.forEach(function (on) {
if (!on.jenis_mobil) return;
let overnight = on.overNight;
let onExpired = on.onExpired;
onData += `
<tr>
<td style="text-align: left;">${on.jenis_mobil}</td>
<td>${overnight}</td>
<td>${onExpired}</td>
<td>0</td>
</tr>
`;
});
$('#table-overnight').html(onData);
console.log(response);
},
error: function(xhr) {
console.log('Error:', xhr);
alert('Terjadi kesalahan saat memuat data');
}
});
}
function rupiah(angka) {
return new Intl.NumberFormat('id-ID').format(angka || 0);
}
// }
</script>
@endsection

View File

@@ -0,0 +1,62 @@
@extends('layouts.master')
@section('styles')
<style>
.table th {
text-align: center;
}
</style>
@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-12 grid-margin stretch-card">
<div class="card">
<div class="card-body" id="cetak">
<h4 class="card-title">Laporan Stiker Harian</h4>
<form id="formTanggal">
<div class="form-group">
<div class="row">
<div class="col-sm-3">
<label for="tanggalMulai">Tanggal pencarian</label>
</div>
<div class="col-sm-3">
<input type="date" class="form-control" id="tanggalCari" name="tanggal_mulai" required>
</div>
</div>
</div>
</form>
<div class="table-bordered">
<table class="table">
<thead>
<tr>
<th>No.</th>
<th>No. Transaksi</th>
<th>Tanggal</th>
<th>Nama</th>
<th>Alamat</th>
<th>Telp</th>
<th>Jenis Trans</th>
<th>No. Polisi</th>
<th>Jenis Kend</th>
<th>Petugas</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
@endsection

View File

@@ -0,0 +1,11 @@
<div class="row">
<div class="card">
<div class="card-header">
<h3>Detail Transaksi</h3>
</div>
<div class="card-body">
<img src="data:image/jpeg;base64, {{ $pic_masuk ?? '' }}" alt="Pic Body Masuk" style="max-width: 300px; max-height: 300px;">
</div>
</div>
</div>

View File

@@ -0,0 +1,264 @@
@extends('layouts.master')
@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-9">
<select name="" id="">
<option value="">Alamat</option>
</select>
</div>
<div class="col-md-9">
<input type="text" class="form-control form-control-lg" placeholder="Username" aria-label="Username">
</div>
</div>
</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>
<div class="table-responsive pt-3">
<table class="table table-bordered" id="example" 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="11%" style="text-align: center;">Action</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</div>
</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="https://cdnjs.cloudflare.com/ajax/libs/metisMenu/3.0.7/metisMenu.min.js"></script>
<script src="{{asset ('vendor/moment/moment.min.js') }}"></script>
<script src="{{asset ('vendor/bootstrap-daterangepicker/daterangepicker.js') }}"></script>
<script src="{{asset ('vendor/bootstrap-select/dist/js/bootstrap-select.min.js') }}"></script>
<script src="{{asset ('vendor/sweetalert2/dist/sweetalert2.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

View File

@@ -0,0 +1,75 @@
@extends('layouts.master')
@section('styles')
<link href="{{asset('vendor/datatables/css/jquery.dataTables.min.css') }}" rel="stylesheet">
<link href="{{asset('vendor/datatables/responsive/responsive.css') }}" rel="stylesheet">
<style>
.th {
text-align: center;
}
@media (max-width: 768px) {
.row > .col-md-6 {
margin-bottom: 20px;
}
}
</style>
@endsection
@section('content')
<div class="content-body">
<div class="container-fluid">
<div class="d-flex align-items-center mb-4 flex-wrap">
{{-- <h4 class="me-auto">Job List</h4> --}}
<div>
<a href="new-job.html" class="btn btn-primary btn-xs me-3"><i class="fas fa-plus me-2"></i>Tiket Hilang</a>
</div>
</div>
<div class="row">
<div class="col-12">
<div class="card">
<div class="card-body">
<div class="row mb-4">
<div class="col-md-12 col-12">
<div class="col-12">
<h4 class="text-center">Pic Body / No. Pol</h4>
</div>
<div class="row">
<div class="col-12 col-md-6">
<img id="video_stream" src="/stream-snapshot" alt="Pic Body Masuk" style="max-width: 640; max-height: 480;">
<span id="time-in" style="text-align: center;"></span>
</div>
<div class="col-12 col-md-6">
<img id="pic_body_keluar" src="" alt="Pic Body Keluar" style="max-width: 900px; max-height: 300px;">
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
@endsection
@section('javascript')
<!-- Datatable -->
<script src="vendor/datatables/js/jquery.dataTables.min.js"></script>
<script src="vendor/datatables/responsive/responsive.js"></script>
{{-- <script src="js/plugins-init/datatables.init.js"></script> --}}
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.18.1/moment.min.js"></script>
<script src="vendor/bootstrap-select/dist/js/bootstrap-select.min.js"></script>
<script src="vendor/bootstrap-datepicker-master/js/bootstrap-datepicker.min.js"></script>
<script src="js/custom.min.js"></script>
<script src="js/dlabnav-init.js"></script>
{{-- <script src="js/verify.js"></script> --}}
<script>
setInterval(function () {
$('#video_stream').attr('src', '/stream-snapshot?rand=' + Math.random())
}, 500);
</script>
@endsection

View File

@@ -0,0 +1,114 @@
@extends('layouts.master')
@section('styles')
<link href="{{asset('vendor/datatables/css/jquery.dataTables.min.css') }}" rel="stylesheet">
<link href="{{asset('vendor/datatables/responsive/responsive.css') }}" rel="stylesheet">
<style>
.th {
text-align: center;
}
@media (max-width: 768px) {
.row > .col-md-6 {
margin-bottom: 20px;
}
}
</style>
@endsection
@section('content')
<div class="content-body">
<div class="container-fluid">
<div class="d-flex align-items-center mb-4 flex-wrap">
{{-- <h4 class="me-auto">Job List</h4> --}}
<div>
<a href="new-job.html" class="btn btn-primary btn-xs me-3"><i class="fas fa-plus me-2"></i>Tiket Hilang</a>
</div>
</div>
<div class="row">
<div class="col-12">
<div class="card">
<div class="card-header">
<h4 class="card-title">Transaksi Aktif</h4>
</div>
<div class="card-body">
<div class="table-responsive">
<table id="verify-table" class="table table-striped" style="width:100%" data-url="{{ route('verify.index') }}">
<thead>
<tr>
<th>No.</th>
<th>ID Trans</th>
<th>No. Transaksi</th>
<th>Jenis Kend</th>
<th>Jam Masuk</th>
<th>Jam Keluar</th>
<th>ID Gate Masuk</th>
<th>ID Gate Keluar</th>
<th>Status</th>
<th>Aksi</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-12">
<div class="card">
<div class="card-body">
<div class="row mb-4">
<div class="col-md-12 col-12">
<div class="col-12">
<h4 class="text-center">Pic Body / No. Pol</h4>
</div>
<div class="row">
<div class="col-12 col-md-6">
<img id="pic_body_masuk" src="" alt="Pic Body Masuk" style="max-width: 700px; max-height: 300px; display: none;">
<span id="time-in" style="text-align: center;"></span>
</div>
<div class="col-12 col-md-6">
<img id="pic_body_keluar" src="" alt="Pic Body Keluar" style="max-width: 900px; max-height: 300px; display: none;">
</div>
</div>
</div>
{{-- <div class="col-md-6 col-12">
<div class="col-12">
<h4 class="text-center">Pic Driver</h4>
</div>
<div class="row">
<div class="col-12 col-md-6">
<img id="pic_driver_masuk" src="" alt="Driver Masuk" style="max-width: 700px; max-height: 300px; display: none;">
</div>
<div class="col-12 col-md-6">
<img id="pic_driver_keluar" src="" alt="Driver Keluar" style="max-width: 900px; max-height: 300px; display: none;">
</div>
</div>
</div> --}}
</div>
</div>
</div>
</div>
</div>
</div>
</div>
@endsection
@section('javascript')
<!-- Datatable -->
<script src="vendor/datatables/js/jquery.dataTables.min.js"></script>
<script src="vendor/datatables/responsive/responsive.js"></script>
{{-- <script src="js/plugins-init/datatables.init.js"></script> --}}
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.18.1/moment.min.js"></script>
<script src="vendor/bootstrap-select/dist/js/bootstrap-select.min.js"></script>
<script src="vendor/bootstrap-datepicker-master/js/bootstrap-datepicker.min.js"></script>
<script src="js/custom.min.js"></script>
<script src="js/dlabnav-init.js"></script>
<script src="js/verify.js"></script>
@endsection

View File

@@ -1,132 +1,143 @@
<!DOCTYPE html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<html>
<head>
<title>Laravel Setup</title>
<style>
/* body { font-family: sans-serif; padding: 30px }
.ok { color: green }
.fail { color: red }
button { padding: 10px 20px } */
body { font-family: sans-serif; padding: 30px }
<title>Laravel</title>
.ok { color: green }
.fail { color: red }
<!-- Fonts -->
<link href="https://fonts.googleapis.com/css2?family=Nunito:wght@400;600;700&display=swap" rel="stylesheet">
button {
padding: 10px 20px;
cursor: pointer;
}
<!-- Styles -->
<style>
/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}a{background-color:transparent}[hidden]{display:none}html{font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;line-height:1.5}*,:after,:before{box-sizing:border-box;border:0 solid #e2e8f0}a{color:inherit;text-decoration:inherit}svg,video{display:block;vertical-align:middle}video{max-width:100%;height:auto}.bg-white{--bg-opacity:1;background-color:#fff;background-color:rgba(255,255,255,var(--bg-opacity))}.bg-gray-100{--bg-opacity:1;background-color:#f7fafc;background-color:rgba(247,250,252,var(--bg-opacity))}.border-gray-200{--border-opacity:1;border-color:#edf2f7;border-color:rgba(237,242,247,var(--border-opacity))}.border-t{border-top-width:1px}.flex{display:flex}.grid{display:grid}.hidden{display:none}.items-center{align-items:center}.justify-center{justify-content:center}.font-semibold{font-weight:600}.h-5{height:1.25rem}.h-8{height:2rem}.h-16{height:4rem}.text-sm{font-size:.875rem}.text-lg{font-size:1.125rem}.leading-7{line-height:1.75rem}.mx-auto{margin-left:auto;margin-right:auto}.ml-1{margin-left:.25rem}.mt-2{margin-top:.5rem}.mr-2{margin-right:.5rem}.ml-2{margin-left:.5rem}.mt-4{margin-top:1rem}.ml-4{margin-left:1rem}.mt-8{margin-top:2rem}.ml-12{margin-left:3rem}.-mt-px{margin-top:-1px}.max-w-6xl{max-width:72rem}.min-h-screen{min-height:100vh}.overflow-hidden{overflow:hidden}.p-6{padding:1.5rem}.py-4{padding-top:1rem;padding-bottom:1rem}.px-6{padding-left:1.5rem;padding-right:1.5rem}.pt-8{padding-top:2rem}.fixed{position:fixed}.relative{position:relative}.top-0{top:0}.right-0{right:0}.shadow{box-shadow:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px 0 rgba(0,0,0,.06)}.text-center{text-align:center}.text-gray-200{--text-opacity:1;color:#edf2f7;color:rgba(237,242,247,var(--text-opacity))}.text-gray-300{--text-opacity:1;color:#e2e8f0;color:rgba(226,232,240,var(--text-opacity))}.text-gray-400{--text-opacity:1;color:#cbd5e0;color:rgba(203,213,224,var(--text-opacity))}.text-gray-500{--text-opacity:1;color:#a0aec0;color:rgba(160,174,192,var(--text-opacity))}.text-gray-600{--text-opacity:1;color:#718096;color:rgba(113,128,150,var(--text-opacity))}.text-gray-700{--text-opacity:1;color:#4a5568;color:rgba(74,85,104,var(--text-opacity))}.text-gray-900{--text-opacity:1;color:#1a202c;color:rgba(26,32,44,var(--text-opacity))}.underline{text-decoration:underline}.antialiased{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.w-5{width:1.25rem}.w-8{width:2rem}.w-auto{width:auto}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}@media (min-width:640px){.sm\:rounded-lg{border-radius:.5rem}.sm\:block{display:block}.sm\:items-center{align-items:center}.sm\:justify-start{justify-content:flex-start}.sm\:justify-between{justify-content:space-between}.sm\:h-20{height:5rem}.sm\:ml-0{margin-left:0}.sm\:px-6{padding-left:1.5rem;padding-right:1.5rem}.sm\:pt-0{padding-top:0}.sm\:text-left{text-align:left}.sm\:text-right{text-align:right}}@media (min-width:768px){.md\:border-t-0{border-top-width:0}.md\:border-l{border-left-width:1px}.md\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (min-width:1024px){.lg\:px-8{padding-left:2rem;padding-right:2rem}}@media (prefers-color-scheme:dark){.dark\:bg-gray-800{--bg-opacity:1;background-color:#2d3748;background-color:rgba(45,55,72,var(--bg-opacity))}.dark\:bg-gray-900{--bg-opacity:1;background-color:#1a202c;background-color:rgba(26,32,44,var(--bg-opacity))}.dark\:border-gray-700{--border-opacity:1;border-color:#4a5568;border-color:rgba(74,85,104,var(--border-opacity))}.dark\:text-white{--text-opacity:1;color:#fff;color:rgba(255,255,255,var(--text-opacity))}.dark\:text-gray-400{--text-opacity:1;color:#cbd5e0;color:rgba(203,213,224,var(--text-opacity))}.dark\:text-gray-500{--tw-text-opacity:1;color:#6b7280;color:rgba(107,114,128,var(--tw-text-opacity))}}
</style>
#loader {
display: none;
margin-top: 20px;
}
<style>
body {
font-family: 'Nunito', sans-serif;
}
</style>
</head>
<body class="antialiased">
<div class="relative flex items-top justify-center min-h-screen bg-gray-100 dark:bg-gray-900 sm:items-center py-4 sm:pt-0">
@if (Route::has('login'))
<div class="hidden fixed top-0 right-0 px-6 py-4 sm:block">
@auth
<a href="{{ url('/home') }}" class="text-sm text-gray-700 dark:text-gray-500 underline">Home</a>
@else
<a href="{{ route('login') }}" class="text-sm text-gray-700 dark:text-gray-500 underline">Log in</a>
.spinner {
width: 40px;
height: 40px;
border: 4px solid #ddd;
border-top: 4px solid #3498db;
border-radius: 50%;
animation: spin 1s linear infinite;
margin-bottom: 10px;
}
@if (Route::has('register'))
<a href="{{ route('register') }}" class="ml-4 text-sm text-gray-700 dark:text-gray-500 underline">Register</a>
@endif
@endauth
</div>
@endif
@keyframes spin {
0% { transform: rotate(0deg); }
100% { transform: rotate(360deg); }
}
</style>
</head>
<body>
<div class="max-w-6xl mx-auto sm:px-6 lg:px-8">
<div class="flex justify-center pt-8 sm:justify-start sm:pt-0">
<svg viewBox="0 0 651 192" fill="none" xmlns="http://www.w3.org/2000/svg" class="h-16 w-auto text-gray-700 sm:h-20">
<g clip-path="url(#clip0)" fill="#EF3B2D">
<path d="M248.032 44.676h-16.466v100.23h47.394v-14.748h-30.928V44.676zM337.091 87.202c-2.101-3.341-5.083-5.965-8.949-7.875-3.865-1.909-7.756-2.864-11.669-2.864-5.062 0-9.69.931-13.89 2.792-4.201 1.861-7.804 4.417-10.811 7.661-3.007 3.246-5.347 6.993-7.016 11.239-1.672 4.249-2.506 8.713-2.506 13.389 0 4.774.834 9.26 2.506 13.459 1.669 4.202 4.009 7.925 7.016 11.169 3.007 3.246 6.609 5.799 10.811 7.66 4.199 1.861 8.828 2.792 13.89 2.792 3.913 0 7.804-.955 11.669-2.863 3.866-1.908 6.849-4.533 8.949-7.875v9.021h15.607V78.182h-15.607v9.02zm-1.431 32.503c-.955 2.578-2.291 4.821-4.009 6.73-1.719 1.91-3.795 3.437-6.229 4.582-2.435 1.146-5.133 1.718-8.091 1.718-2.96 0-5.633-.572-8.019-1.718-2.387-1.146-4.438-2.672-6.156-4.582-1.719-1.909-3.032-4.152-3.938-6.73-.909-2.577-1.36-5.298-1.36-8.161 0-2.864.451-5.585 1.36-8.162.905-2.577 2.219-4.819 3.938-6.729 1.718-1.908 3.77-3.437 6.156-4.582 2.386-1.146 5.059-1.718 8.019-1.718 2.958 0 5.656.572 8.091 1.718 2.434 1.146 4.51 2.674 6.229 4.582 1.718 1.91 3.054 4.152 4.009 6.729.953 2.577 1.432 5.298 1.432 8.162-.001 2.863-.479 5.584-1.432 8.161zM463.954 87.202c-2.101-3.341-5.083-5.965-8.949-7.875-3.865-1.909-7.756-2.864-11.669-2.864-5.062 0-9.69.931-13.89 2.792-4.201 1.861-7.804 4.417-10.811 7.661-3.007 3.246-5.347 6.993-7.016 11.239-1.672 4.249-2.506 8.713-2.506 13.389 0 4.774.834 9.26 2.506 13.459 1.669 4.202 4.009 7.925 7.016 11.169 3.007 3.246 6.609 5.799 10.811 7.66 4.199 1.861 8.828 2.792 13.89 2.792 3.913 0 7.804-.955 11.669-2.863 3.866-1.908 6.849-4.533 8.949-7.875v9.021h15.607V78.182h-15.607v9.02zm-1.432 32.503c-.955 2.578-2.291 4.821-4.009 6.73-1.719 1.91-3.795 3.437-6.229 4.582-2.435 1.146-5.133 1.718-8.091 1.718-2.96 0-5.633-.572-8.019-1.718-2.387-1.146-4.438-2.672-6.156-4.582-1.719-1.909-3.032-4.152-3.938-6.73-.909-2.577-1.36-5.298-1.36-8.161 0-2.864.451-5.585 1.36-8.162.905-2.577 2.219-4.819 3.938-6.729 1.718-1.908 3.77-3.437 6.156-4.582 2.386-1.146 5.059-1.718 8.019-1.718 2.958 0 5.656.572 8.091 1.718 2.434 1.146 4.51 2.674 6.229 4.582 1.718 1.91 3.054 4.152 4.009 6.729.953 2.577 1.432 5.298 1.432 8.162 0 2.863-.479 5.584-1.432 8.161zM650.772 44.676h-15.606v100.23h15.606V44.676zM365.013 144.906h15.607V93.538h26.776V78.182h-42.383v66.724zM542.133 78.182l-19.616 51.096-19.616-51.096h-15.808l25.617 66.724h19.614l25.617-66.724h-15.808zM591.98 76.466c-19.112 0-34.239 15.706-34.239 35.079 0 21.416 14.641 35.079 36.239 35.079 12.088 0 19.806-4.622 29.234-14.688l-10.544-8.158c-.006.008-7.958 10.449-19.832 10.449-13.802 0-19.612-11.127-19.612-16.884h51.777c2.72-22.043-11.772-40.877-33.023-40.877zm-18.713 29.28c.12-1.284 1.917-16.884 18.589-16.884 16.671 0 18.697 15.598 18.813 16.884h-37.402zM184.068 43.892c-.024-.088-.073-.165-.104-.25-.058-.157-.108-.316-.191-.46-.056-.097-.137-.176-.203-.265-.087-.117-.161-.242-.265-.345-.085-.086-.194-.148-.29-.223-.109-.085-.206-.182-.327-.252l-.002-.001-.002-.002-35.648-20.524a2.971 2.971 0 00-2.964 0l-35.647 20.522-.002.002-.002.001c-.121.07-.219.167-.327.252-.096.075-.205.138-.29.223-.103.103-.178.228-.265.345-.066.089-.147.169-.203.265-.083.144-.133.304-.191.46-.031.085-.08.162-.104.25-.067.249-.103.51-.103.776v38.979l-29.706 17.103V24.493a3 3 0 00-.103-.776c-.024-.088-.073-.165-.104-.25-.058-.157-.108-.316-.191-.46-.056-.097-.137-.176-.203-.265-.087-.117-.161-.242-.265-.345-.085-.086-.194-.148-.29-.223-.109-.085-.206-.182-.327-.252l-.002-.001-.002-.002L40.098 1.396a2.971 2.971 0 00-2.964 0L1.487 21.919l-.002.002-.002.001c-.121.07-.219.167-.327.252-.096.075-.205.138-.29.223-.103.103-.178.228-.265.345-.066.089-.147.169-.203.265-.083.144-.133.304-.191.46-.031.085-.08.162-.104.25-.067.249-.103.51-.103.776v122.09c0 1.063.568 2.044 1.489 2.575l71.293 41.045c.156.089.324.143.49.202.078.028.15.074.23.095a2.98 2.98 0 001.524 0c.069-.018.132-.059.2-.083.176-.061.354-.119.519-.214l71.293-41.045a2.971 2.971 0 001.489-2.575v-38.979l34.158-19.666a2.971 2.971 0 001.489-2.575V44.666a3.075 3.075 0 00-.106-.774zM74.255 143.167l-29.648-16.779 31.136-17.926.001-.001 34.164-19.669 29.674 17.084-21.772 12.428-43.555 24.863zm68.329-76.259v33.841l-12.475-7.182-17.231-9.92V49.806l12.475 7.182 17.231 9.92zm2.97-39.335l29.693 17.095-29.693 17.095-29.693-17.095 29.693-17.095zM54.06 114.089l-12.475 7.182V46.733l17.231-9.92 12.475-7.182v74.537l-17.231 9.921zM38.614 7.398l29.693 17.095-29.693 17.095L8.921 24.493 38.614 7.398zM5.938 29.632l12.475 7.182 17.231 9.92v79.676l.001.005-.001.006c0 .114.032.221.045.333.017.146.021.294.059.434l.002.007c.032.117.094.222.14.334.051.124.088.255.156.371a.036.036 0 00.004.009c.061.105.149.191.222.288.081.105.149.22.244.314l.008.01c.084.083.19.142.284.215.106.083.202.178.32.247l.013.005.011.008 34.139 19.321v34.175L5.939 144.867V29.632h-.001zm136.646 115.235l-65.352 37.625V148.31l48.399-27.628 16.953-9.677v33.862zm35.646-61.22l-29.706 17.102V66.908l17.231-9.92 12.475-7.182v33.841z"/>
</g>
</svg>
</div>
<h2>🚀 Laravel Setup Checker</h2>
<div class="mt-8 bg-white dark:bg-gray-800 overflow-hidden shadow sm:rounded-lg">
<div class="grid grid-cols-1 md:grid-cols-2">
<div class="p-6">
<div class="flex items-center">
<svg fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" viewBox="0 0 24 24" class="w-8 h-8 text-gray-500"><path d="M12 6.253v13m0-13C10.832 5.477 9.246 5 7.5 5S4.168 5.477 3 6.253v13C4.168 18.477 5.754 18 7.5 18s3.332.477 4.5 1.253m0-13C13.168 5.477 14.754 5 16.5 5c1.747 0 3.332.477 4.5 1.253v13C19.832 18.477 18.247 18 16.5 18c-1.746 0-3.332.477-4.5 1.253"></path></svg>
<div class="ml-4 text-lg leading-7 font-semibold"><a href="https://laravel.com/docs" class="underline text-gray-900 dark:text-white">Documentation</a></div>
</div>
@if(session('success'))
<p class="ok">{{ session('success') }}</p>
@endif
<div class="ml-12">
<div class="mt-2 text-gray-600 dark:text-gray-400 text-sm">
Laravel has wonderful, thorough documentation covering every aspect of the framework. Whether you are new to the framework or have previous experience with Laravel, we recommend reading all of the documentation from beginning to end.
</div>
</div>
</div>
@if(session('error'))
<p class="fail">{{ session('error') }}</p>
@endif
<div class="p-6 border-t border-gray-200 dark:border-gray-700 md:border-t-0 md:border-l">
<div class="flex items-center">
<svg fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" viewBox="0 0 24 24" class="w-8 h-8 text-gray-500"><path d="M3 9a2 2 0 012-2h.93a2 2 0 001.664-.89l.812-1.22A2 2 0 0110.07 4h3.86a2 2 0 011.664.89l.812 1.22A2 2 0 0018.07 7H19a2 2 0 012 2v9a2 2 0 01-2 2H5a2 2 0 01-2-2V9z"></path><path d="M15 13a3 3 0 11-6 0 3 3 0 016 0z"></path></svg>
<div class="ml-4 text-lg leading-7 font-semibold"><a href="https://laracasts.com" class="underline text-gray-900 dark:text-white">Laracasts</a></div>
</div>
<ul>
<li>pgcrypto:
<b class="{{ $status['pgcrypto'] ? 'ok' : 'fail' }}">
{{ $status['pgcrypto'] ? 'OK' : 'NOT FOUND' }}
</b>
</li>
<div class="ml-12">
<div class="mt-2 text-gray-600 dark:text-gray-400 text-sm">
Laracasts offers thousands of video tutorials on Laravel, PHP, and JavaScript development. Check them out, see for yourself, and massively level up your development skills in the process.
</div>
</div>
</div>
<li>pegawai.id:
<b class="{{ $status['pegawai_columns']['id'] ? 'ok' : 'fail' }}">
{{ $status['pegawai_columns']['id'] ? 'OK' : 'MISSING' }}
</b>
</li>
<div class="p-6 border-t border-gray-200 dark:border-gray-700">
<div class="flex items-center">
<svg fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" viewBox="0 0 24 24" class="w-8 h-8 text-gray-500"><path d="M7 8h10M7 12h4m1 8l-4-4H5a2 2 0 01-2-2V6a2 2 0 012-2h14a2 2 0 012 2v8a2 2 0 01-2 2h-3l-4 4z"></path></svg>
<div class="ml-4 text-lg leading-7 font-semibold"><a href="https://laravel-news.com/" class="underline text-gray-900 dark:text-white">Laravel News</a></div>
</div>
<li>pegawai.email:
<b class="{{ $status['pegawai_columns']['email'] ? 'ok' : 'fail' }}">
{{ $status['pegawai_columns']['email'] ? 'OK' : 'MISSING' }}
</b>
</li>
<div class="ml-12">
<div class="mt-2 text-gray-600 dark:text-gray-400 text-sm">
Laravel News is a community driven portal and newsletter aggregating all of the latest and most important news in the Laravel ecosystem, including new package releases and tutorials.
</div>
</div>
</div>
<li>pegawai.email_verified_at:
<b class="{{ $status['pegawai_columns']['email_verified_at'] ? 'ok' : 'fail' }}">
{{ $status['pegawai_columns']['email_verified_at'] ? 'OK' : 'MISSING' }}
</b>
</li>
<div class="p-6 border-t border-gray-200 dark:border-gray-700 md:border-l">
<div class="flex items-center">
<svg fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" viewBox="0 0 24 24" class="w-8 h-8 text-gray-500"><path d="M3.055 11H5a2 2 0 012 2v1a2 2 0 002 2 2 2 0 012 2v2.945M8 3.935V5.5A2.5 2.5 0 0010.5 8h.5a2 2 0 012 2 2 2 0 104 0 2 2 0 012-2h1.064M15 20.488V18a2 2 0 012-2h3.064M21 12a9 9 0 11-18 0 9 9 0 0118 0z"></path></svg>
<div class="ml-4 text-lg leading-7 font-semibold text-gray-900 dark:text-white">Vibrant Ecosystem</div>
</div>
<li>pegawai.remember_token:
<b class="{{ $status['pegawai_columns']['remember_token'] ? 'ok' : 'fail' }}">
{{ $status['pegawai_columns']['remember_token'] ? 'OK' : 'MISSING' }}
</b>
</li>
<div class="ml-12">
<div class="mt-2 text-gray-600 dark:text-gray-400 text-sm">
Laravel's robust library of first-party tools and libraries, such as <a href="https://forge.laravel.com" class="underline">Forge</a>, <a href="https://vapor.laravel.com" class="underline">Vapor</a>, <a href="https://nova.laravel.com" class="underline">Nova</a>, and <a href="https://envoyer.io" class="underline">Envoyer</a> help you take your projects to the next level. Pair them with powerful open source libraries like <a href="https://laravel.com/docs/billing" class="underline">Cashier</a>, <a href="https://laravel.com/docs/dusk" class="underline">Dusk</a>, <a href="https://laravel.com/docs/broadcasting" class="underline">Echo</a>, <a href="https://laravel.com/docs/horizon" class="underline">Horizon</a>, <a href="https://laravel.com/docs/sanctum" class="underline">Sanctum</a>, <a href="https://laravel.com/docs/telescope" class="underline">Telescope</a>, and more.
</div>
</div>
</div>
</div>
</div>
<li>users view:
<b class="{{ $status['users_view'] ? 'ok' : 'fail' }}">
{{ $status['users_view'] ? 'OK' : 'NOT FOUND' }}
</b>
</li>
<div class="flex justify-center mt-4 sm:items-center sm:justify-between">
<div class="text-center text-sm text-gray-500 sm:text-left">
<div class="flex items-center">
<svg fill="none" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" viewBox="0 0 24 24" stroke="currentColor" class="-mt-px w-5 h-5 text-gray-400">
<path d="M3 3h2l.4 2M7 13h10l4-8H5.4M7 13L5.4 5M7 13l-2.293 2.293c-.63.63-.184 1.707.707 1.707H17m0 0a2 2 0 100 4 2 2 0 000-4zm-8 2a2 2 0 11-4 0 2 2 0 014 0z"></path>
</svg>
<li>transaksi_parkir.veri_time:
<b class="{{ $status['veri_time'] ? 'ok' : 'fail' }}">
{{ $status['veri_time'] ? 'OK' : 'MISSING' }}
</b>
</li>
</ul>
<a href="https://laravel.bigcartel.com" class="ml-1 underline">
Shop
</a>
<form method="POST" action="{{ route('setup.run') }}">
@csrf
<button type="submit">⚙️ Jalankan Setup</button>
<svg fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" viewBox="0 0 24 24" class="ml-4 -mt-px w-5 h-5 text-gray-400">
<path d="M4.318 6.318a4.5 4.5 0 000 6.364L12 20.364l7.682-7.682a4.5 4.5 0 00-6.364-6.364L12 7.636l-1.318-1.318a4.5 4.5 0 00-6.364 0z"></path>
</svg>
<a href="https://github.com/sponsors/taylorotwell" class="ml-1 underline">
Sponsor
</a>
</div>
</div>
<div class="ml-4 text-center text-sm text-gray-500 sm:text-right sm:ml-0">
Laravel v{{ Illuminate\Foundation\Application::VERSION }} (PHP v{{ PHP_VERSION }})
</div>
</div>
</div>
<div id="loader">
<div class="spinner"></div>
<b>Memproses setup database…</b>
</div>
</body>
</form>
<script>
document.getElementById('runSetup').addEventListener('click', function () {
const btn = this;
const loader = document.getElementById('loader');
btn.disabled = true;
btn.innerText = 'Processing...';
loader.style.display = 'block';
fetch("{{ route('setup.run') }}", {
method: "POST",
headers: {
"X-CSRF-TOKEN": document.querySelector('meta[name="csrf-token"]').content,
"Accept": "application/json"
}
})
.then(res => res.json())
.then(res => {
if (res.success) {
loader.innerHTML = "<b class='ok'>✅ Setup selesai, mengalihkan halaman...</b>";
setTimeout(() => {
window.location.href = res.redirect;
}, 1500);
}
})
.catch(err => {
loader.innerHTML = "<b class='fail'>❌ Setup gagal</b>";
btn.disabled = false;
btn.innerText = '⚙️ Jalankan Setup';
console.error(err);
});
});
</script>
</body>
</html>