{include file="public/header"}
<div class="page-container p10">
    
    <div class="layui-tab">
        <ul class="layui-tab-title">
            <li class="layui-this">海报管理</li>
        </ul>
        <div class="layui-tab-content">
            <div class="layui-tab-item layui-show">
                
                <div class="layui-card">
                    <div class="layui-card-header">手动添加海报</div>
                    <div class="layui-card-body">
                        <form class="layui-form" id="add-poster-form">
                            <div class="layui-form-item">
                                <label class="layui-form-label">影片名称：</label>
                                <div class="layui-input-inline">
                                    <input type="text" name="movieName" required lay-verify="required" placeholder="请输入影片名称" autocomplete="off" class="layui-input">
                                </div>
                                <label class="layui-form-label">推荐等级：</label>
                                <div class="layui-input-inline">
                                    <select name="recommendLevel">
                                        <option value="9">9级(推荐)</option>
                                        <option value="8">8级</option>
                                        <option value="7">7级</option>
                                        <option value="6">6级</option>
                                        <option value="5">5级</option>
                                        <option value="4">4级</option>
                                        <option value="3">3级</option>
                                        <option value="2">2级</option>
                                        <option value="1">1级</option>
                                    </select>
                                </div>
                                <div class="layui-input-inline">
                                    <button class="layui-btn" lay-submit lay-filter="addPoster">添加海报</button>
                                </div>
                            </div>
                        </form>
                    </div>
                </div>
                
                <div class="layui-card">
                    <div class="layui-card-header">随机添加海报</div>
                    <div class="layui-card-body">
                        <form class="layui-form" id="random-add-form">
                            <div class="layui-form-item">
                                <label class="layui-form-label">分类筛选：</label>
                                <div class="layui-input-inline">
                                    <select name="typeId">
                                        <option value="0">全部分类</option>
                                        {volist name="types" id="vo"}
                                        <option value="{$vo.type_id}">{$vo.type_name}</option>
                                        {/volist}
                                    </select>
                                </div>
                                <label class="layui-form-label">添加数量：</label>
                                <div class="layui-input-inline">
                                    <input type="number" name="count" min="1" max="20" value="5" required lay-verify="required|number" class="layui-input">
                                </div>
                                <label class="layui-form-label">推荐等级：</label>
                                <div class="layui-input-inline">
                                    <select name="recommendLevel">
                                        <option value="9">9级(推荐)</option>
                                        <option value="8">8级</option>
                                        <option value="7">7级</option>
                                        <option value="6">6级</option>
                                        <option value="5">5级</option>
                                        <option value="4">4级</option>
                                        <option value="3">3级</option>
                                        <option value="2">2级</option>
                                        <option value="1">1级</option>
                                    </select>
                                </div>
                                <div class="layui-input-inline">
                                    <button class="layui-btn" lay-submit lay-filter="randomAdd">随机添加</button>
                                </div>
                            </div>
                        </form>
                    </div>
                </div>
                
                <div class="layui-card">
                    <div class="layui-card-header">推荐海报管理</div>
                    <div class="layui-card-body">
                        <div class="layui-btn-group">
                            <button type="button" class="layui-btn layui-btn-danger" id="cancel-all-btn">取消所有推荐</button>
                            <button type="button" class="layui-btn" id="cancel-selected-btn">取消所选推荐</button>
                        </div>
                        
                        <table class="layui-table" id="poster-table">
                            <thead>
                                <tr>
                                    <th width="40"><input type="checkbox" name="all" lay-skin="primary" lay-filter="allSelect"></th>
                                    <th width="50">ID</th>
                                    <th>影片名称</th>
                                    <th width="100">分类</th>
                                    <th width="80">推荐等级</th>
                                    <th width="120">操作</th>
                                </tr>
                            </thead>
                            <tbody id="poster-list">
                                <tr>
                                    <td colspan="6" align="center">加载中...</td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                </div>
                
            </div>
        </div>
    </div>
    
</div>
{include file="public/footer"}

