master

分支 (1)

管理

管理

master

operator-web
/
ltgwc.html

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="robots" content="noindex, follow"/>
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="shortcut icon" type="image/x-icon" href="img/favicon.ico"/>
    <link rel="stylesheet" href="css/vendor.min.css">
    <link rel="stylesheet" href="css/plugins.min.css">
    <link rel="stylesheet" href="css/style.min.css">
    <style>
        html{
            height: 100%;
            overflow-y: hidden;
        }
        body{
            height: 100%;
            overflow-y: auto;
        }
    </style>
</head>
<body>
<div class="main-wrapper">
    <main class="main-content" style="padding-top:30px ">
        <div class="container">
            <div class="row">
                <div class="col-12">
                    <form action="javascript:void(0)">
                        <div class="table-content table-responsive">
                            <table class="table">
                                <thead>
                                <tr>
                                    <th class="product_remove">remove</th>
                                    <th class="product-thumbnail">images</th>
                                    <th class="cart-product-name">Product</th>
                                    <th class="product-price">Unit Price</th>
                                    <th class="product-quantity">Quantity</th>
                                    <th class="product-subtotal">Total</th>
                                </tr>
                                </thead>
                                <tbody id="box">

                                </tbody>
                            </table>
                        </div>
                        <div class="row">
                            <div class="col-md-5 ml-auto">
                                <div class="cart-page-total">
                                    <h2>Cart totals</h2>
                                    <ul>
                                        <li>Subtotal <span>$<span class="zongji"></span></span></li>
                                        <li>Total <span>$<span class="zongji"></span></span></li>
                                    </ul>
                                    <a style="color: white;cursor: pointer;" onclick="toOrder()">Proceed to checkout</a>
                                </div>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </main>
    <div class="footer-area">
        <div class="footer-bottom py-3" data-bg-color="#1EB9EE">
            <div class="container">
                <div class="row">
                    <div class="col-lg-12">
                        <div class="copyright">
                            <span class="copyright-text text-white">Copyright &copy; 2023.LAO Asia Unicom All rights reserved.</span>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <a class="scroll-to-top" href="">
        <i class="fa fa-chevron-up"></i>
    </a>
</div>

<script src="layui/layui.js"></script>
<script src="js/vendor.min.js"></script>
<script src="js/plugins.min.js"></script>
<script src="js/config.js"></script>
<script src="js/token.js"></script>
<script src="js/jquery.i18n.min.js"></script>
<script src="js/multi_lang_config.js"></script>
<script>

    var layer = layui.layer;
    var form = layui.form;

    var moduleName = "shop";
    var defaultLang = layui.data('langTab').langType;
    initLangConfig({
        defaultLang:defaultLang,
        filePath: "js/i18n/"+moduleName+"/",
        module:moduleName,
        base:"js/"
    })
    var i18np = null;
    function changeLang(lang) {
        defaultLang = lang;
        reloadI18n({
            defaultLang:lang,
            filePath: "js/i18n/"+moduleName+"/",
            module:moduleName,
        })
        i18np.loadProperties(moduleName);
    }

    layui.config({base: 'js/'})
        // 继承treetable.js插件
        .extend({i18np: 'i18n'}).use([ 'i18np','jquery'], function () {
        i18np = layui.i18np;
        // i18np.loadProperties(moduleName);
    });

    chashuju();
    function xiaoji() {
        var dj = document.querySelectorAll(".dj");
        var sl = document.querySelectorAll('.sl');
        var zj = document.querySelectorAll('.zj');
        for (var i = 0; i < sl.length; i++) {
            zj[i].innerHTML = +sl[i].innerHTML * +dj[i].innerHTML;
        }
    }

    function zongjia() {
        var zongji = document.querySelectorAll('.zongji');
        var zj = document.querySelectorAll('.zj');
        var he = 0;
        for (var i = 0; i < zj.length; i++) {
            he += +zj[i].innerHTML;
        }
        zongji[0].innerHTML = he;
        zongji[1].innerHTML = he;
    }
    var carts = [];
    //跳转订单页面
    function toOrder() {
        if (carts.length > 0){
            window.location.href = "order.html";
        }else{
            layer.msg("请先加入购物车！",{icon:2})
        }
    }
    function chashuju() {
        document.getElementById('box').innerHTML="";
        $.ajax({
            url: HOST + "webapi/cart/getgood",
            type: "get",
            data: {userId:localStorage.getItem("userId")},
            success: function (res) {
                if (res.code == 200) {
                    carts = res.data;
                    for (var i = 0; i < res.data.length; i++) {
                        var s = `
			<tr>
        <td class="product_remove">
            <a href="javascript:void(0)" class="del" data-id="${res.data[i].id}">
                <span class="">×</span>
            </a>
        </td>
        <td class="product-thumbnail">
            <a href="javascript:void(0)">
                <img src="${res.data[i].goods.picture}" alt="Cart Thumbnail" style="width: 50px;height: 50px">
            </a>
        </td>
        <td class="product-name"><a href="javascript:void(0)">${res.data[i].goods.nameZh}</a></td>
        <td class="product-price"><span class="amount">$<span class="dj">${res.data[i].goods.price}</span></span>
        </td>
        <td class="quantity sl">${res.data[i].num}</td>
        <td class="product-subtotal"><span class="amount">$<span class="zj">${res.data[i].Total}</span></span>
        </td>
    </tr>`;
                        document.getElementById('box').innerHTML += s;
                    }
                    xiaoji();
                    zongjia();
                    var jia = document.querySelectorAll(".jia");
                    for (let i = 0; i < jia.length; i++) {
                        //给遍历的所有加号+添加了点击事件
                       // jia[i].onclick = function () {
                            // this.parentElement.previousElementSibling.value = parseInt(this.parentElement.previousElementSibling
                            //     .value) + +1;
                       // }
                       //  $(jia[i]).unbind('click').click(function () {
                       //      console.log(11)
                       //      xiaoji();
                       //      zongjia();
                       //  });
                    }
                    var jian = document.querySelectorAll(".jian");
                    for (let i = 0; i < jian.length; i++) {
                        //给遍历的所有减号-添加了点击事件
                        // jian[i].onclick = function () {
                        //     if (this.parentElement.nextElementSibling.value == 1) {
                        //         layer.msg("数量不能小于0");
                        //     } else {
                        //         // this.parentElement.nextElementSibling.value = parseInt(this.parentElement.nextElementSibling
                        //         //     .value) - +1;
                        //     }
                        //     xiaoji();
                        //     zongjia();
                        // }
                    }

                    var del = document.querySelectorAll(".del");
                    for (var i = 0; i < del.length; i++) {
                        del[i].onclick = function () {
                            var _this = this;
                            var id = _this.dataset.id;
                            console.log(id)
                            layer.confirm('您确定要删除吗?', function (index) {
                                $.ajax({
                                    url:HOST+"webapi/cart/removeGoods",
                                    data:{
                                        cartid:id,
                                        userId:localStorage.getItem("userId")
                                    },
                                    type:"get",
                                    headers:{"token":localStorage.getItem("token")},
                                    success:function (res) {
                                        if(res.code==200){
                                            layer.close(index);
                                            chashuju();
                                        }
                                    }
                                })

                            });
                        }
                    }

                }
            }
        })
    }
</script>
</body>

</html>