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

up

Browse Source
This commit is contained in:
Tieptk
2024-10-18 09:55:04 +07:00
parent 7ee138d8f3
commit cc6e2d7419
12 changed files with 594 additions and 203 deletions
Download Patch File Download Diff File Expand all files Collapse all files

272
detail.html
View File

@@ -12,6 +12,28 @@
</head>
<body>
<div class="header">
<div class="container">
<div class="header-main d-flex align-items space-between">
<div class="header-left">
<a href="/home.html" class="logo">
<img src="./assets/images/logo.png" alt="logo">
</a>
</div>
<div class="header-right d-flex align-items">
<a href="" class="item">
<img src="./assets/images/icon-clipboard.png" alt="">
<span>Thể lệ đấu giá</span>
</a>
<a href="./account.html" class="item">
<img src="./assets/images/icon-user.png" alt="">
<span>Tài khoản</span>
<i class="fa-solid fa-caret-down"></i>
</a>
</div>
</div>
</div>
</div>
<div class="page-detail">
<div class="container">
<div class="breadcrumb">
@@ -148,7 +170,7 @@
<div class="box-live-auction">
<div class="box-price-live d-flex">
<i class="fas fa-caret-up"></i>
<div class="current-price">125.000.000</div>
<div class="current-price" id="js-price-present">125.000.000</div>
<div class="unit-price">VNĐ</div>
</div>
<div class="list-user-auction">
@@ -249,7 +271,7 @@
<div class="form-input">
<input type="text" value="126.000.000" id="js-input-price" placeholder="Nhập giá"
class="input-price">
<button class="btn-send" onclick="checkSendAuction(true)">
<button class="btn-send" onclick="checkSendAuction()">
<i class="fas fa-paper-plane"></i>
</button>
</div>
@@ -882,153 +904,127 @@
<i class="fa fa-times"></i>
</a>
<div class="content">
Giá đấu của bạn chưa hợp lệ. Vui lòng nhập giá cao hơn giá cao nhất ít nhất X VND
Giá đấu của bạn chưa hợp lệ. Vui lòng nhập giá cao hơn giá cao nhất ít nhất <span id="js-price-min"></span>
VND
</div>
<a class="btn-submit" href="javascript:void(0)" onclick="closePopop()">Thử lại</a>
</div>
<div class="footer">
<div class="box-faq">
<div class="container">
<div class="background-faq">
<h2 class="title">Câu hỏi thường gặp</h2>
<div class="content-faq">
<div class="item">
<a href="javascript:void(0)" class="faqlink">
<span>Đấu giá trực tuyến có phức tạp không?</span>
<i class="fas fa-chevron-right"></i>
</a>
<div class="content">Rất dễ dàng, tham gia mọi lúc mọi nơi chỉ cần có smartphone và internet
</div>
</div>
<div class="item">
<a href="javascript:void(0)" class="faqlink">
<span>Làm thế nào để xác thực tài khoản đấu giá thành công?</span>
<i class="fas fa-chevron-right"></i>
</a>
<div class="content">Rất dễ dàng, tham gia mọi lúc mọi nơi chỉ cần có smartphone và internet
</div>
</div>
<div class="item">
<a href="javascript:void(0)" class="faqlink">
<span>Tại sao nên chọn đấu giá trực tuyến tại Anphatpc?</span>
<i class="fas fa-chevron-right"></i>
</a>
<div class="content">Rất dễ dàng, tham gia mọi lúc mọi nơi chỉ cần có smartphone và internet
</div>
</div>
<div class="item">
<a href="javascript:void(0)" class="faqlink">
<span>Quy trình đấu giá sản phẩm của Anphatpc như thế nào?</span>
<i class="fas fa-chevron-right"></i>
</a>
<div class="content">Rất dễ dàng, tham gia mọi lúc mọi nơi chỉ cần có smartphone và internet
</div>
</div>
<div class="item">
<a href="javascript:void(0)" class="faqlink">
<span>Điều kiện để chiến thắng đấu giá là gì?</span>
<i class="fas fa-chevron-right"></i>
</a>
<div class="content">Rất dễ dàng, tham gia mọi lúc mọi nơi chỉ cần có smartphone và internet
</div>
</div>
</div>
<div class="clearfix"></div>
</div>
</div>
</div>
<div class="main-footer">
<div class="container">
<div class="footer-policies d-flex align-items space-between">
<div class="item-policies">
<div class="icons">
<img src="./assets/images/icon-ship.png" width="100%" height="100%" alt="ship">
</div>
<div class="txt">
<b>Chính sách giao hàng</b>
<p>Nhận hàng & thanh toán tại nhà</p>
</div>
</div>
<div class="item-policies">
<div class="icons">
<img src="./assets/images/icon-return.png" width="100%" height="100%" alt="ship">
</div>
<div class="txt">
<b>Đổi mới 15 ngày đầu</b>
<p>Áp dụng với sản phẩm laptop</p>
</div>
</div>
<div class="item-policies">
<div class="icons">
<img src="./assets/images/icon-pay.png" width="100%" height="100%" alt="ship">
</div>
<div class="txt">
<b>Thanh toán tiện lợi</b>
<p>Trả tiền mặt, CK, trả góp 0%</p>
</div>
</div>
<div class="item-policies">
<div class="icons">
<img src="./assets/images/icon-chat.png" width="100%" height="100%" alt="ship">
</div>
<div class="txt">
<b>Hỗ trợ nhiệt tình</b>
<p>Tư vấn, giải pháp mọi thắc mắc</p>
</div>
</div>
</div>
<div class="contact-footer">
<div class="info-contact text-center">
<b>Công ty cổ phần thương mại máy tính an phát</b>
<p>Giấy chứng nhận ĐKDN số 0108940873 do Sở kế hoạch và Đầu tư Thành phố Hà Nội cấp ngày
11/10/2019</p>
<p>Trụ sở: Tầng 5, Số 49 phố Thái Hà, Phương Trung Liệt, Quận Đống Đa, Thành phố Hà nội, Việt
Nam</p>
<p>Điện thoại: 19000323 Email: Giang@anphat.com.vn</p>
</div>
<a href="tel:19000323" class="btn-phone">
<img src="./assets/images/btn-phone.png" alt="">
</a>
</div>
</div>
</div>
</div>
</body>
<script src="https://cdn.jsdelivr.net/npm/swiper@11/swiper-bundle.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
<script>
var swiper_thumb = new Swiper(".thumbImage", {
spaceBetween: 10,
slidesPerView: 4,
direction: "vertical",
loop: true,
on: {
init: (swiper) => {
let totalGap = swiper.passedParams.spaceBetween * (swiper.passedParams.slidesPerView - 1);
let containerHeight = swiper.passedParams.slidesPerView * swiper.slides[0].clientHeight + totalGap;
swiper.el.style.height = containerHeight + 'px';
},
},
});
var swiper_big = new Swiper(".BigImage", {
spaceBetween: 10,
watchSlidesProgress: true,
noSwiping: true,
navigation: {
nextEl: "#js-image-next",
prevEl: "#js-image-prev",
},
thumbs: {
swiper: swiper_thumb,
},
});
</script>
<script src="./assets//js/main.js"></script>
<script>
const showButton = document.getElementById('click-show');
const priceList = document.getElementById('price-list');
let currentIndex = 4; // Ban đầu hiển thị 4 item
showButton.addEventListener('click', () => {
const itemWidth = document.querySelector('.item').offsetWidth;
priceList.scrollBy({ left: itemWidth, behavior: 'smooth' });
currentIndex++;
// Nếu đã scroll qua hết các item thì ẩn nút
if (currentIndex >= document.querySelectorAll('.item').length) {
showButton.style.display = 'none';
}
});
function formatCurrency(a) {
var b = parseFloat(a).toFixed(2).replace(/(\d)(?=(\d{3})+\.)/g, "$1.").toString();
var len = b.length;
b = b.substring(0, len - 3);
return b;
}
$('#price-list .item').on('click', function () {
var price = $(this).attr('data-price');
$('#js-input-price').val(formatCurrency(price));
})
</script>
<script>
productDetailTab()
function productDetailTab() {
$(".tab .item-tab").click(function () {
var datatab = $(this).attr("data-id");
$(".tab .item-tab").removeClass("active");
$('.content-tab').removeClass("active");
$(this).addClass("active");
$(datatab).addClass("active");
});
}
TabHistory();
function TabHistory() {
$(".tab-history .item-tab").click(function () {
var datatab = $(this).attr("data-id");
$(".tab-history .item-tab").removeClass("active");
$('.table-tab').removeClass("active");
$(this).addClass("active");
$(datatab).addClass("active");
});
}
</script>
<script>
checkRules();
function checkRules() {
$('#submit_rules').on('click', function () {
if ($('#check_rules').is(':checked')) {
$('.box-popup').removeClass('active');
$('.popup-login').addClass('active')
} else {
alert('Quý khách cần đồng ý với thể lệ của chương trình')
}
})
}
function closePopop() {
$('.box-popup').removeClass('active');
$('.overlay').removeClass('active')
}
function checkAucton() {
$('.overlay').addClass('active')
$('.popup-rules').addClass('active')
}
function checklogin() {
$('.box-popup').removeClass('active');
$('.popup-yeucau').addClass('active')
}
function showInfoPay() {
$('.box-popup').removeClass('active');
$('.popup-info-pay').addClass('active')
}
function checkSendAuction(check) {
$('.box-popup').removeClass('active');
if (check == true) {
$('.overlay').addClass('active')
$('.popup-success').addClass('active')
} else {
$('.overlay').addClass('active')
$('.popup-error').addClass('active')
}
}
</script>
</html>