tieptk/admin_hura_8
2
1
Fork 0
Code Issues 1 Pull Requests Projects Releases Wiki Activity

update order page

Browse Source
This commit is contained in:
Dao Duc
2024-01-26 11:51:46 +07:00
parent 5f080f0be6
commit 218549a354
11 changed files with 224 additions and 61 deletions
Download Patch File Download Diff File Expand all files Collapse all files

BIN
assets/images/icons/26.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.1 KiB

BIN
assets/images/icons/27.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 712 B

BIN
assets/images/icons/28.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 622 B

BIN
assets/images/icons/29.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 893 B

BIN
assets/images/icons/30.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 847 B

BIN
assets/images/icons/31.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 405 B

BIN
assets/images/icons/32.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 541 B

65
assets/script/pc_style.css
View File

@@ -711,41 +711,13 @@ input[type=radio]:focus:before {
color: #fff;
}
.order-page .order-page-table {
line-height: 20px;
text-align: center;
}
.order-page .order-page-table a {
color: #0041E8;
}
.order-page .order-page-table a:hover {
text-decoration: underline;
}
.order-page .order-page-table table {
width: 100%;
}
.order-page .order-page-table thead {
background: #F6F6F6;
font-weight: 600;
}
.order-page .order-page-table thead td {
padding: 8px;
}
.order-page .order-page-table td {
padding: 14px 8px;
border: 1px solid #ECECEC;
text-transform: capitalize;
}
.order-page .order-page-table td * {
display: inline-block;
}
.order-page .order-page-table select {
border-radius: 4px;
border: 1px solid #D8D8D8;
box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.12);
height: 32px;
display: block;
width: 100%;
padding: 0 0 0 5px;
}
.order-page .order-page-table .icons {
width: 30px;
@@ -764,6 +736,43 @@ input[type=radio]:focus:before {
background-position: -145px -82px;
}
.order-page-table {
line-height: 20px;
}
.order-page-table a {
color: #0041E8;
}
.order-page-table a:hover {
text-decoration: underline;
}
.order-page-table table {
width: 100%;
}
.order-page-table thead {
background: #F6F6F6;
font-weight: 600;
}
.order-page-table thead td {
padding: 8px;
}
.order-page-table td {
padding: 10px;
border: 1px solid #ECECEC;
text-transform: capitalize;
}
.order-page-table td * {
display: inline-block;
}
.order-page-table select {
border-radius: 4px;
border: 1px solid #D8D8D8;
box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.12);
height: 32px;
display: block;
width: 100%;
padding: 0 0 0 5px;
}
.paging {
margin: 30px 0;
display: flex;

2
assets/script/pc_style.css.map
View File

File diff suppressed because one or more lines are too long

66
assets/script/pc_style.scss
View File

@@ -726,40 +726,14 @@ input[type="radio"] {
}
}
.order-page-table {
line-height: 20px;
text-align: center;
a{
color: #0041E8;
&:hover{
text-decoration: underline;
}
}
table{
width: 100%;
}
thead {
background: #F6F6F6;
font-weight: 600;
text-align: center;
thead {
td{
padding: 8px;
}
}
td{
padding: 14px 8px;
border: 1px solid #ECECEC;
text-transform: capitalize;
*{
display: inline-block;
}
}
select {
border-radius: 4px;
border: 1px solid #D8D8D8;
box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.12);
height: 32px;
display: block;
width: 100%;
padding: 0 0 0 5px;
}
.icons {
width: 30px;
@@ -778,6 +752,42 @@ input[type="radio"] {
background-position: -145px -82px;
}
}
}
.order-page-table {
line-height: 20px;
a{
color: #0041E8;
&:hover{
text-decoration: underline;
}
}
table{
width: 100%;
}
thead {
background: #F6F6F6;
font-weight: 600;
td{
padding: 8px;
}
}
td{
padding: 10px;
border: 1px solid #ECECEC;
text-transform: capitalize;
*{
display: inline-block;
}
}
select {
border-radius: 4px;
border: 1px solid #D8D8D8;
box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.12);
height: 32px;
display: block;
width: 100%;
padding: 0 0 0 5px;
}
}
.paging {

152
template/order/detail-new.html
View File

@@ -3,21 +3,165 @@
<a href="">Chi tiết đơn hàng</a>
</div>
<div class="order-detail-page max-w-[1141px] m-auto">
<div class="order-detail-page leading-[20px] max-w-[1141px] m-auto">
<div class="text-right">
<a href="" title="In đơn hàng" class="fas fa-print hover:bg-[#0041E8] hover:text-[#fff] inline-block text-center text-[15px] text-[#9E9E9E] rounded-[4px] ml-[10px] w-[30px] h-[30px] leading-[30px] border border-[#ececec] bg-[#F9F9F9]"></a>
<a href="" title="" class="far fa-envelope hover:bg-[#0041E8] hover:text-[#fff] inline-block text-center text-[15px] text-[#9E9E9E] rounded-[4px] ml-[10px] w-[30px] h-[30px] leading-[30px] border border-[#ececec] bg-[#F9F9F9]"></a>
</div>
<div class="shadow-[0px_1px_1px_0px_rgba(0,0,0,0.10)] rounded-[10px] bg-white text-center p-[17px] m-[12px_0] leading-[20px]">
<div class="shadow-[0px_1px_1px_0px_rgba(0,0,0,0.10)] rounded-[10px] bg-white text-center p-[17px] m-[12px_0]">
<p class="text-[18px] font-[700] mb-[3px] leading-[23px]">Đơn hàng #000-368</p>
<p>Thời gian: 16-11-2023, 9:59 am</p>
</div>
<div class="flex flex-wrap justify-between">
<div class="rounded-[15px] bg-white w-[852px] p-[16px]">
<p>left</p>
<div class="shadow-[0px_1px_1px_0px_rgba(0,0,0,0.10)] rounded-[15px] bg-white w-[852px] p-[16px] mb-[25px]">
<div class="mb-[20px]">
<p class="text-[16px] font-[700] mb-[13px]">1. Khách hàng</p>
<div class="order-page-table">
<table>
<tr>
<td width="200"> Tên </td>
<td> Nguyen Duc Quan </td>
</tr>
<tr>
<td> Số điện thoại </td>
<td> 0822256369 </td>
</tr>
<tr>
<td> Email </td>
<td> quannd@hurasoft.com </td>
</tr>
<tr>
<td> Địa chỉ nhận hàng </td>
<td>
<span> Kiến Hưng, Quận Hà Đông, Hà Nội </span>
<a href="javascript:void(0)" title="Chỉnh sửa" class="icons icon-edit inline-block w-[18px] h-[18px]" style="background-position: -111px -86px;"></a>
</td>
</tr>
<tr>
<td> Địa chỉ thanh toán </td>
<td>
<span> Kiến Hưng, Quận Hà Đông, Hà Nội </span>
<a href="javascript:void(0)" title="Chỉnh sửa" class="icons icon-edit inline-block w-[18px] h-[18px]" style="background-position: -111px -86px;"></a>
</td>
</tr>
</table>
</div>
</div>
<div class="mb-[20px]">
<p class="text-[16px] font-[700] mb-[13px]">2. Sản phẩm</p>
<div class="order-page-table text-center">
<table>
<thead>
<tr>
<td> STT </td>
<td> Mã kho </td>
<td width="210"> Tên </td>
<td> Giá </td>
<td> SL </td>
<td> Tổng </td>
<td> Ghi chú </td>
</tr>
</thead>
<tbody>
<tr>
<td> 1 </td>
<td class="text-[#0041E8]"> HH0003 </td>
<td class="text-left">
<a href="" target="_blank" class="text-[#0041E8]"> HHWS - CORE i9 9900X | 32G | NVIDIA RTX 2060 6GB </a>
</td>
<td> 34.800.000 VND (chiếc) </td>
<td> 2 </td>
<td> 69.600.000 VND </td>
<td class="text-left">Ghi chú</td>
</tr>
</tbody>
</table>
</div>
</div>
<div class="mb-[20px]">
<p class="text-[16px] font-[700] mb-[13px]">3. Số tiền</p>
<div class="order-page-table">
<table>
<tr>
<td width="330"> Tổng giá trị </td>
<td class="font-bold">
69.600.000 VND
</td>
</tr>
<tr>
<td> Phí vận chuyển & giao hàng </td>
<td>
<span> 0 VND </span>
<a href="javascript:void(0)" title="Chỉnh sửa" class="icons icon-edit inline-block w-[18px] h-[18px]" style="background-position: -111px -86px;vertical-align:sub;"></a>
</td>
</tr>
<tr>
<td> Phí thu hộ </td>
<td>
<span> 0 VND </span>
<a href="javascript:void(0)" title="Chỉnh sửa" class="icons icon-edit inline-block w-[18px] h-[18px]" style="background-position: -111px -86px;vertical-align:sub;"></a>
</td>
</tr>
<tr>
<td> Tổng thu </td>
<td> 69.600.000 VND </td>
</tr>
</table>
</div>
</div>
<div class="mb-[20px]">
<p class="text-[16px] font-[700] mb-[13px]">4. Lịch sử cập nhật</p>
<div class="order-page-table text-center">
<table>
<thead>
<tr>
<td> STT </td>
<td> Phân loại </td>
<td> Trạng thái </td>
<td> Ghi chú </td>
<td> Người cập nhật </td>
</tr>
</thead>
<tbody>
<tr>
<td> 1 </td>
<td> payment </td>
<td> paid </td>
<td> test </td>
<td> Đức lúc 22-05-2023, 4:49 pm </td>
</tr>
<tr>
<td colspan="5" align="left"> Hiện tại chưa có trạng thái nào được cập nhật </td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<div class="rounded-[10px] w-[273px] leading-[18px]">