From 01f8fbcbc903f0310fb34748f8c213df9bd3ac07 Mon Sep 17 00:00:00 2001 From: Aji Kamaludin Date: Sat, 3 Jun 2023 01:52:46 +0700 Subject: [PATCH] bit fix --- app/Models/Customer.php | 2 ++ resources/css/spinner.css | 74 +++++++++++++++++++++++++++++++++++++++ resources/js/app.jsx | 34 ++++++++++-------- 3 files changed, 96 insertions(+), 14 deletions(-) create mode 100644 resources/css/spinner.css diff --git a/app/Models/Customer.php b/app/Models/Customer.php index c26fd94..e7927bd 100644 --- a/app/Models/Customer.php +++ b/app/Models/Customer.php @@ -8,6 +8,7 @@ use Illuminate\Database\Eloquent\Concerns\HasUlids; use Illuminate\Database\Eloquent\Factories\HasFactory; use Illuminate\Database\Eloquent\SoftDeletes; use Illuminate\Foundation\Auth\User as Authenticatable; +use Illuminate\Support\Str; class Customer extends Authenticatable { @@ -51,6 +52,7 @@ class Customer extends Authenticatable $basic = CustomerLevel::where('key', CustomerLevel::BASIC)->first(); $customer->customer_level_id = $basic->id; + $customer->referral_code = Str::random(6); CustomerLevelHistory::create([ 'customer_id' => $customer->id, diff --git a/resources/css/spinner.css b/resources/css/spinner.css new file mode 100644 index 0000000..7fd6006 --- /dev/null +++ b/resources/css/spinner.css @@ -0,0 +1,74 @@ +#nprogress { + pointer-events: none; +} + +#nprogress .bar { + background: #003bf1; + position: fixed; + z-index: 1031; + top: 0; + left: 0; + + width: 100%; + height: 5px; +} + +/* Fancy blur effect */ +#nprogress .peg { + display: block; + position: absolute; + right: 0px; + width: 100px; + height: 100%; + box-shadow: 0 0 10px #003bf1, 0 0 5px #003bf1; + opacity: 1.0; + + -webkit-transform: rotate(3deg) translate(0px, -4px); + -ms-transform: rotate(3deg) translate(0px, -4px); + transform: rotate(3deg) translate(0px, -4px); +} + +/* Remove these to get rid of the spinner */ +#nprogress .spinner { + display: block; + position: fixed; + z-index: 1031; + top: 0px !important; + right: 0px !important; + width: 100% !important; + height: 100% !important; + background-color: rgb(30 41 59 / 0.5); +} + +#nprogress .spinner-icon { + margin-left: auto; + margin-right: auto; + margin-top: 20%; + width: 200px !important; + height: 200px !important; + box-sizing: border-box; + + border: solid 12px transparent !important; + border-top-color: #003bf1 !important; + border-left-color: #003bf1 !important; + border-radius: 50%; + + -webkit-animation: nprogress-spinner 400ms linear infinite; + animation: nprogress-spinner 400ms linear infinite; +} + +.nprogress-custom-parent { + display: flex; + align-items: center; + justify-items: center; + height: 100vh; + width: 100vw; + overflow: hidden; + position: absolute; + background-color: rgb(30 41 59 / 0.5); +} + +.nprogress-custom-parent #nprogress .spinner, +.nprogress-custom-parent #nprogress .bar { + position: absolute; +} \ No newline at end of file diff --git a/resources/js/app.jsx b/resources/js/app.jsx index 03f1064..c56bcd5 100644 --- a/resources/js/app.jsx +++ b/resources/js/app.jsx @@ -1,22 +1,28 @@ -import './bootstrap'; -import '../css/app.css'; -import 'flowbite'; -import 'react-toastify/dist/ReactToastify.css'; +import './bootstrap' +import '../css/app.css' +import '../css/spinner.css' +import 'flowbite' +import 'react-toastify/dist/ReactToastify.css' -import React from 'react'; -import { createRoot } from 'react-dom/client'; -import { createInertiaApp } from '@inertiajs/react'; -import { resolvePageComponent } from 'laravel-vite-plugin/inertia-helpers'; +import React from 'react' +import { createRoot } from 'react-dom/client' +import { createInertiaApp } from '@inertiajs/react' +import { resolvePageComponent } from 'laravel-vite-plugin/inertia-helpers' -const appName = window.document.getElementsByTagName('title')[0]?.innerText || 'Laravel'; +const appName = + window.document.getElementsByTagName('title')[0]?.innerText || 'Laravel' createInertiaApp({ title: (title) => `${title} - ${appName}`, - resolve: (name) => resolvePageComponent(`./Pages/${name}.jsx`, import.meta.glob('./Pages/**/*.jsx')), + resolve: (name) => + resolvePageComponent( + `./Pages/${name}.jsx`, + import.meta.glob('./Pages/**/*.jsx') + ), setup({ el, App, props }) { - const root = createRoot(el); + const root = createRoot(el) - root.render(); + root.render() }, - progress: { color: '#003bf1' , showSpinner: true, includeCSS: true}, -}); + progress: { color: '#003bf1', showSpinner: true, includeCSS: true }, +})