| Current File : /home/digitaw/Ycof/admin/.history/index_20230504121604.html |
<!DOCTYPE html>
<html lang="en">
<!-- Mirrored from demo.plainadmin.com/ by HTTrack Website Copier/3.x [XR&CO'2014], Tue, 02 May 2023 10:57:48 GMT -->
<!-- Added by HTTrack --><meta http-equiv="content-type" content="text/html;charset=UTF-8" /><!-- /Added by HTTrack -->
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link
rel="shortcut icon"
href="/images/favicon.svg"
type="image/x-icon"
/>
<title>PlainAdmin Demo | Bootstrap 5 Admin Template</title>
<!-- ========== All CSS files linkup ========= -->
<link rel="stylesheet" href="/css/bootstrap.min.css" />
<link rel="stylesheet" href="/css/lineicons.css" />
<link rel="stylesheet" href="/css/quill/bubble.css" />
<link rel="stylesheet" href="/css/quill/snow.css" />
<link rel="stylesheet" href="/css/fullcalendar.css" />
<link rel="stylesheet" href="/css/morris.css" />
<link rel="stylesheet" href="/css/datatable.css" />
<link rel="stylesheet" href="/css/main.css" />
</head>
<body>
<!-- ======== sidebar-nav start =========== -->
<aside class="sidebar-nav-wrapper">
<div class="navbar-logo">
<a href="index-2.html">
<img src="/img/ycof_bac.png" width="90px" alt="logo" />
</a>
</div>
<nav class="sidebar-nav">
<ul>
<li class="nav-item nav-item-has-children">
<a
href="#0"
data-bs-toggle="collapse"
data-bs-target="#ddmenu_1"
aria-controls="ddmenu_1"
aria-expanded="false"
aria-label="Toggle navigation"
>
<span class="icon">
<svg width="22" height="22" viewBox="0 0 22 22">
<path
d="M17.4167 4.58333V6.41667H13.75V4.58333H17.4167ZM8.25 4.58333V10.0833H4.58333V4.58333H8.25ZM17.4167 11.9167V17.4167H13.75V11.9167H17.4167ZM8.25 15.5833V17.4167H4.58333V15.5833H8.25ZM19.25 2.75H11.9167V8.25H19.25V2.75ZM10.0833 2.75H2.75V11.9167H10.0833V2.75ZM19.25 10.0833H11.9167V19.25H19.25V10.0833ZM10.0833 13.75H2.75V19.25H10.0833V13.75Z"
/>
</svg>
</span>
<span class="text">Dashboard</span>
</a>
<ul id="ddmenu_1" class="collapse show dropdown-nav">
<!--<li>
<a href="index-2.html" class="active"> eCommerce </a>
</li>
<li>
<a href="analytics-dashboard.html">
<span class="text">
Analytics <span class="pro-badge">Pro </span>
</span>
</a>
</li>
<li>
<a href="crypto.html">
<span class="text">
Crypto <span class="pro-badge">Pro </span>
</span>
</a>
</li>
<li>
<a href="crm-dashboard.html">
<span class="text">
CRM <span class="pro-badge">Pro</span>
</span>
</a>
</li>
</ul>
</li>
<li class="nav-item nav-item-has-children">
<a
href="#0"
class="collapsed"
data-bs-toggle="collapse"
data-bs-target="#ddmenu_2"
aria-controls="ddmenu_2"
aria-expanded="false"
aria-label="Toggle navigation"
>
<span class="icon">
<svg
width="22"
height="22"
viewBox="0 0 22 22"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M12.8334 1.83325H5.50008C5.01385 1.83325 4.54754 2.02641 4.20372 2.37022C3.8599 2.71404 3.66675 3.18036 3.66675 3.66659V18.3333C3.66675 18.8195 3.8599 19.2858 4.20372 19.6296C4.54754 19.9734 5.01385 20.1666 5.50008 20.1666H16.5001C16.9863 20.1666 17.4526 19.9734 17.7964 19.6296C18.1403 19.2858 18.3334 18.8195 18.3334 18.3333V7.33325L12.8334 1.83325ZM16.5001 18.3333H5.50008V3.66659H11.9167V8.24992H16.5001V18.3333Z"
/>
</svg>
</span>
<span class="text">Pages</span>
</a>
<ul id="ddmenu_2" class="collapse dropdown-nav">
<li>
<a href="settings.html"> Settings </a>
</li>
<li>
<a href="projects.html">
<span class="text">
Projects <span class="pro-badge">Pro</span>
</span>
</a>
</li>
<li>
<a href="clients.html">
<span class="text">
Clients <span class="pro-badge">Pro</span>
</span>
</a>
</li>
<li>
<a href="pricing.html">
<span class="text">
Pricing <span class="pro-badge">Pro</span>
</span>
</a>
</li>
<li>
<a href="chat.html">
<span class="text">
Chat <span class="pro-badge">Pro</span>
</span>
</a>
</li>
<li>
<a href="blank-page.html"> Blank Page </a>
</li>
</ul>
</li>
<li class="nav-item">
<a href="kanban.html">
<span class="icon">
<svg
width="18"
height="20"
viewBox="0 0 18 20"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M16.3333 19.1666H1.66667C1.42355 19.1666 1.19039 19.07 1.01849 18.8981C0.846577 18.7262 0.75 18.493 0.75 18.2499V1.74992C0.75 1.5068 0.846577 1.27365 1.01849 1.10174C1.19039 0.929829 1.42355 0.833252 1.66667 0.833252H16.3333C16.5764 0.833252 16.8096 0.929829 16.9815 1.10174C17.1534 1.27365 17.25 1.5068 17.25 1.74992V18.2499C17.25 18.493 17.1534 18.7262 16.9815 18.8981C16.8096 19.07 16.5764 19.1666 16.3333 19.1666ZM15.4167 17.3333V2.66659H2.58333V17.3333H15.4167ZM5.33333 5.41658H12.6667V7.24992H5.33333V5.41658ZM5.33333 9.08325H12.6667V10.9166H5.33333V9.08325ZM5.33333 12.7499H9.91667V14.5833H5.33333V12.7499Z"
/>
</svg>
</span>
<span class="text">
Kanban <span class="pro-badge">Pro</span>
</span>
</a>
</li>
<li class="nav-item">
<a href="file-manager.html">
<span class="icon">
<svg
width="18"
height="16"
viewBox="0 0 18 16"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M1.77778 1.77778V14.2222H16V3.55556H8.52089L6.74311 1.77778H1.77778ZM9.25689 1.77778H16.8889C17.1246 1.77778 17.3507 1.87143 17.5174 2.03813C17.6841 2.20483 17.7778 2.43092 17.7778 2.66667V15.1111C17.7778 15.3469 17.6841 15.573 17.5174 15.7397C17.3507 15.9064 17.1246 16 16.8889 16H0.888889C0.653141 16 0.427048 15.9064 0.260349 15.7397C0.0936505 15.573 0 15.3469 0 15.1111V0.888889C0 0.653141 0.0936505 0.427048 0.260349 0.260349C0.427048 0.0936505 0.653141 0 0.888889 0H7.47911L9.25689 1.77778Z"
/>
</svg>
</span>
-->
<span class="text">
File Manager <span class="pro-badge">Pro</span>
</span>
</a>
</li>
<li class="nav-item">
<a href="profile.html">
<span class="icon">
<svg
width="22"
height="22"
viewBox="0 0 22 22"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M11.0001 3.66675C11.9725 3.66675 12.9052 4.05306 13.5928 4.74069C14.2804 5.42832 14.6667 6.36095 14.6667 7.33341C14.6667 8.30587 14.2804 9.23851 13.5928 9.92614C12.9052 10.6138 11.9725 11.0001 11.0001 11.0001C10.0276 11.0001 9.09499 10.6138 8.40736 9.92614C7.71972 9.23851 7.33341 8.30587 7.33341 7.33341C7.33341 6.36095 7.71972 5.42832 8.40736 4.74069C9.09499 4.05306 10.0276 3.66675 11.0001 3.66675ZM11.0001 5.50008C10.5139 5.50008 10.0475 5.69324 9.70372 6.03705C9.3599 6.38087 9.16675 6.84718 9.16675 7.33341C9.16675 7.81964 9.3599 8.28596 9.70372 8.62978C10.0475 8.97359 10.5139 9.16675 11.0001 9.16675C11.4863 9.16675 11.9526 8.97359 12.2964 8.62978C12.6403 8.28596 12.8334 7.81964 12.8334 7.33341C12.8334 6.84718 12.6403 6.38087 12.2964 6.03705C11.9526 5.69324 11.4863 5.50008 11.0001 5.50008ZM11.0001 11.9167C13.4476 11.9167 18.3334 13.1359 18.3334 15.5834V18.3334H3.66675V15.5834C3.66675 13.1359 8.55258 11.9167 11.0001 11.9167ZM11.0001 13.6584C8.27758 13.6584 5.40841 14.9967 5.40841 15.5834V16.5917H16.5917V15.5834C16.5917 14.9967 13.7226 13.6584 11.0001 13.6584Z"
/>
</svg>
</span>
<span class="text">
Profile <span class="pro-badge">Pro</span>
</span>
</a>
</li>
<li class="nav-item">
<a href="invoice.html">
<span class="icon">
<svg
width="22"
height="22"
viewBox="0 0 22 22"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M17.4166 7.33333C18.9383 7.33333 20.1666 8.56167 20.1666 10.0833V15.5833H16.4999V19.25H5.49992V15.5833H1.83325V10.0833C1.83325 8.56167 3.06159 7.33333 4.58325 7.33333H5.49992V2.75H16.4999V7.33333H17.4166ZM7.33325 4.58333V7.33333H14.6666V4.58333H7.33325ZM14.6666 17.4167V13.75H7.33325V17.4167H14.6666ZM16.4999 13.75H18.3333V10.0833C18.3333 9.57917 17.9208 9.16667 17.4166 9.16667H4.58325C4.07909 9.16667 3.66659 9.57917 3.66659 10.0833V13.75H5.49992V11.9167H16.4999V13.75ZM17.4166 10.5417C17.4166 11.0458 17.0041 11.4583 16.4999 11.4583C15.9958 11.4583 15.5833 11.0458 15.5833 10.5417C15.5833 10.0375 15.9958 9.625 16.4999 9.625C17.0041 9.625 17.4166 10.0375 17.4166 10.5417Z"
/>
</svg>
</span>
<span class="text">Invoice</span>
</a>
</li>
<li class="nav-item">
<a href="task.html">
<span class="icon">
<svg
width="22"
height="22"
viewBox="0 0 22 22"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M4.58341 8.70841L6.87508 12.8334H2.29175L4.58341 8.70841ZM2.75008 3.66675H6.41675V7.33341H2.75008V3.66675ZM4.58341 18.3334C5.06964 18.3334 5.53596 18.1403 5.87978 17.7964C6.22359 17.4526 6.41675 16.9863 6.41675 16.5001C6.41675 16.0139 6.22359 15.5475 5.87978 15.2037C5.53596 14.8599 5.06964 14.6667 4.58341 14.6667C4.09718 14.6667 3.63087 14.8599 3.28705 15.2037C2.94324 15.5475 2.75008 16.0139 2.75008 16.5001C2.75008 16.9863 2.94324 17.4526 3.28705 17.7964C3.63087 18.1403 4.09718 18.3334 4.58341 18.3334ZM8.25008 4.58341V6.41675H19.2501V4.58341H8.25008ZM8.25008 17.4167H19.2501V15.5834H8.25008V17.4167ZM8.25008 11.9167H19.2501V10.0834H8.25008V11.9167Z"
/>
</svg>
</span>
<span class="text">
Task <span class="pro-badge">Pro</span>
</span>
</a>
</li>
<li class="nav-item">
<a href="calendar.html">
<span class="icon">
<svg
width="22"
height="22"
viewBox="0 0 22 22"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M8.25 9.16675H6.41667V11.0001H8.25V9.16675ZM11.9167 9.16675H10.0833V11.0001H11.9167V9.16675ZM15.5833 9.16675H13.75V11.0001H15.5833V9.16675ZM17.4167 2.75008H16.5V0.916748H14.6667V2.75008H7.33333V0.916748H5.5V2.75008H4.58333C3.56583 2.75008 2.75 3.57508 2.75 4.58341V17.4167C2.75 17.903 2.94315 18.3693 3.28697 18.7131C3.63079 19.0569 4.0971 19.2501 4.58333 19.2501H17.4167C17.9029 19.2501 18.3692 19.0569 18.713 18.7131C19.0568 18.3693 19.25 17.903 19.25 17.4167V4.58341C19.25 4.09718 19.0568 3.63087 18.713 3.28705C18.3692 2.94324 17.9029 2.75008 17.4167 2.75008ZM17.4167 17.4167H4.58333V7.33342H17.4167V17.4167Z"
/>
</svg>
</span>
<span class="text">
Calendar <span class="pro-badge">Pro</span>
</span>
</a>
</li>
<li class="nav-item nav-item-has-children">
<a
href="#0"
class="collapsed"
data-bs-toggle="collapse"
data-bs-target="#ddmenu_3"
aria-controls="ddmenu_3"
aria-expanded="false"
aria-label="Toggle navigation"
>
<span class="icon">
<svg
width="22"
height="22"
viewBox="0 0 22 22"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M12.9067 14.2908L15.2808 11.9167H6.41667V10.0833H15.2808L12.9067 7.70917L14.2083 6.41667L18.7917 11L14.2083 15.5833L12.9067 14.2908ZM17.4167 2.75C17.9029 2.75 18.3692 2.94315 18.713 3.28697C19.0568 3.63079 19.25 4.0971 19.25 4.58333V8.86417L17.4167 7.03083V4.58333H4.58333V17.4167H17.4167V14.9692L19.25 13.1358V17.4167C19.25 17.9029 19.0568 18.3692 18.713 18.713C18.3692 19.0568 17.9029 19.25 17.4167 19.25H4.58333C3.56583 19.25 2.75 18.425 2.75 17.4167V4.58333C2.75 3.56583 3.56583 2.75 4.58333 2.75H17.4167Z"
/>
</svg>
</span>
<span class="text">Auth</span>
</a>
<ul id="ddmenu_3" class="collapse dropdown-nav">
<li>
<a href="signin.html"> Sign In </a>
</li>
<li>
<a href="signup.html"> Sign Up </a>
</li>
<li>
<a href="reset-password.html">
<span class="text">
Reset Password <span class="pro-badge">Pro</span>
</span>
</a>
</li>
</ul>
</li>
<span class="divider"><hr /></span>
<li class="nav-item nav-item-has-children">
<a
href="#0"
class="collapsed"
data-bs-toggle="collapse"
data-bs-target="#ddmenu_4"
aria-controls="ddmenu_4"
aria-expanded="false"
aria-label="Toggle navigation"
>
<span class="icon">
<svg
width="22"
height="22"
viewBox="0 0 22 22"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M3.66675 4.58325V16.4999H19.2501V4.58325H3.66675ZM5.50008 14.6666V6.41659H8.25008V14.6666H5.50008ZM10.0834 14.6666V11.4583H12.8334V14.6666H10.0834ZM17.4167 14.6666H14.6667V11.4583H17.4167V14.6666ZM10.0834 9.62492V6.41659H17.4167V9.62492H10.0834Z"
/>
</svg>
</span>
<span class="text">UI Elements </span>
</a>
<ul id="ddmenu_4" class="collapse dropdown-nav">
<li>
<a href="alerts.html"> Alerts </a>
</li>
<li>
<a href="buttons.html"> Buttons </a>
</li>
<li>
<a href="cards.html"> Cards </a>
</li>
<li>
<a href="modals.html">
<span class="text">
Modals <span class="pro-badge">Pro</span>
</span>
</a>
</li>
<li>
<a href="tabs.html">
<span class="text">
Tabs <span class="pro-badge">Pro</span>
</span>
</a>
</li>
<li>
<a href="typography.html"> Typography </a>
</li>
</ul>
</li>
<li class="nav-item nav-item-has-children">
<a
href="#0"
class="collapsed"
data-bs-toggle="collapse"
data-bs-target="#ddmenu_55"
aria-controls="ddmenu_55"
aria-expanded="false"
aria-label="Toggle navigation"
>
<span class="icon">
<svg
width="22"
height="22"
viewBox="0 0 22 22"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M1.83325 19.25V17.4167H18.3333V19.25H1.83325ZM18.3333 7.33333V4.58333H16.4999V7.33333H18.3333ZM18.3333 2.75C18.8195 2.75 19.2858 2.94315 19.6296 3.28697C19.9734 3.63079 20.1666 4.0971 20.1666 4.58333V7.33333C20.1666 7.81956 19.9734 8.28588 19.6296 8.6297C19.2858 8.97351 18.8195 9.16667 18.3333 9.16667H16.4999V11.9167C16.4999 12.8891 16.1136 13.8218 15.426 14.5094C14.7383 15.197 13.8057 15.5833 12.8333 15.5833H7.33325C6.36079 15.5833 5.42816 15.197 4.74053 14.5094C4.05289 13.8218 3.66659 12.8891 3.66659 11.9167V2.75H18.3333ZM14.6666 4.58333H5.49992V11.9167C5.49992 12.4029 5.69307 12.8692 6.03689 13.213C6.38071 13.5568 6.84702 13.75 7.33325 13.75H12.8333C13.3195 13.75 13.7858 13.5568 14.1296 13.213C14.4734 12.8692 14.6666 12.4029 14.6666 11.9167V4.58333Z"
/>
</svg>
</span>
<!-- <span class="text">Icons</span>
</a>
<ul id="ddmenu_55" class="collapse dropdown-nav">
<li>
<a href="icons.html"> LineIcons </a>
</li>
<li>
<a href="mdi-icons.html"> MDI Icons </a>
</li>
</ul>
</li>
<li class="nav-item nav-item-has-children">
<a
href="#0"
class="collapsed"
data-bs-toggle="collapse"
data-bs-target="#ddmenu_5"
aria-controls="ddmenu_5"
aria-expanded="false"
aria-label="Toggle navigation"
>
<span class="icon">
<svg
width="22"
height="22"
viewBox="0 0 22 22"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M13.75 4.58325H16.5L15.125 6.41659L13.75 4.58325ZM4.58333 1.83325H17.4167C18.4342 1.83325 19.25 2.65825 19.25 3.66659V18.3333C19.25 19.3508 18.4342 20.1666 17.4167 20.1666H4.58333C3.575 20.1666 2.75 19.3508 2.75 18.3333V3.66659C2.75 2.65825 3.575 1.83325 4.58333 1.83325ZM4.58333 3.66659V7.33325H17.4167V3.66659H4.58333ZM4.58333 18.3333H17.4167V9.16659H4.58333V18.3333ZM6.41667 10.9999H15.5833V12.8333H6.41667V10.9999ZM6.41667 14.6666H15.5833V16.4999H6.41667V14.6666Z"
/>
</svg>
</span>
-->
<span class="text"> Forms </span>
</a>
<ul id="ddmenu_5" class="collapse dropdown-nav">
<li>
<a href="form-elements.html"> From Elements </a>
</li>
<li>
<a href="form-layout.html">
<span class="text">
Form Layout <span class="pro-badge">Pro</span>
</span>
</a>
</li>
</ul>
</li>
<li class="nav-item">
<a href="tables.html">
<span class="icon">
<svg
width="22"
height="22"
viewBox="0 0 22 22"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M4.58333 3.66675H17.4167C17.9029 3.66675 18.3692 3.8599 18.713 4.20372C19.0568 4.54754 19.25 5.01385 19.25 5.50008V16.5001C19.25 16.9863 19.0568 17.4526 18.713 17.7964C18.3692 18.1403 17.9029 18.3334 17.4167 18.3334H4.58333C4.0971 18.3334 3.63079 18.1403 3.28697 17.7964C2.94315 17.4526 2.75 16.9863 2.75 16.5001V5.50008C2.75 5.01385 2.94315 4.54754 3.28697 4.20372C3.63079 3.8599 4.0971 3.66675 4.58333 3.66675ZM4.58333 7.33341V11.0001H10.0833V7.33341H4.58333ZM11.9167 7.33341V11.0001H17.4167V7.33341H11.9167ZM4.58333 12.8334V16.5001H10.0833V12.8334H4.58333ZM11.9167 12.8334V16.5001H17.4167V12.8334H11.9167Z"
/>
</svg>
</span>
<span class="text">Tables</span>
</a>
</li>
<span class="divider"><hr /></span>
<li class="nav-item nav-item-has-children">
<a
href="#0"
class="collapsed"
data-bs-toggle="collapse"
data-bs-target="#ddmenu_77"
aria-controls="ddmenu_77"
aria-expanded="false"
aria-label="Toggle navigation"
>
<span class="icon">
<svg
width="22"
height="22"
viewBox="0 0 22 22"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M14.6667 6.41667V2.75H12.8333V6.41667H9.16667V2.75H7.33333V6.41667C6.41667 6.41667 5.5 7.33333 5.5 8.25V13.2917L8.70833 16.5V19.25H13.2917V16.5L16.5 13.2917V8.25C16.5 7.33333 15.5833 6.41667 14.6667 6.41667ZM14.6667 12.5308L11.9992 15.2075L11.6142 15.5833H10.3858L10.01 15.2075L7.33333 12.5308V8.3325C7.33333 8.305 7.38833 8.25 7.41583 8.25H14.5933C14.6208 8.25 14.6667 8.305 14.6667 8.3325V12.5308Z"
/>
</svg>
</span>
<span class="text"> Form Plugins </span>
</a>
<ul id="ddmenu_77" class="collapse dropdown-nav">
<li>
<a href="form-edit.html">
<span class="text">
QuillJs <span class="pro-badge">Pro</span>
</span>
</a>
</li>
<li>
<a href="form-validation.html">
<span class="text">
Form Validation <span class="pro-badge">Pro</span>
</span>
</a>
</li>
</ul>
</li>
<li class="nav-item nav-item-has-children">
<a
href="#0"
class="collapsed"
data-bs-toggle="collapse"
data-bs-target="#ddmenu_7"
aria-controls="ddmenu_7"
aria-expanded="false"
aria-label="Toggle navigation"
>
<span class="icon">
<svg
width="22"
height="22"
viewBox="0 0 22 22"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M11.0001 2.75C6.94841 2.75 3.66675 4.39083 3.66675 6.41667V15.5833C3.66675 17.6092 6.95758 19.25 11.0001 19.25C15.0426 19.25 18.3334 17.6092 18.3334 15.5833V6.41667C18.3334 4.39083 15.0517 2.75 11.0001 2.75ZM16.5001 15.5833C16.5001 16.0417 14.5476 17.4167 11.0001 17.4167C7.45258 17.4167 5.50008 16.0417 5.50008 15.5833V13.5392C6.97591 14.2542 8.91008 14.6667 11.0001 14.6667C13.0901 14.6667 15.0242 14.2542 16.5001 13.5392V15.5833ZM16.5001 11.4125C15.3084 12.2833 13.2184 12.8333 11.0001 12.8333C8.78175 12.8333 6.69175 12.2833 5.50008 11.4125V8.83667C6.84758 9.5975 8.80925 10.0833 11.0001 10.0833C13.1909 10.0833 15.1526 9.5975 16.5001 8.83667V11.4125ZM11.0001 8.25C7.45258 8.25 5.50008 6.875 5.50008 6.41667C5.50008 5.95833 7.45258 4.58333 11.0001 4.58333C14.5476 4.58333 16.5001 5.95833 16.5001 6.41667C16.5001 6.875 14.5476 8.25 11.0001 8.25Z"
/>
</svg>
</span>
<span class="text"> Data Tables </span>
</a>
<ul id="ddmenu_7" class="collapse dropdown-nav">
<li>
<a href="basic-table.html">
<span class="text">
Basic Table <span class="pro-badge">Pro</span>
</span>
</a>
</li>
<li>
<a href="tables-responsive.html">
<span class="text">
Responsive Table <span class="pro-badge">Pro</span>
</span>
</a>
</li>
<li>
<a href="datatables.html">
<span class="text">
Data Table <span class="pro-badge">Pro</span>
</span>
</a>
</li>
</ul>
</li>
<li class="nav-item nav-item-has-children">
<a
href="#0"
class="collapsed"
data-bs-toggle="collapse"
data-bs-target="#ddmenu_8"
aria-controls="ddmenu_8"
aria-expanded="false"
aria-label="Toggle navigation"
>
<span class="icon">
<svg
width="22"
height="22"
viewBox="0 0 22 22"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M20.1666 19.25H1.83325V2.75H3.66659V17.4167H5.49992V9.16667H9.16659V17.4167H10.9999V5.5H14.6666V17.4167H16.4999V12.8333H20.1666V19.25Z"
/>
</svg>
</span>
<span class="text"> Charts </span>
</a>
<ul id="ddmenu_8" class="collapse dropdown-nav">
<li>
<a href="chart-js.html">
<span class="text">
ChartJs <span class="pro-badge">Pro</span>
</span>
</a>
</li>
<li>
<a href="apex-chart.html">
<span class="text">
Apex Chart <span class="pro-badge">Pro</span>
</span>
</a>
</li>
</ul>
</li>
<li class="nav-item">
<a href="notification.html">
<span class="icon">
<svg
width="22"
height="22"
viewBox="0 0 22 22"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M9.16667 19.25H12.8333C12.8333 20.2584 12.0083 21.0834 11 21.0834C9.99167 21.0834 9.16667 20.2584 9.16667 19.25ZM19.25 17.4167V18.3334H2.75V17.4167L4.58333 15.5834V10.0834C4.58333 7.24171 6.41667 4.76671 9.16667 3.94171V3.66671C9.16667 2.65837 9.99167 1.83337 11 1.83337C12.0083 1.83337 12.8333 2.65837 12.8333 3.66671V3.94171C15.5833 4.76671 17.4167 7.24171 17.4167 10.0834V15.5834L19.25 17.4167ZM15.5833 10.0834C15.5833 7.51671 13.5667 5.50004 11 5.50004C8.43333 5.50004 6.41667 7.51671 6.41667 10.0834V16.5H15.5833V10.0834Z"
/>
</svg>
</span>
<span class="text">Notifications</span>
</a>
</li>
</ul>
</nav>
<div class="promo-box">
<h3>PlainAdmin Pro</h3>
<p>Get All Dashboards and 300+ UI Elements</p>
<a
href="https://plainadmin.com/pro"
target="_blank"
rel="nofollow"
class="main-btn primary-btn btn-hover"
>
Purchase Now
</a>
</div>
</aside>
<div class="overlay"></div>
<!-- ======== sidebar-nav end =========== -->
<!-- ======== main-wrapper start =========== -->
<main class="main-wrapper">
<!-- ========== header start ========== -->
<header class="header">
<div class="container-fluid">
<div class="row">
<div class="col-lg-5 col-md-5 col-6">
<div class="header-left d-flex align-items-center">
<div class="menu-toggle-btn mr-20">
<button
id="menu-toggle"
class="main-btn primary-btn btn-hover"
>
<i class="lni lni-chevron-left me-2"></i> Menu
</button>
</div>
<div class="header-search d-none d-md-flex">
<form action="#">
<input type="text" placeholder="Search..." />
<button><i class="lni lni-search-alt"></i></button>
</form>
</div>
</div>
</div>
<div class="col-lg-7 col-md-7 col-6">
<div class="header-right">
<!-- notification start -->
<div class="notification-box ml-15 d-none d-md-flex">
<button
class="dropdown-toggle"
type="button"
id="notification"
data-bs-toggle="dropdown"
aria-expanded="false"
>
<i class="lni lni-alarm"></i>
<span>2</span>
</button>
<ul
class="dropdown-menu dropdown-menu-end"
aria-labelledby="notification"
>
<li>
<a href="#0">
<div class="image">
<img src="/images/lead/lead-6.png" alt="" />
</div>
<div class="content">
<h6>
John Doe
<span class="text-regular">
comment on a product.
</span>
</h6>
<p>
Lorem ipsum dolor sit amet, consect etur adipiscing
elit Vivamus tortor.
</p>
<span>10 mins ago</span>
</div>
</a>
</li>
<li>
<a href="#0">
<div class="image">
<img src="/images/lead/lead-1.png" alt="" />
</div>
<div class="content">
<h6>
Jonathon
<span class="text-regular">
like on a product.
</span>
</h6>
<p>
Lorem ipsum dolor sit amet, consect etur adipiscing
elit Vivamus tortor.
</p>
<span>10 mins ago</span>
</div>
</a>
</li>
</ul>
</div>
<!-- notification end -->
<!-- message start -->
<div class="header-message-box ml-15 d-none d-md-flex">
<button
class="dropdown-toggle"
type="button"
id="message"
data-bs-toggle="dropdown"
aria-expanded="false"
>
<i class="lni lni-envelope"></i>
<span>3</span>
</button>
<ul
class="dropdown-menu dropdown-menu-end"
aria-labelledby="message"
>
<li>
<a href="#0">
<div class="image">
<img src="/images/lead/lead-5.png" alt="" />
</div>
<div class="content">
<h6>Jacob Jones</h6>
<p>Hey!I can across your profile and ...</p>
<span>10 mins ago</span>
</div>
</a>
</li>
<li>
<a href="#0">
<div class="image">
<img src="/images/lead/lead-3.png" alt="" />
</div>
<div class="content">
<h6>John Doe</h6>
<p>Would you mind please checking out</p>
<span>12 mins ago</span>
</div>
</a>
</li>
<li>
<a href="#0">
<div class="image">
<img src="/images/lead/lead-2.png" alt="" />
</div>
<div class="content">
<h6>Anee Lee</h6>
<p>Hey! are you available for freelance?</p>
<span>1h ago</span>
</div>
</a>
</li>
</ul>
</div>
<!-- message end -->
<!-- filter start -->
<div class="filter-box ml-15 d-none d-md-flex">
<button class="" type="button" id="filter">
<i class="lni lni-funnel"></i>
</button>
</div>
<!-- filter end -->
<!-- profile start -->
<div class="profile-box ml-15">
<button
class="dropdown-toggle bg-transparent border-0"
type="button"
id="profile"
data-bs-toggle="dropdown"
aria-expanded="false"
>
<div class="profile-info">
<div class="info">
<h6>John Doe</h6>
<div class="image">
<img
src="/images/profile/profile-image.png"
alt=""
/>
<span class="status"></span>
</div>
</div>
</div>
<i class="lni lni-chevron-down"></i>
</button>
<ul
class="dropdown-menu dropdown-menu-end"
aria-labelledby="profile"
>
<li>
<a href="#0">
<i class="lni lni-user"></i> View Profile
</a>
</li>
<li>
<a href="#0">
<i class="lni lni-alarm"></i> Notifications
</a>
</li>
<li>
<a href="#0"> <i class="lni lni-inbox"></i> Messages </a>
</li>
<li>
<a href="#0"> <i class="lni lni-cog"></i> Settings </a>
</li>
<li>
<a href="#0"> <i class="lni lni-exit"></i> Sign Out </a>
</li>
</ul>
</div>
<!-- profile end -->
</div>
</div>
</div>
</div>
</header>
<!-- ========== header end ========== -->
<!-- ========== section start ========== -->
<section class="section">
<div class="container-fluid">
<!-- ========== title-wrapper start ========== -->
<div class="title-wrapper pt-30">
<div class="row align-items-center">
<div class="col-md-6">
<div class="title mb-30">
<h2>Tableau de bord Admin</h2>
</div>
</div>
<!-- end col -->
<div class="col-md-6">
<div class="breadcrumb-wrapper mb-30">
<nav aria-label="breadcrumb">
<ol class="breadcrumb">
<li class="breadcrumb-item">
<a href="#0">Dashboard</a>
</li>
<li class="breadcrumb-item active" aria-current="page">
eCommerce
</li>
</ol>
</nav>
</div>
</div>
<!-- end col -->
</div>
<!-- end row -->
</div>
<!-- ========== title-wrapper end ========== -->
<div class="row">
<div class="col-xl-3 col-lg-4 col-sm-6">
<div class="icon-card mb-30">
<div class="icon purple">
<svg xmlns="http://www.w3.org/2000/svg" width="25" height="25" fill="currentColor" class="bi bi-airplane" viewBox="0 0 16 16">
<path d="M6.428 1.151C6.708.591 7.213 0 8 0s1.292.592 1.572 1.151C9.861 1.73 10 2.431 10 3v3.691l5.17 2.585a1.5 1.5 0 0 1 .83 1.342V12a.5.5 0 0 1-.582.493l-5.507-.918-.375 2.253 1.318 1.318A.5.5 0 0 1 10.5 16h-5a.5.5 0 0 1-.354-.854l1.319-1.318-.376-2.253-5.507.918A.5.5 0 0 1 0 12v-1.382a1.5 1.5 0 0 1 .83-1.342L6 6.691V3c0-.568.14-1.271.428-1.849Zm.894.448C7.111 2.02 7 2.569 7 3v4a.5.5 0 0 1-.276.447l-5.448 2.724a.5.5 0 0 0-.276.447v.792l5.418-.903a.5.5 0 0 1 .575.41l.5 3a.5.5 0 0 1-.14.437L6.708 15h2.586l-.647-.646a.5.5 0 0 1-.14-.436l.5-3a.5.5 0 0 1 .576-.411L15 11.41v-.792a.5.5 0 0 0-.276-.447L9.276 7.447A.5.5 0 0 1 9 7V3c0-.432-.11-.979-.322-1.401C8.458 1.159 8.213 1 8 1c-.213 0-.458.158-.678.599Z"/>
</svg>
</div>
<div class="content">
<h6 class="mb-3">Assurance Voyage</h6>
<h3 class="text-bold mb-10">34567</h3>
</div>
</div>
<!-- End Icon Cart -->
</div>
<!-- End Col -->
<div class="col-xl-3 col-lg-4 col-sm-6">
<div class="icon-card mb-30">
<div class="icon success">
<svg xmlns="http://www.w3.org/2000/svg" width="25" height="25" fill="currentColor" class="bi bi-car-front" viewBox="0 0 16 16">
<path d="M4 9a1 1 0 1 1-2 0 1 1 0 0 1 2 0Zm10 0a1 1 0 1 1-2 0 1 1 0 0 1 2 0ZM6 8a1 1 0 0 0 0 2h4a1 1 0 1 0 0-2H6ZM4.862 4.276 3.906 6.19a.51.51 0 0 0 .497.731c.91-.073 2.35-.17 3.597-.17 1.247 0 2.688.097 3.597.17a.51.51 0 0 0 .497-.731l-.956-1.913A.5.5 0 0 0 10.691 4H5.309a.5.5 0 0 0-.447.276Z"/>
<path d="M2.52 3.515A2.5 2.5 0 0 1 4.82 2h6.362c1 0 1.904.596 2.298 1.515l.792 1.848c.075.175.21.319.38.404.5.25.855.715.965 1.262l.335 1.679c.033.161.049.325.049.49v.413c0 .814-.39 1.543-1 1.997V13.5a.5.5 0 0 1-.5.5h-2a.5.5 0 0 1-.5-.5v-1.338c-1.292.048-2.745.088-4 .088s-2.708-.04-4-.088V13.5a.5.5 0 0 1-.5.5h-2a.5.5 0 0 1-.5-.5v-1.892c-.61-.454-1-1.183-1-1.997v-.413a2.5 2.5 0 0 1 .049-.49l.335-1.68c.11-.546.465-1.012.964-1.261a.807.807 0 0 0 .381-.404l.792-1.848ZM4.82 3a1.5 1.5 0 0 0-1.379.91l-.792 1.847a1.8 1.8 0 0 1-.853.904.807.807 0 0 0-.43.564L1.03 8.904a1.5 1.5 0 0 0-.03.294v.413c0 .796.62 1.448 1.408 1.484 1.555.07 3.786.155 5.592.155 1.806 0 4.037-.084 5.592-.155A1.479 1.479 0 0 0 15 9.611v-.413c0-.099-.01-.197-.03-.294l-.335-1.68a.807.807 0 0 0-.43-.563 1.807 1.807 0 0 1-.853-.904l-.792-1.848A1.5 1.5 0 0 0 11.18 3H4.82Z"/>
</svg>
</div>
<div class="content">
<h6 class="mb-3">Total Income</h6>
<h3 class="text-bold mb-10">$74,567</h3>
</div>
</div>
<!-- End Icon Cart -->
</div>
<!-- End Col -->
<div class="col-xl-3 col-lg-4 col-sm-6">
<div class="icon-card mb-30">
<div class="icon primary">
<svg xmlns="http://www.w3.org/2000/svg" width="25" height="25" fill="currentColor" class="bi bi-house-door-fill" viewBox="0 0 16 16">
<path d="M6.5 14.5v-3.505c0-.245.25-.495.5-.495h2c.25 0 .5.25.5.5v3.5a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5v-7a.5.5 0 0 0-.146-.354L13 5.793V2.5a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1.293L8.354 1.146a.5.5 0 0 0-.708 0l-6 6A.5.5 0 0 0 1.5 7.5v7a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5Z"/>
</svg>
</div>
<div class="content">
<h6 class="mb-3">Total Expense</h6>
<h3 class="text-bold mb-10">$24,567</h3>
<p class="text-sm text-danger">
<i class="lni lni-arrow-down"></i> -2.00%
<span class="text-gray">Expense</span>
</p>
</div>
</div>
<!-- End Icon Cart -->
</div>
<!-- End Col -->
<div class="col-xl-3 col-lg-4 col-sm-6">
<div class="icon-card mb-30">
<div class="icon orange">
<svg xmlns="http://www.w3.org/2000/svg" width="25" height="25" fill="currentColor" class="bi bi-lungs" viewBox="0 0 16 16">
<path d="M8.5 1.5a.5.5 0 1 0-1 0v5.243L7 7.1V4.72C7 3.77 6.23 3 5.28 3c-.524 0-1.023.27-1.443.592-.431.332-.847.773-1.216 1.229-.736.908-1.347 1.946-1.58 2.48-.176.405-.393 1.16-.556 2.011-.165.857-.283 1.857-.241 2.759.04.867.233 1.79.838 2.33.67.6 1.622.556 2.741-.004l1.795-.897A2.5 2.5 0 0 0 7 11.264V10.5a.5.5 0 0 0-1 0v.764a1.5 1.5 0 0 1-.83 1.342l-1.794.897c-.978.489-1.415.343-1.628.152-.28-.25-.467-.801-.505-1.63-.037-.795.068-1.71.224-2.525.157-.82.357-1.491.491-1.8.19-.438.75-1.4 1.44-2.25.342-.422.703-.799 1.049-1.065.358-.276.639-.385.833-.385a.72.72 0 0 1 .72.72v3.094l-1.79 1.28a.5.5 0 0 0 .58.813L8 7.614l3.21 2.293a.5.5 0 1 0 .58-.814L10 7.814V4.72a.72.72 0 0 1 .72-.72c.194 0 .475.11.833.385.346.266.706.643 1.05 1.066.688.85 1.248 1.811 1.439 2.249.134.309.334.98.491 1.8.156.814.26 1.73.224 2.525-.038.829-.224 1.38-.505 1.63-.213.19-.65.337-1.628-.152l-1.795-.897A1.5 1.5 0 0 1 10 11.264V10.5a.5.5 0 0 0-1 0v.764a2.5 2.5 0 0 0 1.382 2.236l1.795.897c1.12.56 2.07.603 2.741.004.605-.54.798-1.463.838-2.33.042-.902-.076-1.902-.24-2.759-.164-.852-.38-1.606-.558-2.012-.232-.533-.843-1.571-1.579-2.479-.37-.456-.785-.897-1.216-1.229C11.743 3.27 11.244 3 10.72 3 9.77 3 9 3.77 9 4.72V7.1l-.5-.357V1.5Z"/>
</svg>
</div>
<div class="content">
<h6 class="mb-3">New User</h6>
<h3 class="text-bold mb-10">34567</h3>
<p class="text-sm text-danger">
<i class="lni lni-arrow-down"></i> -25.00%
<span class="text-gray"> Earning</span>
</p>
</div>
</div>
<!-- End Icon Cart -->
</div>
<!-- End Col -->
</div>
<!-- End Row -->
<div class="row">
<div class="col-lg-7">
<div class="card-style mb-30">
<div class="title d-flex flex-wrap justify-content-between">
<div class="left">
<h6 class="text-medium mb-10">Yearly Stats</h6>
<h3 class="text-bold">$245,479</h3>
</div>
<div class="right">
<div class="select-style-1">
<div class="select-position select-sm">
<select class="light-bg">
<option value="">Yearly</option>
<option value="">Monthly</option>
<option value="">Weekly</option>
</select>
</div>
</div>
<!-- end select -->
</div>
</div>
<!-- End Title -->
<div class="chart">
<canvas
id="Chart1"
style="width: 100%; height: 400px"
></canvas>
</div>
<!-- End Chart -->
</div>
</div>
<!-- End Col -->
<div class="col-lg-5">
<div class="card-style mb-30">
<div
class="title d-flex flex-wrap align-items-center justify-content-between"
>
<div class="left">
<h6 class="text-medium mb-30">Sales/Revenue</h6>
</div>
<div class="right">
<div class="select-style-1">
<div class="select-position select-sm">
<select class="light-bg">
<option value="">Yearly</option>
<option value="">Monthly</option>
<option value="">Weekly</option>
</select>
</div>
</div>
<!-- end select -->
</div>
</div>
<!-- End Title -->
<div class="chart">
<canvas
id="Chart2"
style="width: 100%; height: 400px"
></canvas>
</div>
<!-- End Chart -->
</div>
</div>
<!-- End Col -->
</div>
<!-- End Row -->
<div class="row">
<div class="col-lg-5">
<div class="card-style mb-30">
<div
class="title d-flex justify-content-between align-items-center"
>
<div class="left">
<h6 class="text-medium mb-30">Sells by State</h6>
</div>
</div>
<!-- End Title -->
<div id="map" style="width: 100%; height: 400px"></div>
<p>Last updated: 7 days ago</p>
</div>
</div>
<!-- End Col -->
<div class="col-lg-7">
<div class="card-style mb-30">
<div
class="title d-flex flex-wrap justify-content-between align-items-center"
>
<div class="left">
<h6 class="text-medium mb-30">Top Selling Products</h6>
</div>
<div class="right">
<div class="select-style-1">
<div class="select-position select-sm">
<select class="light-bg">
<option value="">Yearly</option>
<option value="">Monthly</option>
<option value="">Weekly</option>
</select>
</div>
</div>
<!-- end select -->
</div>
</div>
<!-- End Title -->
<div class="table-responsive">
<table class="table top-selling-table">
<thead>
<tr>
<th></th>
<th>
<h6 class="text-sm text-medium">Products</h6>
</th>
<th class="min-width">
<h6 class="text-sm text-medium">Category</h6>
</th>
<th class="min-width">
<h6 class="text-sm text-medium">Price</h6>
</th>
<th class="min-width">
<h6 class="text-sm text-medium">Sold</h6>
</th>
<th class="min-width">
<h6 class="text-sm text-medium">Profit</h6>
</th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td>
<div class="check-input-primary">
<input
class="form-check-input"
type="checkbox"
id="checkbox-1"
/>
</div>
</td>
<td>
<div class="product">
<div class="image">
<img
src="/images/products/product-mini-1.jpg"
alt=""
/>
</div>
<p class="text-sm">Arm Chair</p>
</div>
</td>
<td>
<p class="text-sm">Interior</p>
</td>
<td>
<p class="text-sm">$345</p>
</td>
<td>
<p class="text-sm">43</p>
</td>
<td>
<p class="text-sm">$45</p>
</td>
<td>
<div class="action justify-content-end">
<button
class="more-btn ml-10 dropdown-toggle"
id="moreAction1"
data-bs-toggle="dropdown"
aria-expanded="false"
>
<i class="lni lni-more-alt"></i>
</button>
<ul
class="dropdown-menu dropdown-menu-end"
aria-labelledby="moreAction1"
>
<li class="dropdown-item">
<a href="#0" class="text-gray">Remove</a>
</li>
<li class="dropdown-item">
<a href="#0" class="text-gray">Edit</a>
</li>
</ul>
</div>
</td>
</tr>
<tr>
<td>
<div class="check-input-primary">
<input
class="form-check-input"
type="checkbox"
id="checkbox-1"
/>
</div>
</td>
<td>
<div class="product">
<div class="image">
<img
src="/images/products/product-mini-2.jpg"
alt=""
/>
</div>
<p class="text-sm">SOfa</p>
</div>
</td>
<td>
<p class="text-sm">Interior</p>
</td>
<td>
<p class="text-sm">$145</p>
</td>
<td>
<p class="text-sm">13</p>
</td>
<td>
<p class="text-sm">$15</p>
</td>
<td>
<div class="action justify-content-end">
<button
class="more-btn ml-10 dropdown-toggle"
id="moreAction1"
data-bs-toggle="dropdown"
aria-expanded="false"
>
<i class="lni lni-more-alt"></i>
</button>
<ul
class="dropdown-menu dropdown-menu-end"
aria-labelledby="moreAction1"
>
<li class="dropdown-item">
<a href="#0" class="text-gray">Remove</a>
</li>
<li class="dropdown-item">
<a href="#0" class="text-gray">Edit</a>
</li>
</ul>
</div>
</td>
</tr>
<tr>
<td>
<div class="check-input-primary">
<input
class="form-check-input"
type="checkbox"
id="checkbox-1"
/>
</div>
</td>
<td>
<div class="product">
<div class="image">
<img
src="/images/products/product-mini-3.jpg"
alt=""
/>
</div>
<p class="text-sm">Dining Table</p>
</div>
</td>
<td>
<p class="text-sm">Interior</p>
</td>
<td>
<p class="text-sm">$95</p>
</td>
<td>
<p class="text-sm">32</p>
</td>
<td>
<p class="text-sm">$215</p>
</td>
<td>
<div class="action justify-content-end">
<button
class="more-btn ml-10 dropdown-toggle"
id="moreAction1"
data-bs-toggle="dropdown"
aria-expanded="false"
>
<i class="lni lni-more-alt"></i>
</button>
<ul
class="dropdown-menu dropdown-menu-end"
aria-labelledby="moreAction1"
>
<li class="dropdown-item">
<a href="#0" class="text-gray">Remove</a>
</li>
<li class="dropdown-item">
<a href="#0" class="text-gray">Edit</a>
</li>
</ul>
</div>
</td>
</tr>
<tr>
<td>
<div class="check-input-primary">
<input
class="form-check-input"
type="checkbox"
id="checkbox-1"
/>
</div>
</td>
<td>
<div class="product">
<div class="image">
<img
src="/images/products/product-mini-4.jpg"
alt=""
/>
</div>
<p class="text-sm">Office Chair</p>
</div>
</td>
<td>
<p class="text-sm">Interior</p>
</td>
<td>
<p class="text-sm">$105</p>
</td>
<td>
<p class="text-sm">23</p>
</td>
<td>
<p class="text-sm">$345</p>
</td>
<td>
<div class="action justify-content-end">
<button
class="more-btn ml-10 dropdown-toggle"
id="moreAction1"
data-bs-toggle="dropdown"
aria-expanded="false"
>
<i class="lni lni-more-alt"></i>
</button>
<ul
class="dropdown-menu dropdown-menu-end"
aria-labelledby="moreAction1"
>
<li class="dropdown-item">
<a href="#0" class="text-gray">Remove</a>
</li>
<li class="dropdown-item">
<a href="#0" class="text-gray">Edit</a>
</li>
</ul>
</div>
</td>
</tr>
</tbody>
</table>
<!-- End Table -->
</div>
</div>
</div>
<!-- End Col -->
</div>
<!-- End Row -->
<div class="row">
<div class="col-lg-7">
<div class="card-style mb-30">
<div
class="title d-flex flex-wrap align-items-center justify-content-between"
>
<div class="left">
<h6 class="text-medium mb-2">Sales Forecast</h6>
</div>
<div class="right">
<div class="select-style-1 mb-2">
<div class="select-position select-sm">
<select class="light-bg">
<option value="">Last Month</option>
<option value="">Last 3 Months</option>
<option value="">Last Year</option>
</select>
</div>
</div>
<!-- end select -->
</div>
</div>
<!-- End Title -->
<div class="chart">
<div id="legend3">
<ul
class="legend3 d-flex flex-wrap align-items-center mb-30"
>
<li>
<div class="d-flex">
<span class="bg-color primary-bg"> </span>
<div class="text">
<p class="text-sm text-success">
<span class="text-dark">Revenue</span> +25.55%
<i class="lni lni-arrow-up"></i>
</p>
</div>
</div>
</li>
<li>
<div class="d-flex">
<span class="bg-color purple-bg"></span>
<div class="text">
<p class="text-sm text-success">
<span class="text-dark">Net Profit</span> +45.55%
<i class="lni lni-arrow-up"></i>
</p>
</div>
</div>
</li>
<li>
<div class="d-flex">
<span class="bg-color orange-bg"></span>
<div class="text">
<p class="text-sm text-danger">
<span class="text-dark">Order</span> -4.2%
<i class="lni lni-arrow-down"></i>
</p>
</div>
</div>
</li>
</ul>
</div>
<canvas
id="Chart3"
style="width: 100%; height: 450px"
></canvas>
</div>
</div>
</div>
<!-- End Col -->
<div class="col-lg-5">
<div class="card-style mb-30">
<div
class="title d-flex flex-wrap align-items-center justify-content-between"
>
<div class="left">
<h6 class="text-medium mb-2">Traffic</h6>
</div>
<div class="right">
<div class="select-style-1 mb-2">
<div class="select-position select-sm">
<select class="bg-ligh">
<option value="">Last 6 Months</option>
<option value="">Last 3 Months</option>
<option value="">Last Year</option>
</select>
</div>
</div>
<!-- end select -->
</div>
</div>
<!-- End Title -->
<div class="chart">
<div id="legend4">
<ul
class="legend3 d-flex flex-wrap align-items-center mb-30"
>
<li>
<div class="d-flex">
<span class="bg-color primary-bg"> </span>
<div class="text">
<p class="text-sm text-success">
<span class="text-dark">Store Visits</span>
+25.55%
<i class="lni lni-arrow-up"></i>
</p>
<h2>3456</h2>
</div>
</div>
</li>
<li>
<div class="d-flex">
<span class="bg-color danger-bg"></span>
<div class="text">
<p class="text-sm text-danger">
<span class="text-dark">Visitors</span> -2.05%
<i class="lni lni-arrow-down"></i>
</p>
<h2>3456</h2>
</div>
</div>
</li>
</ul>
</div>
<canvas
id="Chart4"
style="width: 100%; height: 420px"
></canvas>
</div>
<!-- End Chart -->
</div>
</div>
<!-- End Col -->
</div>
<!-- End Row -->
<div class="row">
<div class="col-lg-5">
<div class="card-style calendar-card mb-30">
<div id="calendar-mini"></div>
</div>
</div>
<!-- End Col -->
<div class="col-lg-7">
<div class="card-style mb-30">
<div
class="title d-flex flex-wrap align-items-center justify-content-between"
>
<div class="left">
<h6 class="text-medium mb-30">Sales History</h6>
</div>
<div class="right">
<div class="select-style-1">
<div class="select-position select-sm">
<select class="light-bg">
<option value="">Today</option>
<option value="">Yesterday</option>
</select>
</div>
</div>
<!-- end select -->
</div>
</div>
<!-- End Title -->
<div class="table-responsive">
<table class="table top-selling-table">
<thead>
<tr>
<th>
<h6 class="text-sm text-medium">Products</h6>
</th>
<th class="min-width">
<h6 class="text-sm text-medium">
Category <i class="lni lni-arrows-vertical"></i>
</h6>
</th>
<th class="min-width">
<h6 class="text-sm text-medium">
Revenue <i class="lni lni-arrows-vertical"></i>
</h6>
</th>
<th class="min-width">
<h6 class="text-sm text-medium">
Status <i class="lni lni-arrows-vertical"></i>
</h6>
</th>
<th>
<h6 class="text-sm text-medium text-end">
Actions <i class="lni lni-arrows-vertical"></i>
</h6>
</th>
</tr>
</thead>
<tbody>
<tr>
<td>
<div class="product">
<div class="image">
<img
src="/images/products/product-mini-1.jpg"
alt=""
/>
</div>
<p class="text-sm">Bedroom</p>
</div>
</td>
<td>
<p class="text-sm">Interior</p>
</td>
<td>
<p class="text-sm">$345</p>
</td>
<td>
<span class="status-btn close-btn">Pending</span>
</td>
<td>
<div class="action justify-content-end">
<button class="edit">
<i class="lni lni-pencil"></i>
</button>
<button
class="more-btn ml-10 dropdown-toggle"
id="moreAction1"
data-bs-toggle="dropdown"
aria-expanded="false"
>
<i class="lni lni-more-alt"></i>
</button>
<ul
class="dropdown-menu dropdown-menu-end"
aria-labelledby="moreAction1"
>
<li class="dropdown-item">
<a href="#0" class="text-gray">Remove</a>
</li>
<li class="dropdown-item">
<a href="#0" class="text-gray">Edit</a>
</li>
</ul>
</div>
</td>
</tr>
<tr>
<td>
<div class="product">
<div class="image">
<img
src="/images/products/product-mini-2.jpg"
alt=""
/>
</div>
<p class="text-sm">Arm Chair</p>
</div>
</td>
<td>
<p class="text-sm">Interior</p>
</td>
<td>
<p class="text-sm">$345</p>
</td>
<td>
<span class="status-btn warning-btn">Refund</span>
</td>
<td>
<div class="action justify-content-end">
<button class="edit">
<i class="lni lni-pencil"></i>
</button>
<button
class="more-btn ml-10 dropdown-toggle"
id="moreAction1"
data-bs-toggle="dropdown"
aria-expanded="false"
>
<i class="lni lni-more-alt"></i>
</button>
<ul
class="dropdown-menu dropdown-menu-end"
aria-labelledby="moreAction1"
>
<li class="dropdown-item">
<a href="#0" class="text-gray">Remove</a>
</li>
<li class="dropdown-item">
<a href="#0" class="text-gray">Edit</a>
</li>
</ul>
</div>
</td>
</tr>
<tr>
<td>
<div class="product">
<div class="image">
<img
src="/images/products/product-mini-3.jpg"
alt=""
/>
</div>
<p class="text-sm">Sofa</p>
</div>
</td>
<td>
<p class="text-sm">Interior</p>
</td>
<td>
<p class="text-sm">$345</p>
</td>
<td>
<span class="status-btn success-btn">Completed</span>
</td>
<td>
<div class="action justify-content-end">
<button class="edit">
<i class="lni lni-pencil"></i>
</button>
<button
class="more-btn ml-10 dropdown-toggle"
id="moreAction1"
data-bs-toggle="dropdown"
aria-expanded="false"
>
<i class="lni lni-more-alt"></i>
</button>
<ul
class="dropdown-menu dropdown-menu-end"
aria-labelledby="moreAction1"
>
<li class="dropdown-item">
<a href="#0" class="text-gray">Remove</a>
</li>
<li class="dropdown-item">
<a href="#0" class="text-gray">Edit</a>
</li>
</ul>
</div>
</td>
</tr>
<tr>
<td>
<div class="product">
<div class="image">
<img
src="/images/products/product-mini-4.jpg"
alt=""
/>
</div>
<p class="text-sm">Kitchen</p>
</div>
</td>
<td>
<p class="text-sm">Interior</p>
</td>
<td>
<p class="text-sm">$345</p>
</td>
<td>
<span class="status-btn close-btn">Canceled</span>
</td>
<td>
<div class="action justify-content-end">
<button class="edit">
<i class="lni lni-pencil"></i>
</button>
<button
class="more-btn ml-10 dropdown-toggle"
id="moreAction1"
data-bs-toggle="dropdown"
aria-expanded="false"
>
<i class="lni lni-more-alt"></i>
</button>
<ul
class="dropdown-menu dropdown-menu-end"
aria-labelledby="moreAction1"
>
<li class="dropdown-item">
<a href="#0" class="text-gray">Remove</a>
</li>
<li class="dropdown-item">
<a href="#0" class="text-gray">Edit</a>
</li>
</ul>
</div>
</td>
</tr>
</tbody>
</table>
<!-- End Table -->
</div>
</div>
</div>
<!-- End Col -->
</div>
<!-- End Row -->
</div>
<!-- end container -->
</section>
<!-- ========== section end ========== -->
<!-- ========== footer start =========== -->
<footer class="footer">
<div class="container-fluid">
<div class="row">
<div class="col-md-6 order-last order-md-first">
<div class="copyright text-center text-md-start">
<p class="text-sm">
Designed and Developed by
<a
href="https://plainadmin.com/"
rel="nofollow"
target="_blank"
>
PlainAdmin
</a>
</p>
</div>
</div>
<!-- end col-->
<div class="col-md-6">
<div
class="terms d-flex justify-content-center justify-content-md-end"
>
<a href="#0" class="text-sm">Term & Conditions</a>
<a href="#0" class="text-sm ml-15">Privacy & Policy</a>
</div>
</div>
</div>
<!-- end row -->
</div>
<!-- end container -->
</footer>
<!-- ========== footer end =========== -->
</main>
<!-- ======== main-wrapper end =========== -->
<!-- ============ Theme Option Start ============= -->
<button class="option-btn">
<i class="lni lni-cog"></i>
</button>
<div class="option-overlay"></div>
<div class="option-box">
<div class="option-header">
<div>
<h5>Theme Customizer</h5>
<p class="text-gray">Customize and Preview in Real time</p>
</div>
<button class="option-btn-close text-gray">
<i class="lni lni-close"></i>
</button>
</div>
<h6 class="mb-10">Sidebar</h6>
<ul class="mb-30">
<li><button class="leftSidebarButton active">Left Sidebar</button></li>
<li><button class="rightSidebarButton">Right Sidebar</button></li>
</ul>
<h6 class="mb-10">Theme</h6>
<ul class="d-flex flex-wrap align-items-center">
<li>
<button class="lightThemeButton active">
Light Theme + Sidebar 1
</button>
</li>
<li>
<button class="lightThemeButton2">Light Theme + Sidebar 2</button>
</li>
<li><button class="darkThemeButton">Dark Theme + Sidebar 1</button></li>
<li>
<button class="darkThemeButton2">Dark Theme + Sidebar 2</button>
</li>
</ul>
<div class="promo-box">
<h3>PlainAdmin Pro</h3>
<p>Get All Dashboards and 300+ UI Elements</p>
<a
href="https://plainadmin.com/pro"
target="_blank"
rel="nofollow"
class="main-btn primary-btn btn-hover"
>
Purchase Now
</a>
</div>
</div>
<!-- ============ Theme Option End ============= -->
<!-- ========= All Javascript files linkup ======== -->
<script src="/js/bootstrap.bundle.min.js"></script>
<script src="/js/Chart.min.js"></script>
<script src="/js/apexcharts.min.js"></script>
<script src="/js/dynamic-pie-chart.js"></script>
<script src="/js/moment.min.js"></script>
<script src="/js/fullcalendar.js"></script>
<script src="/js/jvectormap.min.js"></script>
<script src="/js/world-merc.js"></script>
<script src="/js/polyfill.js"></script>
<script src="/js/quill.min.js"></script>
<script src="/js/datatable.js"></script>
<script src="/js/Sortable.min.js"></script>
<script src="/js/main.js"></script>
<script>
// ======== jvectormap activation
var markers = [
{ name: "Egypt", coords: [26.8206, 30.8025] },
{ name: "Russia", coords: [61.524, 105.3188] },
{ name: "Canada", coords: [56.1304, -106.3468] },
{ name: "Greenland", coords: [71.7069, -42.6043] },
{ name: "Brazil", coords: [-14.235, -51.9253] },
];
var jvm = new jsVectorMap({
map: "world_merc",
selector: "#map",
zoomButtons: true,
regionStyle: {
initial: {
fill: "#d1d5db",
},
},
labels: {
markers: {
render: (marker) => marker.name,
},
},
markersSelectable: true,
selectedMarkers: markers.map((marker, index) => {
var name = marker.name;
if (name === "Russia" || name === "Brazil") {
return index;
}
}),
markers: markers,
markerStyle: {
initial: { fill: "#4A6CF7" },
selected: { fill: "#ff5050" },
},
markerLabelStyle: {
initial: {
fontWeight: 400,
fontSize: 14,
},
},
});
// ====== calendar activation
document.addEventListener("DOMContentLoaded", function () {
var calendarMiniEl = document.getElementById("calendar-mini");
var calendarMini = new FullCalendar.Calendar(calendarMiniEl, {
initialView: "dayGridMonth",
headerToolbar: {
end: "today prev,next",
},
});
calendarMini.render();
});
// =========== chart one start
const ctx1 = document.getElementById("Chart1").getContext("2d");
const chart1 = new Chart(ctx1, {
// The type of chart we want to create
type: "line", // also try bar or other graph types
// The data for our dataset
data: {
labels: [
"Jan",
"Fab",
"Mar",
"Apr",
"May",
"Jun",
"Jul",
"Aug",
"Sep",
"Oct",
"Nov",
"Dec",
],
// Information about the dataset
datasets: [
{
label: "",
backgroundColor: "transparent",
borderColor: "#4A6CF7",
data: [
600, 800, 750, 880, 940, 880, 900, 770, 920, 890, 976, 1100,
],
pointBackgroundColor: "transparent",
pointHoverBackgroundColor: "#4A6CF7",
pointBorderColor: "transparent",
pointHoverBorderColor: "#fff",
pointHoverBorderWidth: 5,
pointBorderWidth: 5,
pointRadius: 8,
pointHoverRadius: 8,
},
],
},
// Configuration options
defaultFontFamily: "Inter",
options: {
tooltips: {
callbacks: {
labelColor: function (tooltipItem, chart) {
return {
backgroundColor: "#ffffff",
};
},
},
intersect: false,
backgroundColor: "#f9f9f9",
titleFontFamily: "Inter",
titleFontColor: "#8F92A1",
titleFontColor: "#8F92A1",
titleFontSize: 12,
bodyFontFamily: "Inter",
bodyFontColor: "#171717",
bodyFontStyle: "bold",
bodyFontSize: 16,
multiKeyBackground: "transparent",
displayColors: false,
xPadding: 30,
yPadding: 10,
bodyAlign: "center",
titleAlign: "center",
},
title: {
display: false,
},
legend: {
display: false,
},
scales: {
yAxes: [
{
gridLines: {
display: false,
drawTicks: false,
drawBorder: false,
},
ticks: {
padding: 35,
max: 1200,
min: 500,
},
},
],
xAxes: [
{
gridLines: {
drawBorder: false,
color: "rgba(143, 146, 161, .1)",
zeroLineColor: "rgba(143, 146, 161, .1)",
},
ticks: {
padding: 20,
},
},
],
},
},
});
// =========== chart one end
// =========== chart two start
const ctx2 = document.getElementById("Chart2").getContext("2d");
const chart2 = new Chart(ctx2, {
// The type of chart we want to create
type: "bar", // also try bar or other graph types
// The data for our dataset
data: {
labels: [
"Jan",
"Fab",
"Mar",
"Apr",
"May",
"Jun",
"Jul",
"Aug",
"Sep",
"Oct",
"Nov",
"Dec",
],
// Information about the dataset
datasets: [
{
label: "",
backgroundColor: "#4A6CF7",
barThickness: 6,
maxBarThickness: 8,
data: [
600, 700, 1000, 700, 650, 800, 690, 740, 720, 1120, 876, 900,
],
},
],
},
// Configuration options
options: {
borderColor: "#F3F6F8",
borderWidth: 15,
backgroundColor: "#F3F6F8",
tooltips: {
callbacks: {
labelColor: function (tooltipItem, chart) {
return {
backgroundColor: "rgba(104, 110, 255, .0)",
};
},
},
backgroundColor: "#F3F6F8",
titleFontColor: "#8F92A1",
titleFontSize: 12,
bodyFontColor: "#171717",
bodyFontStyle: "bold",
bodyFontSize: 16,
multiKeyBackground: "transparent",
displayColors: false,
xPadding: 30,
yPadding: 10,
bodyAlign: "center",
titleAlign: "center",
},
title: {
display: false,
},
legend: {
display: false,
},
scales: {
yAxes: [
{
gridLines: {
display: false,
drawTicks: false,
drawBorder: false,
},
ticks: {
padding: 35,
max: 1200,
min: 0,
},
},
],
xAxes: [
{
gridLines: {
display: false,
drawBorder: false,
color: "rgba(143, 146, 161, .1)",
zeroLineColor: "rgba(143, 146, 161, .1)",
},
ticks: {
padding: 20,
},
},
],
},
},
});
// =========== chart two end
// =========== chart three start
const ctx3 = document.getElementById("Chart3").getContext("2d");
const chart3 = new Chart(ctx3, {
// The type of chart we want to create
type: "line", // also try bar or other graph types
// The data for our dataset
data: {
labels: [
"Jan",
"Fab",
"Mar",
"Apr",
"May",
"Jun",
"Jul",
"Aug",
"Sep",
"Oct",
"Nov",
"Dec",
],
// Information about the dataset
datasets: [
{
label: "Revenue",
backgroundColor: "transparent",
borderColor: "#4a6cf7",
data: [80, 120, 110, 100, 130, 150, 115, 145, 140, 130, 160, 210],
pointBackgroundColor: "transparent",
pointHoverBackgroundColor: "#4a6cf7",
pointBorderColor: "transparent",
pointHoverBorderColor: "#fff",
pointHoverBorderWidth: 3,
pointBorderWidth: 5,
pointRadius: 5,
pointHoverRadius: 8,
},
{
label: "Profit",
backgroundColor: "transparent",
borderColor: "#9b51e0",
data: [
120, 160, 150, 140, 165, 210, 135, 155, 170, 140, 130, 200,
],
pointBackgroundColor: "transparent",
pointHoverBackgroundColor: "#9b51e0",
pointBorderColor: "transparent",
pointHoverBorderColor: "#fff",
pointHoverBorderWidth: 3,
pointBorderWidth: 5,
pointRadius: 5,
pointHoverRadius: 8,
},
{
label: "Order",
backgroundColor: "transparent",
borderColor: "#f2994a",
data: [180, 110, 140, 135, 100, 90, 145, 115, 100, 110, 115, 150],
pointBackgroundColor: "transparent",
pointHoverBackgroundColor: "#f2994a",
pointBorderColor: "transparent",
pointHoverBorderColor: "#fff",
pointHoverBorderWidth: 3,
pointBorderWidth: 5,
pointRadius: 5,
pointHoverRadius: 8,
},
],
},
// Configuration options
options: {
tooltips: {
intersect: false,
backgroundColor: "#fbfbfb",
titleFontColor: "#8F92A1",
titleFontSize: 16,
titleFontFamily: "Inter",
titleFontStyle: "400",
bodyFontFamily: "Inter",
bodyFontColor: "#171717",
bodyFontSize: 16,
multiKeyBackground: "transparent",
displayColors: false,
xPadding: 30,
yPadding: 15,
borderColor: "rgba(143, 146, 161, .1)",
borderWidth: 1,
title: false,
},
title: {
display: false,
},
layout: {
padding: {
top: 0,
},
},
legend: false,
scales: {
yAxes: [
{
gridLines: {
display: false,
drawTicks: false,
drawBorder: false,
},
ticks: {
padding: 35,
max: 300,
min: 50,
},
},
],
xAxes: [
{
gridLines: {
drawBorder: false,
color: "rgba(143, 146, 161, .1)",
zeroLineColor: "rgba(143, 146, 161, .1)",
},
ticks: {
padding: 20,
},
},
],
},
},
});
// =========== chart three end
// ================== chart four start
const ctx4 = document.getElementById("Chart4").getContext("2d");
const chart4 = new Chart(ctx4, {
// The type of chart we want to create
type: "bar", // also try bar or other graph types
// The data for our dataset
data: {
labels: ["Jan", "Fab", "Mar", "Apr", "May", "Jun"],
// Information about the dataset
datasets: [
{
label: "",
backgroundColor: "#4A6CF7",
barThickness: "flex",
maxBarThickness: 8,
data: [600, 700, 1000, 700, 650, 800],
},
{
label: "",
backgroundColor: "#d50100",
barThickness: "flex",
maxBarThickness: 8,
data: [690, 740, 720, 1120, 876, 900],
},
],
},
// Configuration options
options: {
borderColor: "#F3F6F8",
borderWidth: 15,
backgroundColor: "#F3F6F8",
tooltips: {
callbacks: {
labelColor: function (tooltipItem, chart) {
return {
backgroundColor: "rgba(104, 110, 255, .0)",
};
},
},
backgroundColor: "#F3F6F8",
titleFontColor: "#8F92A1",
titleFontSize: 12,
bodyFontColor: "#171717",
bodyFontStyle: "bold",
bodyFontSize: 16,
multiKeyBackground: "transparent",
displayColors: false,
xPadding: 30,
yPadding: 10,
bodyAlign: "center",
titleAlign: "center",
},
title: {
display: false,
},
legend: {
display: false,
},
scales: {
yAxes: [
{
gridLines: {
display: false,
drawTicks: false,
drawBorder: false,
},
ticks: {
padding: 35,
max: 1200,
min: 0,
},
},
],
xAxes: [
{
gridLines: {
display: false,
drawBorder: false,
color: "rgba(143, 146, 161, .1)",
zeroLineColor: "rgba(143, 146, 161, .1)",
},
ticks: {
padding: 20,
},
},
],
},
},
});
// =========== chart four end
</script>
</body>
<!-- Mirrored from demo.plainadmin.com/ by HTTrack Website Copier/3.x [XR&CO'2014], Tue, 02 May 2023 10:59:35 GMT -->
</html>