@extends('admin/layout')
@section('header')
    <link href="{{asset('css/plugins/switchery/switchery.css')}}" rel="stylesheet">

@endsection

@section('content')
    @php   $authUser=auth()->user() @endphp
    <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="input-group">

                                <select name="optimizerId" id="optimizerId" title="" class="form-control"
                                        style="width: 150px;float: right"
                                        onchange="units.selectPage();">
                                    <option value="">请选择优化组长</option>
                                    @foreach($optimizers as $item)
                                        <option value="{{$item->id}}">{{$item->nickname}}</option>
                                    @endforeach
                                </select>
                                <select name="sellerId" id="sellerId" title="" class="form-control"
                                        style="width: 150px;float: right"
                                        onchange="units.selectPage();">
                                    <option value="">请选择销售</option>
                                    @foreach($seller as $item)
                                        <option value="{{$item->id}}">{{$item->nickname}}</option>
                                    @endforeach
                                </select>
                                <select name="enable" id="enable" title="" class="form-control"
                                        style="width: 150px;float: right"
                                        onchange="units.selectPage();">
                                    <option value="">请选择关键状态</option>
                                    <option value="0">启用</option>
                                    <option value="1">禁用</option>
                                </select>

                                <input type="text" placeholder="请输入关键词" class="input-md form-control"
                                       name="keyword" id="keyword" style="width: 150px;float: right">
                                <span class="input-group-btn">
                                    <button type="button" class="btn btn-md btn-primary"
                                            onclick="units.search()"> 搜索</button>
                                    <button type="button" class="btn btn-md btn-primary" style="margin-left: 10px"
                                            name="btnReset"> 重置</button>
                                    <button type="button" class="btn btn-md btn-primary"
                                            onclick="units.importKeyword()" style="margin-left: 10px">
                                        导入关键词
                                    </button>
                                </span>
                            </div>

                        </form>
                        <hr>
                        <span style="font-weight:bold">总数:{{$disabled+$enable}} 禁用:{{$disabled}} 启用:{{$enable}}</span>
                        <div class="table-responsive">
                            <table id="table" class="table table-condensed" data-mobile-responsive="true"></table>
                        </div>

                    </div>
                </div>
            </div>

        </div>
    </div>
    </body>
