Files
admin_hura_8/template/order/detail.html
2024-05-07 15:42:55 +07:00

519 lines
24 KiB
HTML

<div class="global-breadcrumb-container">
<a href="/admin/order/home">Danh sách đơn hàng</a>
<a href="">Chi tiết đơn hàng</a>
</div>
<div class="order-detail-page leading-[20px] max-w-[1141px] m-auto">
<div class="shadow-[0px_1px_1px_0px_rgba(0,0,0,0.10)] rounded-[10px] bg-white p-[15px] m-[12px_0]">
<div class="flex items-center justify-between">
<b class="text-[18px] font-[700] mb-[3px] leading-[23px]">Đơn hàng #000-368</b>
<div class="text-right">
<a href="" title="In đơn hàng"
class="hover:bg-[#0041E8] hover:text-[#fff] inline-block text-center text-[15px] text-[#9E9E9E] rounded-[4px] ml-[10px] p-[8px] border border-[#ececec] bg-[#F9F9F9]">
<i class="fas fa-print"></i>
<span>In đơn hàng</span>
</a>
<a href="" title=""
class="hover:bg-[#0041E8] hover:text-[#fff] inline-block text-center text-[15px] text-[#9E9E9E] rounded-[4px] ml-[10px] p-[8px] border border-[#ececec] bg-[#F9F9F9]">
<i class="far fa-envelope"></i>
<span>Gửi email</span>
</a>
</div>
</div>
<p class="mt-[5px]">Thời gian: 16-11-2023, 9:59 am</p>
</div>
<div class="flex flex-wrap justify-between">
<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="#js-update-shipping-address" data-fancybox title="Cập nhật địa chỉ nhận hàng"
class="icons icon-edit inline-block" 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="#js-update-payment" data-fancybox title="Cập nhật địa chỉ thanh toán"
class="icons icon-edit inline-block" 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="#js-update-order-shipping" data-fancybox=""
title="Cập nhật phí ship cho đơn hàng" class="icons icon-edit inline-block"
style="background-position: -111px -86px;vertical-align:sub;"></a>
</td>
</tr>
<tr>
<td> Phí thu hộ </td>
<td>
<span> 0 VND </span>
<a href="#js-update-order-shipping" data-fancybox=""
title="Cập nhật phí ship cho đơn hàng" class="icons icon-edit inline-block"
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]">
<div
class="rounded-[15px] w-[100%] bg-white p-[18px_16px] shadow-[0px_1px_1px_0px_rgba(0,0,0,0.10)] mb-[16px]">
<p class="mb-[7px] font-[700]">Nhân sự xử lý đơn hàng</p>
<p>
<span class="inline-block">Uyên Hura</span>
<a href="javascript:$('#js-assign-holder').toggle()" title="Chỉnh sửa"
class="icons icon-edit inline-block w-[18px] h-[18px]"
style="background-position: -111px -86px;vertical-align: sub;"></a>
</p>
<div id="js-assign-holder" style="display: none">
<select
onchange="OrderManagement.assignAdmin('130', this.value, this.options[this.selectedIndex].text)"
class="mt-[10px] block w-[100%] h-[30px] border border-[#D8D8D8] rounded-[4px]"
id="js-assign-admin">
<option value="">--Người thực hiện --</option>
<option value="24">Uyên Hura</option>
<option value="23">HuraSoft</option>
<option value="25">Quân Hura</option>
</select>
<div id="assign_status"></div>
</div>
</div>
<div class="rounded-[15px] bg-white p-[18px_16px] shadow-[0px_1px_1px_0px_rgba(0,0,0,0.10)] mb-[16px]">
<p class="mb-[7px] font-[700]"> Trạng thái thanh toán </p>
<p class="flex items-center m-[8px_0]">
<span style="background: #E00000"
class="leading-[30px] mr-[5px] p-[0_9px] rounded-[15px] text-[#fff]">
Chưa thanh toán
</span>
<a href="javascript:$('#js-payment-status-holder').show()" title="Chỉnh sửa"
class="icons icon-edit inline-block w-[18px] h-[18px]"
style="background-position: -111px -86px;vertical-align: sub;"></a>
</p>
<div id="js-payment-status-holder" style="display: none;">
<div>
<textarea placeholder="Ghi chú (v.d. Chuyển khoản ngân hàng VCB, số tham chiếu 1234)"
id="js-payment-comment"
class="m-[10px_0] block w-[100%] min-h-[76px] max-h-[120px] border border-[#D8D8D8] rounded-[4px] p-[8px]"></textarea>
</div>
<div style="margin: 5px 0 10px;">
<input type="button" onclick="OrderManagement.update_payment_status()"
title="Click để xác nhận đơn đã được thanh toán đủ" value="Đã nhận đủ"
class="bg-[#0041E8] cursor-pointer font-[500] h-[32px] p-[0_15px] rounded-[4px] text-[#fff]">
<input type="button" value="Quay lại"
class="bg-[#ECECEC] cursor-pointer font-[500] h-[32px] p-[0_12px] rounded-[4px] text-[#9E9E9E]"
onclick="$('#js-payment-status-holder').hide()">
</div>
</div>
<p>Khách chọn: Thanh toán bằng VNPAY</p>
</div>
<div class="rounded-[15px] bg-white p-[18px_16px] shadow-[0px_1px_1px_0px_rgba(0,0,0,0.10)] mb-[16px]">
<p class="mb-[7px] font-[700]"> Trạng thái vận chuyển </p>
<p class="flex items-center m-[8px_0]">
<span style="background: #E00000"
class="leading-[30px] mr-[5px] p-[0_9px] rounded-[15px] text-[#fff]">
Chưa chuyển
</span>
<a href="javascript:$('#js-fulfillment-status-holder').show()" title="Chỉnh sửa"
class="icons icon-edit inline-block w-[18px] h-[18px]"
style="background-position: -111px -86px;vertical-align: sub;"></a>
</p>
<div id="js-fulfillment-status-holder" style="display: none;">
<div>
<textarea placeholder="Ghi chú (v.d. Chuyển phát ViettelPost, mã phiếu gửi 1234)"
id="js-fulfillment-comment"
class="m-[10px_0] block w-[100%] min-h-[76px] max-h-[120px] border border-[#D8D8D8] rounded-[4px] p-[8px]"></textarea>
</div>
<div style="margin: 5px 0 10px;">
<input type="button" onclick="OrderManagement.update_fulfillment_status()"
title="Click để xác nhận đơn đã được vận chuyển thành công" value="Đã vận chuyển"
class="bg-[#0041E8] cursor-pointer font-[500] h-[32px] p-[0_15px] rounded-[4px] text-[#fff]">
<input type="button" value="Quay lại"
class="bg-[#ECECEC] cursor-pointer font-[500] h-[32px] p-[0_12px] rounded-[4px] text-[#9E9E9E]"
onclick="$('#js-fulfillment-status-holder').hide()">
</div>
</div>
<p>Khách chọn: Giao hàng tiêu chuẩn</p>
</div>
<div class="rounded-[15px] bg-white p-[18px_16px] shadow-[0px_1px_1px_0px_rgba(0,0,0,0.10)] mb-[16px]">
<p class="mb-[7px] font-[700]">
Trạng thái đơn hàng
<a href="javascript:$('#js-order-status-holder').show()" title="Chỉnh sửa"
class="icons icon-edit inline-block w-[18px] h-[18px]"
style="background-position: -111px -86px;vertical-align: sub;"></a>
</p>
<div id="js-order-status-holder" style="display: none;">
<div>
<textarea placeholder="Ghi chú" id="js-order-comment"
class="m-[10px_0] block w-[100%] min-h-[76px] max-h-[120px] border border-[#D8D8D8] rounded-[4px] p-[8px]"></textarea>
</div>
<div style="margin-top: 5px;">
<select id="js-order-status-select"
class="m-[10px_0] block w-[100%] h-[30px] border border-[#D8D8D8] rounded-[4px]">
<option value="">--Chọn trạng thái--</option>
<option value="new">Mới</option>
<option value="processing">Đang xử lý</option>
<option value="success">Thành công</option>
<option value="closed">Đóng lại</option>
<option value="canceled">Hủy</option>
</select>
<input type="button" onclick="OrderManagement.update_order_status()" title="Click để xác nhận"
value="Lưu lại"
class="bg-[#0041E8] cursor-pointer font-[500] h-[32px] p-[0_15px] rounded-[4px] text-[#fff] mt-[15px]">
<input type="button" value="Quay lại"
class="bg-[#ECECEC] cursor-pointer font-[500] h-[32px] p-[0_12px] rounded-[4px] text-[#9E9E9E] mt-[15px]"
onclick="$('#js-order-status-holder').hide()">
</div>
</div>
</div>
<div class="rounded-[15px] bg-white p-[18px_16px] shadow-[0px_1px_1px_0px_rgba(0,0,0,0.10)] mb-[16px]">
<p class="mb-[7px] font-[700]"> Ghi chú </p>
<textarea placeholder="Ghi chú" id="js-comment"
class="m-[10px_0] block w-[100%] min-h-[76px] max-h-[120px] border border-[#D8D8D8] rounded-[4px] p-[8px]"></textarea>
<div>
<span id="js-comment-status-holder"></span>
<input type="button" onclick="OrderManagement.update_admin_comment()" value="Lưu lại"
class="bg-[#0041E8] cursor-pointer font-[500] h-[32px] p-[0_15px] rounded-[4px] text-[#fff]">
</div>
</div>
</div>
</div>
</div>
<!-- // Cập nhật địa chỉ nhận hàng -->
<div id="js-update-shipping-address" class="p-[20px_16px] rounded-[15px] w-[100%] max-w-[600px]" style="display: none;">
<p class="leading-[20px] text-[16px] font-bold mb-[20px]"> Cập nhật địa chỉ nhận hàng </p>
<table class="w-[100%]">
<tr>
<td width="100">Họ tên</td>
<td>
<input type="text" id="js-shipping-address-person_name" value="Nguyen Duc Quan"
class="shadow-[0px_2px_4px_0px_rgba(0,0,0,0.12)] p-[0_10px] w-[100%] h-[32px] mb-[10px] border border-[#D8D8D8] rounded-[4px] block">
</td>
</tr>
<tr>
<td>Mobile</td>
<td>
<input type="text" id="js-shipping-address-mobile" value="0832256395"
class="shadow-[0px_2px_4px_0px_rgba(0,0,0,0.12)] p-[0_10px] w-[100%] h-[32px] mb-[10px] border border-[#D8D8D8] rounded-[4px] block">
</td>
</tr>
<tr>
<td>Tỉnh/thành</td>
<td>
<input type="text" id="js-shipping-address-province_name" value="TP HCM"
class="shadow-[0px_2px_4px_0px_rgba(0,0,0,0.12)] p-[0_10px] w-[100%] h-[32px] mb-[10px] border border-[#D8D8D8] rounded-[4px] block">
</td>
</tr>
<tr>
<td>Quận huyện</td>
<td>
<input type="text" id="js-shipping-address-district_name" value="Quận Gò Vấp"
class="shadow-[0px_2px_4px_0px_rgba(0,0,0,0.12)] p-[0_10px] w-[100%] h-[32px] mb-[10px] border border-[#D8D8D8] rounded-[4px] block">
</td>
</tr>
<tr>
<td>Phường/xã</td>
<td>
<input type="text" id="js-shipping-address-ward_name" value=""
class="shadow-[0px_2px_4px_0px_rgba(0,0,0,0.12)] p-[0_10px] w-[100%] h-[32px] mb-[10px] border border-[#D8D8D8] rounded-[4px] block">
</td>
</tr>
<tr>
<td>Địa chỉ</td>
<td>
<input type="text" id="js-shipping-address-address" size="50" value="Kiến Hưng - Hà Đông - Hà Nội"
class="shadow-[0px_2px_4px_0px_rgba(0,0,0,0.12)] p-[0_10px] w-[100%] h-[32px] mb-[10px] border border-[#D8D8D8] rounded-[4px] block">
</td>
</tr>
<!--<tr><td>Phân loại</td><td><input type=text id="js-shipping-address-type" size=30 value="" /></td></tr>-->
<tr>
<td>Ghi chú</td>
<td>
<input type="text" id="js-shipping-address-note" value="test"
class="shadow-[0px_2px_4px_0px_rgba(0,0,0,0.12)] p-[0_10px] w-[100%] h-[32px] mb-[10px] border border-[#D8D8D8] rounded-[4px] block">
</td>
</tr>
<tr>
<td></td>
<td>
<input type="button" value="Cập nhật" onclick="OrderManagement.updateShippingAddress()"
class="text-[#fff] bg-[#0041E8] rounded-[4px] h-[32px] p-[0_8px] cursor-pointer">
</td>
</tr>
</table>
</div>
<!-- // Cập nhật địa chỉ thanh toán -->
<div id="js-update-payment" class="p-[20px_16px] rounded-[15px] w-[100%] max-w-[600px]" style="display: none;">
<p class="leading-[20px] text-[16px] font-bold mb-[15px]"> Cập nhật địa chỉ thanh toán </p>
<label class="inline-flex cursor-pointer">
<input type="checkbox" value="1" id="js-payment-address-check-same-as-shipping" checked=""
onchange="$('#js-payment-address-holder').toggle()" class="scale-[1.4] mr-[10px]">
<span> Giống như địa chỉ nhận hàng </span>
</label>
<div id="js-payment-address-holder" style="display: none;margin-top: 20px">
<p class="leading-[20px] text-[16px] font-bold mb-[15px]"> Nhập địa chỉ: </p>
<table class="w-[100%]">
<tr>
<td width="100">Họ tên</td>
<td>
<input type="text" id="js-payment-address-person_name" value=""
class="shadow-[0px_2px_4px_0px_rgba(0,0,0,0.12)] p-[0_10px] w-[100%] h-[32px] mb-[10px] border border-[#D8D8D8] rounded-[4px] block">
</td>
</tr>
<tr>
<td>Mobile</td>
<td>
<input type="text" id="js-payment-address-mobile" value=""
class="shadow-[0px_2px_4px_0px_rgba(0,0,0,0.12)] p-[0_10px] w-[100%] h-[32px] mb-[10px] border border-[#D8D8D8] rounded-[4px] block">
</td>
</tr>
<tr>
<td>Tỉnh/thành</td>
<td>
<input type="text" id="js-payment-address-province_name" value=""
class="shadow-[0px_2px_4px_0px_rgba(0,0,0,0.12)] p-[0_10px] w-[100%] h-[32px] mb-[10px] border border-[#D8D8D8] rounded-[4px] block">
</td>
</tr>
<tr>
<td>Quận huyện</td>
<td>
<input type="text" id="js-payment-address-district_name" value=""
class="shadow-[0px_2px_4px_0px_rgba(0,0,0,0.12)] p-[0_10px] w-[100%] h-[32px] mb-[10px] border border-[#D8D8D8] rounded-[4px] block">
</td>
</tr>
<tr>
<td>Phường/xã</td>
<td>
<input type="text" id="js-payment-address-ward_name" value=""
class="shadow-[0px_2px_4px_0px_rgba(0,0,0,0.12)] p-[0_10px] w-[100%] h-[32px] mb-[10px] border border-[#D8D8D8] rounded-[4px] block">
</td>
</tr>
<tr>
<td>Địa chỉ</td>
<td>
<input type="text" id="js-payment-address-address" value=""
class="shadow-[0px_2px_4px_0px_rgba(0,0,0,0.12)] p-[0_10px] w-[100%] h-[32px] mb-[10px] border border-[#D8D8D8] rounded-[4px] block">
</td>
</tr>
<!-- <tr><td>Phân loại</td><td><input type=text id="js-payment-address-type" value="" class="shadow-[0px_2px_4px_0px_rgba(0,0,0,0.12)] p-[0_10px] w-[100%] h-[32px] mb-[10px] border border-[#D8D8D8] rounded-[4px] block"/></td></tr> -->
<tr>
<td>Ghi chú</td>
<td>
<input type="text" id="js-payment-address-note" value=""
class="shadow-[0px_2px_4px_0px_rgba(0,0,0,0.12)] p-[0_10px] w-[100%] h-[32px] mb-[10px] border border-[#D8D8D8] rounded-[4px] block">
</td>
</tr>
<tr>
<td></td>
<td>
<input type="button" value="Cập nhật" onclick="OrderManagement.updatePaymentAddress()"
class="text-[#fff] bg-[#0041E8] rounded-[4px] h-[32px] p-[0_8px] cursor-pointer">
</td>
</tr>
</table>
</div>
</div>
<!-- // Cập nhật phí ship cho đơn hàng -->
<div id="js-update-order-shipping" class="p-[20px_16px] rounded-[15px] w-[100%] max-w-[600px]" style="display: none;">
<p class="leading-[20px] text-[16px] font-bold mb-[20px]"> Cập nhật phí ship cho đơn hàng </p>
<table class="w-[100%]">
<tr>
<td>Phí ship</td>
<td>
<input type="text" id="shippingFee" onkeyup="this.value = writeStringToPrice(this.value)" value="0"
class="shadow-[0px_2px_4px_0px_rgba(0,0,0,0.12)] p-[0_10px] h-[32px] m-[0_10px_10px_0] border border-[#D8D8D8] rounded-[4px] inline-block">
<span>VND</span>
</td>
</tr>
<tr>
<td>Chi chú</td>
<td>
<input type="text" id="shippingNote" value=""
class="shadow-[0px_2px_4px_0px_rgba(0,0,0,0.12)] p-[0_10px] w-[100%] h-[32px] mb-[10px] border border-[#D8D8D8] rounded-[4px] block">
<i>v.d. Gửi xe khách, Máy bay, EMS</i>
</td>
</tr>
<tr>
<td></td>
<td>
<input type="button" value="Cập nhật" onclick="update_order_shipping(369)"
class="text-[#fff] bg-[#0041E8] rounded-[4px] h-[32px] p-[0_8px] cursor-pointer mt-[15px]">
</td>
</tr>
</table>
</div>