renolation/worker
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

add price policy

Browse Source
This commit is contained in:
Phuoc Nguyen
2025-11-03 11:20:09 +07:00
parent c0527a086c
commit 21c1c3372c
53 changed files with 7160 additions and 2361 deletions
Download Patch File Download Diff File Expand all files Collapse all files

171
html/orders.html
View File

@@ -8,6 +8,62 @@
<link rel="stylesheet" href="assets/css/style.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
</head>
<style>
.modal-overlay {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba(0,0,0,0.5);
z-index: 1000;
display: flex;
align-items: center;
justify-content: center;
padding: 20px;
}
.modal-content {
background: white;
border-radius: 12px;
width: 100%;
max-width: 500px;
animation: slideUp 0.3s ease;
}
@keyframes slideUp {
from { transform: translateY(20px); opacity: 0; }
to { transform: translateY(0); opacity: 1; }
}
.modal-header {
padding: 20px;
border-bottom: 1px solid #e5e7eb;
display: flex;
justify-content: space-between;
align-items: center;
}
.modal-body {
padding: 20px;
}
.modal-footer {
padding: 20px;
border-top: 1px solid #e5e7eb;
display: flex;
gap: 12px;
}
.modal-close {
background: none;
border: none;
font-size: 20px;
color: #6b7280;
cursor: pointer;
}
</style>
<body>
<div class="page-wrapper">
<!-- Header -->
@@ -15,9 +71,9 @@
<a href="index.html" class="back-button">
<i class="fas fa-arrow-left"></i>
</a>
<h1 class="header-title">Danh sách đơn hàng</h1>
<button class="back-button">
<i class="fas fa-plus"></i>
<h1 class="header-title">Danh sách đơn hàng</h1>
<button class="back-button" onclick="openInfoModal()">
<i class="fas fa-info-circle"></i>
</button>
</div>
@@ -39,11 +95,10 @@
</div>-->
<!-- Filter Pills -->
<div class="filter-container">
<button class="filter-pill active">Tất cả</button>
<button class="filter-pill">Chờ xác nhận</button>
<button class="filter-pill">Gạch ốp tường</button>
<!--<button class="filter-pill active">Tất cả</button>-->
<button class="filter-pill active">Chờ xác nhận</button>
<button class="filter-pill">Đang xử lý</button>
<button class="filter-pill">Đang giao</button>
<!--<button class="filter-pill">Đang giao</button>-->
<button class="filter-pill">Hoàn thành</button>
<button class="filter-pill">Đã hủy</button>
</div>
@@ -111,7 +166,7 @@
</div>
<!-- Order Item 4 - Pending -->
<div class="order-card pending" onclick="viewOrderDetail('DH001231')">
<div class="order-card pending" data-status="pending" onclick="viewOrderDetail('DH001231')">
<div class="order-status-indicator"></div>
<div class="order-content">
<div class="d-flex justify-between align-start mb-2">
@@ -175,12 +230,108 @@
<span>Cài đặt</span>
</a>
</div>-->
</div>
<!-- Info Modal -->
<div id="infoModal" class="modal-overlay" style="display: none;">
<div class="modal-content info-modal">
<div class="modal-header">
<h3 class="modal-title" style="font-weight: bold;">Hướng dẫn sử dụng</h3>
<button class="modal-close" onclick="closeInfoModal()">
<i class="fas fa-times"></i>
</button>
</div>
<div class="modal-body">
<p>Đây là nội dung hướng dẫn sử dụng cho tính năng Quản lý Đơn hàng:</p>
<ul class="list-disc ml-6 mt-3">
<li>Sử dụng các tab (Chờ xác nhận, Đang giao...) để lọc nhanh trạng thái các đơn hàng của bạn.</li>
<li>Bấm vào một đơn hàng bất kỳ để xem thông tin chi tiết, sản phẩm, và ngày giao dự kiến.</li>
<li>Thanh tiến trình giúp bạn biết đơn hàng đang ở bước nào: Đã tạo, Đã xác nhận, hay Đã hoàn thành.</li>
<li>Nếu bạn đã chọn "Yêu cầu đàm phán giá" khi đặt hàng, đơn hàng sẽ ở trạng thái "Chờ xác nhận & đàm phán" cho đến khi Sales liên hệ.</li>
<li>Bạn có thể xem "Thông tin hóa đơn" đã khai báo tại trang chi tiết đơn hàng.</li>
</ul>
</div>
<div class="modal-footer">
<button class="btn btn-primary" onclick="closeInfoModal()">Đóng</button>
</div>
</div>
</div>
</div>
<script>
function openInfoModal() {
document.getElementById('infoModal').style.display = 'flex';
}
function closeInfoModal() {
document.getElementById('infoModal').style.display = 'none';
}
function viewOrderDetail(orderId) {
window.location.href = `order-detail.html?id=${orderId}`;
}
// Close modal when clicking outside
document.addEventListener('click', function(e) {
if (e.target.classList.contains('modal-overlay')) {
e.target.style.display = 'none';
}
});
// Filter functionality
document.addEventListener('DOMContentLoaded', function() {
const filterButtons = document.querySelectorAll('.filter-pill');
const orderCards = document.querySelectorAll('.order-card');
// Set "Chờ xác nhận" as default active tab
filterButtons.forEach(btn => btn.classList.remove('active'));
filterButtons[0].classList.add('active'); // First button is "Chờ xác nhận"
// Show only pending orders by default
filterOrders('pending');
filterButtons.forEach(button => {
button.addEventListener('click', function() {
// Remove active class from all buttons
filterButtons.forEach(btn => btn.classList.remove('active'));
// Add active class to clicked button
this.classList.add('active');
// Get filter status
const filterText = this.textContent.trim();
let status = '';
switch(filterText) {
case 'Chờ xác nhận':
status = 'pending';
break;
case 'Đang xử lý':
status = 'processing';
break;
case 'Đang giao':
status = 'shipping';
break;
case 'Hoàn thành':
status = 'completed';
break;
case 'Đã hủy':
status = 'cancelled';
break;
}
filterOrders(status);
});
});
function filterOrders(status) {
orderCards.forEach(card => {
if (status === '' || card.classList.contains(status)) {
card.style.display = 'block';
} else {
card.style.display = 'none';
}
});
}
});
</script>
</body>
</html>