1. 1 Xây dựng giao diện backend (laracasts/flash) (ok)
Last updated
Last updated
C:\xampp82\htdocs\lva7\routes\web.php
Route::group(['prefix' => 'admin', 'as' => 'backend.', 'middleware' => ['auth']], function () {
/**
* Backend Dashboard
* Namespaces indicate folder structure.
*/
Route::get('/', [BackendController::class, 'index'])->name('home');
Route::get('dashboard', [BackendController::class, 'index'])->name('dashboard');
Route::get("settings", [SettingController::class, 'index'])->name("settings");
Route::post("settings", [SettingController::class, 'store'])->name("settings.store");
});C:\xampp82\htdocs\lva7\app\Http\Controllers\BackendController.php
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
class BackendController extends Controller
{
/**
* Display a listing of the resource.
*/
public function index()
{
return view("backend.index");
}
}
C:\xampp82\htdocs\lva7\app\helpers.php
<?php
/*
*
* Return Date with weekday
*
* ------------------------------------------------------------------------
*/
if (!function_exists('date_today')) {
/**
* Return Date with weekday.
*
* Carbon Locale will be considered here
* Example:
* শুক্রবার, ২৪ জুলাই ২০২০
* Friday, July 24, 2020
*/
function date_today()
{
$str = \Carbon\Carbon::now()->isoFormat('dddd, LL');
return $str;
}
}
C:\xampp82\htdocs\lva7\composer.json
"autoload": {
"psr-4": {
"App\\": "app/",
"Database\\Factories\\": "database/factories/",
"Database\\Seeders\\": "database/seeders/"
},
"files": [
"app/helpers.php"
]
},C:\xampp82\htdocs\lva7\vite.config.js
import { defineConfig } from 'vite';
import laravel from 'laravel-vite-plugin';
export default defineConfig({
plugins: [
laravel({
input: [
'resources/sass/app-backend.scss',
'resources/sass/app.scss',
'resources/js/app.js',
],
refresh: true,
}),
],
resolve: {
alias: {
'$': 'jQuery'
},
},
});
C:\xampp82\htdocs\lva1\resources\views\backend\layouts\app.blade.php
<!DOCTYPE html>
<html>
<head>
<meta
name="viewport"
content="width=device-width, initial-scale=1.0, shrink-to-fit=no"
>
<meta
name="csrf-token"
content="{{ csrf_token() }}"
>
<title>@yield('title') | {{ config('app.name') }}</title>
@vite(['resources/sass/app-backend.scss', 'resources/sass/app.scss'])
</head>
<body>
<!-- Sidebar -->
@include('backend.includes.sidebar')
<!-- /Sidebar -->
<div class="wrapper d-flex flex-column min-vh-100 bg-light">
<!-- Header -->
@include('backend.includes.header')
<!-- /Header -->
<div class="body flex-grow-1">
<div class="container-lg">
@include('flash::message')
<!-- Errors block -->
@include('backend.includes.errors')
<!-- / Errors block -->
<!-- Main content block -->
@yield('content')
<!-- / Main content block -->
</div>
</div>
<!-- Footer block -->
<footer class="footer text-muted mt-4">
<p>Footer block</p>
</footer>
<!-- / Footer block -->
</div>
</body>
</html>C:\xampp82\htdocs\lva7\resources\views\backend\includes\errors.blade.php
@if ($errors->any())
<div
class="alert alert-danger"
role="alert"
>
<p>
<i class="fas fa-exclamation-triangle"></i>@lang('Please fix the following errors & try again!')
</p>
<ul>
@foreach ($errors->all() as $error)
<li>{{ $error }}</li>
@endforeach
</ul>
</div>
@endif
C:\xampp82\htdocs\lva7\resources\views\backend\includes\header.blade.php
<header class="header header-sticky mb-2">
<div class="container-fluid">
<button
class="header-toggler px-md-0 me-md-3"
type="button"
onclick="coreui.Sidebar.getInstance(document.querySelector('#sidebar')).toggle()"
>
<i class="fa-solid fa-bars"></i>
</button>
</div>
<div class="header-divider"></div>
<div class="container-fluid">
<nav aria-label="breadcrumb">
<ol class="breadcrumb my-0 ms-2">
@yield('breadcrumbs')
</ol>
</nav>
<div class="d-flex float-end flex-row">
<div class="">{{ date_today() }} </div>
</div>
</div>
</header>
C:\xampp82\htdocs\lva7\resources\views\backend\includes\sidebar.blade.php
<div
class="sidebar sidebar-dark sidebar-fixed"
id="sidebar"
>
<div class="sidebar-brand d-none d-md-flex">
<a href="https://lva1.com/admin/dashboard">
<img
class="sidebar-brand-full"
src="https://lva1.com/img/backend-logo.jpg"
height="46"
alt="Laravel"
>
<img
class="sidebar-brand-narrow"
src="https://lva1.com/img/backend-logo-square.jpg"
height="46"
alt="Laravel"
>
</a>
</div>
<ul
class="sidebar-nav simplebar-scrollable-y simplebar-mouse-entered"
data-coreui="navigation"
data-simplebar="init"
>
<div
class="simplebar-wrapper"
style="margin: 0px;"
>
<div class="simplebar-height-auto-observer-wrapper">
<div class="simplebar-height-auto-observer"></div>
</div>
<div class="simplebar-mask">
<div
class="simplebar-offset"
style="right: 0px; bottom: 0px;"
>
<div
class="simplebar-content-wrapper"
tabindex="0"
role="region"
aria-label="scrollable content"
style="height: 100%; overflow: hidden scroll;"
>
<div
class="simplebar-content"
style="padding: 0px;"
>
<li class="nav-item"><a
class="nav-link"
href="{{ route('backend.settings') }}"
><i class="nav-icon fa-solid fa-cubes"></i> Dashboard</a></li>
<li class="nav-group">
<a
class="nav-link nav-group-toggle"
href="#"
><i class="nav-icon fas fa-file-alt"></i> Article</a>
<ul class="nav-group-items">
<li class="nav-item"><a
class="nav-link"
href="{{ route('backend.settings') }}"
><i class="nav-icon fas fa-file-alt"></i> Posts</a></li>
</ul>
</li>
<li class="nav-item"><a
class="nav-link"
href="{{ route('backend.settings') }}"
><i class="nav-icon fa-solid fa-sitemap"></i> Categories</a></li>
<li class="nav-item"><a
class="nav-link"
href="{{ route('backend.settings') }}"
><i class="nav-icon fas fa-tags"></i> Tags</a></li>
<li class="nav-item"><a
class="nav-link"
href="{{ route('backend.settings') }}"
><i class="nav-icon fas fa-comments"></i> Comments</a></li>
<li class="nav-item"><a
class="nav-link"
href="{{ route('backend.settings') }}"
><i class="nav-icon fas fa-bell"></i> Notifications</a></li>
<li class="nav-title"><a>Management</a></li>
<li class="nav-item active show"><a
class="nav-link active show"
href="{{ route('backend.settings') }}"
><i class="nav-icon fas fa-cogs"></i> Settings</a></li>
<li class="nav-item"><a
class="nav-link"
href="{{ route('backend.settings') }}"
><i class="nav-icon fas fa-archive"></i> Backups</a></li>
<li class="nav-group">
<a
class="nav-link nav-group-toggle"
href="#"
><i class="nav-icon fa-solid fa-user-gear"></i> Access
Control</a>
<ul class="nav-group-items">
<li class="nav-item"><a
class="nav-link"
href="{{ route('backend.settings') }}"
><i class="nav-icon fa-solid fa-user-group"></i> Users</a></li>
<li class="nav-item"><a
class="nav-link"
href="{{ route('backend.settings') }}"
><i class="nav-icon fa-solid fa-user-shield"></i> Roles</a></li>
</ul>
</li>
<li class="nav-group">
<a
class="nav-link nav-group-toggle"
href="#"
><i class="nav-icon fa-solid fa-list-check"></i> Log
Viewer</a>
<ul class="nav-group-items">
<li class="nav-item"><a
class="nav-link"
href="{{ route('backend.settings') }}"
><i class="nav-icon fa-solid fa-list"></i> Dashboard</a></li>
<li class="nav-item"><a
class="nav-link"
href="{{ route('backend.settings') }}"
><i class="nav-icon fa-solid fa-list-ol"></i> Logs by Days</a></li>
</ul>
</li>
</div>
</div>
</div>
</div>
<div
class="simplebar-placeholder"
style="width: 256px; height: 569px;"
></div>
</div>
<div
class="simplebar-track simplebar-horizontal"
style="visibility: hidden;"
>
<div
class="simplebar-scrollbar"
style="width: 0px; display: none;"
></div>
</div>
<div
class="simplebar-track simplebar-vertical"
style="visibility: visible;"
>
<div
class="simplebar-scrollbar"
style="height: 314px; display: block; transform: translate3d(0px, 0px, 0px);"
>
</div>
</div>
</ul>
<button
class="sidebar-toggler"
type="button"
data-coreui-toggle="unfoldable"
></button>
</div>
C:\xampp82\htdocs\lva7\resources\views\backend\index.blade.php
@extends('backend.layouts.app')
@section('title')
@lang('Dashboard')
@endsection
@section('breadcrumbs')
<x-backend-breadcrumbs />
@endsection
@section('content')
<div class="card mb-4">
<div class="card-body">
<p>section-header</p>
<!-- Dashboard Content Area -->
<p>Dashboard Content Area</p>
<!-- / Dashboard Content Area -->
</div>
</div>
@endsection
C:\xampp82\htdocs\lva7\resources\views\components\backend-breadcrumbs.blade.php
<li class="breadcrumb-item">
<a href="{{ route('backend.dashboard') }}">
<i class="fa-solid fa-cubes"></i>
{{ __('Dashboard') }}
</a>
</li>
{!! $slot !!}
