<%--
  Created by IntelliJ IDEA.
  User: WIN10
  Date: 2021/12/4
  Time: 17:13
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>百度搜索</title>
</head>
<body>
<link rel="stylesheet" href="<%=request.getContextPath()%>/comm/plugins/jqgrid/css/ui.jqgrid.css">
<link rel="stylesheet" href="<%=request.getContextPath()%>/style/bootstrap.css">
<link rel="stylesheet" type="text/css" href="<%=request.getContextPath()%>/style/cupertino/jquery-ui-1.7.2.custom.css" />
<link rel="stylesheet" href="<%=request.getContextPath()%>/style/style.css">
<link rel="stylesheet" href="<%=request.getContextPath()%>/style/main.css">
<link rel="stylesheet" href="<%=request.getContextPath()%>/style/framestyle.css">

<script type="text/javascript" src="<%=request.getContextPath()%>/comm/site.js"></script>
<script type="text/javascript" src="<%=request.getContextPath()%>/comm/dialog.js"></script>
<script type="text/javascript" src="<%=request.getContextPath()%>/comm/eb.grid.js"></script>
<script type="text/javascript" src="<%=request.getContextPath()%>/comm/ckeditor/ckeditor.js"></script>
<script type="text/javascript" src="<%=request.getContextPath()%>/comm/ckfinder/ckfinder.js"></script>
<script type="text/javascript" src="<%=request.getContextPath()%>/comm/jquery/jquery-1.8.3.js"></script>

