screen/application/sub/view/order/mobile.html

{extend name="layout/sub"/}
{block name='css'}
<link rel="stylesheet" href="__SUB__/css/news.css" media="all" />
{/block}
{block name='body'}
<blockquote class="layui-elem-quote news_search">
    <form method="get" action="">
        <div class="layui-inline">
            <label>归属地</label>
            <div class="layui-input-inline">
                {include file="layout/area"/}
            </div>
        </div>
        <div class="layui-inline">
            <label>运营商</label>
            <div class="layui-input-inline">
                <select name="network" class="layui-select">
                    <option value="">全部</option>
                    {foreach name='network' item='a'}
                    <option value="{$a.id}" {:$a.id==input('network')?'selected':''}>{$a.name}</option>
                    {/foreach}
                </select>
            </div>
        </div>
        <div class="layui-inline">
            <button class="layui-btn search_btn">查询</button>
            <button class="layui-btn reset-btn" type="button">重置</button>
        </div>
    </form>
</blockquote>
<div class="layui-form news_list">
    <table class="layui-table">
        <thead>
        <tr>
            <th width="10"><input type="checkbox" lay-skin="primary" lay-filter="allChoose" id="allChoose"></th>
            <th width="20">ID</th>
            <th width="100">手机号</th>
            <th>网络</th>
            <th>归属地</th>
            <th width="100">套餐</th>
            <th>售价</th>
            <th>底价</th>
            <th>预充</th>
            <th>预占</th>
            <th>更新时间</th>
            <th>操作</th>
        </tr>
        </thead>
        <tbody class="news_content">
        {foreach name="list" item="a"}
        <tr>
            <th><input type="checkbox" lay-skin="primary" class="choose" lay-filter="choose" value="{$a.id}"></th>
            <td>{$a.id}</td>
            <td>{$a.no}</td>
            <td>{$a.network}</td>
            <td>{$a.province}/{$a.city}</td>
            <td>{$a.info.describe}</td>
            <td>{$a.amount_base}</td>
            <td>{$a.amount_di}</td>
            <td>{$a.amount_charge}</td>
            <td>
                <input type="checkbox" value="{$a.id}" name="is_hold" class="hold-change" lay-filter="holdChange" lay-skin="switch" lay-text="开启|关闭" {$a.is_hold?'checked':''}>
            </td>
            <td>
                {:date('Y-m-d H:i:s',$a.update_time)}
            </td>
            <td>
                <a class="layui-btn layui-btn-mini news_edit" data-id="{$a.id}"><i class="iconfont icon-edit"></i> 编辑</a>
                <a class="layui-btn layui-btn-mini hold_log" data-id="{$a.id}"><i class="iconfont icon-weather"></i> 预占记录</a>
                <a class="layui-btn layui-btn-danger layui-btn-mini news_del" data-id="{$a.id}"><i class="layui-icon">&#xe640;</i> 删除</a>
            </td>
        </tr>
        {/foreach}
        </tbody>
    </table>
</div>
<div id="page">
    {$list->render()}
</div>
{/block}
{block name='js'}

<script>
    layui.config({
        base : "__SUB__/js/"
    }).use(['form','layer','jquery','laypage'],function(){
        var form = layui.form(),
            layer = parent.layer === undefined ? layui.layer : parent.layer,
            laypage = layui.laypage,
            $ = layui.jquery;


        //查询
        $(".search_btn").click(function(){
            var newArray = [];
        })

        //添加文章
        //改变窗口大小时，重置弹窗的高度，防止超出可视区域（如F12调出debug的操作）
        $(window).one("resize",function(){
            $(".newsAdd_btn").click(function(){
                var index = layui.layer.open({
                    title : "添加文章",
                    type : 2,
                    content : "newsAdd.html",
                    success : function(layero, index){
                        setTimeout(function(){
                            layui.layer.tips('点击此处返回文章列表', '.layui-layer-setwin .layui-layer-close', {
                                tips: 3
                            });
                        },500)
                    }
                })
                layui.layer.full(index);
            })
        }).resize()


        //批量删除
        $(".batchDel").click(function(){
            var $checkbox = $('.news_list tbody .choose');
            var $checked = $('.news_list tbody .choose:checked');
            if($checkbox.is(":checked")){
                layer.confirm('确定删除选中的信息？',{icon:3, title:'提示信息'},function(index){
                    var index = layer.msg('删除中，请稍候',{icon: 16,time:false,shade:0.8});
                    setTimeout(function(){
                        //删除数据
                        for(var j=0;j<$checked.length;j++){
                            for(var i=0;i<newsData.length;i++){
                                if(newsData[i].newsId == $checked.eq(j).parents("tr").find(".news_del").attr("data-id")){
                                    newsData.splice(i,1);
                                    newsList(newsData);
                                }
                            }
                        }
                        $('.news_list thead input[type="checkbox"]').prop("checked",false);
                        form.render();
                        layer.close(index);
                        layer.msg("删除成功");
                    },2000);
                })
            }else{
                layer.msg("请选择需要删除的文章");
            }
        })

        //全选
        form.on('checkbox(allChoose)', function(data){
            var child = $(data.elem).parents('table').find('tbody .choose');
            child.each(function(index, item){
                item.checked = data.elem.checked;
            });
            form.render('checkbox');
        });

        //通过判断文章是否全部选中来确定全选按钮是否选中
        form.on("checkbox(choose)",function(data){
            var child = $(data.elem).parents('table').find('tbody input.choose');
            var childChecked = $(data.elem).parents('table').find('tbody input.choose:checked')
            if(childChecked.length == child.length){
                $(data.elem).parents('table').find('thead input#allChoose').get(0).checked = true;
            }else{
                $(data.elem).parents('table').find('thead input#allChoose').get(0).checked = false;
            }
            form.render('checkbox');
        })

        //预占
        form.on('switch(holdChange)', function(data){
            let open=data.elem.checked,
                _this=this
            var index = layer.msg('修改中，请稍候',{icon: 16,time:5000,shade:0.1});
            $.post('{:url("mobile/hold")}',{is_hold:open?1:0,id:_this.value},function (res) {
                if(res.code===0){
                    layer.alert(res.msg)
                    _this.checked=!open
                    form.render('checkbox')
                }else{
                    layer.close(index)
                    layer.msg('修改成功')
                    //location.reload()
                }
            })
        })

        //操作
        $("body").on("click",".news_edit",function(){  //编辑
            let id=$(this).data('id')
            let index = layui.layer.open({
                title : "编辑",
                type : 2,
                area:['800px','500px'],
                content : '{:url("mobile/edit")}?id='+id,
                success : function(layero, index){
                }
            })
        })

        $('.hold_log').click(function () {
            let id=$(this).data('id')
            let index = layui.layer.open({
                title : "预占记录",
                type : 2,
                area:['1000px','100%'],
                content : '{:url("mobile/hold_log")}?id='+id,
                success : function(layero, index){
                }
            })
        })
        $('.reset-btn').click(function (){
            location.replace(location.pathname)
        })


        $("body").on("click",".news_del",function(){  //删除
            var _this = $(this);
            layer.confirm('确定删除此信息？',{icon:3, title:'提示信息'},function(index){
                $.post("{:url('mobile/delete')}",{id:[_this.data('id')]},function (res){
                    if(res.code===1){
                        layer.msg('删除成功')
                    }else{
                        layer.msg(res.msg)
                    }
                    layer.close(index);
               })
            });
        })
    })

</script>
{/block}