{extend name="layout:home" /}
{block name="container"}
<div class="layui-tab layui-tab-card">
    <div class="layui-tab-content page-tab-content">
        <!-- 搜索框开始 -->
        <div class="search-form">
            <div class="layui-form-item">
                <div class="layui-inline">
                    <input type="text" class="layui-input" name="timeRang" id="timeRang" placeholder="{:lang('time_rang')}"
                           style="width: 170px;">
                </div>
                <div class="layui-inline">
                    <label>{:lang('if_expire')}</label>
                    <select name="type" id="type" lay-verify="" class="layui-select layui-unselect layui-form-select">
                        <option value="">请选择</option>
                        <option value="0">未读</option>
                        <option value="1">已读</option>
                    </select>
                </div>
                <div class="layui-inline">
                    <button type="submit" class="layui-btn search-subBtn" onclick="showCurrent()">{:lang('search')}</button>
                </div>
            </div>
        </div>
        <table class="layui-table lay-even">
            <colgroup>
                <col width="60">
                <col width="200">
                <col width="80">
                <col width="60">
                <col width="50">
                <col>
            </colgroup>
            <thead>
            <tr>
                <th>标题</th>
                <th>内容</th>
                <th>创建时间</th>
                <th>读取状态</th>
                <th>详情</th>
            </tr>
            </thead>
            <tbody>
            {if count($usermessage)}
            {volist name="usermessage" id="message"}
            <tr>
                <td>{$message.userMessage_title}</td>
                <td>{$message.userMessage_content}</td>
                <td>{$message.userMessage_create}</td>
                <td>{$message.userMessage_status}</td>
                <td class="align-center">
                    <div style="text-align: center;">
                        <a href="/User/Message/detail.html?{$message.userMessage_id}" class="layui-btn layui-btn-xs">详情</a>
                        <!--<a href="" class="layui-btn layui-btn-xs layui-btn-danger">审核</a>-->
                    </div>
                </td>
            </tr>
            {/volist}
            {else}
            <td colspan="99" style="text-align: center">无数据</td>
            {/if}
            </tbody>
        </table>
        {$show_page}
    </div>
</div>
<script>
    const myHost = "http://" + window.location.host;
    function showCurrent() {
        let timeRang = $("#timeRang").val();
        let type = $("#type").val();
        console.log(type);
        window.location.href = myHost + "/User/message/index.html?timeRang=" + timeRang + "&type=" + type;
        //window.location.href = myHost + "/User/message/index.html?timeRang=" + timeRang;
    }
    layui.use('laydate', function(){
        var laydate = layui.laydate;

        //执行一个laydate实例
        laydate.render({
            elem: '#creatTime' //指定元素
        });
        laydate.render({
            elem:'#timeRang',
            range:true,
            format: 'yyyy/MM/dd',
            done: function(value, date){
                /* 时间选择完成后的回调 */
            }
        })
    });
</script>
{/block}