@endsection
@section('footer')
    <script>
        var units = {
            importKeyword: function () {
                var str =
                    '<div class="ibox-content" id="importLayer">' +
                    '<form class="form-horizontal">' +
                    '<div class="form-group">' +
                    '<label class="col-sm-3 control-label">请选择excel文件:</label>' +
                    '<div class="col-sm-6">' +
                    '<input type="file" id="excel_file" class="form-control">' +
                    '<input type="hidden" id="excel_path">' +
                    '</div>' +
                    '<div class="col-sm-2"><button class="btn btn-info" type="button" onclick="units.fileUpload()">上传</button></div>' +
                    '</div>' +
                    ' <div class="form-group">' +
                    '<div class="col-sm-6 col-sm-offset-3">' +
                    '<a href="{{asset('tpl/google_trends_keyword_template.xls')}}">请下载导入模板</a>' +
                    '</div>' +
                    '</div>' +
                    '</form>' +
                    '</div>';
                openIndex = layer.open({
                    type: 1,
                    content: str,
                    area: ['60%', '30%'],
                    title: '导入关键词'
                });
            },
            fileUpload: function () {
                var config = {
                    url: '/admin/tool/excel-upload'
                };
                config.success = function (result) {
                    var data = {excel_path: result.data.file_url};
                    var config = {
                        url: '/admin/googleTrends/importKeyWord',
                        type: 'post',
                        data: data,
                        success: function (result) {
                            layer.msg(result.message, {icon: 6, time: 1500}, function () {
                                layer.close(openIndex);
                                window.location.reload();
                            });
                        }
                    };
                    tips.ajax(config);
                };
                tips.fileUpload($("#excel_file"), config);
            },
            save: function (id) {
                layer.open({
                    type: 2,
                    content: ['/admin/googleTrends/keywordSave/' + id],
                    area: ['65%', '65%'],
                    title: '保存'
                });
            },
            selectPage: function () {
                tips.selectPage();
            },
            search: function () {
                tips.selectPage();
            },
            taskUpdate: function (id) {
                var userId = $('#userId' + id).val();
                var url = '/admin/googleTrends/keywordTask';
                var type = 'post';
                var ajaxConfig = {
                    url: url,
                    type: type,
                    data: {userId: userId, taskId: id},
                    success: function (result) {
                        layer.msg(result.message, {icon: 6, time: 1500}, function () {
                            tips.tableRefresh('#table');
                        });
                    }
                };
                tips.ajax(ajaxConfig);
            },
            deleteKeyword: function (id) {

                layer.confirm('确定要删除吗?', {icon: 3, title: '删除信息'}, function (index, layero) {
                    layer.close(index);
                    var url = '/admin/googleTrends/deleteKeyword';
                    var type = 'post';
                    var ajaxConfig = {
                        url: url,
                        type: type,
                        data: {taskId: id},
                        success: function (result) {
                            layer.msg(result.message, {icon: 6, time: 1500}, function () {
                                tips.tableRefresh('#table');
                            });
                        }
                    };
                    tips.ajax(ajaxConfig);
                });
            },
            detail: function (keyWold) {
                window.open("/admin/googleTrends/index?keyWold=" + keyWold, "_blank");
            }
        };

        var config = {};
        config.url = '/admin/googleTrends/keyword';
        config.pageSize = 20;
        config.showColumns = true;
        config.columns = [
            {
                title: '序号', align: 'center', formatter: function (value, item, index) {
                    return index + 1;
                },
                width: '10px'
            },
            {
                title: '英文关键词', field: 'keyword', align: 'center',
                formatter: function (value, row) {
                    return "<a href='javascript:;' onclick='units.detail(\"" + value + "\")'>" + value + "</a>"
                }
            },
            {title: '中文关键词', field: 'cn_keyword', align: 'center'},
            {
                title: '状态', field: 'enable', align: 'center',
                formatter: function (value, row) {
                    if (row.enable === 1) {
                        return '<span style="color:#d0648a">禁用</span>';
                    } else {
                        return '<span style="color:#009688">启用</span>';
                    }
                }
            },
            {title: '客户网站', field: 'website', align: 'center'},
            {title: '接单条件', field: 'order_conditions', align: 'center'},
            {title: '每月搜索量', field: 'monthly_searches', align: 'center'},
            {title: '搜索结果数', field: 'mumber_of_search_results', align: 'center'},
            {title: '竞争指数', field: 'competition_index', align: 'center'},
            {title: '提交人', field: 'user', align: 'center'},
            {title: '创建时间', field: 'created_at', align: 'center'},
            {title: '更新时间', field: 'updated_at', align: 'center'},
            {
                title: '操作', field: 'id', align: 'center',
                formatter: function (value, row) {
                    return '<button onclick="units.save(' + row.id + ')" class="btn btn-xs"><span class="glyphicon glyphicon-edit"></span>编辑</button>';
                }
            },
            {
                title: '任务状态', field: 'taskStatus', align: 'center',
                formatter: function (value, row) {
                    if (row.taskStatus === '完成') {
                        return '<span style="color:#009688">完成</span>';
                    }
                    if (row.taskStatus === '未完成') {
                        return '<span style="color:#d0648a">未完成</span>';
                    }
                    return '<span style="color:#d0648a"></span>';
                }
            },
            {
                title: '任务分配', field: 'id', align: 'center', width: '260px',
                formatter: function (value, row) {
                    return '' +
                        '<select class="form-control" id="userId' + row.id + '">' +
                        '<option value="0">请选择优化师</option>' +
                        @foreach($optimizers as $item)
                            '<option value="{{$item->id}}">{{$item->nickname??''}}</option>' +
                        @endforeach
                            '</select>' +
                        '<button onclick="units.taskUpdate(' + row.id + ')" class="btn btn-md btn-primary">确定</button>' +
                        '<button onclick="units.deleteKeyword(' + row.id + ')" class="btn btn-md btn-danger">删除</button>' +
                        '<script>' +
                        '$("#userId' + row.id + '").val(' + row.principal + ')' +
                        '<\/script>';
                },
                cellStyle: function () {
                    return {css: {'display': 'flex'}};
                }
            }
        ];
        tips.bootstrapTable(config);


    </script>
@endsection