<script type="text/javascript" src="<%=request.getContextPath()%>/comm/plugins/jquery/jquery-1.7.2.min.js" ></script>
<script type=text/javascript   src="<%=request.getContextPath()%>/comm/plugins/mras/My97DatePicker/WdatePicker.js"></script>
<script type="text/javascript" src="<%=request.getContextPath()%>/comm/plugins/bootstrap.js" ></script>
<script type="text/javascript" src="<%=request.getContextPath()%>/comm/plugins/template.js" ></script>
<script type="text/javascript" src="<%=request.getContextPath()%>/comm/plugins/mras/jquery.jqGrid-4.3.1/js/jquery.jqGrid.src.js" ></script>
<script type="text/javascript" src="<%=request.getContextPath()%>/comm/plugins/jqgrid/js/i18n/grid.locale-en.js" ></script>
<script type="text/javascript" src="<%=request.getContextPath()%>/comm/plugins/calendar/calendar.js"></script>
<script type="text/javascript" src="<%=request.getContextPath()%>/comm/plugins/mras/jquery/jquery-ui-1.7.2.custom.min.js"></script>
<script type="text/javascript" src="<%=request.getContextPath()%>/comm/plugins/mras/jquery/jquery.blockUI.js"></script>
<script type="text/javascript" src="<%=request.getContextPath()%>/comm/plugins/echarts.js"></script>
<script type="text/javascript" src="<%=request.getContextPath()%>/comm/plugins/highcharts-5.0.7/highcharts.js" ></script>
<script type="text/javascript" src="<%=request.getContextPath()%>/comm/plugins/highcharts-5.0.7/highcharts-3d.js" ></script>
<script>
    $(document).ready(function() {
        // baiduGrid();
        $(".site-query").click(function(){
            baiduGrid();
        });
        $("#form_submit").click(function(){
            // searchKeyWord();
            baiduGrid();
        });


    });
    function searchKeyWord(){
        var keywords=$(".keywords").val().replace(/\s*/g,"");
        $.ajax({
            url:"keywordsearch",
            type:"get",
            dataType:"json",
            headers:{'Content-Type':'application/json;charset=utf8'},
            data:{keywords:keywords},
            beforeSend: function(XMLHttpRequest){
                loading('数据读取中...',$("#baiduGrid"));
            },
            error: function (XMLHttpRequest, textStatus, errorThrown) {
                loadClose($("#baiduGrid"));
                if ('timeout' == textStatus)
                    alert("系统忙、请稍候再试...");
            },
            success:function(data){
                loadClose($("#baiduGrid"));
                baiduGrid();
            }

        });
    };
    function baiduGrid(){
        var keyword=$(".keywords").val().replace(/\s*/g,"");

        var opt={
            headUrl:"/search/getColumnBaidu",
            gridUrl:"/search/keywordsearch",
            // gridUrl:"/search/getPageBaiduDetail",
            data:{
                keywords:keyword
            },
            gridId:"baiduGrid",
            tableId:"baidu_table",
            pageId:"baidu_pager",
            parentDiv:"baiduOverview",
            downloadType:'0',
        }

        ajaxGridHeaders(opt);
    }


    function ajaxGridHeaders(opt){
        $.ajax({
            type: "POST",
            url: opt.headUrl,
            data: opt.data,
            cache: false,
            async : false,
            dataType: "json",
            timeout: 1000*10,
            error: function (XMLHttpRequest, textStatus, errorThrown) {
                var error = '网络连接失败...';
                if ('timeout' == textStatus) error = '系统忙...';
                var $h = $('<h3 class="warn">'+error+'<a href="#">点击这里，刷新数据</a></h3>');
                $('a',$h).click(function(){// 表头数据请求错误，提供刷新功能
                    ajaxGridHeaders(opt);
                });
                $("#"+opt.gridId).html($h);
            },
            success: function(msg){
                if( msg.success ){
                    ajaxGrid( {
                        opt: opt,
                        msg: msg
                    });
                } else {
                    $("#"+opt.gridId).html('<h3 class="warn">'+msg.msg+'</h3>');
                }
            }
        });
    }

    function ajaxGrid(opt){
        if(opt.opt.parentDiv){
            $("#"+opt.opt.parentDiv).show();
        }
        $("#"+opt.opt.gridId).html('<table id="'+opt.opt.tableId+'"></table><div id="'+opt.opt.pageId+'"></div>');
        var rowNum=10;
        $("#"+opt.opt.tableId).jqGrid({
            url: opt.opt.gridUrl,
            datatype: 'json',
            mtype: 'POST',
            async : false,
            jsonReader : {
                root: "rows",
                page: "currpage",
                total: "totalpages",
                records: "totalrecords",
                repeatitems: false,
                id: "0",
                userdata:opt.opt.userdata
            },
            grouping:opt.opt.data.grouping,
            groupingView:opt.opt.data.groupingView,
            postData: opt.opt.data,
            colNames: opt.msg.colNames,
            colModel: opt.msg.colModel,
            rowNum: rowNum,
            rownumbers: false,
            sortname:opt.opt.sortname,
            sortorder: "desc",
            pager: "#"+opt.opt.pageId,
            shrinkToFit: false,
            viewrecords: true,
            autowidth:true,
            height: 300,
            recordtext: "共{2}条记录,显示{0}-{1}",
            emptyrecords: "没有要显示的记录",
            loadtext: "",
            pgtext : "{0}/{1}页",
            beforeRequest:function(){
                loading('数据读取中...',$("#"+opt.opt.tableId));
            },
            loadError:function(){
                loadClose($("#"+opt.opt.tableId));
                var $h = $('<div class="warn"><a href="javascript:;">数据读取失败，请点击重试...<a></div>');
                $("a",$h).click(function(){
                    ajaxGrid(opt);
                });
                $("#"+opt.opt.tableId).parent().append($h);
            },
            loadComplete:function(){
                loadClose($("#"+opt.opt.tableId));
                var grid = $("#"+opt.opt.tableId);
                var ids = grid.getDataIDs();
                for (var i = 0; i < ids.length; i++) {   //重写表高度
                    grid.setRowData ( ids[i], false, {height: 30} );
                    $("#siteGrid .ui-jqgrid-labels").css("cssText","height:30px;");
                }
            },
            gridComplete:function(){
                loadClose($("#"+opt.opt.tableId));
                $("#"+opt.opt.tableId).width($("#"+opt.opt.tableId).width()+1);//调整对齐
                var records  = $("#"+opt.opt.tableId).getGridParam('records');
                //	添加数据操作
                if( records && records > 0 ){
                    var _ids  = jQuery("#baidu_table").jqGrid('getDataIDs');  ///获得jqgrid行数
                    $(_ids).each(function(i, n) {
                        var _html = '';
                        var _auth = jQuery("#baidu_table").jqGrid('getCell', n, 'func');

                        _html += ('<a class="dv-func-opt icon-detail btn-opt"  val="'+n+'" auth="'+_auth+'" title="" >详情</a>');
                        _html += ('<a class="dv-func-opt icon-delete btn-opt"  val="'+n+'" title="" >删除</a>');

                        jQuery("#site_table").jqGrid('setRowData', n, { func: _html });
                    });
                    var $t = $(this).parent().parent();
                    $('.dv-func-opt').click(function(){
                        var $t = $(this).parent().parent();
                        var sid=$t.attr('id');
                        var flag=0; //0:删除，1：更新，2：验证
                        if($(this).attr('class').indexOf('icon-detail')>-1){
                            flag=1;
                        }
                        if($(this).attr('class').indexOf('icon-delete')>-1){
                            flag=0;
                        }
                    });

                }else{
                    $('#my_grid_task').parent().append('<div class="norecords">没有符合条件的记录</div>');
                }

            }
        });
    }
    function loading(msg,obj){
        /**********************************
         * 数据加载时提示
         * 使用需要加载BlockUI插件
         * 输入：
         *	msg：		提示信息
         ***********************************/
        //	先去除之前的提示
        //alert(msg);
        loadClose(obj);
        var msg = '<span style="margin-left:10px;font-size:14px;color:#0b92e8;font-family:Microsoft Yahei;">'+msg+'</span>';
        var img = '<img src="<%=request.getContextPath()%>/images/loading.gif"  style="margin:0px auto 10px;" />';
        var opt={
            message: img+'<h6> '+msg+' </h6>',
            baseZ: '9980',
            css: {
                border: 'none',
                padding: '15px',
                backgroundColor: 'transparent',
                width:'500px',
                height:'100px',
                color: '#fff',
                left:'30%'
            },
            overlayCSS: {
                backgroundColor: '#E6E6E6'
            }
        };
        if(obj!=undefined&&obj!==""){
            jQuery(obj).block(opt);
        }else{
            jQuery.blockUI(opt);
        }
    }

    function loadClose(obj){
//	加载结束时的动画
//	使用需要加载BlockUI插件
        if(obj!=undefined&&obj!=""){
            jQuery(obj).unblock();
        }else{
            jQuery.unblockUI();
        }
    }
