添加按年月搜索

This commit is contained in:
结发受长生 2019-05-18 16:18:54 +08:00
parent fedaac2d9f
commit 03df5688eb
4 changed files with 25 additions and 28 deletions

View File

@ -5,14 +5,8 @@
%>
<div class="tools-col" :class="{show:isShow,hide:!isShow}" @click="stop">
<div class="tools-nav header-menu">
<%
var count = 0
for(let menu_name in theme.smart_menu) {
if(theme.smart_menu[menu_name]) count++
}
%>
<ul style="width:70%">
<% var divide = 100 / count + '%'
<% var divide = 100 / Object.keys(theme.smart_menu).length + '%'
for (let menu_name in theme.smart_menu){
if(theme.smart_menu[menu_name]){ %>
<li style="width: <%= divide %>" @click="openSlider($event, '<%-menu_name%>')"><a href="javascript:void(0)" :class="{active:<%-menu_name%>}"><%= __(theme.smart_menu[menu_name]) %></a></li>
@ -27,6 +21,7 @@
<span :class="'search-item'" v-for="(searchItem,index) in searchItems" :key="index">
<i class="icon icon-book" v-if="searchItem.type === 'category'"></i>
<i class="icon icon-price-tags" v-if="searchItem.type === 'tag'"></i>
<i class="icon-calendar icon" v-if="searchItem.type === 'date'"></i>
{{searchItem.query}}
<i class="icon icon-close" @click="searchItems.splice(index,1)"></i>
</span>
@ -68,9 +63,9 @@
<a :href="item.path|urlformat" class="search-title"><i class="icon-quo-left icon"></i>
<span v-text="item.title"></span>
</a>
<p class="search-time">
<p class="search-time" v-if="item.date">
<i class="icon-calendar icon"></i>
<span v-text="item.date"></span>
<span v-text="item.date" @click="addSearchItem(item.date.substr(0,7),'date')"></span>
</p>
<p class="search-category" v-if="item.categories.length">
<i class="icon-book icon" ></i>

View File

@ -7,7 +7,8 @@
"aboutme": "想听听关于主人的故事吗",
"github": "发现主人出没地点!",
"weibo": "发现主人出没地点!",
"mail" : "这里是主人的联系方式",
"rss": "订阅就可以看到最新的文章啦",
"mail": "这里是主人的联系方式",
"tools.eye": "深夜时要爱护眼睛呀",
"tools.chart": "猜猜我要说些什么",
"tools.photo": "你要给我拍照呀,一二三~茄子~~",

View File

@ -248,22 +248,15 @@
}
}
/*弹性动画*/
@keyframes leftIn {
from {transform: translate3d(0, 0, 0);}
to {transform: translate3d(333px, 0, 0);}
}
%anmCommon {
animation-duration: .5s;
animation-fill-mode: both;
animation-timing-function: ease-in-out;
}
%anmLeftIn {
@extend %anmCommon;
animation-name: leftIn;
@keyframes leftIn {
from {transform: translate3d(0, 0, 0);}
to {transform: translate3d(333px, 0, 0);}
}
@keyframes leftOut {
@ -271,6 +264,11 @@
to {transform: translate3d(0, 0, 0);}
}
%anmLeftIn {
@extend %anmCommon;
animation-name: leftIn;
}
%anmLeftOut {
@extend %anmCommon;
animation-name: leftOut;
@ -281,16 +279,16 @@
to {transform: translate3d(300px, 0, 0);}
}
%anmSmallLeftIn {
@extend %anmCommon;
animation-name: smallLeftIn;
}
@keyframes smallleftOut {
from {transform: translate3d(300px, 0, 0);}
to {transform: translate3d(0, 0, 0);}
}
%anmSmallLeftIn {
@extend %anmCommon;
animation-name: smallLeftIn;
}
%anmSmallLeftOut {
@extend %anmCommon;
animation-name: smallleftOut;

View File

@ -64,6 +64,9 @@ new Vue({
}
},
addSearchItem(query, type='title') {
if(query) {
query = query.trim()
}
// 如果已存在相同的查询条件, 则不加入
var isExist = Array.prototype.some.call(this.searchItems, searchItem => {
return searchItem.query === query && searchItem.type === type
@ -74,7 +77,6 @@ new Vue({
this.search = null
},
searchKeydown(event) {
console.log(event.keyCode)
if(event.keyCode == 13){ // 回车键
this.addSearchItem(this.search)
} else if(event.keyCode == 8 && !this.search) { // 退格键
@ -97,13 +99,12 @@ new Vue({
}
},
filters: {
urlformat: (str) => {
urlformat (str) {
return (window.themeConfig && window.themeConfig.root) ? window.themeConfig.root + str : '/' + str
}
},
watch: {
searchItems (newVal, oldVal) {
console.log(newVal)
if(newVal && newVal.length) {
handleSearch.call(this, newVal)
} else {
@ -148,6 +149,8 @@ function handleSearch(searchItems) {
return Array.prototype.some.call(articleItem.categories, category => {
return category.name === searchItem.query
})
case 'date' :
return articleItem.date && ( articleItem.date.substr(0,7) === searchItem.query )
}
})
})