{extend name="layout/content" /} {block name="header"}

<link rel="stylesheet" href="__STATIC__/css/admin/bootstrap.min.css">
<link rel="stylesheet" href="__STATIC__/css/admin/bootstrap-table.css">
<!--<link rel="stylesheet" href="__STATIC__/css/admin/bootstrap-editable.css">-->
<!--<link rel="stylesheet" href="__STATIC__/css/FuzzySearch.css?v={$Think.STATIC_VERSION}">-->
<!--<link rel="stylesheet" href="__STATIC__/js/select2/css/select2.min.css" type="text/css"/>-->
<!--<link rel="stylesheet" href="__STATIC__/js/select2/css/select2-bootstrap.min.css" type="text/css"/>-->
<!--<link rel="stylesheet" href="__STATIC__/css/viewer.min.css" type="text/css"/>-->

<title>分享礼包管理</title>
<style>

    .layui-layer.layui-layer-page.layer-anim .layui-table td:nth-child(2n) {
        text-align: left !important;
    }

    .layui-form-item .layui-input-inline {
        float: unset;
        width: 190px;
        margin-right: 10px;
    }

    .x-so {
        text-align: unset;
        margin-bottom: 0px;
    }

    .fl_r {
        float: right;
    }

    .frozen {
        color: orangered;
    }

    .normal {
        color: green;
    }

    .layui-form-label {
        display: inline-block;
        float: unset;
        text-align: center;
    }

    .separate {
        display: inline-block;
        float: unset;
        width: 15px;
        padding-top: 12px;
        margin-right: 7px;
        margin-left: 0px;

    }

    .layui-form-item .layui-input-inline {
        float: unset;
        width: 190px;
        margin-right: 10px;
    }

    .tip {
        display: inline-block;
        width: 14px;
        height: 14px;
        background: black;
        color: white;
        border-radius: 50%;
        text-align: center;
        line-height: 16px;
        font-weight: 700;
    }

    .tip:hover {
        cursor: pointer;
    }

    .red {
        color: red;
    }
    a:hover {
        text-decoration: none;
    }

    a:hover span {
        color: red !important;
    }

    .toolWrap {
        /*height: 50px;*/
    }

    .margin-top-10{
        margin-top: 10px;
    }

    .hide {
        display: none;
    }

    .setWidth{
        width:230px !important;
    }

    #objTable td,#objTable th{
        vertical-align: inherit;
        text-align: center;
    }

    .detail-view td{
        text-align: left !important;
    }
    .layui-input{
        display: inline-block;
        width: 190px;
    }

    .mgt_10{
        margin-top: 10px;
    }

    .pager-container .layui-input {
        width: 80px;
    }   

</style>
{/block} {block name="content"}
<div class="x-body">

        <form class="layui-form">


            <div style="float:left">
                <a href="{:url('add')}" class="layui-btn layui-btn-radius">
                    <i class="layui-icon">&#xe654;</i>新增
                </a>
            </div>


            <div style="float:right;margin-bottom:10px;">

            <div class="layui-inline">
                <label class="layui-form-label">礼包名：</label>
                <div class="layui-input-inline">
                    <input class="layui-input" placeholder="请输入标题" id="name" name="name" value="{:input('name')}">
                </div>
            </div>

            <div class="layui-inline">
                <label class="layui-form-label">文章名：</label>
                <div class="layui-input-inline">
                    <input class="layui-input" placeholder="请输入标题" id="title" name="title" value="{:input('title')}">
                </div>
            </div>

            <div class="layui-inline">
                <label class="layui-form-label" style="width:90px">使用次数：</label>
                <div class="layui-input-inline">
                    <select name="usetype" id="usetype" lay-search>
                        <option value=""> - 请选择使用次数 - </option>
                        <option value="1" {if condition="1 eq input('usetype')"} selected="selected"{/if}>一次</option>
                        <option value="2" {if condition="2 eq input('usetype')"} selected="selected"{/if}>无限次</option>
                    </select>
                </div>
            </div>

            <div class="layui-inline">
                <label class="">创建时间：</label>
                <div class="layui-input-inline">
                    <input class="layui-input" placeholder="开始时间" name="cr_start" id="cr_start" readonly='readonly' value="{$Request.get.cr_start}" autocomplete="off">
                </div>
                <span>-</span>
                <div class="layui-input-inline">
                    <input class="layui-input" placeholder="结束时间" name="cr_end" id="cr_end" readonly='readonly' value="{$Request.get.cr_end}" autocomplete="off">
                </div>
            </div>

            <div class="layui-inline">
                <button class="layui-btn" lay-submit id="J_search_submit">查询</button>
            </div>





        </div>

        <div style="clear:both"></div>
        <!-- data-toolbar="#toolbar" -->

            <table id="objTable" data-detail-view="true" data-detail-formatter="detailFormatter">
                    <thead>
                    <tr>
                        <th>礼包名</th>
                        <th>文章名</th>
                        <th>使用次数</th>
                        <th>创建时间</th>
                        <th class="setWidth">操作</th>
                        <th class="hide"></th>
                        <th class="hide"></th>
                        <th class="hide"></th>
                    </tr>
                    </thead>
                    <tbody id="tbody">
                    {notempty name="list"} {volist name="list" id="vo"}
                    <tr>
                        <td>{$vo.name}</td>
                        <td>{$vo.title}</td>

                        <td>
                            {switch name="vo.usetype"}
                            {case value="1"}一次{/case}
                            {case value="2"}无限次{/case}
                            {default /}
                            {/switch}
                        </td>

                        <td>{:isset($vo.create_time)?date('Y-m-d H:i:s',$vo.create_time) : ""}</td>
                        <td class="setWidth">
                            <a title="编辑" href="{:url('edit',['id'=>$vo.id])}" class="layui-btn layui-btn-normal edit">
                                <i class="layui-icon">&#xe63c;</i>编辑
                            </a>
            
                            <a href="javascript:;" onclick="ajaxDeletePack('{:url(\'del\',[\'id\'=>$vo.id])}')" class="layui-btn  layui-btn-danger">
                                <i class="layui-icon">&#xe640;</i>删除</a>
                        </td>

                        <td></td>
                        <td>分享后回复内容：{$vo.response}</td>
                        <td>备注：{$vo.remark}</td>

                    </tr>
                    {/volist} {/notempty}
            
                    </tbody>
                </table>

                <div class="pager-container" style="margin-top:10px;">
                    <span>
                        {$list->total()}条记录
                    </span>
                    {$page}
                    <div class="layui-inline" style="margin:0;margin-left:10px;width:80px">
                        <input type="text" style="height: 30px;" class="layui-input" placeholder="跳转至" name="page" onkeyup="value=value.replace(/^(0+)|[^\d]+/g,'')">
                    </div>
                </div>

        </form>


