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

<second-menu>
    <menu-item @click.prevent="createInstance">
        <i class="pi pi-pen-to-square"></i>
        {{t('admins_recipients_instances_index@创建媒介')}}
    </menu-item>
</second-menu>

<b-empty v-if="instances.length == 0">{{t('admins_recipients_instances_index@暂时还没有媒介接收人。')}}</b-empty>

<b-table
    v-if="instances.length > 0"
    :columns="tableColumns"
    :data-source="instances"
    :row-key="'id'"
    :bordered="false"
    size="middle"
    :pagination="false"
>
    <!-- 媒介名称 -->
    <template slot="nameSlot" slot-scope="{ text, record }">
        <a :href="'/admins/recipients/instances/instance?instanceId=' + record.id">{{record.name}}</a>
    </template>

    <!-- 媒介类型 -->
    <template slot="mediaSlot" slot-scope="{ text, record }">
        {{record.media.name}}
    </template>

    <!-- 备注 -->
    <template slot="descriptionSlot" slot-scope="{ text, record }">
        <span v-if="record.description.length > 0">{{record.description}}</span>
        <span v-else class="disabled">-</span>
    </template>

    <!-- 状态 -->
    <template slot="statusSlot" slot-scope="{ text, record }">
        <label-on :v-is-on="record.isOn"></label-on>
    </template>

    <!-- 操作 -->
    <template slot="actionSlot" slot-scope="{ text, record }">
        <a :href="'/admins/recipients/instances/instance?instanceId=' + record.id">{{t('admins_recipients_instances_index@详情')}}</a> &nbsp;
        <a href="" @click.prevent="deleteInstance(record.id)">{{t('admins_recipients_instances_index@删除')}}</a>
    </template>
</b-table>

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