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

13:51 25/12/2023

Browse Source
This commit is contained in:
Tieptk
2023-12-25 13:51:24 +07:00
parent 802682da2e
commit 78550801f3
20 changed files with 3125 additions and 103 deletions
Download Patch File Download Diff File Expand all files Collapse all files

128
dist/detail.js vendored
View File

@@ -34,12 +34,68 @@ function GetURLParameter(sParam, url) {
}
}
function XayhtmlProductDeail(product) {
// lay gia cao nhat
const highestBid = getHighestBid(product.list_user);
// xay html hien thi anh san pham
const htmlImage = `
<a href="${product.image}">
<img src="${product.image}" alt="${product.product_name}">
</a>
`;
// xay html hien thi thong tin san pham
var HtmlButtonBid = '';
if (product.from_time > Date.now()) {
HtmlButtonBid = `
<div class="qt-view">Số người đang xem: <b>${product.user_online} người</b></div>
<a href="javascript:void(0)" class="btn-add-auction coming">
<img src="./assets/images/icon_time.png" alt="">
<div class="d-flex align-items">
<span>Diễn ra vào lúc:</span>
<div class="js-deal-time-${product.productId} d-flex align-items" data-time="${product.from_time}">
</div>
</div>
</a>
`;
}
else if (product.to_time > Date.now()) {
HtmlButtonBid = `
<div class="current-highest-price d-flex align-items">
<div class="name-price">Giá cao nhất hiện tại:</div>
<b>${formatPrice(highestBid.highestBid)}<u>đ</u></b>
</div>
<div class="qt-view">Số người đang tham gia: <b>${product.user_online} người</b></div>
<div class="box-time d-flex align-items">
<span>Thời gian còn lại:</span>
<div class="product-time-holder js-deal-time-${product.productId} d-flex align-items" data-time="${product.to_time}">
</div>
</div>
<div class="box-input-price d-flex align-items">
<span>Nhập giá đấu của bạn</span>
<input type="text" class="input-price" value="${formatPrice(highestBid.highestBid)}">
<a href="javascript:;" class="minus-price"><i class="fa fa-minus"></i></a>
<a href="javascript:;" class="plus-price"><i class="fa fa-plus"></i></a>
</div>
<a href="javascript:void(0)" class="btn-add-auction">
Đấu giá ngay
</a>
`;
}
else {
HtmlButtonBid = `
<div class="price-win d-flex align-items">
<div class="name-price">Giá thắng cuộc:</div>
<b>${formatPrice(highestBid.highestBid)}<u>đ</u></b>
</div>
<div class="user-win d-flex align-items">
<div class="name">
<img src="./assets/images/icon_paint.png" width="14px" height="20px" alt=""> Người chiến thắng:</div>
<span>${highestBid.highestBidName}</span>
</div>
<a href="javascript:void(0)" class="btn-add-auction ending">
Phiên đấu giá đã kết thúc
</a>
`;
}
const htmlInfo = `
<h1 class="name">${product.product_name}</h1>
<div class="d-flex align-items space-between box-price-normal">
@@ -52,44 +108,35 @@ function XayhtmlProductDeail(product) {
<b>${formatPrice(product.price_step)}<u>đ</u></b>
</div>
</div>
<div class="current-highest-price d-flex align-items">
<div class="name-price">Giá cao nhất hiện tại:</div>
<b>${formatPrice(highestBid)}<u>đ</u></b>
</div>
<div class="qt-view">Số người đang tham gia: <b>${product.user_online} người</b></div>
<div class="box-time d-flex align-items">
<span>Thời gian còn lại:</span>
<div class="product-time-holder js-deal-time-${product.productId} d-flex align-items" data-time="${product.to_time}">
</div>
</div>
<div class="box-input-price d-flex align-items">
<span>Nhập giá đấu của bạn</span>
<input type="text" class="input-price" value="${formatPrice(highestBid)}">
<a href="javascript:;" class="minus-price"><i class="fa fa-minus"></i></a>
<a href="javascript:;" class="plus-price"><i class="fa fa-plus"></i></a>
</div>
${HtmlButtonBid}
`;
let html_dien_bien_dau_gia = '';
product.list_user.forEach((user) => {
html_dien_bien_dau_gia += `
<tr>
<td>
${highestBid == user.price ? `
<div class="d-flex align-items">
<img src="./assets/images/icon_paint.png" width="14px" height="20px" alt="">
<span>${user.userName}</span>
</div>
` : `<span>${user.userName}</span>`}
</td>
<td>
${formatPrice(user.price)}<u>đ</u>
</td>
<td>
${formatTime(user.time)}
</td>
</tr>
`;
});
if (product.from_time < Date.now()) {
const boxParticipant = document.getElementById('box-participant-list');
if (boxParticipant) {
boxParticipant.classList.remove('d-none');
}
product.list_user.forEach((user) => {
html_dien_bien_dau_gia += `
<tr>
<td>
${highestBid.highestBid == user.price ? `
<div class="d-flex align-items">
<img src="./assets/images/icon_paint.png" width="14px" height="20px" alt="">
<span>${user.userName}</span>
</div>
` : `<span>${user.userName}</span>`}
</td>
<td>
${formatPrice(user.price)}<u>đ</u>
</td>
<td>
${formatTime(user.time)}
</td>
</tr>
`;
});
}
const htmlSpec = `
${product.specifications}
`;
@@ -109,19 +156,24 @@ function show_product_detail(lay_thongtin_sp) {
holderInfo.innerHTML = htmlInfo;
holderAuctionDetails.innerHTML = html_dien_bien_dau_gia;
holderSpec.innerHTML = htmlSpec;
if (product.to_time > Date.now()) {
if (product.from_time > Date.now()) {
countDown(`js-deal-time-${product.productId}`, product.from_time);
}
else if (product.to_time > Date.now()) {
countDown(`js-deal-time-${product.productId}`, product.to_time);
}
});
}
function getHighestBid(list_user) {
let highestBid = 0;
let highestBidName = '';
list_user.forEach(user => {
if (user.price > highestBid) {
highestBid = user.price;
highestBidName = user.userName;
}
});
return highestBid;
return { highestBid, highestBidName };
}
function getList() {
}