ducdt/admin_hura
2
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Compare commits

base: ducdt:0c240b45ea48a1ed35da66ebbf3d86c62efdf9fb
Branches Tags
ducdt:master ducdt:tieptk
...
compare: ducdt:tieptk
Branches Tags
ducdt:master ducdt:tieptk

3 Commits
0c240b45ea ... tieptk

Author SHA1 Message Date
Tieptk
0a4a6511bc 8/1/2024 2024-01-08 10:05:23 +07:00
Tieptk
d3ee47dae6 8/1/2024 2024-01-08 09:44:33 +07:00
Tieptk
b2469a9235 08/01/2024 2024-01-08 09:26:16 +07:00
7 changed files with 3149 additions and 1181 deletions
Expand all files Collapse all files

458
homepage.html
View File

@@ -1,5 +1,6 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head> <head>
<meta charset="utf-8" /> <meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta http-equiv="X-UA-Compatible" content="IE=edge">
@@ -8,19 +9,21 @@
<link rel="preconnect" href="https://fonts.googleapis.com"> <link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&display=swap" rel="stylesheet"> <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&display=swap"
rel="stylesheet">
<link rel="stylesheet" media="screen" href="scss/pc_style.css" /> <link rel="stylesheet" media="screen" href="scss/pc_style.css" />
<script src="js/tailwindcss.js"></script> <script src="js/tailwindcss.js"></script>
</head> </head>
<body> <body>
<div class="admin-global-container"> <div class="admin-global-container">
<!-- Menu cũ <!-- Menu cũ -->
<div class="admin-menu-container sticky top-0 bottom-0 h-[100vh]" style="display: none;"> <div class="admin-menu-container sticky top-0 bottom-0 h-[100vh] flex">
<a href="" class="menu-logo"> <a href="" class="menu-logo">
<img src="images/logo.png"/> <img src="images/logo.png" />
</a> </a>
<div class="menu-list"> <div class="menu-list">
@@ -37,7 +40,9 @@
</a> </a>
<svg xmlns="http://www.w3.org/2000/svg" width="7" height="12" viewBox="0 0 7 12" fill="none"> <svg xmlns="http://www.w3.org/2000/svg" width="7" height="12" viewBox="0 0 7 12" fill="none">
<path fill-rule="evenodd" clip-rule="evenodd" d="M0.646447 11.3536C0.451184 11.1583 0.451184 10.8417 0.646447 10.6464L5.29289 6L0.646446 1.35355C0.451184 1.15829 0.451184 0.841709 0.646446 0.646446C0.841708 0.451184 1.15829 0.451184 1.35355 0.646446L6.35355 5.64645C6.54882 5.84171 6.54882 6.15829 6.35355 6.35355L1.35355 11.3536C1.15829 11.5488 0.841709 11.5488 0.646447 11.3536Z" fill="white"/> <path fill-rule="evenodd" clip-rule="evenodd"
d="M0.646447 11.3536C0.451184 11.1583 0.451184 10.8417 0.646447 10.6464L5.29289 6L0.646446 1.35355C0.451184 1.15829 0.451184 0.841709 0.646446 0.646446C0.841708 0.451184 1.15829 0.451184 1.35355 0.646446L6.35355 5.64645C6.54882 5.84171 6.54882 6.15829 6.35355 6.35355L1.35355 11.3536C1.15829 11.5488 0.841709 11.5488 0.646447 11.3536Z"
fill="white" />
</svg> </svg>
</summary> </summary>
@@ -58,7 +63,9 @@
</a> </a>
<svg xmlns="http://www.w3.org/2000/svg" width="7" height="12" viewBox="0 0 7 12" fill="none"> <svg xmlns="http://www.w3.org/2000/svg" width="7" height="12" viewBox="0 0 7 12" fill="none">
<path fill-rule="evenodd" clip-rule="evenodd" d="M0.646447 11.3536C0.451184 11.1583 0.451184 10.8417 0.646447 10.6464L5.29289 6L0.646446 1.35355C0.451184 1.15829 0.451184 0.841709 0.646446 0.646446C0.841708 0.451184 1.15829 0.451184 1.35355 0.646446L6.35355 5.64645C6.54882 5.84171 6.54882 6.15829 6.35355 6.35355L1.35355 11.3536C1.15829 11.5488 0.841709 11.5488 0.646447 11.3536Z" fill="white"/> <path fill-rule="evenodd" clip-rule="evenodd"
d="M0.646447 11.3536C0.451184 11.1583 0.451184 10.8417 0.646447 10.6464L5.29289 6L0.646446 1.35355C0.451184 1.15829 0.451184 0.841709 0.646446 0.646446C0.841708 0.451184 1.15829 0.451184 1.35355 0.646446L6.35355 5.64645C6.54882 5.84171 6.54882 6.15829 6.35355 6.35355L1.35355 11.3536C1.15829 11.5488 0.841709 11.5488 0.646447 11.3536Z"
fill="white" />
</svg> </svg>
</summary> </summary>
@@ -79,7 +86,9 @@
</a> </a>
<svg xmlns="http://www.w3.org/2000/svg" width="7" height="12" viewBox="0 0 7 12" fill="none"> <svg xmlns="http://www.w3.org/2000/svg" width="7" height="12" viewBox="0 0 7 12" fill="none">
<path fill-rule="evenodd" clip-rule="evenodd" d="M0.646447 11.3536C0.451184 11.1583 0.451184 10.8417 0.646447 10.6464L5.29289 6L0.646446 1.35355C0.451184 1.15829 0.451184 0.841709 0.646446 0.646446C0.841708 0.451184 1.15829 0.451184 1.35355 0.646446L6.35355 5.64645C6.54882 5.84171 6.54882 6.15829 6.35355 6.35355L1.35355 11.3536C1.15829 11.5488 0.841709 11.5488 0.646447 11.3536Z" fill="white"/> <path fill-rule="evenodd" clip-rule="evenodd"
d="M0.646447 11.3536C0.451184 11.1583 0.451184 10.8417 0.646447 10.6464L5.29289 6L0.646446 1.35355C0.451184 1.15829 0.451184 0.841709 0.646446 0.646446C0.841708 0.451184 1.15829 0.451184 1.35355 0.646446L6.35355 5.64645C6.54882 5.84171 6.54882 6.15829 6.35355 6.35355L1.35355 11.3536C1.15829 11.5488 0.841709 11.5488 0.646447 11.3536Z"
fill="white" />
</svg> </svg>
</summary> </summary>
@@ -100,7 +109,9 @@
</a> </a>
<svg xmlns="http://www.w3.org/2000/svg" width="7" height="12" viewBox="0 0 7 12" fill="none"> <svg xmlns="http://www.w3.org/2000/svg" width="7" height="12" viewBox="0 0 7 12" fill="none">
<path fill-rule="evenodd" clip-rule="evenodd" d="M0.646447 11.3536C0.451184 11.1583 0.451184 10.8417 0.646447 10.6464L5.29289 6L0.646446 1.35355C0.451184 1.15829 0.451184 0.841709 0.646446 0.646446C0.841708 0.451184 1.15829 0.451184 1.35355 0.646446L6.35355 5.64645C6.54882 5.84171 6.54882 6.15829 6.35355 6.35355L1.35355 11.3536C1.15829 11.5488 0.841709 11.5488 0.646447 11.3536Z" fill="white"/> <path fill-rule="evenodd" clip-rule="evenodd"
d="M0.646447 11.3536C0.451184 11.1583 0.451184 10.8417 0.646447 10.6464L5.29289 6L0.646446 1.35355C0.451184 1.15829 0.451184 0.841709 0.646446 0.646446C0.841708 0.451184 1.15829 0.451184 1.35355 0.646446L6.35355 5.64645C6.54882 5.84171 6.54882 6.15829 6.35355 6.35355L1.35355 11.3536C1.15829 11.5488 0.841709 11.5488 0.646447 11.3536Z"
fill="white" />
</svg> </svg>
</summary> </summary>
@@ -121,7 +132,9 @@
</a> </a>
<svg xmlns="http://www.w3.org/2000/svg" width="7" height="12" viewBox="0 0 7 12" fill="none"> <svg xmlns="http://www.w3.org/2000/svg" width="7" height="12" viewBox="0 0 7 12" fill="none">
<path fill-rule="evenodd" clip-rule="evenodd" d="M0.646447 11.3536C0.451184 11.1583 0.451184 10.8417 0.646447 10.6464L5.29289 6L0.646446 1.35355C0.451184 1.15829 0.451184 0.841709 0.646446 0.646446C0.841708 0.451184 1.15829 0.451184 1.35355 0.646446L6.35355 5.64645C6.54882 5.84171 6.54882 6.15829 6.35355 6.35355L1.35355 11.3536C1.15829 11.5488 0.841709 11.5488 0.646447 11.3536Z" fill="white"/> <path fill-rule="evenodd" clip-rule="evenodd"
d="M0.646447 11.3536C0.451184 11.1583 0.451184 10.8417 0.646447 10.6464L5.29289 6L0.646446 1.35355C0.451184 1.15829 0.451184 0.841709 0.646446 0.646446C0.841708 0.451184 1.15829 0.451184 1.35355 0.646446L6.35355 5.64645C6.54882 5.84171 6.54882 6.15829 6.35355 6.35355L1.35355 11.3536C1.15829 11.5488 0.841709 11.5488 0.646447 11.3536Z"
fill="white" />
</svg> </svg>
</summary> </summary>
@@ -142,7 +155,9 @@
</a> </a>
<svg xmlns="http://www.w3.org/2000/svg" width="7" height="12" viewBox="0 0 7 12" fill="none"> <svg xmlns="http://www.w3.org/2000/svg" width="7" height="12" viewBox="0 0 7 12" fill="none">
<path fill-rule="evenodd" clip-rule="evenodd" d="M0.646447 11.3536C0.451184 11.1583 0.451184 10.8417 0.646447 10.6464L5.29289 6L0.646446 1.35355C0.451184 1.15829 0.451184 0.841709 0.646446 0.646446C0.841708 0.451184 1.15829 0.451184 1.35355 0.646446L6.35355 5.64645C6.54882 5.84171 6.54882 6.15829 6.35355 6.35355L1.35355 11.3536C1.15829 11.5488 0.841709 11.5488 0.646447 11.3536Z" fill="white"/> <path fill-rule="evenodd" clip-rule="evenodd"
d="M0.646447 11.3536C0.451184 11.1583 0.451184 10.8417 0.646447 10.6464L5.29289 6L0.646446 1.35355C0.451184 1.15829 0.451184 0.841709 0.646446 0.646446C0.841708 0.451184 1.15829 0.451184 1.35355 0.646446L6.35355 5.64645C6.54882 5.84171 6.54882 6.15829 6.35355 6.35355L1.35355 11.3536C1.15829 11.5488 0.841709 11.5488 0.646447 11.3536Z"
fill="white" />
</svg> </svg>
</summary> </summary>
@@ -163,7 +178,9 @@
</a> </a>
<svg xmlns="http://www.w3.org/2000/svg" width="7" height="12" viewBox="0 0 7 12" fill="none"> <svg xmlns="http://www.w3.org/2000/svg" width="7" height="12" viewBox="0 0 7 12" fill="none">
<path fill-rule="evenodd" clip-rule="evenodd" d="M0.646447 11.3536C0.451184 11.1583 0.451184 10.8417 0.646447 10.6464L5.29289 6L0.646446 1.35355C0.451184 1.15829 0.451184 0.841709 0.646446 0.646446C0.841708 0.451184 1.15829 0.451184 1.35355 0.646446L6.35355 5.64645C6.54882 5.84171 6.54882 6.15829 6.35355 6.35355L1.35355 11.3536C1.15829 11.5488 0.841709 11.5488 0.646447 11.3536Z" fill="white"/> <path fill-rule="evenodd" clip-rule="evenodd"
d="M0.646447 11.3536C0.451184 11.1583 0.451184 10.8417 0.646447 10.6464L5.29289 6L0.646446 1.35355C0.451184 1.15829 0.451184 0.841709 0.646446 0.646446C0.841708 0.451184 1.15829 0.451184 1.35355 0.646446L6.35355 5.64645C6.54882 5.84171 6.54882 6.15829 6.35355 6.35355L1.35355 11.3536C1.15829 11.5488 0.841709 11.5488 0.646447 11.3536Z"
fill="white" />
</svg> </svg>
</summary> </summary>
@@ -199,15 +216,17 @@
<i class="icons icon-logout"></i> <i class="icons icon-logout"></i>
<span class="title"> Thoát quản trị </span> <span class="title"> Thoát quản trị </span>
</a> </a>
</div>--> </div>
<!-- Menu mới --> <!-- Menu mới -->
<div class="admin-menu sticky top-0 bottom-0 h-[100vh] bg-[#004E99] flex flex-col justify-between"> <div class="admin-menu sticky top-0 bottom-0 h-[100vh] bg-[#004E99] flex flex-col justify-between">
<div> <div>
<a href="" class="item items-center justify-center border-[rgba(255,255,255,0.15)] border-b p-[20px_0_38px_!important]"> <a href=""
class="item items-center justify-center border-[rgba(255,255,255,0.15)] border-b p-[20px_0_38px_!important]">
<svg xmlns="http://www.w3.org/2000/svg" width="35" height="21" viewBox="0 0 35 21" fill="none"> <svg xmlns="http://www.w3.org/2000/svg" width="35" height="21" viewBox="0 0 35 21" fill="none">
<path d="M28.5184 7.75141C28.4928 10.6955 27.8993 11.3464 27.8993 11.3464C29.065 3.56585 22.8312 0.686397 22.8312 0.686397C14.1636 -2.28358 11.3328 5.34611 11.3328 5.34611C5.84614 4.92368 4.24499 10.0963 4.24499 10.0963C10.9656 11.1611 9.15091 16.8812 9.15091 16.8812C9.36867 12.5146 6.78975 11.4887 6.78975 11.4887C2.42608 9.30752 0.355256 13.7302 0.355256 13.7302C-1.31421 19.2347 3.44228 20.4891 3.44228 20.4891H28.9967C35.0725 19.6098 34.748 14.1052 34.748 14.1052C34.1246 7.61347 28.5184 7.75141 28.5184 7.75141Z" fill="white"/> <path
d="M28.5184 7.75141C28.4928 10.6955 27.8993 11.3464 27.8993 11.3464C29.065 3.56585 22.8312 0.686397 22.8312 0.686397C14.1636 -2.28358 11.3328 5.34611 11.3328 5.34611C5.84614 4.92368 4.24499 10.0963 4.24499 10.0963C10.9656 11.1611 9.15091 16.8812 9.15091 16.8812C9.36867 12.5146 6.78975 11.4887 6.78975 11.4887C2.42608 9.30752 0.355256 13.7302 0.355256 13.7302C-1.31421 19.2347 3.44228 20.4891 3.44228 20.4891H28.9967C35.0725 19.6098 34.748 14.1052 34.748 14.1052C34.1246 7.61347 28.5184 7.75141 28.5184 7.75141Z"
fill="white" />
</svg> </svg>
</a> </a>
@@ -386,9 +405,13 @@
<div class="admin-header-container flex items-center justify-between bg-white px-4 py-3"> <div class="admin-header-container flex items-center justify-between bg-white px-4 py-3">
<form class="max-w-[420px] relative w-[100%]"> <form class="max-w-[420px] relative w-[100%]">
<div class="absolute inset-y-0 start-0 flex items-center ps-3 pointer-events-none"> <div class="absolute inset-y-0 start-0 flex items-center ps-3 pointer-events-none">
<svg class="w-4 h-4" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="none"> <svg class="w-4 h-4" xmlns="http://www.w3.org/2000/svg" width="20" height="20"
<path d="M9 17C13.4183 17 17 13.4183 17 9C17 4.58172 13.4183 1 9 1C4.58172 1 1 4.58172 1 9C1 13.4183 4.58172 17 9 17Z" stroke="#C5C5C5" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/> viewBox="0 0 20 20" fill="none">
<path d="M18.9999 19L14.6499 14.65" stroke="#C5C5C5" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/> <path
d="M9 17C13.4183 17 17 13.4183 17 9C17 4.58172 13.4183 1 9 1C4.58172 1 1 4.58172 1 9C1 13.4183 4.58172 17 9 17Z"
stroke="#C5C5C5" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" />
<path d="M18.9999 19L14.6499 14.65" stroke="#C5C5C5" stroke-width="2" stroke-linecap="round"
stroke-linejoin="round" />
</svg> </svg>
</div> </div>
@@ -398,25 +421,43 @@
<div class="admin-header-right flex items-center justify-end"> <div class="admin-header-right flex items-center justify-end">
<a href="" title="Truy cập trung tâm hỗ trợ của Hurasoft"> <a href="" title="Truy cập trung tâm hỗ trợ của Hurasoft">
<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" viewBox="0 0 28 28" fill="none"> <svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" viewBox="0 0 28 28" fill="none">
<path fill-rule="evenodd" clip-rule="evenodd" d="M14 1.86667C7.29894 1.86667 1.86667 7.29894 1.86667 14C1.86667 20.7011 7.29894 26.1333 14 26.1333C20.7011 26.1333 26.1333 20.7011 26.1333 14C26.1333 7.29894 20.7011 1.86667 14 1.86667ZM0 14C0 6.26801 6.26801 0 14 0C21.732 0 28 6.26801 28 14C28 21.732 21.732 28 14 28C6.26801 28 0 21.732 0 14Z" fill="black"/> <path fill-rule="evenodd" clip-rule="evenodd"
<path fill-rule="evenodd" clip-rule="evenodd" d="M14.4005 8.43719C13.7054 8.31795 12.9904 8.44859 12.3823 8.80597C11.7742 9.16335 11.3123 9.7244 11.0782 10.3898C10.9071 10.876 10.3743 11.1315 9.88803 10.9605C9.40177 10.7894 9.14625 10.2566 9.3173 9.77032C9.69765 8.68911 10.4484 7.77739 11.4365 7.19665C12.4247 6.61591 13.5864 6.40363 14.7161 6.5974C15.8458 6.79116 16.8704 7.37848 17.6085 8.25532C18.3465 9.13202 18.7505 10.2416 18.7489 11.3875C18.7485 13.1892 17.4095 14.4125 16.3733 15.1033C15.8267 15.4677 15.2868 15.737 14.8872 15.9146C14.686 16.004 14.5171 16.0716 14.3963 16.1176C14.3358 16.1407 14.2872 16.1584 14.2523 16.1708L14.2105 16.1854L14.1978 16.1898L14.1936 16.1912L14.192 16.1917C14.1917 16.1918 14.1908 16.1921 13.8956 15.3067L14.1908 16.1921C13.7017 16.3552 13.1732 16.0909 13.0102 15.6019C12.8473 15.1133 13.111 14.5853 13.5991 14.4217C13.5988 14.4218 13.5993 14.4216 13.5991 14.4217L13.6 14.4214L13.6032 14.4203L13.627 14.412C13.6495 14.404 13.6851 14.3911 13.7318 14.3733C13.8254 14.3376 13.9627 14.2828 14.1291 14.2088C14.4644 14.0598 14.9045 13.8391 15.3379 13.5501C16.2615 12.9344 16.8823 12.1979 16.8823 11.3867L16.8823 11.3853C16.8833 10.68 16.6347 9.99705 16.1805 9.45745C15.7263 8.91786 15.0957 8.55643 14.4005 8.43719Z" fill="black"/> d="M14 1.86667C7.29894 1.86667 1.86667 7.29894 1.86667 14C1.86667 20.7011 7.29894 26.1333 14 26.1333C20.7011 26.1333 26.1333 20.7011 26.1333 14C26.1333 7.29894 20.7011 1.86667 14 1.86667ZM0 14C0 6.26801 6.26801 0 14 0C21.732 0 28 6.26801 28 14C28 21.732 21.732 28 14 28C6.26801 28 0 21.732 0 14Z"
<path fill-rule="evenodd" clip-rule="evenodd" d="M13.0667 20.5333C13.0667 20.0178 13.4845 19.6 14 19.6H14.0131C14.5285 19.6 14.9464 20.0178 14.9464 20.5333C14.9464 21.0488 14.5285 21.4666 14.0131 21.4666H14C13.4845 21.4666 13.0667 21.0488 13.0667 20.5333Z" fill="black"/> fill="black" />
<path fill-rule="evenodd" clip-rule="evenodd"
d="M14.4005 8.43719C13.7054 8.31795 12.9904 8.44859 12.3823 8.80597C11.7742 9.16335 11.3123 9.7244 11.0782 10.3898C10.9071 10.876 10.3743 11.1315 9.88803 10.9605C9.40177 10.7894 9.14625 10.2566 9.3173 9.77032C9.69765 8.68911 10.4484 7.77739 11.4365 7.19665C12.4247 6.61591 13.5864 6.40363 14.7161 6.5974C15.8458 6.79116 16.8704 7.37848 17.6085 8.25532C18.3465 9.13202 18.7505 10.2416 18.7489 11.3875C18.7485 13.1892 17.4095 14.4125 16.3733 15.1033C15.8267 15.4677 15.2868 15.737 14.8872 15.9146C14.686 16.004 14.5171 16.0716 14.3963 16.1176C14.3358 16.1407 14.2872 16.1584 14.2523 16.1708L14.2105 16.1854L14.1978 16.1898L14.1936 16.1912L14.192 16.1917C14.1917 16.1918 14.1908 16.1921 13.8956 15.3067L14.1908 16.1921C13.7017 16.3552 13.1732 16.0909 13.0102 15.6019C12.8473 15.1133 13.111 14.5853 13.5991 14.4217C13.5988 14.4218 13.5993 14.4216 13.5991 14.4217L13.6 14.4214L13.6032 14.4203L13.627 14.412C13.6495 14.404 13.6851 14.3911 13.7318 14.3733C13.8254 14.3376 13.9627 14.2828 14.1291 14.2088C14.4644 14.0598 14.9045 13.8391 15.3379 13.5501C16.2615 12.9344 16.8823 12.1979 16.8823 11.3867L16.8823 11.3853C16.8833 10.68 16.6347 9.99705 16.1805 9.45745C15.7263 8.91786 15.0957 8.55643 14.4005 8.43719Z"
fill="black" />
<path fill-rule="evenodd" clip-rule="evenodd"
d="M13.0667 20.5333C13.0667 20.0178 13.4845 19.6 14 19.6H14.0131C14.5285 19.6 14.9464 20.0178 14.9464 20.5333C14.9464 21.0488 14.5285 21.4666 14.0131 21.4666H14C13.4845 21.4666 13.0667 21.0488 13.0667 20.5333Z"
fill="black" />
</svg> </svg>
</a> </a>
<div class="group relative cursor-pointer ml-[20px] mr-[35px] group [&_summary::-webkit-details-marker]:hidden"> <div
class="group relative cursor-pointer ml-[20px] mr-[35px] group [&_summary::-webkit-details-marker]:hidden">
<div class="relative flex"> <div class="relative flex">
<svg xmlns="http://www.w3.org/2000/svg" width="26" height="28" viewBox="0 0 26 28" fill="none"> <svg xmlns="http://www.w3.org/2000/svg" width="26" height="28" viewBox="0 0 26 28"
<path fill-rule="evenodd" clip-rule="evenodd" d="M12.6752 4.02515C11.6279 4.02515 10.5909 4.23143 9.62329 4.63221C8.65572 5.03299 7.77656 5.62042 7.03601 6.36097C6.29547 7.10152 5.70803 7.98067 5.30725 8.94825C4.90647 9.91582 4.70019 10.9529 4.70019 12.0001C4.70019 16.6158 3.73241 19.3956 2.80371 21.0002H22.5467C21.618 19.3956 20.6502 16.6158 20.6502 12.0001C20.6502 10.9529 20.4439 9.91582 20.0431 8.94825C19.6423 7.98067 19.0549 7.10152 18.3144 6.36097C17.5738 5.62042 16.6947 5.03299 15.7271 4.63221C14.7595 4.23143 13.7225 4.02515 12.6752 4.02515ZM8.85792 2.78445C10.0681 2.28316 11.3653 2.02515 12.6752 2.02515C13.9851 2.02515 15.2822 2.28316 16.4925 2.78445C17.7027 3.28574 18.8023 4.02049 19.7286 4.94676C20.6548 5.87302 21.3896 6.97266 21.8909 8.18288C22.3922 9.3931 22.6502 10.6902 22.6502 12.0001C22.6502 16.3335 23.557 18.7535 24.2781 19.9991L24.2787 20.0001C24.454 20.3037 24.5464 20.6479 24.5467 20.9984C24.547 21.3489 24.4552 21.6933 24.2805 21.9971C24.1058 22.3009 23.8543 22.5535 23.5512 22.7296C23.2482 22.9056 22.9042 22.9989 22.5537 23.0001L22.5502 23.0001H2.80019L2.79667 23.0001C2.4462 22.9989 2.1022 22.9056 1.79914 22.7296C1.49608 22.5535 1.2446 22.3009 1.0699 21.9971C0.895195 21.6933 0.803401 21.3489 0.803712 20.9984C0.804022 20.6479 0.896425 20.3037 1.07167 20.0001L1.07226 19.9991C1.79338 18.7535 2.70019 16.3335 2.70019 12.0001C2.70019 10.6902 2.9582 9.3931 3.45949 8.18288C3.96078 6.97266 4.69554 5.87302 5.6218 4.94676C6.54806 4.02049 7.6477 3.28574 8.85792 2.78445Z" fill="black"></path> fill="none">
<path fill-rule="evenodd" clip-rule="evenodd" d="M8.67529 21.0001C9.22758 21.0001 9.67529 21.4478 9.67529 22.0001V23.0001C9.67529 23.7958 9.99136 24.5588 10.554 25.1214C11.1166 25.6841 11.8796 26.0001 12.6753 26.0001C13.4709 26.0001 14.234 25.6841 14.7966 25.1214C15.3592 24.5588 15.6753 23.7958 15.6753 23.0001V22.0001C15.6753 21.4478 16.123 21.0001 16.6753 21.0001C17.2276 21.0001 17.6753 21.4478 17.6753 22.0001V23.0001C17.6753 24.3262 17.1485 25.598 16.2108 26.5357C15.2731 27.4733 14.0014 28.0001 12.6753 28.0001C11.3492 28.0001 10.0774 27.4733 9.13976 26.5357C8.20208 25.598 7.67529 24.3262 7.67529 23.0001V22.0001C7.67529 21.4478 8.12301 21.0001 8.67529 21.0001Z" fill="black"></path> <path fill-rule="evenodd" clip-rule="evenodd"
<path fill-rule="evenodd" clip-rule="evenodd" d="M18.7546 0.466336C19.0494 -0.000683993 19.667 -0.140291 20.134 0.154515C22.3252 1.5377 24.0937 3.497 25.2459 5.81797C25.4915 6.31265 25.2896 6.91275 24.7949 7.15833C24.3002 7.40391 23.7001 7.20197 23.4545 6.70729C22.4654 4.71495 20.9474 3.03308 19.0664 1.84574C18.5994 1.55094 18.4598 0.933356 18.7546 0.466336Z" fill="black"></path> d="M12.6752 4.02515C11.6279 4.02515 10.5909 4.23143 9.62329 4.63221C8.65572 5.03299 7.77656 5.62042 7.03601 6.36097C6.29547 7.10152 5.70803 7.98067 5.30725 8.94825C4.90647 9.91582 4.70019 10.9529 4.70019 12.0001C4.70019 16.6158 3.73241 19.3956 2.80371 21.0002H22.5467C21.618 19.3956 20.6502 16.6158 20.6502 12.0001C20.6502 10.9529 20.4439 9.91582 20.0431 8.94825C19.6423 7.98067 19.0549 7.10152 18.3144 6.36097C17.5738 5.62042 16.6947 5.03299 15.7271 4.63221C14.7595 4.23143 13.7225 4.02515 12.6752 4.02515ZM8.85792 2.78445C10.0681 2.28316 11.3653 2.02515 12.6752 2.02515C13.9851 2.02515 15.2822 2.28316 16.4925 2.78445C17.7027 3.28574 18.8023 4.02049 19.7286 4.94676C20.6548 5.87302 21.3896 6.97266 21.8909 8.18288C22.3922 9.3931 22.6502 10.6902 22.6502 12.0001C22.6502 16.3335 23.557 18.7535 24.2781 19.9991L24.2787 20.0001C24.454 20.3037 24.5464 20.6479 24.5467 20.9984C24.547 21.3489 24.4552 21.6933 24.2805 21.9971C24.1058 22.3009 23.8543 22.5535 23.5512 22.7296C23.2482 22.9056 22.9042 22.9989 22.5537 23.0001L22.5502 23.0001H2.80019L2.79667 23.0001C2.4462 22.9989 2.1022 22.9056 1.79914 22.7296C1.49608 22.5535 1.2446 22.3009 1.0699 21.9971C0.895195 21.6933 0.803401 21.3489 0.803712 20.9984C0.804022 20.6479 0.896425 20.3037 1.07167 20.0001L1.07226 19.9991C1.79338 18.7535 2.70019 16.3335 2.70019 12.0001C2.70019 10.6902 2.9582 9.3931 3.45949 8.18288C3.96078 6.97266 4.69554 5.87302 5.6218 4.94676C6.54806 4.02049 7.6477 3.28574 8.85792 2.78445Z"
<path fill-rule="evenodd" clip-rule="evenodd" d="M6.59584 0.466336C6.89064 0.933356 6.75103 1.55094 6.28401 1.84574C4.40308 3.03308 2.885 4.71495 1.89592 6.70729C1.65034 7.20197 1.05024 7.40391 0.555559 7.15833C0.0608782 6.91275 -0.141057 6.31265 0.104523 5.81797C1.25675 3.497 3.02523 1.5377 5.21643 0.154515C5.68345 -0.140291 6.30103 -0.000683993 6.59584 0.466336Z" fill="black"></path> fill="black"></path>
<path fill-rule="evenodd" clip-rule="evenodd"
d="M8.67529 21.0001C9.22758 21.0001 9.67529 21.4478 9.67529 22.0001V23.0001C9.67529 23.7958 9.99136 24.5588 10.554 25.1214C11.1166 25.6841 11.8796 26.0001 12.6753 26.0001C13.4709 26.0001 14.234 25.6841 14.7966 25.1214C15.3592 24.5588 15.6753 23.7958 15.6753 23.0001V22.0001C15.6753 21.4478 16.123 21.0001 16.6753 21.0001C17.2276 21.0001 17.6753 21.4478 17.6753 22.0001V23.0001C17.6753 24.3262 17.1485 25.598 16.2108 26.5357C15.2731 27.4733 14.0014 28.0001 12.6753 28.0001C11.3492 28.0001 10.0774 27.4733 9.13976 26.5357C8.20208 25.598 7.67529 24.3262 7.67529 23.0001V22.0001C7.67529 21.4478 8.12301 21.0001 8.67529 21.0001Z"
fill="black"></path>
<path fill-rule="evenodd" clip-rule="evenodd"
d="M18.7546 0.466336C19.0494 -0.000683993 19.667 -0.140291 20.134 0.154515C22.3252 1.5377 24.0937 3.497 25.2459 5.81797C25.4915 6.31265 25.2896 6.91275 24.7949 7.15833C24.3002 7.40391 23.7001 7.20197 23.4545 6.70729C22.4654 4.71495 20.9474 3.03308 19.0664 1.84574C18.5994 1.55094 18.4598 0.933356 18.7546 0.466336Z"
fill="black"></path>
<path fill-rule="evenodd" clip-rule="evenodd"
d="M6.59584 0.466336C6.89064 0.933356 6.75103 1.55094 6.28401 1.84574C4.40308 3.03308 2.885 4.71495 1.89592 6.70729C1.65034 7.20197 1.05024 7.40391 0.555559 7.15833C0.0608782 6.91275 -0.141057 6.31265 0.104523 5.81797C1.25675 3.497 3.02523 1.5377 5.21643 0.154515C5.68345 -0.140291 6.30103 -0.000683993 6.59584 0.466336Z"
fill="black"></path>
</svg> </svg>
<span class="absolute bg-[#E00000] font-[500] h-[17px] leading-[17px] note right-[-5px] rounded-lg text-[#fff] text-[13px] text-center top-[-3px] w-[17px]">0</span> <span
class="absolute bg-[#E00000] font-[500] h-[17px] leading-[17px] note right-[-5px] rounded-lg text-[#fff] text-[13px] text-center top-[-3px] w-[17px]">0</span>
</div> </div>
<div class="group-hover:opacity-[1] group-hover:z-[1] opacity-0 absolute bg-white leading-[30px] note-list shadow whitespace-nowrap z-[-1] rounded-[4px] right-[-10px]"> <div
class="group-hover:opacity-[1] group-hover:z-[1] opacity-0 absolute bg-white leading-[30px] note-list shadow whitespace-nowrap z-[-1] rounded-[4px] right-[-10px]">
<a href=""> Menu title </a> <a href=""> Menu title </a>
<a href=""> Menu title </a> <a href=""> Menu title </a>
<a href=""> Menu title </a> <a href=""> Menu title </a>
@@ -428,14 +469,18 @@
<div class="flex items-center"> <div class="flex items-center">
<p class="m-0 mr-[10px]"> ducdt@hurasoft.com </p> <p class="m-0 mr-[10px]"> ducdt@hurasoft.com </p>
<img src="https://via.placeholder.com/72x72" class="block rounded-[50%] w-[36px] h-[36px] mr-[8px]"/> <img src="https://via.placeholder.com/72x72"
class="block rounded-[50%] w-[36px] h-[36px] mr-[8px]" />
<svg xmlns="http://www.w3.org/2000/svg" width="8" height="6" viewBox="0 0 8 6" fill="none"> <svg xmlns="http://www.w3.org/2000/svg" width="8" height="6" viewBox="0 0 8 6" fill="none">
<path d="M4.00078 6C3.83058 5.99914 3.66272 5.96041 3.50935 5.88661C3.35599 5.81281 3.22098 5.7058 3.11411 5.57333L0.307445 2.17333C0.143441 1.96865 0.0402359 1.722 0.00958995 1.46151C-0.021056 1.20102 0.0220901 0.937162 0.134112 0.7C0.224965 0.493884 0.373227 0.318276 0.561191 0.194148C0.749155 0.0700212 0.968876 0.00262204 1.19411 0H6.80744C7.03268 0.00262204 7.2524 0.0700212 7.44037 0.194148C7.62833 0.318276 7.77659 0.493884 7.86744 0.7C7.97947 0.937162 8.02261 1.20102 7.99197 1.46151C7.96132 1.722 7.85812 1.96865 7.69411 2.17333L4.88744 5.57333C4.78058 5.7058 4.64557 5.81281 4.4922 5.88661C4.33884 5.96041 4.17097 5.99914 4.00078 6Z" fill="#C9C9C9"/> <path
d="M4.00078 6C3.83058 5.99914 3.66272 5.96041 3.50935 5.88661C3.35599 5.81281 3.22098 5.7058 3.11411 5.57333L0.307445 2.17333C0.143441 1.96865 0.0402359 1.722 0.00958995 1.46151C-0.021056 1.20102 0.0220901 0.937162 0.134112 0.7C0.224965 0.493884 0.373227 0.318276 0.561191 0.194148C0.749155 0.0700212 0.968876 0.00262204 1.19411 0H6.80744C7.03268 0.00262204 7.2524 0.0700212 7.44037 0.194148C7.62833 0.318276 7.77659 0.493884 7.86744 0.7C7.97947 0.937162 8.02261 1.20102 7.99197 1.46151C7.96132 1.722 7.85812 1.96865 7.69411 2.17333L4.88744 5.57333C4.78058 5.7058 4.64557 5.81281 4.4922 5.88661C4.33884 5.96041 4.17097 5.99914 4.00078 6Z"
fill="#C9C9C9" />
</svg> </svg>
</div> </div>
<div class="group-hover:opacity-[1] group-hover:z-[1] opacity-0 absolute bg-white leading-[30px] note-list shadow whitespace-nowrap z-[-1] rounded-[4px] right-0"> <div
class="group-hover:opacity-[1] group-hover:z-[1] opacity-0 absolute bg-white leading-[30px] note-list shadow whitespace-nowrap z-[-1] rounded-[4px] right-0">
<a href="">Đổi mật khẩu</a> <a href="">Đổi mật khẩu</a>
<a href="">Thoát quản trị</a> <a href="">Thoát quản trị</a>
</div> </div>
@@ -447,13 +492,21 @@
<div class="content-holder gap-[16px] max-[1620px]:gap-[10px] grid grid-cols-10"> <div class="content-holder gap-[16px] max-[1620px]:gap-[10px] grid grid-cols-10">
<!-- col-left --> <!-- col-left -->
<div class="col-span-7 grid grid-cols-4 max-[1620px]:gap-[10px] gap-[16px]"> <div class="col-span-7 grid grid-cols-4 max-[1620px]:gap-[10px] gap-[16px]">
<div class="bg-white rounded-[10px] shadow-[0px_1px_1px_0px_rgba(0,0,0,0.10)] transition duration-300 hover:shadow-[0px_1px_5px_0px_rgba(0,0,0,0.20)]"> <div
class="bg-white rounded-[10px] shadow-[0px_1px_1px_0px_rgba(0,0,0,0.10)] transition duration-300 hover:shadow-[0px_1px_5px_0px_rgba(0,0,0,0.20)]">
<div class="border-b border-b-[#FAFAFB] p-[10px_10px_15px_13px]"> <div class="border-b border-b-[#FAFAFB] p-[10px_10px_15px_13px]">
<div class="flex justify-between leading-[16px] min-h-[32px]"> <div class="flex justify-between leading-[16px] min-h-[32px]">
<p class="mr-[10px] w-[calc(100%-36px)] text-[#B1B1B1] text-[12px] uppercase">Đơn hàng mới</p> <p class="mr-[10px] w-[calc(100%-36px)] text-[#B1B1B1] text-[12px] uppercase">Đơn hàng
mới</p>
<a href="" class="bg-[#F0F8FF] flex h-[26px] items-center justify-center rounded-[4px] text-center w-[26px]"> <a href=""
<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 14 14" fill="none"> <path fill-rule="evenodd" clip-rule="evenodd" d="M0 0.777778C0 0.348223 0.348223 0 0.777778 0H2.16049C2.53125 0 2.85046 0.261691 2.92317 0.625243L3.07466 1.38272H13.2222C13.4918 1.38272 13.7421 1.52229 13.8838 1.75159C14.0256 1.98089 14.0384 2.26722 13.9179 2.50833L11.1525 8.03919C11.0207 8.30269 10.7514 8.46914 10.4568 8.46914H3.86538L2.65551 9.67901H10.4568C11.65 9.67901 12.6173 10.6463 12.6173 11.8395C12.6173 13.0327 11.65 14 10.4568 14C9.26356 14 8.2963 13.0327 8.2963 11.8395C8.2963 11.6295 8.32625 11.4265 8.38213 11.2346H5.61787C5.67375 11.4265 5.7037 11.6295 5.7037 11.8395C5.7037 13.0327 4.73641 14 3.54321 14C2.35001 14 1.38272 13.0327 1.38272 11.8395C1.38272 11.5231 1.45075 11.2225 1.57298 10.9517C0.903709 10.4543 0.723772 9.41089 1.40802 8.72661L2.6989 7.43572L1.52287 1.55556H0.777778C0.348223 1.55556 0 1.20733 0 0.777778ZM4.18084 6.91358H9.9761L11.9638 2.93827H3.38577L4.18084 6.91358ZM3.54321 11.2346C3.2091 11.2346 2.93827 11.5054 2.93827 11.8395C2.93827 12.1736 3.2091 12.4444 3.54321 12.4444C3.87732 12.4444 4.14815 12.1736 4.14815 11.8395C4.14815 11.5054 3.87732 11.2346 3.54321 11.2346ZM10.4568 11.2346C10.1227 11.2346 9.85185 11.5054 9.85185 11.8395C9.85185 12.1736 10.1227 12.4444 10.4568 12.4444C10.7909 12.4444 11.0617 12.1736 11.0617 11.8395C11.0617 11.5054 10.7909 11.2346 10.4568 11.2346Z" fill="#0041E8"></path> </svg> class="bg-[#F0F8FF] flex h-[26px] items-center justify-center rounded-[4px] text-center w-[26px]">
<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 14 14"
fill="none">
<path fill-rule="evenodd" clip-rule="evenodd"
d="M0 0.777778C0 0.348223 0.348223 0 0.777778 0H2.16049C2.53125 0 2.85046 0.261691 2.92317 0.625243L3.07466 1.38272H13.2222C13.4918 1.38272 13.7421 1.52229 13.8838 1.75159C14.0256 1.98089 14.0384 2.26722 13.9179 2.50833L11.1525 8.03919C11.0207 8.30269 10.7514 8.46914 10.4568 8.46914H3.86538L2.65551 9.67901H10.4568C11.65 9.67901 12.6173 10.6463 12.6173 11.8395C12.6173 13.0327 11.65 14 10.4568 14C9.26356 14 8.2963 13.0327 8.2963 11.8395C8.2963 11.6295 8.32625 11.4265 8.38213 11.2346H5.61787C5.67375 11.4265 5.7037 11.6295 5.7037 11.8395C5.7037 13.0327 4.73641 14 3.54321 14C2.35001 14 1.38272 13.0327 1.38272 11.8395C1.38272 11.5231 1.45075 11.2225 1.57298 10.9517C0.903709 10.4543 0.723772 9.41089 1.40802 8.72661L2.6989 7.43572L1.52287 1.55556H0.777778C0.348223 1.55556 0 1.20733 0 0.777778ZM4.18084 6.91358H9.9761L11.9638 2.93827H3.38577L4.18084 6.91358ZM3.54321 11.2346C3.2091 11.2346 2.93827 11.5054 2.93827 11.8395C2.93827 12.1736 3.2091 12.4444 3.54321 12.4444C3.87732 12.4444 4.14815 12.1736 4.14815 11.8395C4.14815 11.5054 3.87732 11.2346 3.54321 11.2346ZM10.4568 11.2346C10.1227 11.2346 9.85185 11.5054 9.85185 11.8395C9.85185 12.1736 10.1227 12.4444 10.4568 12.4444C10.7909 12.4444 11.0617 12.1736 11.0617 11.8395C11.0617 11.5054 10.7909 11.2346 10.4568 11.2346Z"
fill="#0041E8"></path>
</svg>
</a> </a>
</div> </div>
@@ -461,8 +514,14 @@
</div> </div>
<div class="flex items-center p-[8px_13px]"> <div class="flex items-center p-[8px_13px]">
<div class="bg-[#E8F7F2] bg-green-100 flex font-[700] inline-flex items-center leading-[24px] mr-[10px] px-[5px] rounded-[4px] text-[#299D00] text-[14px]"> <div
<svg xmlns="http://www.w3.org/2000/svg" width="14" height="8" viewBox="0 0 14 8" fill="none" class="mr-[2px]"><path fill-rule="evenodd" clip-rule="evenodd" d="M7.33333 1.33333C6.96514 1.33333 6.66667 1.03486 6.66667 0.666667C6.66667 0.298477 6.96514 0 7.33333 0H12.6667C13.0349 0 13.3333 0.298477 13.3333 0.666667V6C13.3333 6.36819 13.0349 6.66667 12.6667 6.66667C12.2985 6.66667 12 6.36819 12 6V2.27614L7.80474 6.4714C7.67971 6.59643 7.51014 6.66667 7.33333 6.66667C7.15652 6.66667 6.98695 6.59643 6.86193 6.4714L4.66667 4.27614L1.13807 7.80474C0.877722 8.06509 0.455612 8.06509 0.195262 7.80474C-0.0650874 7.54439 -0.0650874 7.12228 0.195262 6.86193L4.19526 2.86193C4.32029 2.7369 4.48985 2.66667 4.66667 2.66667C4.84348 2.66667 5.01305 2.7369 5.13807 2.86193L7.33333 5.05719L11.0572 1.33333H7.33333Z" fill="#299D00"></path></svg> class="bg-[#E8F7F2] bg-green-100 flex font-[700] inline-flex items-center leading-[24px] mr-[10px] px-[5px] rounded-[4px] text-[#299D00] text-[14px]">
<svg xmlns="http://www.w3.org/2000/svg" width="14" height="8" viewBox="0 0 14 8"
fill="none" class="mr-[2px]">
<path fill-rule="evenodd" clip-rule="evenodd"
d="M7.33333 1.33333C6.96514 1.33333 6.66667 1.03486 6.66667 0.666667C6.66667 0.298477 6.96514 0 7.33333 0H12.6667C13.0349 0 13.3333 0.298477 13.3333 0.666667V6C13.3333 6.36819 13.0349 6.66667 12.6667 6.66667C12.2985 6.66667 12 6.36819 12 6V2.27614L7.80474 6.4714C7.67971 6.59643 7.51014 6.66667 7.33333 6.66667C7.15652 6.66667 6.98695 6.59643 6.86193 6.4714L4.66667 4.27614L1.13807 7.80474C0.877722 8.06509 0.455612 8.06509 0.195262 7.80474C-0.0650874 7.54439 -0.0650874 7.12228 0.195262 6.86193L4.19526 2.86193C4.32029 2.7369 4.48985 2.66667 4.66667 2.66667C4.84348 2.66667 5.01305 2.7369 5.13807 2.86193L7.33333 5.05719L11.0572 1.33333H7.33333Z"
fill="#299D00"></path>
</svg>
<b class="font-[700]"> 10% </b> <b class="font-[700]"> 10% </b>
</div> </div>
@@ -470,13 +529,21 @@
</div> </div>
</div> </div>
<div class="bg-white rounded-[10px] shadow-[0px_1px_1px_0px_rgba(0,0,0,0.10)] transition duration-300 hover:shadow-[0px_1px_5px_0px_rgba(0,0,0,0.20)]"> <div
class="bg-white rounded-[10px] shadow-[0px_1px_1px_0px_rgba(0,0,0,0.10)] transition duration-300 hover:shadow-[0px_1px_5px_0px_rgba(0,0,0,0.20)]">
<div class="border-b border-b-[#FAFAFB] p-[10px_10px_15px_13px]"> <div class="border-b border-b-[#FAFAFB] p-[10px_10px_15px_13px]">
<div class="flex justify-between leading-[16px] min-h-[32px]"> <div class="flex justify-between leading-[16px] min-h-[32px]">
<p class="w-[calc(100%-36px)] mr-[10px] text-[#B1B1B1] text-[12px] uppercase">Khách hàng liên hệ qua website</p> <p class="w-[calc(100%-36px)] mr-[10px] text-[#B1B1B1] text-[12px] uppercase">Khách hàng
liên hệ qua website</p>
<a href="" class="bg-[#F0F9F2] flex h-[26px] items-center justify-center rounded-[4px] text-center w-[26px]"> <a href=""
<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 14 14" fill="none"> <path fill-rule="evenodd" clip-rule="evenodd" d="M4.92593 1.55556C3.82817 1.55556 2.93827 2.44546 2.93827 3.54321C2.93827 4.64096 3.82817 5.53086 4.92593 5.53086C6.02366 5.53086 6.91358 4.64096 6.91358 3.54321C6.91358 2.44546 6.02366 1.55556 4.92593 1.55556ZM1.38272 3.54321C1.38272 1.58635 2.96906 0 4.92593 0C6.88275 0 8.46914 1.58634 8.46914 3.54321C8.46914 5.50008 6.88275 7.08642 4.92593 7.08642C2.96906 7.08642 1.38272 5.50007 1.38272 3.54321ZM11.1481 4.14815C11.5777 4.14815 11.9259 4.49637 11.9259 4.92593V6.22222H13.2222C13.6518 6.22222 14 6.57045 14 7C14 7.42956 13.6518 7.77778 13.2222 7.77778H11.9259V9.07407C11.9259 9.50363 11.5777 9.85185 11.1481 9.85185C10.7186 9.85185 10.3704 9.50363 10.3704 9.07407V7.77778H9.07407C8.64452 7.77778 8.2963 7.42956 8.2963 7C8.2963 6.57045 8.64452 6.22222 9.07407 6.22222H10.3704V4.92593C10.3704 4.49637 10.7186 4.14815 11.1481 4.14815ZM1.55664 12.4444H8.29521C8.24937 10.623 6.75843 9.16049 4.92593 9.16049C3.09341 9.16049 1.60249 10.623 1.55664 12.4444ZM0 12.5309C0 9.81036 2.20541 7.60494 4.92593 7.60494C7.64643 7.60494 9.85185 9.81036 9.85185 12.5309V13.2222C9.85185 13.6518 9.50363 14 9.07407 14H0.777778C0.348223 14 0 13.6518 0 13.2222V12.5309Z" fill="#299D00"/> </svg> class="bg-[#F0F9F2] flex h-[26px] items-center justify-center rounded-[4px] text-center w-[26px]">
<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 14 14"
fill="none">
<path fill-rule="evenodd" clip-rule="evenodd"
d="M4.92593 1.55556C3.82817 1.55556 2.93827 2.44546 2.93827 3.54321C2.93827 4.64096 3.82817 5.53086 4.92593 5.53086C6.02366 5.53086 6.91358 4.64096 6.91358 3.54321C6.91358 2.44546 6.02366 1.55556 4.92593 1.55556ZM1.38272 3.54321C1.38272 1.58635 2.96906 0 4.92593 0C6.88275 0 8.46914 1.58634 8.46914 3.54321C8.46914 5.50008 6.88275 7.08642 4.92593 7.08642C2.96906 7.08642 1.38272 5.50007 1.38272 3.54321ZM11.1481 4.14815C11.5777 4.14815 11.9259 4.49637 11.9259 4.92593V6.22222H13.2222C13.6518 6.22222 14 6.57045 14 7C14 7.42956 13.6518 7.77778 13.2222 7.77778H11.9259V9.07407C11.9259 9.50363 11.5777 9.85185 11.1481 9.85185C10.7186 9.85185 10.3704 9.50363 10.3704 9.07407V7.77778H9.07407C8.64452 7.77778 8.2963 7.42956 8.2963 7C8.2963 6.57045 8.64452 6.22222 9.07407 6.22222H10.3704V4.92593C10.3704 4.49637 10.7186 4.14815 11.1481 4.14815ZM1.55664 12.4444H8.29521C8.24937 10.623 6.75843 9.16049 4.92593 9.16049C3.09341 9.16049 1.60249 10.623 1.55664 12.4444ZM0 12.5309C0 9.81036 2.20541 7.60494 4.92593 7.60494C7.64643 7.60494 9.85185 9.81036 9.85185 12.5309V13.2222C9.85185 13.6518 9.50363 14 9.07407 14H0.777778C0.348223 14 0 13.6518 0 13.2222V12.5309Z"
fill="#299D00" />
</svg>
</a> </a>
</div> </div>
@@ -484,8 +551,14 @@
</div> </div>
<div class="flex items-center p-[8px_13px]"> <div class="flex items-center p-[8px_13px]">
<div class="bg-[#E8F7F2] bg-green-100 flex font-[700] inline-flex items-center leading-[24px] mr-[10px] px-[5px] rounded-[4px] text-[#299D00] text-[14px]"> <div
<svg xmlns="http://www.w3.org/2000/svg" width="14" height="8" viewBox="0 0 14 8" fill="none" class="mr-[2px]"><path fill-rule="evenodd" clip-rule="evenodd" d="M7.33333 1.33333C6.96514 1.33333 6.66667 1.03486 6.66667 0.666667C6.66667 0.298477 6.96514 0 7.33333 0H12.6667C13.0349 0 13.3333 0.298477 13.3333 0.666667V6C13.3333 6.36819 13.0349 6.66667 12.6667 6.66667C12.2985 6.66667 12 6.36819 12 6V2.27614L7.80474 6.4714C7.67971 6.59643 7.51014 6.66667 7.33333 6.66667C7.15652 6.66667 6.98695 6.59643 6.86193 6.4714L4.66667 4.27614L1.13807 7.80474C0.877722 8.06509 0.455612 8.06509 0.195262 7.80474C-0.0650874 7.54439 -0.0650874 7.12228 0.195262 6.86193L4.19526 2.86193C4.32029 2.7369 4.48985 2.66667 4.66667 2.66667C4.84348 2.66667 5.01305 2.7369 5.13807 2.86193L7.33333 5.05719L11.0572 1.33333H7.33333Z" fill="#299D00"></path></svg> class="bg-[#E8F7F2] bg-green-100 flex font-[700] inline-flex items-center leading-[24px] mr-[10px] px-[5px] rounded-[4px] text-[#299D00] text-[14px]">
<svg xmlns="http://www.w3.org/2000/svg" width="14" height="8" viewBox="0 0 14 8"
fill="none" class="mr-[2px]">
<path fill-rule="evenodd" clip-rule="evenodd"
d="M7.33333 1.33333C6.96514 1.33333 6.66667 1.03486 6.66667 0.666667C6.66667 0.298477 6.96514 0 7.33333 0H12.6667C13.0349 0 13.3333 0.298477 13.3333 0.666667V6C13.3333 6.36819 13.0349 6.66667 12.6667 6.66667C12.2985 6.66667 12 6.36819 12 6V2.27614L7.80474 6.4714C7.67971 6.59643 7.51014 6.66667 7.33333 6.66667C7.15652 6.66667 6.98695 6.59643 6.86193 6.4714L4.66667 4.27614L1.13807 7.80474C0.877722 8.06509 0.455612 8.06509 0.195262 7.80474C-0.0650874 7.54439 -0.0650874 7.12228 0.195262 6.86193L4.19526 2.86193C4.32029 2.7369 4.48985 2.66667 4.66667 2.66667C4.84348 2.66667 5.01305 2.7369 5.13807 2.86193L7.33333 5.05719L11.0572 1.33333H7.33333Z"
fill="#299D00"></path>
</svg>
<b class="font-[700]"> 10% </b> <b class="font-[700]"> 10% </b>
</div> </div>
@@ -493,13 +566,21 @@
</div> </div>
</div> </div>
<div class="bg-white rounded-[10px] shadow-[0px_1px_1px_0px_rgba(0,0,0,0.10)] transition duration-300 hover:shadow-[0px_1px_5px_0px_rgba(0,0,0,0.20)]"> <div
class="bg-white rounded-[10px] shadow-[0px_1px_1px_0px_rgba(0,0,0,0.10)] transition duration-300 hover:shadow-[0px_1px_5px_0px_rgba(0,0,0,0.20)]">
<div class="border-b border-b-[#FAFAFB] p-[10px_10px_15px_13px]"> <div class="border-b border-b-[#FAFAFB] p-[10px_10px_15px_13px]">
<div class="flex justify-between leading-[16px] min-h-[32px]"> <div class="flex justify-between leading-[16px] min-h-[32px]">
<p class="w-[calc(100%-36px)] mr-[10px] text-[#B1B1B1] text-[12px] uppercase">Đơn trả góp</p> <p class="w-[calc(100%-36px)] mr-[10px] text-[#B1B1B1] text-[12px] uppercase">Đơn trả
góp</p>
<a href="" class="bg-[#F7F5FF] flex h-[26px] items-center justify-center rounded-[4px] text-center w-[26px]"> <a href=""
<svg xmlns="http://www.w3.org/2000/svg" width="18" height="14" viewBox="0 0 18 14" fill="none"> <path fill-rule="evenodd" clip-rule="evenodd" d="M0 3.44444C0 1.54213 1.54213 0 3.44444 0H14.1111C16.0135 0 17.5556 1.54214 17.5556 3.44444V10.5556C17.5556 12.4579 16.0135 14 14.1111 14H3.44444C1.54214 14 0 12.4579 0 10.5556V3.44444ZM1.55556 6V10.5556C1.55556 11.5988 2.40124 12.4444 3.44444 12.4444H14.1111C15.1544 12.4444 16 11.5988 16 10.5556V6H1.55556ZM16 4.44444H1.55556V3.44444C1.55556 2.40124 2.40124 1.55556 3.44444 1.55556H14.1111C15.1543 1.55556 16 2.40124 16 3.44444V4.44444ZM3.55556 9.66667C3.55556 9.23711 3.90378 8.88889 4.33333 8.88889H5.22222C5.65178 8.88889 6 9.23711 6 9.66667C6 10.0962 5.65178 10.4444 5.22222 10.4444H4.33333C3.90378 10.4444 3.55556 10.0962 3.55556 9.66667ZM8 9.66667C8 9.23711 8.34822 8.88889 8.77778 8.88889H9.66667C10.0962 8.88889 10.4444 9.23711 10.4444 9.66667C10.4444 10.0962 10.0962 10.4444 9.66667 10.4444H8.77778C8.34822 10.4444 8 10.0962 8 9.66667Z" fill="#5A00ED"/> </svg> class="bg-[#F7F5FF] flex h-[26px] items-center justify-center rounded-[4px] text-center w-[26px]">
<svg xmlns="http://www.w3.org/2000/svg" width="18" height="14" viewBox="0 0 18 14"
fill="none">
<path fill-rule="evenodd" clip-rule="evenodd"
d="M0 3.44444C0 1.54213 1.54213 0 3.44444 0H14.1111C16.0135 0 17.5556 1.54214 17.5556 3.44444V10.5556C17.5556 12.4579 16.0135 14 14.1111 14H3.44444C1.54214 14 0 12.4579 0 10.5556V3.44444ZM1.55556 6V10.5556C1.55556 11.5988 2.40124 12.4444 3.44444 12.4444H14.1111C15.1544 12.4444 16 11.5988 16 10.5556V6H1.55556ZM16 4.44444H1.55556V3.44444C1.55556 2.40124 2.40124 1.55556 3.44444 1.55556H14.1111C15.1543 1.55556 16 2.40124 16 3.44444V4.44444ZM3.55556 9.66667C3.55556 9.23711 3.90378 8.88889 4.33333 8.88889H5.22222C5.65178 8.88889 6 9.23711 6 9.66667C6 10.0962 5.65178 10.4444 5.22222 10.4444H4.33333C3.90378 10.4444 3.55556 10.0962 3.55556 9.66667ZM8 9.66667C8 9.23711 8.34822 8.88889 8.77778 8.88889H9.66667C10.0962 8.88889 10.4444 9.23711 10.4444 9.66667C10.4444 10.0962 10.0962 10.4444 9.66667 10.4444H8.77778C8.34822 10.4444 8 10.0962 8 9.66667Z"
fill="#5A00ED" />
</svg>
</a> </a>
</div> </div>
@@ -507,8 +588,14 @@
</div> </div>
<div class="flex items-center p-[8px_13px]"> <div class="flex items-center p-[8px_13px]">
<div class="bg-[#FFEEEB] bg-[red]-100 flex font-[700] inline-flex items-center leading-[24px] mr-[10px] px-[5px] rounded-[4px] text-[#E00000] text-[14px]"> <div
<svg class="mr-[2px]" xmlns="http://www.w3.org/2000/svg" width="14" height="8" viewBox="0 0 14 8" fill="none"> <path fill-rule="evenodd" clip-rule="evenodd" d="M0.167368 0.167368C0.390524 -0.0557892 0.752333 -0.0557892 0.97549 0.167368L4.68571 3.87759L7.02451 1.5388C7.13167 1.43163 7.27702 1.37143 7.42857 1.37143C7.58012 1.37143 7.72547 1.43163 7.83263 1.5388L12.3429 6.04902V1.94286C12.3429 1.62727 12.5987 1.37143 12.9143 1.37143C13.2299 1.37143 13.4857 1.62727 13.4857 1.94286V7.42857C13.4857 7.74416 13.2299 8 12.9143 8H7.42857C7.11298 8 6.85714 7.74416 6.85714 7.42857C6.85714 7.11298 7.11298 6.85714 7.42857 6.85714H11.5347L7.42857 2.75098L5.08977 5.08978C4.98261 5.19694 4.83727 5.25714 4.68571 5.25714C4.53416 5.25714 4.38882 5.19694 4.28165 5.08978L0.167368 0.97549C-0.0557892 0.752333 -0.0557892 0.390524 0.167368 0.167368Z" fill="#E00000"/> </svg> class="bg-[#FFEEEB] bg-[red]-100 flex font-[700] inline-flex items-center leading-[24px] mr-[10px] px-[5px] rounded-[4px] text-[#E00000] text-[14px]">
<svg class="mr-[2px]" xmlns="http://www.w3.org/2000/svg" width="14" height="8"
viewBox="0 0 14 8" fill="none">
<path fill-rule="evenodd" clip-rule="evenodd"
d="M0.167368 0.167368C0.390524 -0.0557892 0.752333 -0.0557892 0.97549 0.167368L4.68571 3.87759L7.02451 1.5388C7.13167 1.43163 7.27702 1.37143 7.42857 1.37143C7.58012 1.37143 7.72547 1.43163 7.83263 1.5388L12.3429 6.04902V1.94286C12.3429 1.62727 12.5987 1.37143 12.9143 1.37143C13.2299 1.37143 13.4857 1.62727 13.4857 1.94286V7.42857C13.4857 7.74416 13.2299 8 12.9143 8H7.42857C7.11298 8 6.85714 7.74416 6.85714 7.42857C6.85714 7.11298 7.11298 6.85714 7.42857 6.85714H11.5347L7.42857 2.75098L5.08977 5.08978C4.98261 5.19694 4.83727 5.25714 4.68571 5.25714C4.53416 5.25714 4.38882 5.19694 4.28165 5.08978L0.167368 0.97549C-0.0557892 0.752333 -0.0557892 0.390524 0.167368 0.167368Z"
fill="#E00000" />
</svg>
<b class="font-[700]"> 10% </b> <b class="font-[700]"> 10% </b>
</div> </div>
@@ -516,13 +603,21 @@
</div> </div>
</div> </div>
<div class="bg-white rounded-[10px] shadow-[0px_1px_1px_0px_rgba(0,0,0,0.10)] transition duration-300 hover:shadow-[0px_1px_5px_0px_rgba(0,0,0,0.20)]"> <div
class="bg-white rounded-[10px] shadow-[0px_1px_1px_0px_rgba(0,0,0,0.10)] transition duration-300 hover:shadow-[0px_1px_5px_0px_rgba(0,0,0,0.20)]">
<div class="border-b border-b-[#FAFAFB] p-[10px_10px_15px_13px]"> <div class="border-b border-b-[#FAFAFB] p-[10px_10px_15px_13px]">
<div class="flex justify-between leading-[16px] min-h-[32px]"> <div class="flex justify-between leading-[16px] min-h-[32px]">
<p class="w-[calc(100%-36px)] mr-[10px] text-[#B1B1B1] text-[12px] uppercase">Đơn hoàn trả</p> <p class="w-[calc(100%-36px)] mr-[10px] text-[#B1B1B1] text-[12px] uppercase">Đơn hoàn
trả</p>
<a href="" class="bg-[#F9F2F2] flex h-[26px] items-center justify-center rounded-[4px] text-center w-[26px]"> <a href=""
<svg xmlns="http://www.w3.org/2000/svg" width="13" height="14" viewBox="0 0 13 14" fill="none"> <path fill-rule="evenodd" clip-rule="evenodd" d="M4.92593 1.55556C4.59183 1.55556 4.32099 1.8264 4.32099 2.16049C4.32099 2.49459 4.59183 2.76543 4.92593 2.76543H6.30864C6.64275 2.76543 6.91358 2.4946 6.91358 2.16049C6.91358 1.82639 6.64275 1.55556 6.30864 1.55556H4.92593ZM2.90966 1.38272C3.22191 0.573817 4.00691 0 4.92593 0H6.30864C7.22768 0 8.01267 0.57382 8.32491 1.38272H9.07407C10.2673 1.38272 11.2346 2.35001 11.2346 3.54321V5.61728C11.2346 6.04684 10.8863 6.39506 10.4568 6.39506C10.0272 6.39506 9.67901 6.04684 9.67901 5.61728V3.54321C9.67901 3.2091 9.40819 2.93827 9.07407 2.93827H8.32491C8.01267 3.74717 7.22768 4.32099 6.30864 4.32099H4.92593C4.00691 4.32099 3.22191 3.74717 2.90966 2.93827H2.16049C1.8264 2.93827 1.55556 3.20911 1.55556 3.54321V11.8395C1.55556 12.1736 1.82639 12.4444 2.16049 12.4444H9.07407C9.40819 12.4444 9.67901 12.1736 9.67901 11.8395V11.1481C9.67901 10.7186 10.0272 10.3704 10.4568 10.3704C10.8863 10.3704 11.2346 10.7186 11.2346 11.1481V11.8395C11.2346 13.0327 10.2673 14 9.07407 14H2.16049C0.967293 14 0 13.0327 0 11.8395V3.54321C0 2.35 0.967285 1.38272 2.16049 1.38272H2.90966ZM7.54997 5.75867C7.85371 6.06241 7.85371 6.55487 7.54997 6.85861L6.80365 7.60494H11.8395C12.2691 7.60494 12.6173 7.95316 12.6173 8.38272C12.6173 8.81227 12.2691 9.16049 11.8395 9.16049H6.80365L7.54997 9.90682C7.85371 10.2106 7.85371 10.703 7.54997 11.0068C7.24623 11.3105 6.75377 11.3105 6.45003 11.0068L4.37595 8.93269C4.07221 8.62895 4.07221 8.13649 4.37595 7.83274L6.45003 5.75867C6.75377 5.45493 7.24623 5.45493 7.54997 5.75867Z" fill="#E00000"/> </svg> class="bg-[#F9F2F2] flex h-[26px] items-center justify-center rounded-[4px] text-center w-[26px]">
<svg xmlns="http://www.w3.org/2000/svg" width="13" height="14" viewBox="0 0 13 14"
fill="none">
<path fill-rule="evenodd" clip-rule="evenodd"
d="M4.92593 1.55556C4.59183 1.55556 4.32099 1.8264 4.32099 2.16049C4.32099 2.49459 4.59183 2.76543 4.92593 2.76543H6.30864C6.64275 2.76543 6.91358 2.4946 6.91358 2.16049C6.91358 1.82639 6.64275 1.55556 6.30864 1.55556H4.92593ZM2.90966 1.38272C3.22191 0.573817 4.00691 0 4.92593 0H6.30864C7.22768 0 8.01267 0.57382 8.32491 1.38272H9.07407C10.2673 1.38272 11.2346 2.35001 11.2346 3.54321V5.61728C11.2346 6.04684 10.8863 6.39506 10.4568 6.39506C10.0272 6.39506 9.67901 6.04684 9.67901 5.61728V3.54321C9.67901 3.2091 9.40819 2.93827 9.07407 2.93827H8.32491C8.01267 3.74717 7.22768 4.32099 6.30864 4.32099H4.92593C4.00691 4.32099 3.22191 3.74717 2.90966 2.93827H2.16049C1.8264 2.93827 1.55556 3.20911 1.55556 3.54321V11.8395C1.55556 12.1736 1.82639 12.4444 2.16049 12.4444H9.07407C9.40819 12.4444 9.67901 12.1736 9.67901 11.8395V11.1481C9.67901 10.7186 10.0272 10.3704 10.4568 10.3704C10.8863 10.3704 11.2346 10.7186 11.2346 11.1481V11.8395C11.2346 13.0327 10.2673 14 9.07407 14H2.16049C0.967293 14 0 13.0327 0 11.8395V3.54321C0 2.35 0.967285 1.38272 2.16049 1.38272H2.90966ZM7.54997 5.75867C7.85371 6.06241 7.85371 6.55487 7.54997 6.85861L6.80365 7.60494H11.8395C12.2691 7.60494 12.6173 7.95316 12.6173 8.38272C12.6173 8.81227 12.2691 9.16049 11.8395 9.16049H6.80365L7.54997 9.90682C7.85371 10.2106 7.85371 10.703 7.54997 11.0068C7.24623 11.3105 6.75377 11.3105 6.45003 11.0068L4.37595 8.93269C4.07221 8.62895 4.07221 8.13649 4.37595 7.83274L6.45003 5.75867C6.75377 5.45493 7.24623 5.45493 7.54997 5.75867Z"
fill="#E00000" />
</svg>
</a> </a>
</div> </div>
@@ -530,8 +625,14 @@
</div> </div>
<div class="flex items-center p-[8px_13px]"> <div class="flex items-center p-[8px_13px]">
<div class="bg-[#FFEEEB] bg-[red]-100 flex font-[700] inline-flex items-center leading-[24px] mr-[10px] px-[5px] rounded-[4px] text-[#E00000] text-[14px]"> <div
<svg class="mr-[2px]" xmlns="http://www.w3.org/2000/svg" width="14" height="8" viewBox="0 0 14 8" fill="none"> <path fill-rule="evenodd" clip-rule="evenodd" d="M0.167368 0.167368C0.390524 -0.0557892 0.752333 -0.0557892 0.97549 0.167368L4.68571 3.87759L7.02451 1.5388C7.13167 1.43163 7.27702 1.37143 7.42857 1.37143C7.58012 1.37143 7.72547 1.43163 7.83263 1.5388L12.3429 6.04902V1.94286C12.3429 1.62727 12.5987 1.37143 12.9143 1.37143C13.2299 1.37143 13.4857 1.62727 13.4857 1.94286V7.42857C13.4857 7.74416 13.2299 8 12.9143 8H7.42857C7.11298 8 6.85714 7.74416 6.85714 7.42857C6.85714 7.11298 7.11298 6.85714 7.42857 6.85714H11.5347L7.42857 2.75098L5.08977 5.08978C4.98261 5.19694 4.83727 5.25714 4.68571 5.25714C4.53416 5.25714 4.38882 5.19694 4.28165 5.08978L0.167368 0.97549C-0.0557892 0.752333 -0.0557892 0.390524 0.167368 0.167368Z" fill="#E00000"/> </svg> class="bg-[#FFEEEB] bg-[red]-100 flex font-[700] inline-flex items-center leading-[24px] mr-[10px] px-[5px] rounded-[4px] text-[#E00000] text-[14px]">
<svg class="mr-[2px]" xmlns="http://www.w3.org/2000/svg" width="14" height="8"
viewBox="0 0 14 8" fill="none">
<path fill-rule="evenodd" clip-rule="evenodd"
d="M0.167368 0.167368C0.390524 -0.0557892 0.752333 -0.0557892 0.97549 0.167368L4.68571 3.87759L7.02451 1.5388C7.13167 1.43163 7.27702 1.37143 7.42857 1.37143C7.58012 1.37143 7.72547 1.43163 7.83263 1.5388L12.3429 6.04902V1.94286C12.3429 1.62727 12.5987 1.37143 12.9143 1.37143C13.2299 1.37143 13.4857 1.62727 13.4857 1.94286V7.42857C13.4857 7.74416 13.2299 8 12.9143 8H7.42857C7.11298 8 6.85714 7.74416 6.85714 7.42857C6.85714 7.11298 7.11298 6.85714 7.42857 6.85714H11.5347L7.42857 2.75098L5.08977 5.08978C4.98261 5.19694 4.83727 5.25714 4.68571 5.25714C4.53416 5.25714 4.38882 5.19694 4.28165 5.08978L0.167368 0.97549C-0.0557892 0.752333 -0.0557892 0.390524 0.167368 0.167368Z"
fill="#E00000" />
</svg>
<b class="font-[700]"> 10% </b> <b class="font-[700]"> 10% </b>
</div> </div>
@@ -539,22 +640,29 @@
</div> </div>
</div> </div>
<div class="bg-white rounded-[10px] shadow-[0px_1px_1px_0px_rgba(0,0,0,0.10)] p-[16px] max-[1620px]:p-[10px] col-span-2"> <div
class="bg-white rounded-[10px] shadow-[0px_1px_1px_0px_rgba(0,0,0,0.10)] p-[16px] max-[1620px]:p-[10px] col-span-2">
<div class="flex justify-between min-h-[100px]"> <div class="flex justify-between min-h-[100px]">
<div> <div>
<h5 class="leading-[30px] text-[24px] font-[600]">32.4k</h5> <h5 class="leading-[30px] text-[24px] font-[600]">32.4k</h5>
<p class="text-[14px] text-[#7E7E7E]">Doanh thu trong tuần này</p> <p class="text-[14px] text-[#7E7E7E]">Doanh thu trong tuần này</p>
</div> </div>
<div class="flex items-center px-2.5 py-0.5 text-base font-semibold text-green-500 dark:text-green-500 text-center"> <div
class="flex items-center px-2.5 py-0.5 text-base font-semibold text-green-500 dark:text-green-500 text-center">
12% 12%
<svg class="w-3 h-3 ms-1" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 10 14"> <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13V1m0 0L1 5m4-4 4 4"/> </svg> <svg class="w-3 h-3 ms-1" aria-hidden="true" xmlns="http://www.w3.org/2000/svg"
fill="none" viewBox="0 0 10 14">
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"
stroke-width="2" d="M5 13V1m0 0L1 5m4-4 4 4" />
</svg>
</div> </div>
</div> </div>
<div id="js-revenue-chart"></div> <div id="js-revenue-chart"></div>
<div class="grid grid-cols-1 items-center border-gray-200 border-t dark:border-gray-700 justify-between"> <div
class="grid grid-cols-1 items-center border-gray-200 border-t dark:border-gray-700 justify-between">
<div class="flex justify-between items-center pt-5"> <div class="flex justify-between items-center pt-5">
<select> <select>
@@ -566,24 +674,35 @@
<option value=""> Last 90 days </option> <option value=""> Last 90 days </option>
</select> </select>
<a href="#" class="uppercase text-sm font-semibold inline-flex items-center rounded-lg text-blue-600 hover:text-blue-700 dark:hover:text-blue-500 hover:bg-gray-100 dark:hover:bg-gray-700 dark:focus:ring-gray-700 dark:border-gray-700 px-3 py-2"> <a href="#"
class="uppercase text-sm font-semibold inline-flex items-center rounded-lg text-blue-600 hover:text-blue-700 dark:hover:text-blue-500 hover:bg-gray-100 dark:hover:bg-gray-700 dark:focus:ring-gray-700 dark:border-gray-700 px-3 py-2">
Users Report Users Report
<svg class="w-2.5 h-2.5 ms-1.5 rtl:rotate-180" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 6 10"> <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m1 9 4-4-4-4"/> </svg> <svg class="w-2.5 h-2.5 ms-1.5 rtl:rotate-180" aria-hidden="true"
xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 6 10">
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"
stroke-width="2" d="m1 9 4-4-4-4" />
</svg>
</a> </a>
</div> </div>
</div> </div>
</div> </div>
<div class="bg-white rounded-[10px] shadow-[0px_1px_1px_0px_rgba(0,0,0,0.10)] p-[16px] max-[1620px]:p-[10px] col-span-2"> <div
class="bg-white rounded-[10px] shadow-[0px_1px_1px_0px_rgba(0,0,0,0.10)] p-[16px] max-[1620px]:p-[10px] col-span-2">
<div class="pb-[14px] mb-[10px] border-b border-gray-200 dark:border-gray-700"> <div class="pb-[14px] mb-[10px] border-b border-gray-200 dark:border-gray-700">
<h5 class="leading-[30px] text-[24px] font-[600]">3.4k</h5> <h5 class="leading-[30px] text-[24px] font-[600]">3.4k</h5>
<div class="flex items-center justify-between"> <div class="flex items-center justify-between">
<p class="text-[14px] text-[#7E7E7E]">Truy cập web trong tuần này</p> <p class="text-[14px] text-[#7E7E7E]">Truy cập web trong tuần này</p>
<span class="bg-green-100 text-green-800 text-xs font-medium inline-flex items-center px-2.5 py-1 rounded-md dark:bg-green-900 dark:text-green-300"> <span
<svg class="w-2.5 h-2.5 me-1.5" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 10 14"> <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13V1m0 0L1 5m4-4 4 4"/> </svg> class="bg-green-100 text-green-800 text-xs font-medium inline-flex items-center px-2.5 py-1 rounded-md dark:bg-green-900 dark:text-green-300">
<svg class="w-2.5 h-2.5 me-1.5" aria-hidden="true"
xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 10 14">
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"
stroke-width="2" d="M5 13V1m0 0L1 5m4-4 4 4" />
</svg>
42.5% 42.5%
</span> </span>
</div> </div>
@@ -591,7 +710,8 @@
<div class="grid grid-cols-2"> <div class="grid grid-cols-2">
<dl class="flex items-center"> <dl class="flex items-center">
<dt class="text-gray-500 dark:text-gray-400 text-sm font-normal me-1">Lượt truy cập:</dt> <dt class="text-gray-500 dark:text-gray-400 text-sm font-normal me-1">Lượt truy cập:
</dt>
<dd class="text-gray-900 text-sm dark:text-white font-semibold">1.458</dd> <dd class="text-gray-900 text-sm dark:text-white font-semibold">1.458</dd>
</dl> </dl>
@@ -603,7 +723,8 @@
<div id="js-access-chart"></div> <div id="js-access-chart"></div>
<div class="grid grid-cols-1 items-center border-gray-200 border-t dark:border-gray-700 justify-between"> <div
class="grid grid-cols-1 items-center border-gray-200 border-t dark:border-gray-700 justify-between">
<div class="flex justify-between items-center pt-5"> <div class="flex justify-between items-center pt-5">
<select> <select>
<option value=""> Last 7 days </option> <option value=""> Last 7 days </option>
@@ -614,21 +735,40 @@
<option value=""> Last 90 days </option> <option value=""> Last 90 days </option>
</select> </select>
<a href="#" class="uppercase text-sm font-semibold inline-flex items-center rounded-lg text-blue-600 hover:text-blue-700 dark:hover:text-blue-500 hover:bg-gray-100 dark:hover:bg-gray-700 dark:focus:ring-gray-700 dark:border-gray-700 px-3 py-2"> <a href="#"
class="uppercase text-sm font-semibold inline-flex items-center rounded-lg text-blue-600 hover:text-blue-700 dark:hover:text-blue-500 hover:bg-gray-100 dark:hover:bg-gray-700 dark:focus:ring-gray-700 dark:border-gray-700 px-3 py-2">
Leads Report Leads Report
<svg class="w-2.5 h-2.5 ms-1.5 rtl:rotate-180" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 6 10"> <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m1 9 4-4-4-4"/> </svg> <svg class="w-2.5 h-2.5 ms-1.5 rtl:rotate-180" aria-hidden="true"
xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 6 10">
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"
stroke-width="2" d="m1 9 4-4-4-4" />
</svg>
</a> </a>
</div> </div>
</div> </div>
</div> </div>
<div class="bg-white rounded-[10px] shadow-[0px_1px_1px_0px_rgba(0,0,0,0.10)] p-[16px] max-[1620px]:p-[10px] col-span-4"> <div
<p class="inline-block text-[20px] font-bold leading-[36px] mb-[16px] mr-[18px]"> Lịch sử chỉnh sửa </p> class="bg-white rounded-[10px] shadow-[0px_1px_1px_0px_rgba(0,0,0,0.10)] p-[16px] max-[1620px]:p-[10px] col-span-4">
<p class="inline-block text-[20px] font-bold leading-[36px] mb-[16px] mr-[18px]"> Lịch sử chỉnh
sửa </p>
<a href="" class="group inline-flex items-center px-[15px] mb-[16px] leading-[36px] text-[#0041E8] font-[500] rounded-[4px] bg-[#F5F7FF] hover:bg-[#0041E8] hover:text-white duration-100"> <a href=""
class="group inline-flex items-center px-[15px] mb-[16px] leading-[36px] text-[#0041E8] font-[500] rounded-[4px] bg-[#F5F7FF] hover:bg-[#0041E8] hover:text-white duration-100">
<span class="mr-[5px]">Xem danh sách</span> <span class="mr-[5px]">Xem danh sách</span>
<svg xmlns="http://www.w3.org/2000/svg" width="13" height="13" viewBox="0 0 13 13" fill="none"> <path class="group-hover:fill-[#fff]" fill-rule="evenodd" clip-rule="evenodd" d="M6.5 1C3.46243 1 1 3.46243 1 6.5C1 9.53757 3.46243 12 6.5 12C9.53757 12 12 9.53757 12 6.5C12 3.46243 9.53757 1 6.5 1ZM0 6.5C0 2.91015 2.91015 0 6.5 0C10.0899 0 13 2.91015 13 6.5C13 10.0899 10.0899 13 6.5 13C2.91015 13 0 10.0899 0 6.5Z" fill="#0041E8"/> <path class="group-hover:fill-[#fff]" fill-rule="evenodd" clip-rule="evenodd" d="M6.52779 4.02767C6.72306 3.83241 7.03964 3.83241 7.2349 4.02767L9.35365 6.14642C9.54891 6.34168 9.54891 6.65827 9.35365 6.85353L7.2349 8.97228C7.03964 9.16754 6.72306 9.16754 6.52779 8.97228C6.33253 8.77702 6.33253 8.46043 6.52779 8.26517L8.29299 6.49998L6.52779 4.73478C6.33253 4.53952 6.33253 4.22293 6.52779 4.02767Z" fill="#0041E8"/> <path class="group-hover:fill-[#fff]" fill-rule="evenodd" clip-rule="evenodd" d="M3.5 6.5C3.5 6.22386 3.72386 6 4 6H9C9.27614 6 9.5 6.22386 9.5 6.5C9.5 6.77614 9.27614 7 9 7H4C3.72386 7 3.5 6.77614 3.5 6.5Z" fill="#0041E8"/> </svg> <svg xmlns="http://www.w3.org/2000/svg" width="13" height="13" viewBox="0 0 13 13"
fill="none">
<path class="group-hover:fill-[#fff]" fill-rule="evenodd" clip-rule="evenodd"
d="M6.5 1C3.46243 1 1 3.46243 1 6.5C1 9.53757 3.46243 12 6.5 12C9.53757 12 12 9.53757 12 6.5C12 3.46243 9.53757 1 6.5 1ZM0 6.5C0 2.91015 2.91015 0 6.5 0C10.0899 0 13 2.91015 13 6.5C13 10.0899 10.0899 13 6.5 13C2.91015 13 0 10.0899 0 6.5Z"
fill="#0041E8" />
<path class="group-hover:fill-[#fff]" fill-rule="evenodd" clip-rule="evenodd"
d="M6.52779 4.02767C6.72306 3.83241 7.03964 3.83241 7.2349 4.02767L9.35365 6.14642C9.54891 6.34168 9.54891 6.65827 9.35365 6.85353L7.2349 8.97228C7.03964 9.16754 6.72306 9.16754 6.52779 8.97228C6.33253 8.77702 6.33253 8.46043 6.52779 8.26517L8.29299 6.49998L6.52779 4.73478C6.33253 4.53952 6.33253 4.22293 6.52779 4.02767Z"
fill="#0041E8" />
<path class="group-hover:fill-[#fff]" fill-rule="evenodd" clip-rule="evenodd"
d="M3.5 6.5C3.5 6.22386 3.72386 6 4 6H9C9.27614 6 9.5 6.22386 9.5 6.5C9.5 6.77614 9.27614 7 9 7H4C3.72386 7 3.5 6.77614 3.5 6.5Z"
fill="#0041E8" />
</svg>
</a> </a>
<table class="table-fixed border border-[#ECECEC] w-[100%] leading-[20px]"> <table class="table-fixed border border-[#ECECEC] w-[100%] leading-[20px]">
@@ -647,11 +787,30 @@
<td> Chỉnh sửa trang chủ website laptoptcc </td> <td> Chỉnh sửa trang chủ website laptoptcc </td>
<td> 24/11/2023 </td> <td> 24/11/2023 </td>
<td> <td>
<a href="" class="block rounded-[4px] border border-[#0041E8] bg-[#F5F7FF] text-[#0041E8] font-[500] leading-[36px] hover:bg-[#0041E8] hover:text-[#fff]"> Xem </a> <a href=""
class="block rounded-[4px] border border-[#0041E8] bg-[#F5F7FF] text-[#0041E8] font-[500] leading-[36px] hover:bg-[#0041E8] hover:text-[#fff]">
Xem </a>
</td> </td>
</tr> </tr>
<tr><td>2</td><td>uyentt@hurasoft.com</td><td>Chỉnh sửa trang chủ website laptoptcc</td><td>24/11/2023</td><td><a href="" class="block rounded-[4px] border border-[#0041E8] bg-[#F5F7FF] text-[#0041E8] font-[500] leading-[36px] hover:bg-[#0041E8] hover:text-[#fff]">Xem</a></td></tr><tr><td>3</td><td>uyentt@hurasoft.com</td><td>Chỉnh sửa trang chủ website laptoptcc</td><td>24/11/2023</td><td><a href="" class="block rounded-[4px] border border-[#0041E8] bg-[#F5F7FF] text-[#0041E8] font-[500] leading-[36px] hover:bg-[#0041E8] hover:text-[#fff]">Xem</a></td></tr> <tr>
<td>2</td>
<td>uyentt@hurasoft.com</td>
<td>Chỉnh sửa trang chủ website laptoptcc</td>
<td>24/11/2023</td>
<td><a href=""
class="block rounded-[4px] border border-[#0041E8] bg-[#F5F7FF] text-[#0041E8] font-[500] leading-[36px] hover:bg-[#0041E8] hover:text-[#fff]">Xem</a>
</td>
</tr>
<tr>
<td>3</td>
<td>uyentt@hurasoft.com</td>
<td>Chỉnh sửa trang chủ website laptoptcc</td>
<td>24/11/2023</td>
<td><a href=""
class="block rounded-[4px] border border-[#0041E8] bg-[#F5F7FF] text-[#0041E8] font-[500] leading-[36px] hover:bg-[#0041E8] hover:text-[#fff]">Xem</a>
</td>
</tr>
</tbody> </tbody>
</table> </table>
</div> </div>
@@ -659,8 +818,10 @@
<!-- col-right --> <!-- col-right -->
<div class="col-span-3"> <div class="col-span-3">
<div class="bg-white rounded-[10px] shadow-[0px_1px_1px_0px_rgba(0,0,0,0.10)] p-[16px] max-[1620px]:p-[10px] mb-[16px]"> <div
<div id="js-admin-home-tab" class="admin-home-tab rounded-[8px] bg-[#FAFAFA] mb-[16px] text-[12px] font-[500] flex items-center"> class="bg-white rounded-[10px] shadow-[0px_1px_1px_0px_rgba(0,0,0,0.10)] p-[16px] max-[1620px]:p-[10px] mb-[16px]">
<div id="js-admin-home-tab"
class="admin-home-tab rounded-[8px] bg-[#FAFAFA] mb-[16px] text-[12px] font-[500] flex items-center">
<a href="#js-report-most-viewed-products" class="current">Sản phẩm xem nhiều</a> <a href="#js-report-most-viewed-products" class="current">Sản phẩm xem nhiều</a>
<a href="#js-report-introduce-web"> Web giới thiệu</a> <a href="#js-report-introduce-web"> Web giới thiệu</a>
<a href="#js-report-key-word"> Từ khóa</a> <a href="#js-report-key-word"> Từ khóa</a>
@@ -678,11 +839,21 @@
<tbody> <tbody>
<tr> <tr>
<td> 1 </td> <td> 1 </td>
<td> <a href=""> Laptop Asus ZenBook UX3402VALaptop Asus ZenBook UX3402VALaptop Asus ZenBook UX3402VA </a> </td> <td> <a href=""> Laptop Asus ZenBook UX3402VALaptop Asus ZenBook UX3402VALaptop
Asus ZenBook UX3402VA </a> </td>
<td> 30.000 </td> <td> 30.000 </td>
</tr> </tr>
<tr><td>2<td><a href=""> Laptop Asus ZenBook UX3402VALaptop Asus ZenBook UX3402VALaptop Asus ZenBook UX3402VA </a><td>30.000<tr><td>3<td><a href=""> Laptop Asus ZenBook UX3402VALaptop Asus ZenBook UX3402VALaptop Asus ZenBook UX3402VA </a><td>30.000 <tr>
<td>2
<td><a href=""> Laptop Asus ZenBook UX3402VALaptop Asus ZenBook UX3402VALaptop
Asus ZenBook UX3402VA </a>
<td>30.000
<tr>
<td>3
<td><a href=""> Laptop Asus ZenBook UX3402VALaptop Asus ZenBook UX3402VALaptop
Asus ZenBook UX3402VA </a>
<td>30.000
</tbody> </tbody>
</table> </table>
</div> </div>
@@ -694,18 +865,27 @@
<div> <div>
<div class="flex" id="devices"> <div class="flex" id="devices">
<div class="flex items-center me-4"> <div class="flex items-center me-4">
<input id="web_1" type="checkbox" value="web_1" class="w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 rounded focus:ring-blue-500 dark:focus:ring-blue-600 dark:ring-offset-gray-800 focus:ring-2 dark:bg-gray-700 dark:border-gray-600"> <input id="web_1" type="checkbox" value="web_1"
<label for="web_1" class="ms-2 text-sm font-medium text-gray-900 dark:text-gray-300">Web 1</label> class="w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 rounded focus:ring-blue-500 dark:focus:ring-blue-600 dark:ring-offset-gray-800 focus:ring-2 dark:bg-gray-700 dark:border-gray-600">
<label for="web_1"
class="ms-2 text-sm font-medium text-gray-900 dark:text-gray-300">Web
1</label>
</div> </div>
<div class="flex items-center me-4"> <div class="flex items-center me-4">
<input id="web_2" type="checkbox" value="web_2" class="w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 rounded focus:ring-blue-500 dark:focus:ring-blue-600 dark:ring-offset-gray-800 focus:ring-2 dark:bg-gray-700 dark:border-gray-600"> <input id="web_2" type="checkbox" value="web_2"
<label for="web_2" class="ms-2 text-sm font-medium text-gray-900 dark:text-gray-300">Web 2</label> class="w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 rounded focus:ring-blue-500 dark:focus:ring-blue-600 dark:ring-offset-gray-800 focus:ring-2 dark:bg-gray-700 dark:border-gray-600">
<label for="web_2"
class="ms-2 text-sm font-medium text-gray-900 dark:text-gray-300">Web
2</label>
</div> </div>
<div class="flex items-center me-4"> <div class="flex items-center me-4">
<input id="web_3" type="checkbox" value="web_3" class="w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 rounded focus:ring-blue-500 dark:focus:ring-blue-600 dark:ring-offset-gray-800 focus:ring-2 dark:bg-gray-700 dark:border-gray-600"> <input id="web_3" type="checkbox" value="web_3"
<label for="web_3" class="ms-2 text-sm font-medium text-gray-900 dark:text-gray-300">Web 3</label> class="w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 rounded focus:ring-blue-500 dark:focus:ring-blue-600 dark:ring-offset-gray-800 focus:ring-2 dark:bg-gray-700 dark:border-gray-600">
<label for="web_3"
class="ms-2 text-sm font-medium text-gray-900 dark:text-gray-300">Web
3</label>
</div> </div>
</div> </div>
</div> </div>
@@ -713,7 +893,8 @@
<!-- Donut Chart --> <!-- Donut Chart -->
<div class="py-6" id="js-introduce-web-chart"></div> <div class="py-6" id="js-introduce-web-chart"></div>
<div class="grid grid-cols-1 items-center border-gray-200 border-t dark:border-gray-700 justify-between"> <div
class="grid grid-cols-1 items-center border-gray-200 border-t dark:border-gray-700 justify-between">
<div class="flex justify-between items-center pt-5"> <div class="flex justify-between items-center pt-5">
<select> <select>
<option value=""> Last 7 days </option> <option value=""> Last 7 days </option>
@@ -723,9 +904,14 @@
<option value=""> Last 30 days </option> <option value=""> Last 30 days </option>
<option value=""> Last 90 days </option> <option value=""> Last 90 days </option>
</select> </select>
<a href="#" class="uppercase text-sm font-semibold inline-flex items-center rounded-lg text-blue-600 hover:text-blue-700 dark:hover:text-blue-500 hover:bg-gray-100 dark:hover:bg-gray-700 dark:focus:ring-gray-700 dark:border-gray-700 px-3 py-2"> <a href="#"
class="uppercase text-sm font-semibold inline-flex items-center rounded-lg text-blue-600 hover:text-blue-700 dark:hover:text-blue-500 hover:bg-gray-100 dark:hover:bg-gray-700 dark:focus:ring-gray-700 dark:border-gray-700 px-3 py-2">
Traffic analysis Traffic analysis
<svg class="w-2.5 h-2.5 ms-1.5 rtl:rotate-180" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 6 10"> <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m1 9 4-4-4-4"/></svg> <svg class="w-2.5 h-2.5 ms-1.5 rtl:rotate-180" aria-hidden="true"
xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 6 10">
<path stroke="currentColor" stroke-linecap="round"
stroke-linejoin="round" stroke-width="2" d="m1 9 4-4-4-4" />
</svg>
</a> </a>
</div> </div>
</div> </div>
@@ -733,11 +919,22 @@
</div> </div>
<div class="home-report-holder" id="js-report-key-word"> <div class="home-report-holder" id="js-report-key-word">
<a href="" class="inline-block text-[#9E9E9E] font-[500] leading-[20px] p-[8px] rounded-[4px] border-[#9E9E9E] border border-dashed m-[0_6px_6px_0] hover:bg-[#0041E8] hover:text-[#fff] hover:border-[#0041E8] duration-100"> <a href=""
class="inline-block text-[#9E9E9E] font-[500] leading-[20px] p-[8px] rounded-[4px] border-[#9E9E9E] border border-dashed m-[0_6px_6px_0] hover:bg-[#0041E8] hover:text-[#fff] hover:border-[#0041E8] duration-100">
Laptop, Máy Tính Xách Tay Laptop, Máy Tính Xách Tay
</a> </a>
<a href="" class="inline-block text-[#9E9E9E] font-[500] leading-[20px] p-[8px] rounded-[4px] border-[#9E9E9E] border border-dashed m-[0_6px_6px_0] hover:bg-[#0041E8] hover:text-[#fff] hover:border-[#0041E8] duration-100"> Máy Tính Bảng </a><a href="" class="inline-block text-[#9E9E9E] font-[500] leading-[20px] p-[8px] rounded-[4px] border-[#9E9E9E] border border-dashed m-[0_6px_6px_0] hover:bg-[#0041E8] hover:text-[#fff] hover:border-[#0041E8] duration-100"> Điện thoại iPhone </a><a href="" class="inline-block text-[#9E9E9E] font-[500] leading-[20px] p-[8px] rounded-[4px] border-[#9E9E9E] border border-dashed m-[0_6px_6px_0] hover:bg-[#0041E8] hover:text-[#fff] hover:border-[#0041E8] duration-100"> Máy Đọc Sách </a><a href="" class="inline-block text-[#9E9E9E] font-[500] leading-[20px] p-[8px] rounded-[4px] border-[#9E9E9E] border border-dashed m-[0_6px_6px_0] hover:bg-[#0041E8] hover:text-[#fff] hover:border-[#0041E8] duration-100"> Macbook </a><a href="" class="inline-block text-[#9E9E9E] font-[500] leading-[20px] p-[8px] rounded-[4px] border-[#9E9E9E] border border-dashed m-[0_6px_6px_0] hover:bg-[#0041E8] hover:text-[#fff] hover:border-[#0041E8] duration-100"> Linh kiện máy tính </a> <a href=""
class="inline-block text-[#9E9E9E] font-[500] leading-[20px] p-[8px] rounded-[4px] border-[#9E9E9E] border border-dashed m-[0_6px_6px_0] hover:bg-[#0041E8] hover:text-[#fff] hover:border-[#0041E8] duration-100">
Máy Tính Bảng </a><a href=""
class="inline-block text-[#9E9E9E] font-[500] leading-[20px] p-[8px] rounded-[4px] border-[#9E9E9E] border border-dashed m-[0_6px_6px_0] hover:bg-[#0041E8] hover:text-[#fff] hover:border-[#0041E8] duration-100">
Điện thoại iPhone </a><a href=""
class="inline-block text-[#9E9E9E] font-[500] leading-[20px] p-[8px] rounded-[4px] border-[#9E9E9E] border border-dashed m-[0_6px_6px_0] hover:bg-[#0041E8] hover:text-[#fff] hover:border-[#0041E8] duration-100">
Máy Đọc Sách </a><a href=""
class="inline-block text-[#9E9E9E] font-[500] leading-[20px] p-[8px] rounded-[4px] border-[#9E9E9E] border border-dashed m-[0_6px_6px_0] hover:bg-[#0041E8] hover:text-[#fff] hover:border-[#0041E8] duration-100">
Macbook </a><a href=""
class="inline-block text-[#9E9E9E] font-[500] leading-[20px] p-[8px] rounded-[4px] border-[#9E9E9E] border border-dashed m-[0_6px_6px_0] hover:bg-[#0041E8] hover:text-[#fff] hover:border-[#0041E8] duration-100">
Linh kiện máy tính </a>
</div> </div>
<div class="home-report-holder" id="js-report-article"> <div class="home-report-holder" id="js-report-article">
@@ -751,23 +948,47 @@
<tbody> <tbody>
<tr> <tr>
<td> 1 </td> <td> 1 </td>
<td> <a href=""> Laptop Asus ZenBook UX3402VALaptop Asus ZenBook UX3402VALaptop Asus ZenBook UX3402VA </a> </td> <td> <a href=""> Laptop Asus ZenBook UX3402VALaptop Asus ZenBook UX3402VALaptop
Asus ZenBook UX3402VA </a> </td>
<td> 30.000 </td> <td> 30.000 </td>
</tr> </tr>
<tr><td>2<td><a href=""> Laptop Asus ZenBook UX3402VALaptop Asus ZenBook UX3402VALaptop Asus ZenBook UX3402VA </a><td>30.000<tr><td>3<td><a href=""> Laptop Asus ZenBook UX3402VALaptop Asus ZenBook UX3402VALaptop Asus ZenBook UX3402VA </a><td>30.000 <tr>
<td>2
<td><a href=""> Laptop Asus ZenBook UX3402VALaptop Asus ZenBook UX3402VALaptop
Asus ZenBook UX3402VA </a>
<td>30.000
<tr>
<td>3
<td><a href=""> Laptop Asus ZenBook UX3402VALaptop Asus ZenBook UX3402VALaptop
Asus ZenBook UX3402VA </a>
<td>30.000
</tbody> </tbody>
</table> </table>
</div> </div>
</div> </div>
<div class="bg-white rounded-[10px] shadow-[0px_1px_1px_0px_rgba(0,0,0,0.10)] p-[16px] max-[1620px]:p-[10px]"> <div
class="bg-white rounded-[10px] shadow-[0px_1px_1px_0px_rgba(0,0,0,0.10)] p-[16px] max-[1620px]:p-[10px]">
<div class="flex flex-wrap items-center justify-between mb-[10px]"> <div class="flex flex-wrap items-center justify-between mb-[10px]">
<p class="font-[500]">Ghi nhắc việc làm cá nhân</p> <p class="font-[500]">Ghi nhắc việc làm cá nhân</p>
<div class="relative rounded-[4px] max-w-[120px] bg-white leading-[32px] border border-[#d8d8d8] shadow-[0px_2px_4px_0px_rgba(0,0,0,0.12)] p-[0px_9px_0px_30px]"> <div
<svg class="absolute top-[8px] left-[9px]" xmlns="http://www.w3.org/2000/svg" width="13" height="14" viewBox="0 0 13 14" fill="none"> class="relative rounded-[4px] max-w-[120px] bg-white leading-[32px] border border-[#d8d8d8] shadow-[0px_2px_4px_0px_rgba(0,0,0,0.12)] p-[0px_9px_0px_30px]">
<path fill-rule="evenodd" clip-rule="evenodd" d="M1.90909 2.54545C1.55764 2.54545 1.27273 2.83036 1.27273 3.18181V12.0909C1.27273 12.4424 1.55764 12.7273 1.90909 12.7273H10.8182C11.1696 12.7273 11.4545 12.4424 11.4545 12.0909V3.18181C11.4545 2.83036 11.1696 2.54545 10.8182 2.54545H1.90909ZM0 3.18181C0 2.12745 0.854729 1.27272 1.90909 1.27272H10.8182C11.8725 1.27272 12.7273 2.12745 12.7273 3.18181V12.0909C12.7273 13.1453 11.8725 14 10.8182 14H1.90909C0.854729 14 0 13.1453 0 12.0909V3.18181Z" fill="#7E7E7E"/> <path fill-rule="evenodd" clip-rule="evenodd" d="M8.90907 0C9.26052 0 9.54543 0.28491 9.54543 0.636364V3.18182C9.54543 3.53327 9.26052 3.81818 8.90907 3.81818C8.55761 3.81818 8.27271 3.53327 8.27271 3.18182V0.636364C8.27271 0.28491 8.55761 0 8.90907 0Z" fill="#7E7E7E"/> <path fill-rule="evenodd" clip-rule="evenodd" d="M3.81813 0C4.16958 0 4.45449 0.28491 4.45449 0.636364V3.18182C4.45449 3.53327 4.16958 3.81818 3.81813 3.81818C3.46667 3.81818 3.18176 3.53327 3.18176 3.18182V0.636364C3.18176 0.28491 3.46667 0 3.81813 0Z" fill="#7E7E7E"/> <path fill-rule="evenodd" clip-rule="evenodd" d="M0 5.72728C0 5.37582 0.28491 5.09091 0.636364 5.09091H12.0909C12.4424 5.09091 12.7273 5.37582 12.7273 5.72728C12.7273 6.07873 12.4424 6.36364 12.0909 6.36364H0.636364C0.28491 6.36364 0 6.07873 0 5.72728Z" fill="#7E7E7E"/> <svg class="absolute top-[8px] left-[9px]" xmlns="http://www.w3.org/2000/svg" width="13"
height="14" viewBox="0 0 13 14" fill="none">
<path fill-rule="evenodd" clip-rule="evenodd"
d="M1.90909 2.54545C1.55764 2.54545 1.27273 2.83036 1.27273 3.18181V12.0909C1.27273 12.4424 1.55764 12.7273 1.90909 12.7273H10.8182C11.1696 12.7273 11.4545 12.4424 11.4545 12.0909V3.18181C11.4545 2.83036 11.1696 2.54545 10.8182 2.54545H1.90909ZM0 3.18181C0 2.12745 0.854729 1.27272 1.90909 1.27272H10.8182C11.8725 1.27272 12.7273 2.12745 12.7273 3.18181V12.0909C12.7273 13.1453 11.8725 14 10.8182 14H1.90909C0.854729 14 0 13.1453 0 12.0909V3.18181Z"
fill="#7E7E7E" />
<path fill-rule="evenodd" clip-rule="evenodd"
d="M8.90907 0C9.26052 0 9.54543 0.28491 9.54543 0.636364V3.18182C9.54543 3.53327 9.26052 3.81818 8.90907 3.81818C8.55761 3.81818 8.27271 3.53327 8.27271 3.18182V0.636364C8.27271 0.28491 8.55761 0 8.90907 0Z"
fill="#7E7E7E" />
<path fill-rule="evenodd" clip-rule="evenodd"
d="M3.81813 0C4.16958 0 4.45449 0.28491 4.45449 0.636364V3.18182C4.45449 3.53327 4.16958 3.81818 3.81813 3.81818C3.46667 3.81818 3.18176 3.53327 3.18176 3.18182V0.636364C3.18176 0.28491 3.46667 0 3.81813 0Z"
fill="#7E7E7E" />
<path fill-rule="evenodd" clip-rule="evenodd"
d="M0 5.72728C0 5.37582 0.28491 5.09091 0.636364 5.09091H12.0909C12.4424 5.09091 12.7273 5.37582 12.7273 5.72728C12.7273 6.07873 12.4424 6.36364 12.0909 6.36364H0.636364C0.28491 6.36364 0 6.07873 0 5.72728Z"
fill="#7E7E7E" />
</svg> </svg>
<input type="text" value="23/11/2023" class="w-[100%] h-[32px]"> <input type="text" value="23/11/2023" class="w-[100%] h-[32px]">
@@ -775,8 +996,11 @@
</div> </div>
<form class="flex items-center justify-between mb-[10px]"> <form class="flex items-center justify-between mb-[10px]">
<input type="text" placeholder="Nhập việc cần làm của bạn" class="border border-[#ECECEC] h-[36px] mr-[10px] p-[0px_12px] rounded-[4px] w-[calc(100%-87px)]"> <input type="text" placeholder="Nhập việc cần làm của bạn"
<button type="button" class="bg-[#0041E8] font-[500] h-[36px] rounded-[4px] text-[#fff] w-[77px]">Tạo mới</button> class="border border-[#ECECEC] h-[36px] mr-[10px] p-[0px_12px] rounded-[4px] w-[calc(100%-87px)]">
<button type="button"
class="bg-[#0041E8] font-[500] h-[36px] rounded-[4px] text-[#fff] w-[77px]">Tạo
mới</button>
</form> </form>
<div class="home-todo-list"> <div class="home-todo-list">
@@ -794,7 +1018,8 @@
<td> Sửa trang chủ websiteLaptoptcc </td> <td> Sửa trang chủ websiteLaptoptcc </td>
<td> 28/11/2023 </td> <td> 28/11/2023 </td>
<td> <td>
<span class="bg-[#F0F9F2] border-[#6DC580] text-[#03781D] block border font-[500] p-[0px_5px] rounded-[50px] text-[12px] text-center"> <span
class="bg-[#F0F9F2] border-[#6DC580] text-[#03781D] block border font-[500] p-[0px_5px] rounded-[50px] text-[12px] text-center">
Đang triển khai Đang triển khai
</span> </span>
</td> </td>
@@ -805,7 +1030,9 @@
<td> Sửa trang chủ websiteLaptoptcc </td> <td> Sửa trang chủ websiteLaptoptcc </td>
<td> 28/11/2023 </td> <td> 28/11/2023 </td>
<td> <td>
<span class="bg-[#F9F2F2] border-[#E00000] text-[#E00000] block border font-[500] p-[0px_5px] rounded-[50px] text-[12px] text-center"> Quá hạn </span> <span
class="bg-[#F9F2F2] border-[#E00000] text-[#E00000] block border font-[500] p-[0px_5px] rounded-[50px] text-[12px] text-center">
Quá hạn </span>
</td> </td>
</tr> </tr>
@@ -814,7 +1041,9 @@
<td> Sửa trang chủ websiteLaptoptcc </td> <td> Sửa trang chủ websiteLaptoptcc </td>
<td> 28/11/2023 </td> <td> 28/11/2023 </td>
<td> <td>
<span class="bg-[#F7F5FF] border-[#0041E8] text-[#0041E8] block border font-[500] p-[0px_5px] rounded-[50px] text-[12px] text-center"> Đã xong </span> <span
class="bg-[#F7F5FF] border-[#0041E8] text-[#0041E8] block border font-[500] p-[0px_5px] rounded-[50px] text-[12px] text-center">
Đã xong </span>
</td> </td>
</tr> </tr>
@@ -823,7 +1052,9 @@
<td> Sửa trang chủ websiteLaptoptcc </td> <td> Sửa trang chủ websiteLaptoptcc </td>
<td> 28/11/2023 </td> <td> 28/11/2023 </td>
<td> <td>
<span class="bg-[#FCFAF1] border-[#FFC700] text-[#FFC700] block border font-[500] p-[0px_5px] rounded-[50px] text-[12px] text-center"> Sắp hết hạn </span> <span
class="bg-[#FCFAF1] border-[#FFC700] text-[#FFC700] block border font-[500] p-[0px_5px] rounded-[50px] text-[12px] text-center">
Sắp hết hạn </span>
</td> </td>
</tr> </tr>
</tbody> </tbody>
@@ -835,22 +1066,22 @@
</div> </div>
</div> </div>
</div> </div>
<!-- Script --> <!-- Script -->
<script src="https://cdn.jsdelivr.net/npm/jquery@3.3.1/dist/jquery.min.js"></script> <script src="https://cdn.jsdelivr.net/npm/jquery@3.3.1/dist/jquery.min.js"></script>
<script src="js/charts.js"></script> <script src="js/charts.js"></script>
<script> <script>
$(function(){ $(function () {
revenue_chart(); // Doanh thu revenue_chart(); // Doanh thu
access_chart(); // Truy cập access_chart(); // Truy cập
introduce_web_chart(); // web giới thiệu introduce_web_chart(); // web giới thiệu
$("#js-admin-home-tab a").click(function(){ $("#js-admin-home-tab a").click(function () {
event.preventDefault(); event.preventDefault();
$("#js-admin-home-tab a").removeClass('current'); $("#js-admin-home-tab a").removeClass('current');
@@ -1053,7 +1284,7 @@
}, },
} }
if(document.getElementById("js-access-chart") && typeof ApexCharts !== 'undefined') { if (document.getElementById("js-access-chart") && typeof ApexCharts !== 'undefined') {
const chart = new ApexCharts(document.getElementById("js-access-chart"), options); const chart = new ApexCharts(document.getElementById("js-access-chart"), options);
chart.render(); chart.render();
} }
@@ -1157,7 +1388,7 @@
function handleCheckboxChange(event, chart) { function handleCheckboxChange(event, chart) {
const checkbox = event.target; const checkbox = event.target;
if (checkbox.checked) { if (checkbox.checked) {
switch(checkbox.value) { switch (checkbox.value) {
case 'web_1': case 'web_1':
chart.updateSeries([15.1, 22.5, 4.4, 8.4]); chart.updateSeries([15.1, 22.5, 4.4, 8.4]);
break; break;
@@ -1183,8 +1414,9 @@
} }
} }
</script> </script>
</body> </body>
</html> </html>

BIN
images/img-product.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 6.7 KiB

788
product_list.html Normal file
View File

@@ -0,0 +1,788 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title> Admin Hura Pc </title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&display=swap"
rel="stylesheet">
<link rel="stylesheet" media="screen" href="scss/pc_style.css" />
<script src="js/tailwindcss.js"></script>
</head>
<body>
<div class="admin-global-container">
<!-- Menu cũ -->
<div class="admin-menu-container sticky top-0 bottom-0 h-[100vh]" style="display: none;">
<a href="" class="menu-logo">
<img src="images/logo.png" />
</a>
<div class="menu-list">
<a href="" class="item">
<i class="icons icon-home"></i>
<span class="title"> Home </span>
</a>
<details>
<summary>
<a href="">
<i class="icons icon-sell"></i>
<span class="title"> Bán hàng </span>
</a>
<svg xmlns="http://www.w3.org/2000/svg" width="7" height="12" viewBox="0 0 7 12" fill="none">
<path fill-rule="evenodd" clip-rule="evenodd"
d="M0.646447 11.3536C0.451184 11.1583 0.451184 10.8417 0.646447 10.6464L5.29289 6L0.646446 1.35355C0.451184 1.15829 0.451184 0.841709 0.646446 0.646446C0.841708 0.451184 1.15829 0.451184 1.35355 0.646446L6.35355 5.64645C6.54882 5.84171 6.54882 6.15829 6.35355 6.35355L1.35355 11.3536C1.15829 11.5488 0.841709 11.5488 0.646447 11.3536Z"
fill="white" />
</svg>
</summary>
<div class="sub-menu">
<a href=""> Menu title </a>
<a href=""> Menu title </a>
<a href=""> Menu title </a>
<a href=""> Menu title </a>
</div>
</details>
<details>
<summary>
<a href="">
<i class="icons icon-product"></i>
<span class="title"> Sản phẩm </span>
</a>
<svg xmlns="http://www.w3.org/2000/svg" width="7" height="12" viewBox="0 0 7 12" fill="none">
<path fill-rule="evenodd" clip-rule="evenodd"
d="M0.646447 11.3536C0.451184 11.1583 0.451184 10.8417 0.646447 10.6464L5.29289 6L0.646446 1.35355C0.451184 1.15829 0.451184 0.841709 0.646446 0.646446C0.841708 0.451184 1.15829 0.451184 1.35355 0.646446L6.35355 5.64645C6.54882 5.84171 6.54882 6.15829 6.35355 6.35355L1.35355 11.3536C1.15829 11.5488 0.841709 11.5488 0.646447 11.3536Z"
fill="white" />
</svg>
</summary>
<div class="sub-menu">
<a href=""> Menu title </a>
<a href=""> Menu title </a>
<a href=""> Menu title </a>
<a href=""> Menu title </a>
</div>
</details>
<details>
<summary>
<a href="">
<i class="icons icon-user"></i>
<span class="title"> Khách hàng </span>
</a>
<svg xmlns="http://www.w3.org/2000/svg" width="7" height="12" viewBox="0 0 7 12" fill="none">
<path fill-rule="evenodd" clip-rule="evenodd"
d="M0.646447 11.3536C0.451184 11.1583 0.451184 10.8417 0.646447 10.6464L5.29289 6L0.646446 1.35355C0.451184 1.15829 0.451184 0.841709 0.646446 0.646446C0.841708 0.451184 1.15829 0.451184 1.35355 0.646446L6.35355 5.64645C6.54882 5.84171 6.54882 6.15829 6.35355 6.35355L1.35355 11.3536C1.15829 11.5488 0.841709 11.5488 0.646447 11.3536Z"
fill="white" />
</svg>
</summary>
<div class="sub-menu">
<a href=""> Menu title </a>
<a href=""> Menu title </a>
<a href=""> Menu title </a>
<a href=""> Menu title </a>
</div>
</details>
<details>
<summary>
<a href="">
<i class="icons icon-marketing"></i>
<span class="title"> Marketing </span>
</a>
<svg xmlns="http://www.w3.org/2000/svg" width="7" height="12" viewBox="0 0 7 12" fill="none">
<path fill-rule="evenodd" clip-rule="evenodd"
d="M0.646447 11.3536C0.451184 11.1583 0.451184 10.8417 0.646447 10.6464L5.29289 6L0.646446 1.35355C0.451184 1.15829 0.451184 0.841709 0.646446 0.646446C0.841708 0.451184 1.15829 0.451184 1.35355 0.646446L6.35355 5.64645C6.54882 5.84171 6.54882 6.15829 6.35355 6.35355L1.35355 11.3536C1.15829 11.5488 0.841709 11.5488 0.646447 11.3536Z"
fill="white" />
</svg>
</summary>
<div class="sub-menu">
<a href=""> Menu title </a>
<a href=""> Menu title </a>
<a href=""> Menu title </a>
<a href=""> Menu title </a>
</div>
</details>
<details>
<summary>
<a href="">
<i class="icons icon-content"></i>
<span class="title"> Nội dung </span>
</a>
<svg xmlns="http://www.w3.org/2000/svg" width="7" height="12" viewBox="0 0 7 12" fill="none">
<path fill-rule="evenodd" clip-rule="evenodd"
d="M0.646447 11.3536C0.451184 11.1583 0.451184 10.8417 0.646447 10.6464L5.29289 6L0.646446 1.35355C0.451184 1.15829 0.451184 0.841709 0.646446 0.646446C0.841708 0.451184 1.15829 0.451184 1.35355 0.646446L6.35355 5.64645C6.54882 5.84171 6.54882 6.15829 6.35355 6.35355L1.35355 11.3536C1.15829 11.5488 0.841709 11.5488 0.646447 11.3536Z"
fill="white" />
</svg>
</summary>
<div class="sub-menu">
<a href=""> Menu title </a>
<a href=""> Menu title </a>
<a href=""> Menu title </a>
<a href=""> Menu title </a>
</div>
</details>
<details>
<summary>
<a href="">
<i class="icons icon-stats"></i>
<span class="title"> Thống kê </span>
</a>
<svg xmlns="http://www.w3.org/2000/svg" width="7" height="12" viewBox="0 0 7 12" fill="none">
<path fill-rule="evenodd" clip-rule="evenodd"
d="M0.646447 11.3536C0.451184 11.1583 0.451184 10.8417 0.646447 10.6464L5.29289 6L0.646446 1.35355C0.451184 1.15829 0.451184 0.841709 0.646446 0.646446C0.841708 0.451184 1.15829 0.451184 1.35355 0.646446L6.35355 5.64645C6.54882 5.84171 6.54882 6.15829 6.35355 6.35355L1.35355 11.3536C1.15829 11.5488 0.841709 11.5488 0.646447 11.3536Z"
fill="white" />
</svg>
</summary>
<div class="sub-menu">
<a href=""> Menu title </a>
<a href=""> Menu title </a>
<a href=""> Menu title </a>
<a href=""> Menu title </a>
</div>
</details>
<details>
<summary>
<a href="">
<i class="icons icon-system"></i>
<span class="title"> Hệ thống </span>
</a>
<svg xmlns="http://www.w3.org/2000/svg" width="7" height="12" viewBox="0 0 7 12" fill="none">
<path fill-rule="evenodd" clip-rule="evenodd"
d="M0.646447 11.3536C0.451184 11.1583 0.451184 10.8417 0.646447 10.6464L5.29289 6L0.646446 1.35355C0.451184 1.15829 0.451184 0.841709 0.646446 0.646446C0.841708 0.451184 1.15829 0.451184 1.35355 0.646446L6.35355 5.64645C6.54882 5.84171 6.54882 6.15829 6.35355 6.35355L1.35355 11.3536C1.15829 11.5488 0.841709 11.5488 0.646447 11.3536Z"
fill="white" />
</svg>
</summary>
<div class="sub-menu">
<a href=""> Menu title </a>
<a href=""> Menu title </a>
<a href=""> Menu title </a>
<a href=""> Menu title </a>
</div>
</details>
</div>
<div class="menu-list">
<p style="color: #81B5E4;margin: 0 0 10px;font-weight: 700;padding: 0 16px;">TÀI KHOẢN</p>
<a href="" class="item">
<i class="icons icon-settings"></i>
<span class="title"> Cài đặt </span>
</a>
<a href="" class="item">
<i class="icons icon-support"></i>
<span class="title"> Hỗ trợ </span>
</a>
<a href="" class="item">
<i class="icons icon-account"></i>
<span class="title"> Quản lý tài khoản </span>
</a>
</div>
<a href="" class="item">
<i class="icons icon-logout"></i>
<span class="title"> Thoát quản trị </span>
</a>
</div>
<!-- Menu mới -->
<div class="admin-menu sticky top-0 bottom-0 h-[100vh] bg-[#004E99] flex flex-col justify-between">
<div
class="item items-center justify-center border-[rgba(255,255,255,0.15)] border-b p-[20px_0_38px_!important]">
<a href="">
<svg xmlns="http://www.w3.org/2000/svg" width="35" height="21" viewBox="0 0 35 21" fill="none">
<path
d="M28.5184 7.75141C28.4928 10.6955 27.8993 11.3464 27.8993 11.3464C29.065 3.56585 22.8312 0.686397 22.8312 0.686397C14.1636 -2.28358 11.3328 5.34611 11.3328 5.34611C5.84614 4.92368 4.24499 10.0963 4.24499 10.0963C10.9656 11.1611 9.15091 16.8812 9.15091 16.8812C9.36867 12.5146 6.78975 11.4887 6.78975 11.4887C2.42608 9.30752 0.355256 13.7302 0.355256 13.7302C-1.31421 19.2347 3.44228 20.4891 3.44228 20.4891H28.9967C35.0725 19.6098 34.748 14.1052 34.748 14.1052C34.1246 7.61347 28.5184 7.75141 28.5184 7.75141Z"
fill="white" />
</svg>
</a>
</div>
<div class="item">
<a href="" class="icons icon-home"> </a>
<div class="sub-menu">
<p class="font-bold"> Home </p>
</div>
</div>
<div class="item">
<a href="" class="icons icon-sell"> </a>
<div class="sub-menu">
<p class="font-bold"> Bán hàng </p>
<div class="menu-list">
<a href=""> Menu title </a>
<a href=""> Menu title </a>
<a href=""> Menu title </a>
<a href=""> Menu title </a>
</div>
</div>
</div>
<div class="item">
<a href="" class="icons icon-product"> </a>
<div class="sub-menu">
<p class="font-bold"> Sản phẩm </p>
<div class="menu-list">
<a href=""> Menu title </a>
<a href=""> Menu title </a>
<a href=""> Menu title </a>
<a href=""> Menu title </a>
</div>
</div>
</div>
<div class="item">
<a href="" class="icons icon-user"> </a>
<div class="sub-menu">
<p class="font-bold"> Khách hàng </p>
<div class="menu-list">
<a href=""> Menu title </a>
<a href=""> Menu title </a>
<a href=""> Menu title </a>
<a href=""> Menu title </a>
</div>
</div>
</div>
<div class="item">
<a href="" class="icons icon-marketing"> </a>
<div class="sub-menu">
<p class="font-bold"> Marketing </p>
<div class="menu-list">
<a href=""> Menu title </a>
<a href=""> Menu title </a>
<a href=""> Menu title </a>
<a href=""> Menu title </a>
</div>
</div>
</div>
<div class="item">
<a href="" class="icons icon-content"> </a>
<div class="sub-menu">
<p class="font-bold"> Nội dung </p>
<div class="menu-list">
<a href=""> Menu title </a>
<a href=""> Menu title </a>
<a href=""> Menu title </a>
<a href=""> Menu title </a>
</div>
</div>
</div>
<div class="item">
<a href="" class="icons icon-stats"> </a>
<div class="sub-menu">
<p class="font-bold"> Thống kê </p>
<div class="menu-list">
<a href=""> Menu title </a>
<a href=""> Menu title </a>
<a href=""> Menu title </a>
<a href=""> Menu title </a>
</div>
</div>
</div>
<div class="item border-[rgba(255,255,255,0.15)] border-b">
<a href="" class="icons icon-system"> </a>
<div class="sub-menu">
<p class="font-bold"> Hệ thống </p>
<div class="menu-list">
<a href=""> Menu title </a>
<a href=""> Menu title </a>
<a href=""> Menu title </a>
<a href=""> Menu title </a>
</div>
</div>
</div>
<div class="item">
<a href="" class="icons icon-settings"> </a>
<div class="sub-menu">
<p class="font-bold"> Cài đặt </p>
<div class="menu-list">
<a href=""> Menu title </a>
<a href=""> Menu title </a>
<a href=""> Menu title </a>
<a href=""> Menu title </a>
</div>
</div>
</div>
<div class="item">
<a href="" class="icons icon-support"> </a>
<div class="sub-menu">
<p class="font-bold"> Hỗ trợ </p>
<div class="menu-list">
<a href=""> Menu title </a>
<a href=""> Menu title </a>
<a href=""> Menu title </a>
<a href=""> Menu title </a>
</div>
</div>
</div>
<div class="item">
<a href="" class="icons icon-account"> </a>
<div class="sub-menu">
<p class="font-bold"> Quản lý tài khoản </p>
<div class="menu-list">
<a href=""> Menu title </a>
<a href=""> Menu title </a>
<a href=""> Menu title </a>
<a href=""> Menu title </a>
</div>
</div>
</div>
<div class="item mb-[20px]">
<a href="" class="icons icon-logout"> </a>
<div class="sub-menu">
<p class="font-bold"> Thoát quản trị </p>
</div>
</div>
</div>
<div class="admin-content-container w-[100%]">
<!-- Header -->
<div
class="admin-header-container flex items-center justify-between bg-white px-4 py-3 shadow-[0_1px_1px_0_rgba(0,0,0,0.05)]">
<form class="max-w-[420px] relative w-[100%]">
<div class="absolute inset-y-0 start-0 flex items-center ps-3 pointer-events-none">
<svg class="w-4 h-4" xmlns="http://www.w3.org/2000/svg" width="20" height="20"
viewBox="0 0 20 20" fill="none">
<path
d="M9 17C13.4183 17 17 13.4183 17 9C17 4.58172 13.4183 1 9 1C4.58172 1 1 4.58172 1 9C1 13.4183 4.58172 17 9 17Z"
stroke="#C5C5C5" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" />
<path d="M18.9999 19L14.6499 14.65" stroke="#C5C5C5" stroke-width="2" stroke-linecap="round"
stroke-linejoin="round" />
</svg>
</div>
<input type="search" class="block border h-[36px] ps-10 rounded w-full" placeholder="Tìm kiếm">
</form>
<div class="admin-header-right flex items-center justify-end">
<a href="" title="Truy cập trung tâm hỗ trợ của Hurasoft">
<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" viewBox="0 0 28 28" fill="none">
<path fill-rule="evenodd" clip-rule="evenodd"
d="M14 1.86667C7.29894 1.86667 1.86667 7.29894 1.86667 14C1.86667 20.7011 7.29894 26.1333 14 26.1333C20.7011 26.1333 26.1333 20.7011 26.1333 14C26.1333 7.29894 20.7011 1.86667 14 1.86667ZM0 14C0 6.26801 6.26801 0 14 0C21.732 0 28 6.26801 28 14C28 21.732 21.732 28 14 28C6.26801 28 0 21.732 0 14Z"
fill="black" />
<path fill-rule="evenodd" clip-rule="evenodd"
d="M14.4005 8.43719C13.7054 8.31795 12.9904 8.44859 12.3823 8.80597C11.7742 9.16335 11.3123 9.7244 11.0782 10.3898C10.9071 10.876 10.3743 11.1315 9.88803 10.9605C9.40177 10.7894 9.14625 10.2566 9.3173 9.77032C9.69765 8.68911 10.4484 7.77739 11.4365 7.19665C12.4247 6.61591 13.5864 6.40363 14.7161 6.5974C15.8458 6.79116 16.8704 7.37848 17.6085 8.25532C18.3465 9.13202 18.7505 10.2416 18.7489 11.3875C18.7485 13.1892 17.4095 14.4125 16.3733 15.1033C15.8267 15.4677 15.2868 15.737 14.8872 15.9146C14.686 16.004 14.5171 16.0716 14.3963 16.1176C14.3358 16.1407 14.2872 16.1584 14.2523 16.1708L14.2105 16.1854L14.1978 16.1898L14.1936 16.1912L14.192 16.1917C14.1917 16.1918 14.1908 16.1921 13.8956 15.3067L14.1908 16.1921C13.7017 16.3552 13.1732 16.0909 13.0102 15.6019C12.8473 15.1133 13.111 14.5853 13.5991 14.4217C13.5988 14.4218 13.5993 14.4216 13.5991 14.4217L13.6 14.4214L13.6032 14.4203L13.627 14.412C13.6495 14.404 13.6851 14.3911 13.7318 14.3733C13.8254 14.3376 13.9627 14.2828 14.1291 14.2088C14.4644 14.0598 14.9045 13.8391 15.3379 13.5501C16.2615 12.9344 16.8823 12.1979 16.8823 11.3867L16.8823 11.3853C16.8833 10.68 16.6347 9.99705 16.1805 9.45745C15.7263 8.91786 15.0957 8.55643 14.4005 8.43719Z"
fill="black" />
<path fill-rule="evenodd" clip-rule="evenodd"
d="M13.0667 20.5333C13.0667 20.0178 13.4845 19.6 14 19.6H14.0131C14.5285 19.6 14.9464 20.0178 14.9464 20.5333C14.9464 21.0488 14.5285 21.4666 14.0131 21.4666H14C13.4845 21.4666 13.0667 21.0488 13.0667 20.5333Z"
fill="black" />
</svg>
</a>
<div
class="group relative cursor-pointer ml-[20px] mr-[35px] group [&_summary::-webkit-details-marker]:hidden">
<div class="relative flex">
<svg xmlns="http://www.w3.org/2000/svg" width="26" height="28" viewBox="0 0 26 28"
fill="none">
<path fill-rule="evenodd" clip-rule="evenodd"
d="M12.6752 4.02515C11.6279 4.02515 10.5909 4.23143 9.62329 4.63221C8.65572 5.03299 7.77656 5.62042 7.03601 6.36097C6.29547 7.10152 5.70803 7.98067 5.30725 8.94825C4.90647 9.91582 4.70019 10.9529 4.70019 12.0001C4.70019 16.6158 3.73241 19.3956 2.80371 21.0002H22.5467C21.618 19.3956 20.6502 16.6158 20.6502 12.0001C20.6502 10.9529 20.4439 9.91582 20.0431 8.94825C19.6423 7.98067 19.0549 7.10152 18.3144 6.36097C17.5738 5.62042 16.6947 5.03299 15.7271 4.63221C14.7595 4.23143 13.7225 4.02515 12.6752 4.02515ZM8.85792 2.78445C10.0681 2.28316 11.3653 2.02515 12.6752 2.02515C13.9851 2.02515 15.2822 2.28316 16.4925 2.78445C17.7027 3.28574 18.8023 4.02049 19.7286 4.94676C20.6548 5.87302 21.3896 6.97266 21.8909 8.18288C22.3922 9.3931 22.6502 10.6902 22.6502 12.0001C22.6502 16.3335 23.557 18.7535 24.2781 19.9991L24.2787 20.0001C24.454 20.3037 24.5464 20.6479 24.5467 20.9984C24.547 21.3489 24.4552 21.6933 24.2805 21.9971C24.1058 22.3009 23.8543 22.5535 23.5512 22.7296C23.2482 22.9056 22.9042 22.9989 22.5537 23.0001L22.5502 23.0001H2.80019L2.79667 23.0001C2.4462 22.9989 2.1022 22.9056 1.79914 22.7296C1.49608 22.5535 1.2446 22.3009 1.0699 21.9971C0.895195 21.6933 0.803401 21.3489 0.803712 20.9984C0.804022 20.6479 0.896425 20.3037 1.07167 20.0001L1.07226 19.9991C1.79338 18.7535 2.70019 16.3335 2.70019 12.0001C2.70019 10.6902 2.9582 9.3931 3.45949 8.18288C3.96078 6.97266 4.69554 5.87302 5.6218 4.94676C6.54806 4.02049 7.6477 3.28574 8.85792 2.78445Z"
fill="black"></path>
<path fill-rule="evenodd" clip-rule="evenodd"
d="M8.67529 21.0001C9.22758 21.0001 9.67529 21.4478 9.67529 22.0001V23.0001C9.67529 23.7958 9.99136 24.5588 10.554 25.1214C11.1166 25.6841 11.8796 26.0001 12.6753 26.0001C13.4709 26.0001 14.234 25.6841 14.7966 25.1214C15.3592 24.5588 15.6753 23.7958 15.6753 23.0001V22.0001C15.6753 21.4478 16.123 21.0001 16.6753 21.0001C17.2276 21.0001 17.6753 21.4478 17.6753 22.0001V23.0001C17.6753 24.3262 17.1485 25.598 16.2108 26.5357C15.2731 27.4733 14.0014 28.0001 12.6753 28.0001C11.3492 28.0001 10.0774 27.4733 9.13976 26.5357C8.20208 25.598 7.67529 24.3262 7.67529 23.0001V22.0001C7.67529 21.4478 8.12301 21.0001 8.67529 21.0001Z"
fill="black"></path>
<path fill-rule="evenodd" clip-rule="evenodd"
d="M18.7546 0.466336C19.0494 -0.000683993 19.667 -0.140291 20.134 0.154515C22.3252 1.5377 24.0937 3.497 25.2459 5.81797C25.4915 6.31265 25.2896 6.91275 24.7949 7.15833C24.3002 7.40391 23.7001 7.20197 23.4545 6.70729C22.4654 4.71495 20.9474 3.03308 19.0664 1.84574C18.5994 1.55094 18.4598 0.933356 18.7546 0.466336Z"
fill="black"></path>
<path fill-rule="evenodd" clip-rule="evenodd"
d="M6.59584 0.466336C6.89064 0.933356 6.75103 1.55094 6.28401 1.84574C4.40308 3.03308 2.885 4.71495 1.89592 6.70729C1.65034 7.20197 1.05024 7.40391 0.555559 7.15833C0.0608782 6.91275 -0.141057 6.31265 0.104523 5.81797C1.25675 3.497 3.02523 1.5377 5.21643 0.154515C5.68345 -0.140291 6.30103 -0.000683993 6.59584 0.466336Z"
fill="black"></path>
</svg>
<span
class="absolute bg-[#E00000] font-[500] h-[17px] leading-[17px] note right-[-5px] rounded-lg text-[#fff] text-[13px] text-center top-[-3px] w-[17px]">0</span>
</div>
<div
class="group-hover:opacity-[1] group-hover:z-[1] opacity-0 absolute bg-white leading-[30px] note-list shadow whitespace-nowrap z-[-1] rounded-[4px] right-[-10px]">
<a href=""> Menu title </a>
<a href=""> Menu title </a>
<a href=""> Menu title </a>
<a href=""> Menu title </a>
</div>
</div>
<div class="group relative cursor-pointer group [&_summary::-webkit-details-marker]:hidden">
<div class="flex items-center">
<p class="m-0 mr-[10px]"> ducdt@hurasoft.com </p>
<img src="https://via.placeholder.com/72x72"
class="block rounded-[50%] w-[36px] h-[36px] mr-[8px]" />
<svg xmlns="http://www.w3.org/2000/svg" width="8" height="6" viewBox="0 0 8 6" fill="none">
<path
d="M4.00078 6C3.83058 5.99914 3.66272 5.96041 3.50935 5.88661C3.35599 5.81281 3.22098 5.7058 3.11411 5.57333L0.307445 2.17333C0.143441 1.96865 0.0402359 1.722 0.00958995 1.46151C-0.021056 1.20102 0.0220901 0.937162 0.134112 0.7C0.224965 0.493884 0.373227 0.318276 0.561191 0.194148C0.749155 0.0700212 0.968876 0.00262204 1.19411 0H6.80744C7.03268 0.00262204 7.2524 0.0700212 7.44037 0.194148C7.62833 0.318276 7.77659 0.493884 7.86744 0.7C7.97947 0.937162 8.02261 1.20102 7.99197 1.46151C7.96132 1.722 7.85812 1.96865 7.69411 2.17333L4.88744 5.57333C4.78058 5.7058 4.64557 5.81281 4.4922 5.88661C4.33884 5.96041 4.17097 5.99914 4.00078 6Z"
fill="#C9C9C9" />
</svg>
</div>
<div
class="group-hover:opacity-[1] group-hover:z-[1] opacity-0 absolute bg-white leading-[30px] note-list shadow whitespace-nowrap z-[-1] rounded-[4px] right-0">
<a href="">Đổi mật khẩu</a>
<a href="">Thoát quản trị</a>
</div>
</div>
</div>
</div>
<div class="w-[100%]">
<div class="breadcrumb-global flex align-items px-[15px] py-[10px]">
<a href="/" class="item">
<span>Danh sách sản phẩm</span>
</a>
<span class="px-[5px]">></span>
<a href="" class="item">
<span class="text-[#0041E8]">Form thêm/Sửa sản phẩm</span>
</a>
</div>
<div class="w-[1141px] m-auto">
<div
class="title py-[15px] bg-white rounded-[10px] text-center mt-[40px] mb-[15px] font-bold text-[18px] shadow-[0_1px_1px_0_rgba(0,0,0,0.1)]">
Cập nhật: Máy in mã vạch MH241 (ID: 2105)</div>
<div class="flex">
<div class="left w-[273px] mr-[15px]">
<div class="bg-white rounded-[10px] shadow-[0_1px_1px_0_rgba(0,0,0,0.1)]">
<a href="" class="py-[7px] px-[15px] text-white bg-[#0041E8] block rounded-t-[10px]">Cơ
bản</a>
<a href=""
class="py-[7px] px-[15px] text-[#919699] block border-b-[1px] border-[#fafafb]">Danh
mục</a>
<a href=""
class="py-[7px] px-[15px] text-[#919699] block border-b-[1px] border-[#fafafb]">SEO</a>
<a href=""
class="py-[7px] px-[15px] text-[#919699] block border-b-[1px] border-[#fafafb]">Mô
tả</a>
<a href=""
class="py-[7px] px-[15px] text-[#919699] block border-b-[1px] border-[#fafafb]">Thông
số</a>
<a href=""
class="py-[7px] px-[15px] text-[#919699] block border-b-[1px] border-[#fafafb]">Ảnh</a>
<a href=""
class="py-[7px] px-[15px] text-[#919699] block border-b-[1px] border-[#fafafb]">Cấu
hình</a>
<a href=""
class="py-[7px] px-[15px] text-[#919699] block border-b-[1px] border-[#fafafb]">Phụ
kiện</a>
<a href=""
class="py-[7px] px-[15px] text-[#919699] block border-b-[1px] border-[#fafafb]">Youtobe</a>
<a href=""
class="py-[7px] px-[15px] text-[#919699] block border-b-[1px] border-[#fafafb]">Tags</a>
<a href="" class="py-[7px] px-[15px] text-[#919699] block">Nội dung liên
quan</a>
</div>
</div>
<div class="right w-[852px]">
<div
class="bg-white rounded-[15px] shadow-[0_1px_1px_0_rgba(0,0,0,0.1)] py-[18px] px-[16px]">
<div class="info-product">
<b>1. Thông tin cơ bản</b>
<div class="flex items-center mb-[12px]">
<label for="" class="w-[210px] mr-[15px]">Đặt tên Sản phẩm</label>
<input type="text" value="Máy in mã vạch MH241" placeholder="Đặt tên sản phẩm"
class="w-[440px] border-[1px] border-[#D8D8D8] py-[6px] px-[10px] rounded-[4px] shadow-[0_2px_4px_0_rgba(0,0,0,0.12)] mr-[10px]">
<div class="box-note">
<svg xmlns="http://www.w3.org/2000/svg" width="15" height="15"
viewBox="0 0 13 13" fill="none">
<path fill-rule="evenodd" clip-rule="evenodd"
d="M6.5 1.18182C3.56285 1.18182 1.18182 3.56285 1.18182 6.5C1.18182 9.43715 3.56285 11.8182 6.5 11.8182C9.43715 11.8182 11.8182 9.43715 11.8182 6.5C11.8182 3.56285 9.43715 1.18182 6.5 1.18182ZM0 6.5C0 2.91015 2.91015 0 6.5 0C10.0899 0 13 2.91015 13 6.5C13 10.0899 10.0899 13 6.5 13C2.91015 13 0 10.0899 0 6.5Z"
fill="#FFC700" />
<path fill-rule="evenodd" clip-rule="evenodd"
d="M6.65259 4.15075C6.37751 4.10356 6.09461 4.15526 5.85399 4.29667C5.61337 4.43808 5.43056 4.66009 5.33795 4.92338C5.22965 5.23123 4.89229 5.39301 4.58443 5.28471C4.27658 5.17641 4.1148 4.83905 4.2231 4.5312C4.40833 4.00463 4.77395 3.56061 5.25518 3.27779C5.73642 2.99496 6.30223 2.89157 6.85239 2.98594C7.40255 3.08031 7.90156 3.36634 8.26104 3.79337C8.62044 4.22032 8.81718 4.76066 8.81643 5.31873C8.81617 6.22303 8.14571 6.82022 7.66694 7.13941C7.40952 7.31102 7.1563 7.4372 6.96978 7.52011C6.87567 7.56193 6.79643 7.59367 6.73933 7.61542C6.71073 7.62631 6.68754 7.63476 6.67066 7.64076L6.65014 7.64795L6.64361 7.65018L6.6413 7.65096L6.6404 7.65126C6.6404 7.65126 6.63966 7.65151 6.4528 7.09092L6.63966 7.65151C6.33005 7.75471 5.99541 7.58739 5.89221 7.27778C5.78908 6.96839 5.95611 6.63398 6.26532 6.53054L6.26456 6.5308L6.26532 6.53054L6.27474 6.52723C6.28383 6.524 6.29873 6.5186 6.31861 6.51103C6.35845 6.49585 6.4177 6.47219 6.48979 6.44015C6.63565 6.37532 6.82562 6.27992 7.01138 6.15607C7.41887 5.88441 7.63461 5.59541 7.63461 5.31819L7.63461 5.31731C7.63503 5.03822 7.53666 4.76798 7.35692 4.55446C7.17718 4.34095 6.92767 4.19793 6.65259 4.15075Z"
fill="#FFC700" />
<path fill-rule="evenodd" clip-rule="evenodd"
d="M5.90909 9.45455C5.90909 9.12819 6.17365 8.86364 6.5 8.86364H6.50591C6.83226 8.86364 7.09682 9.12819 7.09682 9.45455C7.09682 9.7809 6.83226 10.0455 6.50591 10.0455H6.5C6.17365 10.0455 5.90909 9.7809 5.90909 9.45455Z"
fill="#FFC700" />
</svg>
</div>
</div>
<div class="flex items-center mb-[12px]">
<label for="" class="w-[210px] mr-[15px]">Model (nếu có)</label>
<input type="text" value="MH241" placeholder="Model (nếu có)"
class="w-[440px] border-[1px] border-[#D8D8D8] py-[6px] px-[10px] rounded-[4px] shadow-[0_2px_4px_0_rgba(0,0,0,0.12)] mr-[10px]">
<div class="box-note">
<svg xmlns="http://www.w3.org/2000/svg" width="15" height="15"
viewBox="0 0 13 13" fill="none">
<path fill-rule="evenodd" clip-rule="evenodd"
d="M6.5 1.18182C3.56285 1.18182 1.18182 3.56285 1.18182 6.5C1.18182 9.43715 3.56285 11.8182 6.5 11.8182C9.43715 11.8182 11.8182 9.43715 11.8182 6.5C11.8182 3.56285 9.43715 1.18182 6.5 1.18182ZM0 6.5C0 2.91015 2.91015 0 6.5 0C10.0899 0 13 2.91015 13 6.5C13 10.0899 10.0899 13 6.5 13C2.91015 13 0 10.0899 0 6.5Z"
fill="#FFC700" />
<path fill-rule="evenodd" clip-rule="evenodd"
d="M6.65259 4.15075C6.37751 4.10356 6.09461 4.15526 5.85399 4.29667C5.61337 4.43808 5.43056 4.66009 5.33795 4.92338C5.22965 5.23123 4.89229 5.39301 4.58443 5.28471C4.27658 5.17641 4.1148 4.83905 4.2231 4.5312C4.40833 4.00463 4.77395 3.56061 5.25518 3.27779C5.73642 2.99496 6.30223 2.89157 6.85239 2.98594C7.40255 3.08031 7.90156 3.36634 8.26104 3.79337C8.62044 4.22032 8.81718 4.76066 8.81643 5.31873C8.81617 6.22303 8.14571 6.82022 7.66694 7.13941C7.40952 7.31102 7.1563 7.4372 6.96978 7.52011C6.87567 7.56193 6.79643 7.59367 6.73933 7.61542C6.71073 7.62631 6.68754 7.63476 6.67066 7.64076L6.65014 7.64795L6.64361 7.65018L6.6413 7.65096L6.6404 7.65126C6.6404 7.65126 6.63966 7.65151 6.4528 7.09092L6.63966 7.65151C6.33005 7.75471 5.99541 7.58739 5.89221 7.27778C5.78908 6.96839 5.95611 6.63398 6.26532 6.53054L6.26456 6.5308L6.26532 6.53054L6.27474 6.52723C6.28383 6.524 6.29873 6.5186 6.31861 6.51103C6.35845 6.49585 6.4177 6.47219 6.48979 6.44015C6.63565 6.37532 6.82562 6.27992 7.01138 6.15607C7.41887 5.88441 7.63461 5.59541 7.63461 5.31819L7.63461 5.31731C7.63503 5.03822 7.53666 4.76798 7.35692 4.55446C7.17718 4.34095 6.92767 4.19793 6.65259 4.15075Z"
fill="#FFC700" />
<path fill-rule="evenodd" clip-rule="evenodd"
d="M5.90909 9.45455C5.90909 9.12819 6.17365 8.86364 6.5 8.86364H6.50591C6.83226 8.86364 7.09682 9.12819 7.09682 9.45455C7.09682 9.7809 6.83226 10.0455 6.50591 10.0455H6.5C6.17365 10.0455 5.90909 9.7809 5.90909 9.45455Z"
fill="#FFC700" />
</svg>
</div>
</div>
<div class="flex items-center mb-[12px]">
<label for="" class="w-[210px] mr-[15px]">Mã kho hàng - SKU (nếu có)</label>
<input type="text" value="MH241" placeholder="Mã kho hàng - SKU (nếu có)"
class="w-[440px] border-[1px] border-[#D8D8D8] py-[6px] px-[10px] rounded-[4px] shadow-[0_2px_4px_0_rgba(0,0,0,0.12)] mr-[10px]">
<div class="box-note">
<svg xmlns="http://www.w3.org/2000/svg" width="15" height="15"
viewBox="0 0 13 13" fill="none">
<path fill-rule="evenodd" clip-rule="evenodd"
d="M6.5 1.18182C3.56285 1.18182 1.18182 3.56285 1.18182 6.5C1.18182 9.43715 3.56285 11.8182 6.5 11.8182C9.43715 11.8182 11.8182 9.43715 11.8182 6.5C11.8182 3.56285 9.43715 1.18182 6.5 1.18182ZM0 6.5C0 2.91015 2.91015 0 6.5 0C10.0899 0 13 2.91015 13 6.5C13 10.0899 10.0899 13 6.5 13C2.91015 13 0 10.0899 0 6.5Z"
fill="#FFC700" />
<path fill-rule="evenodd" clip-rule="evenodd"
d="M6.65259 4.15075C6.37751 4.10356 6.09461 4.15526 5.85399 4.29667C5.61337 4.43808 5.43056 4.66009 5.33795 4.92338C5.22965 5.23123 4.89229 5.39301 4.58443 5.28471C4.27658 5.17641 4.1148 4.83905 4.2231 4.5312C4.40833 4.00463 4.77395 3.56061 5.25518 3.27779C5.73642 2.99496 6.30223 2.89157 6.85239 2.98594C7.40255 3.08031 7.90156 3.36634 8.26104 3.79337C8.62044 4.22032 8.81718 4.76066 8.81643 5.31873C8.81617 6.22303 8.14571 6.82022 7.66694 7.13941C7.40952 7.31102 7.1563 7.4372 6.96978 7.52011C6.87567 7.56193 6.79643 7.59367 6.73933 7.61542C6.71073 7.62631 6.68754 7.63476 6.67066 7.64076L6.65014 7.64795L6.64361 7.65018L6.6413 7.65096L6.6404 7.65126C6.6404 7.65126 6.63966 7.65151 6.4528 7.09092L6.63966 7.65151C6.33005 7.75471 5.99541 7.58739 5.89221 7.27778C5.78908 6.96839 5.95611 6.63398 6.26532 6.53054L6.26456 6.5308L6.26532 6.53054L6.27474 6.52723C6.28383 6.524 6.29873 6.5186 6.31861 6.51103C6.35845 6.49585 6.4177 6.47219 6.48979 6.44015C6.63565 6.37532 6.82562 6.27992 7.01138 6.15607C7.41887 5.88441 7.63461 5.59541 7.63461 5.31819L7.63461 5.31731C7.63503 5.03822 7.53666 4.76798 7.35692 4.55446C7.17718 4.34095 6.92767 4.19793 6.65259 4.15075Z"
fill="#FFC700" />
<path fill-rule="evenodd" clip-rule="evenodd"
d="M5.90909 9.45455C5.90909 9.12819 6.17365 8.86364 6.5 8.86364H6.50591C6.83226 8.86364 7.09682 9.12819 7.09682 9.45455C7.09682 9.7809 6.83226 10.0455 6.50591 10.0455H6.5C6.17365 10.0455 5.90909 9.7809 5.90909 9.45455Z"
fill="#FFC700" />
</svg>
</div>
</div>
<div class="flex items-center mb-[12px]">
<label for="" class="w-[210px] mr-[15px]">Trọng lượng (tính phí
shipping)</label>
<input type="text" value="0" placeholder="Trọng lượng (tính phí shipping)"
class="w-[440px] border-[1px] border-[#D8D8D8] py-[6px] px-[10px] rounded-[4px] shadow-[0_2px_4px_0_rgba(0,0,0,0.12)] mr-[10px]">
<div class="box-note flex items-center">
<span class="mr-[10px]">gram</span>
<svg xmlns="http://www.w3.org/2000/svg" width="15" height="15"
viewBox="0 0 13 13" fill="none">
<path fill-rule="evenodd" clip-rule="evenodd"
d="M6.5 1.18182C3.56285 1.18182 1.18182 3.56285 1.18182 6.5C1.18182 9.43715 3.56285 11.8182 6.5 11.8182C9.43715 11.8182 11.8182 9.43715 11.8182 6.5C11.8182 3.56285 9.43715 1.18182 6.5 1.18182ZM0 6.5C0 2.91015 2.91015 0 6.5 0C10.0899 0 13 2.91015 13 6.5C13 10.0899 10.0899 13 6.5 13C2.91015 13 0 10.0899 0 6.5Z"
fill="#FFC700" />
<path fill-rule="evenodd" clip-rule="evenodd"
d="M6.65259 4.15075C6.37751 4.10356 6.09461 4.15526 5.85399 4.29667C5.61337 4.43808 5.43056 4.66009 5.33795 4.92338C5.22965 5.23123 4.89229 5.39301 4.58443 5.28471C4.27658 5.17641 4.1148 4.83905 4.2231 4.5312C4.40833 4.00463 4.77395 3.56061 5.25518 3.27779C5.73642 2.99496 6.30223 2.89157 6.85239 2.98594C7.40255 3.08031 7.90156 3.36634 8.26104 3.79337C8.62044 4.22032 8.81718 4.76066 8.81643 5.31873C8.81617 6.22303 8.14571 6.82022 7.66694 7.13941C7.40952 7.31102 7.1563 7.4372 6.96978 7.52011C6.87567 7.56193 6.79643 7.59367 6.73933 7.61542C6.71073 7.62631 6.68754 7.63476 6.67066 7.64076L6.65014 7.64795L6.64361 7.65018L6.6413 7.65096L6.6404 7.65126C6.6404 7.65126 6.63966 7.65151 6.4528 7.09092L6.63966 7.65151C6.33005 7.75471 5.99541 7.58739 5.89221 7.27778C5.78908 6.96839 5.95611 6.63398 6.26532 6.53054L6.26456 6.5308L6.26532 6.53054L6.27474 6.52723C6.28383 6.524 6.29873 6.5186 6.31861 6.51103C6.35845 6.49585 6.4177 6.47219 6.48979 6.44015C6.63565 6.37532 6.82562 6.27992 7.01138 6.15607C7.41887 5.88441 7.63461 5.59541 7.63461 5.31819L7.63461 5.31731C7.63503 5.03822 7.53666 4.76798 7.35692 4.55446C7.17718 4.34095 6.92767 4.19793 6.65259 4.15075Z"
fill="#FFC700" />
<path fill-rule="evenodd" clip-rule="evenodd"
d="M5.90909 9.45455C5.90909 9.12819 6.17365 8.86364 6.5 8.86364H6.50591C6.83226 8.86364 7.09682 9.12819 7.09682 9.45455C7.09682 9.7809 6.83226 10.0455 6.50591 10.0455H6.5C6.17365 10.0455 5.90909 9.7809 5.90909 9.45455Z"
fill="#FFC700" />
</svg>
</div>
</div>
<div class="flex items-center mb-[12px]">
<label for="" class="w-[210px] mr-[15px]">Thương hiệu</label>
<select name="" id=""
class="w-[215px] border-[1px] border-[#D8D8D8] py-[6px] px-[10px] rounded-[4px] shadow-[0_2px_4px_0_rgba(0,0,0,0.12)] mr-[10px]">
<option value="">Chọn thương hiệu</option>
<option value="">ABS</option>
</select>
<div class="box-note flex items-center">
<span class="mr-[10px] text-[#0041E8]">Quản lý thương hiệu</span>
</div>
</div>
<div class="flex items-center mb-[12px]">
<label for="" class="w-[210px] mr-[15px]">Tóm tắt đặc tính chính</label>
<textarea name="" id="" placeholder="Nhập tóm tắt đặt tính chính"
class="w-[440px] border-[1px] border-[#D8D8D8] py-[6px] px-[10px] rounded-[4px] shadow-[0_2px_4px_0_rgba(0,0,0,0.12)] mr-[10px] h-[75px]"></textarea>
</div>
<div class="flex items-center mb-[12px]">
<label for="" class="w-[210px] mr-[15px]">Phụ kiện đi kèm</label>
<input type="text" value="Test" placeholder="Phụ kiện đi kèm"
class="w-[440px] border-[1px] border-[#D8D8D8] py-[6px] px-[10px] rounded-[4px] shadow-[0_2px_4px_0_rgba(0,0,0,0.12)] mr-[10px]">
</div>
</div>
<div class="product-sale-info mt-[25px]">
<b>1. Thông tin cơ bản</b>
<table class="mt-[10px] w-[100%] border-[1px]">
<tr>
<td class="w-[216px]">Giá bán lẻ</td>
<td>
<div class="flex items-center">
<input type="text" value="0" placeholder="Giá sản phẩm"
class="w-[176px] border-[1px] border-[#D8D8D8] py-[6px] px-[10px] rounded-[4px] shadow-[0_2px_4px_0_rgba(0,0,0,0.12)] mr-[10px]">
<select name="" id=""
class="w-[88px] border-[1px] border-[#D8D8D8] py-[6px] px-[10px] rounded-[4px] shadow-[0_2px_4px_0_rgba(0,0,0,0.12)] mx-[15px] ">
<option value="">VNĐ</option>
</select>
<span>/</span>
<select name="" id=""
class="w-[88px] border-[1px] border-[#D8D8D8] py-[6px] px-[10px] rounded-[4px] shadow-[0_2px_4px_0_rgba(0,0,0,0.12)] mx-[15px] ">
<option value="">Chiếc</option>
</select>
</div>
<div class="flex items-center pt-[8px]">
<i>(* Nếu dùng USD thì theo chuẩn quốc tế v.d. $134.05).</i>
<span>Tỷ giá:</span>
<b>1</b>
<a href="" class="ml-[5px]">
<svg xmlns="http://www.w3.org/2000/svg" width="12" height="13"
viewBox="0 0 12 13" fill="none">
<path fill-rule="evenodd" clip-rule="evenodd"
d="M6.67307 0.173073C6.90384 -0.0576911 7.27798 -0.0576911 7.50875 0.173073L9.87238 2.53671C10.1031 2.76747 10.1031 3.14162 9.87238 3.37238L3.37238 9.87238C3.26156 9.9832 3.11126 10.0455 2.95455 10.0455H0.590909C0.264559 10.0455 0 9.7809 0 9.45455V7.09091C0 6.93419 0.0622563 6.78389 0.173073 6.67307L6.67307 0.173073ZM1.18182 7.33567V8.86364H2.70978L8.61887 2.95455L7.09091 1.42658L1.18182 7.33567Z"
fill="#0041E8" />
<path fill-rule="evenodd" clip-rule="evenodd"
d="M0 12.4091C0 12.0828 0.264559 11.8182 0.590909 11.8182H11.2273C11.5536 11.8182 11.8182 12.0828 11.8182 12.4091C11.8182 12.7355 11.5536 13.0001 11.2273 13.0001H0.590909C0.264559 13.0001 0 12.7355 0 12.4091Z"
fill="#0041E8" />
</svg>
</a>
</div>
</td>
</tr>
<tr>
<td>Thuế VAT</td>
<td class="flex items-center">
<span class="mr-[20px]">Giá bán</span>
<div class="flex items-center mr-[20px]">
<div class="flex items-center mr-[30px]">
<input type="radio" name="tax_vat" value="0" checked>
<label for="" class="ml-[25px]">Không hiển thị VAT</label>
</div>
<div class="flex items-center mr-[20px]">
<input type="radio" name="tax_vat" value="1">
<label for="" class="ml-[25px]">Không hiển thị VAT</label>
</div>
<div class="flex items-center">
<input type="radio" name="tax_vat" value="2">
<label for="" class="ml-[25px]">Chưa có VAT</label>
</div>
</div>
</td>
</tr>
<tr>
<td>Giá nhập hàng</td>
<td>
<div class="flex items-center">
<input type="text" value="0" placeholder="Giá sản phẩm"
class="w-[176px] border-[1px] border-[#D8D8D8] py-[6px] px-[10px] rounded-[4px] shadow-[0_2px_4px_0_rgba(0,0,0,0.12)] mr-[10px]">
<span>vnd (để tham khảo khi cần)</span>
</div>
</td>
</tr>
<tr>
<td>Giá thị trường</td>
<td>
<div class="flex items-center">
<input type="text" value="0" placeholder="Giá sản phẩm"
class="w-[176px] border-[1px] border-[#D8D8D8] py-[6px] px-[10px] rounded-[4px] shadow-[0_2px_4px_0_rgba(0,0,0,0.12)] mr-[10px]">
<span>vnd (để tham khảo khi cần)</span>
</div>
</td>
</tr>
<tr>
<td>Số lượng kho hàng</td>
<td>
<div class="flex items-center">
<input type="text" value="0" placeholder="Giá sản phẩm"
class="w-[176px] border-[1px] border-[#D8D8D8] py-[6px] px-[10px] rounded-[4px] shadow-[0_2px_4px_0_rgba(0,0,0,0.12)] mr-[10px]">
</div>
</td>
</tr>
<tr>
<td>Khuyến mại riêng</td>
<td>
<textarea type="text" placeholder="Nhập khuyến mại riêng"
class="w-[442px] h-[76px] border-[1px] border-[#D8D8D8] py-[6px] px-[10px] rounded-[4px] shadow-[0_2px_4px_0_rgba(0,0,0,0.12)] mr-[10px]"></textarea>
</td>
</tr>
<tr>
<td>Khuyến mại riêng</td>
<td>
<textarea type="text" placeholder="Nhập khuyến mại riêng"
class="w-[442px] h-[35px] border-[1px] border-[#D8D8D8] py-[6px] px-[10px] rounded-[4px] shadow-[0_2px_4px_0_rgba(0,0,0,0.12)] mr-[10px]"></textarea>
</td>
</tr>
<tr>
<td>Tình trạng (Mới / Cũ)</td>
<td>
<input type="text" value="" placeholder=""
class="w-[176px] border-[1px] border-[#D8D8D8] py-[6px] px-[10px] rounded-[4px] shadow-[0_2px_4px_0_rgba(0,0,0,0.12)] mr-[10px]">
</td>
</tr>
<tr>
<td>Hiển thị</td>
<td>
<div class="flex items-center">
<div class="flex items-center mr-[30px]">
<input type="radio" name="info[status]" value="1" checked>
<label for="" class="ml-[25px]">Cho hiển thị</label>
</div>
<div class="flex items-center mr-[20px]">
<input type="radio" name="info[status]" value="0">
<label for="" class="ml-[25px]">Ẩn hiển thị</label>
</div>
</div>
</td>
</tr>
</table>
<input
class="btn w-[82px] h-[32px] bg-[#0041E8] rounded-[4px] mt-[10px] text-white cursor-pointer"
name="commit" type="submit" value="Cập nhật">
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- end -->
</div>
<!-- Script -->
<script src="https://cdn.jsdelivr.net/npm/jquery@3.3.1/dist/jquery.min.js"></script>
</body>
</html>

99
scss/pc_style.css
View File

@@ -1,18 +1,27 @@
*, ::after, ::before { *,
::after,
::before {
box-sizing: border-box; box-sizing: border-box;
} }
button, input, select { button,
input,
select {
outline: none !important; outline: none !important;
color: #000; color: #000;
border-radius: 0; border-radius: 0;
} }
button, input { button,
input {
overflow: visible; overflow: visible;
} }
button, input, optgroup, select, textarea { button,
input,
optgroup,
select,
textarea {
margin: 0; margin: 0;
font-family: inherit; font-family: inherit;
font-size: inherit; font-size: inherit;
@@ -20,7 +29,8 @@ button, input, optgroup, select, textarea {
border-radius: 0; border-radius: 0;
} }
input::-webkit-outer-spin-button, input::-webkit-inner-spin-button { input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
-webkit-appearance: none; -webkit-appearance: none;
} }
@@ -31,7 +41,7 @@ input[type=number] {
body { body {
color: #000; color: #000;
font-family: "Inter", sans-serif; font-family: "Inter", sans-serif;
background: #FAFAFB; background: #fafafb;
position: relative; position: relative;
font-size: 14px; font-size: 14px;
word-break: break-word; word-break: break-word;
@@ -127,7 +137,7 @@ a {
.admin-menu-container { .admin-menu-container {
position: relative; position: relative;
overflow: auto; overflow: auto;
background: #004E99; background: #004e99;
color: #fff; color: #fff;
width: 16%; width: 16%;
padding: 20px 0; padding: 20px 0;
@@ -151,7 +161,7 @@ a {
transform: rotate(90deg); transform: rotate(90deg);
} }
.admin-menu-container details[open] summary { .admin-menu-container details[open] summary {
background: #81B5E4; background: #81b5e4;
} }
.admin-menu-container details[open] summary a { .admin-menu-container details[open] summary a {
font-weight: 700; font-weight: 700;
@@ -188,7 +198,7 @@ a {
border-radius: 4px; border-radius: 4px;
} }
.admin-menu-container .item:hover { .admin-menu-container .item:hover {
background: #81B5E4; background: #81b5e4;
} }
.admin-menu-container .item:hover .icons { .admin-menu-container .item:hover .icons {
filter: brightness(100); filter: brightness(100);
@@ -204,7 +214,7 @@ a {
content: ""; content: "";
width: 1px; width: 1px;
height: calc(100% - 39px); height: calc(100% - 39px);
background: #79B0E2; background: #79b0e2;
position: absolute; position: absolute;
left: 20px; left: 20px;
top: 20px; top: 20px;
@@ -222,7 +232,7 @@ a {
width: 8px; width: 8px;
height: 8px; height: 8px;
border-radius: 50%; border-radius: 50%;
background: #79B0E2; background: #79b0e2;
position: absolute; position: absolute;
top: 6px; top: 6px;
left: -28px; left: -28px;
@@ -283,7 +293,7 @@ a {
position: relative; position: relative;
} }
.admin-menu .item:hover { .admin-menu .item:hover {
background: #81B5E4; background: #81b5e4;
} }
.admin-menu .item:hover .icons { .admin-menu .item:hover .icons {
filter: brightness(100); filter: brightness(100);
@@ -296,7 +306,7 @@ a {
.admin-menu .sub-menu { .admin-menu .sub-menu {
padding: 10px 22px 10px 15px; padding: 10px 22px 10px 15px;
border-radius: 6px; border-radius: 6px;
background: #004E99; background: #004e99;
box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.25); box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.25);
white-space: nowrap; white-space: nowrap;
min-width: 150px; min-width: 150px;
@@ -323,7 +333,7 @@ a {
width: 8px; width: 8px;
height: 8px; height: 8px;
border-radius: 50%; border-radius: 50%;
background: #79B0E2; background: #79b0e2;
position: absolute; position: absolute;
top: 6px; top: 6px;
left: -18px; left: -18px;
@@ -339,7 +349,7 @@ a {
.admin-menu .menu-list::before { .admin-menu .menu-list::before {
content: ""; content: "";
width: 1.5px; width: 1.5px;
background: #79B0E2; background: #79b0e2;
position: absolute; position: absolute;
left: 1px; left: 1px;
top: 7px; top: 7px;
@@ -397,8 +407,8 @@ a {
transition: 0.2s all; transition: 0.2s all;
} }
.admin-content-container .note-list a:hover { .admin-content-container .note-list a:hover {
background: #F5F7FF; background: #f5f7ff;
color: #0041E8; color: #0041e8;
font-weight: 600; font-weight: 600;
} }
.admin-content-container .content-holder { .admin-content-container .content-holder {
@@ -410,7 +420,7 @@ a {
} }
.table-fixed td { .table-fixed td {
padding: 13px 8px; padding: 13px 8px;
border: 1px solid #ECECEC; border: 1px solid #ececec;
} }
.table-fixed tbody td { .table-fixed tbody td {
padding: 5px 8px; padding: 5px 8px;
@@ -419,24 +429,24 @@ a {
text-align: left; text-align: left;
} }
.table-fixed tbody td:nth-child(2) { .table-fixed tbody td:nth-child(2) {
color: #0041E8; color: #0041e8;
} }
.admin-home-tab { .admin-home-tab {
overflow: auto; overflow: auto;
} }
.admin-home-tab a { .admin-home-tab a {
color: #A0A8B5; color: #a0a8b5;
padding: 9px 7.7px; padding: 9px 7.7px;
text-align: center; text-align: center;
border-right: 1px solid #DDE1EB; border-right: 1px solid #dde1eb;
white-space: nowrap; white-space: nowrap;
} }
.admin-home-tab a:last-child { .admin-home-tab a:last-child {
border: 0; border: 0;
} }
.admin-home-tab a:hover, .admin-home-tab a.current { .admin-home-tab a:hover, .admin-home-tab a.current {
background: #0041E8; background: #0041e8;
color: #fff; color: #fff;
} }
@@ -453,7 +463,7 @@ a {
font-weight: 500; font-weight: 500;
} }
.home-report-holder td { .home-report-holder td {
border: 1px solid #ECECEC; border: 1px solid #ececec;
padding: 14px 5px; padding: 14px 5px;
} }
.home-report-holder td a { .home-report-holder td a {
@@ -472,4 +482,47 @@ a {
} }
.home-todo-list td:nth-child(1), .home-todo-list td:nth-child(3), .home-todo-list td:nth-child(4) { .home-todo-list td:nth-child(1), .home-todo-list td:nth-child(3), .home-todo-list td:nth-child(4) {
white-space: nowrap; white-space: nowrap;
}
.product-list th {
padding: 10px;
border: 1px solid #ececec;
background: #f6f6f6;
}
.product-list td {
padding: 8px;
border: 1px solid #ececec;
}
.product-sale-info td {
padding: 14px;
border: 1px solid #ececec;
}
input[type=radio] {
position: absolute;
}
input[type=radio]:before {
content: "";
background: #fff;
border-radius: 100%;
border: 1.5px solid #0041e8;
display: inline-block;
width: 20px;
height: 20px;
position: relative;
top: -0.2em;
margin-right: 1em;
vertical-align: top;
cursor: pointer;
text-align: center;
transition: all 250ms ease;
}
input[type=radio]:checked:before {
background-color: #0041e8;
box-shadow: inset 0 0 0 4px #fff;
}
input[type=radio]:focus:before {
outline: none;
border-color: #0041e8;
}/*# sourceMappingURL=pc_style.css.map */ }/*# sourceMappingURL=pc_style.css.map */

2
scss/pc_style.css.map
View File

@@ -1 +1 @@
{"version":3,"sources":["pc_style.scss","pc_style.css"],"names":[],"mappings":"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","file":"pc_style.css"} {"version":3,"sources":["pc_style.scss","pc_style.css"],"names":[],"mappings":"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","file":"pc_style.css"}

304
scss/pc_style.scss
View File

@@ -1,13 +1,41 @@
*, ::after, ::before {box-sizing: border-box;} *,
button,input,select{outline:none!important;color:#000;border-radius:0} ::after,
button, input {overflow: visible;} ::before {
button, input, optgroup, select, textarea {margin: 0;font-family: inherit;font-size: inherit;line-height: inherit;border-radius: 0;} box-sizing: border-box;
input::-webkit-outer-spin-button, input::-webkit-inner-spin-button {-webkit-appearance: none;} }
input[type=number] {-moz-appearance: textfield;} button,
body{ input,
color:#000; select {
font-family: 'Inter', sans-serif; outline: none !important;
background: #FAFAFB; color: #000;
border-radius: 0;
}
button,
input {
overflow: visible;
}
button,
input,
optgroup,
select,
textarea {
margin: 0;
font-family: inherit;
font-size: inherit;
line-height: inherit;
border-radius: 0;
}
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
-webkit-appearance: none;
}
input[type="number"] {
-moz-appearance: textfield;
}
body {
color: #000;
font-family: "Inter", sans-serif;
background: #fafafb;
position: relative; position: relative;
font-size: 14px; font-size: 14px;
word-break: break-word; word-break: break-word;
@@ -16,28 +44,69 @@ body{
line-height: 1.5; line-height: 1.5;
margin: auto; margin: auto;
} }
img{ img {
max-width: 100%; max-width: 100%;
height: auto; height: auto;
} }
a{ a {
text-decoration: none; text-decoration: none;
} }
::-webkit-scrollbar-track{background:#f5f5f5;} ::-webkit-scrollbar-track {
::-webkit-scrollbar-thumb{background: grey;border-radius:5px;} background: #f5f5f5;
::-webkit-scrollbar-thumb:hover{background:#ccc;} }
::-webkit-scrollbar{width: 8px;height:10px;} ::-webkit-scrollbar-thumb {
.clearfix{ background: grey;
&::after{ border-radius: 5px;
content:'';clear:both;display:block }
::-webkit-scrollbar-thumb:hover {
background: #ccc;
}
::-webkit-scrollbar {
width: 8px;
height: 10px;
}
.clearfix {
&::after {
content: "";
clear: both;
display: block;
} }
} }
.inherit{font-size: inherit;font-weight: inherit;line-height: inherit;margin: 0;} .inherit {
.line-clamp-2{text-overflow:ellipsis;-webkit-line-clamp:2;display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden} font-size: inherit;
.line-clamp-3{text-overflow:ellipsis;-webkit-line-clamp:3;display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden} font-weight: inherit;
.line-clamp-4{text-overflow:ellipsis;-webkit-line-clamp:4;display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden} line-height: inherit;
.line-clamp-5{text-overflow:ellipsis;-webkit-line-clamp:5;display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden} margin: 0;
.icons{ }
.line-clamp-2 {
text-overflow: ellipsis;
-webkit-line-clamp: 2;
display: -webkit-box;
-webkit-box-orient: vertical;
overflow: hidden;
}
.line-clamp-3 {
text-overflow: ellipsis;
-webkit-line-clamp: 3;
display: -webkit-box;
-webkit-box-orient: vertical;
overflow: hidden;
}
.line-clamp-4 {
text-overflow: ellipsis;
-webkit-line-clamp: 4;
display: -webkit-box;
-webkit-box-orient: vertical;
overflow: hidden;
}
.line-clamp-5 {
text-overflow: ellipsis;
-webkit-line-clamp: 5;
display: -webkit-box;
-webkit-box-orient: vertical;
overflow: hidden;
}
.icons {
background: url(../images/global-sprite.png) no-repeat; background: url(../images/global-sprite.png) no-repeat;
background-size: 400px 400px; background-size: 400px 400px;
} }
@@ -49,37 +118,37 @@ a{
.admin-menu-container { .admin-menu-container {
position: relative; position: relative;
overflow: auto; overflow: auto;
background: #004E99; background: #004e99;
color: #fff; color: #fff;
width: 16%; width: 16%;
padding: 20px 0; padding: 20px 0;
line-height: 20px; line-height: 20px;
a{ a {
color: #fff; color: #fff;
} }
.menu-logo{ .menu-logo {
display: table; display: table;
margin-bottom: 50px; margin-bottom: 50px;
margin-left: 16px; margin-left: 16px;
img{ img {
height: 22px; height: 22px;
} }
} }
.menu-list{ .menu-list {
margin: 50px 0; margin: 50px 0;
} }
details{ details {
&[open] { &[open] {
svg { svg {
transform: rotate(90deg); transform: rotate(90deg);
} }
summary { summary {
background: #81B5E4; background: #81b5e4;
a{ a {
font-weight: 700; font-weight: 700;
} }
} }
.icons{ .icons {
filter: brightness(100); filter: brightness(100);
} }
} }
@@ -92,8 +161,8 @@ a{
padding-right: 16px; padding-right: 16px;
border-radius: 4px; border-radius: 4px;
position: relative; position: relative;
transition: .3s all; transition: 0.3s all;
a{ a {
padding: 8px 16px; padding: 8px 16px;
display: flex; display: flex;
align-items: center; align-items: center;
@@ -102,18 +171,18 @@ a{
svg { svg {
position: absolute; position: absolute;
right: 16px; right: 16px;
transition: .3s all; transition: 0.3s all;
} }
.item { .item {
display: flex; display: flex;
align-items: center; align-items: center;
padding: 0 16px; padding: 0 16px;
line-height: 36px; line-height: 36px;
transition: .3s all; transition: 0.3s all;
border-radius: 4px; border-radius: 4px;
&:hover{ &:hover {
background: #81B5E4; background: #81b5e4;
.icons{ .icons {
filter: brightness(100); filter: brightness(100);
} }
} }
@@ -124,38 +193,38 @@ a{
.sub-menu { .sub-menu {
padding: 13px 13px 13px 45px; padding: 13px 13px 13px 45px;
position: relative; position: relative;
&::before{ &::before {
content: ""; content: "";
width: 1px; width: 1px;
height: calc(100% - 39px); height: calc(100% - 39px);
background: #79B0E2; background: #79b0e2;
position: absolute; position: absolute;
left: 20px; left: 20px;
top: 20px; top: 20px;
} }
a{ a {
display: block; display: block;
margin-bottom: 15px; margin-bottom: 15px;
position: relative; position: relative;
&:hover{ &:hover {
text-decoration: underline; text-decoration: underline;
} }
&::before{ &::before {
content: ""; content: "";
width: 8px; width: 8px;
height: 8px; height: 8px;
border-radius: 50%; border-radius: 50%;
background: #79B0E2; background: #79b0e2;
position: absolute; position: absolute;
top: 6px; top: 6px;
left: -28px; left: -28px;
} }
&:last-child{ &:last-child {
margin: 0; margin: 0;
} }
} }
} }
.icons{ .icons {
width: 20px; width: 20px;
height: 20px; height: 20px;
margin-right: 13px; margin-right: 13px;
@@ -203,11 +272,11 @@ a{
.item { .item {
display: flex; display: flex;
align-items: center; align-items: center;
transition: .3s all; transition: 0.3s all;
position: relative; position: relative;
&:hover{ &:hover {
background: #81B5E4; background: #81b5e4;
.icons{ .icons {
filter: brightness(100); filter: brightness(100);
} }
.sub-menu { .sub-menu {
@@ -220,37 +289,37 @@ a{
.sub-menu { .sub-menu {
padding: 10px 22px 10px 15px; padding: 10px 22px 10px 15px;
border-radius: 6px; border-radius: 6px;
background: #004E99; background: #004e99;
box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.25); box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.25);
white-space: nowrap; white-space: nowrap;
min-width: 150px; min-width: 150px;
z-index: -1; z-index: -1;
transition: .2s all; transition: 0.2s all;
position: absolute; position: absolute;
left: calc(100% + 30px); left: calc(100% + 30px);
top: 0; top: 0;
opacity: 0; opacity: 0;
visibility: hidden; visibility: hidden;
min-width: 200px; min-width: 200px;
a{ a {
display: block; display: block;
margin-bottom: 12px; margin-bottom: 12px;
line-height: 18px; line-height: 18px;
position: relative; position: relative;
&:hover{ &:hover {
text-decoration: underline; text-decoration: underline;
} }
&::before{ &::before {
content: ""; content: "";
width: 8px; width: 8px;
height: 8px; height: 8px;
border-radius: 50%; border-radius: 50%;
background: #79B0E2; background: #79b0e2;
position: absolute; position: absolute;
top: 6px; top: 6px;
left: -18px; left: -18px;
} }
&:last-child{ &:last-child {
margin: 0; margin: 0;
} }
} }
@@ -259,17 +328,17 @@ a{
padding-left: 16px; padding-left: 16px;
margin-top: 10px; margin-top: 10px;
position: relative; position: relative;
&::before{ &::before {
content: ""; content: "";
width: 1.5px; width: 1.5px;
background: #79B0E2; background: #79b0e2;
position: absolute; position: absolute;
left: 1px; left: 1px;
top: 7px; top: 7px;
bottom: 7px; bottom: 7px;
} }
} }
.icons{ .icons {
width: 50px; width: 50px;
height: 40px; height: 40px;
} }
@@ -311,22 +380,22 @@ a{
background-position: 6px -34px; background-position: 6px -34px;
} }
} }
.admin-content-container{ .admin-content-container {
.note-list{ .note-list {
min-width: 144px; min-width: 144px;
a{ a {
display: block; display: block;
padding: 0 10px; padding: 0 10px;
line-height: 35px; line-height: 35px;
transition: .2s all; transition: 0.2s all;
&:hover { &:hover {
background: #F5F7FF; background: #f5f7ff;
color: #0041E8; color: #0041e8;
font-weight: 600; font-weight: 600;
} }
} }
} }
.content-holder{ .content-holder {
padding: 16px 0 16px 16px; padding: 16px 0 16px 16px;
} }
} }
@@ -334,40 +403,42 @@ a{
text-align: center; text-align: center;
td { td {
padding: 13px 8px; padding: 13px 8px;
border: 1px solid #ECECEC; border: 1px solid #ececec;
} }
tbody { tbody {
td{ td {
padding: 5px 8px; padding: 5px 8px;
&:nth-child(2), &:nth-child(3){ &:nth-child(2),
&:nth-child(3) {
text-align: left; text-align: left;
} }
&:nth-child(2){ &:nth-child(2) {
color: #0041E8; color: #0041e8;
} }
} }
} }
} }
.admin-home-tab{ .admin-home-tab {
overflow: auto; overflow: auto;
a{ a {
color: #A0A8B5; color: #a0a8b5;
padding: 9px 7.7px; padding: 9px 7.7px;
text-align: center; text-align: center;
border-right: 1px solid #DDE1EB; border-right: 1px solid #dde1eb;
white-space: nowrap; white-space: nowrap;
&:last-child{ &:last-child {
border: 0; border: 0;
} }
&:hover,&.current{ &:hover,
background: #0041E8; &.current {
background: #0041e8;
color: #fff; color: #fff;
} }
} }
} }
.home-report-holder { .home-report-holder {
display: none; display: none;
table{ table {
width: 100%; width: 100%;
line-height: 20px; line-height: 20px;
text-align: center; text-align: center;
@@ -376,26 +447,79 @@ a{
background: #f6f6f6; background: #f6f6f6;
font-weight: 500; font-weight: 500;
} }
td{ td {
border: 1px solid #ECECEC; border: 1px solid #ececec;
padding: 14px 5px; padding: 14px 5px;
a{ a {
display: block; display: block;
white-space: nowrap; white-space: nowrap;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
} }
&:nth-child(2){ &:nth-child(2) {
text-align: left; text-align: left;
} }
} }
} }
.home-todo-list{ .home-todo-list {
td{ td {
padding: 0 4px; padding: 0 4px;
color: #000 !important; color: #000 !important;
&:nth-child(1), &:nth-child(3), &:nth-child(4){ &:nth-child(1),
&:nth-child(3),
&:nth-child(4) {
white-space: nowrap; white-space: nowrap;
} }
} }
} }
.product-list {
th {
padding: 10px;
border: 1px solid #ececec;
background: #f6f6f6;
}
td {
padding: 8px;
border: 1px solid #ececec;
}
}
.product-sale-info {
td {
padding: 14px;
border: 1px solid #ececec;
}
}
input[type="radio"] {
position: absolute;
&:before {
content: "";
background: #fff;
border-radius: 100%;
border: 1.5px solid #0041e8;
display: inline-block;
width: 20px;
height: 20px;
position: relative;
top: -0.2em;
margin-right: 1em;
vertical-align: top;
cursor: pointer;
text-align: center;
transition: all 250ms ease;
}
&:checked {
&:before {
background-color: #0041e8;
box-shadow: inset 0 0 0 4px #fff;
}
}
&:focus {
&:before {
outline: none;
border-color: #0041e8;
}
}
}

771
them_san_pham.html Normal file
View File

@@ -0,0 +1,771 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title> Admin Hura Pc </title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&display=swap"
rel="stylesheet">
<link rel="stylesheet" media="screen" href="scss/pc_style.css" />
<script src="js/tailwindcss.js"></script>
</head>
<body>
<div class="admin-global-container">
<!-- Menu cũ -->
<div class="admin-menu-container sticky top-0 bottom-0 h-[100vh]" style="display: none;">
<a href="" class="menu-logo">
<img src="images/logo.png" />
</a>
<div class="menu-list">
<a href="" class="item">
<i class="icons icon-home"></i>
<span class="title"> Home </span>
</a>
<details>
<summary>
<a href="">
<i class="icons icon-sell"></i>
<span class="title"> Bán hàng </span>
</a>
<svg xmlns="http://www.w3.org/2000/svg" width="7" height="12" viewBox="0 0 7 12" fill="none">
<path fill-rule="evenodd" clip-rule="evenodd"
d="M0.646447 11.3536C0.451184 11.1583 0.451184 10.8417 0.646447 10.6464L5.29289 6L0.646446 1.35355C0.451184 1.15829 0.451184 0.841709 0.646446 0.646446C0.841708 0.451184 1.15829 0.451184 1.35355 0.646446L6.35355 5.64645C6.54882 5.84171 6.54882 6.15829 6.35355 6.35355L1.35355 11.3536C1.15829 11.5488 0.841709 11.5488 0.646447 11.3536Z"
fill="white" />
</svg>
</summary>
<div class="sub-menu">
<a href=""> Menu title </a>
<a href=""> Menu title </a>
<a href=""> Menu title </a>
<a href=""> Menu title </a>
</div>
</details>
<details>
<summary>
<a href="">
<i class="icons icon-product"></i>
<span class="title"> Sản phẩm </span>
</a>
<svg xmlns="http://www.w3.org/2000/svg" width="7" height="12" viewBox="0 0 7 12" fill="none">
<path fill-rule="evenodd" clip-rule="evenodd"
d="M0.646447 11.3536C0.451184 11.1583 0.451184 10.8417 0.646447 10.6464L5.29289 6L0.646446 1.35355C0.451184 1.15829 0.451184 0.841709 0.646446 0.646446C0.841708 0.451184 1.15829 0.451184 1.35355 0.646446L6.35355 5.64645C6.54882 5.84171 6.54882 6.15829 6.35355 6.35355L1.35355 11.3536C1.15829 11.5488 0.841709 11.5488 0.646447 11.3536Z"
fill="white" />
</svg>
</summary>
<div class="sub-menu">
<a href=""> Menu title </a>
<a href=""> Menu title </a>
<a href=""> Menu title </a>
<a href=""> Menu title </a>
</div>
</details>
<details>
<summary>
<a href="">
<i class="icons icon-user"></i>
<span class="title"> Khách hàng </span>
</a>
<svg xmlns="http://www.w3.org/2000/svg" width="7" height="12" viewBox="0 0 7 12" fill="none">
<path fill-rule="evenodd" clip-rule="evenodd"
d="M0.646447 11.3536C0.451184 11.1583 0.451184 10.8417 0.646447 10.6464L5.29289 6L0.646446 1.35355C0.451184 1.15829 0.451184 0.841709 0.646446 0.646446C0.841708 0.451184 1.15829 0.451184 1.35355 0.646446L6.35355 5.64645C6.54882 5.84171 6.54882 6.15829 6.35355 6.35355L1.35355 11.3536C1.15829 11.5488 0.841709 11.5488 0.646447 11.3536Z"
fill="white" />
</svg>
</summary>
<div class="sub-menu">
<a href=""> Menu title </a>
<a href=""> Menu title </a>
<a href=""> Menu title </a>
<a href=""> Menu title </a>
</div>
</details>
<details>
<summary>
<a href="">
<i class="icons icon-marketing"></i>
<span class="title"> Marketing </span>
</a>
<svg xmlns="http://www.w3.org/2000/svg" width="7" height="12" viewBox="0 0 7 12" fill="none">
<path fill-rule="evenodd" clip-rule="evenodd"
d="M0.646447 11.3536C0.451184 11.1583 0.451184 10.8417 0.646447 10.6464L5.29289 6L0.646446 1.35355C0.451184 1.15829 0.451184 0.841709 0.646446 0.646446C0.841708 0.451184 1.15829 0.451184 1.35355 0.646446L6.35355 5.64645C6.54882 5.84171 6.54882 6.15829 6.35355 6.35355L1.35355 11.3536C1.15829 11.5488 0.841709 11.5488 0.646447 11.3536Z"
fill="white" />
</svg>
</summary>
<div class="sub-menu">
<a href=""> Menu title </a>
<a href=""> Menu title </a>
<a href=""> Menu title </a>
<a href=""> Menu title </a>
</div>
</details>
<details>
<summary>
<a href="">
<i class="icons icon-content"></i>
<span class="title"> Nội dung </span>
</a>
<svg xmlns="http://www.w3.org/2000/svg" width="7" height="12" viewBox="0 0 7 12" fill="none">
<path fill-rule="evenodd" clip-rule="evenodd"
d="M0.646447 11.3536C0.451184 11.1583 0.451184 10.8417 0.646447 10.6464L5.29289 6L0.646446 1.35355C0.451184 1.15829 0.451184 0.841709 0.646446 0.646446C0.841708 0.451184 1.15829 0.451184 1.35355 0.646446L6.35355 5.64645C6.54882 5.84171 6.54882 6.15829 6.35355 6.35355L1.35355 11.3536C1.15829 11.5488 0.841709 11.5488 0.646447 11.3536Z"
fill="white" />
</svg>
</summary>
<div class="sub-menu">
<a href=""> Menu title </a>
<a href=""> Menu title </a>
<a href=""> Menu title </a>
<a href=""> Menu title </a>
</div>
</details>
<details>
<summary>
<a href="">
<i class="icons icon-stats"></i>
<span class="title"> Thống kê </span>
</a>
<svg xmlns="http://www.w3.org/2000/svg" width="7" height="12" viewBox="0 0 7 12" fill="none">
<path fill-rule="evenodd" clip-rule="evenodd"
d="M0.646447 11.3536C0.451184 11.1583 0.451184 10.8417 0.646447 10.6464L5.29289 6L0.646446 1.35355C0.451184 1.15829 0.451184 0.841709 0.646446 0.646446C0.841708 0.451184 1.15829 0.451184 1.35355 0.646446L6.35355 5.64645C6.54882 5.84171 6.54882 6.15829 6.35355 6.35355L1.35355 11.3536C1.15829 11.5488 0.841709 11.5488 0.646447 11.3536Z"
fill="white" />
</svg>
</summary>
<div class="sub-menu">
<a href=""> Menu title </a>
<a href=""> Menu title </a>
<a href=""> Menu title </a>
<a href=""> Menu title </a>
</div>
</details>
<details>
<summary>
<a href="">
<i class="icons icon-system"></i>
<span class="title"> Hệ thống </span>
</a>
<svg xmlns="http://www.w3.org/2000/svg" width="7" height="12" viewBox="0 0 7 12" fill="none">
<path fill-rule="evenodd" clip-rule="evenodd"
d="M0.646447 11.3536C0.451184 11.1583 0.451184 10.8417 0.646447 10.6464L5.29289 6L0.646446 1.35355C0.451184 1.15829 0.451184 0.841709 0.646446 0.646446C0.841708 0.451184 1.15829 0.451184 1.35355 0.646446L6.35355 5.64645C6.54882 5.84171 6.54882 6.15829 6.35355 6.35355L1.35355 11.3536C1.15829 11.5488 0.841709 11.5488 0.646447 11.3536Z"
fill="white" />
</svg>
</summary>
<div class="sub-menu">
<a href=""> Menu title </a>
<a href=""> Menu title </a>
<a href=""> Menu title </a>
<a href=""> Menu title </a>
</div>
</details>
</div>
<div class="menu-list">
<p style="color: #81B5E4;margin: 0 0 10px;font-weight: 700;padding: 0 16px;">TÀI KHOẢN</p>
<a href="" class="item">
<i class="icons icon-settings"></i>
<span class="title"> Cài đặt </span>
</a>
<a href="" class="item">
<i class="icons icon-support"></i>
<span class="title"> Hỗ trợ </span>
</a>
<a href="" class="item">
<i class="icons icon-account"></i>
<span class="title"> Quản lý tài khoản </span>
</a>
</div>
<a href="" class="item">
<i class="icons icon-logout"></i>
<span class="title"> Thoát quản trị </span>
</a>
</div>
<!-- Menu mới -->
<div class="admin-menu sticky top-0 bottom-0 h-[100vh] bg-[#004E99] flex flex-col justify-between">
<div
class="item items-center justify-center border-[rgba(255,255,255,0.15)] border-b p-[20px_0_38px_!important]">
<a href="">
<svg xmlns="http://www.w3.org/2000/svg" width="35" height="21" viewBox="0 0 35 21" fill="none">
<path
d="M28.5184 7.75141C28.4928 10.6955 27.8993 11.3464 27.8993 11.3464C29.065 3.56585 22.8312 0.686397 22.8312 0.686397C14.1636 -2.28358 11.3328 5.34611 11.3328 5.34611C5.84614 4.92368 4.24499 10.0963 4.24499 10.0963C10.9656 11.1611 9.15091 16.8812 9.15091 16.8812C9.36867 12.5146 6.78975 11.4887 6.78975 11.4887C2.42608 9.30752 0.355256 13.7302 0.355256 13.7302C-1.31421 19.2347 3.44228 20.4891 3.44228 20.4891H28.9967C35.0725 19.6098 34.748 14.1052 34.748 14.1052C34.1246 7.61347 28.5184 7.75141 28.5184 7.75141Z"
fill="white" />
</svg>
</a>
</div>
<div class="item">
<a href="" class="icons icon-home"> </a>
<div class="sub-menu">
<p class="font-bold"> Home </p>
</div>
</div>
<div class="item">
<a href="" class="icons icon-sell"> </a>
<div class="sub-menu">
<p class="font-bold"> Bán hàng </p>
<div class="menu-list">
<a href=""> Menu title </a>
<a href=""> Menu title </a>
<a href=""> Menu title </a>
<a href=""> Menu title </a>
</div>
</div>
</div>
<div class="item">
<a href="" class="icons icon-product"> </a>
<div class="sub-menu">
<p class="font-bold"> Sản phẩm </p>
<div class="menu-list">
<a href=""> Menu title </a>
<a href=""> Menu title </a>
<a href=""> Menu title </a>
<a href=""> Menu title </a>
</div>
</div>
</div>
<div class="item">
<a href="" class="icons icon-user"> </a>
<div class="sub-menu">
<p class="font-bold"> Khách hàng </p>
<div class="menu-list">
<a href=""> Menu title </a>
<a href=""> Menu title </a>
<a href=""> Menu title </a>
<a href=""> Menu title </a>
</div>
</div>
</div>
<div class="item">
<a href="" class="icons icon-marketing"> </a>
<div class="sub-menu">
<p class="font-bold"> Marketing </p>
<div class="menu-list">
<a href=""> Menu title </a>
<a href=""> Menu title </a>
<a href=""> Menu title </a>
<a href=""> Menu title </a>
</div>
</div>
</div>
<div class="item">
<a href="" class="icons icon-content"> </a>
<div class="sub-menu">
<p class="font-bold"> Nội dung </p>
<div class="menu-list">
<a href=""> Menu title </a>
<a href=""> Menu title </a>
<a href=""> Menu title </a>
<a href=""> Menu title </a>
</div>
</div>
</div>
<div class="item">
<a href="" class="icons icon-stats"> </a>
<div class="sub-menu">
<p class="font-bold"> Thống kê </p>
<div class="menu-list">
<a href=""> Menu title </a>
<a href=""> Menu title </a>
<a href=""> Menu title </a>
<a href=""> Menu title </a>
</div>
</div>
</div>
<div class="item border-[rgba(255,255,255,0.15)] border-b">
<a href="" class="icons icon-system"> </a>
<div class="sub-menu">
<p class="font-bold"> Hệ thống </p>
<div class="menu-list">
<a href=""> Menu title </a>
<a href=""> Menu title </a>
<a href=""> Menu title </a>
<a href=""> Menu title </a>
</div>
</div>
</div>
<div class="item">
<a href="" class="icons icon-settings"> </a>
<div class="sub-menu">
<p class="font-bold"> Cài đặt </p>
<div class="menu-list">
<a href=""> Menu title </a>
<a href=""> Menu title </a>
<a href=""> Menu title </a>
<a href=""> Menu title </a>
</div>
</div>
</div>
<div class="item">
<a href="" class="icons icon-support"> </a>
<div class="sub-menu">
<p class="font-bold"> Hỗ trợ </p>
<div class="menu-list">
<a href=""> Menu title </a>
<a href=""> Menu title </a>
<a href=""> Menu title </a>
<a href=""> Menu title </a>
</div>
</div>
</div>
<div class="item">
<a href="" class="icons icon-account"> </a>
<div class="sub-menu">
<p class="font-bold"> Quản lý tài khoản </p>
<div class="menu-list">
<a href=""> Menu title </a>
<a href=""> Menu title </a>
<a href=""> Menu title </a>
<a href=""> Menu title </a>
</div>
</div>
</div>
<div class="item mb-[20px]">
<a href="" class="icons icon-logout"> </a>
<div class="sub-menu">
<p class="font-bold"> Thoát quản trị </p>
</div>
</div>
</div>
<div class="admin-content-container w-[100%]">
<!-- Header -->
<div class="admin-header-container flex items-center justify-between bg-white px-4 py-3">
<form class="max-w-[420px] relative w-[100%]">
<div class="absolute inset-y-0 start-0 flex items-center ps-3 pointer-events-none">
<svg class="w-4 h-4" xmlns="http://www.w3.org/2000/svg" width="20" height="20"
viewBox="0 0 20 20" fill="none">
<path
d="M9 17C13.4183 17 17 13.4183 17 9C17 4.58172 13.4183 1 9 1C4.58172 1 1 4.58172 1 9C1 13.4183 4.58172 17 9 17Z"
stroke="#C5C5C5" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" />
<path d="M18.9999 19L14.6499 14.65" stroke="#C5C5C5" stroke-width="2" stroke-linecap="round"
stroke-linejoin="round" />
</svg>
</div>
<input type="search" class="block border h-[36px] ps-10 rounded w-full" placeholder="Tìm kiếm">
</form>
<div class="admin-header-right flex items-center justify-end">
<a href="" title="Truy cập trung tâm hỗ trợ của Hurasoft">
<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" viewBox="0 0 28 28" fill="none">
<path fill-rule="evenodd" clip-rule="evenodd"
d="M14 1.86667C7.29894 1.86667 1.86667 7.29894 1.86667 14C1.86667 20.7011 7.29894 26.1333 14 26.1333C20.7011 26.1333 26.1333 20.7011 26.1333 14C26.1333 7.29894 20.7011 1.86667 14 1.86667ZM0 14C0 6.26801 6.26801 0 14 0C21.732 0 28 6.26801 28 14C28 21.732 21.732 28 14 28C6.26801 28 0 21.732 0 14Z"
fill="black" />
<path fill-rule="evenodd" clip-rule="evenodd"
d="M14.4005 8.43719C13.7054 8.31795 12.9904 8.44859 12.3823 8.80597C11.7742 9.16335 11.3123 9.7244 11.0782 10.3898C10.9071 10.876 10.3743 11.1315 9.88803 10.9605C9.40177 10.7894 9.14625 10.2566 9.3173 9.77032C9.69765 8.68911 10.4484 7.77739 11.4365 7.19665C12.4247 6.61591 13.5864 6.40363 14.7161 6.5974C15.8458 6.79116 16.8704 7.37848 17.6085 8.25532C18.3465 9.13202 18.7505 10.2416 18.7489 11.3875C18.7485 13.1892 17.4095 14.4125 16.3733 15.1033C15.8267 15.4677 15.2868 15.737 14.8872 15.9146C14.686 16.004 14.5171 16.0716 14.3963 16.1176C14.3358 16.1407 14.2872 16.1584 14.2523 16.1708L14.2105 16.1854L14.1978 16.1898L14.1936 16.1912L14.192 16.1917C14.1917 16.1918 14.1908 16.1921 13.8956 15.3067L14.1908 16.1921C13.7017 16.3552 13.1732 16.0909 13.0102 15.6019C12.8473 15.1133 13.111 14.5853 13.5991 14.4217C13.5988 14.4218 13.5993 14.4216 13.5991 14.4217L13.6 14.4214L13.6032 14.4203L13.627 14.412C13.6495 14.404 13.6851 14.3911 13.7318 14.3733C13.8254 14.3376 13.9627 14.2828 14.1291 14.2088C14.4644 14.0598 14.9045 13.8391 15.3379 13.5501C16.2615 12.9344 16.8823 12.1979 16.8823 11.3867L16.8823 11.3853C16.8833 10.68 16.6347 9.99705 16.1805 9.45745C15.7263 8.91786 15.0957 8.55643 14.4005 8.43719Z"
fill="black" />
<path fill-rule="evenodd" clip-rule="evenodd"
d="M13.0667 20.5333C13.0667 20.0178 13.4845 19.6 14 19.6H14.0131C14.5285 19.6 14.9464 20.0178 14.9464 20.5333C14.9464 21.0488 14.5285 21.4666 14.0131 21.4666H14C13.4845 21.4666 13.0667 21.0488 13.0667 20.5333Z"
fill="black" />
</svg>
</a>
<div
class="group relative cursor-pointer ml-[20px] mr-[35px] group [&_summary::-webkit-details-marker]:hidden">
<div class="relative flex">
<svg xmlns="http://www.w3.org/2000/svg" width="26" height="28" viewBox="0 0 26 28"
fill="none">
<path fill-rule="evenodd" clip-rule="evenodd"
d="M12.6752 4.02515C11.6279 4.02515 10.5909 4.23143 9.62329 4.63221C8.65572 5.03299 7.77656 5.62042 7.03601 6.36097C6.29547 7.10152 5.70803 7.98067 5.30725 8.94825C4.90647 9.91582 4.70019 10.9529 4.70019 12.0001C4.70019 16.6158 3.73241 19.3956 2.80371 21.0002H22.5467C21.618 19.3956 20.6502 16.6158 20.6502 12.0001C20.6502 10.9529 20.4439 9.91582 20.0431 8.94825C19.6423 7.98067 19.0549 7.10152 18.3144 6.36097C17.5738 5.62042 16.6947 5.03299 15.7271 4.63221C14.7595 4.23143 13.7225 4.02515 12.6752 4.02515ZM8.85792 2.78445C10.0681 2.28316 11.3653 2.02515 12.6752 2.02515C13.9851 2.02515 15.2822 2.28316 16.4925 2.78445C17.7027 3.28574 18.8023 4.02049 19.7286 4.94676C20.6548 5.87302 21.3896 6.97266 21.8909 8.18288C22.3922 9.3931 22.6502 10.6902 22.6502 12.0001C22.6502 16.3335 23.557 18.7535 24.2781 19.9991L24.2787 20.0001C24.454 20.3037 24.5464 20.6479 24.5467 20.9984C24.547 21.3489 24.4552 21.6933 24.2805 21.9971C24.1058 22.3009 23.8543 22.5535 23.5512 22.7296C23.2482 22.9056 22.9042 22.9989 22.5537 23.0001L22.5502 23.0001H2.80019L2.79667 23.0001C2.4462 22.9989 2.1022 22.9056 1.79914 22.7296C1.49608 22.5535 1.2446 22.3009 1.0699 21.9971C0.895195 21.6933 0.803401 21.3489 0.803712 20.9984C0.804022 20.6479 0.896425 20.3037 1.07167 20.0001L1.07226 19.9991C1.79338 18.7535 2.70019 16.3335 2.70019 12.0001C2.70019 10.6902 2.9582 9.3931 3.45949 8.18288C3.96078 6.97266 4.69554 5.87302 5.6218 4.94676C6.54806 4.02049 7.6477 3.28574 8.85792 2.78445Z"
fill="black"></path>
<path fill-rule="evenodd" clip-rule="evenodd"
d="M8.67529 21.0001C9.22758 21.0001 9.67529 21.4478 9.67529 22.0001V23.0001C9.67529 23.7958 9.99136 24.5588 10.554 25.1214C11.1166 25.6841 11.8796 26.0001 12.6753 26.0001C13.4709 26.0001 14.234 25.6841 14.7966 25.1214C15.3592 24.5588 15.6753 23.7958 15.6753 23.0001V22.0001C15.6753 21.4478 16.123 21.0001 16.6753 21.0001C17.2276 21.0001 17.6753 21.4478 17.6753 22.0001V23.0001C17.6753 24.3262 17.1485 25.598 16.2108 26.5357C15.2731 27.4733 14.0014 28.0001 12.6753 28.0001C11.3492 28.0001 10.0774 27.4733 9.13976 26.5357C8.20208 25.598 7.67529 24.3262 7.67529 23.0001V22.0001C7.67529 21.4478 8.12301 21.0001 8.67529 21.0001Z"
fill="black"></path>
<path fill-rule="evenodd" clip-rule="evenodd"
d="M18.7546 0.466336C19.0494 -0.000683993 19.667 -0.140291 20.134 0.154515C22.3252 1.5377 24.0937 3.497 25.2459 5.81797C25.4915 6.31265 25.2896 6.91275 24.7949 7.15833C24.3002 7.40391 23.7001 7.20197 23.4545 6.70729C22.4654 4.71495 20.9474 3.03308 19.0664 1.84574C18.5994 1.55094 18.4598 0.933356 18.7546 0.466336Z"
fill="black"></path>
<path fill-rule="evenodd" clip-rule="evenodd"
d="M6.59584 0.466336C6.89064 0.933356 6.75103 1.55094 6.28401 1.84574C4.40308 3.03308 2.885 4.71495 1.89592 6.70729C1.65034 7.20197 1.05024 7.40391 0.555559 7.15833C0.0608782 6.91275 -0.141057 6.31265 0.104523 5.81797C1.25675 3.497 3.02523 1.5377 5.21643 0.154515C5.68345 -0.140291 6.30103 -0.000683993 6.59584 0.466336Z"
fill="black"></path>
</svg>
<span
class="absolute bg-[#E00000] font-[500] h-[17px] leading-[17px] note right-[-5px] rounded-lg text-[#fff] text-[13px] text-center top-[-3px] w-[17px]">0</span>
</div>
<div
class="group-hover:opacity-[1] group-hover:z-[1] opacity-0 absolute bg-white leading-[30px] note-list shadow whitespace-nowrap z-[-1] rounded-[4px] right-[-10px]">
<a href=""> Menu title </a>
<a href=""> Menu title </a>
<a href=""> Menu title </a>
<a href=""> Menu title </a>
</div>
</div>
<div class="group relative cursor-pointer group [&_summary::-webkit-details-marker]:hidden">
<div class="flex items-center">
<p class="m-0 mr-[10px]"> ducdt@hurasoft.com </p>
<img src="https://via.placeholder.com/72x72"
class="block rounded-[50%] w-[36px] h-[36px] mr-[8px]" />
<svg xmlns="http://www.w3.org/2000/svg" width="8" height="6" viewBox="0 0 8 6" fill="none">
<path
d="M4.00078 6C3.83058 5.99914 3.66272 5.96041 3.50935 5.88661C3.35599 5.81281 3.22098 5.7058 3.11411 5.57333L0.307445 2.17333C0.143441 1.96865 0.0402359 1.722 0.00958995 1.46151C-0.021056 1.20102 0.0220901 0.937162 0.134112 0.7C0.224965 0.493884 0.373227 0.318276 0.561191 0.194148C0.749155 0.0700212 0.968876 0.00262204 1.19411 0H6.80744C7.03268 0.00262204 7.2524 0.0700212 7.44037 0.194148C7.62833 0.318276 7.77659 0.493884 7.86744 0.7C7.97947 0.937162 8.02261 1.20102 7.99197 1.46151C7.96132 1.722 7.85812 1.96865 7.69411 2.17333L4.88744 5.57333C4.78058 5.7058 4.64557 5.81281 4.4922 5.88661C4.33884 5.96041 4.17097 5.99914 4.00078 6Z"
fill="#C9C9C9" />
</svg>
</div>
<div
class="group-hover:opacity-[1] group-hover:z-[1] opacity-0 absolute bg-white leading-[30px] note-list shadow whitespace-nowrap z-[-1] rounded-[4px] right-0">
<a href="">Đổi mật khẩu</a>
<a href="">Thoát quản trị</a>
</div>
</div>
</div>
</div>
<!-- Content -->
<div class="grid w-[100%] ">
<div class="m-[15px] px-[15px] py-[20px] rounded-[15px] bg-white shadow-[0_1px_1px_0_rgba(0,0,0,0.1)]">
<h1 class="text-2xl font-[700] mb-3">Danh sách sản phẩm</h1>
<form
class="w-[100%] flex w-[100%] rounded-[10px] p-[15px] border-solid border-[#F6F6F6] border-[1px] shadow-[0_1px_1px_0_rgba(0,0,0,0.1)]">
<input type="search" class="block border h-[36px] ps-3 rounded w-[375px]"
placeholder="Tìm sản phẩm">
<div
class="w-[100px] rounded-[4px] ml-[9px] bg-[#0041E8] text-white flex leading-[35px] text-center items-center justify-center cursor-pointer">
Tìm kiếm
</div>
</form>
<div class="flex justify-between items-center mt-[20px]">
<div class="btn-left flex items-center">
<a href=""
class="px-[10px] py-[8px] border-[#79B0E2] border-[1px] rounded-[4px] text-[#79B0E2] hover:bg-[#0061ff] hover:text-white mr-[15px]">
Chọn danh mục để xem
</a>
<a href=""
class="px-[10px] py-[8px] border-[#79B0E2] border-[1px] rounded-[4px] text-[#79B0E2] hover:bg-[#0061ff] hover:text-white mr-[15px]">
Chọn thương hiệu để xem
</a>
</div>
<div class="btn-right flex items-center">
<a href=""
class="flex items-center px-[10px] py-[8px] border-[#0041E8] border-[1px] rounded-[4px] text-[#0041E8] hover:bg-[#0041E8] hover:text-white ml-[15px] font-[500]">
<span
class="border-[1px] border-[#0041E8] h-[15px] w-[15px] leading-[12px] text-center rounded-[50%] mr-1">+</span>
<span>Thêm sản phẩm mới</span>
</a>
<a href=""
class="flex items-center px-[10px] py-[8px] border-[#0041E8] border-[1px] rounded-[4px] text-[#0041E8] hover:bg-[#0041E8] hover:text-white ml-[15px] hover:stroke-white font-[500]">
<svg class="hover:fill-white" xmlns="http://www.w3.org/2000/svg" width="14" height="15"
viewBox="0 0 14 15" fill="none">
<path fill-rule="evenodd" clip-rule="evenodd"
d="M1.30461 1.30461C1.49965 1.10957 1.76417 1 2.04 1H8.28C8.41791 1 8.55018 1.05479 8.6477 1.1523L12.2877 4.7923C12.3852 4.88982 12.44 5.02209 12.44 5.16V7.76C12.44 8.04719 12.2072 8.28 11.92 8.28C11.6328 8.28 11.4 8.04719 11.4 7.76V5.37539L8.06461 2.04L2.04 2.04L2.04 7.76C2.04 8.04719 1.80719 8.28 1.52 8.28C1.23281 8.28 1 8.04719 1 7.76V2.04C1 1.76417 1.10957 1.49965 1.30461 1.30461Z"
fill="#0041E8" />
<path fill-rule="evenodd" clip-rule="evenodd"
d="M8.28 1C8.56719 1 8.8 1.23281 8.8 1.52V4.64H11.92C12.2072 4.64 12.44 4.87281 12.44 5.16C12.44 5.44719 12.2072 5.68 11.92 5.68H8.28C7.99281 5.68 7.76 5.44719 7.76 5.16V1.52C7.76 1.23281 7.99281 1 8.28 1Z"
fill="#0041E8" />
<path fill-rule="evenodd" clip-rule="evenodd"
d="M1 10.36C1 10.0728 1.23281 9.84 1.52 9.84H2.56C2.97374 9.84 3.37053 10.0044 3.66309 10.2969C3.95564 10.5895 4.12 10.9863 4.12 11.4C4.12 11.8137 3.95564 12.2105 3.66309 12.5031C3.37053 12.7956 2.97374 12.96 2.56 12.96H2.04V13.48C2.04 13.7672 1.80719 14 1.52 14C1.23281 14 1 13.7672 1 13.48V10.36ZM2.04 11.92H2.56C2.69791 11.92 2.83018 11.8652 2.9277 11.7677C3.02521 11.6702 3.08 11.5379 3.08 11.4C3.08 11.2621 3.02521 11.1298 2.9277 11.0323C2.83018 10.9348 2.69791 10.88 2.56 10.88H2.04V11.92Z"
fill="#0041E8" />
<path fill-rule="evenodd" clip-rule="evenodd"
d="M10.1 10.36C10.1 10.0728 10.3328 9.84 10.62 9.84H12.44C12.7272 9.84 12.96 10.0728 12.96 10.36C12.96 10.6472 12.7272 10.88 12.44 10.88H11.14V13.48C11.14 13.7672 10.9072 14 10.62 14C10.3328 14 10.1 13.7672 10.1 13.48V10.36Z"
fill="#0041E8" />
<path fill-rule="evenodd" clip-rule="evenodd"
d="M10.1 12.18C10.1 11.8928 10.3328 11.66 10.62 11.66H12.18C12.4672 11.66 12.7 11.8928 12.7 12.18C12.7 12.4672 12.4672 12.7 12.18 12.7H10.62C10.3328 12.7 10.1 12.4672 10.1 12.18Z"
fill="#0041E8" />
<path fill-rule="evenodd" clip-rule="evenodd"
d="M5.29 10.36C5.29 10.0728 5.52281 9.84 5.81 9.84H6.72C7.27165 9.84 7.80071 10.0591 8.19078 10.4492C8.58086 10.8393 8.8 11.3683 8.8 11.92C8.8 12.4716 8.58086 13.0007 8.19078 13.3908C7.80071 13.7809 7.27165 14 6.72 14H5.81C5.52281 14 5.29 13.7672 5.29 13.48V10.36ZM6.33 10.88V12.96H6.72C6.99583 12.96 7.26035 12.8504 7.45539 12.6554C7.65043 12.4604 7.76 12.1958 7.76 11.92C7.76 11.6442 7.65043 11.3796 7.45539 11.1846C7.26035 10.9896 6.99583 10.88 6.72 10.88H6.33Z"
fill="#0041E8" />
<path
d="M8.28 1H2.04C1.76417 1 1.49965 1.10957 1.30461 1.30461C1.10957 1.49965 1 1.76417 1 2.04V7.76C1 8.04719 1.23281 8.28 1.52 8.28C1.80719 8.28 2.04 8.04719 2.04 7.76L2.04 2.04L8.06461 2.04L11.4 5.37539V7.76C11.4 8.04719 11.6328 8.28 11.92 8.28C12.2072 8.28 12.44 8.04719 12.44 7.76V5.16M8.28 1C8.41791 1 8.55018 1.05479 8.6477 1.1523L12.2877 4.7923C12.3852 4.88982 12.44 5.02209 12.44 5.16M8.28 1C8.56719 1 8.8 1.23281 8.8 1.52V4.64H11.92C12.2072 4.64 12.44 4.87281 12.44 5.16M8.28 1C7.99281 1 7.76 1.23281 7.76 1.52V5.16C7.76 5.44719 7.99281 5.68 8.28 5.68H11.92C12.2072 5.68 12.44 5.44719 12.44 5.16M1.52 9.84C1.23281 9.84 1 10.0728 1 10.36V13.48C1 13.7672 1.23281 14 1.52 14C1.80719 14 2.04 13.7672 2.04 13.48V12.96H2.56C2.97374 12.96 3.37053 12.7956 3.66309 12.5031C3.95564 12.2105 4.12 11.8137 4.12 11.4C4.12 10.9863 3.95564 10.5895 3.66309 10.2969C3.37053 10.0044 2.97374 9.84 2.56 9.84H1.52ZM2.56 11.92H2.04V10.88H2.56C2.69791 10.88 2.83018 10.9348 2.9277 11.0323C3.02521 11.1298 3.08 11.2621 3.08 11.4C3.08 11.5379 3.02521 11.6702 2.9277 11.7677C2.83018 11.8652 2.69791 11.92 2.56 11.92ZM10.62 9.84C10.3328 9.84 10.1 10.0728 10.1 10.36V13.48C10.1 13.7672 10.3328 14 10.62 14C10.9072 14 11.14 13.7672 11.14 13.48V10.88H12.44C12.7272 10.88 12.96 10.6472 12.96 10.36C12.96 10.0728 12.7272 9.84 12.44 9.84H10.62ZM10.62 11.66C10.3328 11.66 10.1 11.8928 10.1 12.18C10.1 12.4672 10.3328 12.7 10.62 12.7H12.18C12.4672 12.7 12.7 12.4672 12.7 12.18C12.7 11.8928 12.4672 11.66 12.18 11.66H10.62ZM5.81 9.84C5.52281 9.84 5.29 10.0728 5.29 10.36V13.48C5.29 13.7672 5.52281 14 5.81 14H6.72C7.27165 14 7.80071 13.7809 8.19078 13.3908C8.58086 13.0007 8.8 12.4716 8.8 11.92C8.8 11.3683 8.58086 10.8393 8.19078 10.4492C7.80071 10.0591 7.27165 9.84 6.72 9.84H5.81ZM6.33 12.96V10.88H6.72C6.99583 10.88 7.26035 10.9896 7.45539 11.1846C7.65043 11.3796 7.76 11.6442 7.76 11.92C7.76 12.1958 7.65043 12.4604 7.45539 12.6554C7.26035 12.8504 6.99583 12.96 6.72 12.96H6.33Z"
stroke="#0041E8" stroke-width="0.3" stroke-linecap="round"
stroke-linejoin="round" />
</svg>
<span class="ml-1">Danh sách cập nhật</span>
</a>
<a href=""
class="flex items-center px-[10px] py-[8px] border-[#0041E8] border-[1px] rounded-[4px] text-[#0041E8] hover:bg-[#0041E8] hover:text-white ml-[15px] hover:stroke-white font-[500]">
<svg class="hover:fill-white" xmlns="http://www.w3.org/2000/svg" width="13" height="15"
viewBox="0 0 13 15">
<path fill-rule="evenodd" clip-rule="evenodd"
d="M1.29289 1.29289C1.48043 1.10536 1.73478 1 2 1H8C8.13261 1 8.25979 1.05268 8.35355 1.14645L11.8536 4.64645C11.9473 4.74021 12 4.86739 12 5V13C12 13.2652 11.8946 13.5196 11.7071 13.7071C11.5196 13.8946 11.2652 14 11 14H2C1.73478 14 1.48043 13.8946 1.29289 13.7071C1.10536 13.5196 1 13.2652 1 13V2C1 1.73478 1.10536 1.48043 1.29289 1.29289ZM7.79289 2L2 2L2 13H11V5.20711L7.79289 2Z"
fill="#0041E8" stroke="#0041E8" stroke-width="0.3" stroke-linecap="round"
stroke-linejoin="round" />
<path fill-rule="evenodd" clip-rule="evenodd"
d="M8 1C8.27614 1 8.5 1.22386 8.5 1.5V4.5H11.5C11.7761 4.5 12 4.72386 12 5C12 5.27614 11.7761 5.5 11.5 5.5H8C7.72386 5.5 7.5 5.27614 7.5 5V1.5C7.5 1.22386 7.72386 1 8 1Z"
fill="#0041E8" stroke="#0041E8" stroke-width="0.3" stroke-linecap="round"
stroke-linejoin="round" />
<path fill-rule="evenodd" clip-rule="evenodd"
d="M4.64645 7.14645C4.84171 6.95118 5.15829 6.95118 5.35355 7.14645L8.35355 10.1464C8.54882 10.3417 8.54882 10.6583 8.35355 10.8536C8.15829 11.0488 7.84171 11.0488 7.64645 10.8536L4.64645 7.85355C4.45118 7.65829 4.45118 7.34171 4.64645 7.14645Z"
fill="#0041E8" stroke="#0041E8" stroke-width="0.3" stroke-linecap="round"
stroke-linejoin="round" />
<path fill-rule="evenodd" clip-rule="evenodd"
d="M8.35355 7.14645C8.54882 7.34171 8.54882 7.65829 8.35355 7.85355L5.35355 10.8536C5.15829 11.0488 4.84171 11.0488 4.64645 10.8536C4.45118 10.6583 4.45118 10.3417 4.64645 10.1464L7.64645 7.14645C7.84171 6.95118 8.15829 6.95118 8.35355 7.14645Z"
fill="#0041E8" stroke="#0041E8" stroke-width="0.3" stroke-linecap="round"
stroke-linejoin="round" />
</svg>
<span class="ml-1">Cập nhật Excel</span>
</a>
</div>
</div>
<table class="w-[100%] mt-[20px] product-list">
<thead>
<tr>
<th>STT</th>
<th>ID</th>
<th>Ảnh</th>
<th>Sản phẩm (Tổng số: 1.742)</th>
<th>Người dùng</th>
<th>Thông tin bán hàng</th>
<th>Thông tin khác</th>
<th>
<span>Đặc điểm</span>
<select name="" id=""
class="block w-[160px] bg-white border-[1px] border-[#D8D8D8] font-[400] h-[30px] mt-[5px] rounded-[4px]">
<option value="">Lọc sản phẩm</option>
</select>
</th>
<th>Công cụ</th>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td>#2105</td>
<td>
<img class="block m-auto" src="./images/img-product.png" alt="">
<span class="text-center block">6 ảnh</span>
<a href="" class="text-center flex justify-center">
<svg xmlns="http://www.w3.org/2000/svg" width="12" height="13"
viewBox="0 0 12 13" fill="none">
<path fill-rule="evenodd" clip-rule="evenodd"
d="M6.67307 0.173073C6.90384 -0.0576911 7.27798 -0.0576911 7.50875 0.173073L9.87238 2.53671C10.1031 2.76747 10.1031 3.14162 9.87238 3.37238L3.37238 9.87238C3.26156 9.9832 3.11126 10.0455 2.95455 10.0455H0.590909C0.264559 10.0455 0 9.7809 0 9.45455V7.09091C0 6.93419 0.0622563 6.78389 0.173073 6.67307L6.67307 0.173073ZM1.18182 7.33567V8.86364H2.70978L8.61887 2.95455L7.09091 1.42658L1.18182 7.33567Z"
fill="#0041E8" />
<path fill-rule="evenodd" clip-rule="evenodd"
d="M0 12.4091C0 12.0828 0.264559 11.8182 0.590909 11.8182H11.2273C11.5536 11.8182 11.8182 12.0828 11.8182 12.4091C11.8182 12.7355 11.5536 13.0001 11.2273 13.0001H0.590909C0.264559 13.0001 0 12.7355 0 12.4091Z"
fill="#0041E8" />
</svg>
</a>
</td>
<td>
<a href="" class="text-[#0041E8]">Chăn hè đũi xơ đậu nành mã 32 Gấu xanh</a>
<p class="text-[#FFC700]">[Có cấu hình]</p>
<div class="flex items-center">
<span>Danh mục:</span>
<b class="mx-[10px]">Màn hình Máy tính</b>
<a href=""><svg xmlns="http://www.w3.org/2000/svg" width="12" height="13"
viewBox="0 0 12 13" fill="none">
<path fill-rule="evenodd" clip-rule="evenodd"
d="M6.67307 0.173073C6.90384 -0.0576911 7.27798 -0.0576911 7.50875 0.173073L9.87238 2.53671C10.1031 2.76747 10.1031 3.14162 9.87238 3.37238L3.37238 9.87238C3.26156 9.9832 3.11126 10.0455 2.95455 10.0455H0.590909C0.264559 10.0455 0 9.7809 0 9.45455V7.09091C0 6.93419 0.0622563 6.78389 0.173073 6.67307L6.67307 0.173073ZM1.18182 7.33567V8.86364H2.70978L8.61887 2.95455L7.09091 1.42658L1.18182 7.33567Z"
fill="#0041E8" />
<path fill-rule="evenodd" clip-rule="evenodd"
d="M0 12.4091C0 12.0828 0.264559 11.8182 0.590909 11.8182H11.2273C11.5536 11.8182 11.8182 12.0828 11.8182 12.4091C11.8182 12.7355 11.5536 13.0001 11.2273 13.0001H0.590909C0.264559 13.0001 0 12.7355 0 12.4091Z"
fill="#0041E8" />
</svg></a>
</div>
<div class="flex items-center">
<span>Mã kho</span>
<b class="px-[5px]">MH241</b>
<span class="text-[#000] font-[500]">|</span>
<span class="px-[5px]">Hãng</span>
<p class="text-[#0041E8]">ABS</p>
</div>
<p>Cập nhật: 20-10-2023, 5:48 pm <span class="text-[#E00000]">(49 ngày)</span></p>
<p>Người cập nhật : anhtt@hurasoft.com</p>
</td>
<td>
<p>- Xem : 0</p>
<p>- Thích : 0</p>
<p>- Mua : 0</p>
</td>
<td>
<div class="flex items-center mb-[1px]">
<span>- Giá bán:</span>
<b class="text-[#E00000] ml-[3px]">300.000 vnd</b>
</div>
<div class="flex items-center">
<span>- Sl tổng:</span>
<b class="ml-[3px]">1</b>
</div>
</td>
<td>
<div class="flex items-center mb-[1px]">
<span>- Giá bán:</span>
<b class="text-[#E00000] ml-[3px]">300.000 vnd</b>
</div>
<p>- Bảo hành: Ato test</p>
<p>- Khuyến mại: + Ato test</p>
</td>
<td>
<div>
<input type="checkbox" name="" id="">
<label for="">Mới Hot (Hỏi nhiều)</label>
</div>
<div>
<input type="checkbox" name="" id="">
<label for="">Bán chạy</label>
</div>
<div>
<input type="checkbox" name="" id="">
<label for="">Xả hàng (sale-off)</label>
</div>
<div>
<input type="checkbox" name="" id="">
<label for="">Chỉ bán online</label>
</div>
<a href=""
class="bg-[#0041E8] rounded-[4px] text-white px-[10px] py-[6px] mt-[3px] inline-block">Cập
nhật</a>
</td>
<td class="">
<div class="list-btn flex items-center w-[150px]">
<a href=""
class="w-[30px] h-[30px] border-[1px] border-[#0041E8] rounded-[4px] text-center leading-[30px] flex items-center justify-center mr-[5px]">
<svg xmlns="http://www.w3.org/2000/svg" width="12" height="13"
viewBox="0 0 12 13" fill="none">
<path fill-rule="evenodd" clip-rule="evenodd"
d="M6.67307 0.173073C6.90384 -0.0576911 7.27798 -0.0576911 7.50875 0.173073L9.87238 2.53671C10.1031 2.76747 10.1031 3.14162 9.87238 3.37238L3.37238 9.87238C3.26156 9.9832 3.11126 10.0455 2.95455 10.0455H0.590909C0.264559 10.0455 0 9.7809 0 9.45455V7.09091C0 6.93419 0.0622563 6.78389 0.173073 6.67307L6.67307 0.173073ZM1.18182 7.33567V8.86364H2.70978L8.61887 2.95455L7.09091 1.42658L1.18182 7.33567Z"
fill="#0041E8"></path>
<path fill-rule="evenodd" clip-rule="evenodd"
d="M0 12.4091C0 12.0828 0.264559 11.8182 0.590909 11.8182H11.2273C11.5536 11.8182 11.8182 12.0828 11.8182 12.4091C11.8182 12.7355 11.5536 13.0001 11.2273 13.0001H0.590909C0.264559 13.0001 0 12.7355 0 12.4091Z"
fill="#0041E8"></path>
</svg>
</a>
<a href=""
class="w-[30px] h-[30px] border-[1px] border-[#0041E8] rounded-[4px] text-center leading-[30px] flex items-center justify-center mr-[5px]">
<svg xmlns="http://www.w3.org/2000/svg" width="13" height="13"
viewBox="0 0 13 13" fill="none">
<path fill-rule="evenodd" clip-rule="evenodd"
d="M6.5 1.18182C3.56285 1.18182 1.18182 3.56285 1.18182 6.5C1.18182 9.43715 3.56285 11.8182 6.5 11.8182C9.43715 11.8182 11.8182 9.43715 11.8182 6.5C11.8182 3.56285 9.43715 1.18182 6.5 1.18182ZM0 6.5C0 2.91015 2.91015 0 6.5 0C10.0899 0 13 2.91015 13 6.5C13 10.0899 10.0899 13 6.5 13C2.91015 13 0 10.0899 0 6.5Z"
fill="#0041E8" />
<path fill-rule="evenodd" clip-rule="evenodd"
d="M0 6.5C0 6.17365 0.264559 5.90909 0.590909 5.90909H12.4091C12.7354 5.90909 13 6.17365 13 6.5C13 6.82635 12.7354 7.09091 12.4091 7.09091H0.590909C0.264559 7.09091 0 6.82635 0 6.5Z"
fill="#0041E8" />
<path fill-rule="evenodd" clip-rule="evenodd"
d="M4.72741 6.50001C4.76791 8.31696 5.39279 10.0662 6.5 11.4927C7.60721 10.0662 8.23209 8.31696 8.27259 6.50001C8.23209 4.68306 7.60721 2.93378 6.5 1.5073C5.39279 2.93378 4.76791 4.68306 4.72741 6.50001ZM6.5 0.590918L6.0637 0.192395C4.48907 1.91627 3.59421 4.15342 3.54558 6.4877C3.54541 6.4959 3.54541 6.50411 3.54558 6.51232C3.59421 8.84659 4.48907 11.0837 6.0637 12.8076C6.17566 12.9302 6.334 13 6.5 13C6.666 13 6.82434 12.9302 6.93629 12.8076C8.51093 11.0837 9.40579 8.84659 9.45442 6.51232C9.45459 6.50411 9.45459 6.4959 9.45442 6.4877C9.40579 4.15342 8.51093 1.91627 6.93629 0.192395L6.5 0.590918Z"
fill="#0041E8" />
</svg>
</a>
<a href=""
class="w-[30px] h-[30px] border-[1px] border-[#9E9E9E] rounded-[4px] text-center leading-[30px] flex items-center justify-center mr-[5px]">
<svg xmlns="http://www.w3.org/2000/svg" width="12" height="13"
viewBox="0 0 12 13" fill="none">
<path fill-rule="evenodd" clip-rule="evenodd"
d="M0 2.95455C0 2.6282 0.264559 2.36364 0.590909 2.36364H11.2273C11.5536 2.36364 11.8182 2.6282 11.8182 2.95455C11.8182 3.2809 11.5536 3.54545 11.2273 3.54545H0.590909C0.264559 3.54545 0 3.2809 0 2.95455Z"
fill="#9E9E9E" />
<path fill-rule="evenodd" clip-rule="evenodd"
d="M4.72727 1.18182C4.57055 1.18182 4.42025 1.24407 4.30944 1.35489C4.19862 1.46571 4.13636 1.61601 4.13636 1.77273V2.36364H7.68182V1.77273C7.68182 1.61601 7.61956 1.46571 7.50875 1.35489C7.39793 1.24407 7.24763 1.18182 7.09091 1.18182H4.72727ZM8.86364 2.36364V1.77273C8.86364 1.30257 8.67687 0.85167 8.34442 0.51922C8.01197 0.186769 7.56107 0 7.09091 0H4.72727C4.25712 0 3.80622 0.186769 3.47377 0.51922C3.14132 0.85167 2.95455 1.30257 2.95455 1.77273V2.36364H1.77273C1.44638 2.36364 1.18182 2.6282 1.18182 2.95455V11.2273C1.18182 11.6974 1.36859 12.1483 1.70104 12.4808C2.03349 12.8132 2.48439 13 2.95455 13H8.86364C9.33379 13 9.78469 12.8132 10.1171 12.4808C10.4496 12.1483 10.6364 11.6974 10.6364 11.2273V2.95455C10.6364 2.6282 10.3718 2.36364 10.0455 2.36364H8.86364ZM2.36364 3.54545V11.2273C2.36364 11.384 2.42589 11.5343 2.53671 11.6451C2.64753 11.7559 2.79783 11.8182 2.95455 11.8182H8.86364C9.02036 11.8182 9.17066 11.7559 9.28147 11.6451C9.39229 11.5343 9.45455 11.384 9.45455 11.2273V3.54545H2.36364Z"
fill="#9E9E9E" />
<path fill-rule="evenodd" clip-rule="evenodd"
d="M4.72727 5.31818C5.05362 5.31818 5.31818 5.58274 5.31818 5.90909V9.45455C5.31818 9.7809 5.05362 10.0455 4.72727 10.0455C4.40092 10.0455 4.13636 9.7809 4.13636 9.45455V5.90909C4.13636 5.58274 4.40092 5.31818 4.72727 5.31818Z"
fill="#9E9E9E" />
<path fill-rule="evenodd" clip-rule="evenodd"
d="M7.09091 5.31818C7.41726 5.31818 7.68182 5.58274 7.68182 5.90909V9.45455C7.68182 9.7809 7.41726 10.0455 7.09091 10.0455C6.76456 10.0455 6.5 9.7809 6.5 9.45455V5.90909C6.5 5.58274 6.76456 5.31818 7.09091 5.31818Z"
fill="#9E9E9E" />
</svg>
</a>
<a href=""
class="w-[30px] h-[30px] border-[1px] border-[#9E9E9E] rounded-[4px] text-center leading-[30px] flex items-center justify-center mr-[5px]">
<svg xmlns="http://www.w3.org/2000/svg" width="13" height="13"
viewBox="0 0 13 13" fill="none">
<path fill-rule="evenodd" clip-rule="evenodd"
d="M0 1.08333C0 0.485025 0.485025 0 1.08333 0H11.9167C12.515 0 13 0.485025 13 1.08333V11.9167C13 12.515 12.515 13 11.9167 13H1.08333C0.485025 13 0 12.515 0 11.9167V1.08333ZM11.9167 1.08333H1.08333V11.9167H11.9167V1.08333Z"
fill="#9E9E9E" />
<path fill-rule="evenodd" clip-rule="evenodd"
d="M3.82164 6.53001C4.03318 6.31848 4.37614 6.31848 4.58768 6.53001L6.49997 8.44231L8.41227 6.53001C8.6238 6.31848 8.96677 6.31848 9.1783 6.53001C9.38984 6.74155 9.38984 7.08451 9.1783 7.29604L6.88299 9.59136C6.67146 9.80289 6.32849 9.80289 6.11696 9.59136L3.82165 7.29604C3.61011 7.08451 3.61011 6.74155 3.82164 6.53001Z"
fill="#9E9E9E" />
<path fill-rule="evenodd" clip-rule="evenodd"
d="M6.5 3.25C6.79915 3.25 7.04167 3.49251 7.04167 3.79167V9.20833C7.04167 9.50749 6.79915 9.75 6.5 9.75C6.20085 9.75 5.95833 9.50749 5.95833 9.20833V3.79167C5.95833 3.49251 6.20085 3.25 6.5 3.25Z"
fill="#9E9E9E" />
</svg>
</a>
</div>
<div class="flex items-center w-[150px] mt-[10px]">
<span>STT</span>
<input type="text" value="1"
class="w-[55px] border-[1px] border-[#D8D8D8] shadow-[0_2px_4px_0_rgba(0,0,0,0.12)] px-[5px] py-[3px] rounded-[4px] ml-[5px]">
</div>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
<!-- end -->
<!-- Script -->
<script src="https://cdn.jsdelivr.net/npm/jquery@3.3.1/dist/jquery.min.js"></script>
</body>
</html>