{$layout "layout_popup"}

<!-- <h3>正在同步的节点任务<span v-if="countTasks > 0">(共{{countTasks}}个)</span></h3> -->

<b-empty v-if="clusters.length == 0">{{t('clusters_tasks@暂时没有同步的任务')}}</b-empty>

<div v-if="clusters.length > 0">
    <button class="ui button basic tiny" @click.prevent="deleteAllTasks">{{t('clusters_tasks@清空所有任务')}}</button> &nbsp;
    <button class="ui button basic tiny" v-if="checkedTaskIds.length > 0" @click.prevent="deleteBatch">{{t('clusters_tasks@批量删除x个任务')}}</button>
    <div class="margin"></div>
    <b-table
        :columns="[
            {
                title: t('clusters_tasks@集群'),
                dataIndex: 'clusterName',
                key: 'clusterName',
                width: '200',
                scopedSlots: { customRender: 'clusterName' }
            },
            {
                title: t('clusters_tasks@节点'),
                dataIndex: 'nodeName',
                key: 'nodeName',
                width: '200',
                scopedSlots: { customRender: 'nodeName' }
            },
            {
                title: t('clusters_tasks@任务'),
                dataIndex: 'type',
                key: 'type',
                width: '200',
                scopedSlots: { customRender: 'type' }
            },
            {
                title: t('clusters_tasks@状态'),
                dataIndex: 'isDone',
                key: 'isDone',
                width: '200',
                scopedSlots: { customRender: 'isDone' }
            },
            {
                title: t('clusters_tasks@触发时间'),
                dataIndex: 'updatedTime',
                key: 'updatedTime',
                width: '200',
                scopedSlots: { customRender: 'updatedTime' }
            },
            {
                title: '',
                key: 'action',
                width: 80,
                scopedSlots: { customRender: 'action' }
            }
        ]"
        :data-source="tableData"
        row-key="id"
        :bordered="false"
        :scroll="{ x: 1200, y: 300 }"
        :pagination="false"
        size="middle"
        :row-selection="{
            type: 'checkbox',
            selectedRowKeys: checkedTaskIds,
            onChange: checkTask
        }"
    >
        
        <!-- 集群名称列 -->
        <template slot="clusterName" slot-scope="{ text, record }">
            {{record.clusterName}}
        </template>
        
        <!-- 节点名称列 -->
        <template slot="nodeName" slot-scope="{ text, record }">
            {{record.nodeName}} &nbsp; <a :href="'/clusters/cluster/node?clusterId=' + record.clusterId + '&nodeId=' + record.nodeId" target="_blank"><i class="icon linkify small grey"></i></a>
        </template>
        
        <!-- 任务类型列 -->
        <template slot="type" slot-scope="{ text, record }">
            <span v-if="record.type == 'configChanged' || record.type == 'globalServerConfigChanged'">{{t('clusters_tasks@同步配置')}}</span>
            <span v-if="record.type == 'ipItemChanged'">{{t('clusters_tasks@同步IP名单')}}</span>
            <span v-if="record.type == 'scriptsChanged'">{{t('clusters_tasks@同步脚本')}}</span>
            <span v-if="record.type == 'nodeLevelChanged'">{{t('clusters_tasks@同步L2节点')}}</span>
            <span v-if="record.type == 'ddosProtectionChanged'">{{t('clusters_tasks@DDoS配置')}}</span>
            <span v-if="record.type == 'userServersStateChanged'">{{t('clusters_tasks@用户网站状态')}}</span>
            <span v-if="record.type != null && record.type.startsWith('ipListDeleted')">{{t('clusters_tasks@删除IP名单')}}</span>
        </template>
        
        <!-- 状态列 -->
        <template slot="isDone" slot-scope="{ text, record }">
            <span v-if="record.isDone" class="red">{{record.error}}</span>
            <span v-else>{{t('clusters_tasks@正在同步')}}</span>
        </template>
        
        <!-- 触发时间列 -->
        <template slot="updatedTime" slot-scope="{ text, record }">
            {{record.updatedTime}}
        </template>
        
        <!-- 操作列 -->
        <template slot="action" slot-scope="{ text, record }">
            <a-button @click.prevent="deleteTask(record.id)" type="link" size="small">{{t('clusters_tasks@删除')}}</a-button>
        </template>
    </b-table>
</div>