<table class="table table-hover card-body p-0 m-0">
    <thead class="thead-light">
    <tr class="text-center">
        <th>
            <label>
                <input type="checkbox" id="selectAll" @click="selectAll">
            </label>
        </th>
        <th>序号</th>
        <th>时间段</th>
        <th>装卸队</th>
        <th>订单数量</th>
        <th>总金额</th>
        <th>月账单详情</th>
    </tr>
    </thead>
    <tbody>
    <template v-if="facilitatorStatements.length>0">
        <template  v-for="(facilitatorStatement,index) in facilitatorStatements">
        <tr class="text-center"
            @click="selectTr===index+1?selectTr=0:selectTr=index+1" :class="selectTr===index+1?'focusing' : ''">
            <td>
                <label >
                    <input type="checkbox" v-model="checkData" :value="'months:'+facilitatorStatement['months']+';id:'+facilitatorStatement['id']">
                </label>
            </td>
            <td class="align-text-bottom">@{{index+1}}</td>
            <td class="align-text-bottom">@{{ facilitatorStatement.months }}</td>
            <td class="align-text-bottom">@{{ facilitatorStatement.facilitators_name }}</td>
            <td class="align-text-bottom">@{{ facilitatorStatement.sum }}</td>
            <td class="align-text-bottom">@{{ facilitatorStatement.total_cost }}</td>
            <td>
                <button class="align-self-center btn btn-outline-info m-0" @click="gainStatement(facilitatorStatement,index,$event)">点击展开</button>
            </td>
        </tr>
        <tr v-if="facilitatorStatement.showSubject" class="p-0 up" >
            <td></td>
            <td colspan="7" class="p-0 m-0">
                <div class="p-0 " :id="'Statement' + index">
                    <table class="table table-bordered m-0">
                        <thead class="thead-light">
                        <tr>
                            <th>日期</th>
                            <th>装卸队</th>
                            <th>数量</th>
                            <th>单位</th>
                            <th>单价</th>
                            <th>总金额合计</th>
                        </tr>
                        </thead>
                        <tbody>
                        <tr v-for="(item,index) in facilitatorStatement.subjection">
                            <td>@{{ item.created_at }}</td>
                            <td>@{{ item.facilitator ? item.facilitator.name :'' }}</td>
                            <td>@{{ item.expenditure_amount }}</td>
                            <td>@{{ item.expenditure_unit }}</td>
                            <td>@{{ item.expenditure_unit_price }}</td>
                            <td>@{{ item.expenditure_total_cost }}</td>
                        </tr>
                        </tbody>
                    </table>
                </div>
            </td>
        </tr>
        </template>

    </template>
    <template v-else>
        <tr>
            <td colspan="8">
                <div class='alert alert-info text-lg-center'>
                    装卸队对账单数据暂无
                </div>
            </td>
        </tr>
    </template>
    </tbody>
</table>
<hr>
{{ $facilitatorStatements->withQueryString()->links() }}