</div>

{/block} {block name="footer"}

<script type="text/javascript" src="__STATIC__/js/admin/bootstrap.min.js"></script>
<!--<script type="text/javascript" src="__STATIC__/js/admin/bootstrap-editable.min.js"></script>-->
<script type="text/javascript" src="__STATIC__/js/admin/bootstrap-table.js"></script>
<script type="text/javascript">

    //要使用js渲染表格，不能用属性渲染，否则bootstrap-editable出不来
    var $table = $('#objTable');
    // $table.bootstrapTable({});
    $table.bootstrapTable({
        formatNoMatches: function () {
            return "暂无数据";
        }
    });

    layui.use(['form', 'laydate'], function () {
        var laydate = layui.laydate;
        var form = layui.form;

        var on_starttime = laydate.render({
            elem: '#on_start',
            type: 'date',
            format: 'yyyy-MM-dd',
            done: function (value, dates) {
                on_endtime.config.min = {
                    year: dates.year,
                    month: dates.month - 1, //关键
                    date: dates.date,
                    hours: 0,
                    minutes: 0,
                    seconds: 0
                };
            }
        });
        var on_endtime = laydate.render({
            elem: '#on_end',
            type: 'date',
            format: 'yyyy-MM-dd',
            done: function (value, dates) {
                on_starttime.config.max = {
                    year: dates.year,
                    month: dates.month - 1, //关键
                    date: dates.date,
                    hours: 0,
                    minutes: 0,
                    seconds: 0
                }
            }
        });
        var cr_starttime = laydate.render({
            elem: '#cr_start',
            type: 'date',
            format: 'yyyy-MM-dd',
            done: function (value, dates) {
                cr_endtime.config.min = {
                    year: dates.year,
                    month: dates.month - 1, //关键
                    date: dates.date,
                    hours: 0,
                    minutes: 0,
                    seconds: 0
                };
            }
        });
        var cr_endtime = laydate.render({
            elem: '#cr_end',
            type: 'date',
            format: 'yyyy-MM-dd',
            done: function (value, dates) {
                cr_starttime.config.max = {
                    year: dates.year,
                    month: dates.month - 1, //关键
                    date: dates.date,
                    hours: 0,
                    minutes: 0,
                    seconds: 0
                }
            }
        });

    })


    function detailFormatter(index, row) {
        // console.log(row);
        var html = [];

        var obj = {
            0:"",//checkbox要算入
            1: "礼包名",
            2: "回复内容",
            3:"使用次数",
            4: "创建时间",
            5: "操作",
            6: "分享后回复内容",
            7: "备注",



        }

        $.each(row, function (key, value) {
          
            if (key > 5) {
                html.push('<p><b></b> ' + value + '</p>');
            } else {
                html.push('<p class="hide"><b></b> ' + value + '</p>');
            }


        });
        return html.join('');
    }





   






    $(".download").click(function () {
        $.ajax({
            type: "post",
            url: "{:url('downPoint')}",
            async: false,
            data: $('.layui-form').serialize(),
            dataType: 'json',
            timeout: 5000,
            success: function (data) {
                if (data['code']) {
                    layer.alert(data['msg']);
                } else {
                    layer.alert(data['msg']);
                }
            },
            error: function () {
                layer.alert('网络错误，请重试');
            },
        });
    })

    $(".download_1").click(function () {
        $.ajax({
            type: "post",
            url: "{:url('downPointBySelf')}",
            async: false,
            data: $('.layui-form').serialize(),
            dataType: 'json',
            timeout: 5000,
            success: function (data) {
                if (data['code']) {
                    layer.alert(data['msg']);
                } else {
                    layer.alert(data['msg']);
                }
            },
            error: function () {
                layer.alert('网络错误，请重试');
            },
        });
    })


    function ajaxDeletePack(url) {

        //询问框
        layer.confirm('是否确定删除？', {
            btn: ['是','否'] //按钮
        }, function(){
            $.ajax({
                type: "post",
                url: url,
                async: false,
                data: '',
                dataType: 'json',
                timeout: 5000,
                success: function (data) {
                    if (data['code']) {
                        window.location.reload();
                    }else {
                        layer.alert(data['msg']);
                    }
                },
                error: function () {
                    layer.alert('网络错误，请重试');
                }
            });
        }, function(){});
    }
        




</script>
{/block}