Files
appliance_auction/detail.html

1250 lines
85 KiB
HTML
Raw Normal View History

2024-11-12 13:32:53 +07:00
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Đấu giá</title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.6.0/css/all.min.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/swiper@11/swiper-bundle.min.css" />
<script src="https://cdn.tailwindcss.com"></script>
<link rel="stylesheet" href="./assets/css/style-global.css">
</head>
<body>
<div class="header bg-[var(--bg-header)] p-[6px_0] shadow-[0_1px_6px_#00000040]">
<div class="container">
<div class="header-main flex items-center justify-between">
<div class="header-left">
<a href="/" class="logo">
<img src="./assets/images/logo.png" class="h-[35px]" alt="logo">
</a>
</div>
<div class="header-right flex items-center">
<a href="" class="item flex items-center">
<img src="./assets/images/icon-clipboard.png" class="w-[15px]" alt="">
<span class="text-black p-[0_5px] hover:text-[var(--main-color)]">Thể lệ đấu giá</span>
</a>
<a href="./account.html" class="item flex items-center ml-[20px]">
<img src="./assets/images/icon-user.png" class="w-[15px]" alt="">
<span class="text-black p-[0_5px] hover:text-[var(--main-color)]">Tài khoản</span>
<i class="fa-solid fa-caret-down text-black"></i>
</a>
</div>
</div>
</div>
</div>
<div class="page-detail">
<div class="container">
<div class="breadcrumb w-full float-left p-0 m-0 bg-none">
<ol itemscope="" itemtype="http://schema.org/BreadcrumbList" class="ul float-left list-none clearfix">
<li itemprop="itemListElement" itemscope="" itemtype="http://schema.org/ListItem"
class="float-left list-none">
<a href="/" itemprop="item" class="nopad-l text-[14px]">
<span itemprop="name" class="float-left flex items-center leading-[40px]"><span>Trang
chủ</span></span>
</a> <i class="leading-[40px] m-[0_10px]">/</i>
<meta itemprop="position" content="1">
</li>
<li itemprop="itemListElement" itemscope="" itemtype="http://schema.org/ListItem"
class="float-left list-none">
<a href="/" itemprop="item">
<span itemprop="name" class="float-left flex items-center leading-[40px]">
Đấu giá
</span>
</a>
<meta itemprop="position" content="2">
</li>
</ol>
</div>
<div class="clearfix"></div>
<div class="content-main-detail flex mt-[20px]">
<div class="content-left w-[calc(100%_-490px_-32px)] mr-[32px]">
<div class="box-group-images flex">
<div class="box-thumbImage w-[85px] h-[560px] relative p-[30px_0]">
<div class="swiper-button swiper-button-next" id="js-image-next"></div>
<div thumbsSlider="" class="swiper thumbImage h-[400px]">
<div class="swiper-wrapper">
<div class="swiper-slide">
<img src="./assets/images/image-thumb-1.png" alt="">
</div>
<div class="swiper-slide">
<img src="./assets/images/image-thumb-2.png" alt="">
</div>
<div class="swiper-slide">
<img src="./assets/images/image-thumb-3.png" alt="">
</div>
<div class="swiper-slide">
<img src="./assets/images/image-thumb-4.png" alt="">
</div>
<div class="swiper-slide">
<img src="./assets/images/image-thumb-5.png" alt="">
</div>
</div>
</div>
<div class="swiper-button swiper-button-prev" id="js-image-prev"></div>
</div>
<div class="swiper BigImage w-[calc(100%_-_85px_-_32px)]
ml-[32px]">
<div class="swiper-wrapper">
<div class="swiper-slide">
<img src="./assets/images/product-detail-big.png" alt="">
</div>
<div class="swiper-slide">
<img src="./assets/images/product-detail-big.png" alt="">
</div>
<div class="swiper-slide">
<img src="./assets/images/product-detail-big.png" alt="">
</div>
<div class="swiper-slide">
<img src="./assets/images/product-detail-big.png" alt="">
</div>
<div class="swiper-slide">
<img src="./assets/images/product-detail-big.png" alt="">
</div>
</div>
</div>
</div>
</div>
<div class="content-right w-[490px]">
<h2 class="product-name text-[20px] font-[400] mb-[15px]">
Laptop Acer Aspire 7 A715-76-53PJ NH.QGESV.007 (Intel Core i5-12450H | Đen)
</h2>
<div
class="box-group-time flex items-center justify-between bg-[var(--bg-time-auction)] w-full p-[10px] rounded-[5px]">
<div class="left flex items-center ">
<img src="./assets/images/icon-auction-2.png" alt="" class="w-[26px] block mr-[5px]">
<p class="title text-[20px] uppercase font-[700] text-white ml-[5px]">Ngày hội đấu giá</p>
</div>
<div class="right flex items-center">
<div
class="total-auction w-[62px] h-[27px] leading-[27px] text-center text-white rounded-[14px] flex items-center justify-center background-yellow">
<i class="icon auction"></i>
<span>200</span>
</div>
<div class="p-box-time flex items-center justify-center bg-[var(--bg-timeout-detail)] w-[115px] h-[28px] leading-[28px]
rounded-[14px] ml-[10px]">
<i class="icon time"></i>
<div class="box-time">
<div class="item-time"><b>02</b></div>
<div class="item-time"><b>16</b></div>
<div class="item-time"><b>42</b></div>
</div>
</div>
</div>
</div>
<div
class="group-price-detail flex items-center mt-[10px] p-[10px_0] border-t-[1px] border-b-[1px] border-dashed border-[#e2e2e2]">
<div class="box-starting-price w-[50%] border-r-[1px] border-dashed border-[#e2e2e2]">
<p class="text-[13px] leading-[18px] uppercase">Giá khởi điểm</p>
<div class="starting-price text-[20px] font-[600]">110.490.000 <u>đ</u></div>
</div>
<div class="box-price-step pl-[20px]">
<p class="text-[13px] leading-[18px] uppercase">Bước giá</p>
<div class="price-step text-[20px] font-[600]">300.000 <u>đ</u></div>
</div>
</div>
<div class="box-user-win border-t-[1px] border-dashed border-[#e2e2e2] mt-[15px] pt-[10px]">
<div class="price-win flex items-end">
<p class="font-[700] mr-[5px] uppercase mb-[7px]">Giá thắng cuộc:</p>
<div class="price text-[28px] text-[#ef0000] font-[700]">125.000.000 <u>đ</u></div>
</div>
<div
class="info-user-win flex items-center bg-[var(--bg-user-win)] w-full h-[40px] leading-[40px] p-[0_20px] rounded-[5px]">
<i class="icon-cup"></i>
<p class="text-[#f00000] mr-[5px]">Người chiến thắng:</p>
<b class="js-user-win font-[500] text-[#f00000]">Mai Phương</b>
</div>
</div>
<div class="box-specification m-[20px_0_27px_0]">
<div class="item flex mb-[15px]">
<i class="fas fa-check-circle text-[#166dd8] mr-[10px] mt-[4.3px]"></i>
<p class="text-[14px]">CPU: Intel Core i5-12450H (3.3GHz up to 4.4GHz 12MB)</p>
</div>
<div class="item flex mb-[15px">
<i class="fas fa-check-circle text-[#166dd8] mr-[10px] mt-[4.3px]"></i>
<p class="text-[14px]">VGA: NVIDIA® GeForce RTX™ 2050 4GB GDDR6 + Intel UHD Graphics</p>
</div>
<div class="item flex mb-[15px">
<i class="fas fa-check-circle text-[#166dd8] mr-[10px] mt-[4.3px]"></i>
<p class="text-[14px]">Màn hình: 15.6inch FHD (1920 x 1080) IPS, 144Hz, Slim Bezel, Acer
ComfyView™</p>
</div>
<div class="item flex mb-[15px">
<i class="fas fa-check-circle text-[#166dd8] mr-[10px] mt-[4.3px]"></i>
<p class="text-[14px]">RAM: 8GB (8x1) DDR4 3200MHz (2x SO-DIMM socket, up to 32GB SDRAM)</p>
</div>
</div>
<a href="javascript:void(0)"
class="btn-auction w-full text-center h-[42px] leading-[42px] rounded-[26px] text-white bg-[var(--bg-btn-auction)] uppercase text-[18px] font-[700] block hover:background-white hover:border-red hover:text-red"
onclick="checkAucton()">Tham gia đấu giá</a>
<div class="box-live-auction mt-[20px]">
<div class="box-price-live flex">
<i class="fas fa-caret-up text-[#2ad363] text-[32px] mt-[8px] mr-[5px]"></i>
<div class="current-price text-[28px] font-[700] text-[#ef0000]" id="js-price-present">
125.000.000</div>
<div class="unit-price mt-[12px] ml-[5px]">VNĐ</div>
</div>
<div
class="list-user-auction bg-[#fff5e5] p-[15px_30px_15px_15px] rounded-[15px] overflow-hidden">
<div class="content-user overflow-x-hidden overflow-y-scroll max-h-[103px] pr-[10px]">
<div
class="item flex items-center justify-between bg-white h-[28px] leading-[28px] rounded-[5px] mb-[8px] p-[10px_8px] shadow-[0px_2px_2px_0px_#00000026]">
<div class="info-left flex items-center">
<i class="fas fa-caret-up font-[16px] mt-[3px] mr-[5px] text-[#2ad363]"></i>
<div class="number text-[13px] font-[700] text-[#f48320] pr-[5px]">1</div>
<div class="info-user flex items-center">
<a href="" class="name-user text-[#1355f0] mr-[10px]">Phương</a>
<span>trả</span>
<div class="price text-[#f00000] font-[600] pl-[5px]">125.000.000 đ</div>
</div>
</div>
<p class="time font-[700]">00:30:11</p>
</div>
<div
class="item flex items-center justify-between bg-white h-[28px] leading-[28px] rounded-[5px] mb-[8px] p-[10px_8px] shadow-[0px_2px_2px_0px_#00000026]">
<div class="info-left flex items-center">
<i class="fas fa-caret-down font-[16px] mt-[3px] mr-[5px] text-[#f00000]"></i>
<div class="number text-[13px] font-[700] text-[#f48320] pr-[5px]">2</div>
<div class="info-user flex items-center">
<a href="" class="name-user text-[#1355f0] mr-[10px]">Phương</a>
<span>trả</span>
<div class="price text-[#f00000] font-[600] pl-[5px]">125.000.000 đ</div>
</div>
</div>
<p class="time font-[700]">00:30:11</p>
</div>
<div
class="item flex items-center justify-between bg-white h-[28px] leading-[28px] rounded-[5px] mb-[8px] p-[10px_8px] shadow-[0px_2px_2px_0px_#00000026]">
<div class="info-left flex items-center">
<i class="fas fa-caret-down font-[16px] mt-[3px] mr-[5px] text-[#f00000]"></i>
<div class="number text-[13px] font-[700] text-[#f48320] pr-[5px]">2</div>
<div class="info-user flex items-center">
<a href="" class="name-user text-[#1355f0] mr-[10px]">Phương</a>
<span>trả</span>
<div class="price text-[#f00000] font-[600] pl-[5px]">125.000.000 đ</div>
</div>
</div>
<p class="time font-[700]">00:30:11</p>
</div>
<div
class="item flex items-center justify-between bg-white h-[28px] leading-[28px] rounded-[5px] mb-[8px] p-[10px_8px] shadow-[0px_2px_2px_0px_#00000026]">
<div class="info-left flex items-center">
<i class="fas fa-caret-down font-[16px] mt-[3px] mr-[5px] text-[#f00000]"></i>
<div class="number text-[13px] font-[700] text-[#f48320] pr-[5px]">2</div>
<div class="info-user flex items-center">
<a href="" class="name-user text-[#1355f0] mr-[10px]">Phương</a>
<span>trả</span>
<div class="price text-[#f00000] font-[600] pl-[5px]">125.000.000 đ</div>
</div>
</div>
<p class="time font-[700]">00:30:11</p>
</div>
<div
class="item flex items-center justify-between bg-white h-[28px] leading-[28px] rounded-[5px] mb-[8px] p-[10px_8px] shadow-[0px_2px_2px_0px_#00000026]">
<div class="info-left flex items-center">
<i class="fas fa-caret-down font-[16px] mt-[3px] mr-[5px] text-[#f00000]"></i>
<div class="number text-[13px] font-[700] text-[#f48320] pr-[5px]">2</div>
<div class="info-user flex items-center">
<a href="" class="name-user text-[#1355f0] mr-[10px]">Phương</a>
<span>trả</span>
<div class="price text-[#f00000] font-[600] pl-[5px]">125.000.000 đ</div>
</div>
</div>
<p class="time font-[700]">00:30:11</p>
</div>
<div
class="item flex items-center justify-between bg-white h-[28px] leading-[28px] rounded-[5px] mb-[8px] p-[10px_8px] shadow-[0px_2px_2px_0px_#00000026]">
<div class="info-left flex items-center">
<i class="fas fa-caret-down font-[16px] mt-[3px] mr-[5px] text-[#f00000]"></i>
<div class="number text-[13px] font-[700] text-[#f48320] pr-[5px]">2</div>
<div class="info-user flex items-center">
<a href="" class="name-user text-[#1355f0] mr-[10px]">Phương</a>
<span>trả</span>
<div class="price text-[#f00000] font-[600] pl-[5px]">125.000.000 đ</div>
</div>
</div>
<p class="time font-[700]">00:30:11</p>
</div>
</div>
</div>
<div class="form-input-price mt-[20px]">
<div class="p-title text-center text-[20px] font-[400] uppercase mb-[10px]">Nhập giá đấu của
bạn</div>
<div class="list-suggest flex items-center ">
<p class="text-[14px] font-[300] whitespace-nowrap mb-[5px] mr-[15px]">Chọn nhanh gợi ý
</p>
<div class="list-price flex items-center w-[400px] overflow-x-auto scroll-smooth"
id="price-list">
<a href="javascript:void(0)" data-price="125300000"
class="item flex-[0_0_82px] text-center h-[32px] leading-[32px] mr-[5px] rounded-[15px] bg-[#f1f1f1] text-[#929292] font-[500] whitespace-nowrap block mb-[5px]">
125.3 tr
</a>
<a href="javascript:void(0)" data-price="125600000"
class="item flex-[0_0_82px] text-center h-[32px] leading-[32px] mr-[5px] rounded-[15px] bg-[#f1f1f1] text-[#929292] font-[500] whitespace-nowrap block mb-[5px]">
125.6 tr
</a>
<a href="javascript:void(0)" data-price="125900000"
class="item flex-[0_0_82px] text-center h-[32px] leading-[32px] mr-[5px] rounded-[15px] bg-[#f1f1f1] text-[#929292] font-[500] whitespace-nowrap block mb-[5px]">
125.9 tr
</a>
<a href="javascript:void(0)" data-price="126000000"
class="item flex-[0_0_82px] text-center h-[32px] leading-[32px] mr-[5px] rounded-[15px] bg-[#f1f1f1] text-[#929292] font-[500] whitespace-nowrap block mb-[5px]">
126 tr
</a>
<a href="javascript:void(0)" data-price="126000000"
class="item flex-[0_0_82px] text-center h-[32px] leading-[32px] mr-[5px] rounded-[15px] bg-[#f1f1f1] text-[#929292] font-[500] whitespace-nowrap block mb-[5px]">
126 tr
</a>
<a href="javascript:void(0)" data-price="126000000"
class="item flex-[0_0_82px] text-center h-[32px] leading-[32px] mr-[5px] rounded-[15px] bg-[#f1f1f1] text-[#929292] font-[500] whitespace-nowrap block mb-[5px]">
126 tr
</a>
<a href="javascript:void(0)" data-price="126000000"
class="item flex-[0_0_82px] text-center h-[32px] leading-[32px] mr-[5px] rounded-[15px] bg-[#f1f1f1] text-[#929292] font-[500] whitespace-nowrap block mb-[5px]">
126 tr
</a>
<a href="javascript:void(0)" data-price="126000000"
class="item flex-[0_0_82px] text-center h-[32px] leading-[32px] mr-[5px] rounded-[15px] bg-[#f1f1f1] text-[#929292] font-[500] whitespace-nowrap block mb-[5px]">
126 tr
</a>
<a href="javascript:void(0)" data-price="126000000"
class="item flex-[0_0_82px] text-center h-[32px] leading-[32px] mr-[5px] rounded-[15px] bg-[#f1f1f1] text-[#929292] font-[500] whitespace-nowrap block mb-[5px]">
126 tr
</a>
<a href="javascript:void(0)" data-price="126000000"
class="item flex-[0_0_82px] text-center h-[32px] leading-[32px] mr-[5px] rounded-[15px] bg-[#f1f1f1] text-[#929292] font-[500] whitespace-nowrap block mb-[5px]">
126 tr
</a>
<a href="javascript:void(0)" data-price="126000000"
class="item flex-[0_0_82px] text-center h-[32px] leading-[32px] mr-[5px] rounded-[15px] bg-[#f1f1f1] text-[#929292] font-[500] whitespace-nowrap block mb-[5px]">
126 tr
</a>
</div>
<a href="javascript:void(0)" id="click-show">
<i class="fas fa-chevron-right"></i>
</a>
</div>
<div class="form-input mt-[10px] flex">
<input type="text" value="126.000.000" id="js-input-price" placeholder="Nhập giá"
class="input-price w-[423px] h-[56px] border-[1px] border-[#afafaf] rounded-[28px_0_0_28px] text-center text-[32px] p-[0_20px]">
<button
class="btn-send w-[calc(100%_-423px)] h-[56px] flex items-center justify-center background-blue outline-none border-0 text-white text-[24px] rounded-[0_28px_28px_0]"
onclick="checkSendAuction()">
<i class="fas fa-paper-plane"></i>
</button>
</div>
</div>
</div>
</div>
</div>
<div class="content-revew-history flex mt-[22px]">
<div class="content-left w-[calc(100%_-490px_-18px)] mr-[18px]">
<div class="box-review shadow-[0_4px_4px_4px_#00000026] bg-white rounded-[15px] p-[20px_15px]">
<div class="main-title flex items-center justify-between">
<div class="title-left">
<div class="title flex items-center">
<h2 class="text-[16px] mr-[10px] font-[700]">Đánh giá sản phẩm</h2>
<span>(100 đánh giá)</span>
</div>
<div class="flex items-center">
<div class="rating">
<i class="icon-star star5"></i>
</div>
<div class="total block ml-[5px] text-[14px]">
<span>4.9</span>
<span>/</span>
<span>5</span>
</div>
</div>
</div>
<a href="javascript:void(0)"
class="btn-review w-[146px] h-[32px] leading-[32px] text-center background-blue text-white rounded-[26px] hover:background-white hover:text-blue hover:border-blue">Gửi
đánh giá</a>
</div>
<div class="list-review mt-[15px]">
<div class="item-review flex flex-wrap mb-[10px] relative">
<div class="avatar w-[40px] h-[40px] mr-[7px]">
<img src="./assets/images/avatar-user.png" width="100%" height="100%"
class="w-[100%] h-[100%] object-contain block" alt="avatar">
</div>
<div class="info-cnt w-[calc(100%_-47px)]">
<div class="name-user font-[700]">Anh quang</div>
<div class="total-view text-[14px]">
5.0 <i class="fa fa-star text-[#f1b510]"></i>
</div>
<p class="cnt text-[13px]">Tuần trc mới chơi trúng đấu giá máy tính này xong. Xịn
nha, mượt lắm,
giao hành nhanh, uy tín.</p>
<div class="time-reply flex items-center">
<span class="time text-[13px] text-[#afafaf] mr-[10px]">20-06-2024, 10:46
am</span>
<a href="javascript:void(0)" class="btn-reply text-[#166dd8]">Trả lời</a>
</div>
<div class="list-image flex items-center mt-[10px] mb-[20px]">
<a href="" class="item w-[65px] h-[65px] block mr-[10px]">
<img src="./assets/images/image-review-1.png" class="block w-full h-[100%]"
alt="">
</a>
<a href="" class="item w-[65px] h-[65px] block mr-[10px]">
<img src="./assets/images/image-review-2.png" class="block w-full h-[100%]"
alt="">
</a>
<a href="" class="item item w-[65px] h-[65px] block mr-[10px]">
<img src="./assets/images/image-review-3.png" class="block w-full h-[100%]"
alt="">
</a>
</div>
</div>
<div class="list-reppy w-[100%] ml-[45px]">
<div
class="item-reply flex relative mb-[10px] after:absolute after:w-[26px] after:h-[115%] after:rounded-[0_0_0_18px] after:content-[''] after:bg-transparent after:left-[-27px] after:bottom-[84%] after:border-t-0 after:border-r-0 after:border-[1px] after:border-[#e2e2e2]">
<div class="avatar w-[40px] h-[40px] mr-[7px]">
<img src="./assets/images/avatar-admin.png"
class="w-[100%] h-[100%] object-contain block" width="100%"
height="100%" alt="avatar">
</div>
<div class="info-cnt w-[calc(100%_-47px)]">
<div class="name-user font-[700]">Anphatcomputer</div>
<p class="cnt text-[13px]">Anphat xin cảm ơn anh Quang đã ủng hộ.
<br> <br>
Anh có thể truy cập website anphatpc.com.vn để cập nhật và nhận thêm
thông tin chương trình khuyến mãi hấp dẫn từ Anphat
ạ! <br>
Trân trọng cảm ơn anh!
</p>
<div class="time-reply flex items-center">
<span class="time text-[13px] text-[#afafaf] mr-[10px]">20-06-2024,
10:46 am</span>
<a href="javascript:void(0)" class="btn-reply text-[#166dd8]">Trả
lời</a>
</div>
</div>
</div>
<div
class="item-reply flex relative mb-[10px] after:absolute after:w-[26px] after:h-[115%] after:rounded-[0_0_0_18px] after:content-[''] after:bg-transparent after:left-[-27px] after:bottom-[84%] after:border-t-0 after:border-r-0 after:border-[1px] after:border-[#e2e2e2]">
<div class="avatar w-[40px] h-[40px] mr-[7px]">
<img src="./assets/images/avatar-admin.png"
class="w-[100%] h-[100%] object-contain block" width="100%"
height="100%" alt="avatar">
</div>
<div class="info-cnt w-[calc(100%_-47px)]">
<div class="name-user font-[700]">Anphatcomputer</div>
<p class="cnt text-[13px]">Anphat xin cảm ơn anh Quang đã ủng hộ.
<br> <br>
Anh có thể truy cập website anphatpc.com.vn để cập nhật và nhận thêm
thông tin chương trình khuyến mãi hấp dẫn từ Anphat
ạ! <br>
Trân trọng cảm ơn anh!
</p>
<div class="time-reply flex items-center">
<span class="time text-[13px] text-[#afafaf] mr-[10px]">20-06-2024,
10:46 am</span>
<a href="javascript:void(0)" class="btn-reply text-[#166dd8]">Trả
lời</a>
</div>
</div>
</div>
</div>
</div>
<div class="item-review flex flex-wrap mb-[10px] relative">
<div class="avatar w-[40px] h-[40px] mr-[7px]">
<img src="./assets/images/avatar-user.png"
class="w-[100%] h-[100%] object-contain block" width="100%" height="100%"
alt="avatar">
</div>
<div class="info-cnt w-[calc(100%_-47px)]">
<div class="name-user font-[700]">Anh quang</div>
<div class="total-view text-[14px]">
5.0 <i class="fa fa-star text-[#f1b510]"></i>
</div>
<p class="cnt text-[13px]">Tuần trc mới chơi trúng đấu giá máy tính này xong. Xịn
nha, mượt lắm,
giao hành nhanh, uy tín.</p>
<div class="time-reply flex items-center">
<span class="time text-[13px] text-[#afafaf] mr-[10px]">20-06-2024, 10:46
am</span>
<a href="javascript:void(0)" class="btn-reply text-[#166dd8]">Trả lời</a>
</div>
<div class="list-image flex items-center mt-[10px] mb-[20px]">
<a href="" class="item w-[65px] h-[65px] block mr-[10px]">
<img src="./assets/images/image-review-1.png" class="block w-full h-[100%]"
alt="">
</a>
<a href="" class="item w-[65px] h-[65px] block mr-[10px]">
<img src="./assets/images/image-review-2.png" class="block w-full h-[100%]"
alt="">
</a>
<a href="" class="item item w-[65px] h-[65px] block mr-[10px]">
<img src="./assets/images/image-review-3.png" class="block w-full h-[100%]"
alt="">
</a>
</div>
</div>
</div>
</div>
<a href="javascript:void(0)"
class="more-review flex items-center justify-center text-blue pt-[15px] mt-[15px] border-t-[1px] border-[#f5f5f5]">
<span>Xem tất cả đánh giá</span> <i class="fas fa-chevron-right ml-[5px] mt-[2px]"></i>
</a>
</div>
<div class="box-question mt-[25px] bg-[#f5f5f5] p-[15px] rounded-[15px]">
<h2 class="title text-[16px] mb-[10px] font-[700]">Hỏi đáp <span
class="text-[14px] font-[400]">(100 bình luận)</span></h2>
<div class="form-question flex">
<textarea name="" id=""
class="input-question shadow-[0_4px_4px_0px_#00000026] bg-white w-[calc(100%_-70px)] h-[94px] rounded-[10px] border-0 outline-none p-[10px_15px]"
placeholder="Xin mời để lại câu hỏi, Anphat sẽ trả lời lại trong 1h, các câu hỏi sau 22h - 8h sẽ được trả lời vào sáng hôm sau"
height=""></textarea>
<button type="submit"
class="btn-question w-[60px] ml-[10px] h-[32px] leading-[32px] background-blue text-white rounded-[26px]">
<i class="fas fa-paper-plane"></i>
<span>Gửi</span>
</button>
</div>
<div class="list-question mt-[15px]">
<div class="item-question flex flex-wrap mb-[15px]">
<div class="avatar w-[20px] h-[20px] mr-[10px] mt-[3px]">
<img src="./assets/images/avatar-user.png" class="w-full h-[100%] block"
width="100%" height="100%" alt="avatar">
</div>
<div class="info-cnt w-[calc(100%_-30px)]">
<div class="info-user flex items-center">
<div class="name-user font-[600] mr-[15px]">Anh Quang</div>
<span class="time text-[#afafaf] text-[13px]">20-06-2024, 10:46 am</span>
</div>
<div
class="cnt bg-white shadow-[0_4px_4px_0px_#00000026] p-[10px_15px] rounded-[10px] text-[13px] font-[300]">
<p>Sau khi thắng đấu gía thời gian bao lâu để thanh toán nhận hàng</p>
<a href="javascript:void(0)"
class="click-question mt-[10px] text-[#166dd8] flex items-center justify-end ">
<i class="fas fa-comments"></i> <span>Trả lời</span>
</a>
</div>
</div>
<div class="list-reply w-full mt-[15px] ml-[30px]">
<div class="reply-question flex mb-[15px]">
<div class="avatar w-[20px] h-[20px] mr-[10px] mt-[3px]">
<img src="./assets/images/avatar-user.png" class="w-full h-[100%] block"
width="100%" height="100%" alt="avatar">
</div>
<div class="info-cnt w-[calc(100%_-30px)]">
<div class="info-user flex items-center">
<div class="name-user font-[600] mr-[15px]">Anh Quang</div>
<span class="time text-[#afafaf] text-[13px]">20-06-2024, 10:46
am</span>
</div>
<div
class="cnt bg-white shadow-[0_4px_4px_0px_#00000026] p-[10px_15px] rounded-[10px] text-[13px] font-[300]">
<p>Sau khi thắng đấu gía thời gian bao lâu để thanh toán nhận hàng</p>
<a href="javascript:void(0)"
class="click-question mt-[10px] text-[#166dd8] flex items-center justify-end ">
<i class="fas fa-comments"></i> <span>Trả lời</span>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
<a href="javascript:void(0)"
class="more-question mt-[10px] flex items-center justify-center font-[400] text-[#166dd8]">
<span>Xem tất cả hỏi đáp</span> <i class="fas fa-chevron-right ml-[5px]"></i>
</a>
</div>
<div class="box-info-product mt-[20px]">
<div class="tab flex items-center">
<a href="javascrit:void(0)" data-id="#tab-info"
class="item-tab w-[222px] h-[50px] leading-[50px] text-center rounded-[15px_15px_0_0] bg-[#f5f5f5] text-black text-[16px] font-[600] mr-[5px] ">Thông
tin sản
phẩm</a>
<a href="javascrit:void(0)" data-id="#tab-deposit"
class="item-tab w-[222px] h-[50px] leading-[50px] text-center rounded-[15px_15px_0_0] bg-[#f5f5f5] text-black text-[16px] font-[600] mr-[5px] active">Thông
tin đặt cọc đấu
giá</a>
</div>
<div class="content-tab hidden" id="tab-info">
<div class="flex info mt-[15px]">
<img class="w-[290px] h-[290px] block mr-[10px] object-contain"
src="./assets/images/product-detail-big.png" width="100%" height="100%" alt="">
<ul class="w-[calc(100%_-300px)] inside">
<li class="list-disc ml-[20px]">Tên sản phẩm: Laptop Acer Aspire 7 A715-76-53PJ
NH.QGESV.007
</li>
<li class="list-disc ml-[20px]">Dòng Laptop: Laptop | Laptop Acer Aspire | Laptop Đồ
Họa |
Laptop văn phòng</li>
<b>Bộ vi xử lý</b>
<li class="list-disc ml-[20px]">Công nghệ CPU: Intel Core i5-12450H</li>
<li class="list-disc ml-[20px]">Số nhân: 8</li>
<li class="list-disc ml-[20px]">Số luồng: 12</li>
<li class="list-disc ml-[20px]">Tốc độ tối đa: 4.4GHz</li>
<li class="list-disc ml-[20px]">Bộ nhớ đệm: 12MB</li>
<b>Bộ nhớ trong (RAM)</b>
<li class="list-disc ml-[20px]">RAM: 16GB (2x8GB)</li>
<li class="list-disc ml-[20px]">Loại RAM: DDR4</li>
<li class="list-disc ml-[20px]">Tốc độ Bus RAM: 3200Mhz</li>
<li class="list-disc ml-[20px]">Số khe cắm: 2 khe</li>
<li class="list-disc ml-[20px]">Hỗ trợ RAM tối đa: Nâng cấp tối đa 32GB</li>
<b>Ổ cứng</b>
<li class="list-disc ml-[20px]">Dung lượng: 512GB PCIe NVMe SSD</li>
<li class="list-disc ml-[20px]">Tốc độ vòng quay</li>
<li class="list-disc ml-[20px]">Khe cắm SSD mở rộng: nâng cấp tối đa 1 TB SSD PCIe
Gen4, 16
Gb/s, NVMe</li>
</ul>
</div>
</div>
<div class="content-tab hidden active" id="tab-deposit">
<div class="box-deposit mt-[15px]">
<i class="title text-[15px] font-[400] block mb-[10px]">Quý khách vui lòng làm theo các
bước sau đây.</i>
<div class="content-deposit ml-[10px] pl-[20px] border-l-[2px] border-[#f1b510]">
<div class="item mb-[20px]">
<div
class="step relative w-[102px] h-[40px] leading-[40px] text-center text-white rounded-[21px] text-[16px] font-[700] bg-[#166dd8] mb-[10px]">
Bước 1
<div
class="circle w-[24px] h-[24px] flex items-center justify-center bg-[#1e7ef7] border-[2px] border-[#f7c12a] rounded-[50%] absolute left-[-33px] top-[20%]">
<div
class="circle-inner w-[10px] h-[10px] bg-white rounded-[50%] border-[2px] border-[#f7c12a]">
</div>
</div>
</div>
<b class="txt flex font-[500]">
Đặt cọc <div class="price font-[700] text-[#f00000] p-[0_5px]">500.000 VNĐ
</div>
STK bên dưới
</b>
</div>
<div class="item">
<div
class="step relative w-[102px] h-[40px] leading-[40px] text-center text-white rounded-[21px] text-[16px] font-[700] bg-[#166dd8] mb-[10px]">
Bước 2
<div
class="circle w-[24px] h-[24px] flex items-center justify-center bg-[#1e7ef7] border-[2px] border-[#f7c12a] rounded-[50%] absolute left-[-33px] top-[20%]">
<div
class="circle-inner w-[10px] h-[10px] bg-white rounded-[50%] border-[2px] border-[#f7c12a]">
</div>
</div>
</div>
<div class="txt">
<b>Kiểm tra email</b> để nhận thông tin xác nhận đặt cọc thành công từ
Anphatpc gửi đến
<div class="note">(Lưu lý: Kiểm tra tất cả các hộp tư bao gồm cả thư rác)
</div>
</div>
</div>
</div>
<div class="contact-deposit mt-[10px] italic">
Trường hợp nếu không nhận được email, quý khách vui lòng gửi hình ảnh giao dịch qua
<b class="text-[#f00000]">Zalo: 0909000000</b> để được hỗ trợ
nhanh nhất.
</div>
</div>
</div>
</div>
</div>
<div class="content-right w-[490px]">
<div class="box-history shadow-[0_4px_4px_4px_#00000026] p-[15px] rounded-[15px]">
<h2 class="title text-[20px] text-center p-[5px_0] font-[700] uppercase">Các phiên đấu giá trước
</h2>
<div class="tab-history flex items-center bg-[#afafaf] p-[5px] rounded-[20px] mr-[-5px]">
<a href="javascript:void(0)" data-id="#3day"
class="item-tab w-[calc(100%_/_3_-5px)] mr-[5px] text-center text-[14px] text-white h-[34px] leading-[34px] active">3
ngày</a>
<a href="javascript:void(0)" data-id="#7day"
class="item-tab w-[calc(100%_/_3_-5px)] mr-[5px] text-center text-[14px] text-white h-[34px] leading-[34px]">7
ngày</a>
<a href="javascript:void(0)" data-id="#30day"
class="item-tab w-[calc(100%_/_3_-5px)] mr-[5px] text-center text-[14px] text-white h-[34px] leading-[34px]">30
ngày</a>
</div>
<table class="table-tab mt-[15px] text-left w-full h-[230px] overflow-auto active" id="3day">
<thead>
<th>Tên người thắng</th>
<th>Giác thắng cuộc</th>
<th>Thời gian</th>
</thead>
<tbody>
<tr>
<td>Mai anh</td>
<td><b>22.200.000 VNĐ</b></td>
<td>14:30:40 12/09/2024</td>
</tr>
<tr>
<td>Trần Quang</td>
<td><b>27.500.000 VNĐ</b></td>
<td>15:19:22 12/09/2024</td>
</tr>
<tr>
<td>Hoàng hải</td>
<td><b>21.800.000 VNĐ</b></td>
<td>10:39:41 13/09/2024</td>
</tr>
<tr>
<td>Phương Anh</td>
<td><b>12.900.000 VNĐ</b></td>
<td>14:12:33 13/09/2024</td>
</tr>
<tr>
<td>Mai Hoa</td>
<td><b>29.860.000 VNĐ</b></td>
<td>14:28:45 13/09/2024</td>
</tr>
<tr>
<td>Thu Hương</td>
<td><b>70.200.000 VNĐ</b></td>
<td>16:30:41 14/09/2024</td>
</tr>
<tr>
<td>Thu Hương</td>
<td><b>70.200.000 VNĐ</b></td>
<td>16:30:41 14/09/2024</td>
</tr>
</tbody>
</table>
<table class="table-tab mt-[15px] hidden" id="7day">
<thead>
<th>Tên người thắng</th>
<th>Giác thắng cuộc</th>
<th>Thời gian</th>
</thead>
<tbody>
<tr>
<td>Mai anh</td>
<td>22.200.000 VNĐ</td>
<td>14:30:40 12/09/2024</td>
</tr>
<tr>
<td>Trần Quang</td>
<td>27.500.000 VNĐ</td>
<td>15:19:22 12/09/2024</td>
</tr>
<tr>
<td>Hoàng hải</td>
<td>21.800.000 VNĐ</td>
<td>10:39:41 13/09/2024</td>
</tr>
<tr>
<td>Phương Anh</td>
<td>12.900.000 VNĐ</td>
<td>14:12:33 13/09/2024</td>
</tr>
<tr>
<td>Mai Hoa</td>
<td>29.860.000 VNĐ</td>
<td>14:28:45 13/09/2024</td>
</tr>
<tr>
<td>Thu Hương</td>
<td>70.200.000 VNĐ</td>
<td>16:30:41 14/09/2024</td>
</tr>
</tbody>
</table>
<table class="table-tab mt-[15px] hidden" id="30day">
<thead>
<th>Tên người thắng</th>
<th>Giác thắng cuộc</th>
<th>Thời gian</th>
</thead>
<tbody>
<tr>
<td>Mai anh</td>
<td>22.200.000 VNĐ</td>
<td>14:30:40 12/09/2024</td>
</tr>
<tr>
<td>Trần Quang</td>
<td>27.500.000 VNĐ</td>
<td>15:19:22 12/09/2024</td>
</tr>
<tr>
<td>Hoàng hải</td>
<td>21.800.000 VNĐ</td>
<td>10:39:41 13/09/2024</td>
</tr>
<tr>
<td>Phương Anh</td>
<td>12.900.000 VNĐ</td>
<td>14:12:33 13/09/2024</td>
</tr>
<tr>
<td>Mai Hoa</td>
<td>29.860.000 VNĐ</td>
<td>14:28:45 13/09/2024</td>
</tr>
<tr>
<td>Thu Hương</td>
<td>70.200.000 VNĐ</td>
<td>16:30:41 14/09/2024</td>
</tr>
</tbody>
</table>
</div>
<div class="list-product-auction bg-[var(--bg-list-auction)] mt-[15px] rounded-[15px] p-[15px]">
<h2 class="title text-[20px] font-[700] uppercase text-center mb-[10px] text-white">Đấu giá đang
diễn ra</h2>
<div class="list">
<div
class="item-auction flex p-[10px] border-[1px] border-[#e2e2e2] rounded-[10px] w-full mb-[15px] bg-white">
<div class="images block relative w-[160px] h-[160px] mr-[10px] overflow-hidden">
<a href="./detail.html">
<img class="block w-[100%] h-[100%] object-contain scale-[1] duration-[0.3s] hover:scale-[1.05] hover:duration-[0.3s]"
src="./assets/images/icon-pro-top.png" alt=""></a>
<div
class="box-join absolute left-[0] top-[0] w-[55px] h-[20px] leading-[55px] text-center text-white bg-[#f1b510] flex items-center justify-center rounded-[10px]">
<i class="icon_auction"></i>
<span>220</span>
</div>
</div>
<div class="info w-[calc(100%_-_170px)]">
<a href="./detail.html"
class="name line-clamp-2 font-[500] leading-[16px] hover:text-blue">Màn Hình
Dell
UltraSharp U2723QE (27.0
inch - 4K - IPS
Black</a>
<div class="old-price block m-[5px_0] text-[13px] text-[#000]">Giá gốc: 280.490.000
<u>đ</u>
</div>
<div class="price-auction flex items-center">
<p class="txt text-[16px] font-[500] mr-[10px]">Trả cao nhất:</p>
<p class="price-highest text-red text-[16px] font-[600]">230.490.000 <u>đ</u>
</p>
</div>
<a href="./detail.html" class="btn-add continue">Đấu giá</a>
</div>
</div>
<div
class="item-auction flex p-[10px] border-[1px] border-[#e2e2e2] rounded-[10px] w-full mb-[15px] bg-white">
<div class="images block relative w-[160px] h-[160px] mr-[10px] overflow-hidden">
<a href="./detail.html">
<img class="block w-[100%] h-[100%] object-contain scale-[1] duration-[0.3s] hover:scale-[1.05] hover:duration-[0.3s]"
src="./assets/images/icon-pro-top.png" alt=""></a>
<div
class="box-join absolute left-[0] top-[0] w-[55px] h-[20px] leading-[55px] text-center text-white bg-[#f1b510] flex items-center justify-center rounded-[10px]">
<i class="icon_auction"></i>
<span>220</span>
</div>
</div>
<div class="info w-[calc(100%_-_170px)]">
<a href="./detail.html"
class="name line-clamp-2 font-[500] leading-[16px] hover:text-blue">Màn Hình
Dell
UltraSharp U2723QE (27.0
inch - 4K - IPS
Black</a>
<div class="old-price block m-[5px_0] text-[13px] text-[#000]">Giá gốc: 280.490.000
<u>đ</u>
</div>
<div class="price-auction flex items-center">
<p class="txt text-[16px] font-[500] mr-[10px]">Trả cao nhất:</p>
<p class="price-highest text-red text-[16px] font-[600]">230.490.000 <u>đ</u>
</p>
</div>
<a href="./detail.html" class="btn-add continue">Đấu giá</a>
</div>
</div>
<div
class="item-auction flex p-[10px] border-[1px] border-[#e2e2e2] rounded-[10px] w-full mb-[15px] bg-white">
<div class="images block relative w-[160px] h-[160px] mr-[10px] overflow-hidden">
<a href="./detail.html">
<img class="block w-[100%] h-[100%] object-contain scale-[1] duration-[0.3s] hover:scale-[1.05] hover:duration-[0.3s]"
src="./assets/images/icon-pro-top.png" alt=""></a>
<div
class="box-join absolute left-[0] top-[0] w-[55px] h-[20px] leading-[55px] text-center text-white bg-[#f1b510] flex items-center justify-center rounded-[10px]">
<i class="icon_auction"></i>
<span>220</span>
</div>
</div>
<div class="info w-[calc(100%_-_170px)]">
<a href="./detail.html"
class="name line-clamp-2 font-[500] leading-[16px] hover:text-blue">Màn Hình
Dell
UltraSharp U2723QE (27.0
inch - 4K - IPS
Black</a>
<div class="old-price block m-[5px_0] text-[13px] text-[#000]">Giá gốc: 280.490.000
<u>đ</u>
</div>
<div class="price-auction flex items-center">
<p class="txt text-[16px] font-[500] mr-[10px]">Trả cao nhất:</p>
<p class="price-highest text-red text-[16px] font-[600]">230.490.000 <u>đ</u>
</p>
</div>
<a href="./detail.html" class="btn-add continue">Đấu giá</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="overlay"></div>
<div class="box-popup popup-rules">
<div class="title text-[24px] font-700 uppercase text-center mb-[15px]">Thể lệ tham gia đấu giá</div>
<a href="javascript:void(0)" class='click-close absolute top-[10px] right-[20px] text-[24px] text-[#afafaf]'
onclick="closePopop()">
<i class="fa fa-times"></i>
</a>
<i class="note-time font[400] mb-[20px] text-[#000000c2] block">Thời gian: Mỗi thứ 7 hàng tuần Dịch vụ ABC sẽ có
một
phiên đấu giá diễn ra từ 20 tới 22h
bao
gồm nhiều sản phẩm khác
nhau.</i>
<div class="content h-[340px] overflow-y-auto">
<p>- Các sản phẩm đều có giá khởi điểm và bước giá nhất định.</p>
<p>- Người chơi có thể bắt đầu đấu giá từ giá khởi điểm, người
trả giá sau cần trả mức giá cao hơn người trước ít nhất 1 bước giá. Kết thúc thời gian đấu giá, người
trả giá cao nhất và sớm nhất sẽ được mua sản phẩm.</p>
<p>
- Người chơi tham gia đấu giá cần đặt cọc trước 500.000 VND.
</p>
<p>- Trong thời gian diễn ra, một người chỉ được tham gia đấu giá 1 sản phẩm. Mỗi người có 5 lượt trả giá
</p>
<p> - Kết thúc phiên đấu giá, Gearvn sẽ công bố kết quả người trúng đấu giá.</p>
<p>+ Người trúng đấu giá cần thanh toán số tiền còn lại của sản phẩm sau khi
trừ tiền đặt
cọc trong vòng 24h kể từ khi công bố kết quả.Sau 24h kể từ khi công bố kết quả, người trúng đấu giá
chưa
thanh toán đủ
số tiền, tiền đặt cọc không được hoàn lại và tài khoản người chơi bị khóa không thể tham gia các chương
trình của Anphat
PC</p>
<p>- Trong thời gian diễn ra, một người chỉ được tham gia đấu giá 1 sản phẩm. Mỗi người có 5 lượt trả giá
</p>
<p> - Kết thúc phiên đấu giá, Gearvn sẽ công bố kết quả người trúng đấu giá.</p>
<p>+ Người trúng đấu giá cần thanh toán số tiền còn lại của sản phẩm sau khi
trừ tiền đặt
cọc trong vòng 24h kể từ khi công bố kết quả.Sau 24h kể từ khi công bố kết quả, người trúng đấu giá
chưa
thanh toán đủ
số tiền, tiền đặt cọc không được hoàn lại và tài khoản người chơi bị khóa không thể tham gia các chương
trình của Anphat
PC</p>
<p>
+ Nếu không trúng đấu giá, người chơi sẽ được hoàn lại tiền cọc trong vòng 02 ngày kể từ khi kết thúc.
</p>
<p>Bước 1: Đăng nhập tài khoản</p>
<p>Bước 2: Xem và chọn sản phẩm đấu giá</p>
</div>
<div class="check">
<label class="input-checkbox">Tôi đã đọc và đồng ý với các thể lệ của chương trình
<input type="checkbox" id="check_rules">
<span class="checkmark"></span>
</label>
</div>
<button type="submit"
class="btn-submit block w-[168px] h-[42px] leading-[42px] text-center m-[20px_auto] uppercase text-white font-[700] rounded-[26px] outline-none border-0 background-blue hover:background-white hover:text-blue hover:border-blue"
id="submit_rules">Đã hiểu</button>
</div>
<div class="box-popup popup-login">
<div class="content w-[390px] m-[20px_auto]">
<div class="title text-[20px] font-[600] leading-[24px] mb-[15px] text-center">Bạn vui lòng đăng nhập tài
khoản <br>để
tham gia đấu giá</div>
<a href="javascript:void(0)"
class='click-close absolute
top-[-15px] right-[-10px] text-[24px] w-[42px] h-[42px] leading-[42px] bg-black border-[3px] border-[#f1b510] rounded-[50%] text-center text-white'
onclick="closePopop()">
<i class="fa fa-times"></i>
</a>
<a href="javascript:void(0)"
class="btn-login flex items-center justify-between w-full h-[52px] mb-[10px] p-[15px] rounded-[10px] border-[1px] border-[#8e8e8e] google"
onclick="checklogin()">
<div class="left flex items-center">
<img src="./assets/images/icon-google.png" width="100%" height="100%" alt="google"
class="w-[28px] h-[28px]">
<span class="ml-[10px]">Đăng nhập bằng Google</span>
</div>
<i class="fas fa-chevron-right"></i>
</a>
<a href="javascript:void(0)"
class="btn-login flex items-center justify-between w-full h-[52px] mb-[10px] p-[15px] rounded-[10px] border-[1px] border-[#8e8e8e] facebook"
onclick="checklogin()">
<div class="left flex items-center">
<img src="./assets/images/icon-facebook-login.png" width="100%" height="100%" alt="facebook"
class="w-[28px] h-[28px]">
<span class="ml-[10px]">Đăng nhập bằng Google</span>
</div>
<i class="fas fa-chevron-right"></i>
</a>
</div>
</div>
<div class="box-popup popup-yeucau">
<div class="content">
<div class="title text-[20px] font-[600] leading-[24px] mb-[15px] text-center">Yêu cầu đặt cọc</div>
<a href="javascript:void(0)"
class='click-close absolute
top-[-15px] right-[-10px] text-[24px] w-[42px] h-[42px] leading-[42px] bg-black border-[3px] border-[#f1b510] rounded-[50%] text-center text-white'
onclick="closePopop()">
<i class="fa fa-times"></i>
</a>
<p class="text-center">Vui lòng đặt cọc số tiền 500.000đ để tham gia đấu giá</p>
<a class="btn-submit block w-[168px] h-[42px] leading-[42px] text-center m-[20px_auto] uppercase text-white font-[700] rounded-[26px] outline-none border-0 background-blue hover:background-white hover:text-blue hover:border-blue"
href="javascript:void(0)" onclick="showInfoPay()">Tiếp tục</a>
</div>
</div>
<div class="box-popup popup-info-pay">
<div class="title-main text-[20px] font-[600] leading-[24px] mb-[15px] text-center">Thông tin đặt cọc sản phẩm
</div>
<a href="javascript:void(0)"
class='click-close absolute
top-[-15px] right-[-10px] text-[24px] w-[42px] h-[42px] leading-[42px] bg-black border-[3px] border-[#f1b510] rounded-[50%] text-center text-white'
onclick="closePopop()">
<i class="fa fa-times"></i>
</a>
<div class="box-deposit mt-[15px]">
<i class="title">Quý khách vui lòng làm theo các bước sau đây.</i>
<div class="content-deposit ml-[10px] pl-[20px] border-l-[2px] border-[#f1b510]">
<div class="item mb-[20px]">
<div
class="step relative w-[102px] h-[40px] leading-[40px] text-center text-white rounded-[21px] text-[16px] font-[700] bg-[#166dd8] mb-[10px]">
Bước 1
<div
class="circle w-[24px] h-[24px] flex items-center justify-center bg-[#1e7ef7] border-[2px] border-[#f7c12a] rounded-[50%] absolute left-[-33px] top-[20%]">
<div
class="circle-inner w-[10px] h-[10px] bg-white rounded-[50%] border-[2px] border-[#f7c12a]">
</div>
</div>
</div>
<b class="txt flex font-[500]">
Đặt cọc <div class="price font-[700] text-[#f00000] p-[0_5px]">500.000 VNĐ
</div>
STK bên dưới
</b>
</div>
<div class="item">
<div
class="step relative w-[102px] h-[40px] leading-[40px] text-center text-white rounded-[21px] text-[16px] font-[700] bg-[#166dd8] mb-[10px]">
Bước 2
<div
class="circle w-[24px] h-[24px] flex items-center justify-center bg-[#1e7ef7] border-[2px] border-[#f7c12a] rounded-[50%] absolute left-[-33px] top-[20%]">
<div
class="circle-inner w-[10px] h-[10px] bg-white rounded-[50%] border-[2px] border-[#f7c12a]">
</div>
</div>
</div>
<div class="txt">
<b>Kiểm tra email</b> để nhận thông tin xác nhận đặt cọc thành công từ
Anphatpc gửi đến
<div class="note">(Lưu lý: Kiểm tra tất cả các hộp tư bao gồm cả thư rác)
</div>
</div>
</div>
</div>
<div class="contact-deposit mt-[10px] italic">
Trường hợp nếu không nhận được email, quý khách vui lòng gửi hình ảnh giao dịch qua
<b class="text-[#f00000]">Zalo: 0909000000</b> để được hỗ trợ
nhanh nhất.
</div>
<div class="pay-qr">
<div class="title text-[16px] font-[600] m-[15px_0]">Thông tin tài khoản nhận cọc</div>
<div class="flex">
<img src="./assets/images/image-qr.png" class="image-qr w-[123px] h-[123px] mr-[10px]" width="100%"
height="100%" alt="qr">
<div class="info w-[calc(100%_-133px)]">
<p>Công ty CP THƯƠNG MẠI DỊCH VỤ ACB</p>
<p>Ngân hàng: Techcombank</p>
<p>Số tài khoản: 9999998888</p>
<b>Nội dung thanh toán:</b>
<p>[id tài khoản] đặt cọc tham gia đấu giá sản phẩm [mã sp]</p>
</div>
</div>
</div>
</div>
</div>
<div class="box-popup popup-success">
<h2 class="title text-[24px] font-[700] text-center uppercase text-[#d00000]
">
xin chúc mừng!
</h2>
<a href="javascript:void(0)"
class='click-close absolute
top-[-15px] right-[-10px] text-[24px] w-[42px] h-[42px] leading-[42px] bg-black border-[3px] border-[#f1b510] rounded-[50%] text-center text-white'
onclick="closePopop()">
<i class="fa fa-times"></i>
</a>
<div class="note-title text-[#d00000] text-[20px] text-center">Bạn đã đặt giá thầu thành công!</div>
<div class="content p-[0_20px] text-center leading-[19px] mt-[25px] font-[400]">
Quý khách hãy tiếp tục theo dõi màn đấu giá cho đến hết thời gian diễn ra. Lịch sử đấu giá sẽ được hiển thị
tại đây. Khi
thời gian kết thúc, bộ phận CSKH sẽ gửi email xác nhận đến người chiến thắng!
</div>
<a class="btn-submit block w-[168px] h-[42px] leading-[42px] text-center m-[20px_auto] uppercase text-white font-[700] rounded-[26px] outline-none border-0 background-blue hover:background-white hover:text-blue hover:border-blue"
href="javascript:void(0)" onclick="closePopop()">Đã hiểu</a>
</div>
<div class="box-popup popup-error">
<i class="fas fa-exclamation-triangle text-[#f4bc20] text-[58px] text-center mb-[10px] block"></i>
<h2 class="title text-[24px] text-center text-[#f4bc20] uppercase font-[700]">Đấu giá không thành công</h2>
<a href="javascript:void(0)"
class='click-close absolute
top-[-15px] right-[-10px] text-[24px] w-[42px] h-[42px] leading-[42px] bg-black border-[3px] border-[#f1b510] rounded-[50%] text-center text-white'
onclick="closePopop()">
<i class="fa fa-times"></i>
</a>
<div class="content text-center text-[#1e1e1e]">
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 block w-[168px] h-[42px] leading-[42px] text-center m-[20px_auto] uppercase text-white font-[700] rounded-[26px] outline-none border-0 background-blue hover:background-white hover:text-blue hover:border-blue"
href="javascript:void(0)" onclick="closePopop()">Thử lại</a>
</div>
<div class="footer">
<div class="box-faq mt-[25px]">
<div class="container">
<div class="background-faq border-[2px] border-[var(--border-faq)] p-[10px] rounded-[15px]">
<h2 class="title text-center text-[32px] font-[600] uppercase text-[var(--color-faq)] mb-[20px]">Câu
hỏi
thường gặp
</h2>
<div class="content-faq">
<div class="item float-left w-[calc(100%_/_2_-_15px)] mr-[15px] mb-[10px]
border-[1px] border-[#e2e2e2] rounded-[8px] p-[10px] bg-[var(--title-faq)]">
<a href="javascript:void(0)"
class="faqlink flex items-center justify-between text-16px font-[600] text-[#3a3a3a]">
<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 hidden m-[5px_0_0_10px] font-[400] text-[14px]">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 float-left w-[calc(100%_/_2_-_15px)] mr-[15px] mb-[10px]
border-[1px] border-[#e2e2e2] rounded-[8px] p-[10px] bg-[var(--title-faq)]">
<a href="javascript:void(0)"
class="faqlink flex items-center justify-between text-16px font-[600] text-[#3a3a3a]">
<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 hidden m-[5px_0_0_10px] font-[400] text-[14px]">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 float-left w-[calc(100%_/_2_-_15px)] mr-[15px] mb-[10px]
border-[1px] border-[#e2e2e2] rounded-[8px] p-[10px] bg-[var(--title-faq)]">
<a href="javascript:void(0)"
class="faqlink flex items-center justify-between text-16px font-[600] text-[#3a3a3a]">
<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 hidden m-[5px_0_0_10px] font-[400] text-[14px]">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 float-left w-[calc(100%_/_2_-_15px)] mr-[15px] mb-[10px]
border-[1px] border-[#e2e2e2] rounded-[8px] p-[10px] bg-[var(--title-faq)]">
<a href="javascript:void(0)"
class="faqlink flex items-center justify-between text-16px font-[600] text-[#3a3a3a]">
<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 hidden m-[5px_0_0_10px] font-[400] text-[14px]">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 float-left w-[calc(100%_/_2_-_15px)] mr-[15px] mb-[10px]
border-[1px] border-[#e2e2e2] rounded-[8px] p-[10px] bg-[var(--title-faq)]">
<a href="javascript:void(0)"
class="faqlink flex items-center justify-between text-16px font-[600] text-[#3a3a3a]">
<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 hidden m-[5px_0_0_10px] font-[400] text-[14px]">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 background-footer mt-[20px]">
<div class="container">
<div class="footer-policies flex items-center justify-between p-[25px_0] border-b-[1px] border-[#fff]">
<div class="item-policies flex items-center w-[calc(100%_/4)]">
<div class="icons w-[35px] h-[30px] block mr-[13px]">
<img src="./assets/images/icon-ship.png" width="100%" height="100%" alt="ship">
</div>
<div class="txt w-[calc(100%_-35px_-13px)] text-white text-[16px]">
<b class="uppercase">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 flex items-center w-[calc(100%_/4)]">
<div class="icons w-[26px] h-[30px] block mr-[13px]">
<img src="./assets/images/icon-return.png" width="100%" height="100%" alt="ship">
</div>
<div class="txt w-[calc(100%_-35px_-13px)] text-white text-[16px]">
<b class="uppercase">Đổ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 flex items-center w-[calc(100%_/4)]">
<div class="icons w-[35px] h-[30px] block mr-[13px]">
<img src="./assets/images/icon-pay.png" width="100%" height="100%" alt="ship">
</div>
<div class="txt w-[calc(100%_-35px_-13px)] text-white text-[16px]">
<b class="uppercase">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 flex items-center w-[calc(100%_/4)]">
<div class="icons w-[35px] h-[30px] block mr-[13px]">
<img src="./assets/images/icon-chat.png" width="100%" height="100%" alt="ship">
</div>
<div class="txt w-[calc(100%_-35px_-13px)] text-white text-[16px]">
<b class="uppercase">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 relative">
<div class="info-contact text-center p-[15px_0_20px_0] text-white">
<b class="uppercase text-[15px] mb-[2px]">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 class="font-[300]">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 class="font-[300]">Điện thoại: 19000323 Email: Giang@anphat.com.vn</p>
</div>
<a href="tel:19000323"
class="btn-phone w-[235px] block absolute right-0 top-[50%] translate-x-[0] translate-y-[-50%]">
<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 src="./assets//js/main.js"></script>
</html>