@extends('admin/layout')
@section('header')

@endsection
<style type="text/css">
    table.tftable {
        font-size: 12px;
        color: #333333;
        width: 100%;
        border-width: 1px;
        border-color: #9dcc7a;
        border-collapse: collapse;
    }

    table.tftable th {
        font-size: 12px;
        background-color: #abd28e;
        border-width: 1px;
        padding: 8px;
        border-style: solid;
        border-color: #9dcc7a;
        text-align: left;
    }

    table.tftable tr {
        background-color: #ffffff;
    }

    table.tftable td {
        font-size: 12px;
        border-width: 1px;
        padding: 8px;
        border-style: solid;
        border-color: #9dcc7a;
    }

    .fenish {
        background: #1D976C;
        color: #fff;
    }


    #tfhover tbody tr td:nth-child(2) {
        position: relative;
        padding-left: 35px;
    }

    .fa-heart {
        position: absolute;
        left: 10px;
        color: #ddd;
        transform: translateY(-50%);
        top: 50%;
        font-size: 18px !important;
        cursor: pointer;
    }

    .first-numb {
        color: palevioletred;
    }
</style>
<form action="{{url('/admin/flow/buildFlow')}}" method="post" id="form1">
    <div style="margin-left: 10px">
        <div style="display: flex;padding: 10px 0;">
            <input type="text" placeholder="请输入域名或项目名称" name="keyword" id="keyword" class="input-md form-control"
                   style="width: 200px;" value="{{$result['keyword']??''}}">
            <select data-placeholder="请选择状态..." style="width:150px;" name="status" id="status"
                    class="form-control">
                <option value="1" selected="selected">
                    建站期
                </option>
                <option value="2" @if(!empty($result['status']) && $result['status']==2) selected="selected"@endif >
                    上线
                </option>
            </select>

            <select data-placeholder="请选择客服..." style="width:150px;" name="serverId" id="serverId"
                    class="form-control">
                <option value="">请选择客服</option>
                @foreach ($userList as $key => $value)
                    @if($value->role_id==7)
                        <option value="{{$value->id}}"
                                @if(!empty($result['serverId']) && $result['serverId']==$value->id) selected="selected"@endif>{{$value->nickname}}</option>
                    @endif
                @endforeach
            </select>

            <select data-placeholder="请选择销售..." style="width:150px;" name="sellerId" id="sellerId"
                    class="form-control">
                <option value="">请选择销售</option>
                @foreach ($userList as $key => $value)
                    @if($value->role_id==1)
                        <option value="{{$value->id}}"
                                @if(!empty($result['sellerId']) && $result['sellerId']==$value->id) selected="selected"@endif >{{$value->nickname}}</option>
                    @endif
                @endforeach
            </select>

            <select data-placeholder="请选择项目经理..." style="width:150px;" name="projectManagerId" id="projectManagerId"
                    class="form-control">
                <option value="">请选择项目经理</option>
                @foreach ($userList as $key => $value)
                    @if($value->role_id==25)
                        <option value="{{$value->id}}"
                                @if(!empty($result['projectManagerId']) && $result['projectManagerId']==$value->id) selected="selected" @endif>{{$value->nickname}}</option>
                    @endif
                @endforeach
            </select>

            <select data-placeholder="请选择建站采编..." style="width:150px;" name="editingId" id="editingId"
                    class="form-control">
                <option value="">请选择建站采编</option>
                @foreach ($userList as $key => $value)
                    @if($value->role_id==2)
                        <option value="{{$value->id}}"
                                @if(!empty($result['editingId']) && $result['editingId']==$value->id) selected="selected"@endif >{{$value->nickname}}</option>
                    @endif
                @endforeach
            </select>


            <input style="margin-left: 10px" type="submit" class="btn btn-primary" value="搜索">
            <button style="margin-left: 10px" type="button" class="btn btn-primary reset"> 重置</button>
            <button style="margin-left: 10px" type="button" class="btn btn-primary button"> 保存</button>
        </div>
    </div>
    <table id="tfhover" class="tftable" border="1">
        <input type="hidden" name="lv" id="lv">
        <input type="hidden" name="sortName" id="sortName">
        <thead>
        <tr>
            <th colspan="21" style="text-align: center">
                建站流程2.0总进度
            </th>
        </tr>
        <tr>
            <th style="width: 3%;">序号</th>
            <th style="width: 7%;">项目</th>
            <th style="width: 5%;" class="sort_btn" data-sortName="order_at"><span style="cursor:pointer">下单时间</span>
                <i class="fa fa-caret-up" aria-hidden="true"></i></th>
            <th style="width: 5%;">备注</th>
            <th style="width: 5%;" class="sort_btn" data-sortName="lv1"><span
                    style="cursor:pointer">第一阶段 <br>项目资料收集</span>
                <i class="fa fa-caret-up" aria-hidden="true"></i>
            </th>
            <th style="width: 5%;" class="sort_btn" data-sortName="lv2"><span
                    style="cursor:pointer">第二阶段 <br>竞分&架构</span>
                <i class="fa fa-caret-up" aria-hidden="true"></i>
            </th>
            <th style="width: 5%;" class="sort_btn" data-sortName="lv3"><span
                    style="cursor:pointer">第三阶段 <br>首页设计</span>
                <i class="fa fa-caret-up" aria-hidden="true"></i>
            </th>
            <th style="width: 5%;" class="sort_btn" data-sortName="lv4"><span
                    style="cursor:pointer">第四阶段 <br>整站样式</span>
                <i class="fa fa-caret-up" aria-hidden="true"></i>
            </th>
            <th style="width: 5%;" class="sort_btn" data-sortName="lv5"><span
                    style="cursor:pointer">第五阶段 <br>整站资料</span>
                <i class="fa fa-caret-up" aria-hidden="true"></i>
            </th>
            <th style="width: 5%;" class="sort_btn" data-sortName="lv6"><span
                    style="cursor:pointer">第六阶段 <br>页面切片</span>
                <i class="fa fa-caret-up" aria-hidden="true"></i>
            </th>
            <th style="width: 5%;" class="sort_btn" data-sortName="lv7"><span
                    style="cursor:pointer">第七阶段 <br>资料上传</span>
                <i class="fa fa-caret-up"></i>
            </th>
            <th style="width: 5%;" class="sort_btn" data-sortName="lv8"><span
                    style="cursor:pointer">第八阶段 <br>页面读取</span>
                <i class="fa fa-caret-up" aria-hidden="true"></i>
            </th>
            <th style="width: 5%;" class="sort_btn" data-sortName="lv9"><span
                    style="cursor:pointer">第九阶段 <br>pc测试站</span>
                <i class="fa fa-caret-up" aria-hidden="true"></i>
            </th>
            <th style="width: 5%;" class="sort_btn" data-sortName="lv10"><span
                    style="cursor:pointer">第十阶段 <br>手机端调整</span>
                <i class="fa fa-caret-up" aria-hidden="true"></i>
            </th>
            <th style="width: 5%;" class="sort_btn" data-sortName="lv11"><span
                    style="cursor:pointer">第十一阶段 <br>测试站seo</span>
                <i class="fa fa-caret-up" aria-hidden="true"></i>
            </th>
            <th style="width: 5%;" class="sort_btn" data-sortName="lv12"><span
                    style="cursor:pointer">第十二阶段 <br>关键词</span>
                <i class="fa fa-caret-up" aria-hidden="true"></i>
            </th>
            <th style="width: 5%;" class="sort_btn" data-sortName="lv13"><span
                    style="cursor:pointer">第十三阶段 <br>上线</span>
                <i class="fa fa-caret-up" aria-hidden="true"></i>
            </th>
            <th style="width: 5%;" class="sort_btn" data-sortName="lv14"><span
                    style="cursor:pointer">第十四阶段 <br>优化交接</span>
                <i class="fa fa-caret-up" aria-hidden="true"></i>
            </th>
        </tr>
        </thead>
        <tbody>
        @foreach($siteList as $key=>$value)
            <tr>
                <td style="text-align: center">
                    {{$key+1}}
                </td>
                <td data-a="{{$value['id']}}" data-rank="{{$value['rank']}}">
                    <i @if($value['rank']==1)class="fa fa-heart first-numb" @else class="fa fa-heart" @endif></i>
                    <a onclick="units.openDetail('{{$value['id']}}','{{$value['cn_title']}}')">{{$value['cn_title']}}</a>
                </td>
                <td>{{$value['order_at']??''}}</td>
                <td><textarea style="border: none;width: 100%;height: 100%">{{$value['memo']??''}}</textarea></td>
                <td @if($value['lv1']==1)class="fenish"@endif><p style="opacity:0.4"></p>
                    {{$value['lv1complete']}}/{{$value['lv1count']}} {{$value['lv1completeDate']??''}}
                    @if(!empty($value['lv1CompleteOverdueTime']))
                        <br>完成逾期:{{$value['lv1CompleteOverdueTime']??''}}天
                    @endif
                    @if(!empty($value['lv1OverdueTime']))
                        <br>未完成逾期:{{$value['lv1OverdueTime']??''}}天
                    @endif
                </td>
                <td @if($value['lv2']==1)class="fenish"@endif ><p style="opacity:0.4"></p>
                    {{$value['lv2complete']}}/{{$value['lv2count']}} {{$value['lv2completeDate']??''}}
                    @if(!empty($value['lv2CompleteOverdueTime']))
                        <br>完成逾期:{{$value['lv2CompleteOverdueTime']??''}}天
                    @endif
                    @if(!empty($value['lv2OverdueTime']))
                        <br>未完成逾期:{{$value['lv2OverdueTime']??''}}天
                    @endif
                </td>
                <td @if($value['lv3']==1)class="fenish"@endif><p style="opacity:0.4"></p>
                    {{$value['lv3complete']}}/{{$value['lv3count']}} {{$value['lv3completeDate']??''}}
                    @if(!empty($value['lv3CompleteOverdueTime']))
                        <br>完成逾期:{{$value['lv3CompleteOverdueTime']??''}}天
                    @endif
                    @if(!empty($value['lv3OverdueTime']))
                        <br>未完成逾期:{{$value['lv3OverdueTime']??''}}天
                    @endif
                </td>
                <td @if($value['lv4']==1)class="fenish"@endif><p style="opacity:0.4"></p>
                    {{$value['lv4complete']}}/{{$value['lv4count']}} {{$value['lv4completeDate']??''}}
                    @if(!empty($value['lv4CompleteOverdueTime']))
                        <br>完成逾期:{{$value['lv4CompleteOverdueTime']??''}}天
                    @endif
                    @if(!empty($value['lv4OverdueTime']))
                        <br>未完成逾期:{{$value['lv4OverdueTime']??''}}天
                    @endif
                </td>
                <td @if($value['lv5']==1)class="fenish"@endif><p style="opacity:0.4"></p>
                    {{$value['lv5complete']}}/{{$value['lv5count']}} {{$value['lv5completeDate']??''}}
                    @if(!empty($value['lv5CompleteOverdueTime']))
                        <br>完成逾期:{{$value['lv5CompleteOverdueTime']??''}}天
                    @endif
                    @if(!empty($value['lv5OverdueTime']))
                        <br>未完成逾期:{{$value['lv5OverdueTime']??''}}天
                    @endif
                </td>
                <td @if($value['lv6']==1)class="fenish"@endif><p style="opacity:0.4"></p>
                    {{$value['lv6complete']}}/{{$value['lv6count']}} {{$value['lv6completeDate']??''}}
                    @if(!empty($value['lv6CompleteOverdueTime']))
                        <br>完成逾期:{{$value['lv6CompleteOverdueTime']??''}}天
                    @endif
                    @if(!empty($value['lv6OverdueTime']))
                        <br>未完成逾期:{{$value['lv6OverdueTime']??''}}天
                    @endif
                </td>
                <td @if($value['lv7']==1)class="fenish"@endif><p style="opacity:0.4"></p>
                    {{$value['lv7complete']}}/{{$value['lv7count']}} {{$value['lv7completeDate']??''}}
                    @if(!empty($value['lv7CompleteOverdueTime']))
                        <br>完成逾期:{{$value['lv7CompleteOverdueTime']??''}}天
                    @endif
                    @if(!empty($value['lv7OverdueTime']))
                        <br>未完成逾期:{{$value['lv7OverdueTime']??''}}天
                    @endif
                </td>
                <td @if($value['lv8']==1)class="fenish"@endif><p style="opacity:0.4"></p>
                    {{$value['lv8complete']}}/{{$value['lv8count']}} {{$value['lv8completeDate']??''}}
                    @if(!empty($value['lv8CompleteOverdueTime']))
                        <br>完成逾期:{{$value['lv8CompleteOverdueTime']??''}}天
                    @endif
                    @if(!empty($value['lv8OverdueTime']))
                        <br>未完成逾期:{{$value['lv8OverdueTime']??''}}天
                    @endif
                </td>
                <td @if($value['lv9']==1)class="fenish"@endif><p style="opacity:0.4"></p>
                    {{$value['lv9complete']}}/{{$value['lv9count']}} {{$value['lv9completeDate']??''}}
                    @if(!empty($value['lv9CompleteOverdueTime']))
                        <br>完成逾期:{{$value['lv9CompleteOverdueTime']??''}}天
                    @endif
                    @if(!empty($value['lv9OverdueTime']))
                        <br>未完成逾期:{{$value['lv9OverdueTime']??''}}天
                    @endif
                </td>
                <td @if($value['lv10']==1)class="fenish"@endif><p style="opacity:0.4"></p>
                    {{$value['lv10complete']}}/{{$value['lv10count']}} {{$value['lv10completeDate']??''}}
                    @if(!empty($value['lv10CompleteOverdueTime']))
                        <br>完成逾期:{{$value['lv10CompleteOverdueTime']??''}}天
                    @endif
                    @if(!empty($value['lv10OverdueTime']))
                        <br>未完成逾期:{{$value['lv10OverdueTime']??''}}天
                    @endif
                </td>
                <td @if($value['lv11']==1)class="fenish"@endif><p style="opacity:0.4"></p>
                    {{$value['lv11complete']}}/{{$value['lv11count']}} {{$value['lv11completeDate']??''}}
                    @if(!empty($value['lv11CompleteOverdueTime']))
                        <br>完成逾期:{{$value['lv11CompleteOverdueTime']??''}}天
                    @endif
                    @if(!empty($value['lv11OverdueTime']))
                        <br>未完成逾期:{{$value['lv11OverdueTime']??''}}天
                    @endif
                </td>
                <td @if($value['lv12']==1)class="fenish"@endif><p style="opacity:0.4"></p>
                    {{$value['lv12complete']}}/{{$value['lv12count']}} {{$value['lv12completeDate']??''}}
                    @if(!empty($value['lv12CompleteOverdueTime']))
                        <br>完成逾期:{{$value['lv12CompleteOverdueTime']??''}}天
                    @endif
                    @if(!empty($value['lv12OverdueTime']))
                        <br>未完成逾期:{{$value['lv12OverdueTime']??''}}天
                    @endif
                </td>
                <td @if($value['lv13']==1)class="fenish"@endif><p style="opacity:0.4"></p>
                    {{$value['lv13complete']}}/{{$value['lv13count']}} {{$value['lv13completeDate']??''}}
                    @if(!empty($value['lv13CompleteOverdueTime']))
                        <br>完成逾期:{{$value['lv13CompleteOverdueTime']??''}}天
                    @endif
                    @if(!empty($value['lv13OverdueTime']))
                        <br>未完成逾期:{{$value['lv13OverdueTime']??''}}天
                    @endif
                </td>
                <td @if($value['lv14']==1)class="fenish"@endif><p style="opacity:0.4"></p>
                    {{$value['lv14complete']}}/{{$value['lv14count']}} {{$value['lv14completeDate']??''}}
                    @if(!empty($value['lv14CompleteOverdueTime']))
                        <br>完成逾期:{{$value['lv14CompleteOverdueTime']??''}}天
                    @endif
                    @if(!empty($value['lv14OverdueTime']))
                        <br>未完成逾期:{{$value['lv14OverdueTime']??''}}天
                    @endif
                </td>
            </tr>
        @endforeach
        </tbody>
    </table>
