{$layout}
{$template "../menu"}

{$var "header"}
<link rel="stylesheet" href="index.css"/>
{$end}

<second-menu>
    <menu-item href=".?status=0" :active="status == 0">{{t('admins_recipients_tasks_index@等待发送')}}({{countWaiting}})</menu-item>
    <menu-item href=".?status=3" :active="status == 3">{{t('admins_recipients_tasks_index@发送错误')}}({{countFailed}})</menu-item>
</second-menu>

<b-empty v-if="tasks.length == 0">{{t('admins_recipients_tasks_index@暂时还没有发送任务。')}}</b-empty>

<div v-if="tasks.length > 0" class="task-list-container">
    <div v-for="task in tasks" class="task-card" :class="{'error-task': task.status == 3}">
        <div class="task-content">
             <a href="" :title="t('admins_recipients_tasks_index@删除')" class="delete-task-btn" @click.prevent="deleteTask(task.id)"><i class="pi pi-times"></i></a>
            <div class="task-row">
                <div class="task-label">{{t('admins_recipients_tasks_index@简介')}}</div>
                <div class="task-value">
                    {{task.user}} 
                    <span class="disabled">&nbsp; | &nbsp;</span> 
                    <span v-if="task.instance != null">
                        {{t('admins_recipients_tasks_index@媒介：')}}{{task.instance.name}}
                        <link-icon :href="'/admins/recipients/instances/instance?instanceId=' + task.instance.id"></link-icon>
                    </span>
                    <span class="disabled">&nbsp; | &nbsp;</span> 
                    {{t('admins_recipients_tasks_index@时间：')}}{{task.createdTime}}
                </div>
            </div>
            <div class="task-row" v-if="task.subject.length > 0">
                <div class="task-label">{{t('admins_recipients_tasks_index@标题')}}</div>
                <div class="task-value">{{task.subject}}</div>
            </div>
            <div class="task-row" v-if="task.body.length > 0">
                <div class="task-label">{{t('admins_recipients_tasks_index@内容')}}</div>
                <div class="task-value">{{task.body}}</div>
            </div>
            <div class="task-row" v-if="task.status == 3 && task.result != null && !task.result.isOk">
                <div class="task-label">{{t('admins_recipients_tasks_index@错误信息')}}</div>
                <div class="task-value" style="color: var(--color-red)">{{task.result.error}}</div>
            </div>
        </div>
    </div>
</div>

<div class="page" v-html="filterPageContent(page)"></div>