caimei365
/
caimei365-manager


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221
							<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="/WEB-INF/views/include/taglib.jsp"%>
<html>
<head>
    <title>订单列表</title>
    <meta name="decorator" content="default"/>
    <%--<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>--%>
    <style type="text/css">
        *{margin: 0;padding: 0}
        a{list-style: none;text-decoration: none}
        i{font-style: normal}
        body{background-color: rgb(228,228,228);}
        h3{line-height: 20px;padding:20px 0 20px 15px; border-bottom: 1px solid #CCCCCC;font-weight: normal}
        .body-margin{margin:0 26px;}
        .left-span{width: 3px;height: 20px;margin-right:10px;background-color: #00A6C7;display: inline-block;vertical-align: bottom}
        .info-list{background-color: #fff;padding: 15px 30px;}
        .list-div{font-size: 14px;margin-bottom: 15px;}
        .list-div label{display: inline-block;width: 70px;}
        .ship-shop{background-color: #fff;margin-top: 20px;min-height: 500px;}
        .table{width: 100%;border-collapse: collapse;}
        .table th{color: #000;font-weight: normal}
        .table th,.table td{width: 20%;height: 35px;border: 1px solid #CCCCCC;text-align: center;padding: 5px 0;}
        .select-all{}
        .select-all td{border: 0}
        .select-all label{display: inline-block;padding-left: 5px;vertical-align: 1px;}
        .mask{font-size: 14px;color: red;padding: 20px;}
        .select-ship{text-align: center;}
        .select-ship span{cursor: pointer; display: inline-block;width: 100px;line-height: 35px;text-align: center;border-radius: 5px; background-color: #00A6C7;color: #fff;}
        .select-ship span:last-child{margin-left: 20px;}
        .change-info{position: fixed;top: 20%;left: 50%;transform:translateX(-50%);z-index: 999;padding: 50px;background-color: #fff;box-shadow: 0px 0px 15px #ccc;}
        .close{position: absolute;right: -12px;top:-12px;cursor: pointer; display: block;background-color: #fff;text-align: center;font-size: 18px;border: 1px solid #ccc;width: 25px;height: 25px;border-radius: 50%;}
        .bj{position: fixed;width: 100%;height: 100%;bottom: 0;top:0;left: 0;z-index: 99;}
        .spilt{text-align: center;padding: 30px 50px 30px;}
        .orderspilt{padding: 0;text-align: center;border: 0;}
        .spilt-p{font-size: 14px;padding: 20px 0;}
        .cancel-div{display: inline-block;padding: 7px 15px;border-radius: 5px;background-color: #00A6C7;color: #fff;text-align: center}
        .whether-ship{position: fixed;top: 20%;left: 50%;transform:translateX(-50%);z-index: 999;padding: 20px;background-color: #fff;box-shadow: 0px 0px 15px #ccc;}
        .ship-title{font-size: 16px;border: 0;padding:20px 0 15px 0; }
        .waring-p{font-size: 14px;}
        .sign-logo{display: inline-block;width: 20px;height: 20px;border: 1px solid #000000;border-radius:50%;text-align: center;margin-right: 3px;}
        .status-span{text-align: center;margin: 15px 0;}
        .status-span span{display: inline-block;background-color: #00A6C7;padding: 7px 20px;color: #fff;cursor: pointer}
        .status-span span:nth-child(1){margin-right: 10px;}
        .status-span span:nth-child(2){margin-left: 10px;}
        .input{height: 100%;border: 0}
    </style>
    <script type="text/javascript">
        window.onload = function () {
            var all_ = document.getElementById('all');//全选
            var checked_ = document.getElementsByName('checked');//复选框
            var shipbtn_ = document.getElementsByClassName('ship_btn');//发货按钮
            var close_ = document.getElementsByClassName('close');//关闭按钮
            var splitbtn_ = document.getElementsByClassName('split-btn')//拆分订单
            var statusout_ = document.getElementsByClassName('status-out')//关闭
            var input_ = document.getElementsByClassName('input')//数量输入框

            for(var i=0;i<input_.length;i++){
                input_[i].onchange = function () {
                    var intval = this.value;
                    var buynum = this.parentNode.parentNode.getElementsByClassName('buy-num');//购买数量
                    console.log(intval)
                    console.log(buynum[0].innerHTML)
                    if(parseInt(intval) >=parseInt(buynum[0].innerHTML)){
                        document.getElementsByClassName('bj')[0].style.cssText = 'display:block';
                        document.getElementsByClassName('change-info')[0].style.cssText = 'display:block';
                        document.getElementsByClassName('change-info')[0].innerHTML = '请输入小于等于购买数量';
                        setTimeout(function () {
                            document.getElementsByClassName('bj')[0].style.cssText = 'display:none';
                            document.getElementsByClassName('change-info')[0].style.cssText = 'display:none';
                        },1000);
                        this.value = 0
                    }
                }
            }
            console.log(close_)
            //全选
            all_.onclick = function () {
                if(this.classList.contains('active')){
                    for(var i=0;i<checked_.length;i++){
                        checked_[i].checked=false;
                        all_.classList.remove("active");
                    }
                }else {
                    for(var i=0;i<checked_.length;i++){
                        checked_[i].checked=true;
                        all_.classList.add("active");
                    }
                }

            };

            shipbtn_[0].onclick = function () {
                flagcheckd();
                var ck = flagcheckd();
                if(ck){
                    document.getElementsByClassName('bj')[0].style.cssText = 'display:block';
                    document.getElementsByClassName('whether-ship')[0].style.cssText = 'display:block';
                }
            };
            splitbtn_[0].onclick =function () {
                flagcheckd();
                var ck = flagcheckd();
                console.log(ck);
                if(ck){
                    document.getElementsByClassName('bj')[0].style.cssText = 'display:block';
                    document.getElementsByClassName('spilt')[0].style.cssText = 'display:block';
                }

            };
            //关闭按钮
            for(var i=0;i<close_.length;i++){
                close_[i].onclick = function () {
                    document.getElementsByClassName('bj')[0].style.cssText = 'display:none';
                    this.parentNode.style.cssText = 'display:none';
                }
            }
            //关闭
            statusout_[0].onclick = function () {

                document.getElementsByClassName('bj')[0].style.cssText = 'display:none';
                document.getElementsByClassName('whether-ship')[0].style.cssText = 'display:none';
            }
        };
        //判断商品是否选中
        function flagcheckd() {
            var checked_ = document.getElementsByName('checked');//复选框
            var flag = false ;//标记判断是否选中一个
            for(var i=0;i<checked_.length;i++){
                if(checked_[i].checked){
                    flag = true ;
                    break ;
                }
            }
            if(!flag){
                document.getElementsByClassName('bj')[0].style.cssText = 'display:block';
                document.getElementsByClassName('change-info')[0].style.cssText = 'display:block';
                return false ;
            }else {
                return true
            }
        }
    </script>
</head>
<body>
<div class="bj" style="display: none"></div>
<%--未选择商品--%>
<div class="change-info" style="display: none">请至少选择一个商品<span class="close">x</span></div>
<%--拆分订单--%>
<div class="spilt change-info" style="display: none">
    <h3 class="orderspilt">订单拆分成功!</h3>
    <p class="spilt-p">按照您所勾选的商品进行拆单</p>
    <div class="cancel-div">确定</div>
    <span class="close">X</span>
</div>
<%--是否分批发货--%>
<div class="whether-ship" style="display: none">
    <h3 class="ship-title">您的发货数量小于购买数量，是否选择分批发货?</h3><%--根据状态判断--%>
    <p class="waring-p"><span class="sign-logo">!</span>选择分批发货，非到付订单，运费由卖家承担</p>
    <div class="status-span">
        <span class="status-out">否</span>
        <span onclick=" window.location.href='shipLogistic.jsp';">是</span>
    </div>
    <span class="close">x</span>
</div>
<div class="body-margin">
    <h3><span class="left-span"></span>订单列表--发货</h3>
    <div class="info-list">
        <div class="list-div">
            <label>收货人:</label>
            <span>没得看是考虑</span>
        </div>
        <div class="list-div">
            <label>手机号:</label>
            <span>180-2387-9878</span>
        </div>
        <div class="list-div">
            <label>收货地址:</label>
            <span>广东省-深圳市-福田区-上步南</span>
        </div>
        <div class="list-div">
            <label>买家留言:</label>
            <span>没得看是考虑</span>
        </div>
    </div>
    <div class="ship-shop">
        <table class="table">
            <tr class="select-all">
                <td><input id="all" type="checkbox"><label for="all">全选</label></td>
            </tr>
            <tr>
                <th>选择发货商品</th>
                <th>商品编号</th>
                <th>商品名称</th>
                <th>购买数量</th>
                <th>发货数量</th>

            </tr>
            <tr>
                <td><input name="checked" type="checkbox"></td>
                <td>1212dsd121</td>
                <td>的萨达萨达</td>
                <td class="buy-num">6</td>
                <td><input oninput="this.value=this.value.replace(/\D/g,'').replace(/^0+(?=\d)/,1)" class="input" type="text"/></td>
            </tr>
            <tr>
                <td><input name="checked" type="checkbox"></td>
                <td>1212dsd121</td>
                <td>的萨达萨达</td>
                <td class="buy-num">6</td>
                <td><input oninput="this.value=this.value.replace(/\D/g,'').replace(/^0+(?=\d)/,1)" class="input" type="text"/></td>
            </tr>
        </table>
        <p class="mask">备注：若订单中的商品，需要从另一仓库发货，或采美协助发货，可选择本地仓库可以发货的商品进行拆分订单。</p>
        <div class="select-ship">
            <span class="ship_btn">发货</span>
            <span class="split-btn">拆分订单</span>
        </div>
    </div>
</div>
</body>
</html>