baoshi-was/resources/views/demand/search/_table.blade.php

<table class="table table-striped table-bordered table-sm table-hover">
    <thead class="text-center">
    <tr class="align-text-bottom">
        <th rowspan="2">序号</th>
        <th rowspan="2">类型</th>
        <th rowspan="2">需求描述</th>
        <th rowspan="1">过程</th>
        <th rowspan="2">附件</th>
        <th rowspan="2">发起人</th>
        <th rowspan="2">处理人</th>
        <th rowspan="2">发起时间</th>
        <th rowspan="2">状态</th>
        <th rowspan="2">操作</th>
    </tr>
    <tr >
        <td class="p-0">
            <table class="table m-0 p-0">
                <td>说明</td>
                <td>经手人</td>
                <td>时间</td>
            </table>
        </td>
    </tr>
    </thead>
    <tbody>
    <template v-if="demands.length>0">
        <tr class="text-center" v-for="(demand,i) in demands" @click="selectTr===i+1?selectTr=0:selectTr=i+1"
            :class="selectTr===i+1?'focusing' : ''">
            <td>@{{ i+1 }}</td>
            <td>@{{ demand.type }}</td>
            <td class="">
                <textarea class="form-control" rows="2" cols="15" :value="demand.description" @change="updateDemand(demand,'description',$event)" :disabled="demand['status'] !== '未处理'"></textarea>
            </td>
            <td class="text-left p-0" @mouseenter="showAddBtn(demand)" @mouseleave="showAddBtn(demand)" >
                <button class="btn btn-primary position-absolute d-none" :id="'addBtn_'+demand['id']"  style="margin-top: -35px;" @click="toggleAddDiv(demand,demand['id'])" v-if="demand['status'] !== '已处理'">新</button>
                <div>
                    <div :id="'addDiv_'+demand['id']" class="form-inline float-right d-none">
                        <input type="text" class="form-control" :id="'addProcess'+demand['id']"  style="width: 300px">
                        <button class="btn btn-sm btn-primary ml-1" @click="addProcess(demand)">添加</button>
                    </div>
                    <div>
                    <template v-if="demand['processes'].length > 0 ">
                        <table class="table p-0 m-0 table-striped">
                            <template v-for="(process,process_i) in demand['processes']">
                                <tr  class="text-center" @mouseenter="toggleDelBtn(demand['id'],process)" @mouseleave="toggleDelBtn(demand['id'],process)" >
                                    <td>@{{ process.explain }}</td>
                                    <td>@{{ process.user ? process.user.name : '' }}</td>
                                    <td>@{{ process.created_at }}</td>
                                    <td class="p-0 m-0" style="width: 35px;max-width: 35px">
                                        <button :id="'demand-'+demand['id']+'process-'+process['id']" type="button" @click="deleteProcess(demand,process,process_i,i)" class="btn btn-sm btn-outline-danger d-none m-0" v-if="demand['status'] !== '已处理'">删</button>
                                    </td>
                                </tr>
                            </template>
                        </table>
                    </template>
                    </div>
                </div>
            </td>
            <td>
                <div class="text-center" @mouseleave="removeCommonImg('imgBulky_'+demand.id)" @mouseenter="commonImg('img_'+demand.id,demand,i)">
                    <img v-if="demand['upload_file']" :id="'img_'+demand.id" :data-src="demand['upload_file']['url']" src="{{url('icon/img404-thumbnail.jpg')}}" alt="">
                    <button v-else type="button" class="btn btn-outline-secondary" @click="showUploadDiv(demand,i)">上传文件</button>
                </div>
            </td>
            <td>@{{ demand.initiator ? demand.initiator.name : '' }}</td>
            <td>@{{ demand.handle ? demand.handle.name : '' }}</td>
            <td>@{{ demand.created_at }}</td>
            <td>@{{ demand.status }}</td>
            <td>
                <button class="btn btn-outline-success" @click="finishDemand(demand,i)" v-if="demand['status'] === '处理中'">完结</button>
                <button class="btn btn-outline-success" @click="claimDemand(demand,i)" v-if="demand['status'] === '未处理'">认领</button>
                <button class="btn btn-outline-danger" @click="destroyDemand(demand,i)">删</button>
            </td>
        </tr>
    </template>
    <template v-else>
        <tr>
            <td colspan="11">
                <div class="alert alert-info text-center">
                    按条件查询的数据结果未空
                </div>
            </td>
        </tr>
    </template>
    </tbody>
</table>
{{ $demands->withQueryString()->links() }}