KoPKB/admin-erahn
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add poskod management module

Browse Source
This commit is contained in:
afiq.hamzah
2023-03-16 16:34:50 +08:00
parent b8f8af1e61
commit 2d1a53098b
9 changed files with 869 additions and 76 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/Http/Controllers/PoskodController.php
+202
View File
@@ -0,0 +1,202 @@
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use Illuminate\Support\Facades\Http;
class PoskodController extends Controller
{
/**
* Display a listing of the resource.
*
* @return \Illuminate\Http\Response
*/
public function index()
{
$api_url = config('api.url');
$auth_user = auth()->user();
$endpoint = $api_url . '/api/poskod';
$api_response = Http::get($endpoint, [
'page' => request()->page,
'query_string' => request()->query_string,
]);
$postcodes = $api_response->json();
$query_string = $api_response->header('query_string');
$paginator = $this->paginate($postcodes['current_page'], $postcodes['last_page']);
$current_page_classes = 'relative z-10 inline-flex items-center bg-indigo-600 px-4 py-2 text-sm font-semibold text-white focus:z-20 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-600';
$unselected_page_classes = 'relative inline-flex items-center px-4 py-2 text-sm font-semibold text-gray-700 ring-1 ring-inset ring-gray-300 focus:outline-offset-0';
$data = ['api_url', 'postcodes', 'auth_user', 'current_page_classes', 'unselected_page_classes', 'query_string', 'paginator'];
return view('poskod.index', compact($data));
}
/**
* Show the form for creating a new resource.
*
* @return \Illuminate\Http\Response
*/
public function create()
{
$api_url = config('api.url');
$auth_user = auth()->user();
$endpoint = $api_url . '/api/poskod';
$api_response = Http::get($endpoint, [
'page' => request()->page,
'query_string' => request()->query_string,
]);
$postcodes = $api_response->json();
$query_string = $api_response->header('query_string');
$paginator = $this->paginate($postcodes['current_page'], $postcodes['last_page']);
$all_daerah_url = $api_url . '/api/daerah';
$all_negeri_url = $api_url . '/api/negeri';
$all_daerah = Http::get($all_daerah_url)->json();
$all_negeri = Http::get($all_negeri_url)->json();
$current_page_classes = 'relative z-10 inline-flex items-center bg-indigo-600 px-4 py-2 text-sm font-semibold text-white focus:z-20 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-600';
$unselected_page_classes = 'relative inline-flex items-center px-4 py-2 text-sm font-semibold text-gray-700 ring-1 ring-inset ring-gray-300 focus:outline-offset-0';
$data = ['api_url', 'postcodes', 'auth_user', 'current_page_classes', 'unselected_page_classes', 'query_string', 'paginator', 'all_daerah', 'all_negeri'];
return view('poskod.create', compact($data));
}
/**
* Store a newly created resource in storage.
*
* @param \Illuminate\Http\Request $request
* @return \Illuminate\Http\Response
*/
public function store(Request $request)
{
$api_url = config('api.url');
$endpoint = $api_url . '/api/poskod';
$response = Http::post($endpoint, [
'poskod' => $request->poskod,
'koddaerah' => $request->koddaerah,
'kodnegeri' => $request->kodnegeri
]);
if(! $response->ok()){
$message = str_replace("\"", "", $response->body());
} else {
$message = "Daftar poskod {$request->poskod} selesai";
}
$request->session()->flash('response_status', $response->ok());
$request->session()->flash('response_message', $message);
return redirect()->route('poskod.index', compact('message'));
}
/**
* Show the form for editing the specified resource.
*
* @param int $id
* @return \Illuminate\Http\Response
*/
public function edit($postcode)
{
$api_url = config('api.url');
$endpoint = $api_url . '/api/poskod';
$auth_user = auth()->user();
$selected_postcode_url = $api_url . '/api/poskod/' . $postcode;
$all_daerah_url = $api_url . '/api/daerah';
$all_negeri_url = $api_url . '/api/negeri';
$postcode = Http::get($selected_postcode_url)->json();
$all_daerah = Http::get($all_daerah_url)->json();
$all_negeri = Http::get($all_negeri_url)->json();
$data = ['postcode', 'all_daerah', 'all_negeri'];
return view('poskod.edit', compact($data));
}
/**
* Update the specified resource in storage.
*
* @param \Illuminate\Http\Request $request
* @param int $id
* @return \Illuminate\Http\Response
*/
public function update(Request $request, $postcode)
{
$api_url = config('api.url');
$endpoint = $api_url . '/api/poskod/' . $postcode . '/update';
$response = Http::put($endpoint, [
'recno' => $request->recno,
'poskod' => $request->poskod,
'koddaerah' => $request->koddaerah,
'kodnegeri' => $request->kodnegeri
]);
if(! $response->ok()){
$message = str_replace("\"", "", $response->body());
} else {
$message = "Kemaskini poskod {$postcode} kepada {$request->poskod} selesai";
}
$request->session()->flash('response_status', $response->ok());
$request->session()->flash('response_message', $message);
return redirect()->route('poskod.index', compact('message'));
return redirect()->route('poskod.index', compact('message'));
}
public function paginate($c, $m)
{
$current = $c;
$last = $m;
$delta = 2;
$left = $current - $delta;
$right = $current + $delta + 1;
$range = [];
$range_with_dots = [];
$l = null;
for ($i = 1; $i <= $last; $i++) {
if ($i == 1 || $i == $last || ($i >= $left && $i < $right)) {
array_push($range, $i);
}
}
foreach ($range as $i) {
if ($l) {
if ($i - $l === 2) {
array_push($range_with_dots, $l + 1);
} elseif ($i - $l !== 1) {
array_push($range_with_dots, '...');
}
}
array_push($range_with_dots, $i);
$l = $i;
}
return $range_with_dots;
}
}
public/css/slimselect.css
Vendored
+1
View File
File diff suppressed because one or more lines are too long
public/js/slimselect.min.js
Vendored
+1
View File
File diff suppressed because one or more lines are too long
resources/views/layouts/app.blade.php
+158 -74
View File
@@ -1,5 +1,6 @@
<!doctype html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
@@ -15,14 +16,13 @@
{{-- Check Authentication --}}
@if (Auth::check())
@if (Auth::check())
<meta name="user_name" content="{{ Auth::user()->name }}" />
<meta name="user_roles" content="{{ Auth::user()->roles }}" />
@endif
<link href="{{ asset('css/all.min.css') }}" rel="stylesheet">
<!-- Scripts -->
<script src="{{ asset('js/app.js') }}" defer></script>
@@ -32,7 +32,7 @@
<!-- Styles -->
<link href="{{ asset('css/app.css') }}" rel="stylesheet">
<style>
.sidebar {
height: 100%;
@@ -69,116 +69,200 @@
}
@media screen and (max-height: 450px) {
.sidebar {padding-top: 15px;}
.sidebar a {font-size: 18px;}
.sidebar {
padding-top: 15px;
}
.sidebar a {
font-size: 18px;
}
}
#app {
transition: margin-left .5s;
/* padding: 16px; */
}
</style>
@stack('additional_styles')
</head>
<body @auth class="bg-gray-200" @endauth @guest class="bg-white" @endguest>
<script>
openNav = () => {
openNav = () => {
let toggle = document.getElementById("mySidebar");
let maintoggle = document.getElementById("app");
if(toggle.style.width == "" || toggle.style.width == '0px')
{
if (toggle.style.width == "" || toggle.style.width == '0px') {
toggle.style.width = "250px";
maintoggle.style.marginLeft = "250px";
}else{
} else {
document.getElementById("mySidebar").style.width = "0";
document.getElementById("app").style.marginLeft= "0";
document.getElementById("app").style.marginLeft = "0";
}
}
closeNav = () => {
document.getElementById("mySidebar").style.width = "0";
document.getElementById("app").style.marginLeft= "0";
closeNav = () => {
document.getElementById("mySidebar").style.width = "0";
document.getElementById("app").style.marginLeft = "0";
}
</script>
</script>
<div id="app" @guest style="background: url(/img/background.jpg) no-repeat center center fixed;
<div id="app"
@guest style="background: url(/img/background.jpg) no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;background-size: cover;"@endguest>
-o-background-size: cover;background-size: cover;" @endguest>
@auth
@include('layouts.sidebar')
@include('layouts.sidebar')
<nav class="bg-white border-b border-gray-200 z-30 w-full sticky">
<nav class="bg-white border-b border-gray-200 z-30 w-full sticky">
<div class="px-3 py-3 lg:px-5 lg:pl-3">
<div class="flex items-center justify-between">
<div class="flex items-center justify-start">
<button id="toggleSidebarMobile" onclick="openNav()" aria-expanded="true" aria-controls="sidebar" class=" mr-2 text-gray-600 hover:text-gray-900 cursor-pointer p-2 hover:bg-gray-100 rounded">
<svg id="toggleSidebarMobileHamburger" class="w-6 h-6" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" d="M3 5a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zM3 10a1 1 0 011-1h6a1 1 0 110 2H4a1 1 0 01-1-1zM3 15a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1z" clip-rule="evenodd"></path>
</svg>
<svg id="toggleSidebarMobileClose" class="w-6 h-6 hidden" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" d="M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z" clip-rule="evenodd"></path>
</svg>
</button>
</div>
@auth
<clock-component></clock-component>
<cawangan-component roles={{ Auth::user()->roles }} route={{ (Route::is('home') || Route::is('akaun.home') || Route::is('audit.index')) ? 'ada' : 'tiada' }} akaun={{ ((Route::is('akaun.home') || Route::is('audit.index')) ? 'yes' : 'no')}}></cawangan-component>
@endauth
<div class="px-3 py-3 lg:px-5 lg:pl-3">
<div class="flex items-center justify-between">
<div class="flex items-center justify-start">
<div class="flex items-center">
@guest
@if (Route::has('login'))
<div class="hidden lg:flex items-center">
<a href="{{ route('login') }}" class="bg-transparent hover:bg-blue-500 text-blue-700 font-semibold hover:text-white py-2 px-4 border border-blue-500 hover:border-transparent rounded">
Log In
</a>
</div>
@endif
<button id="toggleSidebarMobile" onclick="openNav()" aria-expanded="true"
aria-controls="sidebar"
class=" mr-2 text-gray-600 hover:text-gray-900 cursor-pointer p-2 hover:bg-gray-100 rounded">
<svg id="toggleSidebarMobileHamburger" class="w-6 h-6" fill="currentColor"
viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd"
d="M3 5a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zM3 10a1 1 0 011-1h6a1 1 0 110 2H4a1 1 0 01-1-1zM3 15a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1z"
clip-rule="evenodd"></path>
</svg>
<svg id="toggleSidebarMobileClose" class="w-6 h-6 hidden" fill="currentColor"
viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd"
d="M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z"
clip-rule="evenodd"></path>
</svg>
</button>
@if (Route::has('register'))
<div class="hidden lg:flex items-center ml-2">
<a href="{{ route('register') }}" class="bg-transparent hover:bg-blue-500 text-blue-700 font-semibold hover:text-white py-2 px-4 border border-blue-500 hover:border-transparent rounded">
Register
</a>
</div>
@endif
@else
@if(Auth::user()->roles == 'operasi')
{{-- <div class="mr-4">
</div>
@auth
<clock-component></clock-component>
<cawangan-component roles={{ Auth::user()->roles }}
route={{ Route::is('home') || Route::is('akaun.home') || Route::is('audit.index') ? 'ada' : 'tiada' }}
akaun={{ Route::is('akaun.home') || Route::is('audit.index') ? 'yes' : 'no' }}>
</cawangan-component>
@endauth
<div class="flex items-center">
@guest
@if (Route::has('login'))
<div class="hidden lg:flex items-center">
<a href="{{ route('login') }}"
class="bg-transparent hover:bg-blue-500 text-blue-700 font-semibold hover:text-white py-2 px-4 border border-blue-500 hover:border-transparent rounded">
Log In
</a>
</div>
@endif
@if (Route::has('register'))
<div class="hidden lg:flex items-center ml-2">
<a href="{{ route('register') }}"
class="bg-transparent hover:bg-blue-500 text-blue-700 font-semibold hover:text-white py-2 px-4 border border-blue-500 hover:border-transparent rounded">
Register
</a>
</div>
@endif
@else
@if (Auth::user()->roles == 'operasi')
{{-- <div class="mr-4">
<notify-component></notify-component>
</div> --}}
@endif
<logout-component csrftoken="{{ csrf_token() }}" :route={{ json_encode(route('logout')) }}></logout-component>
@endif
<logout-component csrftoken="{{ csrf_token() }}" :route={{ json_encode(route('logout')) }}>
</logout-component>
<form id="logout-form" action="{{ route('logout') }}" method="POST" class="d-none">
{{-- <input type="hidden" name="_token" :value="this.$props.csrftoken" /> --}}
@csrf
</form>
@endguest
</div>
</div>
</div>
</nav>
<form id="logout-form" action="{{ route('logout') }}" method="POST" class="d-none">
{{-- <input type="hidden" name="_token" :value="this.$props.csrftoken" /> --}}
@csrf
</form>
@endguest
</div>
</div>
</div>
</nav>
@endauth
<main class="py-4 px-4">
@yield('content')
</main>
</div>
<div id="success-toast-message" class="hidden fixed right-10 bottom-10">
<div class="max-w-xs bg-green-500 text-sm text-white rounded-md shadow-lg mb-3 ml-3" role="alert">
<div id="toast-message-text" class="flex p-4">
SUCCESS TOAST MESSAGE PLACEHOLDER
<div class="ml-auto">
<button type="button"
class="inline-flex flex-shrink-0 justify-center items-center h-4 w-4 rounded-md text-white/[.5] hover:text-white focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-green-800 focus:ring-green-500 transition-all text-sm dark:focus:ring-offset-green-500 dark:focus:ring-green-700">
<span class="sr-only">Close</span>
<svg class="w-3.5 h-3.5" width="16" height="16" viewBox="0 0 16 16" fill="none"
xmlns="http://www.w3.org/2000/svg">
<path
d="M0.92524 0.687069C1.126 0.486219 1.39823 0.373377 1.68209 0.373377C1.96597 0.373377 2.2382 0.486219 2.43894 0.687069L8.10514 6.35813L13.7714 0.687069C13.8701 0.584748 13.9882 0.503105 14.1188 0.446962C14.2494 0.39082 14.3899 0.361248 14.5321 0.360026C14.6742 0.358783 14.8151 0.38589 14.9468 0.439762C15.0782 0.493633 15.1977 0.573197 15.2983 0.673783C15.3987 0.774389 15.4784 0.894026 15.5321 1.02568C15.5859 1.15736 15.6131 1.29845 15.6118 1.44071C15.6105 1.58297 15.5809 1.72357 15.5248 1.85428C15.4688 1.98499 15.3872 2.10324 15.2851 2.20206L9.61883 7.87312L15.2851 13.5441C15.4801 13.7462 15.588 14.0168 15.5854 14.2977C15.5831 14.5787 15.4705 14.8474 15.272 15.046C15.0735 15.2449 14.805 15.3574 14.5244 15.3599C14.2437 15.3623 13.9733 15.2543 13.7714 15.0591L8.10514 9.38812L2.43894 15.0591C2.23704 15.2543 1.96663 15.3623 1.68594 15.3599C1.40526 15.3574 1.13677 15.2449 0.938279 15.046C0.739807 14.8474 0.627232 14.5787 0.624791 14.2977C0.62235 14.0168 0.730236 13.7462 0.92524 13.5441L6.59144 7.87312L0.92524 2.20206C0.724562 2.00115 0.611816 1.72867 0.611816 1.44457C0.611816 1.16047 0.724562 0.887983 0.92524 0.687069Z"
fill="currentColor" />
</svg>
</button>
</div>
</div>
</div>
</div>
<div id="fail-toast-message" class="hidden fixed right-10 bottom-10">
<div class="max-w-xs bg-pink-500 text-sm text-white rounded-md shadow-lg mb-3 ml-3" role="alert">
<div id="toast-message-text" class="flex p-4">
FAIL TOAST MESSAGE PLACEHOLDER
<div class="ml-auto">
<button type="button" class="inline-flex flex-shrink-0 justify-center items-center h-4 w-4 rounded-md text-white/[.5] hover:text-white focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-pink-800 focus:ring-pink-500 transition-all text-sm dark:focus:ring-offset-pink-500 dark:focus:ring-pink-700">
<span class="sr-only">Close</span>
<svg class="w-3.5 h-3.5" width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M0.92524 0.687069C1.126 0.486219 1.39823 0.373377 1.68209 0.373377C1.96597 0.373377 2.2382 0.486219 2.43894 0.687069L8.10514 6.35813L13.7714 0.687069C13.8701 0.584748 13.9882 0.503105 14.1188 0.446962C14.2494 0.39082 14.3899 0.361248 14.5321 0.360026C14.6742 0.358783 14.8151 0.38589 14.9468 0.439762C15.0782 0.493633 15.1977 0.573197 15.2983 0.673783C15.3987 0.774389 15.4784 0.894026 15.5321 1.02568C15.5859 1.15736 15.6131 1.29845 15.6118 1.44071C15.6105 1.58297 15.5809 1.72357 15.5248 1.85428C15.4688 1.98499 15.3872 2.10324 15.2851 2.20206L9.61883 7.87312L15.2851 13.5441C15.4801 13.7462 15.588 14.0168 15.5854 14.2977C15.5831 14.5787 15.4705 14.8474 15.272 15.046C15.0735 15.2449 14.805 15.3574 14.5244 15.3599C14.2437 15.3623 13.9733 15.2543 13.7714 15.0591L8.10514 9.38812L2.43894 15.0591C2.23704 15.2543 1.96663 15.3623 1.68594 15.3599C1.40526 15.3574 1.13677 15.2449 0.938279 15.046C0.739807 14.8474 0.627232 14.5787 0.624791 14.2977C0.62235 14.0168 0.730236 13.7462 0.92524 13.5441L6.59144 7.87312L0.92524 2.20206C0.724562 2.00115 0.611816 1.72867 0.611816 1.44457C0.611816 1.16047 0.724562 0.887983 0.92524 0.687069Z" fill="currentColor"/>
</svg>
</button>
</div>
</div>
</div>
</div>
@stack('additional_scripts')
<script>
let response_status = {!! json_encode(\Session::get('response_status')) !!};
let response_message = {!! json_encode(\Session::get('response_message')) !!};
let successToastMessage = document.querySelector('#success-toast-message')
let failToastMessage = document.querySelector('#fail-toast-message')
if (response_status === true) {
successToastMessage.classList.remove('hidden');
successToastMessage.querySelector('#toast-message-text').textContent = response_message;
setTimeout(() => successToastMessage.classList.add('hidden'), 15000)
}
if (response_status === false) {
failToastMessage.classList.remove('hidden');
failToastMessage.querySelector('#toast-message-text').textContent = response_message;
setTimeout(() => failToastMessage.classList.add('hidden'), 15000)
}
</script>
</body>
</html>
resources/views/layouts/sidebar.blade.php
+13 -1
View File
@@ -113,6 +113,18 @@
</li>
</a>
<a href="{{ route('poskod.index') }}"
class="rounded mb-2 mr-2 {{ Route::is('poskod.index') || Route::is('poskod.*') ? 'bg-gray-200 rounded text-white-500' : 'hover:bg-yellow-300 ' }}">
<li class="flex w-full justify-between text-gray-600 hover:text-gray-500 cursor-pointer items-center ">
<div class="flex items-center">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6">
<path stroke-linecap="round" stroke-linejoin="round" d="M21.75 6.75v10.5a2.25 2.25 0 01-2.25 2.25h-15a2.25 2.25 0 01-2.25-2.25V6.75m19.5 0A2.25 2.25 0 0019.5 4.5h-15a2.25 2.25 0 00-2.25 2.25m19.5 0v.243a2.25 2.25 0 01-1.07 1.916l-7.5 4.615a2.25 2.25 0 01-2.36 0L3.32 8.91a2.25 2.25 0 01-1.07-1.916V6.75" />
</svg>
<span class="text-sm ml-2 text-lg">Poskod</span>
</div>
</li>
</a>
{{-- <a href="#" class="rounded mb-2 mr-2 {{ Route::is('online') || Route::is('online.*') ? 'bg-gray-200 rounded text-white-500' : 'hover:bg-yellow-300 ' }}">
<li class="flex w-full justify-between text-gray-600 hover:text-gray-500 cursor-pointer items-center ">
<div class="flex items-center">
@@ -317,7 +329,7 @@
<hr class="mb-2">
<a href="{{ route('pengguna') }}"
<a href="{{ route('pengguna') }}"
class="rounded mb-2 mr-2 {{ Route::is('pengguna') || Route::is('pengguna.*') ? 'bg-gray-200 rounded text-white-500' : 'hover:bg-yellow-300 ' }}">
<li class="flex w-full justify-between text-gray-600 hover:text-gray-500 cursor-pointer items-center ">
<div class="flex items-center">
resources/views/poskod/create.blade.php
+141
View File
@@ -0,0 +1,141 @@
@extends('layouts.app')
@push('additional_styles')
<link href="{{ asset('css/slimselect.css') }}" rel="stylesheet">
<style>
div.ss-main {
min-height: 46.2px
}
</style>
@endpush
@section('content')
<div class="bg-gray-900 opacity-50 hidden fixed inset-0 z-10" id="sidebarBackdrop"></div>
<div id="main-content" class="h-full w-full bg-gray-50 relative overflow-y-auto">
<main>
<div class="pt-6 px-4">
<div class="bg-white mx-auto shadow rounded-lg p-4 sm:p-6 xl:p-8 w-1/2 2xl:col-span-1">
<h2 class="text-2xl mx-auto font-semibold leading-normal mt-0 mb-2 text-blueGray-800">
TAMBAH POSKOD
</h2>
<form id="daftar_poskod_form" action="{{ route('poskod.store') }}" method="post">
@csrf
<div class="grid grid-cols-2">
<div class="w-full px-3 mb-4">
<label class="block uppercase tracking-wide text-gray-700 text-xs font-bold mb-2">
poskod
</label>
<input
class="appearance-none block w-full bg-white-200 text-gray-700 border border-gray-200 rounded py-3 px-4 leading-tight focus:outline-none focus:bg-white focus:border-gray-500"
name="poskod" maxlength="5" minlength="5" pattern="[0-9]+" value="">
</div>
</div>
<div class="grid grid-cols-2">
<div class="w-full px-3 mb-4">
<label class="block uppercase tracking-wide text-gray-700 text-xs font-bold mb-2">
daerah
</label>
<select id="selectable-daerah" class="ss-main" style="min-height: 46.2px; "
name="koddaerah">
<option value="ola">Sila Pilih Daerah...</option>
</select>
</div>
</div>
<div class="grid grid-cols-2">
<div class="w-full px-3 mb-4">
<label class="block uppercase tracking-wide text-gray-700 text-xs font-bold mb-2">
negeri
</label>
<select id="selectable-negeri" class="ss-main" style="min-height: 46.2px; "
name="kodnegeri">
<option value="">Sila Pilih Negeri...</option>
</select>
</div>
</div>
<div class="flex justify-end">
<button
class="bg-blue-500 text-white active:bg-lightBlue-600 font-bold uppercase text-sm px-6 py-3 rounded shadow hover:shadow-lg outline-none focus:outline-none mr-1 mb-1 ease-linear transition-all duration-150"
type="submit">
Daftar
</button>
</div>
</form>
</div>
</div>
</main>
@include('layouts.footer')
@endsection
@push('additional_scripts')
<script src="{{ asset('js/slimselect.min.js') }}"></script>
<script>
document.addEventListener("DOMContentLoaded", () => {
let all_daerah = {!! json_encode($all_daerah) !!}
let all_negeri = {!! json_encode($all_negeri) !!}
let all_daerah_choices = all_daerah.map(x => {
return {
'text': x.namadaerah,
'value': x.koddaerah,
'data': {
'kodnegeri': x.kodnegeri,
},
}
});
let all_negeri_choices = all_negeri.map(x => {
return {
'text': x.negeri,
'value': x.kodnegeri,
}
});
let slimSelect_negeri = new SlimSelect({
select: '#selectable-negeri',
data: all_negeri_choices,
settings: {
disabled: true,
},
});
let slimSelect_daerah = new SlimSelect({
select: '#selectable-daerah',
data: all_daerah_choices,
events: {
afterChange: (newVal) => {
slimSelect_negeri.setSelected(newVal[0].data.kodnegeri);
}
}
});
document.querySelector('#daftar_poskod_form button[type="submit"]').addEventListener('click', function(e) {
e.preventDefault();
slimSelect_negeri.enable()
let poskod_no_error = document.querySelector('#daftar_poskod_form')
.querySelector('input[name="poskod"]')
.checkValidity();
if (!poskod_no_error) {
document.querySelector('#daftar_poskod_form').reportValidity();
return;
}
document.querySelector('#daftar_poskod_form').submit()
});
// initially select default value
slimSelect_daerah.setSelected(63);
});
</script>
@endpush
resources/views/poskod/edit.blade.php
+147
View File
@@ -0,0 +1,147 @@
@extends('layouts.app')
@push('additional_styles')
<link href="{{ asset('css/slimselect.css') }}" rel="stylesheet">
<style>
div.ss-main {
min-height: 46.2px
}
</style>
@endpush
@section('content')
<div class="bg-gray-900 opacity-50 hidden fixed inset-0 z-10" id="sidebarBackdrop"></div>
<div id="main-content" class="h-full w-full bg-gray-50 relative overflow-y-auto">
<main>
<div class="pt-6 px-4">
<div class="bg-white mx-auto shadow rounded-lg p-4 sm:p-6 xl:p-8 w-1/2 2xl:col-span-1">
<h2 class="text-2xl mx-auto font-semibold leading-normal mt-0 mb-2 text-blueGray-800">
KEMASKINI POSKOD
</h2>
<form id="kemaskini_poskod_form" action="{{ route('poskod.update', $postcode['poskod']) }}"
method="post">
@csrf
@method('PUT')
<input type="hidden" name="recno" value="{{ $postcode['recno'] }}">
<div class="grid grid-cols-2">
<div class="w-full px-3 mb-4">
<label class="block uppercase tracking-wide text-gray-700 text-xs font-bold mb-2">
poskod
</label>
<input
class="appearance-none block w-full bg-white-200 text-gray-700 border border-gray-200 rounded py-3 px-4 leading-tight focus:outline-none focus:bg-white focus:border-gray-500"
name="poskod" maxlength="5" minlength="5" pattern="[0-9]+"
value="{{ $postcode['poskod'] }}">
</div>
</div>
<div class="grid grid-cols-2">
<div class="w-full px-3 mb-4">
<label class="block uppercase tracking-wide text-gray-700 text-xs font-bold mb-2">
daerah
</label>
<select id="selectable-daerah" class="ss-main" style="min-height: 46.2px; "
name="koddaerah">
<option value="ola">Sila Pilih Daerah...</option>
</select>
</div>
</div>
<div class="grid grid-cols-2">
<div class="w-full px-3 mb-4">
<label class="block uppercase tracking-wide text-gray-700 text-xs font-bold mb-2">
negeri
</label>
<select id="selectable-negeri" class="ss-main" style="min-height: 46.2px; "
name="kodnegeri">
<option value="">Sila Pilih Negeri...</option>
</select>
</div>
</div>
<div class="flex justify-end">
<button
class="bg-blue-500 text-white active:bg-lightBlue-600 font-bold uppercase text-sm px-6 py-3 rounded shadow hover:shadow-lg outline-none focus:outline-none mr-1 mb-1 ease-linear transition-all duration-150"
type="submit">
Kemaskini
</button>
</div>
</form>
</div>
</div>
</main>
@include('layouts.footer')
@endsection
@push('additional_scripts')
<script src="{{ asset('js/slimselect.min.js') }}"></script>
<script>
document.addEventListener("DOMContentLoaded", () => {
let postcode = {!! json_encode($postcode) !!}
let all_daerah = {!! json_encode($all_daerah) !!}
let all_negeri = {!! json_encode($all_negeri) !!}
let all_daerah_choices = all_daerah.map(x => {
return {
'text': x.namadaerah,
'value': x.koddaerah,
'data': {
'kodnegeri': x.kodnegeri,
},
}
});
let all_negeri_choices = all_negeri.map(x => {
return {
'text': x.negeri,
'value': x.kodnegeri,
}
});
let slimSelect_negeri = new SlimSelect({
select: '#selectable-negeri',
data: all_negeri_choices,
settings: {
disabled: true,
},
});
let slimSelect_daerah = new SlimSelect({
select: '#selectable-daerah',
data: all_daerah_choices,
events: {
afterChange: (newVal) => {
slimSelect_negeri.setSelected(newVal[0].data.kodnegeri);
}
}
});
document.querySelector('#kemaskini_poskod_form button[type="submit"]').addEventListener('click', function(e) {
e.preventDefault();
slimSelect_negeri.enable()
let poskod_no_error = document.querySelector('#kemaskini_poskod_form')
.querySelector('input[name="poskod"]')
.checkValidity();
if (!poskod_no_error) {
document.querySelector('#kemaskini_poskod_form').reportValidity();
return;
}
document.querySelector('#kemaskini_poskod_form').submit()
});
// initially select default value
slimSelect_daerah.setSelected(postcode.koddaerah);
slimSelect_negeri.setSelected(postcode.negeri.kodnegeri);
});
</script>
@endpush
resources/views/poskod/index.blade.php
+198
View File
@@ -0,0 +1,198 @@
@extends('layouts.app')
@section('content')
<div class="bg-gray-900 opacity-50 hidden fixed inset-0 z-10" id="sidebarBackdrop"></div>
<div id="main-content" class="h-full w-full bg-gray-50 relative overflow-y-auto">
<main>
<div class="pt-6 px-4">
<div>
<ol class="list-reset flex text-grey-dark mb-4 rounded">
<li class="bg-gray-500 py-2 px-4 rounded text-white"><a href="/"><i
class="far fa-folder mr-2"></i>Home</a></li>
<li class="mt-2"><span class="mx-2"><i class="fas fa-angle-double-right"></i></span></li>
<li class="bg-yellow-600 py-2 px-4 rounded text-white"><a href="#"><i
class="mr-2 fas fa-toolbox"></i>Poskod</a></li>
</ol>
</div>
<div class="container w-full max-w-xl mx-auto mt-7 px-4 font-sans"
route="http://admin-portal.test/pelanggan">
<form class="bg-white w-full shadow-md rounded-lg px-8 pt-6 pb-4 mb-4" action="{{ request()->url() }}">
<div class="mb-4 w-96 mx-auto"><label class="block text-gray-500 font-medium text-sm mb-2">Kata
Kunci</label>
<div class="flex flex-wrap">
<div class="flex flex-row w-96 mx-auto">
<div class="flex flex-col w-96">
<input id="query_string" type="text" name="query_string"
value="{{ $query_string }}" placeholder="Masukkan Poskod, Daerah, atau Negeri"
class="mr-2 bg-gray-200 appearance-none border-2 border-gray-200 rounded w-full py-2 px-4 text-gray-700 leading-tight focus:outline-none focus:bg-white focus:border-blue-500">
<div role="menu" aria-orientation="vertical" aria-labelledby="menu-button"
tabindex="-1"
class="origin-top-right w-96 right-0 mt-2 w-56 rounded-md shadow-lg bg-white ring-1 ring-black ring-opacity-5 focus:outline-none hidden">
<div role="none" class="py-1"></div>
</div>
</div>
<button type="submit" id="buttonsearch" class="px-4 py-2 bg-blue-600 rounded ml-2"><i
class="fas fa-search text-white"></i></button>
</div>
</div>
</div>
</form>
</div>
<div class="container mx-auto px-5 my-5">
<article class="mt-8 lg:mt-5 prose prose-sm lg:prose-lg">
<div class="flex flex-row flex-row-reverse">
<div class="basis-o">
<button
@php
$create_route = "window.location.href = '". route('poskod.create') . '\'';
@endphp
onclick="{{$create_route}}"
class="bg-blue-500 hover:bg-blue-400 text-white font-bold py-2 px-4 border-b-4 border-blue-700 hover:border-blue-500 rounded mb-5">
<div class="flex">
<span class="pr-2">
Tambah Poskod
</span>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor"
class="w-6 h-6">
<path fill-rule="evenodd"
d="M12 2.25c-5.385 0-9.75 4.365-9.75 9.75s4.365 9.75 9.75 9.75 9.75-4.365 9.75-9.75S17.385 2.25 12 2.25zM12.75 9a.75.75 0 00-1.5 0v2.25H9a.75.75 0 000 1.5h2.25V15a.75.75 0 001.5 0v-2.25H15a.75.75 0 000-1.5h-2.25V9z"
clip-rule="evenodd" />
</svg>
</div>
</button>
</div>
</div>
<table class="min-w-full leading-normal">
<thead class="text-center">
<tr>
<th
class="font-extrabold px-5 py-3 border-b-2 border-gray-200 bg-gray-100 text-left text-xs font-semibold text-gray-600 uppercase tracking-wider">
Poskod
</th>
<th
class="font-extrabold px-5 py-3 border-b-2 border-gray-200 bg-gray-100 text-left text-xs font-semibold text-gray-600 uppercase tracking-wider">
Daerah
</th>
<th
class="font-extrabold px-5 py-3 border-b-2 border-gray-200 bg-gray-100 text-left text-xs font-semibold text-gray-600 uppercase tracking-wider">
Negeri
</th>
<th
class="font-extrabold px-5 py-3 border-b-2 border-gray-200 bg-gray-100 text-left text-xs font-semibold text-gray-600 uppercase tracking-wider">
</th>
</tr>
</thead>
<tbody>
@foreach ($postcodes['data'] as $postcode)
<tr>
<td
class="px-5 py-3 border-b-2 border-gray-200 bg-gray-100 text-left text-xs font-semibold text-gray-600 uppercase tracking-wider">
{{ $postcode['poskod'] }}
</td>
<td
class="px-5 py-3 border-b-2 border-gray-200 bg-gray-100 text-left text-xs font-semibold text-gray-600 uppercase tracking-wider">
{{ $postcode['daerah']['namadaerah'] }}
</td>
<td
class="px-5 py-3 border-b-2 border-gray-200 bg-gray-100 text-left text-xs font-semibold text-gray-600 uppercase tracking-wider">
{{ $postcode['negeri']['negeri'] }}
</td>
<td
class="px-5 py-3 border-b-2 border-gray-200 bg-gray-100 text-left text-xs font-semibold text-yellow-600 uppercase tracking-wider">
<a href="{{ route('poskod.edit', $postcode['poskod']) }}">edit</a>
</td>
</tr>
@endforeach
</tbody>
</table>
<div class="flex items-center justify-between border-t border-gray-200 bg-white px-4 py-3 sm:px-6">
<div class="flex flex-1 justify-between sm:hidden">
@php
$previous_page_number = $postcodes['current_page'] === 1 ? '' : $postcodes['current_page'] - 1;
@endphp
<a href="{{ request()->url() . '?page=' . $previous_page_number . '&query_string=' . $query_string }}"
class="relative inline-flex items-center rounded-md border border-gray-300 bg-white px-4 py-2 text-sm font-medium text-gray-700 hover:bg-gray-50">Previous</a>
@php
$next_page_number = $postcodes['current_page'] === $postcodes['last_page'] ? '' : $postcodes['current_page'] + 1;
@endphp
<a href="{{ request()->url() . '?page=' . $next_page_number . '&query_string=' . $query_string }}"
class="relative ml-3 inline-flex items-center rounded-md border border-gray-300 bg-white px-4 py-2 text-sm font-medium text-gray-700 hover:bg-gray-50">Next</a>
</div>
<div class="hidden sm:flex sm:flex-1 sm:items-center sm:justify-between">
<div>
<p class="text-sm text-gray-700">
Showing
<!-- space -->
<span class="font-medium">{{ $postcodes['from'] }}</span>
<!-- space -->
to
<!-- space -->
<span class="font-medium">{{ $postcodes['to'] }}</span>
<!-- space -->
of
<!-- space -->
<span class="font-medium">{{ $postcodes['total'] }}</span>
<!-- space -->
results
</p>
</div>
<div>
<nav class="isolate inline-flex -space-x-px rounded-md shadow-sm"
aria-label="Pagination">
@php
$previous_page_number = $postcodes['current_page'] === 1 ? '' : $postcodes['current_page'] - 1;
@endphp
<a href="{{ request()->url() . '?page=' . $next_page_number . '&query_string=' . $query_string }}"
class="relative
inline-flex items-center rounded-l-md px-2 py-2 text-gray-400 ring-1 ring-inset
ring-gray-300 hover:bg-gray-50 focus:z-20 focus:outline-offset-0">
<span class="sr-only">Previous</span>
<svg class="h-5 w-5" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
<path fill-rule="evenodd"
d="M12.79 5.23a.75.75 0 01-.02 1.06L8.832 10l3.938 3.71a.75.75 0 11-1.04 1.08l-4.5-4.25a.75.75 0 010-1.08l4.5-4.25a.75.75 0 011.06.02z"
clip-rule="evenodd"></path>
</svg>
</a>
@foreach ($paginator as $page_number)
@php
$is_current_page = $page_number === $postcodes['current_page'];
$determined_classes = $is_current_page ? $current_page_classes : $unselected_page_classes;
@endphp
<a href="{{ request()->url() . '?page=' . $page_number . '&query_string=' . $query_string }}"
class="{{ $determined_classes }}">{{ $page_number }}</a>
@endforeach
@php
$next_page_number = $postcodes['current_page'] === $postcodes['last_page'] ? '' : $postcodes['current_page'] + 1;
@endphp
<a href="{{ request()->url() . '?page=' . $next_page_number . '&query_string=' . $query_string }}"
class="relative
inline-flex items-center rounded-r-md px-2 py-2 text-gray-400 ring-1 ring-inset
ring-gray-300 hover:bg-gray-50 focus:z-20 focus:outline-offset-0">
<span class="sr-only">Next</span>
<svg class="h-5 w-5" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
<path fill-rule="evenodd"
d="M7.21 14.77a.75.75 0 01.02-1.06L11.168 10 7.23 6.29a.75.75 0 111.04-1.08l4.5 4.25a.75.75 0 010 1.08l-4.5 4.25a.75.75 0 01-1.06-.02z"
clip-rule="evenodd"></path>
</svg>
</a>
</nav>
</div>
</div>
</div>
</article>
</div>
</div>
</main>
@include('layouts.footer')
@endsection
routes/web.php
+8 -1
View File
@@ -15,7 +15,7 @@ use Illuminate\Support\Facades\Http;
*/
Route::get('/iframe', function () {
});
@@ -40,6 +40,13 @@ Route::get('/akaunhome', [App\Http\Controllers\HomeController::class, 'indexakau
//Tunai
Route::get('alirantunai',['as'=>'alirantunai','uses'=>'App\Http\Controllers\AliranTunaiController@AdminAliranTunai'])->middleware(['roleChecker:admin,null,null']);
//Poskod
Route::get('poskod',['as'=>'poskod.index','uses'=>'App\Http\Controllers\PoskodController@index'])->middleware(['roleChecker:admin,null,null']);
Route::post('poskod',['as'=>'poskod.store','uses'=>'App\Http\Controllers\PoskodController@store'])->middleware(['roleChecker:admin,null,null']);
Route::get('poskod/create',['as'=>'poskod.create','uses'=>'App\Http\Controllers\PoskodController@create'])->middleware(['roleChecker:admin,null,null']);
Route::get('poskod/{postcode}/edit',['as'=>'poskod.edit','uses'=>'App\Http\Controllers\PoskodController@edit'])->middleware(['roleChecker:admin,null,null']);
Route::put('poskod/{postcode}/update',['as'=>'poskod.update','uses'=>'App\Http\Controllers\PoskodController@update'])->middleware(['roleChecker:admin,null,null']);
//Peti Besi
Route::get('petibesi',['as'=>'petibesi','uses'=>'App\Http\Controllers\PetiBesiController@AdminPetiBesi'])->middleware(['roleChecker:admin,null,null']);