|
|
|
@ -10,86 +10,91 @@ |
|
|
|
<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> |
|
|
|
<i-input id="searchVal" search enter-button @on-search="searchHandler" placeholder="请输入关键字"/> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="search-result"> |
|
|
|
|
|
|
|
<div class="search-item" v-for="el in list"> |
|
|
|
<div class="search-title"> |
|
|
|
<a style="color: #28a3ef" :href="'https://www.aiprose.com/blog/' + el._source.Id " target="_blank">${el._source.Title}</a> |
|
|
|
<span> ${mtime(el._source.Ctime)}</span> |
|
|
|
</div> |
|
|
|
<p class="search-content">${el._source.BlogDesc }</p> |
|
|
|
</div> |
|
|
|
<p v-if="list.length == 0">没有搜索到相关文章</p> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</body> |
|
|
|
<script> |
|
|
|
var pageNo = 1; |
|
|
|
var pageSize = 30; |
|
|
|
// var pageNo = page; |
|
|
|
var searchParms = { |
|
|
|
from: 0, |
|
|
|
size: 20, |
|
|
|
query: { |
|
|
|
multi_match: { |
|
|
|
query: "", |
|
|
|
// type: "best_fields", |
|
|
|
fields: ["Title", "BlogHtml"] |
|
|
|
var app = new Vue({ |
|
|
|
el: ".root-container", |
|
|
|
delimiters: ['${', '}'], |
|
|
|
data: { |
|
|
|
list: [], |
|
|
|
pageNo: 1, |
|
|
|
pageSize: 30, |
|
|
|
searchParms: { |
|
|
|
from: 0, |
|
|
|
size: 20, |
|
|
|
query: { |
|
|
|
multi_match: { |
|
|
|
query: "", |
|
|
|
// type: "best_fields", |
|
|
|
fields: ["Title", "BlogHtml"] |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
}, |
|
|
|
methods: { |
|
|
|
mtime (time){ |
|
|
|
return dayjs(time).format("YYYY-MM-DD") |
|
|
|
}, |
|
|
|
searchHandler (searchVal){ |
|
|
|
var _this = this; |
|
|
|
if (!searchVal || searchVal.trim().length == 0) { |
|
|
|
this.$Message.warning('请输入查询内容'); |
|
|
|
return |
|
|
|
} |
|
|
|
this.searchParms.query.multi_match.query = searchVal; |
|
|
|
var stringify = JSON.stringify(this.searchParms); |
|
|
|
$.ajax({ |
|
|
|
url: "https://www.aiprose.com/es/search", //请求的url地址 |
|
|
|
headers: {'Content-Type': 'application/json;charset=utf8'}, |
|
|
|
dataType: "json", //返回格式为json |
|
|
|
async: true,//请求是否异步，默认为异步，这也是ajax重要特性 |
|
|
|
data: stringify, //参数值 |
|
|
|
type: "POST", //请求方式 |
|
|
|
beforeSend: function () { |
|
|
|
//请求前的处理 |
|
|
|
}, |
|
|
|
success: function (resp) { |
|
|
|
_this.list = [] |
|
|
|
if (resp.hits.total != 0) { |
|
|
|
_this.list = resp.hits.hits; |
|
|
|
} |
|
|
|
//请求成功时处理 |
|
|
|
}, |
|
|
|
complete: function () { |
|
|
|
//请求完成的处理 |
|
|
|
}, |
|
|
|
error: function () { |
|
|
|
//请求出错处理 |
|
|
|
} |
|
|
|
}) |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
}) |
|
|
|
|
|
|
|
|
|
|
|
$(function () { |
|
|
|
$("#searchVal").keypress(function (e) { |
|
|
|
if (e.which == 13) { |
|
|
|
search(); |
|
|
|
} |
|
|
|
}); |
|
|
|
$("#searchBtn").click(function () { |
|
|
|
search(); |
|
|
|
}) |
|
|
|
|
|
|
|
function search() { |
|
|
|
var searchVal = $("#searchVal").val() |
|
|
|
if (!searchVal || searchVal.trim().length == 0) { |
|
|
|
layer.msg("请输入查询内容") |
|
|
|
return |
|
|
|
} |
|
|
|
|
|
|
|
searchParms.query.multi_match.query = searchVal; |
|
|
|
var stringify = JSON.stringify(searchParms); |
|
|
|
$.ajax({ |
|
|
|
url: "https://www.aiprose.com/es/search", //请求的url地址 |
|
|
|
headers: {'Content-Type': 'application/json;charset=utf8'}, |
|
|
|
dataType: "json", //返回格式为json |
|
|
|
async: true,//请求是否异步，默认为异步，这也是ajax重要特性 |
|
|
|
data: stringify, //参数值 |
|
|
|
type: "POST", //请求方式 |
|
|
|
beforeSend: function () { |
|
|
|
//请求前的处理 |
|
|
|
}, |
|
|
|
success: function (resp) { |
|
|
|
$(".search-result").children().remove(); |
|
|
|
if (resp.hits.total != 0) { |
|
|
|
resp.hits.hits.forEach(function (el, index) { |
|
|
|
console.log(el._source) |
|
|
|
var htmlStr = '<div class=\"search-item\">\n' + |
|
|
|
' <div class=\"search-title\"><a href=\"https://www.aiprose.com/blog/' + el._source.Id + '\" target=\"_blank\">' + el._source.Title + '</a><span>' + dayjs(el._source.Ctime).format("YYYY-MM-DD") + '</span></div>\n' + |
|
|
|
' <p class=\"search-content\">' + el._source.BlogDesc + '</p>\n' + |
|
|
|
' </div>' |
|
|
|
$(".search-result").append(htmlStr) |
|
|
|
}) |
|
|
|
}else{ |
|
|
|
$(".search-result").append('<p>没有搜索到相关文章</p>') |
|
|
|
} |
|
|
|
//请求成功时处理 |
|
|
|
}, |
|
|
|
complete: function () { |
|
|
|
//请求完成的处理 |
|
|
|
}, |
|
|
|
error: function () { |
|
|
|
//请求出错处理 |
|
|
|
} |
|
|
|
}) |
|
|
|
|
|
|
|
} |
|
|
|
}) |
|
|
|
</script> |
|
|
|
|
mail_yanpeng@163.com
vor 5 Jahren
