Untitled
unknown
plain_text
a year ago
22 kB
3
Indexable
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Gym department details</title>
<meta name="description" content="" />
<meta name="keywords" content="" />
<link rel="icon" href="assets/img/icon.png" />
<link rel="apple-touch-icon" href="assets/img/apple-touch-icon.png" />
<script src="https://kit.fontawesome.com/a59b9b09ab.js" crossorigin="anonymous"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" />
<link href="https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i|Raleway:300,300i,400,400i,500,500i,600,600i,700,700i|Poppins:300,300i,400,400i,500,500i,600,600i,700,700i" rel="stylesheet" />
<link href="assets/vendor/aos/aos.css" rel="stylesheet" />
<link href="assets/vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet" />
<link href="assets/vendor/bootstrap-icons/bootstrap-icons.css" rel="stylesheet" />
<link href="assets/vendor/boxicons/css/boxicons.min.css" rel="stylesheet" />
<link href="assets/vendor/glightbox/css/glightbox.min.css" rel="stylesheet" />
<link href="assets/vendor/remixicon/remixicon.css" rel="stylesheet" />
<link href="assets/vendor/swiper/swiper-bundle.min.css" rel="stylesheet" />
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css" />
<link href="assets/css/MyStyle.css" rel="stylesheet" />
</head>
<body class="body-my-card">
<header id="header">
<div class="container d-flex align-items-center justify-content-lg-between">
<h1 style="margin-left: -60px;" class="logo me-auto me-lg-0">
<a href="index.html">Fitpass<span>.</span></a>
</h1>
<nav id="navbar" class="navbar order-last order-lg-0">
<ul>
<li><a class="nav-link scrollto active" href="#hero">Trang chủ</a></li>
<li><a class="nav-link scrollto" href="#about">Đặt lịch tập</a></li>
<li><a class="nav-link scrollto" href="#services">Liên hệ</a></li>
<li>
<form class="d-flex" style="margin-left: 50px;">
<input style="height: 30px; margin-top: 5px; width: 300px;" class="form-control me-2" type="search" placeholder="Tìm kiếm" aria-label="Search" />
<img type="submit" style="margin-top: 6px; width: 25px; height: 25px;" src="https://cdn-icons-png.flaticon.com/128/4250/4250968.png" />
</form>
</li>
</ul>
<i class="bi bi-list mobile-nav-toggle"></i>
</nav>
<div style="display: flex; margin-right: 50px;">
<img type="submit" style="margin-top: 3px; width: 35px; height: 35px;" src="https://cdn-icons-png.flaticon.com/128/9405/9405895.png" />
<div style="margin: auto; margin-left: 10px; color: rgb(255, 170, 0); font-weight: 500;">500 Credits</div>
</div>
<div class="dropdown" style="position: absolute; right: 10px;">
<button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenuButton1" data-bs-toggle="dropdown" aria-expanded="false">
<a href="#"><img style="width: 30px;" src="https://cdn-icons-png.flaticon.com/128/3870/3870822.png" /></a>
</button>
<ul class="dropdown-menu" aria-labelledby="dropdownMenuButton1">
<li><a class="dropdown-item" href="#">Tài khoản người dùng</a></li>
<li><a class="dropdown-item" href="#">Lịch sử</a></li>
<li><a class="dropdown-item" href="#">Đăng xuất</a></li>
</ul>
</div>
</div>
</header>
<!-- Content -->
<div id="my-card" class="my-card-container">
<h2>Giỏ hàng của bạn</h2>
<div class="line"></div>
<div class="my-card-title">
<div class="form-check">
<input onclick= 'checkUncheck(this)' class="" type="checkbox" value="" id="flexCheckChecked" />
<label class="" for="flexCheckChecked"> </label>
</div>
<div class="my-plan-title">Gói tập</div>
<div class="price-title">Đơn giá (credits)</div>
<div class="num-of-plan-title">Số lượng</div>
<div class="action-title">Thao tác</div>
</div>
<!-- Để foreach ở đây -->
<div class="plan-in-my-card">
<div class="all-plan-of-gym">
<div class="form-check">
<input onclick='checkUncheckGymDept(this)' name="gym" class="" type="checkbox" value="" id="flexCheckChecked" />
<label class="" for="flexCheckChecked"> </label>
</div>
<div class="gym-name-mc">Phòng gym Hòa Lạc</div>
</div>
<!-- Từng gym plan -->
<div style="height: 15px; background-color: white;"></div>
<div class="gym-department-plan">
<div class="form-check">
<input onclick='updateCartTotal(this)' name="plan" class="" type="checkbox" value="" id="flexCheckChecked" />
<label class="" for="flexCheckChecked"> </label>
</div>
<div class="plan-card-mc">
<img src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcT0ZzXyHZsB8zbJbdSjPVnhudXgXWnDbJIdOQ&usqp=CAU" />
<div class="plan-info-mc">
<h4>Gói tập kim cương</h4>
<div>Thời lượng 365 ngày</div>
</div>
<div class="active-time-mc">
Kích hoạt trong vòng 10 ngày
</div>
</div>
<div class="plan-price-mc">
200
</div>
<div class="num-of-plan-mc">
1
</div>
<button type="button" class="btn btn-warning">
<svg xmlns="http://www.w3.org/2000/svg" width="25" height="25" fill="currentColor" class="bi bi-trash-fill" viewBox="0 0 16 16">
<path
d="M2.5 1a1 1 0 0 0-1 1v1a1 1 0 0 0 1 1H3v9a2 2 0 0 0 2 2h6a2 2 0 0 0 2-2V4h.5a1 1 0 0 0 1-1V2a1 1 0 0 0-1-1H10a1 1 0 0 0-1-1H7a1 1 0 0 0-1 1H2.5zm3 4a.5.5 0 0 1 .5.5v7a.5.5 0 0 1-1 0v-7a.5.5 0 0 1 .5-.5zM8 5a.5.5 0 0 1 .5.5v7a.5.5 0 0 1-1 0v-7A.5.5 0 0 1 8 5zm3 .5v7a.5.5 0 0 1-1 0v-7a.5.5 0 0 1 1 0z"
/>
</svg>
</button>
</div>
<div class="gym-department-plan">
<div class="form-check">
<input onclick='updateCartTotal(this)' name="plan" class="" type="checkbox" value="" id="flexCheckChecked" />
<label class="" for="flexCheckChecked"> </label>
</div>
<div class="plan-card-mc">
<img src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcT0ZzXyHZsB8zbJbdSjPVnhudXgXWnDbJIdOQ&usqp=CAU" />
<div class="plan-info-mc">
<h4>Gói tập trải nghiệm</h4>
<div>Thời lượng 30 ngày</div>
</div>
<div class="active-time-mc">
Kích hoạt trong vòng 5 ngày
</div>
</div>
<div class="plan-price-mc">
50
</div>
<div class="num-of-plan-mc">
1
</div>
<button type="button" class="btn btn-warning">
<svg xmlns="http://www.w3.org/2000/svg" width="25" height="25" fill="currentColor" class="bi bi-trash-fill" viewBox="0 0 16 16">
<path
d="M2.5 1a1 1 0 0 0-1 1v1a1 1 0 0 0 1 1H3v9a2 2 0 0 0 2 2h6a2 2 0 0 0 2-2V4h.5a1 1 0 0 0 1-1V2a1 1 0 0 0-1-1H10a1 1 0 0 0-1-1H7a1 1 0 0 0-1 1H2.5zm3 4a.5.5 0 0 1 .5.5v7a.5.5 0 0 1-1 0v-7a.5.5 0 0 1 .5-.5zM8 5a.5.5 0 0 1 .5.5v7a.5.5 0 0 1-1 0v-7A.5.5 0 0 1 8 5zm3 .5v7a.5.5 0 0 1-1 0v-7a.5.5 0 0 1 1 0z"
/>
</svg>
</button>
</div>
</div>
<div class="plan-in-my-card">
<div class="all-plan-of-gym">
<div class="form-check">
<input onclick='checkUncheckGymDept(this)' name="gym1" input class="" type="checkbox" value="" id="flexCheckChecked" />
<label class="" for="flexCheckChecked"> </label>
</div>
<div class="gym-name-mc">Phòng tập gym hà nội Nshape Fitness</div>
</div>
<!-- Từng gym plan -->
<div style="height: 15px; background-color: white;"></div>
<div class="gym-department-plan">
<div class="form-check">
<input onclick='updateCartTotal(this)' name="plan" class="" type="checkbox" value="" id="flexCheckChecked" />
<label class="" for="flexCheckChecked"> </label>
</div>
<div class="plan-card-mc">
<img src="https://www.shutterstock.com/image-vector/bodybuilding-emblem-gym-logo-design-260nw-2250386197.jpg" />
<div class="plan-info-mc">
<h4>Gói tập kim cương</h4>
<div>Thời lượng 365 ngày</div>
</div>
<div class="active-time-mc">
Kích hoạt trong vòng 10 ngày
</div>
</div>
<div class="plan-price-mc">
200
</div>
<div class="num-of-plan-mc">
1
</div>
<button type="button" class="btn btn-warning">
<svg xmlns="http://www.w3.org/2000/svg" width="25" height="25" fill="currentColor" class="bi bi-trash-fill" viewBox="0 0 16 16">
<path
d="M2.5 1a1 1 0 0 0-1 1v1a1 1 0 0 0 1 1H3v9a2 2 0 0 0 2 2h6a2 2 0 0 0 2-2V4h.5a1 1 0 0 0 1-1V2a1 1 0 0 0-1-1H10a1 1 0 0 0-1-1H7a1 1 0 0 0-1 1H2.5zm3 4a.5.5 0 0 1 .5.5v7a.5.5 0 0 1-1 0v-7a.5.5 0 0 1 .5-.5zM8 5a.5.5 0 0 1 .5.5v7a.5.5 0 0 1-1 0v-7A.5.5 0 0 1 8 5zm3 .5v7a.5.5 0 0 1-1 0v-7a.5.5 0 0 1 1 0z"
/>
</svg>
</button>
</div>
<div class="gym-department-plan">
<div class="form-check">
<input onclick='updateCartTotal(this)' name="plan" class="" type="checkbox" value="" id="flexCheckChecked" />
<label class="" for="flexCheckChecked"> </label>
</div>
<div class="plan-card-mc">
<img src="https://www.shutterstock.com/image-vector/bodybuilding-emblem-gym-logo-design-260nw-2250386197.jpg" />
<div class="plan-info-mc">
<h4>Gói tập trải nghiệm</h4>
<div>Thời lượng 30 ngày</div>
</div>
<div class="active-time-mc">
Kích hoạt trong vòng 5 ngày
</div>
</div>
<div class="plan-price-mc">
50
</div>
<div class="num-of-plan-mc">
1
</div>
<button type="button" class="btn btn-warning">
<svg xmlns="http://www.w3.org/2000/svg" width="25" height="25" fill="currentColor" class="bi bi-trash-fill" viewBox="0 0 16 16">
<path
d="M2.5 1a1 1 0 0 0-1 1v1a1 1 0 0 0 1 1H3v9a2 2 0 0 0 2 2h6a2 2 0 0 0 2-2V4h.5a1 1 0 0 0 1-1V2a1 1 0 0 0-1-1H10a1 1 0 0 0-1-1H7a1 1 0 0 0-1 1H2.5zm3 4a.5.5 0 0 1 .5.5v7a.5.5 0 0 1-1 0v-7a.5.5 0 0 1 .5-.5zM8 5a.5.5 0 0 1 .5.5v7a.5.5 0 0 1-1 0v-7A.5.5 0 0 1 8 5zm3 .5v7a.5.5 0 0 1-1 0v-7a.5.5 0 0 1 1 0z"
/>
</svg>
</button>
</div>
</div>
<div id="gym" class="plan-in-my-card">
<div class="all-plan-of-gym">
<div class="form-check">
<input onclick='checkUncheckGymDept(this)' name="gym" class="" type="checkbox" value="" id="flexCheckChecked" />
<label class="" for="flexCheckChecked"> </label>
</div>
<div class="gym-name-mc">Phòng gym California</div>
</div>
<!-- Từng gym plan -->
<div style="height: 15px; background-color: white;"></div>
<div class="list-plan-mc">
<div class="gym-department-plan">
<div class="form-check">
<input onclick='updateCartTotal(this)' name="plan" class="" type="checkbox" value="" id="flexCheckChecked" />
<label class="" for="flexCheckChecked"> </label>
</div>
<div class="plan-card-mc">
<img src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcQJSael8OXoxrZYT51MKhAlnxY6B7Jb8_rw4w&usqp=CAU" />
<div class="plan-info-mc">
<h4>Gói tập kim cương</h4>
<div>Thời lượng 365 ngày</div>
</div>
<div class="active-time-mc">
Kích hoạt trong vòng 10 ngày
</div>
</div>
<div class="plan-price-mc">
250
</div>
<div class="num-of-plan-mc">
1
</div>
<button type="button" class="btn btn-warning">
<svg xmlns="http://www.w3.org/2000/svg" width="25" height="25" fill="currentColor" class="bi bi-trash-fill" viewBox="0 0 16 16">
<path
d="M2.5 1a1 1 0 0 0-1 1v1a1 1 0 0 0 1 1H3v9a2 2 0 0 0 2 2h6a2 2 0 0 0 2-2V4h.5a1 1 0 0 0 1-1V2a1 1 0 0 0-1-1H10a1 1 0 0 0-1-1H7a1 1 0 0 0-1 1H2.5zm3 4a.5.5 0 0 1 .5.5v7a.5.5 0 0 1-1 0v-7a.5.5 0 0 1 .5-.5zM8 5a.5.5 0 0 1 .5.5v7a.5.5 0 0 1-1 0v-7A.5.5 0 0 1 8 5zm3 .5v7a.5.5 0 0 1-1 0v-7a.5.5 0 0 1 1 0z"
/>
</svg>
</button>
</div>
<div class="gym-department-plan">
<div class="form-check">
<input onclick='updateCartTotal(this)' name="plan" class="" type="checkbox" value="" id="flexCheckChecked" />
<label class="" for="flexCheckChecked"> </label>
</div>
<div class="plan-card-mc">
<img src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcQJSael8OXoxrZYT51MKhAlnxY6B7Jb8_rw4w&usqp=CAU" />
<div class="plan-info-mc">
<h4>Gói tập trải nghiệm</h4>
<div>Thời lượng 30 ngày</div>
</div>
<div class="active-time-mc">
Kích hoạt trong vòng 5 ngày
</div>
</div>
<div class="plan-price-mc" >
100
</div>
<div class="num-of-plan-mc">
1
</div>
<button type="button" class="btn btn-warning">
<svg xmlns="http://www.w3.org/2000/svg" width="25" height="25" fill="currentColor" class="bi bi-trash-fill" viewBox="0 0 16 16">
<path
d="M2.5 1a1 1 0 0 0-1 1v1a1 1 0 0 0 1 1H3v9a2 2 0 0 0 2 2h6a2 2 0 0 0 2-2V4h.5a1 1 0 0 0 1-1V2a1 1 0 0 0-1-1H10a1 1 0 0 0-1-1H7a1 1 0 0 0-1 1H2.5zm3 4a.5.5 0 0 1 .5.5v7a.5.5 0 0 1-1 0v-7a.5.5 0 0 1 .5-.5zM8 5a.5.5 0 0 1 .5.5v7a.5.5 0 0 1-1 0v-7A.5.5 0 0 1 8 5zm3 .5v7a.5.5 0 0 1-1 0v-7a.5.5 0 0 1 1 0z"
/>
</svg>
</button>
</div>
</div>
</div>
<div class="total-container-mc">
<h3 class="total-plan-mc">
<span id="count-all-plan-mc"></span>
<span>sản phẩm</span>
</h3>
<div class="total-credits-mc">
<span class="total-title">Tổng thanh toán : </span>
<span id="total-price-mc" class="total">0</span>
</div>
<div class="buy-button-mc">
<button class="btn btn-warning" style="font-weight: 700;">Mua hàng</button>
</div>
</div>
<p id="demo"></p>
</div>
<!-- Vendor JS Files -->
<script src="assets/vendor/purecounter/purecounter_vanilla.js"></script>
<script src="assets/vendor/aos/aos.js"></script>
<script src="assets/vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
<script src="assets/vendor/glightbox/js/glightbox.min.js"></script>
<script src="assets/vendor/isotope-layout/isotope.pkgd.min.js"></script>
<script src="assets/vendor/swiper/swiper-bundle.min.js"></script>
<script src="assets/vendor/php-email-form/validate.js"></script>
<!-- Template Main JS File -->
<script src="assets/js/main.js"></script>
<script>
const element = document.getElementById("my-card");
const nodes = element.getElementsByClassName("gym-department-plan");
// count num of plan in shopping card
document.getElementById("count-all-plan-mc").innerHTML = nodes.length;
function checkUncheck(checkBox) {
get = document.getElementsByTagName("input");
for(var i=0; i<get.length; i++) {
get[i].checked = checkBox.checked;}
}
get1 = document.getElementsByClassName("plan-in-my-card");
// list_price = document.getElementsByClassName("plan-price-mc");
// console.log(list_price);
function checkUncheckGymDept(checkBox) {
get2 = checkBox.parentElement.parentElement.parentElement.getElementsByTagName("input");
// console.log(get2);
for(var i=0; i<get2.length; i++) {
get2[i].checked = checkBox.checked;
}
list_gym_dept_price = checkBox.parentElement.parentElement.parentElement.getElementsByClassName("plan-price-mc");
let total = document.getElementById("total-price-mc").innerHTML;
total_int = parseInt(total);
// console.log(list_gym_dept_price);
let total_gym_dept = 0;
for(var j=0; j<list_gym_dept_price.length;j++){
// console.log(list_gym_dept_price[j].innerHTML);
total_gym_dept = total_gym_dept + parseInt(list_gym_dept_price[j].innerHTML);
}
total_int = total_int + total_gym_dept;
// console.log(total_int);
document.getElementById("total-price-mc").innerHTML = total_int;
console.log(total_int);
if(checkBox.checked == false){
total_int = parseInt(document.getElementById("total-price-mc").innerHTML) - total_gym_dept;
console.log(total_gym_dept);
console.log(total_int);
}
}
// function updateCartTotal(checkBox){
// let total = document.getElementById("total-price-mc").innerHTML;
// total_int = parseInt(total);
// get2 = checkBox.parentElement.parentElement.getElementsByClassName("plan-price-mc");
// price_int = parseInt(get2[0].innerHTML);
// if(checkBox.checked){
// total_int = total_int + price_int;
// document.getElementById("total-price-mc").innerHTML = total_int;
// console.log(total_int);
// document.getElementById("total-price-mc").innerHTML = price;
// }
// else{
// total_int = total_int - price_int;
// document.getElementById("total-price-mc").innerHTML = total_int;
// console.log(total_int);
// // document.getElementById("total-price-mc").innerHTML = total;
// }
// }
</script>
</body>
</html>