cief/shipping-portal
1
0
Fork 0
mirror of https://gitlab.com/CIEFWorldwideSdnBhd/shipping-portal.git synced 2026-08-19 04:24:12 +00:00
Code Issues Packages Projects Releases Wiki Activity

update: integrate header,side menu to blade+vuejs.

Browse Source
This commit is contained in:
weichien00
2021-07-30 02:10:37 +08:00
parent ad7dae69c6
commit 8b5dd24a14
11 changed files with 234 additions and 95 deletions
Download Patch File Download Diff File Expand all files Collapse all files
resources/assets/sass/_custom.scss
Vendored
+113
View File
@@ -0,0 +1,113 @@
@page {
header: page-header;
footer: page-footer;
}
body {
font-family: sun-extA;
}
.header {
margin-top: 5em;
}
.sidebar {
width: 285px;
position: fixed;
top: 0;
bottom: 0;
left: 0;
z-index: 100;
padding: 0 15px 0 15px; /* Height of navbar */
/* box-shadow: inset -1px 0 0 rgba(0, 0, 0, .1); */
}
.sidebar-sticky {
position: relative;
top: 0;
height: calc(100vh - 48px);
padding-top: .5rem;
overflow-x: hidden;
overflow-y: auto; /* Scrollable contents if viewport is shorter than content. */
}
@supports ((position: -webkit-sticky) or (position: sticky)) {
.sidebar-sticky {
position: -webkit-sticky;
position: sticky;
}
}
.sidebar .nav-link {
font-weight: 500;
color: #333;
}
.sidebar .nav-link .feather {
margin-right: 4px;
color: #999;
}
.sidebar .nav-link.active {
color: #007bff;
}
.sidebar .nav-link:hover .feather,
.sidebar .nav-link.active .feather {
color: inherit;
}
.sidebar-heading {
font-size: .75rem;
text-transform: uppercase;
}
.navbar-brand {
padding-top: .75rem;
padding-bottom: .75rem;
font-size: 1rem;
background-color: rgba(0, 0, 0, .25);
box-shadow: inset -1px 0 0 rgba(0, 0, 0, .25);
}
.navbar .navbar-toggler {
top: .25rem;
right: 1rem;
}
.navbar .form-control {
padding: .75rem 1rem;
border-width: 0;
border-radius: 0;
}
.form-control-dark {
color: #fff;
background-color: rgba(255, 255, 255, .1);
border-color: rgba(255, 255, 255, .1);
}
.form-control-dark:focus {
border-color: transparent;
box-shadow: 0 0 0 3px rgba(255, 255, 255, .25);
}
.text-menu {
color: #a6a6a6;
font-size: 16px;
}
.board {
width: 100%;
height: 180px;
background: -webkit-linear-gradient(#503C93, #912873);
background: linear-gradient(#503C93, #912873);
}
.text-small {
font-size: 12px;
}
.btn-white {
background-color: #ffffff !important;
}
resources/assets/sass/main.scss
Vendored
+2
View File
@@ -32,6 +32,8 @@
@import "modules";
// Responsive Util
@import "responsive";
// Import custom
@import "custom";
resources/assets/vue/components/accounts/forms/LogOutFormComponent.vue
+2 -2
View File
@@ -2,8 +2,8 @@
<div class="row h-100 parentContainer">
<div class="col">
<div class="row align-items-center justify-content-center b-a b-thick h-100 pointer requestModal" data-type="logoutModal" style="border-color: #ffffff3d">
<div class="col p-r-10 p-l-10">
<i class="fa fa-power-off fs-12 text-primary-lighter"></i>
<div class="col m-t-15 m-b-20 m-r-15 ">
<a class="fs-12 light" style="color: #3c3c3c;" href="#">Sign Out</a>
<loading-component class="fixed-top h-100 bg-white" style="height: 200px; top: 0;" key="1" color="success" v-show="loading"></loading-component>
</div>
</div>
resources/assets/vue/components/general/elements/LoadingComponent.vue
+1 -1
View File
@@ -24,7 +24,7 @@
case 'primary':
return '#912873';
case 'success':
return '#349128';
return '#912873';
case 'danger':
return '#F3201F';
case 'white':
resources/views/layouts/base_portal.blade.php
+1
View File
@@ -2,6 +2,7 @@
@section('content')
@include('partials.header')
@include('partials.menu')
<div class="page-container">
<div class="page-content-wrapper p-b-50" style="padding-top: 70px;">
<div class="content pt-md-auto pt-4">
resources/views/pages/dashboard.blade.php → resources/views/pages/templates/dashboard.blade.php
View File
resources/views/partials/header.blade.php
+11 -89
View File
@@ -1,90 +1,12 @@
<div class="container-fluid p-r-15 p-l-15 position-fixed" style="z-index: 1050;">
<div class="row bg-primary-complete-gradient align-items-center justify-content-center">
<div class="col">
<div class="container-fluid container-fixed-lg no-padding">
<div class="row align-items-center justify-content-center">
<div class="col-auto hide">
<a href="#" class="btn-link toggle-sidebar fa fa-bars text-white" data-toggle="horizontal-menu"></a>
</div>
<div class="col-auto d-xs-none bg-complete-light p-t-10 p-b-10 p-l-30 p-r-30">
<a href="{{route('dashboard')}}"><div class="row">
<div class="col">
{{-- <img src="{{asset('images/logo-light.png')}}" alt="logo" height="22"> --}}
</div>
</div>
<div class="row">
<div class="col">
<div class="m-t-5 all-caps fs-10 text-white hint-text">Shipping Management</div>
</div>
</div>
</a>
</div>
<div class="col text-right p-r-30 d-none d-md-inline">
<div class="row justify-content-end">
<div class="col text-left">
<div class="row justify-content-end">
<div class="col-auto p-r-20">
<a href="{{route('dashboard')}}"><div class="text-white all-caps fs-12">Dashboard</div></a>
</div>
{{-- <div class="col-auto p-r-20" v-if="$store.getters.isAdmin">
<a href="{{route('payments')}}">
<div class="text-white all-caps fs-12">Payments & Billing</div>
</a>
</div>
<div class="col-auto p-r-20" v-if="$store.getters.isAdmin">
<a href="{{route('bookings')}}">
<div class="text-white all-caps fs-12">Transfers</div>
</a>
</div>
<div class="col-auto p-r-20" v-if="$store.getters.isAdmin">
<a href="{{route('bookings.urgent')}}">
<div class="text-white all-caps fs-12">Urgent List</div>
</a>
</div>
<div v-if="!$store.getters.isAdmin" class="col-auto p-r-20">
<a href="{{route('banks')}}"><div class="text-white all-caps fs-12">Bank Accounts</div></a>
</div> --}}
</div>
</div>
</div>
</div>
<div class="col-auto p-r-30">
<div class="row no-margin">
<div class="col-auto m-r-5 hide">
<div class="row align-items-center justify-content-center b-a b-thick h-100" style="border-color: #ffffff3d">
<div class="col p-r-10 p-l-10">
<i class="fa fa-bell fs-12 text-primary-lighter"></i>
</div>
</div>
</div>
<div class="col-auto m-r-20 d-none d-md-inline">
<div class="row align-items-center p-t-5 p-b-5 b-a b-thick" style="border-color: #ffffff3d">
<div class="col-auto">
<div class="fs-12 text-primary-lighter">Hi, <span v-text="$store.getters.getUserName.split(' ').slice(0,2).join(' ')"></span>!</div>
</div>
<div class="col-auto p-l-0 p-r-10 hide">
<div class="btn btn-xs btn-primary p-t-0 p-b-0 text-primary-lighter" style="background-color: rgba(255, 255, 255, 0.2);">
<i class="fa fa-angle-down fs-14 m-t-5"></i>
</div>
</div>
</div>
</div>
<div class="col-auto m-r-5 d-none d-md-inline">
{{-- <a href="{{route('settings')}}">
<div class="row align-items-center justify-content-center b-a b-thick h-100" style="border-color: #ffffff3d">
<div class="col p-r-10 p-l-10">
<i class="fa fa-cog fs-12 text-primary-lighter"></i>
</div>
</div>
</a> --}}
</div>
<div class="col-12 col-md-auto text-right">
<log-out-form-component></log-out-form-component>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="d-flex flex-column align-items-end navbar navbar-dark bg-light flex-md-nowrap p-0 shadow">
<button class="navbar-toggler position-absolute d-md-none collapsed" type="button" data-toggle="collapse"
data-target="#sidebarMenu" aria-controls="sidebarMenu" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<ul class="navbar-nav px-3">
<li class="nav-item text-nowrap">
<log-out-form-component></log-out-form-component>
</li>
</ul>
</div>
resources/views/partials/menu.blade.php
+89
View File
@@ -0,0 +1,89 @@
<div id="sidebarMenu" class="col-md-3 col-lg-2 d-md-block sidebar" style="background-color: #f6f6f6">
<div class="py-sm-3">
<a href="#">
<img class="" src="https://www.izyim.com/images/logo.png" alt="" height="24">
</a>
</div>
<div class="sidebar-sticky pt-3 pb-4">
<div class="d-flex flex-column justify-content-between" style="height: 100%">
<div>
<div class="py-sm-3">
<span class="fs-14 all-caps">Main Menu</span>
</div>
<ul class="nav flex-column justify-content-between" style="height: 250px">
<li class="nav-item">
<a class="text-menu font-weight-normal" href="#">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor"
class="bi bi-house-door" viewBox="0 0 16 16">
<path
d="M8.354 1.146a.5.5 0 0 0-.708 0l-6 6A.5.5 0 0 0 1.5 7.5v7a.5.5 0 0 0 .5.5h4.5a.5.5 0 0 0 .5-.5v-4h2v4a.5.5 0 0 0 .5.5H14a.5.5 0 0 0 .5-.5v-7a.5.5 0 0 0-.146-.354L13 5.793V2.5a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1.293L8.354 1.146zM2.5 14V7.707l5.5-5.5 5.5 5.5V14H10v-4a.5.5 0 0 0-.5-.5h-3a.5.5 0 0 0-.5.5v4H2.5z" />
</svg>
Dashboard
</a>
</li>
<li class="nav-item">
<a class="text-menu font-weight-normal" href="#">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor"
class="bi bi-journal-text" viewBox="0 0 16 16">
<path
d="M5 10.5a.5.5 0 0 1 .5-.5h2a.5.5 0 0 1 0 1h-2a.5.5 0 0 1-.5-.5zm0-2a.5.5 0 0 1 .5-.5h5a.5.5 0 0 1 0 1h-5a.5.5 0 0 1-.5-.5zm0-2a.5.5 0 0 1 .5-.5h5a.5.5 0 0 1 0 1h-5a.5.5 0 0 1-.5-.5zm0-2a.5.5 0 0 1 .5-.5h5a.5.5 0 0 1 0 1h-5a.5.5 0 0 1-.5-.5z" />
<path
d="M3 0h10a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H3a2 2 0 0 1-2-2v-1h1v1a1 1 0 0 0 1 1h10a1 1 0 0 0 1-1V2a1 1 0 0 0-1-1H3a1 1 0 0 0-1 1v1H1V2a2 2 0 0 1 2-2z" />
<path
d="M1 5v-.5a.5.5 0 0 1 1 0V5h.5a.5.5 0 0 1 0 1h-2a.5.5 0 0 1 0-1H1zm0 3v-.5a.5.5 0 0 1 1 0V8h.5a.5.5 0 0 1 0 1h-2a.5.5 0 0 1 0-1H1zm0 3v-.5a.5.5 0 0 1 1 0v.5h.5a.5.5 0 0 1 0 1h-2a.5.5 0 0 1 0-1H1z" />
</svg>
My Addresses
</a>
</li>
<li class="nav-item">
<a class="text-menu font-weight-normal" href="#">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor"
class="bi bi-file-earmark-text" viewBox="0 0 16 16">
<path
d="M5.5 7a.5.5 0 0 0 0 1h5a.5.5 0 0 0 0-1h-5zM5 9.5a.5.5 0 0 1 .5-.5h5a.5.5 0 0 1 0 1h-5a.5.5 0 0 1-.5-.5zm0 2a.5.5 0 0 1 .5-.5h2a.5.5 0 0 1 0 1h-2a.5.5 0 0 1-.5-.5z" />
<path
d="M9.5 0H4a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2V4.5L9.5 0zm0 1v2A1.5 1.5 0 0 0 11 4.5h2V14a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1h5.5z" />
</svg>
My Orders
</a>
</li>
<li class="nav-item">
<a class="text-menu font-weight-normal" href="#">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor"
class="bi bi-box" viewBox="0 0 16 16">
<path
d="M8.186 1.113a.5.5 0 0 0-.372 0L1.846 3.5 8 5.961 14.154 3.5 8.186 1.113zM15 4.239l-6.5 2.6v7.922l6.5-2.6V4.24zM7.5 14.762V6.838L1 4.239v7.923l6.5 2.6zM7.443.184a1.5 1.5 0 0 1 1.114 0l7.129 2.852A.5.5 0 0 1 16 3.5v8.662a1 1 0 0 1-.629.928l-7.185 2.874a.5.5 0 0 1-.372 0L.63 13.09a1 1 0 0 1-.63-.928V3.5a.5.5 0 0 1 .314-.464L7.443.184z" />
</svg>
My Packages
</a>
</li>
<li class="nav-item">
<a class="text-menu font-weight-normal" href="#">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor"
class="bi bi-truck" viewBox="0 0 16 16">
<path
d="M0 3.5A1.5 1.5 0 0 1 1.5 2h9A1.5 1.5 0 0 1 12 3.5V5h1.02a1.5 1.5 0 0 1 1.17.563l1.481 1.85a1.5 1.5 0 0 1 .329.938V10.5a1.5 1.5 0 0 1-1.5 1.5H14a2 2 0 1 1-4 0H5a2 2 0 1 1-3.998-.085A1.5 1.5 0 0 1 0 10.5v-7zm1.294 7.456A1.999 1.999 0 0 1 4.732 11h5.536a2.01 2.01 0 0 1 .732-.732V3.5a.5.5 0 0 0-.5-.5h-9a.5.5 0 0 0-.5.5v7a.5.5 0 0 0 .294.456zM12 10a2 2 0 0 1 1.732 1h.768a.5.5 0 0 0 .5-.5V8.35a.5.5 0 0 0-.11-.312l-1.48-1.85A.5.5 0 0 0 13.02 6H12v4zm-9 1a1 1 0 1 0 0 2 1 1 0 0 0 0-2zm9 0a1 1 0 1 0 0 2 1 1 0 0 0 0-2z" />
</svg>
Tracking
</a>
</li>
</ul>
</div>
<div class="container d-flex flex-column justify-content-between py-3 col-sx-12 rounded board">
<div class="inline v-align-middle">
<div class="text-white bold">Got Problems?</div>
<span class="text-white text-small normal">If you have any problems regarding your order, contact us
now.</span>
</div>
<div class="absolute hint-text dotted-grid"
style="width: 83px; height: 74px; margin-top: 80px; margin-left: 85px;"></div>
<div class="row m-t-15">
<div class="col text-center">
<div class="col btn btn-sm p-l-30 p-r-30 btn-white text-primary normal v-align-middle b-rad-1">
Contact Us</div>
</div>
</div>
</div>
</div>
</div>
</div>
resources/views/vendor/head.blade.php
Vendored
+1 -1
View File
@@ -1,6 +1,6 @@
<meta http-equiv="content-type" content="text/html;charset=UTF-8"/>
<meta charset="utf-8"/>
<title>Exchange - Overseas Money Transfers</title>
<title>IZYIM Shipping</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, shrink-to-fit=no"/>
<link rel="apple-touch-icon" sizes="180x180" href="images/favicon/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="images/favicon/favicon-32x32.png">
routes/template.php
+10
View File
@@ -0,0 +1,10 @@
<?php
use Illuminate\Support\Facades\Route;
//to access ://{{servername}}/template/dashboard
Route::group(['prefix' => 'template'], function () {
Route::get('/dashboard', function () {
return view('pages.templates.dashboard');
})->name('template.dashboard');
});
routes/web.php
+3 -1
View File
@@ -13,6 +13,8 @@ use Illuminate\Support\Facades\Route;
|
*/
require __DIR__ . '/template.php';
Route::get('/', function () {
return view('welcome');
});
@@ -39,5 +41,5 @@ Route::get('/account/password/reset/{token}', function ($token) {
})->name('account.password.reset');
Route::get('/dashboard', function () {
return view('pages.dashboard');
return view('pages.dashboards.index');
})->name('dashboard');