1
0

Refactoring

This commit is contained in:
syuilo
2019-05-21 03:07:11 +09:00
parent 262d5ead51
commit 5511b6e013
41 changed files with 764 additions and 1408 deletions
@@ -1,86 +0,0 @@
<template>
<mk-ui>
<template #header><span style="margin-right:4px;"><fa icon="star"/></span>{{ $t('@.favorites') }}</template>
<main>
<sequential-entrance animation="entranceFromTop" delay="25">
<template v-for="favorite in favorites">
<mk-note-detail class="post" :note="favorite.note" :key="favorite.note.id"/>
</template>
</sequential-entrance>
<ui-button v-if="existMore" @click="fetchMore()">{{ $t('@.load-more') }}</ui-button>
</main>
</mk-ui>
</template>
<script lang="ts">
import Vue from 'vue';
import i18n from '../../../i18n';
import Progress from '../../../common/scripts/loading';
export default Vue.extend({
i18n: i18n(),
data() {
return {
fetching: true,
favorites: [],
existMore: false,
moreFetching: false
};
},
created() {
this.fetch();
},
mounted() {
document.title = `${this.$root.instanceName} | ${this.$t('@.favorites')}`;
},
methods: {
fetch() {
Progress.start();
this.fetching = true;
this.$root.api('i/favorites', {
limit: 11
}).then(favorites => {
if (favorites.length == 11) {
this.existMore = true;
favorites.pop();
}
this.favorites = favorites;
this.fetching = false;
Progress.done();
});
},
fetchMore() {
this.moreFetching = true;
this.$root.api('i/favorites', {
limit: 11,
untilId: this.favorites[this.favorites.length - 1].id
}).then(favorites => {
if (favorites.length == 11) {
this.existMore = true;
favorites.pop();
} else {
this.existMore = false;
}
this.favorites = this.favorites.concat(favorites);
this.moreFetching = false;
});
}
}
});
</script>
<style lang="stylus" scoped>
main
> * > .post
margin-bottom 8px
@media (min-width 500px)
> * > .post
margin-bottom 16px
</style>
@@ -1,61 +0,0 @@
<template>
<mk-ui>
<template #header><span style="margin-right:4px;"><fa :icon="faNewspaper"/></span>{{ $t('@.featured-notes') }}</template>
<main>
<sequential-entrance animation="entranceFromTop" delay="25">
<template v-for="note in notes">
<mk-note-detail class="post" :note="note" :key="note.id"/>
</template>
</sequential-entrance>
</main>
</mk-ui>
</template>
<script lang="ts">
import Vue from 'vue';
import i18n from '../../../i18n';
import Progress from '../../../common/scripts/loading';
import { faNewspaper } from '@fortawesome/free-solid-svg-icons';
export default Vue.extend({
i18n: i18n(''),
data() {
return {
fetching: true,
notes: [],
faNewspaper
};
},
created() {
this.fetch();
},
methods: {
fetch() {
Progress.start();
this.fetching = true;
this.$root.api('notes/featured', {
limit: 30
}).then(notes => {
notes.sort((a, b) => new Date(b.createdAt).getTime() - new Date(a.createdAt).getTime());
this.notes = notes;
this.fetching = false;
Progress.done();
});
},
}
});
</script>
<style lang="stylus" scoped>
main
> * > .post
margin-bottom 8px
@media (min-width 500px)
> * > .post
margin-bottom 16px
</style>
@@ -7,7 +7,7 @@
</div>
</ui-container>
<mk-notes ref="timeline" :make-promise="makePromise" @inited="() => $emit('loaded')"/>
<mk-notes ref="timeline" :pagination="pagination" @inited="() => $emit('loaded')"/>
</div>
</template>
@@ -15,8 +15,6 @@
import Vue from 'vue';
import i18n from '../../../i18n';
const fetchLimit = 10;
export default Vue.extend({
i18n: i18n('mobile/views/pages/home.timeline.vue'),
@@ -43,7 +41,7 @@ export default Vue.extend({
},
query: {},
endpoint: null,
makePromise: null
pagination: null
};
},
@@ -110,25 +108,14 @@ export default Vue.extend({
this.connection.on('mention', onNote);
}
this.makePromise = cursor => this.$root.api(this.endpoint, {
limit: fetchLimit + 1,
untilDate: cursor ? undefined : (this.date ? this.date.getTime() : undefined),
untilId: cursor ? cursor : undefined,
...this.baseQuery, ...this.query
}).then(notes => {
if (notes.length == fetchLimit + 1) {
notes.pop();
return {
notes: notes,
more: true
};
} else {
return {
notes: notes,
more: false
};
}
});
this.pagination = {
endpoint: this.endpoint,
limit: 10,
params: init => ({
untilDate: init ? undefined : (this.date ? this.date.getTime() : undefined),
...this.baseQuery, ...this.query
})
};
},
methods: {
+11 -26
View File
@@ -3,7 +3,7 @@
<template #header><fa icon="search"/> {{ q }}</template>
<main>
<mk-notes ref="timeline" :make-promise="makePromise" @inited="inited"/>
<mk-notes ref="timeline" :pagination="pagination" @inited="inited"/>
</main>
</mk-ui>
</template>
@@ -14,42 +14,27 @@ import i18n from '../../../i18n';
import Progress from '../../../common/scripts/loading';
import { genSearchQuery } from '../../../common/scripts/gen-search-query';
const limit = 20;
export default Vue.extend({
i18n: i18n('mobile/views/pages/search.vue'),
data() {
return {
makePromise: async cursor => this.$root.api('notes/search', {
limit: limit + 1,
untilId: cursor ? cursor : undefined,
...(await genSearchQuery(this, this.q))
}).then(notes => {
if (notes.length == limit + 1) {
notes.pop();
return {
notes: notes,
more: true
};
} else {
return {
notes: notes,
more: false
};
}
})
pagination: {
endpoint: 'notes/search',
limit: 20,
params: () => genSearchQuery(this, this.q)
}
};
},
watch: {
$route() {
this.$refs.timeline.reload();
}
},
computed: {
q(): string {
return this.$route.query.q;
}
},
watch: {
$route() {
this.$refs.timeline.reload();
}
},
mounted() {
document.title = `${this.$t('search')}: ${this.q} | ${this.$root.instanceName}`;
},
+7 -20
View File
@@ -3,7 +3,7 @@
<template #header><span style="margin-right:4px;"><fa icon="hashtag"/></span>{{ $route.params.tag }}</template>
<main>
<mk-notes ref="timeline" :make-promise="makePromise" @inited="inited"/>
<mk-notes ref="timeline" :pagination="pagination" @inited="inited"/>
</main>
</mk-ui>
</template>
@@ -13,30 +13,17 @@ import Vue from 'vue';
import i18n from '../../../i18n';
import Progress from '../../../common/scripts/loading';
const limit = 20;
export default Vue.extend({
i18n: i18n('mobile/views/pages/tag.vue'),
data() {
return {
makePromise: cursor => this.$root.api('notes/search-by-tag', {
limit: limit + 1,
untilId: cursor ? cursor : undefined,
tag: this.$route.params.tag
}).then(notes => {
if (notes.length == limit + 1) {
notes.pop();
return {
notes: notes,
more: true
};
} else {
return {
notes: notes,
more: false
};
pagination: {
endpoint: 'notes/search-by-tag',
limit: 20,
params: {
tag: this.$route.params.tag
}
})
}
};
},
watch: {