<script type="text/javascript" src="__STATIC__/js/admin_common.js"></script>
<script type="text/javascript">
layui.use(['layer', 'form', 'table'], function() {
    var $ = layui.jquery;
    var layer = layui.layer;
    var form = layui.form;
    var table = layui.table;
    
    // 加载海报列表
    loadPosters();
    
    function loadPosters() {
        $.get('{:url("addon/haibao/api/posters")}', function(res) {
            if (res.code === 0) {
                renderPosterList(res.data);
            } else {
                $('#poster-list').html('<tr><td colspan="6" align="center">暂无数据</td></tr>');
            }
        });
    }
    
    function renderPosterList(data) {
        if (!data || data.length === 0) {
            $('#poster-list').html('<tr><td colspan="6" align="center">暂无数据</td></tr>');
            return;
        }
        
        var html = '';
        data.forEach(function(item) {
            html += '<tr>';
            html += '<td><input type="checkbox" name="ids[]" value="' + item.vod_id + '" lay-skin="primary"></td>';
            html += '<td>' + item.vod_id + '</td>';
            html += '<td>' + item.vod_name + '</td>';
            html += '<td>' + item.type_name + '</td>';
            html += '<td>' + item.vod_level + '</td>';
            html += '<td>';
            html += '<a class="layui-btn layui-btn-xs" href="javascript:;" onclick="viewPoster(\'' + item.vod_pic_slide + '\')">查看</a>';
            html += '<a class="layui-btn layui-btn-xs layui-btn-danger" href="javascript:;" onclick="cancelOne(' + item.vod_id + ')">取消</a>';
            html += '</td>';
            html += '</tr>';
        });
        
        $('#poster-list').html(html);
        form.render('checkbox');
    }
    
    // 添加海报
    form.on('submit(addPoster)', function(data) {
        layer.load();
        $.post('{:url("addon/haibao/api/add")}', data.field, function(res) {
            layer.closeAll('loading');
            if (res.code === 0) {
                layer.msg(res.msg, {icon: 1});
                loadPosters();
            } else {
                layer.msg(res.msg, {icon: 2});
            }
        });
        return false;
    });
    
    // 随机添加
    form.on('submit(randomAdd)', function(data) {
        layer.load();
        $.post('{:url("addon/haibao/api/random")}', data.field, function(res) {
            layer.closeAll('loading');
            if (res.code === 0) {
                layer.msg(res.msg, {icon: 1});
                loadPosters();
            } else {
                layer.msg(res.msg, {icon: 2});
            }
        });
        return false;
    });
    
    // 取消所有推荐
    $('#cancel-all-btn').click(function() {
        layer.confirm('确定要取消所有推荐吗？', function(index) {
            layer.close(index);
            layer.load();
            $.post('{:url("addon/haibao/admin/clear")}', function(res) {
                layer.closeAll('loading');
                if (res.code === 1) {
                    layer.msg(res.msg, {icon: 1});
                    loadPosters();
                } else {
                    layer.msg(res.msg, {icon: 2});
                }
            });
        });
    });
    
    // 取消选中推荐
    $('#cancel-selected-btn').click(function() {
        var ids = [];
        $('input[name="ids[]"]:checked').each(function() {
            ids.push($(this).val());
        });
        
        if (ids.length === 0) {
            layer.msg('请选择要取消的海报', {icon: 0});
            return;
        }
        
        layer.confirm('确定要取消选中的' + ids.length + '个推荐吗？', function(index) {
            layer.close(index);
            layer.load();
            $.post('{:url("addon/haibao/api/cancel")}', {ids: ids}, function(res) {
                layer.closeAll('loading');
                if (res.code === 0) {
                    layer.msg(res.msg, {icon: 1});
                    loadPosters();
                } else {
                    layer.msg(res.msg, {icon: 2});
                }
            });
        });
    });
    
    // 全选
    form.on('checkbox(allSelect)', function(data) {
        var checked = data.elem.checked;
        $('input[name="ids[]"]').prop('checked', checked);
        form.render('checkbox');
    });
});

// 查看海报
function viewPoster(url) {
    if (!url) {
        layer.msg('没有海报图片', {icon: 0});
        return;
    }
    
    layer.open({
        type: 1,
        title: '海报预览',
        content: '<div style="text-align:center;padding:20px;"><img src="' + url + '" style="max-width:100%;max-height:500px;"></div>',
        area: ['500px', '600px']
    });
}

// 取消单个推荐
function cancelOne(id) {
    layer.confirm('确定要取消该海报的推荐吗？', function(index) {
        layer.close(index);
        layer.load();
        $.post('{:url("addon/haibao/api/cancel")}', {ids: [id]}, function(res) {
            layer.closeAll('loading');
            if (res.code === 0) {
                layer.msg(res.msg, {icon: 1});
                loadPosters();
            } else {
                layer.msg(res.msg, {icon: 2});
            }
        });
    });
}
</script>