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

32/12/2023

Browse Source
This commit is contained in:
Tieptk
2023-12-23 10:55:02 +07:00
commit dac87c3a2b
17 changed files with 3036 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

133
dist/main.js vendored Normal file
View File

@@ -0,0 +1,133 @@
"use strict";
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
return new (P || (P = Promise))(function (resolve, reject) {
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
step((generator = generator.apply(thisArg, _arguments || [])).next());
});
};
function goi_sp_tu_api() {
return __awaiter(this, void 0, void 0, function* () {
return new Promise((resolve, reject) => {
return resolve(listproduct_mau);
});
});
}
function hienthi_sp() {
return __awaiter(this, void 0, void 0, function* () {
const lay_sp_tu_api = yield goi_sp_tu_api();
// code hien thi danh sach dang dien ra
// Usage example:
showListProductHome(lay_sp_tu_api, 'started', 'js-holder-list-started');
showListProductHome(lay_sp_tu_api, 'coming', 'js-holder-list-coming');
showListProductHome(lay_sp_tu_api, 'ended', 'js-holder-list-ended');
});
}
function showListProductHome(lay_sp_tu_api, status, holderId) {
const html = [];
const holder = document.getElementById(holderId);
lay_sp_tu_api
.filter((product) => product.status == status)
.forEach(function (product, keyIndex) {
html.push(xayhtml(product));
if (status != 'ended' || product.to_time > product.from_time) {
const countdownTime = (status == 'started') ? product.to_time : product.from_time;
countDown(`js-deal-time-${product.productId}`, countdownTime);
}
});
if (holder) {
holder.innerHTML = html.join('');
}
}
function xayhtml(product) {
var Htmlcheckstatus = '';
if (product.status == 'started') {
Htmlcheckstatus = `<div class="deal-time-holder d-flex align-items space-center">
<div class="txt">Còn lại:</div>
<div class="product-time-holder js-deal-time-${product.productId}" data-time="${product.to_time}">
</div>
</div>
<a href="/auction_program/product-detail.html?id=${product.productId}" class="btn-auction">Đấu giá ngay</a>`;
}
else if (product.status == 'coming') {
Htmlcheckstatus = `<div class="deal-time-holder d-flex align-items space-center">
<div class="txt">Bắt đầu sau:</div>
<div class="product-time-holder js-deal-time-${product.productId}" data-time="${product.from_time}">
</div>
</div>
<a href="/auction_program/product-detail.html?id=${product.productId}" class="btn-auction">Xem chi tiết</a>`;
}
else if (product.to_time < Date.now()) {
Htmlcheckstatus = `<div class="starting-price">Thắng cuộc ${formatPrice(product.starting_price)}<u>đ</u></div>
<div class="deal-time-holder d-flex align-items space-center end">
<div class="txt">Đã kết thúc</div>
</div>
<a href="/auction_program/product-detail.html?id=${product.productId}" class="btn-auction">Xem chi tiết</a>`;
}
return `<div class="product-item">
<a href="/product-detail.html?id=${product.productId}" class="product-image">
<img src="${product.image}" alt="${product.product_name}">
</a>
<div class="info-product">
<a href="" class="product-name line-clamp-2">${product.product_name}</a>
<div class="product-cost">
Giá gốc: ${formatPrice(product.price)}đ
</div>
${Htmlcheckstatus}
</div>
</div>
`;
}
function formatPrice(price) {
var b = price.toFixed(2).replace(/(\d)(?=(\d{3})+\.)/g, "$1.").toString();
var len = b.length;
b = b.substring(0, len - 3);
return b;
}
function countDown(iid, endTime) {
const updateCountdown = () => {
const now = Date.now();
const distance = endTime - now;
if (distance > 0) {
const [days, hours, minutes, seconds] = getTimeComponents(distance);
displayCountdown(iid, days, hours, minutes, seconds);
}
else {
clearInterval(timer);
}
};
// Initial update to avoid delay
updateCountdown();
const timer = setInterval(updateCountdown, 1000);
}
function getTimeComponents(distance) {
const days = Math.floor(distance / (1000 * 60 * 60 * 24));
const hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
const minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
const seconds = Math.floor((distance % (1000 * 60)) / 1000);
return [days, hours, minutes, seconds];
}
function displayCountdown(iid, days, hours, minutes, seconds) {
const element = document.querySelector(`.${iid}`);
if (element) {
if (days > 0) {
element.innerHTML = `
<div class='item-time'><b>${formatTimeComponent(days)}</b></div>
<div class='item-time'><b>${formatTimeComponent(hours)}</b></div>
<div class='item-time'><b>${formatTimeComponent(minutes)}</b></div>
<div class='item-time'><b>${formatTimeComponent(seconds)}</b></div>`;
}
else {
element.innerHTML = `
<div class='item-time'><b>${formatTimeComponent(hours)}</b></div>
<div class='item-time'><b>${formatTimeComponent(minutes)}</b></div>
<div class='item-time'><b>${formatTimeComponent(seconds)}</b></div>`;
}
}
}
function formatTimeComponent(component) {
return component <= 9 ? '0' + component : component.toString();
}
hienthi_sp();