<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
    <head th:replace="~{admin/include::head}">
    </head>
    
    <body style="background-color: #f2f2f2">
        <ul th:replace="~{admin/include::nav}"></ul>
        
        <div class="manage-body">
            <div>
            <h2 class="manage-title"><b th:text="${manageTitle}">文章列表</b><a href="./edit" class="operate">新增</a></h2>
            
            </div>
            <button class="layui-btn layui-btn-sm operdown">
               <span>选中项<i class="layui-icon layui-icon-sm layui-icon-triangle-d"></i></span>
           </button>
            <div>
                <table class="layui-table" id="posts" lay-filter="posts">
                </table>
            </div>
        </div>
        <div th:replace="~{admin/include::feet}"></div>
        <script type="text/html" id="titleTpl">
            <a href="./edit?postId={{d.postId}}" title="编辑 {{d.title}}">{{d.title}}</a>
            
            
            <a class="external-link" target="_blank" href="{{d.link}}" title="浏览 {{d.title}}">
               <i class="fa fa-external-link-alt"></i>
            </a>
        </script>
        <th:block th:replace="~{admin/include::head-script}"></th:block>
        <script th:inline="javascript">
            layui
            .use(['table', 'dropdown', 'layer'], function(){
            	var dropdown = layui.dropdown, table = layui.table,
            	fileTypes = {
                    OTHER: "其他",
                    IMAGE: "图片",
                    ARCHIVE: "压缩文件",
                    DOCUMENT: "文档",
                    MEDIA: "媒体文件",
                    APPLICATION: "应用程序"
                };
            	table.render({
                    elem: '#posts',
                    url:'./asset/list', 
                    page:true, skin:'line',
                    cols: [ [
                        {type:'checkbox'},
                        {field:'title', minWidth: 300, templet:'#titleTpl', title: '标题'},
                        {field:'path', title: '路径'},
                        {field:'fileType', width:58, title: '类型', templet: (d) => {
                            return fileTypes[d.fileType];
                        }},
                        {field:'createTime', title: '时间'}
                    ]]
                });
            	dropdown.render({
            	    elem: '.operdown',
            	    data: [
            	    	{title: '删除', op: null}, 
            	    	{title: '设为公开', op: 'RELEASED'}, 
                        {title: '设为私密', op: 'PRIVATE'},
                        {title: '设为草稿', op: 'DRAFT'},
            	    	{title: '设为隐藏', op: 'HIDDEN'}],
            	    click: function (data, othis){
            	    	var checked = layui.table.checkStatus('posts'), postIds = [];
            	    	if (!checked.data.length) {
            	    		layui.layer.msg('未选中任何项', {time: 1000});
            	    		return;
            	    	}
            	    	$.each(checked.data, function (i, post){
            	    		postIds.push(post.postId);
            	    	});
            	    	
            	    	$.ajax({
            	    		url: '/admin/v2/post/batchOp',
            	    		method: 'POST',
            	    		data: {
            	    			ids: postIds,
            	    			op: data.op
            	    		},
            	    		success: function () {
                                layer.msg('批量操作成功', {
                                    offset: '15px',
                                    icon: 1,
                                    time: 1000
                                    }, 
                                    function() {
                                        layui.table.reload('posts',{
                                            page: {
                                              curr: $(".layui-laypage-em").next().html() //当前页码值
                                            },
                                            categoryId : [[${categoryId == null? 'null' : categoryId}]],
                                            tagId : [[${tagId == null? 'null' : tagId}]]
                                        });
                                    }
                                )
            	    		},
            	    		error: function (res) {
            	    			var r = res.responseJSON;
                                layer.msg(r&&r.data||'服务器错误', {
                                    offset: '15px',
                                    icon: 2,
                                    time: 2000
                                });
                                return
            	    		}
            	    	})
            	    }
        	    });
            })
        </script>
    </body>

</html>