</form>
@section('footer')
    <script>

        window.onload = function () {
            var tfrow = document.getElementById('tfhover').rows.length;
            var tbRow = [];
            for (var i = 1; i < tfrow; i++) {
                tbRow[i] = document.getElementById('tfhover').rows[i];
                tbRow[i].onmouseover = function () {
                    this.style.backgroundColor = '#f3f8aa';
                };
                tbRow[i].onmouseout = function () {
                    this.style.backgroundColor = '#ffffff';
                };
            }
        };

        $('#tfhover tbody tr td:nth-child(2) i').click(function () {
            var rank = 0;
            if ($(this).hasClass('first-numb')) {
                $(this).removeClass('first-numb');
            } else {
                rank = 1;
                $(this).addClass('first-numb');
            }

            var siteId = $(this).parent().attr('data-a');
            var ajaxConfig = {
                url: '/admin/flow/setSiteIdByRankId',
                type: 'post',
                data: {siteId: siteId, type: 6, rank: rank},
                success: function (result) {
                    layer.msg(result.message, {icon: 6, time: 1000}, function () {
                        window.location.reload();
                    });
                }
            };
            tips.ajax(ajaxConfig);
        });
        var units = {
            openDetail: function (id, title) {
                tips.page('/admin/sites/' + id + '/overview', title);
            },
        };

        $('#tfhover tbody tr td').click(function () {
            $(this).toggleClass("fenish");
            if ($(this).hasClass("fenish")) {
                $(this).attr("data-a", "1");
            } else {
                $(this).attr("data-a", "0");
            }
        });

        $('#tfhover tbody tr td:first-child').unbind('click');
        $('#tfhover tbody tr td:nth-child(2)').unbind('click');
        $('#tfhover tbody tr td:nth-child(3)').unbind('click');
        $('#tfhover tbody tr td:nth-child(4)').unbind('click');
        $('#tfhover tbody tr td:nth-child(5)').unbind('click');
        $('#tfhover tbody tr td:nth-child(6)').unbind('click');
        $('#tfhover tbody tr td:nth-child(7)').unbind('click');
        $('#tfhover tbody tr td:nth-child(8)').unbind('click');
        $('#tfhover tbody tr td:nth-child(9)').unbind('click');
        $('#tfhover tbody tr td:nth-child(10)').unbind('click');
        $('#tfhover tbody tr td:nth-child(11)').unbind('click');
        $('#tfhover tbody tr td:nth-child(12)').unbind('click');
        $('#tfhover tbody tr td:nth-child(13)').unbind('click');
        $('#tfhover tbody tr td:nth-child(14)').unbind('click');
        $('#tfhover tbody tr td:nth-child(15)').unbind('click');
        $('#tfhover tbody tr td:nth-child(16)').unbind('click');
        $('#tfhover tbody tr td:nth-child(17)').unbind('click');
        $('#tfhover tbody tr td:nth-child(18)').unbind('click');

        $(".button").click(function () {
            var list = [];

            $("#tfhover tbody").find("tr").each(function () {
                var tdArr = $(this).children();

                var site_id = tdArr.eq(1).attr('data-a');
                var rank = tdArr.eq(1).attr('data-rank');
                var memo = tdArr.eq(3).find('textarea').val();

                var array = {};
                array.site_id = site_id;
                array.rank = rank;
                array.memo = memo;

                list.push(array);
            });

            var ajaxConfig = {
                url: '/admin/flow/buildFlow',
                type: 'post',
                data: {list: JSON.stringify(list)},
                success: function (result) {
                    layer.msg(result.message, {icon: 6, time: 1000}, function () {
                        window.location.reload();
                    });
                }
            };
            tips.ajax(ajaxConfig);
        });

        //重置
        $(function () {
            $('.reset').click(function () {
                $('#keyword').val('');
                $('#projectManagerId').val('');
                $('#serverId').val('');
                $('#sellerId').val('');
                $('#editingId').val('');
                $('#status').val(1);
                $('#lv').val('');
                $('#form1').submit();
            });
        });

        $(document).ready(function () {
            $('.sort_btn').each(function () {
                $(this).click(function () {
                    $('#lv').val($(this).attr('data-sortName'));
                    $('#form1').submit();
                });
            })
        })

    </script>
@endsection