MERMS/MermsEmrAdmin2025
1
0
Fork 0
Code Issues Pull Requests Releases Activity
Files
master
MermsEmrAdmin2025/app/Views/dash.php
T
CHIEFSOFT\ameye eeb11f842e first commit
2025-01-11 10:07:36 -05:00

1688 lines
134 KiB
PHP
Raw Permalink Blame History

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Mentor - Bootstrap 4 Admin Dashboard Template</title>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
<meta content="Admin template that can be used to build dashboards for CRM, CMS, etc." name="description" />
<meta content="Potenz Global Solutions" name="author" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<!-- app favicon -->
<link rel="shortcut icon" href="assets/img/favicon.ico">
<!-- google fonts -->
<link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700" rel="stylesheet">
<!-- plugin stylesheets -->
<link rel="stylesheet" type="text/css" href="assets/css/vendors.css" />
<!-- app style -->
<link href="assets/css/style.css" rel="stylesheet" type="text/css" />
</head>
<body class="light-sidebar">
<!-- begin app -->
<div class="app">
<!-- begin app-wrap -->
<div class="app-wrap">
<!-- begin pre-loader -->
<div class="loader">
<div class="h-100 d-flex justify-content-center">
<div class="align-self-center">
<img src="assets/img/loader/loader.svg" alt="loader">
</div>
</div>
</div>
<!-- end pre-loader -->
<!-- begin app-header -->
<header class="app-header top-bar">
<!-- begin navbar -->
<nav class="navbar navbar-expand-md">
<!-- begin navbar-header -->
<div class="navbar-header d-flex align-items-center">
<a href="javascript:void:(0)" class="mobile-toggle"><i class="ti ti-align-right"></i></a>
<a class="navbar-brand" href="index.html">
<img src="assets/img/logo-light.png" class="img-fluid logo-desktop" alt="logo" />
<img src="assets/img/logo-icon.png" class="img-fluid logo-mobile" alt="logo" />
</a>
</div>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<i class="ti ti-align-left"></i>
</button>
<!-- end navbar-header -->
<!-- begin navigation -->
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<div class="navigation d-flex">
<ul class="navbar-nav nav-left">
<li class="nav-item">
<a href="javascript:void(0)" class="nav-link sidebar-toggle">
<i class="ti ti-align-right"></i>
</a>
</li>
<li class="nav-item">
<a class="nav-link " href="javascript:void(0)" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Mega Menu
<i class="fa fa-angle-down"></i>
</a>
<div class="dropdown-menu mega-menu animated fadeIn" aria-labelledby="navbarDropdown">
<div class="row no-gutters">
<div class="col-sm-2 p-20">
<h4>UI Kit</h4>
<ul>
<li class="nav-link">
<a href="ui-alerts.html">Alerts</a>
</li>
<li class="nav-link">
<a href="ui-button.html">Buttons</a>
</li>
<li class="nav-link">
<a href="ui-cards.html">Cards</a>
</li>
<li class="nav-link">
<a href="ui-carousel.html">Carousel</a>
</li>
<li class="nav-link">
<a href="ui-dropdowns.html">Dropdowns</a>
</li>
<li class="nav-link">
<a href="ui-list-group.html">List Group</a>
</li>
<li class="nav-link">
<a href="ui-modals.html">Modals</a>
</li>
<li class="nav-link">
<a href="ui-progressbars.html">Progress Bars</a>
</li>
<li class="nav-link">
<a href="ui-tabs.html">Tabs</a>
</li>
</ul>
</div>
<div class="col-sm-2 p-20">
<h4>Pages</h4>
<ul>
<li class="nav-link">
<a href="page-account-settings.html">Account Settings</a>
</li>
<li class="nav-link">
<a href="page-clients.html">Clients</a>
</li>
<li class="nav-link">
<a href="page-contacts.html">Contacts</a>
</li>
<li class="nav-link">
<a href="page-gallery.html">Gallery</a>
</li>
<li class="nav-link">
<a href="page-pricing.html">Pricing</a>
</li>
<li class="nav-link">
<a href="page-task-list.html">Task List</a>
</li>
<li class="nav-link">
<a href="page-404.html">404</a>
</li>
<li class="nav-link">
<a href="page-500.html">500</a>
</li>
<li class="nav-link">
<a href="page-coming-soon.html">Coming Soon</a>
</li>
</ul>
</div>
<div class="col-sm-4 p-20">
<h4>Contact Us</h4>
<div>
<form>
<div class="form-group">
<input type="text" class="form-control" id="Password1" placeholder="Enter Name">
</div>
<div class="form-group">
<input type="email" class="form-control" id="Email1" placeholder="Enter Email">
</div>
<div class="form-group">
<textarea class="form-control" placeholder="Message" id="Textarea1" rows="3"></textarea>
</div>
<button type="submit" class="btn btn-primary text-uppercase">Submit</button>
</form>
</div>
</div>
<div class="col-sm-4">
<div class="chart-wrap">
<div class="p-20">
<h4 class="mb-1">Page Views</h4>
<p>Daily page visitors</p>
<h2 class="text-primary font-xxl mt-2">80+</h2>
</div>
<div class="apexchart-wrapper">
<div id="pageview"></div>
</div>
</div>
</div>
</div>
</div>
</li>
<li class="nav-item dropdown">
<a href="javascript:void(0)" class="nav-link " id="navbarDropdown1" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Drop Down
<i class="fa fa-angle-down"></i>
</a>
<div class="dropdown-menu animated fadeIn" aria-labelledby="navbarDropdown">
<a class="dropdown-item nav-link" href="javascript:void(0)">Action</a>
<a class="dropdown-item nav-link" href="javascript:void(0)">Another action</a>
<a class="dropdown-item nav-link" href="javascript:void(0)">Something else here</a>
</div>
</li>
<li class="nav-item full-screen d-none d-lg-block" id="btnFullscreen">
<a href="javascript:void(0)" class="nav-link expand">
<i class="icon-size-fullscreen"></i>
</a>
</li>
</ul>
<ul class="navbar-nav nav-right ml-auto">
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="javascript:void(0)" id="navbarDropdown2" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<i class="ti ti-email"></i>
</a>
<div class="dropdown-menu extended animated fadeIn" aria-labelledby="navbarDropdown">
<ul>
<li class="dropdown-header bg-gradient p-4 text-white text-left">Messages
<label class="label label-info label-round">6</label>
<a href="#" class="float-right btn btn-square btn-inverse-light btn-xs m-0">
<span class="font-13"> Mark all as read</span></a>
</li>
<li class="dropdown-body">
<ul class="scrollbar scroll_dark max-h-240">
<li>
<a href="javascript:void(0)">
<div class="notification d-flex flex-row align-items-center">
<div class="notify-icon bg-img align-self-center">
<img class="img-fluid" src="assets/img/avtar/03.jpg" alt="user3">
</div>
<div class="notify-message">
<p class="font-weight-bold">Brianing Leyon</p>
<small>You will sail along until you...</small>
</div>
</div>
</a>
</li>
<li>
<a href="javascript:void(0)">
<div class="notification d-flex flex-row align-items-center">
<div class="notify-icon bg-img align-self-center">
<img class="img-fluid" src="assets/img/avtar/01.jpg" alt="user">
</div>
<div class="notify-message">
<p class="font-weight-bold">Jimmyimg Leyon</p>
<small>Okay</small>
</div>
</div>
</a>
</li>
<li>
<a href="javascript:void(0)">
<div class="notification d-flex flex-row align-items-center">
<div class="notify-icon bg-img align-self-center">
<img class="img-fluid" src="assets/img/avtar/02.jpg" alt="user2">
</div>
<div class="notify-message">
<p class="font-weight-bold">Brainjon Leyon</p>
<small>So, make the decision...</small>
</div>
</div>
</a>
</li>
<li>
<a href="javascript:void(0)">
<div class="notification d-flex flex-row align-items-center">
<div class="notify-icon bg-img align-self-center">
<img class="img-fluid" src="assets/img/avtar/04.jpg" alt="user4">
</div>
<div class="notify-message">
<p class="font-weight-bold">Smithmin Leyon</p>
<small>Thanks</small>
</div>
</div>
</a>
</li>
<li>
<a href="javascript:void(0)">
<div class="notification d-flex flex-row align-items-center">
<div class="notify-icon bg-img align-self-center">
<img class="img-fluid" src="assets/img/avtar/05.jpg" alt="user5">
</div>
<div class="notify-message">
<p class="font-weight-bold">Jennyns Leyon</p>
<small>How are you</small>
</div>
</div>
</a>
</li>
<li>
<a href="javascript:void(0)">
<div class="notification d-flex flex-row align-items-center">
<div class="notify-icon bg-img align-self-center">
<img class="img-fluid" src="assets/img/avtar/06.jpg" alt="user6">
</div>
<div class="notify-message">
<p class="font-weight-bold">Demian Leyon</p>
<small>I like your themes</small>
</div>
</div>
</a>
</li>
</ul>
</li>
<li class="dropdown-footer">
<a class="font-13" href="javascript:void(0)"> View All messages </a>
</li>
</ul>
</div>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="javascript:void(0)" id="navbarDropdown3" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<i class="fe fe-bell"></i>
<span class="notify">
<span class="blink"></span>
<span class="dot"></span>
</span>
</a>
<div class="dropdown-menu extended animated fadeIn" aria-labelledby="navbarDropdown">
<ul>
<li class="dropdown-header bg-gradient p-4 text-white text-left">Notifications
<a href="#" class="float-right btn btn-square btn-inverse-light btn-xs m-0">
<span class="font-13"> Clear all</span></a>
</li>
<li class="dropdown-body min-h-240 nicescroll">
<ul class="scrollbar scroll_dark max-h-240">
<li>
<a href="javascript:void(0)">
<div class="notification d-flex flex-row align-items-center">
<div class="notify-icon bg-img align-self-center">
<div class="bg-type bg-type-md">
<span>HY</span>
</div>
</div>
<div class="notify-message">
<p class="font-weight-bold">New registered user</p>
<small>Just now</small>
</div>
</div>
</a>
</li>
<li>
<a href="javascript:void(0)">
<div class="notification d-flex flex-row align-items-center">
<div class="notify-icon bg-img align-self-center">
<div class="bg-type bg-type-md bg-success">
<span>GM</span>
</div>
</div>
<div class="notify-message">
<p class="font-weight-bold">New invoice received</p>
<small>22 min</small>
</div>
</div>
</a>
</li>
<li>
<a href="javascript:void(0)">
<div class="notification d-flex flex-row align-items-center">
<div class="notify-icon bg-img align-self-center">
<div class="bg-type bg-type-md bg-danger">
<span>FR</span>
</div>
</div>
<div class="notify-message">
<p class="font-weight-bold">Server error report</p>
<small>7 min</small>
</div>
</div>
</a>
</li>
<li>
<a href="javascript:void(0)">
<div class="notification d-flex flex-row align-items-center">
<div class="notify-icon bg-img align-self-center">
<div class="bg-type bg-type-md bg-info">
<span>HT</span>
</div>
</div>
<div class="notify-message">
<p class="font-weight-bold">Database report</p>
<small>1 day</small>
</div>
</div>
</a>
</li>
<li>
<a href="javascript:void(0)">
<div class="notification d-flex flex-row align-items-center">
<div class="notify-icon bg-img align-self-center">
<div class="bg-type bg-type-md">
<span>DE</span>
</div>
</div>
<div class="notify-message">
<p class="font-weight-bold">Order confirmation</p>
<small>2 day</small>
</div>
</div>
</a>
</li>
</ul>
</li>
<li class="dropdown-footer">
<a class="font-13" href="javascript:void(0)"> View All Notifications
</a>
</li>
</ul>
</div>
</li>
<li class="nav-item">
<a class="nav-link search" href="javascript:void(0)">
<i class="ti ti-search"></i>
</a>
<div class="search-wrapper">
<div class="close-btn">
<i class="ti ti-close"></i>
</div>
<div class="search-content">
<form>
<div class="form-group">
<i class="ti ti-search magnifier"></i>
<input type="text" class="form-control autocomplete" placeholder="Search Here" id="autocomplete-ajax" autofocus="autofocus">
</div>
</form>
</div>
</div>
</li>
<li class="nav-item dropdown user-profile">
<a href="javascript:void(0)" class="nav-link dropdown-toggle " id="navbarDropdown4" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<img src="assets/img/avtar/02.jpg" alt="avtar-img">
<span class="bg-success user-status"></span>
</a>
<div class="dropdown-menu animated fadeIn" aria-labelledby="navbarDropdown">
<div class="bg-gradient px-4 py-3">
<div class="d-flex align-items-center justify-content-between">
<div class="mr-1">
<h4 class="text-white mb-0">Alice Williams</h4>
<small class="text-white">Henry@example.com</small>
</div>
<a href="#" class="text-white font-20 tooltip-wrapper" data-toggle="tooltip" data-placement="top" title="" data-original-title="Logout"> <i
class="zmdi zmdi-power"></i></a>
</div>
</div>
<div class="p-4">
<a class="dropdown-item d-flex nav-link" href="javascript:void(0)">
<i class="fa fa-user pr-2 text-success"></i> Profile</a>
<a class="dropdown-item d-flex nav-link" href="javascript:void(0)">
<i class="fa fa-envelope pr-2 text-primary"></i> Inbox
<span class="badge badge-primary ml-auto">6</span>
</a>
<a class="dropdown-item d-flex nav-link" href="javascript:void(0)">
<i class=" ti ti-settings pr-2 text-info"></i> Settings
</a>
<a class="dropdown-item d-flex nav-link" href="javascript:void(0)">
<i class="fa fa-compass pr-2 text-warning"></i> Need help?</a>
<div class="row mt-2">
<div class="col">
<a class="bg-light p-3 text-center d-block" href="#">
<i class="fe fe-mail font-20 text-primary"></i>
<span class="d-block font-13 mt-2">My messages</span>
</a>
</div>
<div class="col">
<a class="bg-light p-3 text-center d-block" href="#">
<i class="fe fe-plus font-20 text-primary"></i>
<span class="d-block font-13 mt-2">Compose new</span>
</a>
</div>
</div>
</div>
</div>
</li>
</ul>
</div>
</div>
<!-- end navigation -->
</nav>
<!-- end navbar -->
</header>
<!-- end app-header -->
<!-- begin app-container -->
<div class="app-container">
<!-- begin app-nabar -->
<aside class="app-navbar">
<!-- begin sidebar-nav -->
<div class="sidebar-nav scrollbar scroll_dark">
<ul class="metismenu " id="sidebarNav">
<li class="nav-static-title">Personal</li>
<li class="active">
<a class="has-arrow" href="javascript:void(0)" aria-expanded="false">
<i class="nav-icon ti ti-rocket"></i>
<span class="nav-title">Dashboards</span>
<span class="nav-label label label-danger">9</span>
</a>
<ul aria-expanded="false">
<li> <a href='index.html'>Default</a> </li>
<li class="active"> <a href='index-ecommerce.html'>Ecommerce</a> </li>
<li> <a href='index-car-dealer.html'>Car Dealer</a> </li>
<li> <a href='index-stock-market.html'>Stock Market</a> </li>
<li> <a href='index-dating.html'>Dating</a> </li>
<li> <a href='index-job-portal.html'>Job Portal</a> </li>
<li> <a href='index-crm.html'>CRM</a> </li>
<li> <a href='index-real-estate.html'>Real Estate</a> </li>
<li> <a href='index-crypto-currency.html'>Crypto Currency</a> </li>
</ul>
</li>
<li><a href="app-chat.html" aria-expanded="false"><i class="nav-icon ti ti-comment"></i><span class="nav-title">Chat</span></a> </li>
<li><a class="has-arrow" href="javascript:void(0)" aria-expanded="false"><i class="nav-icon ti ti-calendar"></i><span class="nav-title">Calendar</span></a>
<ul aria-expanded="false">
<li> <a href='calendar-full.html'>Full Calendar</a> </li>
<li> <a href='calendar-list.html'>Calendar List</a> </li>
</ul>
</li>
<li><a href="mail-inbox.html" aria-expanded="false"><i class="nav-icon ti ti-email"></i><span class="nav-title">Mail</span></a> </li>
<li>
<a class="has-arrow" href="javascript:void(0)" aria-expanded="false"><i class="nav-icon ti ti-bag"></i> <span class="nav-title">UI Kit</span></a>
<ul aria-expanded="false">
<li> <a href="ui-alerts.html">Alerts</a> </li>
<li> <a href="ui-accordions.html">Accordions</a> </li>
<li> <a class="has-arrow" href="javascript: void(0);">Buttons</a>
<ul aria-expanded="false">
<li> <a href="ui-button.html">Default Buttons</a> </li>
<li> <a href="ui-button-icon.html">Icon Buttons</a> </li>
<li> <a href="ui-button-block.html">Block Buttons</a> </li>
<li> <a href="ui-button-social.html">Social Buttons</a> </li>
<li> <a href="ui-button-groups.html">Group Buttons</a> </li>
</ul>
</li>
<li> <a href="ui-badges.html">Badges</a> </li>
<li> <a href="ui-cards.html">Cards</a> </li>
<li> <a href="ui-carousel.html">Carousel</a> </li>
<li> <a href="ui-dropdowns.html">Dropdowns</a> </li>
<li> <a href="ui-grid.html">Grid</a> </li>
<li> <a href="ui-list-group.html">List Group</a> </li>
<li> <a href="ui-lightbox.html">Light Box</a> </li>
<li> <a href="ui-modals.html">Modals</a> </li>
<li> <a href="ui-media.html">Media</a> </li>
<li> <a href="ui-nestable-list.html">Nestable List</a> </li>
<li> <a href="ui-pagination.html">Pagination</a> </li>
<li> <a href="ui-progressbars.html">Progress Bars</a> </li>
<li> <a href="ui-sweet-alert.html">Sweet Alert</a> </li>
<li> <a href="ui-tabs.html">Tabs</a> </li>
<li> <a href="ui-nav.html">Nav</a> </li>
<li> <a href="ui-tooltips-popovers.html">Tooltips & Popovers</a> </li>
<li> <a href="ui-typography.html">Typography</a> </li>
<li> <a href="ui-toastr.html">Toastr</a> </li>
<li> <a href="ui-video.html">Video</a> </li>
</ul>
</li>
<li>
<a class="has-arrow" href="javascript:void(0)" aria-expanded="false"><i class="nav-icon ti ti-info"></i><span class="nav-title">Icons</span> </a>
<ul aria-expanded="false">
<li> <a href="icons-cryptocurrency.html">Cryptocurrency Icons</a> </li>
<li> <a href="icons-drip.html">Drip Icons</a> </li>
<li> <a href="icons-dash.html">Dash Icons</a> </li>
<li> <a href="icons-feather.html">Feather Icons</a> </li>
<li> <a href="icons-fontawesome.html">Font Awesome</a> </li>
<li> <a href="icons-ion.html">Ion Icons</a> </li>
<li> <a href="icons-weather.html">Weather Icons</a> </li>
<li> <a href="icons-material.html">Material Icons</a> </li>
<li> <a href="icons-themify.html">Themify Icons</a> </li>
</ul>
</li>
<li class="nav-static-title">Widgets, Tables & Layouts</li>
<li>
<a class="has-arrow" href="javascript:void(0)" aria-expanded="false"> <i class="nav-icon ti ti-settings"></i> <span class="nav-title">Widgets</span> <span class="nav-label label label-success">New</span> </a>
<ul aria-expanded="false">
<li> <a href="widget-chart.html">Chart Widget</a> </li>
<li> <a href="widget-list.html">List Widget</a> </li>
<li> <a href="widget-social.html">Social Widget</a> </li>
</ul>
</li>
<li>
<a class="has-arrow" href="javascript:void(0)" aria-expanded="false"><i class="nav-icon ti ti-layout-tab-window"></i><span class="nav-title">Tables</span></a>
<ul aria-expanded="false">
<li> <a href="tables-basic.html">Basic Table</a> </li>
<li> <a href="tables-color.html">Color Table </a> </li>
<li> <a href="tables-datatable.html">Data Table</a> </li>
<li> <a href="tables-editable.html">Editable Table</a> </li>
<li> <a href="tables-export.html">Export Table</a> </li>
</ul>
</li>
<li>
<a class="has-arrow" href="javascript:void(0)" aria-expanded="false"><i class="nav-icon ti ti-layout"></i> <span class="nav-title">Layouts</span></a>
<ul aria-expanded="false">
<li><a href="layout-mini.html">Sidebar Mini</a></li>
</ul>
</li>
<li>
<a class="has-arrow" href="javascript:void(0)" aria-expanded="false"><i class="nav-icon ti ti-pie-chart"></i><span class="nav-title">Charts</span></a>
<ul aria-expanded="false">
<li> <a href="chart-apex.html">Apex Chart</a> </li>
<li> <a href="chart-flot.html">Flot Chart</a> </li>
<li> <a href="chart-morris.html">Morris Chart</a> </li>
<li> <a href="chart-chartist.html">Chartist Charts</a> </li>
<li> <a href="chart-chartjs.html">Chartjs Chart</a> </li>
<li> <a href="chart-c3.html">C3 Chart</a> </li>
<li> <a href="chart-sparkline.html">Sparkline Chart</a> </li>
<li> <a href="chart-knob.html">Knob Chart</a> </li>
</ul>
</li>
<li>
<a class="has-arrow" href="javascript:void(0)" aria-expanded="false"> <i class="nav-icon ti ti-pencil-alt"></i> <span class="nav-title">Forms</span> </a>
<ul aria-expanded="false">
<li> <a href="form-autonumeric.html">Autonumeric</a> </li>
<li> <a href="form-editors.html">Editors</a> </li>
<li> <a href="form-elements.html">Elements</a> </li>
<li> <a href="form-file-upload.html">Drop Zone</a> </li>
<li> <a href="form-input-groups.html">Input Groups</a> </li>
<li> <a href="form-inputmask.html">Input Masks</a> </li>
<li> <a href="form-layouts.html">Forms Layouts</a> </li>
<li> <a href="form-listbox.html">Listbox</a> </li>
<li> <a href="form-pickers.html">Pickers</a> </li>
<li> <a href="form-range-slider.html">Range Slider</a> </li>
<li> <a href="form-selects.html">Selects</a> </li>
<li> <a href="form-switchers.html">Switchers</a> </li>
<li> <a href="form-validation.html">Validation</a> </li>
</ul>
</li>
<li class="nav-static-title">Extra Components</li>
<li>
<a class="has-arrow" href="javascript:void(0)" aria-expanded="false"><i class="nav-icon ti ti-map-alt"></i><span class="nav-title">Maps</span></a>
<ul aria-expanded="false">
<li> <a href="maps-google.html">Google Maps</a> </li>
<li> <a href="maps-vector.html">Vector Maps</a> </li>
<li> <a href="maps-mapael.html">Mapael Maps</a> </li>
</ul>
</li>
<li>
<a class="has-arrow" href="javascript:void(0)" aria-expanded="false"><i class="nav-icon ti ti-layers"></i><span class="nav-title">Pages</span><span class="nav-label label label-primary">12</span></a>
<ul aria-expanded="false">
<li> <a href="page-account-settings.html">Account Settings</a> </li>
<li> <a href="page-clients.html">Clients</a> </li>
<li> <a href="page-contacts.html">Contacts</a> </li>
<li> <a href="page-employees.html">Employees</a> </li>
<li> <a href="page-faq.html">FAQ</a> </li>
<li> <a href="page-file-manager.html">File Manager</a> </li>
<li> <a href="page-gallery.html">Gallery</a> </li>
<li> <a href="page-pricing.html">Pricing</a> </li>
<li> <a href="page-task-list.html">Task List</a> </li>
<li> <a href="page-404.html">404</a> </li>
<li> <a href="page-500.html">500</a> </li>
<li> <a href="page-coming-soon.html">Coming Soon</a> </li>
</ul>
</li>
<li>
<a class="has-arrow" href="javascript:void(0)" aria-expanded="false"><i class="nav-icon ti ti-key"></i><span class="nav-title">Auth</span></a>
<ul aria-expanded="false">
<li> <a href="auth-login.html">Login</a> </li>
<li> <a href="auth-register.html">Register</a> </li>
<li> <a href="auth-lockscreen.html">Lock Screen</a> </li>
</ul>
</li>
<li>
<a class="has-arrow" href="javascript:void(0)" aria-expanded="false"><i class="nav-icon ti ti-list"></i><span class="nav-title">Multi Level</span></a>
<ul aria-expanded="false">
<li> <a href="javascript: void(0);">Level 1.1</a> </li>
<li class="scoop-hasmenu">
<a class="has-arrow" href="javascript: void(0);">Level 1.2</a>
<ul aria-expanded="false">
<li> <a href="javascript: void(0);">Level 2.1</a> </li>
<li> <a href="javascript: void(0);">Level 2.2</a> </li>
</ul>
</li>
</ul>
</li>
<li class="sidebar-banner p-4 bg-gradient text-center m-3 d-block rounded">
<h5 class="text-white mb-1">Mentor admin</h5>
<p class="font-13 text-white line-20">Multipurpose Bootstrap 4 Admin Template</p>
<a class="btn btn-square btn-inverse-light btn-xs d-inline-block mt-2 mb-0" href="#"> Buy now</a>
</li>
</ul>
</div>
<!-- end sidebar-nav -->
</aside>
<!-- end app-navbar -->
<!-- begin app-main -->
<div class="app-main" id="main">
<!-- begin container-fluid -->
<div class="container-fluid">
<!-- begin row -->
<div class="row">
<div class="col-md-12 m-b-30">
<!-- begin page title -->
<div class="d-block d-sm-flex flex-nowrap align-items-center">
<div class="page-title mb-2 mb-sm-0">
<h1>Ecommerce</h1>
</div>
<div class="ml-auto d-flex align-items-center">
<nav>
<ol class="breadcrumb p-0 m-b-0">
<li class="breadcrumb-item">
<a href="index.html"><i class="ti ti-home"></i></a>
</li>
<li class="breadcrumb-item">
Dashboard
</li>
<li class="breadcrumb-item active text-primary" aria-current="page">Ecommerce</li>
</ol>
</nav>
</div>
</div>
<!-- end page title -->
</div>
</div>
<!-- end row -->
<!-- begin row -->
<div class="row">
<div class="col-sm-6 col-xxl-3">
<div class="card card-statistics ecommerce-contant overflow-h">
<div class="card-body p-0">
<div class="d-flex m-b-0 ecommerce-contant-text h-100">
<div class="w-100">
<div class="row p-3">
<div class="col">
<h3 class="mb-0">$65,456</h3>
<small class="d-block">Last 6 months</small>
</div>
<div class="col text-right">
<h5 class="text-muted mb-0">Revenue</h5>
<strong class="text-danger m-t-5"><i class="zmdi zmdi-long-arrow-up font-weight-bold"></i> N/A</strong>
</div>
</div>
<div class="apexchart-wrapper">
<div id="ecommercedemo3" class="chart-fit"></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-sm-6 col-xxl-3">
<div class="card card-statistics ecommerce-contant overflow-h">
<div class="card-body p-0">
<div class="d-flex ecommerce-contant-text m-b-0 h-100">
<div class="w-100">
<div class="row p-3">
<div class="col">
<h3 class="mb-0">52%</h3>
<small class="d-block">Past 12 hours</small>
</div>
<div class="col text-right">
<h5 class="text-muted mb-0">Conversion Rate</h5>
<strong class="text-primary m-t-5"><i class="zmdi zmdi-long-arrow-up font-weight-bold"></i> 5.35%</strong>
</div>
</div>
<div class="apexchart-wrapper">
<div id="ecommercedemo1" class="chart-fit"></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-sm-6 col-xxl-3">
<div class="card card-statistics ecommerce-contant overflow-h">
<div class="card-body p-0">
<div class="d-flex m-b-0 ecommerce-contant-text h-100">
<div class="w-100">
<div class="w-100">
<div class="row p-3">
<div class="col">
<h3 class="mb-0">605</h3>
<small class="d-block">Last 90 days</small>
</div>
<div class="col text-right">
<h5 class="text-muted mb-0">Transactions</h5>
<strong class="text-orange m-t-5"><i class="zmdi zmdi-long-arrow-up font-weight-bold"></i> 4.65%</strong>
</div>
</div>
</div>
<div class="apexchart-wrapper">
<div id="ecommercedemo2" class="chart-fit"></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-sm-6 col-xxl-3">
<div class="card card-statistics ecommerce-contant overflow-h">
<div class="card-body p-0">
<div class="d-flex m-b-0 ecommerce-contant-text h-100">
<div class="w-100">
<div class="row p-3">
<div class="col">
<h3 class="mb-0">5,687</h3>
<small class="d-block">Last 3 months</small>
</div>
<div class="col text-right">
<h5 class="text-muted mb-0">Purchases</h5>
<strong class="text-success m-t-5"><i class="zmdi zmdi-long-arrow-up font-weight-bold"></i> 9.89%</strong>
</div>
</div>
<div class="apexchart-wrapper">
<div id="ecommercedemo4" class="chart-fit"></div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-xxl-8 m-b-30">
<div class="card card-statistics h-100 mb-0">
<div class="card-header d-flex align-items-center justify-content-between">
<div class="card-heading">
<h4 class="card-title">Top selling products</h4>
</div>
<div class="dropdown">
<a class="btn btn-xs" href="#!">Export <i class="zmdi zmdi-download pl-1"></i> </a>
</div>
</div>
<div class="card-body scrollbar scroll_dark pt-0" style="max-height: 350px;">
<div class="datatable-wrapper table-responsive">
<table id="datatable" class="table table-borderless table-striped">
<thead>
<tr>
<th>#</th>
<th>Name</th>
<th>Price</th>
<th>In stock</th>
<th>Status</th>
<th>Action</th>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td>Cold Shoulder Bling Dress</td>
<td>$65.342</td>
<td>
<div class="progress my-3" style="height: 3px;">
<div class="progress-bar" role="progressbar" style="width: 80%;" aria-valuenow="80" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</td>
<td><span class="badge badge-success-inverse">Active</span></td>
<td> <a class="mr-3" href="javascript:void(0);"><i class="fe fe-edit"></i></a><a href="javascript:void(0);"><i class="fe fe-trash-2"></i></a></td>
</tr>
<tr>
<td>2</td>
<td>PlayStation 4 Pro 1TB Console</td>
<td>$47.655</td>
<td>
<div class="progress my-3" style="height: 3px;">
<div class="progress-bar" role="progressbar" style="width: 36%;" aria-valuenow="36" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</td>
<td><span class="badge badge-success-inverse">Active</span></td>
<td> <a class="mr-3" href="javascript:void(0);"><i class="fe fe-edit"></i></a><a href="javascript:void(0);"><i class="fe fe-trash-2"></i></a></td>
</tr>
<tr>
<td>3</td>
<td>Extra Fine Wool Jumpers</td>
<td>$56.479</td>
<td>
<div class="progress my-3" style="height: 3px;">
<div class="progress-bar" role="progressbar" style="width: 60%;" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</td>
<td><span class="badge badge-danger-inverse">Canceled</span></td>
<td> <a class="mr-3" href="javascript:void(0);"><i class="fe fe-edit"></i></a><a href="javascript:void(0);"><i class="fe fe-trash-2"></i></a></td>
</tr>
<tr>
<td>4</td>
<td>Long Sleeve Bow Top</td>
<td>$04.786</td>
<td>
<div class="progress my-3" style="height: 3px;">
<div class="progress-bar" role="progressbar" style="width: 50%;" aria-valuenow="50" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</td>
<td><span class="badge badge-success-inverse">Active</span></td>
<td> <a class="mr-3" href="javascript:void(0);"><i class="fe fe-edit"></i></a><a href="javascript:void(0);"><i class="fe fe-trash-2"></i></a></td>
</tr>
<tr>
<td>5</td>
<td>Shine Stripe Long Sleeve Ruffle</td>
<td>$23.456</td>
<td>
<div class="progress my-3" style="height: 3px;">
<div class="progress-bar" role="progressbar" style="width: 75%;" aria-valuenow="75" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</td>
<td><span class="badge badge-success-inverse">Active</span></td>
<td> <a class="mr-3" href="javascript:void(0);"><i class="fe fe-edit"></i></a><a href="javascript:void(0);"><i class="fe fe-trash-2"></i></a></td>
</tr>
<tr>
<td>6</td>
<td>Long Sleeve Micro Thermal Shirt</td>
<td>$65.598</td>
<td>
<div class="progress my-3" style="height: 3px;">
<div class="progress-bar" role="progressbar" style="width: 90%;" aria-valuenow="90" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</td>
<td><span class="badge badge-info-inverse">info</span></td>
<td> <a class="mr-3" href="javascript:void(0);"><i class="fe fe-edit"></i></a><a href="javascript:void(0);"><i class="fe fe-trash-2"></i></a></td>
</tr>
<tr>
<td>7</td>
<td>Standard Fit Bomber Sweater</td>
<td>$87.659</td>
<td>
<div class="progress my-3" style="height: 3px;">
<div class="progress-bar" role="progressbar" style="width: 45%;" aria-valuenow="45" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</td>
<td><span class="badge badge-warning-inverse">Warning</span></td>
<td> <a class="mr-3" href="javascript:void(0);"><i class="fe fe-edit"></i></a><a href="javascript:void(0);"><i class="fe fe-trash-2"></i></a></td>
</tr>
<tr>
<td>8</td>
<td>Standard Fit Crew T-Shirt</td>
<td>$32.466</td>
<td>
<div class="progress my-3" style="height: 3px;">
<div class="progress-bar" role="progressbar" style="width: 55%;" aria-valuenow="55" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</td>
<td><span class="badge badge-success-inverse">Active</span></td>
<td> <a class="mr-3" href="javascript:void(0);"><i class="fe fe-edit"></i></a><a href="javascript:void(0);"><i class="fe fe-trash-2"></i></a></td>
</tr>
<tr>
<td>9</td>
<td>Standard Fit Short Sleeve V-Neck</td>
<td>$03.544</td>
<td>
<div class="progress my-3" style="height: 3px;">
<div class="progress-bar" role="progressbar" style="width: 70%;" aria-valuenow="70" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</td>
<td><span class="badge badge-success-inverse">Active</span></td>
<td> <a class="mr-3" href="javascript:void(0);"><i class="fe fe-edit"></i></a><a href="javascript:void(0);"><i class="fe fe-trash-2"></i></a></td>
</tr>
<tr>
<td>10</td>
<td>Sanus Classic Small Full Motion Wall</td>
<td>$14.489</td>
<td>
<div class="progress my-3" style="height: 3px;">
<div class="progress-bar" role="progressbar" style="width: 65%;" aria-valuenow="65" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</td>
<td><span class="badge badge-success-inverse">Active</span></td>
<td> <a class="mr-3" href="javascript:void(0);"><i class="fe fe-edit"></i></a><a href="javascript:void(0);"><i class="fe fe-trash-2"></i></a></td>
</tr>
<tr>
<td>11</td>
<td>Jena Gaines</td>
<td>$78.654</td>
<td>
<div class="progress my-3" style="height: 3px;">
<div class="progress-bar" role="progressbar" style="width: 47%;" aria-valuenow="47" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</td>
<td><span class="badge badge-success-inverse">Active</span></td>
<td> <a class="mr-3" href="javascript:void(0);"><i class="fe fe-edit"></i></a><a href="javascript:void(0);"><i class="fe fe-trash-2"></i></a></td>
</tr>
<tr>
<td>12</td>
<td>Quinn Flynn</td>
<td>$23.486</td>
<td>
<div class="progress my-3" style="height: 3px;">
<div class="progress-bar" role="progressbar" style="width: 96%;" aria-valuenow="96" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</td>
<td><span class="badge badge-success-inverse">Active</span></td>
<td> <a class="mr-3" href="javascript:void(0);"><i class="fe fe-edit"></i></a><a href="javascript:void(0);"><i class="fe fe-trash-2"></i></a></td>
</tr>
<tr>
<td>13</td>
<td>Charde Marshall</td>
<td>$65.453</td>
<td>
<div class="progress my-3" style="height: 3px;">
<div class="progress-bar" role="progressbar" style="width: 74%;" aria-valuenow="74" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</td>
<td><span class="badge badge-success-inverse">Active</span></td>
<td> <a class="mr-3" href="javascript:void(0);"><i class="fe fe-edit"></i></a><a href="javascript:void(0);"><i class="fe fe-trash-2"></i></a></td>
</tr>
<tr>
<td>14</td>
<td>Haley Kennedy</td>
<td>$78.645</td>
<td>
<div class="progress my-3" style="height: 3px;">
<div class="progress-bar" role="progressbar" style="width: 62%;" aria-valuenow="62" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</td>
<td><span class="badge badge-success-inverse">Active</span></td>
<td> <a class="mr-3" href="javascript:void(0);"><i class="fe fe-edit"></i></a><a href="javascript:void(0);"><i class="fe fe-trash-2"></i></a></td>
</tr>
<tr>
<td>15</td>
<td>Tatyana Fitzpatrick</td>
<td>$65.342</td>
<td>
<div class="progress my-3" style="height: 3px;">
<div class="progress-bar" role="progressbar" style="width: 55%;" aria-valuenow="55" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</td>
<td><span class="badge badge-success-inverse">Active</span></td>
<td> <a class="mr-3" href="javascript:void(0);"><i class="fe fe-edit"></i></a><a href="javascript:void(0);"><i class="fe fe-trash-2"></i></a></td>
</tr>
<tr>
<td>16</td>
<td>Michael Silva</td>
<td>$07.456</td>
<td>
<div class="progress my-3" style="height: 3px;">
<div class="progress-bar" role="progressbar" style="width: 47%;" aria-valuenow="47" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</td>
<td><span class="badge badge-success-inverse">Active</span></td>
<td> <a class="mr-3" href="javascript:void(0);"><i class="fe fe-edit"></i></a><a href="javascript:void(0);"><i class="fe fe-trash-2"></i></a></td>
</tr>
<tr>
<td>17</td>
<td>Paul Byrd</td>
<td>$36.478</td>
<td>
<div class="progress my-3" style="height: 3px;">
<div class="progress-bar" role="progressbar" style="width: 36%;" aria-valuenow="36" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</td>
<td><span class="badge badge-success-inverse">Active</span></td>
<td> <a class="mr-3" href="javascript:void(0);"><i class="fe fe-edit"></i></a><a href="javascript:void(0);"><i class="fe fe-trash-2"></i></a></td>
</tr>
<tr>
<td>18</td>
<td>Gloria Little</td>
<td>$84.798</td>
<td>
<div class="progress my-3" style="height: 3px;">
<div class="progress-bar" role="progressbar" style="width: 47%;" aria-valuenow="47" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</td>
<td><span class="badge badge-success-inverse">Active</span></td>
<td> <a class="mr-3" href="javascript:void(0);"><i class="fe fe-edit"></i></a><a href="javascript:void(0);"><i class="fe fe-trash-2"></i></a></td>
</tr>
<tr>
<td>19</td>
<td>Bradley Greer</td>
<td>$12.356</td>
<td>
<div class="progress my-3" style="height: 3px;">
<div class="progress-bar" role="progressbar" style="width: 65%;" aria-valuenow="65" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</td>
<td><span class="badge badge-success-inverse">Active</span></td>
<td> <a class="mr-3" href="javascript:void(0);"><i class="fe fe-edit"></i></a><a href="javascript:void(0);"><i class="fe fe-trash-2"></i></a></td>
</tr>
<tr>
<td>20</td>
<td>Dai Rios</td>
<td>$45.655</td>
<td>
<div class="progress my-3" style="height: 3px;">
<div class="progress-bar" role="progressbar" style="width: 85%;" aria-valuenow="85" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</td>
<td><span class="badge badge-success-inverse">Active</span></td>
<td> <a class="mr-3" href="javascript:void(0);"><i class="fe fe-edit"></i></a><a href="javascript:void(0);"><i class="fe fe-trash-2"></i></a></td>
</tr>
<tr>
<td>21</td>
<td>Jenette Caldwell</td>
<td>$47.586</td>
<td>
<div class="progress my-3" style="height: 3px;">
<div class="progress-bar" role="progressbar" style="width: 47%;" aria-valuenow="47" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</td>
<td><span class="badge badge-success-inverse">Active</span></td>
<td> <a class="mr-3" href="javascript:void(0);"><i class="fe fe-edit"></i></a><a href="javascript:void(0);"><i class="fe fe-trash-2"></i></a></td>
</tr>
<tr>
<td>22</td>
<td>Yuri Berry</td>
<td>$36.756</td>
<td>
<div class="progress my-3" style="height: 3px;">
<div class="progress-bar" role="progressbar" style="width: 63%;" aria-valuenow="63" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</td>
<td><span class="badge badge-success-inverse">Active</span></td>
<td> <a class="mr-3" href="javascript:void(0);"><i class="fe fe-edit"></i></a><a href="javascript:void(0);"><i class="fe fe-trash-2"></i></a></td>
</tr>
<tr>
<td>23</td>
<td>Caesar Vance</td>
<td>$78.659</td>
<td>
<div class="progress my-3" style="height: 3px;">
<div class="progress-bar" role="progressbar" style="width: 96%;" aria-valuenow="96" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</td>
<td><span class="badge badge-success-inverse">Active</span></td>
<td> <a class="mr-3" href="javascript:void(0);"><i class="fe fe-edit"></i></a><a href="javascript:void(0);"><i class="fe fe-trash-2"></i></a></td>
</tr>
<tr>
<td>24</td>
<td>Doris Wilder</td>
<td>$56.484</td>
<td>
<div class="progress my-3" style="height: 3px;">
<div class="progress-bar" role="progressbar" style="width: 87%;" aria-valuenow="87" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</td>
<td><span class="badge badge-success-inverse">Active</span></td>
<td> <a class="mr-3" href="javascript:void(0);"><i class="fe fe-edit"></i></a><a href="javascript:void(0);"><i class="fe fe-trash-2"></i></a></td>
</tr>
<tr>
<td>25</td>
<td>Angelica Ramos</td>
<td>$36.796</td>
<td>
<div class="progress my-3" style="height: 3px;">
<div class="progress-bar" role="progressbar" style="width: 98%;" aria-valuenow="98" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</td>
<td><span class="badge badge-success-inverse">Active</span></td>
<td> <a class="mr-3" href="javascript:void(0);"><i class="fe fe-edit"></i></a><a href="javascript:void(0);"><i class="fe fe-trash-2"></i></a></td>
</tr>
<tr>
<td>26</td>
<td>Gavin Joyce</td>
<td>$25.365</td>
<td>
<div class="progress my-3" style="height: 3px;">
<div class="progress-bar" role="progressbar" style="width: 87%;" aria-valuenow="87" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</td>
<td><span class="badge badge-success-inverse">Active</span></td>
<td> <a class="mr-3" href="javascript:void(0);"><i class="fe fe-edit"></i></a><a href="javascript:void(0);"><i class="fe fe-trash-2"></i></a></td>
</tr>
<tr>
<td>27</td>
<td>Jennifer Chang</td>
<td>$78.489</td>
<td>
<div class="progress my-3" style="height: 3px;">
<div class="progress-bar" role="progressbar" style="width: 70%;" aria-valuenow="70" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</td>
<td><span class="badge badge-success-inverse">Active</span></td>
<td> <a class="mr-3" href="javascript:void(0);"><i class="fe fe-edit"></i></a><a href="javascript:void(0);"><i class="fe fe-trash-2"></i></a></td>
</tr>
<tr>
<td>28</td>
<td>Brenden Wagner</td>
<td>$35.987</td>
<td>
<div class="progress my-3" style="height: 3px;">
<div class="progress-bar" role="progressbar" style="width: 65%;" aria-valuenow="65" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</td>
<td><span class="badge badge-success-inverse">Active</span></td>
<td> <a class="mr-3" href="javascript:void(0);"><i class="fe fe-edit"></i></a><a href="javascript:void(0);"><i class="fe fe-trash-2"></i></a></td>
</tr>
<tr>
<td>29</td>
<td>Fiona Green</td>
<td>$78.464</td>
<td>
<div class="progress my-3" style="height: 3px;">
<div class="progress-bar" role="progressbar" style="width: 75%;" aria-valuenow="75" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</td>
<td><span class="badge badge-success-inverse">Active</span></td>
<td> <a class="mr-3" href="javascript:void(0);"><i class="fe fe-edit"></i></a><a href="javascript:void(0);"><i class="fe fe-trash-2"></i></a></td>
</tr>
<tr>
<td>30</td>
<td>Shou Itou</td>
<td>$61.444</td>
<td>
<div class="progress my-3" style="height: 3px;">
<div class="progress-bar" role="progressbar" style="width: 85%;" aria-valuenow="85" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</td>
<td><span class="badge badge-success-inverse">Active</span></td>
<td> <a class="mr-3" href="javascript:void(0);"><i class="fe fe-edit"></i></a><a href="javascript:void(0);"><i class="fe fe-trash-2"></i></a></td>
</tr>
<tr>
<td>31</td>
<td>Michelle House</td>
<td>$85.488</td>
<td>
<div class="progress my-3" style="height: 3px;">
<div class="progress-bar" role="progressbar" style="width: 47%;" aria-valuenow="47" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</td>
<td><span class="badge badge-success-inverse">Active</span></td>
<td> <a class="mr-3" href="javascript:void(0);"><i class="fe fe-edit"></i></a><a href="javascript:void(0);"><i class="fe fe-trash-2"></i></a></td>
</tr>
<tr>
<td>32</td>
<td>Suki Burks</td>
<td>$89.463</td>
<td>
<div class="progress my-3" style="height: 3px;">
<div class="progress-bar" role="progressbar" style="width: 66%;" aria-valuenow="66" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</td>
<td><span class="badge badge-success-inverse">Active</span></td>
<td> <a class="mr-3" href="javascript:void(0);"><i class="fe fe-edit"></i></a><a href="javascript:void(0);"><i class="fe fe-trash-2"></i></a></td>
</tr>
<tr>
<td>33</td>
<td>Prescott Bartlett</td>
<td>$23.464</td>
<td>
<div class="progress my-3" style="height: 3px;">
<div class="progress-bar" role="progressbar" style="width: 62%;" aria-valuenow="62" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</td>
<td><span class="badge badge-success-inverse">Active</span></td>
<td> <a class="mr-3" href="javascript:void(0);"><i class="fe fe-edit"></i></a><a href="javascript:void(0);"><i class="fe fe-trash-2"></i></a></td>
</tr>
<tr>
<td>34</td>
<td>Gavin Cortez</td>
<td>$12.254</td>
<td>
<div class="progress my-3" style="height: 3px;">
<div class="progress-bar" role="progressbar" style="width: 45%;" aria-valuenow="45" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</td>
<td><span class="badge badge-success-inverse">Active</span></td>
<td> <a class="mr-3" href="javascript:void(0);"><i class="fe fe-edit"></i></a><a href="javascript:void(0);"><i class="fe fe-trash-2"></i></a></td>
</tr>
<tr>
<td>35</td>
<td>Martena Mccray</td>
<td>$24.478</td>
<td>
<div class="progress my-3" style="height: 3px;">
<div class="progress-bar" role="progressbar" style="width: 36%;" aria-valuenow="36" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</td>
<td><span class="badge badge-success-inverse">Active</span></td>
<td> <a class="mr-3" href="javascript:void(0);"><i class="fe fe-edit"></i></a><a href="javascript:void(0);"><i class="fe fe-trash-2"></i></a></td>
</tr>
<tr>
<td>36</td>
<td>Unity Butler</td>
<td>$36.478</td>
<td>
<div class="progress my-3" style="height: 3px;">
<div class="progress-bar" role="progressbar" style="width: 45%;" aria-valuenow="45" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</td>
<td><span class="badge badge-success-inverse">Active</span></td>
<td> <a class="mr-3" href="javascript:void(0);"><i class="fe fe-edit"></i></a><a href="javascript:void(0);"><i class="fe fe-trash-2"></i></a></td>
</tr>
<tr>
<td>37</td>
<td>Howard Hatfield</td>
<td>$48.654</td>
<td>
<div class="progress my-3" style="height: 3px;">
<div class="progress-bar" role="progressbar" style="width: 96%;" aria-valuenow="96" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</td>
<td><span class="badge badge-success-inverse">Active</span></td>
<td> <a class="mr-3" href="javascript:void(0);"><i class="fe fe-edit"></i></a><a href="javascript:void(0);"><i class="fe fe-trash-2"></i></a></td>
</tr>
<tr>
<td>38</td>
<td>Hope Fuentes</td>
<td>$78.654</td>
<td>
<div class="progress my-3" style="height: 3px;">
<div class="progress-bar" role="progressbar" style="width: 47%;" aria-valuenow="47" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</td>
<td><span class="badge badge-success-inverse">Active</span></td>
<td> <a class="mr-3" href="javascript:void(0);"><i class="fe fe-edit"></i></a><a href="javascript:void(0);"><i class="fe fe-trash-2"></i></a></td>
</tr>
<tr>
<td>39</td>
<td>Vivian Harrell</td>
<td>$26.154</td>
<td>
<div class="progress my-3" style="height: 3px;">
<div class="progress-bar" role="progressbar" style="width: 56%;" aria-valuenow="56" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</td>
<td><span class="badge badge-success-inverse">Active</span></td>
<td> <a class="mr-3" href="javascript:void(0);"><i class="fe fe-edit"></i></a><a href="javascript:void(0);"><i class="fe fe-trash-2"></i></a></td>
</tr>
</tbody>
<tfoot>
<tr>
<th>#</th>
<th>Name</th>
<th>Price</th>
<th>In stock</th>
<th>Status</th>
<th>Action</th>
</tr>
</tfoot>
</table>
</div>
</div>
</div>
</div>
<div class="col-xxl-4 m-b-30">
<div class="card card-statistics h-100 mb-0">
<div class="card-header d-flex justify-content-between">
<div class="card-heading">
<h4 class="card-title">Lifetime sales</h4>
</div>
<div class="dropdown">
<a class="p-2" href="#!" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<i class="fe fe-circle"></i>
</a>
<div class="dropdown-menu custom-dropdown dropdown-menu-right p-4">
<h6 class="mb-1">Action</h6>
<a class="dropdown-item" href="#!"><i class="fa-fw fa fa-file-o pr-2"></i>View reports</a>
<a class="dropdown-item" href="#!"><i class="fa-fw fa fa-edit pr-2"></i>Edit reports</a>
<a class="dropdown-item" href="#!"><i class="fa-fw fa fa-bar-chart-o pr-2"></i>Statistics</a>
<h6 class="mb-1 mt-3">Export</h6>
<a class="dropdown-item" href="#!"><i class="fa-fw fa fa-file-pdf-o pr-2"></i>Export to PDF</a>
<a class="dropdown-item" href="#!"><i class="fa-fw fa fa-file-excel-o pr-2"></i>Export to CSV</a>
</div>
</div>
</div>
<div class="card-body">
<h5>We only started collecting data from February 2019 </h5>
<p>Questions about the Net Earnings number? <a class="btn btn-square btn-inverse-success btn-xs ml-1" href="#">Click here</a> </p>
<div class="row mt-4">
<div class="col-lg-8">
<div class="morris-wrapper">
<div id="morrisecommerce1" style="height: 260px;"></div>
</div>
</div>
<div class="col-lg-4 mt-4">
<div class="mb-3">
<h3 class="mb-0">680</h3>
<p class="mb-0 text-info">Total sales</p>
</div>
<div class="mb-3">
<h3 class="mb-0">800</h3>
<p class="mb-0 text-primary">Open campaign</p>
</div>
<div class="mb-3">
<h3 class="mb-0">500</h3>
<p class="mb-0">Daily sales</p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-xxl-6 m-b-30">
<div class="card card-statistics h-100 mb-0">
<div class="card-header">
<h4 class="card-title">Yearly Sales Report</h4>
</div>
<div class="card-body pb-0">
<div class="row m-b-20">
<div class="col-xxs-6 col-xl-4 col-xxl-4 mb-2 mb-xxl-0">
<div class="d-flex align-items-center">
<div class="icon-container img-icon m-r-20 bg-light-gray rounded">
<i class="fa fa-cart-plus text-primary"></i>
</div>
<div class="report-details">
<p>Annual Sales</p>
<h3>15,236</h3>
</div>
</div>
</div>
<div class="col-xxs-6 col-md-4 col-xxl-4 mb-2 mb-xxl-0">
<div class="d-flex align-items-center">
<div class="icon-container img-icon m-r-20 bg-light-gray rounded">
<i class="fa fa-dollar text-primary"></i>
</div>
<div class="report-details">
<p>Annual Revenue</p>
<h3>$40,516</h3>
</div>
</div>
</div>
</div>
<div class="apexchart-wrapper">
<div id="ecommerce5" class="chart-fit"></div>
</div>
</div>
</div>
</div>
<div class="col-xxl-6 m-b-30">
<div class="card card-statistics h-100 mb-0">
<div class="card-header d-sm-flex justify-content-between align-items-center py-3">
<div class="card-heading mb-3 mb-sm-0">
<h4 class="card-title">Invoices Status</h4>
</div>
<div class="dropdown">
<input type="text" class="form-control form-control-sm" placeholder="Search Invoice" />
</div>
</div>
<div class="card-body scrollbar scroll_dark" style="max-height: 420px;">
<div class="d-xxs-flex align-items-center">
<div class="total-sales">
<p>Total Sales</p>
<h1>$9514</h1>
</div>
<div class="mb-3 mb-sm-0 ml-auto">
<button class="btn btn-primary btn-xs">View All Invoices</button>
</div>
</div>
<div class="d-none d-sm-flex progress m-t-20 m-b-0" style="height: 5px;">
<div class="progress-bar bg-primary" role="progressbar" style="width: 25%" aria-valuenow="15" aria-valuemin="0" aria-valuemax="100"></div>
<div class="progress-bar bg-warning" role="progressbar" style="width: 25%" aria-valuenow="30" aria-valuemin="0" aria-valuemax="100"></div>
<div class="progress-bar bg-info" role="progressbar" style="width: 25%" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100"></div>
<div class="progress-bar bg-success" role="progressbar" style="width: 25%" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100"></div>
</div>
<div class="row no-gutters">
<div class="col-6 col-xxs-3 ">
<p>Overdue</p>
<h4>$1596</h4>
</div>
<div class="col-6 col-xxs-3 ">
<p>Outstanding</p>
<h4>$2586</h4>
</div>
<div class="col-6 col-xxs-3 ">
<p>Open</p>
<h4>$5678</h4>
</div>
<div class="col-6 col-xxs-3 ">
<p>Paid</p>
<h4>$2458</h4>
</div>
</div>
<div class="table-responsive m-t-20">
<table id="datatable-buttons" class="table">
<thead>
<tr>
<th>No.</th>
<th>Name</th>
<th>Date</th>
<th>Total</th>
<th>Status</th>
</tr>
</thead>
<tbody class="text-muted">
<tr>
<td>1</td>
<td>Smith Drake</td>
<td>27/3/2014</td>
<td>$1,00,000</td>
<td>
<label class="badge mb-0 badge-primary-inverse"> Overdue</label>
</td>
</tr>
<tr>
<td>2</td>
<td>Martha Doe</td>
<td>28/3/2015</td>
<td>$70,000</td>
<td>
<label class="badge mb-0 badge-warning-inverse
"> Outstanding</label>
</td>
</tr>
<tr>
<td>3</td>
<td>Fenish Paul</td>
<td>24/3/2015</td>
<td>$60,000</td>
<td>
<label class="badge mb-0 badge-info-inverse
"> Open</label>
</td>
</tr>
<tr>
<td>4</td>
<td>Albom Mitch</td>
<td>29/3/2016</td>
<td>$60,000</td>
<td>
<label class="badge mb-0 badge-success-inverse
"> Paid</label>
</td>
</tr>
<tr>
<td>5</td>
<td>Bacon Francis</td>
<td>21/3/2016</td>
<td>$50,000</td>
<td>
<label class="badge mb-0 badge-primary-inverse
"> Overdue</label>
</td>
</tr>
<tr>
<td>6</td>
<td>Vanessa Angel</td>
<td>18/3/2016</td>
<td>$42,000</td>
<td>
<label class="badge mb-0 badge-warning-inverse
"> Outstanding</label>
</td>
</tr>
<tr>
<td>7</td>
<td>Fenish Paul</td>
<td>24/3/2015</td>
<td>$60,000</td>
<td>
<label class="badge mb-0 badge-info-inverse
"> Open</label>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-12">
<div class="row">
<div class="col-xl-6 col-xxl-4">
<div class="card card-statistics">
<div class="card-header">
<h4 class="card-title">Conversion Visualizer</h4>
</div>
<div class="card-body pb-2">
<div class="row no-gutters">
<div class="col-sm-4 mt-3">
<ul class="list-group list-group-flush">
<li class="list-group-item px-0 pt-0 d-flex justify-content-between align-items-center">
<p class="text-muted m-b-0">
<i class="fa fa-circle-o mr-2 text-primary"></i>
Direct
</p>
<p class="text-primary mb-0">44</p>
</li>
<li class="list-group-item d-flex px-0 justify-content-between align-items-center">
<p class="text-muted m-b-0">
<i class="fa fa-circle-o mr-2 text-warning"></i>
Referral
</p>
<p class="text-warning mb-0">55</p>
</li>
<li class="list-group-item d-flex px-0 justify-content-between align-items-center">
<p class="text-muted m-b-0">
<i class="fa fa-circle-o mr-2 text-info"></i>
Organic Search
</p>
<p class="text-info mb-0">13</p>
</li>
<li class="list-group-item d-flex px-0 justify-content-between align-items-center">
<p class="text-muted m-b-0">
<i class="fa fa-circle-o mr-2 text-danger"></i>
Social Network
</p>
<p class="text-danger mb-0">53</p>
</li>
<li class="list-group-item d-flex px-0 justify-content-between align-items-center">
<p class="text-muted m-b-0">
<i class="fa fa-circle-o mr-2 text-dark"></i>
Other Advertising
</p>
<p class="text-dark mb-0">35</p>
</li>
</ul>
</div>
<div class="col-sm-8">
<div class="apexchart-wrapper">
<div id="ecommercedemo5"></div>
</div>
</div>
</div>
</div>
</div>
<div class="card card-statistics bg-gradient">
<div class="card-header d-flex justify-content-between border-0 pb-0">
<div class="card-heading">
<h4 class="card-title text-white">Next payout</h4>
</div>
<div class="dropdown">
<a class="text-white tooltip-wrapper font-18" href="#" data-toggle="tooltip" data-placement="top" title="" data-original-title="Payout account: XXXX4955"><i class="fa fa-question-circle-o"></i></a>
</div>
</div>
<div class="card-body">
<h2 class="text-white mb-0">$12,127.48</h2>
<p class="text-white">Your payout will be processed on January 15, 2019</p>
</div>
</div>
</div>
<div class="col-xl-6 col-xxl-4 m-b-30">
<div class="card card-statistics h-100 mb-0">
<div class="card-header">
<h4 class="card-title">Best selling product</h4>
</div>
<div class="card-body">
<div class="blog">
<img class="img-fluid" src="assets/img/product.jpg" alt="">
<h4 class="m-b-10 m-t-20"><a href="#">Active Smartwatch</a></h4>
<p>Explicabo rem autem fugit, rerum, debitis, perferendis aut Lorem ipsum dolor sit Lorem ipsum dolor sit amet, consectetur.</p>
</div>
<div class="product-bar m-t-30">
<div class="d-flex">
<span>Ordered: <b>45</b></span>
<span class="ml-auto">Items available: <b>8</b></span>
</div>
<div class="progress my-3" style="height: 6px;">
<div class="progress-bar bg-success" role="progressbar" style="width: 65%;" aria-valuenow="65" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</div>
</div>
</div>
</div>
<div class="col-xxl-4 m-b-30">
<div class="card card-statistics h-100 mb-0">
<div class="card-header">
<h4 class="card-title">Sales overview</h4>
</div>
<div class="card-body p-30">
<div class="row">
<div class="col-xxs-6 h-100 p-2 border-right border-bottom border-xxs-right-0">
<div class="d-flex align-items-center justify-content-center">
<div class="p-3 text-center">
<a href="javascript:void(0);" class="btn btn-icon btn-round btn-inverse-primary"><i class="fe fe-settings"></i></a>
<h2 class="m-t-20 mb-0">$272</h2>
<p class="text-muted d-block m-b-0">Avg. Order Value</p>
<span class="text-primary"> <i class="fe fe-activity"></i> 155.5% </span>
</div>
</div>
</div>
<div class="col-xxs-6 h-100 p-2 border-bottom">
<div class="d-flex align-items-center justify-content-center">
<div class="p-3 text-center">
<a href="javascript:void(0);" class="btn btn-icon btn-round btn-inverse-success"><i class="fe fe-user-check"></i></a>
<h2 class="m-t-20 mb-0">$450</h2>
<p class="text-muted d-block m-b-0">Page Impressions</p>
<span class="text-success"> <i class="fe fe-arrow-down-left"></i> 155.5% </span>
</div>
</div>
</div>
<div class="col-xxs-6 h-100 p-2 border-right border-xxs-bottom border-xxs-right-0">
<div class="d-flex align-items-center justify-content-center">
<div class="p-3 text-center">
<a href="javascript:void(0);" class="btn btn-icon btn-round btn-inverse-danger"><i class="fe fe-bar-chart-2"></i></a>
<h2 class="m-t-20 mb-0">$135</h2>
<p class="text-muted d-block m-b-0">Quantity</p>
<span class="text-danger"> <i class="fe fe-arrow-down-right"></i> 155.5% </span>
</div>
</div>
</div>
<div class="col-xxs-6 h-100 p-2 ">
<div class="d-flex align-items-center justify-content-center">
<div class="p-3 text-center">
<a href="javascript:void(0);" class="btn btn-icon btn-round btn-inverse-info"><i class="fe fe-crosshair"></i></a>
<h2 class="m-t-20 mb-0">$7525</h2>
<p class="text-muted d-block m-b-0">Total Products</p>
<span class="text-info"> <i class="fe fe-arrow-up"></i> 155.5% </span>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- end row -->
</div>
<!-- end container-fluid -->
</div>
<!-- end app-main -->
</div>
<!-- end app-container -->
<!-- begin footer -->
<footer class="footer">
<div class="row">
<div class="col-12 col-sm-6 text-center text-sm-left">
<p>&copy; Copyright 2019. All rights reserved.</p>
</div>
<div class="col col-sm-6 ml-sm-auto text-center text-sm-right">
<p>Hand-crafted made with <i class="fa fa-heart text-danger mx-1"></i> by Potenza</p>
</div>
</div>
</footer>
<!-- end footer -->
</div>
<!-- end app-wrap -->
</div>
<!-- end app -->
<!-- plugins -->
<script src="assets/js/vendors.js"></script>
<!-- custom app -->
<script src="assets/js/app.js"></script>
</body>
</html>
Reference in New Issue View Git Blame Copy Permalink