</script>
<style>
    #baiduGrid{
        margin-top: 20px;
    }
    .sub-content{
        height: 542px;
        margin: auto;
        margin-top: 50px;
    }
    .ui-jqgrid{
        margin-top: -20px;
    }
    .dialog-sub{padding-top:0px;}
    .dialog-sub p{
        height:30px;
        margin-top:16px;
    }
    .dialog-sub label{
        display:inline-block;
        vertical-align:middle;
        width:120px;
        text-align:right;
        margin-right: 20px;
    }
    .dialog-sub select{margin-bottom:0;font-family:微软雅黑;}
    .dia_msg{color:red;}
    .isreport{
        width:12px;
        margin-left:50px;
        height:10px;
    }
    .dialogmsg{
        height: 28px;
        border: 1px solid #dddddd;
        border-radius: 3px;
        width: 308px;
        padding-left:10px;
    }
    .dia_msg{color:red;}

    .btn-opt, .btn-opt:visited, .btn-opt:active, .btn-opt:focus {
        margin-left: 5px;
        line-height: 26px;
        color: #168EF8 !important;
        min-width: 25px;
        height: 26px;
        padding: 0 8px;
        font-size: 13px;
        background-color: #fff;
        background-image: none;
        border: 0px;
        cursor:pointer;
        text-shadow: none;
        font-family: 微软雅黑;
    }
    .btn-dis{
        color: #C4C4C4 !important;
        pointer-events:none;
    }
    .adddiver{
        float:right;
        width:72px;
        height:28px;
        background-color: #168EF8 !important;
        margin-right: 10px;
        margin-top:6px;
    }
    .grid-title{
        height:40px;
    }
    .msg-content{
        height:40px;
        text-align:center;
        margin-top:40px;
        font-family: 微软雅黑;
        font-size: 12px;

    }

    .ui-dialog .ui-dialog-buttonpane button{
        float:none;
        margin-left:10px;
        background-color: #3A9EDE;
    }
    .ui-dialog .ui-dialog-buttonpane{
        border:0;
        height:52px;
        text-align:center;
    }
    .grid-title .btn{
        padding:0px;
    }
    /*导航烂*/
    .ulbar .libar:nth-child(2){
        color: #5584FF;
        text-decoration: none;
        border-bottom: 3px solid #5584ff;
    }
    a:hover, a:focus{
        color: #737374;
        text-decoration: none;
    }

    .formulbar{
        background: url("<%=request.getContextPath()%>/images/opinion-nav-bg.png") repeat 0px 0px;
        height:55px;
        width:100%;
    }
    .formulbar .ulbar{
        margin-left:30px;
    }
    .formulbar .libar{
        float: left;
        color:rgb(51, 51, 51);
        font-size:13px;
        font-weight: bold;
        width: 110px;
        margin-right:20px;
        height: 50px;
        text-align: center;
        line-height: 50px;
    }
    .formulbar .libar a{
        display: inline-block;
        width: 110px;
        height: 50px;
        color: #333333;
        text-decoration: none;
    }
    .formulbar .libar a:hover, a:focus {
        color: #5584FF;
        text-decoration: none;
        border-bottom: 3px solid #5584ff;
    }
</style>


<div id="baiduOverview" class="sub-content">
    <div class="formulbar">
        <ul class="ulbar">
            <li class="libar" ><a  href="/site/siteList">站点模板</a></li>
            <li class="libar"><a href="/search/baiduword"  class="active" >百度搜索测试</a></li>
            <li class="libar" ><a href="/needsite/list">测试问题站点记录</a></li>

        </ul>
    </div>
    <div id="marketformance" style="min-height:80px; ">
        <form id="my_form"  style="height:60px;margin-top: 10px; padding-left: 10px; ">
            <div>
                <label ><b>关键词</b></label>
                <textarea class="keywords" rows="1" cols="50" style="width: 525px; height: 45px;"></textarea>
                <a id="form_submit" href="#" class="btn inputsty" icon="icon-ok" >搜索解析</a>
            </div>
        </form>
    </div>
    <div class="sub-title">
        <span>百度搜索结果</span>
    </div>
    <div style="float:right; display: inline-block;margin-top:5px;">
        <%--<span style="margin-left:10px;">关键词：</span>
        <input type="text" name="baidu_keyword" placeholder="关键词" style="width:250px;height:30px; margin-left:10px;">
        <a class="title-btn site-query" href="javascript:;" style="margin-left:10px;">查询</a>--%>
    </div>
    <div id="baiduGrid" class="grid-div" style="height: 450px; ">
    </div>

</div>
</body>

</html>
