@extends('admin/layout')
@section('content')
    <style>
        .btn-danger, .btn-primary, .btn-info {
            background: #009688 !important;
            border-color: #009688 !important;
        }
    </style>
    <body class="gray-bg">
    <div class="wrapper wrapper-content animated fadeInRight">
        <div class="row">
            <div class="col-sm-12">
                <div class="ibox float-e-margins">
                    <div class="ibox-content">
                        <form class="row" id="searchForm" onsubmit="units.search();return false;">
                            <div class="col-md-12">
                                <div class="input-group">
                                    <select name="duty_id" class="form-control" style="width: 150px;float: right">
                                        <option value="">请选择负责人</option>
                                        @foreach($user as $inx=>$item)
                                            <option value="{{$item->id}}">{{$item->nickname}}</option>
                                        @endforeach
                                    </select>
                                    <select name="user_type" class="form-control" style="width: 150px;float: right">
                                        <option value="">请选择前端</option>
                                        @foreach($web as $inx=>$item)
                                            <option value="{{$item->id}}">{{$item->nickname}}</option>
                                        @endforeach
                                    </select>
                                    <input type="text" placeholder="请输入任务描述" class="form-control"
                                           style="width: 150px;float: right;" name="desc">

                                    <div class="input-group" style="width: 150px;float: right">
                                        <span class="input-group-addon"><i class="fa fa-calendar"></i></span>
                                        <input type="text" class="input-md form-control" id="insert_date"
                                               name="insert_date" placeholder="请选择任务日期" style="width: 150px">
                                    </div>

                                    <span id="webOverdueDay"></span>
                                    <br>
                                    <span id="designOverdueDay"></span>


                                    <span class="input-group-btn">
                                        <button type="button" class="btn btn-md btn-primary" onclick="units.search()" style="border-radius:3px;"> 搜索</button>
                                        <button type="reset" class="btn btn-md btn-primary" style="margin-left: 10px;border-radius:3px;"
                                                name="resetBtn"> 重置</button>
                                       <button type="button" class="btn btn-md btn-primary"
                                               style="margin-left: 10px;border-radius:3px;"
                                               onclick="units.export()"> 导出</button>
                                    </span>
                                </div>
                            </div>
                        </form>
                        <hr>

                        <div class="table-responsive">
                            <table id="table" class="table table-condensed" data-mobile-responsive="true"></table>
                            <div style="text-align: right;font-weight: bold;display: none" id="totalScore"> 分数:
                                <span id="num"></span>
                                <span id="type"></span>
                            </div>
                        </div>
                    </div>
                </div>

            </div>
        </div>
    </body>
@endsection
@section('footer')

    <script src="{{asset('js/plugins/layDate-v5.0.9/laydate/laydate.js')}}"></script>
    <script>
        $(function () {
            laydate.render({
                elem: '#insert_date',
                type: 'date'
            });
        });
        var units = {
            search: function () {
                tips.selectPage();
            },
            export: function () {
                var formValues = tips.getFormValues("#searchForm");
                var str = $.param(formValues);
                window.open('/admin/plan/week-task/history-export?' + str)
            },

            save: function (id) {
                var check_score = $('#check_score' + id).val();
                var url = '/admin/plan/week-task/history-update/' + id;
                var type = 'get';
                var ajaxConfig = {
                    url: url,
                    type: type,
                    data: {check_score: check_score},
                    success: function (result) {
                        layer.msg(result.message, {icon: 6, time: 1500}, function () {
                            tips.closeParentLayer();
                            window.parent.tips.tableRefresh('#table');
                        });
                    }
                };
                tips.ajax(ajaxConfig);
            },
        };

        var config = {};
        config.url = '/admin/plan/week-task/history';
        config.pageSize = 500;

        config.columns = [ //字段
            {title: '时间', field: 'insert_date', align: 'center'},
            {title: '用户', field: 'username', align: 'center'},
            {title: '类型', field: 'role_type', align: 'center'},
            {title: '任务描述', field: 'describe', align: 'center'},
            {title: '负责人', field: 'dutyName', align: 'center'},
            {title: '设计', field: 'designerName', align: 'center'},
            {title: '前端', field: 'webName', align: 'center'},
            {title: '检查类型', field: 'cond_name', align: 'center'},
            {title: '截止时间', field: 'deadline', align: 'center'},
            {title: '逾期时长', field: 'beOverdueDay', align: 'center'},
            {title: '状态', field: 'statusTitle', align: 'center'},
            {title: '完成时间', field: 'complete', align: 'center'},
            {title: '完成逾期时长', field: 'completeBeOverdueDay', align: 'center'},
            {title: '备注', field: 'remark', align: 'center',width: '100px'},
            {
                title: '检查反馈', field: 'cond_item_id', align: 'center',width: '170px',
                formatter: function (value, row) {
                    var str = '';
                    str += '' +
                        '<select class="form-control" id="check_score' + row.id + '">' +
                        '<option value="0">未评分</option>' +
                        '<option value="1">非常满意</option>' +
                        '<option value="2">满意</option>' +
                        '<option value="3">一般</option>' +
                        '</select><button onclick="units.save(' + row.id + ')" class="btn btn-primary" style="border-radius:3px;">确定</button>';
                    str += '<script>' +
                        '$("#check_score' + row.id + '").val(' + row.check_score + ')';
                    str += '<\/script>';

                    return str;
                },
                cellStyle: function () {
                    return {css: {'display': 'flex'}};
                }
            },
        ];

        config.onLoadSuccess = function (data) {
            var totalScore = data.totalScore;
            var listCount = data.listCount;
            if (typeof totalScore === 'number') {
                $("#totalScore").show();
                $("#num").text(totalScore);
                $("#type").text(listCount);
            } else {
                $("#totalScore").hide();
            }
            var webOverdueDay = data.webOverdueDay;
            var webTask = data.webTask;

            var designOverdueDay = data.designOverdueDay;
            var designTask = data.designTask;

            $("#webOverdueDay").text('前端已完成任务延期总天数:'+webOverdueDay+',逾期任务总数:'+webTask);
            $("#designOverdueDay").text('设计已完成任务延期总天数:'+designOverdueDay+',逾期任务总数:'+designTask);
        };
        tips.bootstrapTable(config);


    </script>
@endsection