Admin dashboard in Laravel | Sign up and Sign in
Step 1: Install Laravel 8
step: Install UI
Note:
composer require laravel/ui
php artisan ui vue --auth
First, install a new Laravel app just running the below command in your terminal.
composer create-project --prefer-dist laravel/laravel laravel_dashboard_version10
Step 2: Update Your Database Credentials
After that update your database credentials in your .env file which is located in your project root.
1. connection databases
DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3306
DB_DATABASE=your_db
DB_USERNAME=root
DB_PASSWORD=#your database password
2. for send mail when fogot password
MAIL_DRIVER=smtp
MAIL_HOST=smtp.gmail.com
MAIL_PORT=587
MAIL_USERNAME=your email
MAIL_PASSWORD='your password email'
MAIL_ENCRYPTION=tls
MAIL_DRIVER=smtp
MAIL_HOST=smtp.gmail.com
MAIL_PORT=587
MAIL_USERNAME=your email
MAIL_PASSWORD='your password email'
MAIL_ENCRYPTION=tls
Step 3: Make Migration
After adding the migration file now run the migrate command.
php artisan migrate
Step 4: Add in Home Page
Add the below code in your home.blade.php file.
Resources/Views/home.blade.php
@extends('layouts.master')
@section('content')
<div class="sidebar sidebar-hide-to-small sidebar-shrink sidebar-gestures">
<div class="nano">
<div class="nano-content">
<ul>
<div class="logo">
<a href="index.html">
<img src="assets/images/logo.png" alt=""/>
<span>Soeng Souy</span>
</a>
</div>
<li class="label">Main</li>
<li><a href="index.html" class="sideba"><i class="ti-home"></i> Dashboard</a></li>
<li class="label">Apps</li>
<li><a class="sidebar-sub-toggle"><i class="ti-bar-chart-alt"></i> Charts <span
class="sidebar-collapse-icon ti-angle-down"></span></a>
<ul>
<li><a href="chart-flot.html">Flot</a></li>
<li><a href="chart-morris.html">Morris</a></li>
<li><a href="chartjs.html">Chartjs</a></li>
<li><a href="chartist.html">Chartist</a></li>
<li><a href="chart-peity.html">Peity</a></li>
<li><a href="chart-sparkline.html">Sparkle</a></li>
<li><a href="chart-knob.html">Knob</a></li>
</ul>
</li>
<li><a href="app-event-calender.html"><i class="ti-calendar"></i> Calender </a></li>
<li><a href="app-email.html"><i class="ti-email"></i> Email</a></li>
<li><a href="app-profile.html"><i class="ti-user"></i> Profile</a></li>
<li><a href="app-widget-card.html"><i class="ti-layout-grid2-alt"></i> Widget</a></li>
<li class="label">Features</li>
<li><a class="sidebar-sub-toggle"><i class="ti-layout"></i> UI Elements <span
class="sidebar-collapse-icon ti-angle-down"></span></a>
<ul>
<li><a href="ui-typography.html">Typography</a></li>
<li><a href="ui-alerts.html">Alerts</a></li>
<li><a href="ui-button.html">Button</a></li>
<li><a href="ui-dropdown.html">Dropdown</a></li>
<li><a href="ui-list-group.html">List Group</a></li>
<li><a href="ui-progressbar.html">Progressbar</a></li>
<li><a href="ui-tab.html">Tab</a></li>
</ul>
</li>
<li><a class="sidebar-sub-toggle"><i class="ti-panel"></i> Components <span
class="sidebar-collapse-icon ti-angle-down"></span></a>
<ul>
<li><a href="uc-calendar.html">Calendar</a></li>
<li><a href="uc-carousel.html">Carousel</a></li>
<li><a href="uc-weather.html">Weather</a></li>
<li><a href="uc-datamap.html">Datamap</a></li>
<li><a href="uc-todo-list.html">To do</a></li>
<li><a href="uc-scrollable.html">Scrollable</a></li>
<li><a href="uc-sweetalert.html">Sweet Alert</a></li>
<li><a href="uc-toastr.html">Toastr</a></li>
<li><a href="uc-range-slider-basic.html">Basic Range Slider</a></li>
<li><a href="uc-range-slider-advance.html">Advance Range Slider</a></li>
<li><a href="uc-nestable.html">Nestable</a></li>
<li><a href="uc-rating-bar-rating.html">Bar Rating</a></li>
<li><a href="uc-rating-jRate.html">jRate</a></li>
</ul>
</li>
<li><a class="sidebar-sub-toggle"><i class="ti-layout-grid4-alt"></i> Table <span
class="sidebar-collapse-icon ti-angle-down"></span></a>
<ul>
<li><a href="table-basic.html">Basic</a></li>
<li><a href="table-export.html">Datatable Export</a></li>
<li><a href="table-row-select.html">Datatable Row Select</a></li>
<li><a href="table-jsgrid.html">Editable </a></li>
</ul>
</li>
<li><a class="sidebar-sub-toggle"><i class="ti-heart"></i> Icons <span
class="sidebar-collapse-icon ti-angle-down"></span></a>
<ul>
<li><a href="font-themify.html">Themify</a></li>
</ul>
</li>
<li><a class="sidebar-sub-toggle"><i class="ti-map"></i> Maps <span
class="sidebar-collapse-icon ti-angle-down"></span></a>
<ul>
<li><a href="gmaps.html">Basic</a></li>
<li><a href="vector-map.html">Vector Map</a></li>
</ul>
</li>
<li class="label">Form</li>
<li><a href="form-basic.html"><i class="ti-view-list-alt"></i> Basic Form </a></li>
<li class="label">Extra</li>
<li><a class="sidebar-sub-toggle"><i class="ti-files"></i> Invoice <span
class="sidebar-collapse-icon ti-angle-down"></span></a>
<ul>
<li><a href="invoice.html">Basic</a></li>
<li><a href="invoice-editable.html">Editable</a></li>
</ul>
</li>
<li><a class="sidebar-sub-toggle"><i class="ti-target"></i> Pages <span
class="sidebar-collapse-icon ti-angle-down"></span></a>
<ul>
<li><a href="page-login.html">Login</a></li>
<li><a href="page-register.html">Register</a></li>
<li><a href="page-reset-password.html">Forgot password</a></li>
</ul>
</li>
<li><a href="#"><i class="ti-file"></i> Documentation</a></li>
<li><a href="{{ route('logout') }}"><i class="ti-close"></i> Logout</a></li>
</ul>
</div>
</div>
</div>
<!-- /# sidebar -->
<div class="header">
<div class="container-fluid">
<div class="row">
<div class="col-lg-12">
<div class="float-left">
<div class="hamburger sidebar-toggle">
<span class="line"></span>
<span class="line"></span>
<span class="line"></span>
</div>
</div>
<div class="float-right">
<div class="dropdown dib">
<div class="header-icon" data-toggle="dropdown">
<i class="ti-bell"></i>
<div class="drop-down dropdown-menu dropdown-menu-right">
<div class="dropdown-content-heading">
<span class="text-left">Recent Notifications</span>
</div>
<div class="dropdown-content-body">
<ul>
<li>
<a href="#">
<img class="pull-left m-r-10 avatar-img"
src="assets/images/avatar/3.jpg" alt="" />
<div class="notification-content">
<small class="notification-timestamp pull-right">02:34
PM</small>
<div class="notification-heading">Mr. Soeng Souy</div>
<div class="notification-text">5 members joined today </div>
</div>
</a>
</li>
<li>
<a href="#">
<img class="pull-left m-r-10 avatar-img"
src="assets/images/avatar/3.jpg" alt="" />
<div class="notification-content">
<small class="notification-timestamp pull-right">02:34
PM</small>
<div class="notification-heading">Mariam</div>
<div class="notification-text">likes a photo of you</div>
</div>
</a>
</li>
<li>
<a href="#">
<img class="pull-left m-r-10 avatar-img"
src="assets/images/avatar/3.jpg" alt="" />
<div class="notification-content">
<small class="notification-timestamp pull-right">02:34
PM</small>
<div class="notification-heading">Tasnim</div>
<div class="notification-text">Hi Teddy, Just wanted to let you
...</div>
</div>
</a>
</li>
<li>
<a href="#">
<img class="pull-left m-r-10 avatar-img"
src="assets/images/avatar/3.jpg" alt="" />
<div class="notification-content">
<small class="notification-timestamp pull-right">02:34
PM</small>
<div class="notification-heading">Mr. Soeng Souy</div>
<div class="notification-text">Hi Teddy, Just wanted to let you
...</div>
</div>
</a>
</li>
<li class="text-center">
<a href="#" class="more-link">See All</a>
</li>
</ul>
</div>
</div>
</div>
</div>
<div class="dropdown dib">
<div class="header-icon" data-toggle="dropdown">
<i class="ti-email"></i>
<div class="drop-down dropdown-menu dropdown-menu-right">
<div class="dropdown-content-heading">
<span class="text-left">2 New Messages</span>
<a href="email.html">
<i class="ti-pencil-alt pull-right"></i>
</a>
</div>
<div class="dropdown-content-body">
<ul>
<li class="notification-unread">
<a href="#">
<img class="pull-left m-r-10 avatar-img"
src="assets/images/avatar/1.jpg" alt="" />
<div class="notification-content">
<small class="notification-timestamp pull-right">02:34
PM</small>
<div class="notification-heading">Michael Qin</div>
<div class="notification-text">Hi Teddy, Just wanted to let you
...</div>
</div>
</a>
</li>
<li class="notification-unread">
<a href="#">
<img class="pull-left m-r-10 avatar-img"
src="assets/images/avatar/2.jpg" alt="" />
<div class="notification-content">
<small class="notification-timestamp pull-right">02:34
PM</small>
<div class="notification-heading">Mr. Soeng Souy</div>
<div class="notification-text">Hi Teddy, Just wanted to let you
...</div>
</div>
</a>
</li>
<li>
<a href="#">
<img class="pull-left m-r-10 avatar-img"
src="assets/images/avatar/3.jpg" alt="" />
<div class="notification-content">
<small class="notification-timestamp pull-right">02:34
PM</small>
<div class="notification-heading">Michael Qin</div>
<div class="notification-text">Hi Teddy, Just wanted to let you
...</div>
</div>
</a>
</li>
<li>
<a href="#">
<img class="pull-left m-r-10 avatar-img"
src="assets/images/avatar/2.jpg" alt="" />
<div class="notification-content">
<small class="notification-timestamp pull-right">02:34
PM</small>
<div class="notification-heading">Mr. Soeng Souy</div>
<div class="notification-text">Hi Teddy, Just wanted to let you
...</div>
</div>
</a>
</li>
<li class="text-center">
<a href="#" class="more-link">See All</a>
</li>
</ul>
</div>
</div>
</div>
</div>
<div class="dropdown dib">
<div class="header-icon" data-toggle="dropdown">
<span class="user-avatar">Soeng Souy
<i class="ti-angle-down f-s-10"></i>
</span>
<div class="drop-down dropdown-profile dropdown-menu dropdown-menu-right">
<div class="dropdown-content-heading">
<span class="text-left">Upgrade Now</span>
<p class="trial-day">30 Days Trail</p>
</div>
<div class="dropdown-content-body">
<ul>
<li>
<a href="#">
<i class="ti-user"></i>
<span>Profile</span>
</a>
</li>
<li>
<a href="#">
<i class="ti-email"></i>
<span>Inbox</span>
</a>
</li>
<li>
<a href="#">
<i class="ti-settings"></i>
<span>Setting</span>
</a>
</li>
<li>
<a href="#">
<i class="ti-lock"></i>
<span>Lock Screen</span>
</a>
</li>
<li>
<a href="{{ route('logout') }}">
<i class="ti-power-off"></i>
<span>Logout</span>
</a>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="content-wrap">
<div class="main">
<div class="container-fluid">
<div class="row">
<div class="col-lg-8 p-r-0 title-margin-right">
<div class="page-header">
<div class="page-title">
<h1>Hello, <span>Welcome Here</span></h1>
</div>
</div>
</div>
<!-- /# column -->
<div class="col-lg-4 p-l-0 title-margin-left">
<div class="page-header">
<div class="page-title">
<ol class="breadcrumb">
<li class="breadcrumb-item"><a href="#">Dashboard</a></li>
<li class="breadcrumb-item active">Home</li>
</ol>
</div>
</div>
</div>
<!-- /# column -->
</div>
<!-- /# row -->
<section id="main-content">
<div class="row">
<div class="col-lg-3">
<div class="card">
<div class="stat-widget-one">
<div class="stat-icon dib"><i class="ti-money color-success border-success"></i>
</div>
<div class="stat-content dib">
<div class="stat-text">Total Profit</div>
<div class="stat-digit">1,012</div>
</div>
</div>
</div>
</div>
<div class="col-lg-3">
<div class="card">
<div class="stat-widget-one">
<div class="stat-icon dib"><i class="ti-user color-primary border-primary"></i>
</div>
<div class="stat-content dib">
<div class="stat-text">New Customer</div>
<div class="stat-digit">961</div>
</div>
</div>
</div>
</div>
<div class="col-lg-3">
<div class="card">
<div class="stat-widget-one">
<div class="stat-icon dib"><i class="ti-layout-grid2 color-pink border-pink"></i>
</div>
<div class="stat-content dib">
<div class="stat-text">Active Projects</div>
<div class="stat-digit">770</div>
</div>
</div>
</div>
</div>
<div class="col-lg-3">
<div class="card">
<div class="stat-widget-one">
<div class="stat-icon dib"><i class="ti-link color-danger border-danger"></i></div>
<div class="stat-content dib">
<div class="stat-text">Referral</div>
<div class="stat-digit">2,781</div>
</div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-lg-8">
<div class="card">
<div class="card-title">
<h4>Fee Collections and Expenses</h4>
</div>
<div class="card-body">
<div class="ct-bar-chart m-t-30"></div>
</div>
</div>
</div>
<div class="col-lg-4">
<div class="card">
<div class="card-body">
<div class="ct-pie-chart"></div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-lg-4">
<div class="row">
<div class="col-lg-12">
<div class="card bg-primary">
<div class="weather-widget">
<div id="weather-one" class="weather-one p-22"></div>
</div>
</div>
</div>
<div class="col-lg-12">
<div class="card">
<div class="testimonial-widget-one p-17">
<div class="testimonial-widget-one owl-carousel owl-theme">
<div class="item">
<div class="testimonial-content">
<div class="testimonial-text">
<i class="fa fa-quote-left"></i> Lorem ipsum dolor sit amet,
consectetur adipisicing elit, sed do eiusmod tempor
incididunt ut labore et dolore magna aliqua. Ut enim ad
minim veniam, quis
nostrud exercitation <i class="fa fa-quote-right"></i>
</div>
<img class="testimonial-author-img"
src="assets/images/avatar/1.jpg" alt="" />
<div class="testimonial-author">TYRION LANNISTER</div>
<div class="testimonial-author-position">Founder-Ceo. Dell Corp
</div>
</div>
</div>
<div class="item">
<div class="testimonial-content">
<div class="testimonial-text">
<i class="fa fa-quote-left"></i> Lorem ipsum dolor sit amet,
consectetur adipisicing elit, sed do eiusmod tempor
incididunt ut labore et dolore magna aliqua. Ut enim ad
minim veniam, quis
nostrud exercitation <i class="fa fa-quote-right"></i>
</div>
<img class="testimonial-author-img"
src="assets/images/avatar/1.jpg" alt="" />
<div class="testimonial-author">TYRION LANNISTER</div>
<div class="testimonial-author-position">Founder-Ceo. Dell Corp
</div>
</div>
</div>
<div class="item">
<div class="testimonial-content">
<div class="testimonial-text">
<i class="fa fa-quote-left"></i> Lorem ipsum dolor sit amet,
consectetur adipisicing elit, sed do eiusmod tempor
incididunt ut labore et dolore magna aliqua. Ut enim ad
minim veniam, quis
nostrud exercitation <i class="fa fa-quote-right"></i>
</div>
<img class="testimonial-author-img"
src="assets/images/avatar/1.jpg" alt="" />
<div class="testimonial-author">TYRION LANNISTER</div>
<div class="testimonial-author-position">Founder-Ceo. Dell Corp
</div>
</div>
</div>
<div class="item">
<div class="testimonial-content">
<div class="testimonial-text">
<i class="fa fa-quote-left"></i> Lorem ipsum dolor sit amet,
consectetur adipisicing elit, sed do eiusmod tempor
incididunt ut labore et dolore magna aliqua. Ut enim ad
minim veniam, quis
nostrud exercitation <i class="fa fa-quote-right"></i>
</div>
<img class="testimonial-author-img"
src="assets/images/avatar/1.jpg" alt="" />
<div class="testimonial-author">TYRION LANNISTER</div>
<div class="testimonial-author-position">Founder-Ceo. Dell Corp
</div>
</div>
</div>
<div class="item">
<div class="testimonial-content">
<div class="testimonial-text">
<i class="fa fa-quote-left"></i> Lorem ipsum dolor sit amet,
consectetur adipisicing elit, sed do eiusmod tempor
incididunt ut labore et dolore magna aliqua. Ut enim ad
minim veniam, quis
nostrud exercitation <i class="fa fa-quote-right"></i>
</div>
<img class="testimonial-author-img"
src="assets/images/avatar/1.jpg" alt="" />
<div class="testimonial-author">TYRION LANNISTER</div>
<div class="testimonial-author-position">Founder-Ceo. Dell Corp
</div>
</div>
</div>
<div class="item">
<div class="testimonial-content">
<div class="testimonial-text">
<i class="fa fa-quote-left"></i> Lorem ipsum dolor sit amet,
consectetur adipisicing elit, sed do eiusmod tempor
incididunt ut labore et dolore magna aliqua. Ut enim ad
minim veniam, quis
nostrud exercitation <i class="fa fa-quote-right"></i>
</div>
<img class="testimonial-author-img"
src="assets/images/avatar/1.jpg" alt="" />
<div class="testimonial-author">TYRION LANNISTER</div>
<div class="testimonial-author-position">Founder-Ceo. Dell Corp
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- /# column -->
<div class="col-lg-8">
<div class="card">
<div class="card-title pr">
<h4>All Exam Result</h4>
</div>
<div class="card-body">
<div class="table-responsive">
<table class="table student-data-table m-t-20">
<thead>
<tr>
<th><label><input type="checkbox" value=""></label>Exam Name</th>
<th>Subject</th>
<th>Grade Point</th>
<th>Percent Form</th>
<th>Percent Upto</th>
<th>Date</th>
</tr>
</thead>
<tbody>
<tr>
<td>Class Test</td>
<td>Mathmatics</td>
<td>
4.00
</td>
<td>
95.00
</td>
<td>
100
</td>
<td>20/04/2017</td>
</tr>
<tr>
<td>Class Test</td>
<td>Mathmatics</td>
<td>
4.00
</td>
<td>
95.00
</td>
<td>
100
</td>
<td>20/04/2017</td>
</tr>
<tr>
<td>Class Test</td>
<td>English</td>
<td>
4.00
</td>
<td>
95.00
</td>
<td>
100
</td>
<td>20/04/2017</td>
</tr>
<tr>
<td>Class Test</td>
<td>Bangla</td>
<td>
4.00
</td>
<td>
95.00
</td>
<td>
100
</td>
<td>20/04/2017</td>
</tr>
<tr>
<td>Class Test</td>
<td>Mathmatics</td>
<td>
4.00
</td>
<td>
95.00
</td>
<td>
100
</td>
<td>20/04/2017</td>
</tr>
<tr>
<td>Class Test</td>
<td>English</td>
<td>
4.00
</td>
<td>
95.00
</td>
<td>
100
</td>
<td>20/04/2017</td>
</tr>
<tr>
<td>Class Test</td>
<td>Mathmatics</td>
<td>
4.00
</td>
<td>
95.00
</td>
<td>
100
</td>
<td>20/04/2017</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
<!-- /# column -->
</div>
<!-- /# row -->
<div class="row">
<div class="col-lg-3">
<div class="card p-0">
<div class="stat-widget-three home-widget-three">
<div class="stat-icon bg-facebook">
<i class="ti-facebook"></i>
</div>
<div class="stat-content">
<div class="stat-digit">8,268</div>
<div class="stat-text">Likes</div>
</div>
</div>
</div>
</div>
<div class="col-lg-3">
<div class="card p-0">
<div class="stat-widget-three home-widget-three">
<div class="stat-icon bg-youtube">
<i class="ti-youtube"></i>
</div>
<div class="stat-content">
<div class="stat-digit">12,545</div>
<div class="stat-text">Subscribes</div>
</div>
</div>
</div>
</div>
<div class="col-lg-3">
<div class="card p-0">
<div class="stat-widget-three home-widget-three">
<div class="stat-icon bg-twitter">
<i class="ti-twitter"></i>
</div>
<div class="stat-content">
<div class="stat-digit">7,982</div>
<div class="stat-text">Tweets</div>
</div>
</div>
</div>
</div>
<div class="col-lg-3">
<div class="card p-0">
<div class="stat-widget-three home-widget-three">
<div class="stat-icon bg-danger">
<i class="ti-linkedin"></i>
</div>
<div class="stat-content">
<div class="stat-digit">9,658</div>
<div class="stat-text">Followers</div>
</div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-lg-4">
<div class="card">
<div class="card-body">
<div class="year-calendar"></div>
</div>
</div>
<!-- /# card -->
</div>
<!-- /# column -->
<div class="col-lg-4">
<div class="card">
<div class="card-title">
<h4>Notice Board </h4>
</div>
<div class="recent-comment m-t-15">
<div class="media">
<div class="media-left">
<a href="#"><img class="media-object" src="assets/images/avatar/1.jpg"
alt="..."></a>
</div>
<div class="media-body">
<h4 class="media-heading color-primary">Soeng Souy</h4>
<p>Cras sit amet nibh libero, in gravida nulla.</p>
<p class="comment-date">10 min ago</p>
</div>
</div>
<div class="media">
<div class="media-left">
<a href="#"><img class="media-object" src="assets/images/avatar/2.jpg"
alt="..."></a>
</div>
<div class="media-body">
<h4 class="media-heading color-success">Mr. Soeng Souy</h4>
<p>Cras sit amet nibh libero, in gravida nulla.</p>
<p class="comment-date">1 hour ago</p>
</div>
</div>
<div class="media">
<div class="media-left">
<a href="#"><img class="media-object" src="assets/images/avatar/3.jpg"
alt="..."></a>
</div>
<div class="media-body">
<h4 class="media-heading color-danger">Mr. Soeng Souy</h4>
<p>Cras sit amet nibh libero, in gravida nulla.</p>
<div class="comment-date">Yesterday</div>
</div>
</div>
<div class="media">
<div class="media-left">
<a href="#"><img class="media-object" src="assets/images/avatar/1.jpg"
alt="..."></a>
</div>
<div class="media-body">
<h4 class="media-heading color-primary">Soeng Souy</h4>
<p>Cras sit amet nibh libero, in gravida nulla.</p>
<p class="comment-date">10 min ago</p>
</div>
</div>
<div class="media">
<div class="media-left">
<a href="#"><img class="media-object" src="assets/images/avatar/2.jpg"
alt="..."></a>
</div>
<div class="media-body">
<h4 class="media-heading color-success">Mr. Soeng Souy</h4>
<p>Cras sit amet nibh libero, in gravida nulla.</p>
<p class="comment-date">1 hour ago</p>
</div>
</div>
<div class="media no-border">
<div class="media-left">
<a href="#"><img class="media-object" src="assets/images/avatar/3.jpg"
alt="..."></a>
</div>
<div class="media-body">
<h4 class="media-heading color-info">Mr. Soeng Souy</h4>
<p>Cras sit amet nibh libero, in gravida nulla.</p>
<div class="comment-date">Yesterday</div>
</div>
</div>
</div>
</div>
<!-- /# card -->
</div>
<!-- /# column -->
<div class="col-lg-4">
<div class="card">
<div class="card-title">
<h4>Timeline</h4>
</div>
<div class="card-body">
<ul class="timeline">
<li>
<div class="timeline-badge primary"><i class="fa fa-smile-o"></i></div>
<div class="timeline-panel">
<div class="timeline-heading">
<h5 class="timeline-title">School promote video sharing</h5>
</div>
<div class="timeline-body">
<p>10 minutes ago</p>
</div>
</div>
</li>
<li>
<div class="timeline-badge warning"><i class="fa fa-sun-o"></i></div>
<div class="timeline-panel">
<div class="timeline-heading">
<h5 class="timeline-title">Ready our school website and online
service</h5>
</div>
<div class="timeline-body">
<p>20 minutes ago</p>
</div>
</div>
</li>
<li>
<div class="timeline-badge danger"><i class="fa fa-times-circle-o"></i>
</div>
<div class="timeline-panel">
<div class="timeline-heading">
<h5 class="timeline-title">Routine pubish our website form
10/03/2017 </h5>
</div>
<div class="timeline-body">
<p>30 minutes ago</p>
</div>
</div>
</li>
<li>
<div class="timeline-badge success"><i class="fa fa-check-circle-o"></i>
</div>
<div class="timeline-panel">
<div class="timeline-heading">
<h5 class="timeline-title">Principle quotation publish our website
</h5>
</div>
<div class="timeline-body">
<p>15 minutes ago</p>
</div>
</div>
</li>
<li>
<div class="timeline-badge warning"><i class="fa fa-sun-o"></i></div>
<div class="timeline-panel">
<div class="timeline-heading">
<h5 class="timeline-title">Class schedule publish our website</h5>
</div>
<div class="timeline-body">
<p>20 minutes ago</p>
</div>
</div>
</li>
</ul>
</div>
</div>
<!-- /# card -->
</div>
</div>
<!-- /# row -->
<div class="row">
<div class="col-lg-4">
<div class="card">
<div class="card-title">
<h4>Task</h4>
</div>
<div class="todo-list">
<div class="tdl-holder">
<div class="tdl-content">
<ul>
<li>
<label>
<input type="checkbox"><i></i><span>22,Dec Publish The Final
Exam Result</span>
<a href='#' class="ti-close"></a>
</label>
</li>
<li>
<label>
<input type="checkbox" checked><i></i><span>First Jan Start Our
School</span>
<a href='#' class="ti-close"></a>
</label>
</li>
<li>
<label>
<input type="checkbox"><i></i><span>Recently Our Maganement
Programme Start</span>
<a href='#' class="ti-close"></a>
</label>
</li>
<li>
<label>
<input type="checkbox" checked><i></i><span>Check out some
Popular courses</span>
<a href='#' class="ti-close"></a>
</label>
</li>
<li>
<label>
<input type="checkbox" checked><i></i><span>First Jan Start Our
School</span>
<a href='#' class="ti-close"></a>
</label>
</li>
<li>
<label>
<input type="checkbox" checked><i></i><span>Connect with one new
person</span>
<a href='#' class="ti-close"></a>
</label>
</li>
</ul>
</div>
<input type="text" class="tdl-new form-control"
placeholder="Write new item and hit 'Enter'...">
</div>
</div>
</div>
</div>
<div class="col-lg-8">
<div class="card">
<div class="card-title pr">
<h4>All Expense</h4>
</div>
<div class="card-body">
<div class="table-responsive">
<table class="table student-data-table m-t-20">
<thead>
<tr>
<th><label><input type="checkbox" value=""></label>ID</th>
<th>Expense Type</th>
<th>Amount</th>
<th>Status</th>
<th>Email</th>
<th>Date</th>
</tr>
</thead>
<tbody>
<tr>
<td><label><input type="checkbox" value=""></label>#2901</td>
<td>
Salary
</td>
<td>
$2000
</td>
<td>
<span class="badge badge-primary">Paid</span>
</td>
<td>
edumin@gmail.com
</td>
<td>
10/05/2017
</td>
</tr>
<tr>
<td><label><input type="checkbox" value=""></label>#2901</td>
<td>
Salary
</td>
<td>
$2000
</td>
<td>
<span class="badge badge-warning">Pending</span>
</td>
<td>
edumin@gmail.com
</td>
<td>
10/05/2017
</td>
</tr>
<tr>
<td><label><input type="checkbox" value=""></label>#2901</td>
<td>
Salary
</td>
<td>
$2000
</td>
<td>
<span class="badge badge-primary">Paid</span>
</td>
<td>
edumin@gmail.com
</td>
<td>
10/05/2017
</td>
</tr>
<tr>
<td><label><input type="checkbox" value=""></label>#2901</td>
<td>
Salary
</td>
<td>
$2000
</td>
<td>
<span class="badge badge-danger">Due</span>
</td>
<td>
edumin@gmail.com
</td>
<td>
10/05/2017
</td>
</tr>
<tr>
<td><label><input type="checkbox" value=""></label>#2901</td>
<td>
Salary
</td>
<td>
$2000
</td>
<td>
<span class="badge badge-primary">Paid</span>
</td>
<td>
edumin@gmail.com
</td>
<td>
10/05/2017
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
<!-- /# column -->
</div>
<div class="row">
<div class="col-lg-12">
<div class="footer">
<p>2018 © Admin Board. - <a href="#">example.com</a></p>
</div>
</div>
</div>
</section>
</div>
</div>
</div>
@endsection
@extends('layouts.master')
@section('content')
<div class="sidebar sidebar-hide-to-small sidebar-shrink sidebar-gestures">
<div class="nano">
<div class="nano-content">
<ul>
<div class="logo">
<a href="index.html">
<img src="assets/images/logo.png" alt=""/>
<span>Soeng Souy</span>
</a>
</div>
<li class="label">Main</li>
<li><a href="index.html" class="sideba"><i class="ti-home"></i> Dashboard</a></li>
<li class="label">Apps</li>
<li><a class="sidebar-sub-toggle"><i class="ti-bar-chart-alt"></i> Charts <span
class="sidebar-collapse-icon ti-angle-down"></span></a>
<ul>
<li><a href="chart-flot.html">Flot</a></li>
<li><a href="chart-morris.html">Morris</a></li>
<li><a href="chartjs.html">Chartjs</a></li>
<li><a href="chartist.html">Chartist</a></li>
<li><a href="chart-peity.html">Peity</a></li>
<li><a href="chart-sparkline.html">Sparkle</a></li>
<li><a href="chart-knob.html">Knob</a></li>
</ul>
</li>
<li><a href="app-event-calender.html"><i class="ti-calendar"></i> Calender </a></li>
<li><a href="app-email.html"><i class="ti-email"></i> Email</a></li>
<li><a href="app-profile.html"><i class="ti-user"></i> Profile</a></li>
<li><a href="app-widget-card.html"><i class="ti-layout-grid2-alt"></i> Widget</a></li>
<li class="label">Features</li>
<li><a class="sidebar-sub-toggle"><i class="ti-layout"></i> UI Elements <span
class="sidebar-collapse-icon ti-angle-down"></span></a>
<ul>
<li><a href="ui-typography.html">Typography</a></li>
<li><a href="ui-alerts.html">Alerts</a></li>
<li><a href="ui-button.html">Button</a></li>
<li><a href="ui-dropdown.html">Dropdown</a></li>
<li><a href="ui-list-group.html">List Group</a></li>
<li><a href="ui-progressbar.html">Progressbar</a></li>
<li><a href="ui-tab.html">Tab</a></li>
</ul>
</li>
<li><a class="sidebar-sub-toggle"><i class="ti-panel"></i> Components <span
class="sidebar-collapse-icon ti-angle-down"></span></a>
<ul>
<li><a href="uc-calendar.html">Calendar</a></li>
<li><a href="uc-carousel.html">Carousel</a></li>
<li><a href="uc-weather.html">Weather</a></li>
<li><a href="uc-datamap.html">Datamap</a></li>
<li><a href="uc-todo-list.html">To do</a></li>
<li><a href="uc-scrollable.html">Scrollable</a></li>
<li><a href="uc-sweetalert.html">Sweet Alert</a></li>
<li><a href="uc-toastr.html">Toastr</a></li>
<li><a href="uc-range-slider-basic.html">Basic Range Slider</a></li>
<li><a href="uc-range-slider-advance.html">Advance Range Slider</a></li>
<li><a href="uc-nestable.html">Nestable</a></li>
<li><a href="uc-rating-bar-rating.html">Bar Rating</a></li>
<li><a href="uc-rating-jRate.html">jRate</a></li>
</ul>
</li>
<li><a class="sidebar-sub-toggle"><i class="ti-layout-grid4-alt"></i> Table <span
class="sidebar-collapse-icon ti-angle-down"></span></a>
<ul>
<li><a href="table-basic.html">Basic</a></li>
<li><a href="table-export.html">Datatable Export</a></li>
<li><a href="table-row-select.html">Datatable Row Select</a></li>
<li><a href="table-jsgrid.html">Editable </a></li>
</ul>
</li>
<li><a class="sidebar-sub-toggle"><i class="ti-heart"></i> Icons <span
class="sidebar-collapse-icon ti-angle-down"></span></a>
<ul>
<li><a href="font-themify.html">Themify</a></li>
</ul>
</li>
<li><a class="sidebar-sub-toggle"><i class="ti-map"></i> Maps <span
class="sidebar-collapse-icon ti-angle-down"></span></a>
<ul>
<li><a href="gmaps.html">Basic</a></li>
<li><a href="vector-map.html">Vector Map</a></li>
</ul>
</li>
<li class="label">Form</li>
<li><a href="form-basic.html"><i class="ti-view-list-alt"></i> Basic Form </a></li>
<li class="label">Extra</li>
<li><a class="sidebar-sub-toggle"><i class="ti-files"></i> Invoice <span
class="sidebar-collapse-icon ti-angle-down"></span></a>
<ul>
<li><a href="invoice.html">Basic</a></li>
<li><a href="invoice-editable.html">Editable</a></li>
</ul>
</li>
<li><a class="sidebar-sub-toggle"><i class="ti-target"></i> Pages <span
class="sidebar-collapse-icon ti-angle-down"></span></a>
<ul>
<li><a href="page-login.html">Login</a></li>
<li><a href="page-register.html">Register</a></li>
<li><a href="page-reset-password.html">Forgot password</a></li>
</ul>
</li>
<li><a href="#"><i class="ti-file"></i> Documentation</a></li>
<li><a href="{{ route('logout') }}"><i class="ti-close"></i> Logout</a></li>
</ul>
</div>
</div>
</div>
<!-- /# sidebar -->
<div class="header">
<div class="container-fluid">
<div class="row">
<div class="col-lg-12">
<div class="float-left">
<div class="hamburger sidebar-toggle">
<span class="line"></span>
<span class="line"></span>
<span class="line"></span>
</div>
</div>
<div class="float-right">
<div class="dropdown dib">
<div class="header-icon" data-toggle="dropdown">
<i class="ti-bell"></i>
<div class="drop-down dropdown-menu dropdown-menu-right">
<div class="dropdown-content-heading">
<span class="text-left">Recent Notifications</span>
</div>
<div class="dropdown-content-body">
<ul>
<li>
<a href="#">
<img class="pull-left m-r-10 avatar-img"
src="assets/images/avatar/3.jpg" alt="" />
<div class="notification-content">
<small class="notification-timestamp pull-right">02:34
PM</small>
<div class="notification-heading">Mr. Soeng Souy</div>
<div class="notification-text">5 members joined today </div>
</div>
</a>
</li>
<li>
<a href="#">
<img class="pull-left m-r-10 avatar-img"
src="assets/images/avatar/3.jpg" alt="" />
<div class="notification-content">
<small class="notification-timestamp pull-right">02:34
PM</small>
<div class="notification-heading">Mariam</div>
<div class="notification-text">likes a photo of you</div>
</div>
</a>
</li>
<li>
<a href="#">
<img class="pull-left m-r-10 avatar-img"
src="assets/images/avatar/3.jpg" alt="" />
<div class="notification-content">
<small class="notification-timestamp pull-right">02:34
PM</small>
<div class="notification-heading">Tasnim</div>
<div class="notification-text">Hi Teddy, Just wanted to let you
...</div>
</div>
</a>
</li>
<li>
<a href="#">
<img class="pull-left m-r-10 avatar-img"
src="assets/images/avatar/3.jpg" alt="" />
<div class="notification-content">
<small class="notification-timestamp pull-right">02:34
PM</small>
<div class="notification-heading">Mr. Soeng Souy</div>
<div class="notification-text">Hi Teddy, Just wanted to let you
...</div>
</div>
</a>
</li>
<li class="text-center">
<a href="#" class="more-link">See All</a>
</li>
</ul>
</div>
</div>
</div>
</div>
<div class="dropdown dib">
<div class="header-icon" data-toggle="dropdown">
<i class="ti-email"></i>
<div class="drop-down dropdown-menu dropdown-menu-right">
<div class="dropdown-content-heading">
<span class="text-left">2 New Messages</span>
<a href="email.html">
<i class="ti-pencil-alt pull-right"></i>
</a>
</div>
<div class="dropdown-content-body">
<ul>
<li class="notification-unread">
<a href="#">
<img class="pull-left m-r-10 avatar-img"
src="assets/images/avatar/1.jpg" alt="" />
<div class="notification-content">
<small class="notification-timestamp pull-right">02:34
PM</small>
<div class="notification-heading">Michael Qin</div>
<div class="notification-text">Hi Teddy, Just wanted to let you
...</div>
</div>
</a>
</li>
<li class="notification-unread">
<a href="#">
<img class="pull-left m-r-10 avatar-img"
src="assets/images/avatar/2.jpg" alt="" />
<div class="notification-content">
<small class="notification-timestamp pull-right">02:34
PM</small>
<div class="notification-heading">Mr. Soeng Souy</div>
<div class="notification-text">Hi Teddy, Just wanted to let you
...</div>
</div>
</a>
</li>
<li>
<a href="#">
<img class="pull-left m-r-10 avatar-img"
src="assets/images/avatar/3.jpg" alt="" />
<div class="notification-content">
<small class="notification-timestamp pull-right">02:34
PM</small>
<div class="notification-heading">Michael Qin</div>
<div class="notification-text">Hi Teddy, Just wanted to let you
...</div>
</div>
</a>
</li>
<li>
<a href="#">
<img class="pull-left m-r-10 avatar-img"
src="assets/images/avatar/2.jpg" alt="" />
<div class="notification-content">
<small class="notification-timestamp pull-right">02:34
PM</small>
<div class="notification-heading">Mr. Soeng Souy</div>
<div class="notification-text">Hi Teddy, Just wanted to let you
...</div>
</div>
</a>
</li>
<li class="text-center">
<a href="#" class="more-link">See All</a>
</li>
</ul>
</div>
</div>
</div>
</div>
<div class="dropdown dib">
<div class="header-icon" data-toggle="dropdown">
<span class="user-avatar">Soeng Souy
<i class="ti-angle-down f-s-10"></i>
</span>
<div class="drop-down dropdown-profile dropdown-menu dropdown-menu-right">
<div class="dropdown-content-heading">
<span class="text-left">Upgrade Now</span>
<p class="trial-day">30 Days Trail</p>
</div>
<div class="dropdown-content-body">
<ul>
<li>
<a href="#">
<i class="ti-user"></i>
<span>Profile</span>
</a>
</li>
<li>
<a href="#">
<i class="ti-email"></i>
<span>Inbox</span>
</a>
</li>
<li>
<a href="#">
<i class="ti-settings"></i>
<span>Setting</span>
</a>
</li>
<li>
<a href="#">
<i class="ti-lock"></i>
<span>Lock Screen</span>
</a>
</li>
<li>
<a href="{{ route('logout') }}">
<i class="ti-power-off"></i>
<span>Logout</span>
</a>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="content-wrap">
<div class="main">
<div class="container-fluid">
<div class="row">
<div class="col-lg-8 p-r-0 title-margin-right">
<div class="page-header">
<div class="page-title">
<h1>Hello, <span>Welcome Here</span></h1>
</div>
</div>
</div>
<!-- /# column -->
<div class="col-lg-4 p-l-0 title-margin-left">
<div class="page-header">
<div class="page-title">
<ol class="breadcrumb">
<li class="breadcrumb-item"><a href="#">Dashboard</a></li>
<li class="breadcrumb-item active">Home</li>
</ol>
</div>
</div>
</div>
<!-- /# column -->
</div>
<!-- /# row -->
<section id="main-content">
<div class="row">
<div class="col-lg-3">
<div class="card">
<div class="stat-widget-one">
<div class="stat-icon dib"><i class="ti-money color-success border-success"></i>
</div>
<div class="stat-content dib">
<div class="stat-text">Total Profit</div>
<div class="stat-digit">1,012</div>
</div>
</div>
</div>
</div>
<div class="col-lg-3">
<div class="card">
<div class="stat-widget-one">
<div class="stat-icon dib"><i class="ti-user color-primary border-primary"></i>
</div>
<div class="stat-content dib">
<div class="stat-text">New Customer</div>
<div class="stat-digit">961</div>
</div>
</div>
</div>
</div>
<div class="col-lg-3">
<div class="card">
<div class="stat-widget-one">
<div class="stat-icon dib"><i class="ti-layout-grid2 color-pink border-pink"></i>
</div>
<div class="stat-content dib">
<div class="stat-text">Active Projects</div>
<div class="stat-digit">770</div>
</div>
</div>
</div>
</div>
<div class="col-lg-3">
<div class="card">
<div class="stat-widget-one">
<div class="stat-icon dib"><i class="ti-link color-danger border-danger"></i></div>
<div class="stat-content dib">
<div class="stat-text">Referral</div>
<div class="stat-digit">2,781</div>
</div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-lg-8">
<div class="card">
<div class="card-title">
<h4>Fee Collections and Expenses</h4>
</div>
<div class="card-body">
<div class="ct-bar-chart m-t-30"></div>
</div>
</div>
</div>
<div class="col-lg-4">
<div class="card">
<div class="card-body">
<div class="ct-pie-chart"></div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-lg-4">
<div class="row">
<div class="col-lg-12">
<div class="card bg-primary">
<div class="weather-widget">
<div id="weather-one" class="weather-one p-22"></div>
</div>
</div>
</div>
<div class="col-lg-12">
<div class="card">
<div class="testimonial-widget-one p-17">
<div class="testimonial-widget-one owl-carousel owl-theme">
<div class="item">
<div class="testimonial-content">
<div class="testimonial-text">
<i class="fa fa-quote-left"></i> Lorem ipsum dolor sit amet,
consectetur adipisicing elit, sed do eiusmod tempor
incididunt ut labore et dolore magna aliqua. Ut enim ad
minim veniam, quis
nostrud exercitation <i class="fa fa-quote-right"></i>
</div>
<img class="testimonial-author-img"
src="assets/images/avatar/1.jpg" alt="" />
<div class="testimonial-author">TYRION LANNISTER</div>
<div class="testimonial-author-position">Founder-Ceo. Dell Corp
</div>
</div>
</div>
<div class="item">
<div class="testimonial-content">
<div class="testimonial-text">
<i class="fa fa-quote-left"></i> Lorem ipsum dolor sit amet,
consectetur adipisicing elit, sed do eiusmod tempor
incididunt ut labore et dolore magna aliqua. Ut enim ad
minim veniam, quis
nostrud exercitation <i class="fa fa-quote-right"></i>
</div>
<img class="testimonial-author-img"
src="assets/images/avatar/1.jpg" alt="" />
<div class="testimonial-author">TYRION LANNISTER</div>
<div class="testimonial-author-position">Founder-Ceo. Dell Corp
</div>
</div>
</div>
<div class="item">
<div class="testimonial-content">
<div class="testimonial-text">
<i class="fa fa-quote-left"></i> Lorem ipsum dolor sit amet,
consectetur adipisicing elit, sed do eiusmod tempor
incididunt ut labore et dolore magna aliqua. Ut enim ad
minim veniam, quis
nostrud exercitation <i class="fa fa-quote-right"></i>
</div>
<img class="testimonial-author-img"
src="assets/images/avatar/1.jpg" alt="" />
<div class="testimonial-author">TYRION LANNISTER</div>
<div class="testimonial-author-position">Founder-Ceo. Dell Corp
</div>
</div>
</div>
<div class="item">
<div class="testimonial-content">
<div class="testimonial-text">
<i class="fa fa-quote-left"></i> Lorem ipsum dolor sit amet,
consectetur adipisicing elit, sed do eiusmod tempor
incididunt ut labore et dolore magna aliqua. Ut enim ad
minim veniam, quis
nostrud exercitation <i class="fa fa-quote-right"></i>
</div>
<img class="testimonial-author-img"
src="assets/images/avatar/1.jpg" alt="" />
<div class="testimonial-author">TYRION LANNISTER</div>
<div class="testimonial-author-position">Founder-Ceo. Dell Corp
</div>
</div>
</div>
<div class="item">
<div class="testimonial-content">
<div class="testimonial-text">
<i class="fa fa-quote-left"></i> Lorem ipsum dolor sit amet,
consectetur adipisicing elit, sed do eiusmod tempor
incididunt ut labore et dolore magna aliqua. Ut enim ad
minim veniam, quis
nostrud exercitation <i class="fa fa-quote-right"></i>
</div>
<img class="testimonial-author-img"
src="assets/images/avatar/1.jpg" alt="" />
<div class="testimonial-author">TYRION LANNISTER</div>
<div class="testimonial-author-position">Founder-Ceo. Dell Corp
</div>
</div>
</div>
<div class="item">
<div class="testimonial-content">
<div class="testimonial-text">
<i class="fa fa-quote-left"></i> Lorem ipsum dolor sit amet,
consectetur adipisicing elit, sed do eiusmod tempor
incididunt ut labore et dolore magna aliqua. Ut enim ad
minim veniam, quis
nostrud exercitation <i class="fa fa-quote-right"></i>
</div>
<img class="testimonial-author-img"
src="assets/images/avatar/1.jpg" alt="" />
<div class="testimonial-author">TYRION LANNISTER</div>
<div class="testimonial-author-position">Founder-Ceo. Dell Corp
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- /# column -->
<div class="col-lg-8">
<div class="card">
<div class="card-title pr">
<h4>All Exam Result</h4>
</div>
<div class="card-body">
<div class="table-responsive">
<table class="table student-data-table m-t-20">
<thead>
<tr>
<th><label><input type="checkbox" value=""></label>Exam Name</th>
<th>Subject</th>
<th>Grade Point</th>
<th>Percent Form</th>
<th>Percent Upto</th>
<th>Date</th>
</tr>
</thead>
<tbody>
<tr>
<td>Class Test</td>
<td>Mathmatics</td>
<td>
4.00
</td>
<td>
95.00
</td>
<td>
100
</td>
<td>20/04/2017</td>
</tr>
<tr>
<td>Class Test</td>
<td>Mathmatics</td>
<td>
4.00
</td>
<td>
95.00
</td>
<td>
100
</td>
<td>20/04/2017</td>
</tr>
<tr>
<td>Class Test</td>
<td>English</td>
<td>
4.00
</td>
<td>
95.00
</td>
<td>
100
</td>
<td>20/04/2017</td>
</tr>
<tr>
<td>Class Test</td>
<td>Bangla</td>
<td>
4.00
</td>
<td>
95.00
</td>
<td>
100
</td>
<td>20/04/2017</td>
</tr>
<tr>
<td>Class Test</td>
<td>Mathmatics</td>
<td>
4.00
</td>
<td>
95.00
</td>
<td>
100
</td>
<td>20/04/2017</td>
</tr>
<tr>
<td>Class Test</td>
<td>English</td>
<td>
4.00
</td>
<td>
95.00
</td>
<td>
100
</td>
<td>20/04/2017</td>
</tr>
<tr>
<td>Class Test</td>
<td>Mathmatics</td>
<td>
4.00
</td>
<td>
95.00
</td>
<td>
100
</td>
<td>20/04/2017</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
<!-- /# column -->
</div>
<!-- /# row -->
<div class="row">
<div class="col-lg-3">
<div class="card p-0">
<div class="stat-widget-three home-widget-three">
<div class="stat-icon bg-facebook">
<i class="ti-facebook"></i>
</div>
<div class="stat-content">
<div class="stat-digit">8,268</div>
<div class="stat-text">Likes</div>
</div>
</div>
</div>
</div>
<div class="col-lg-3">
<div class="card p-0">
<div class="stat-widget-three home-widget-three">
<div class="stat-icon bg-youtube">
<i class="ti-youtube"></i>
</div>
<div class="stat-content">
<div class="stat-digit">12,545</div>
<div class="stat-text">Subscribes</div>
</div>
</div>
</div>
</div>
<div class="col-lg-3">
<div class="card p-0">
<div class="stat-widget-three home-widget-three">
<div class="stat-icon bg-twitter">
<i class="ti-twitter"></i>
</div>
<div class="stat-content">
<div class="stat-digit">7,982</div>
<div class="stat-text">Tweets</div>
</div>
</div>
</div>
</div>
<div class="col-lg-3">
<div class="card p-0">
<div class="stat-widget-three home-widget-three">
<div class="stat-icon bg-danger">
<i class="ti-linkedin"></i>
</div>
<div class="stat-content">
<div class="stat-digit">9,658</div>
<div class="stat-text">Followers</div>
</div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-lg-4">
<div class="card">
<div class="card-body">
<div class="year-calendar"></div>
</div>
</div>
<!-- /# card -->
</div>
<!-- /# column -->
<div class="col-lg-4">
<div class="card">
<div class="card-title">
<h4>Notice Board </h4>
</div>
<div class="recent-comment m-t-15">
<div class="media">
<div class="media-left">
<a href="#"><img class="media-object" src="assets/images/avatar/1.jpg"
alt="..."></a>
</div>
<div class="media-body">
<h4 class="media-heading color-primary">Soeng Souy</h4>
<p>Cras sit amet nibh libero, in gravida nulla.</p>
<p class="comment-date">10 min ago</p>
</div>
</div>
<div class="media">
<div class="media-left">
<a href="#"><img class="media-object" src="assets/images/avatar/2.jpg"
alt="..."></a>
</div>
<div class="media-body">
<h4 class="media-heading color-success">Mr. Soeng Souy</h4>
<p>Cras sit amet nibh libero, in gravida nulla.</p>
<p class="comment-date">1 hour ago</p>
</div>
</div>
<div class="media">
<div class="media-left">
<a href="#"><img class="media-object" src="assets/images/avatar/3.jpg"
alt="..."></a>
</div>
<div class="media-body">
<h4 class="media-heading color-danger">Mr. Soeng Souy</h4>
<p>Cras sit amet nibh libero, in gravida nulla.</p>
<div class="comment-date">Yesterday</div>
</div>
</div>
<div class="media">
<div class="media-left">
<a href="#"><img class="media-object" src="assets/images/avatar/1.jpg"
alt="..."></a>
</div>
<div class="media-body">
<h4 class="media-heading color-primary">Soeng Souy</h4>
<p>Cras sit amet nibh libero, in gravida nulla.</p>
<p class="comment-date">10 min ago</p>
</div>
</div>
<div class="media">
<div class="media-left">
<a href="#"><img class="media-object" src="assets/images/avatar/2.jpg"
alt="..."></a>
</div>
<div class="media-body">
<h4 class="media-heading color-success">Mr. Soeng Souy</h4>
<p>Cras sit amet nibh libero, in gravida nulla.</p>
<p class="comment-date">1 hour ago</p>
</div>
</div>
<div class="media no-border">
<div class="media-left">
<a href="#"><img class="media-object" src="assets/images/avatar/3.jpg"
alt="..."></a>
</div>
<div class="media-body">
<h4 class="media-heading color-info">Mr. Soeng Souy</h4>
<p>Cras sit amet nibh libero, in gravida nulla.</p>
<div class="comment-date">Yesterday</div>
</div>
</div>
</div>
</div>
<!-- /# card -->
</div>
<!-- /# column -->
<div class="col-lg-4">
<div class="card">
<div class="card-title">
<h4>Timeline</h4>
</div>
<div class="card-body">
<ul class="timeline">
<li>
<div class="timeline-badge primary"><i class="fa fa-smile-o"></i></div>
<div class="timeline-panel">
<div class="timeline-heading">
<h5 class="timeline-title">School promote video sharing</h5>
</div>
<div class="timeline-body">
<p>10 minutes ago</p>
</div>
</div>
</li>
<li>
<div class="timeline-badge warning"><i class="fa fa-sun-o"></i></div>
<div class="timeline-panel">
<div class="timeline-heading">
<h5 class="timeline-title">Ready our school website and online
service</h5>
</div>
<div class="timeline-body">
<p>20 minutes ago</p>
</div>
</div>
</li>
<li>
<div class="timeline-badge danger"><i class="fa fa-times-circle-o"></i>
</div>
<div class="timeline-panel">
<div class="timeline-heading">
<h5 class="timeline-title">Routine pubish our website form
10/03/2017 </h5>
</div>
<div class="timeline-body">
<p>30 minutes ago</p>
</div>
</div>
</li>
<li>
<div class="timeline-badge success"><i class="fa fa-check-circle-o"></i>
</div>
<div class="timeline-panel">
<div class="timeline-heading">
<h5 class="timeline-title">Principle quotation publish our website
</h5>
</div>
<div class="timeline-body">
<p>15 minutes ago</p>
</div>
</div>
</li>
<li>
<div class="timeline-badge warning"><i class="fa fa-sun-o"></i></div>
<div class="timeline-panel">
<div class="timeline-heading">
<h5 class="timeline-title">Class schedule publish our website</h5>
</div>
<div class="timeline-body">
<p>20 minutes ago</p>
</div>
</div>
</li>
</ul>
</div>
</div>
<!-- /# card -->
</div>
</div>
<!-- /# row -->
<div class="row">
<div class="col-lg-4">
<div class="card">
<div class="card-title">
<h4>Task</h4>
</div>
<div class="todo-list">
<div class="tdl-holder">
<div class="tdl-content">
<ul>
<li>
<label>
<input type="checkbox"><i></i><span>22,Dec Publish The Final
Exam Result</span>
<a href='#' class="ti-close"></a>
</label>
</li>
<li>
<label>
<input type="checkbox" checked><i></i><span>First Jan Start Our
School</span>
<a href='#' class="ti-close"></a>
</label>
</li>
<li>
<label>
<input type="checkbox"><i></i><span>Recently Our Maganement
Programme Start</span>
<a href='#' class="ti-close"></a>
</label>
</li>
<li>
<label>
<input type="checkbox" checked><i></i><span>Check out some
Popular courses</span>
<a href='#' class="ti-close"></a>
</label>
</li>
<li>
<label>
<input type="checkbox" checked><i></i><span>First Jan Start Our
School</span>
<a href='#' class="ti-close"></a>
</label>
</li>
<li>
<label>
<input type="checkbox" checked><i></i><span>Connect with one new
person</span>
<a href='#' class="ti-close"></a>
</label>
</li>
</ul>
</div>
<input type="text" class="tdl-new form-control"
placeholder="Write new item and hit 'Enter'...">
</div>
</div>
</div>
</div>
<div class="col-lg-8">
<div class="card">
<div class="card-title pr">
<h4>All Expense</h4>
</div>
<div class="card-body">
<div class="table-responsive">
<table class="table student-data-table m-t-20">
<thead>
<tr>
<th><label><input type="checkbox" value=""></label>ID</th>
<th>Expense Type</th>
<th>Amount</th>
<th>Status</th>
<th>Email</th>
<th>Date</th>
</tr>
</thead>
<tbody>
<tr>
<td><label><input type="checkbox" value=""></label>#2901</td>
<td>
Salary
</td>
<td>
$2000
</td>
<td>
<span class="badge badge-primary">Paid</span>
</td>
<td>
edumin@gmail.com
</td>
<td>
10/05/2017
</td>
</tr>
<tr>
<td><label><input type="checkbox" value=""></label>#2901</td>
<td>
Salary
</td>
<td>
$2000
</td>
<td>
<span class="badge badge-warning">Pending</span>
</td>
<td>
edumin@gmail.com
</td>
<td>
10/05/2017
</td>
</tr>
<tr>
<td><label><input type="checkbox" value=""></label>#2901</td>
<td>
Salary
</td>
<td>
$2000
</td>
<td>
<span class="badge badge-primary">Paid</span>
</td>
<td>
edumin@gmail.com
</td>
<td>
10/05/2017
</td>
</tr>
<tr>
<td><label><input type="checkbox" value=""></label>#2901</td>
<td>
Salary
</td>
<td>
$2000
</td>
<td>
<span class="badge badge-danger">Due</span>
</td>
<td>
edumin@gmail.com
</td>
<td>
10/05/2017
</td>
</tr>
<tr>
<td><label><input type="checkbox" value=""></label>#2901</td>
<td>
Salary
</td>
<td>
$2000
</td>
<td>
<span class="badge badge-primary">Paid</span>
</td>
<td>
edumin@gmail.com
</td>
<td>
10/05/2017
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
<!-- /# column -->
</div>
<div class="row">
<div class="col-lg-12">
<div class="footer">
<p>2018 © Admin Board. - <a href="#">example.com</a></p>
</div>
</div>
</div>
</section>
</div>
</div>
</div>
@endsection
Step 5: Add Button in Register Page
Add the below code in your register.blade.php file.
Resources/Views/passwords/Auth/register.blade.php
Add the below code in your register.blade.php file.
Resources/Views/passwords/Auth/register.blade.php
@extends('layouts.app')
@section('content')
<div class="unix-login">
<div class="container-fluid">
<div class="row justify-content-center">
<div class="col-lg-6">
<div class="login-content">
<div class="login-logo">
<a href="index.html"><span>SOENG SOUY</span></a>
</div>
<div class="login-form">
<h4>Register to Administration</h4>
<form method="POST" action="{{ route('register') }}" class="md-float-material">
@csrf
<div class="form-group">
<label>User Name</label>
<input id="name" type="text" class="form-control @error('name') is-invalid @enderror" name="name" value="{{ old('name') }}" autocomplete="name" autofocus placeholder="Username">
@error('name')
<span class="invalid-feedback" role="alert">
<strong>{{ $message }}</strong>
</span>
@enderror
</div>
<div class="form-group">
<label>Email address</label>
<input id="email" type="email" class="form-control @error('email') is-invalid @enderror" name="email" value="{{ old('email') }}" autocomplete="email" placeholder="Enter email">
@error('email')
<span class="invalid-feedback" role="alert">
<strong>{{ $message }}</strong>
</span>
@enderror
</div>
<div class="form-group">
<label>Password</label>
<input id="password" type="password" class="form-control @error('password') is-invalid @enderror" name="password" autocomplete="new-password" placeholder="Enter password">
@error('password')
<span class="invalid-feedback" role="alert">
<strong>{{ $message }}</strong>
</span>
@enderror
</div>
<div class="form-group">
<label>Confirm Password</label>
<input type="password" class="form-control" name="password_confirmation">
</div>
<button type="submit" class="btn btn-primary btn-flat m-b-30 m-t-30">Register</button>
<div class="social-login-content">
<div class="social-button">
<button type="button" class="btn btn-primary bg-facebook btn-flat btn-addon m-b-10"><i class="ti-facebook"></i>Register with facebook</button>
<button type="button" class="btn btn-primary bg-twitter btn-flat btn-addon m-t-10"><i class="ti-twitter"></i>Register with twitter</button>
</div>
</div>
<div class="register-link m-t-15 text-center">
<p>Already have account ? <a href="{{ route('login') }}"> Sign in</a></p>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
@endsection
Step 6: Add Routes
In this step we create routes for Facebook login, add two routes in your web.php file.
app/routes/web.php
<?php
use Illuminate\Support\Facades\Route;
use App\Http\Controllers\PhotosController;
use App\Http\Controllers\Auth\LoginController;
use App\Http\Controllers\Auth\RegisterController;
use App\Http\Controllers\formController;
/*
|--------------------------------------------------------------------------
| Web Routes
|--------------------------------------------------------------------------
|
| Here is where you can register web routes for your application. These
| routes are loaded by the RouteServiceProvider within a group which
| contains the "web" middleware group. Now create something great!
|
*/
Route::get('/', function () {
return view('auth.login');
});
Auth::routes();
Route::get('/home', [App\Http\Controllers\HomeController::class, 'index'])->name('home');
// -----------------------------login-----------------------------------------
Route::get('/login', [App\Http\Controllers\Auth\LoginController::class, 'login'])->name('login');
Route::post('/login', [App\Http\Controllers\Auth\LoginController::class, 'authenticate']);
Route::get('/logout', [App\Http\Controllers\Auth\LoginController::class, 'logout'])->name('logout');
// ------------------------------register---------------------------------------
Route::get('/register', [App\Http\Controllers\Auth\RegisterController::class, 'register'])->name('register');
Route::post('/register', [App\Http\Controllers\Auth\RegisterController::class, 'storeUser'])->name('register');
// -----------------------------forget password ------------------------------
Route::get('forget-password', 'App\Http\Controllers\Auth\ForgotPasswordController@getEmail')->name('forget-password');
Route::post('forget-password', 'App\Http\Controllers\Auth\ForgotPasswordController@postEmail')->name('forget-password');
Route::get('reset-password/{token}', 'App\Http\Controllers\Auth\ResetPasswordController@getPassword');
Route::post('reset-password', 'App\Http\Controllers\Auth\ResetPasswordController@updatePassword');
// ------------------------------register---------------------------------------
Route::get('/register', [App\Http\Controllers\Auth\RegisterController::class, 'register'])->name('register');
Route::post('/register', [App\Http\Controllers\Auth\RegisterController::class, 'storeUser'])->name('register');
// -----------------------------form-----------------------------------------
Route::get('form/new', [App\Http\Controllers\formController::class, 'index'])->name('form/new');
Step 7: Create LoginController
php artisan make:controller LoginController
<?php
namespace App\Http\Controllers\Auth;
use App\Http\Controllers\Controller;
use App\Providers\RouteServiceProvider;
use Illuminate\Foundation\Auth\AuthenticatesUsers;
use Illuminate\Http\Request;
use Auth;
class LoginController extends Controller
{
/*
|--------------------------------------------------------------------------
| Login Controller
|--------------------------------------------------------------------------
|
| This controller handles authenticating users for the application and
| redirecting them to your home screen. The controller uses a trait
| to conveniently provide its functionality to your applications.
|
*/
use AuthenticatesUsers;
/**
* Where to redirect users after login.
*
* @var string
*/
protected $redirectTo = RouteServiceProvider::HOME;
/**
* Create a new controller instance.
*
* @return void
*/
public function __construct()
{
$this->middleware('guest')->except('logout');
}
public function login()
{
return view('auth.login');
}
public function authenticate(Request $request)
{
$request->validate([
'email' => 'required|string|email',
'password' => 'required|string',
]);
$credentials = $request->only('email', 'password');
if (Auth::attempt($credentials)) {
return redirect()->intended('home');
}
return redirect('login')->with('error', 'Oppose! You have entered invalid credentials');
}
public function logout()
{
Auth::logout();
return redirect('login');
}
}
Step 8: Add Button in Login Page
Add the below code in your login.blade.php file.
Resources/Views/passwords/Auth/login.blade.php
Add the below code in your login.blade.php file.
Resources/Views/passwords/Auth/login.blade.php
@extends('layouts.app')
@section('content')
<div class="unix-login">
<div class="container-fluid">
<div class="row justify-content-center">
<div class="col-lg-6">
<div class="login-content">
<div class="login-logo">
<a href="index.html"><span>SOENG SOUY</span></a>
</div>
<div class="login-form">
<h4>Administratior Login</h4>
@if(session()->has('error'))
<div class="text-danger text-center">
{{ session()->get('error') }}
</div>
@endif
<form method="POST" action="{{ route('login') }}" class="md-float-material">
@csrf
<div class="form-group">
<label>Email address</label>
<input id="email" type="email" class="form-control @error('email') is-invalid @enderror" name="email" value="{{ old('email') }}" autocomplete="email" autofocus placeholder="Enter email">
@error('email')
<span class="invalid-feedback" role="alert">
<strong>{{ $message }}</strong>
</span>
@enderror
</div>
<div class="form-group">
<label>Password</label>
<input id="password" type="password" class="form-control @error('password') is-invalid @enderror" name="password" autocomplete="current-password" placeholder="Enter password">
@error('password')
<span class="invalid-feedback" role="alert">
<strong>{{ $message }}</strong>
</span>
@enderror
</div>
<div class="checkbox">
<label>
<input type="checkbox"> Remember Me
</label>
<label class="pull-right">
<a href="{{ route('forget-password') }}">Forgotten Password?</a>
</label>
</div>
<button type="submit" class="btn btn-primary btn-flat m-b-30 m-t-30">Sign in</button>
<div class="social-login-content">
<div class="social-button">
<button type="button" class="btn btn-primary bg-facebook btn-flat btn-addon m-b-10"><i class="ti-facebook"></i>Sign in with facebook</button>
<button type="button" class="btn btn-primary bg-twitter btn-flat btn-addon m-t-10"><i class="ti-twitter"></i>Sign in with twitter</button>
</div>
</div>
<div class="register-link m-t-15 text-center">
<p>Don't have account ? <a href="{{route('register')}}"> Sign Up Here</a></p>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
@endsection
Step 9: Run Development Server
After successfully update all run the development server just adding the below command in the terminal.
php artisan serve
After this go to the browser and check using the login page.
http://localhost/laravel_dashboard_version10
/public/