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

first commit

Browse Source
This commit is contained in:
Phuoc Nguyen
2025-10-17 15:37:58 +07:00
commit 2125e85d40
123 changed files with 27633 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

234
html/quote-create.html Normal file
View File

@@ -0,0 +1,234 @@
<!DOCTYPE html>
<html lang="vi">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Tạo yêu cầu báo giá - EuroTile Worker</title>
<script src="https://cdn.tailwindcss.com"></script>
<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>
<body>
<div class="page-wrapper">
<!-- Header -->
<div class="header">
<a href="quotes-list.html" class="back-button">
<i class="fas fa-arrow-left"></i>
</a>
<h1 class="header-title">Tạo yêu cầu báo giá</h1>
<div style="width: 32px;"></div>
</div>
<div class="container">
<div class="form-container">
<!-- Project Information -->
<div class="card">
<h3 class="card-title mb-3">Thông tin dự án</h3>
<form id="quoteForm">
<div class="form-group">
<label class="form-label">Tên dự án *</label>
<input type="text" class="form-input" placeholder="Nhập tên dự án" required>
</div>
<div class="form-group">
<label class="form-label">Địa chỉ dự án *</label>
<input type="text" class="form-input" placeholder="Nhập địa chỉ chi tiết" required>
</div>
<div class="form-group">
<label class="form-label">Loại công trình</label>
<select class="form-select">
<option value="">Chọn loại công trình</option>
<option value="villa">Villa</option>
<option value="apartment">Chung cư</option>
<option value="office">Văn phòng</option>
<option value="commercial">Thương mại</option>
<option value="resort">Resort/Khách sạn</option>
<option value="house">Nhà phố</option>
<option value="other">Khác</option>
</select>
</div>
<div class="form-group">
<label class="form-label">Diện tích dự kiến (m²)</label>
<input type="number" class="form-input" placeholder="Nhập diện tích">
</div>
</form>
</div>
<!-- Product List -->
<div class="card">
<div class="d-flex justify-between align-center mb-3">
<h3 class="card-title">Danh sách sản phẩm</h3>
<button class="btn btn-secondary btn-sm" onclick="addProduct()">
<i class="fas fa-plus"></i>
Thêm sản phẩm
</button>
</div>
<div id="productList">
<!-- Product Item 1 -->
<div class="product-quote-item">
<div class="product-quote-info">
<img src="https://placehold.co/60x60/F5F5F5/005B9A/png?text=G1" alt="Product">
<div class="product-quote-details">
<h4 class="product-quote-name">Gạch Eurotile MỘC LAM E03</h4>
<p class="product-quote-specs">60x60cm - Matt</p>
<p class="product-quote-price">285.000đ/m²</p>
</div>
</div>
<div class="product-quote-actions">
<div class="quantity-input">
<input type="number" value="50" min="1" class="qty-input">
<span class="qty-unit">m²</span>
</div>
<button class="btn-remove-product" onclick="removeProduct(this)">
<i class="fas fa-trash"></i>
</button>
</div>
</div>
<!-- Product Item 2 -->
<div class="product-quote-item">
<div class="product-quote-info">
<img src="https://placehold.co/60x60/E8E8E8/005B9A/png?text=G2" alt="Product">
<div class="product-quote-details">
<h4 class="product-quote-name">Gạch Granite Premium G501</h4>
<p class="product-quote-specs">80x80cm - Polished</p>
<p class="product-quote-price">420.000đ/m²</p>
</div>
</div>
<div class="product-quote-actions">
<div class="quantity-input">
<input type="number" value="30" min="1" class="qty-input">
<span class="qty-unit">m²</span>
</div>
<button class="btn-remove-product" onclick="removeProduct(this)">
<i class="fas fa-trash"></i>
</button>
</div>
</div>
</div>
<!-- Empty State for Products -->
<div class="empty-product-state" id="emptyProductState" style="display: none;">
<i class="fas fa-inbox empty-icon-small"></i>
<p>Chưa có sản phẩm nào</p>
<button class="btn btn-primary btn-sm mt-2" onclick="addProduct()">
Thêm sản phẩm đầu tiên
</button>
</div>
</div>
<!-- Additional Notes -->
<div class="card">
<h3 class="card-title mb-3">Ghi chú</h3>
<textarea class="form-textarea" rows="4" placeholder="Thêm ghi chú hoặc yêu cầu đặc biệt cho báo giá này..."></textarea>
</div>
<!-- Quote Summary -->
<div class="card quote-summary">
<h3 class="card-title mb-3">Tóm tắt yêu cầu</h3>
<div class="summary-row">
<span>Tổng sản phẩm:</span>
<span id="totalProducts">2 sản phẩm</span>
</div>
<div class="summary-row">
<span>Tổng diện tích:</span>
<span id="totalArea">80 m²</span>
</div>
<div class="summary-row">
<span>Giá trị ước tính:</span>
<span id="estimatedValue">26.850.000 VND</span>
</div>
</div>
<!-- Action Buttons -->
<div class="form-actions">
<button type="button" class="btn btn-secondary" onclick="saveDraft()">
<i class="fas fa-save"></i>
Lưu nháp
</button>
<button type="submit" class="btn btn-primary" onclick="submitQuoteRequest()">
<i class="fas fa-paper-plane"></i>
Gửi yêu cầu
</button>
</div>
</div>
</div>
</div>
<script>
function addProduct() {
alert('Chức năng thêm sản phẩm sẽ được phát triển - sẽ mở danh sách sản phẩm để chọn');
}
function removeProduct(button) {
if (confirm('Bạn có chắc chắn muốn xóa sản phẩm này?')) {
const productItem = button.closest('.product-quote-item');
productItem.remove();
updateSummary();
// Check if product list is empty
const productList = document.getElementById('productList');
if (productList.children.length === 0) {
document.getElementById('emptyProductState').style.display = 'block';
}
}
}
function updateSummary() {
const productItems = document.querySelectorAll('.product-quote-item');
let totalProducts = productItems.length;
let totalArea = 0;
let estimatedValue = 0;
productItems.forEach(item => {
const qty = parseInt(item.querySelector('.qty-input').value) || 0;
const priceText = item.querySelector('.product-quote-price').textContent;
const price = parseInt(priceText.replace(/[^\d]/g, '')) || 0;
totalArea += qty;
estimatedValue += qty * price;
});
document.getElementById('totalProducts').textContent = `${totalProducts} sản phẩm`;
document.getElementById('totalArea').textContent = `${totalArea} m²`;
document.getElementById('estimatedValue').textContent = estimatedValue.toLocaleString('vi-VN') + ' VND';
}
function saveDraft() {
alert('Đã lưu nháp yêu cầu báo giá!');
}
function submitQuoteRequest() {
const form = document.getElementById('quoteForm');
const productItems = document.querySelectorAll('.product-quote-item');
if (!form.checkValidity()) {
form.reportValidity();
return;
}
if (productItems.length === 0) {
alert('Vui lòng thêm ít nhất một sản phẩm!');
return;
}
alert('Yêu cầu báo giá đã được gửi thành công! Chúng tôi sẽ liên hệ trong vòng 24 giờ.');
window.location.href = 'quotes-list.html';
}
// Update summary when quantity changes
document.addEventListener('input', function(e) {
if (e.target.classList.contains('qty-input')) {
updateSummary();
}
});
// Initial summary calculation
document.addEventListener('DOMContentLoaded', updateSummary);
</script>
</body>
</html>