{{extends "/admin/common/base_content"}}

{{block title()}}单页管理 - Doak CMS{{end}}

{{block body()}}

<style>
.nodata {
    text-align: center;
    padding: 15px;
    color: #c0c3c5;
}
.table tr {
    vertical-align: middle;
}
.table thead tr {
    background: #ebeff1;
}
</style>
<div class="container-fluid pt-4 px-4">
    <div class="row g-4">
    
        <div class="col-sm-12 col-xl-12">
            <div class="bg-light rounded h-100 p-4">
                <h6 class="mb-4">条件搜索</h6>
                
                <form method="get">
                    <div class="row">
                        <div class="col-auto">
                            <div class="input-group my-1">
                                <span class="input-group-text" id="input-keywords">关键字</span>
                                <input type="text" 
                                    name="keywords"
                                    value="{{ keywords }}"
                                    class="form-control" 
                                    placeholder="" 
                                    aria-label="keywords" 
                                    aria-describedby="input-keywords">
                            </div>
                        </div>
                        
                        <div class="col-auto">
                            <div class="input-group my-1">
                                <span class="input-group-text" id="input-status">状态</span>
                                <select name="status"
                                    class="form-select" 
                                    aria-label="status"
                                    aria-describedby="input-status"
                                >
                                    <option value="">全部</option>
                                    <option value="1" {{if status== "1"}}selected=""{{end}}>启用</option>
                                    <option value="0" {{if status== "0"}}selected=""{{end}}>禁用</option>
                                </select>
                            </div>
                        </div>
                        
                        <div class="col-auto">
                            <button type="submit" 
                                class="btn btn-primary my-1"
                            >
                                <i class="fa fa-search me-2"></i>
                                搜 索
                            </button>
                        </div>
                    </div>
                    
                </form>
            </div>
        </div>
        
        <div class="col-sm-12 col-xl-12">
        
            <div class="bg-light rounded h-100 p-4">
                <h6 class="mb-4">
                    单页管理
                    <a href='{{ adminUrl("page/add") }}' class="ms-1" title="添加单页">
                        <i class="fa fa-plus-circle"></i>
                    </a>
                </h6>
                
                <div class="table-responsive">
                    <table class="table table-bordered table-hover">
                        <thead>
                            <tr>
                                <th scope="col" class="text-center">#</th>
                                <th scope="col">标题</th>
                                <th scope="col" class="text-center">状态</th>
                                <th scope="col">添加时间</th>
                                <th scope="col" class="text-center">操作</th>
                            </tr>
                        </thead>
                        
                        <tbody>
                            {{ range index, value := list }} 
                                <tr>
                                    <th scope="row" width="50" class="text-center">
                                        {{ value.Id }}
                                    </th>
                                    <td>
                                        <div class="page-slug mb-1" title="单页标识">
                                            <span class="badge bg-primary">
                                                {{ value.Slug }}
                                            </span>
                                        </div>
                                        
                                        <div class="page-title">
                                            {{ value.Title }}
                                        </div>
                                    </td>
                                    <td width="85" class="text-center">
                                        {{if value.Status == 1 }}
                                            <span class="badge bg-success">启用</span>
                                        {{else}}
                                            <span class="badge bg-danger">禁用</span>
                                        {{end}}
                                    </td>
                                    <td width="165">
                                        {{ createTime(value.AddTime).DateTimeString() }}
                                    </td>
                                    <td width="155" class="text-center">
                                        <a class="btn btn-primary btn-sm" 
                                            href='{{ adminUrl("page/"+value.Id+"/edit") }}'
                                        >
                                            <i class="fa fa-edit"></i>
                                            编辑
                                        </a>
                                        
                                        <a href="javascript:;" 
                                            class="btn btn-danger btn-sm js-delete-btn"
                                            data-url='{{ adminUrl("page/"+value.Id+"/delete") }}'
                                        >
                                            <i class="fa fa-times"></i>
                                            删除
                                        </a>
                                    </td>
                                </tr>
                            {{ else }} 
                                <tr>
                                    <td colspan="5">
                                        <div class="nodata">
                                            无数据
                                        </div>
                                    </td>
                                </tr>
                            {{ end }}
                            
                        </tbody>
                    </table>
                </div>
                
                <nav aria-label="Page navigation example">
                    {{ pageHtml|raw }}
                </nav>

            </div>

        </div>
    </div>
</div>

{{end}}

{{block script_after()}}
<script type="3029259e35d7bc1c98cd40a8-text/javascript">
(function($) {
    "use strict";
    
    $(".sidebar-page-index").addClass("active");
    
    // 删除
    $('.js-delete-btn').click(function() {
        var url = $(this).data('url');
        
        layer.confirm('您确定要删除该单页吗？', {
            offset: 'c',
            btn: ['确定', '取消']
        }, function(index){
            $.post(url, {}, function(data) {
                if (data.code == 0) {
                    layer.msg(data.message, {
                        offset: 'c',
                        icon: 1
                    });

                    setTimeout(function() {
                        location.reload();
                    }, 2000);
                } else {
                    layer.msg(data.message, {
                        offset: 'c',
                        icon: 2
                    });
                }
            });
        });
    });

})(jQuery);
</script>
{{end}}