146 lines
6.1 KiB
HTML
146 lines
6.1 KiB
HTML
|
<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="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>
|
||
|
|
|
||
|
|
<a href=""
|
||
|
|
class="bg-[#F0F8FF] flex h-[26px] items-center justify-center rounded-[4px] text-center w-[26px]">
|
||
|
|
<i class="icons icon-cart"></i>
|
||
|
|
</a>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<p class="text-[28px] max-[1620px]:text-[22px] leading-[36px] font-[600]">10.000.000</p>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<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]">
|
||
|
|
<i class="icons icon-increase"></i>
|
||
|
|
<b class="font-[700]"> 10% </b>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<p class="text-[#C5C5C5] text-[12px]">Hôm qua</p>
|
||
|
|
</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="border-b border-b-[#FAFAFB] p-[10px_10px_15px_13px]">
|
||
|
|
<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>
|
||
|
|
|
||
|
|
<a href=""
|
||
|
|
class="bg-[#F0F9F2] flex h-[26px] items-center justify-center rounded-[4px] text-center w-[26px]">
|
||
|
|
<i class="icons icon-contact"></i>
|
||
|
|
</a>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<p class="text-[28px] max-[1620px]:text-[22px] leading-[36px] font-[600]">10.000.000</p>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<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]">
|
||
|
|
<i class="icons icon-increase"></i>
|
||
|
|
<b class="font-[700]"> 10% </b>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<p class="text-[#C5C5C5] text-[12px]">Hôm qua</p>
|
||
|
|
</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="border-b border-b-[#FAFAFB] p-[10px_10px_15px_13px]">
|
||
|
|
<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>
|
||
|
|
|
||
|
|
<a href=""
|
||
|
|
class="bg-[#F7F5FF] flex h-[26px] items-center justify-center rounded-[4px] text-center w-[26px]">
|
||
|
|
<i class="icons icon-pay"></i>
|
||
|
|
</a>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<p class="text-[28px] max-[1620px]:text-[22px] leading-[36px] font-[600]">10.000.000</p>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<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]">
|
||
|
|
<i class="icons icon-reduce"></i>
|
||
|
|
<b class="font-[700]"> 10% </b>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<p class="text-[#C5C5C5] text-[12px]">Hôm qua</p>
|
||
|
|
</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="border-b border-b-[#FAFAFB] p-[10px_10px_15px_13px]">
|
||
|
|
<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>
|
||
|
|
|
||
|
|
<a href=""
|
||
|
|
class="bg-[#F9F2F2] flex h-[26px] items-center justify-center rounded-[4px] text-center w-[26px]">
|
||
|
|
<i class="icons icon-installment"></i>
|
||
|
|
</a>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<p class="text-[28px] max-[1620px]:text-[22px] leading-[36px] font-[600]">10.000.000</p>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<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]">
|
||
|
|
<i class="icons icon-reduce"></i>
|
||
|
|
<b class="font-[700]"> 10% </b>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<p class="text-[#C5C5C5] text-[12px]">Hôm qua</p>
|
||
|
|
</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="flex justify-between min-h-[100px]">
|
||
|
|
<div>
|
||
|
|
<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>
|
||
|
|
</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">
|
||
|
|
12%
|
||
|
|
<i class="fa-solid fa-arrow-up ml-[5px]"></i>
|
||
|
|
</div>
|
||
|
|
</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="flex justify-between items-center pt-5">
|
||
|
|
|
||
|
|
<select>
|
||
|
|
<option value=""> Last 7 days </option>
|
||
|
|
<option value=""> Yesterday </option>
|
||
|
|
<option value=""> Today </option>
|
||
|
|
<option value=""> Last 7 days </option>
|
||
|
|
<option value=""> Last 30 days </option>
|
||
|
|
<option value=""> Last 90 days </option>
|
||
|
|
</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">
|
||
|
|
Users Report
|
||
|
|
<i class="fa-solid fa-angle-right ml-[5px]"></i>
|
||
|
|
</a>
|
||
|
|
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|