{$layout}

<first-menu>
    <menu-item href="/tickets?status=none" code="none">进行中({{countNewTickets}})</menu-item>
    <menu-item href="/tickets?status=solved" code="solved">已解决</menu-item>
    <menu-item href="/tickets?status=closed" code="closed">已关闭</menu-item>
    <span class="item disabled">|</span>
    <menu-item @click.prevent="createTicket">
      <i class="pi pi-pen-to-square" style="margin-right: 0.5em;"></i>
      提交工单
    </menu-item>
</first-menu>

<!-- <not-found-box v-if="tickets.length == 0">暂时还没有工单。</not-found-box> -->
<b-empty v-if="tickets.length == 0">暂时还没有工单。</b-empty>
<div class="margin"></div>
<b-table
    v-if="tickets.length > 0"
    :columns="columns"
    :data-source="tickets"
    :row-key="'id'"
    :scroll="{ x: 1200 }"
    size="middle"
>
    <template slot="subjectSlot" slot-scope="{ text, record }">
        <a :href="'/tickets/ticket?ticketId=' + record.id + '&fromURL=' + currentURL">{{record.subject}}</a>
    </template>

    <template slot="lastLogTimeSlot" slot-scope="{ text, record }">
        {{record.lastLogTime}}
    </template>

    <template slot="lastOperatorSlot" slot-scope="{ text, record }">
        <span v-if="record.latestLog != null && record.latestLog.admin != null">
            <i class="pi pi-user-secret"></i> 管理员
        </span>
        <span v-else class="grey">自己</span>
    </template>

    <template slot="categorySlot" slot-scope="{ text, record }">
        <span v-if="record.category != null">{{record.category.name}}</span>
        <span v-else class="disabled">-</span>
    </template>

    <template slot="statusSlot" slot-scope="{ text, record }">
        <span :class="{olive: record.status == 'none', green: record.status == 'solved', red: record.status == 'closed'}">{{record.statusName}}</span>
    </template>

    <template slot="actionSlot" slot-scope="{ text, record }">
        <a-button type="link" :href="'/tickets/ticket?ticketId=' + record.id + '&fromURL=' + currentURL">
            <i class="pi pi-eye" style="font-size: 12px; padding: 4px;"></i> 详情
        </a-button>
    </template>
</b-table>

<page-box></page-box>