搜索页成功拿到数据

6 years ago · 320bf02209
5 changed files with 135 additions and 1 deletions
--- a/controllers/UPageController.go
+++ b/controllers/UPageController.go
@ -0,0 +1,11 @@
 package controllers
 import "github.com/astaxie/beego"
 type UPageController struct {
 	beego.Controller
 }
 func (this *UPageController) SearchPage() {
 	this.TplName = "search.html"
 }
--- a/routers/UPageRouter.go
+++ b/routers/UPageRouter.go
@ -0,0 +1,10 @@
 package routers
 import (
 	"beeblog/controllers"
 	"github.com/astaxie/beego"
 )
 func init() {
 	beego.Router("/search", &controllers.UPageController{}, "get:SearchPage")
 }
--- a/static/css/common.css
+++ b/static/css/common.css
@ -614,3 +614,48 @@ img {
    color: red;
    padding: 2px 5px;
 }
 .search-root{
    margin-top: 50px;
 }
 .search-root  .input-class{
    display: table;
    border-collapse: separate;
 }
 .search-root .input-class{
    width: 50%;
    height: 32px;
    margin: 18px auto;
    display: flex;
 }
 .search-root .input-class input{
    flex: 1;
    height: 36px !important;
    padding: 2px 14px;
    font-size: 12px;
    line-height: 1.5;
    border-radius: 3px;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    display: table-cell;
    border: 1px solid #3385ff;
 }
 .search-root .input-class .input-group-addon{
    color: #555;
    height: 36px;
    line-height: 36px !important;
    font-size: 17px !important;
    font-size: 12px;
    padding: 2px 14px;
    line-height: 36px;
    border-radius: 3px;
    display: table-cell;
    background-color: #3385ff;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    color: #fff;
    border: 1px solid #3385ff;
    border-left: none;
    cursor: pointer;
 }
--- a/views/T.header.tpl
+++ b/views/T.header.tpl
@ -13,5 +13,6 @@
    <script type="text/javascript" src="/static/js/layer.js"></script>
    <link rel="stylesheet" href="/static/layui/css/layui.css">
    <script type="text/javascript" src="/static/layui/layui.js"></script>
-    <link type="text/css" rel="styleSheet" href="/static/css/common.min.css"/>
+<!--    <link type="text/css" rel="styleSheet" href="/static/css/common.min.css"/>-->
    <link type="text/css" rel="styleSheet" href="/static/css/common.css"/>
 {{end}}
--- a/views/search.html
+++ b/views/search.html
@ -0,0 +1,67 @@
 {{template "header" .}}
 <meta name="keywords" content="码农随笔,个人随笔,博客,个人博客,个人笔记,技术博客,免费云笔记,云笔记,随笔,IT博客,谷歌地图,码农笔录,aiprose">
 <title>搜索 - 码农随笔</title>
 </head>
 <body>
 <div class="root-container">
    {{template "nav" .}}
    <div class="search-root">
        <div>
            <div>
                <div class="input-group input-class">
                    <input type="text" class="form-control" placeholder="请输入关键字" aria-describedby="sizing-addon1"
                           id="searchVal">
                    <span class="input-group-addon" id="searchBtn">搜索</span>
                </div>
            </div>
        </div>
        <div>
        </div>
    </div>
 </div>
 </body>
 <script>
    var searchParms = {
        from: 0,
        size: 20,
        query: {
            multi_match: {
                query: "linux",
                // type: "best_fields",
                fields: ["Title", "BlogHtml"]
            }
        }
    }
    $(function () {
        $("#searchBtn").click(function () {
            var searchVal = $("#searchVal").val()
            if (!searchVal || searchVal.trim().length == 0) {
                layer.msg("请输入查询内容")
            }
            var stringify = JSON.stringify(searchParms);
            $.ajax({
                url: "http://47.98.109.5:8209/beeblog/beeblog/_search",    //请求的url地址
                headers:{'Content-Type':'application/json;charset=utf8'},
                dataType: "json",   //返回格式为json
                async: true,//请求是否异步，默认为异步，这也是ajax重要特性
                data: stringify,    //参数值
                type: "POST",   //请求方式
                beforeSend: function () {
                    //请求前的处理
                },
                success: function (resp) {
                    debugger
                    //请求成功时处理
                },
                complete: function () {
                    //请求完成的处理
                },
                error: function () {
                    //请求出错处理
                }
            })
        })
    })
 </script>
 </html>