92 lines
4.3 KiB
JavaScript
92 lines
4.3 KiB
JavaScript
"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="starting-price">
|
|
Giá Khởi điểm: ${formatPrice(product.starting_price)}đ
|
|
</div>
|
|
<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="starting-price">
|
|
Giá Khởi điểm: ${formatPrice(product.starting_price)}đ
|
|
</div>
|
|
<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>
|
|
`;
|
|
}
|
|
hienthi_sp();
|