up

assets/css/style-mb.css

@@ -1078,9 +1078,10 @@ table {
 }
 .page-detail .list-user-auction {
   background: #fff5e5;
-  padding: 15px;
+  padding: 10px;
   border-radius: 15px;
   overflow: hidden;
+  height: 330px;
 }
 .page-detail .list-user-auction .item {
   background: #fff;
@@ -1111,6 +1112,12 @@ table {
 .page-detail .list-user-auction .item .name-user {
   color: #1355f0;
   padding-right: 5px;
+  width: 80px;
+  white-space: normal;
+  display: -webkit-box;
+  -webkit-line-clamp: 1;
+  -webkit-box-orient: vertical;
+  overflow: hidden;
 }
 .page-detail .list-user-auction .item .price {
   color: #f00000;
@@ -1123,11 +1130,15 @@ table {
 .page-detail .list-user-auction .content-user {
   overflow-x: hidden;
   overflow-y: scroll;
-  max-height: 103px;
+  max-height: 300px;
   padding-right: 10px;
 }
 .page-detail .form-input-price {
   margin-top: 20px;
+  position: absolute;
+  left: 9px;
+  bottom: 23%;
+  width: 96%;
 }
 .page-detail .form-input-price .p-title {
   text-align: center;

assets/css/style-mb.scss

@@ -1095,9 +1095,10 @@ table {
     }
     .list-user-auction {
         background: #fff5e5;
-        padding: 15px;
+        padding: 10px;
         border-radius: 15px;
         overflow: hidden;
+        height: 330px;
         .item {
             background: #fff;
             box-shadow: 0px 2px 2px 0px #00000026;
@@ -1126,6 +1127,12 @@ table {
             .name-user {
                 color: #1355f0;
                 padding-right: 5px;
+                width: 80px;
+                white-space: normal;
+                display: -webkit-box;
+                -webkit-line-clamp: 1;
+                -webkit-box-orient: vertical;
+                overflow: hidden;
             }
             .price {
                 color: #f00000;
@@ -1139,12 +1146,16 @@ table {
         .content-user {
             overflow-x: hidden;
             overflow-y: scroll;
-            max-height: 103px;
+            max-height: 300px;
             padding-right: 10px;
         }
     }
     .form-input-price {
         margin-top: 20px;
+        position: absolute;
+        left: 9px;
+        bottom: 23%;
+        width: 96%;
         .p-title {
             text-align: center;
             font-size: 20px;

assets/css/style.css

@@ -2190,6 +2190,7 @@ table {
 }
 .popup-error .content {
   color: #1e1e1e;
+  text-align: center;
 }
 
 .popup-input-opt .title {

assets/css/style.scss

@@ -2227,6 +2227,7 @@ table {
     }
     .content {
         color: #1e1e1e;
+        text-align: center;
     }
 }
 

assets/js/main.js

@@ -0,0 +1,196 @@
+$(document).ready(function () {
+    $('.faqlink').click(function () {
+        $(this).parents('.item').toggleClass('active');
+    });
+});
+
+
+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,
+    },
+});
+
+
+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));
+})
+
+
+
+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");
+    });
+}
+
+
+
+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')
+}
+
+formatPrice();
+function formatPrice() {
+    $('#js-input-price').on('input', function () {
+        let inputValue = $(this).val().replace(/\D/g, '');
+        let formattedValue = new Intl.NumberFormat().format(inputValue);
+
+        $(this).val(formattedValue);
+    });
+}
+
+
+function checkSendAuction() {
+    $('.box-popup').removeClass('active');
+
+    const price_present = _strToNumber($('#js-price-present').html());
+    const price_auction = _strToNumber($('#js-input-price').val());
+
+    const price_min = price_present + 300000;
+
+    if (price_auction > price_present) {
+        $('.overlay').addClass('active')
+        $('.popup-success').addClass('active')
+    } else {
+        $('.overlay').addClass('active')
+        $('.popup-error').addClass('active')
+        $('#js-price-min').html(formatCurrency(price_min))
+    }
+}
+
+
+function _strToNumber(str) {
+    str += '';
+    while (str.indexOf(".") > 0) {
+        str = str.replace('.', '');
+    }
+    var result = parseFloat(str);
+    return isNaN(result) ? 0 : result;
+}
+
+
+
+function checkOTP() {
+    $('.box-popup').removeClass('active');
+    $('.overlay').addClass('active')
+    $('.popup-thongbao').addClass('active')
+}
+
+function SendcheckOTP() {
+    $('.box-popup').removeClass('active');
+    $('.overlay').addClass('active')
+    $('.popup-input-opt').addClass('active')
+}
+
+
+function closePopop() {
+    $('.box-popup').removeClass('active');
+    $('.overlay').removeClass('active')
+}
+
+
+
+Tab();
+function Tab() {
+    $(".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");
+    });
+}

assets/js/server.js

@@ -0,0 +1,21 @@
+// server.js
+const express = require('express');
+const bodyParser = require('body-parser');
+const cors = require('cors');
+const app = express();
+const port = 5500;
+
+app.use(cors()); // Cho phép CORS
+app.use(bodyParser.json()); // Middleware để phân tích JSON
+
+// Endpoint để nhận yêu cầu POST
+app.post('/submit-bid', (req, res) => {
+    console.log(req.body); // In ra thông tin đã gửi
+    // Xử lý thông tin ở đây (lưu vào DB hoặc làm gì đó)
+    res.status(200).json({ message: 'Bid received', data: req.body });
+});
+
+// Khởi động server
+app.listen(port, () => {
+    console.log(`Server is running at 192.168.1.71:${port}`);
+});