{extend name="admin@public/base" /}

{block name="title"}{:lang('AI Content Assistant - Dashboard')}{/block}

{block name="content"}
<div class="row">
    <div class="col-xs-12">
        <div class="panel panel-default">

            <!-- Stats Row -->
            <div class="panel-heading">
                <h3 class="panel-title">
                    <i class="fa fa-magic"></i> {:lang('AI Content Assistant')}
                    <a href="{:addon_url('aicontent/admin/generate')}" class="btn btn-primary btn-sm pull-right">
                        <i class="fa fa-plus"></i> {:lang('New Generation')}
                    </a>
                </h3>
            </div>

            <div class="panel-body">
                <div class="row text-center" style="margin-bottom:20px">
                    <div class="col-xs-3">
                        <div class="panel panel-default">
                            <div class="panel-body">
                                <h2 class="text-primary">{$stats.total}</h2>
                                <p class="text-muted">{:lang('Total Tasks')}</p>
                            </div>
                        </div>
                    </div>
                    <div class="col-xs-3">
                        <div class="panel panel-default">
                            <div class="panel-body">
                                <h2 class="text-success">{$stats.done}</h2>
                                <p class="text-muted">{:lang('Completed')}</p>
                            </div>
                        </div>
                    </div>
                    <div class="col-xs-3">
                        <div class="panel panel-default">
                            <div class="panel-body">
                                <h2 class="text-warning">{$stats.pending}</h2>
                                <p class="text-muted">{:lang('Pending')}</p>
                            </div>
                        </div>
                    </div>
                    <div class="col-xs-3">
                        <div class="panel panel-default">
                            <div class="panel-body">
                                <h2 class="text-danger">{$stats.error}</h2>
                                <p class="text-muted">{:lang('Errors')}</p>
                            </div>
                        </div>
                    </div>
                </div>

                <!-- Task History Table -->
                <table class="table table-striped table-hover table-condensed">
                    <thead>
                        <tr>
                            <th>{:lang('ID')}</th>
                            <th>{:lang('Content')}</th>
                            <th>{:lang('Type')}</th>
                            <th>{:lang('Provider / Model')}</th>
                            <th>{:lang('Status')}</th>
                            <th>{:lang('Created')}</th>
                            <th>{:lang('Actions')}</th>
                        </tr>
                    </thead>
                    <tbody>
                        {volist name="tasks" id="task"}
                        <tr>
                            <td>{$task.id}</td>
                            <td>
                                <span title="{$task.content_name|htmlspecialchars}">{:mb_strimwidth(htmlspecialchars($task['content_name']), 0, 40, '...')}</span>
                                {if $task.content_id > 0}
                                    <small class="text-muted">(ID:{$task.content_id})</small>
                                {/if}
                            </td>
                            <td>
                                {if $task.content_type == 'video'}
                                    <span class="label label-primary">{:lang('Video')}</span>
                                {elseif $task.content_type == 'article'}
                                    <span class="label label-info">{:lang('Article')}</span>
                                {else}
                                    <span class="label label-default">{$task.content_type|htmlspecialchars}</span>
                                {/if}
                            </td>
                            <td>
                                <small>{$task.provider|htmlspecialchars} / {$task.model|htmlspecialchars}</small>
                            </td>
                            <td>
                                {if $task.status == 1}
                                    <span class="label label-success">{:lang('Done')}</span>
                                {elseif $task.status == 2}
                                    <span class="label label-danger" title="{$task.error_msg|htmlspecialchars}">{:lang('Error')}</span>
                                {else}
                                    <span class="label label-warning">{:lang('Pending')}</span>
                                {/if}
                            </td>
                            <td><small>{$task.created_at}</small></td>
                            <td>
                                {if $task.status == 1}
                                    <a href="{:addon_url('aicontent/admin/view', ['id'=>$task['id']])}" class="btn btn-xs btn-info">
                                        <i class="fa fa-eye"></i> {:lang('View')}
                                    </a>
                                {/if}
                                <a href="javascript:void(0)"
                                   class="btn btn-xs btn-danger btn-delete"
                                   data-id="{$task.id}"
                                   data-url="{:addon_url('aicontent/admin/delete')}">
                                    <i class="fa fa-trash"></i>
                                </a>
                            </td>
                        </tr>
                        {/volist}
                        {if empty($tasks)}
                        <tr>
                            <td colspan="7" class="text-center text-muted">{:lang('No tasks yet. Click "New Generation" to get started.')}</td>
                        </tr>
                        {/if}
                    </tbody>
                </table>

                <!-- Simple pagination -->
                {if $total > 20}
                <div class="text-center">
                    <a href="?page={$page - 1}" class="btn btn-default btn-sm {if $page <= 1}disabled{/if}">{:lang('Prev')}</a>
                    <span class="text-muted">{:lang('Page')} {$page}</span>
                    <a href="?page={$page + 1}" class="btn btn-default btn-sm {if count($tasks) < 20}disabled{/if}">{:lang('Next')}</a>
                </div>
                {/if}
            </div>
        </div>
    </div>
</div>

<script>window.AI_LANG = {$jsLang|raw};</script>
<script>
document.querySelectorAll('.btn-delete').forEach(function(btn) {
    btn.addEventListener('click', function() {
        var confirmMsg = (window.AI_LANG && window.AI_LANG.delete_confirm) || 'Delete this task record?';
        if (!confirm(confirmMsg)) return;
        var url = btn.dataset.url;
        var id  = btn.dataset.id;
        fetch(url, {
            method: 'POST',
            headers: {'Content-Type': 'application/x-www-form-urlencoded'},
            body: 'id=' + id + '&_csrf_token=' + encodeURIComponent(window.AI_CSRF_TOKEN || '')
        })
        .then(r => r.json())
        .then(function(res) {
            if (res.code === 1) {
                btn.closest('tr').remove();
            } else {
                alert(res.message);
            }
        });
    });
});
</script>
{/block}