%fa:search%
%fa:spinner .pulse .fw%
@@ -21,33 +21,34 @@ import Vue from 'vue';
import Progress from '../../../common/scripts/loading';
import parse from '../../../common/scripts/parse-search-query';
-const limit = 30;
+const limit = 20;
export default Vue.extend({
- props: ['query'],
data() {
return {
fetching: true,
moreFetching: false,
+ existMore: false,
offset: 0,
posts: []
};
},
+ watch: {
+ $route: 'fetch'
+ },
computed: {
empty(): boolean {
return this.posts.length == 0;
+ },
+ q(): string {
+ return this.$route.query.q;
}
},
mounted() {
- Progress.start();
-
document.addEventListener('keydown', this.onDocumentKeydown);
window.addEventListener('scroll', this.onScroll);
- (this as any).api('posts/search', parse(this.query)).then(posts => {
- this.posts = posts;
- this.fetching = false;
- });
+ this.fetch();
},
beforeDestroy() {
document.removeEventListener('keydown', this.onDocumentKeydown);
@@ -61,16 +62,38 @@ export default Vue.extend({
}
}
},
+ fetch() {
+ this.fetching = true;
+ Progress.start();
+
+ (this as any).api('posts/search', Object.assign({
+ limit: limit + 1,
+ offset: this.offset
+ }, parse(this.q))).then(posts => {
+ if (posts.length == limit + 1) {
+ posts.pop();
+ this.existMore = true;
+ }
+ this.posts = posts;
+ this.fetching = false;
+ Progress.done();
+ });
+ },
more() {
- if (this.moreFetching || this.fetching || this.posts.length == 0) return;
+ if (this.moreFetching || this.fetching || this.posts.length == 0 || !this.existMore) return;
this.offset += limit;
this.moreFetching = true;
- return (this as any).api('posts/search', Object.assign({}, parse(this.query), {
- limit: limit,
+ return (this as any).api('posts/search', Object.assign({
+ limit: limit + 1,
offset: this.offset
- })).then(posts => {
- this.moreFetching = false;
+ }, parse(this.q))).then(posts => {
+ if (posts.length == limit + 1) {
+ posts.pop();
+ } else {
+ this.existMore = false;
+ }
this.posts = this.posts.concat(posts);
+ this.moreFetching = false;
});
},
onScroll() {
diff --git a/src/web/app/mobile/views/components/post-detail.vue b/src/web/app/mobile/views/components/post-detail.vue
index 05138607f..a83744ec4 100644
--- a/src/web/app/mobile/views/components/post-detail.vue
+++ b/src/web/app/mobile/views/components/post-detail.vue
@@ -39,6 +39,9 @@
+
+ {{ tag }}
+
@@ -346,10 +349,7 @@ export default Vue.extend({
font-size 1.1em
color #717171
- > .dummy
- display none
-
- mk-url-preview
+ .mk-url-preview
margin-top 8px
> .channel
@@ -364,6 +364,28 @@ export default Vue.extend({
font-style oblique
color #a0bf46
+ > .tags
+ > *
+ margin 0 8px 0 0
+ padding 0 8px 0 16px
+ font-size 90%
+ color #8d969e
+ background #edf0f3
+ border-radius 4px
+
+ &:before
+ content ""
+ display block
+ position absolute
+ top 0
+ bottom 0
+ left 4px
+ width 8px
+ height 8px
+ margin auto 0
+ background #fff
+ border-radius 100%
+
[data-is-me]:after
content "you"
padding 0 4px
diff --git a/src/web/app/mobile/views/pages/search.vue b/src/web/app/mobile/views/pages/search.vue
index b6e114a82..cbab504e3 100644
--- a/src/web/app/mobile/views/pages/search.vue
+++ b/src/web/app/mobile/views/pages/search.vue
@@ -1,10 +1,10 @@
- %fa:search% {{ query }}
+ %fa:search% {{ q }}
- {{ '%i18n:mobile.tags.mk-search-posts.empty%'.replace('{}', query) }}
-