01/02: ajout du composant Navigation qui contient aussi le order
This is an automated email from the git hooks/post-receive script. New commit to branch bow-v2-go in repository bow. See https://gitlab.nuiton.org/chorem/bow.git commit 35ab6cf446b553d582a5c3e2365254c38064f58d Author: Benjamin <poussin@codelutin.com> Date: Mon May 25 23:37:16 2020 +0200 ajout du composant Navigation qui contient aussi le order --- pkg/repository/bookmarkRepository.go | 2 +- web/src/components/Navigation.vue | 76 ++++++++++++++++++++++++++++++++++++ web/src/main.js | 27 +++++++++---- web/src/views/Home.vue | 19 ++------- 4 files changed, 100 insertions(+), 24 deletions(-) diff --git a/pkg/repository/bookmarkRepository.go b/pkg/repository/bookmarkRepository.go index 5cac40b..a940c0a 100644 --- a/pkg/repository/bookmarkRepository.go +++ b/pkg/repository/bookmarkRepository.go @@ -52,7 +52,7 @@ func BookmarkJSON(currentUser model.BowUser, id string, uri string, tags []strin tagsJoined := strings.Join(tags, ",") q := &query{sql: fmt.Sprintf(`WITH __query AS (%[5]s), - __info AS (select %[3]d as first, %[4]d as limit, count(id) as total, '%[1]s' as orderby, to_json('%[2]s' = 'asc') as orderasc, string_to_array($1, ',') as tags, $2::TEXT as fulltext, $3::TEXT as uri, $4::TEXT as id from __query), + __info AS (select %[3]d as first, %[4]d as limit, count(id) as total, '%[1]s' as orderby, to_json('%[2]s' <> 'desc') as orderasc, string_to_array($1, ',') as tags, $2::TEXT as fulltext, $3::TEXT as uri, $4::TEXT as id from __query), __infoJson AS (select row_to_json(i.*) as info from __info i), __allTags AS (select unnest(tags) as tag from __query), __tags AS (select tag, count(tag) from __allTags group by tag order by 2 desc), diff --git a/web/src/components/Navigation.vue b/web/src/components/Navigation.vue new file mode 100644 index 0000000..cef1acf --- /dev/null +++ b/web/src/components/Navigation.vue @@ -0,0 +1,76 @@ +<template> + <div class="navigation"> + <div class="cursor"> + <button @click="goFirst()"><<</button> + <button @click="goPrev()"><</button> + {{ 1 + queryInfo.first }}-{{ last }} + <button @click="goNext()">></button> + <button @click="goLast()">>></button> + / {{ queryInfo.total }} + </div> + + <div class="sort"> + <label + >order + <select v-model="orderby"> + <option>creationdate</option> + <option>importdate</option> + <option>privatealias</option> + <option>publicalias</option> + <option>updatedate</option> + <option>uri</option> + <option>visit</option> + </select> + </label> + <label>desc <input type="checkbox" v-model="orderasc"/></label> + </div> + </div> +</template> + +<script> +import { Component, Vue } from 'vue-property-decorator' + +@Component({ + name: 'Navigation', + components: {} +}) +class Navigation extends Vue { + get last() { + if (this.queryInfo.first + this.queryInfo.limit <= this.queryInfo.total) { + return this.queryInfo.first + this.queryInfo.limit + } + return this.queryInfo.total + } + + get orderby() { + return this.queryInfo.orderby + } + + set orderby(value) { + this.changeOrderBy(value) + } + + get orderasc() { + return this.queryInfo.orderasc + } + + set orderasc(value) { + this.changeOrderAsc(value) + } +} + +export default Navigation +</script> + +<style lang="less" scoped> +.navigation { + display: flex; + flex-wrap: wrap; + justify-content: center; + align-items: center; +} + +.sort { + margin-left: 15px; +} +</style> diff --git a/web/src/main.js b/web/src/main.js index c23dab2..45809e9 100644 --- a/web/src/main.js +++ b/web/src/main.js @@ -39,11 +39,25 @@ Vue.mixin({ fullQuery.fulltext && (query.fulltext = fullQuery.fulltext) fullQuery.query && (query.query = fullQuery.query) fullQuery.orderby != 'creationdate' && (query.orderby = fullQuery.orderby) - fullQuery.orderasc && (query.orderas = fullQuery.orderasc) + fullQuery.orderasc && (query.orderasc = fullQuery.orderasc) console.log('go params', query) this.$router.push({ name: 'Home', query }) }, + changeOrderBy: function(orderby) { + let query = { ...this.currentQuery } + if (query.orderby !== orderby) { + query.orderby = orderby + this.go(query) + } + }, + changeOrderAsc: function(orderasc) { + let query = { ...this.currentQuery } + if (query.orderasc !== orderasc) { + query.orderasc = orderasc + this.go(query) + } + }, changeTagsAndFulltextAndGo: function(tags, fulltext) { let query = { ...this.currentQuery } query.first = 0 @@ -52,17 +66,16 @@ Vue.mixin({ this.go(query) }, goFirst: function() { - let c = this.currentQuery - let query = { ...c } - query.first = 0 - if (query.first != c.first) { + let query = { ...this.currentQuery } + if (query.first != 0) { + query.first = 0 this.go(query) } }, goNext: function() { let query = { ...this.currentQuery } - query.first = query.first + this.user.maxresult - if (query.first < this.queryInfo.total) { + if (query.first + this.user.maxresult < this.queryInfo.total) { + query.first = query.first + this.user.maxresult this.go(query) } }, diff --git a/web/src/views/Home.vue b/web/src/views/Home.vue index fdcaf72..41be2c2 100644 --- a/web/src/views/Home.vue +++ b/web/src/views/Home.vue @@ -2,14 +2,7 @@ <div class="home"> <div>{{ errorMsg }}</div> <CloudTags></CloudTags> - <div class="navigation"> - <button @click="goFirst()"><<</button> - <button @click="goPrev()"><</button> - {{ 1 + queryInfo.first }}-{{ last }} - <button @click="goNext()">></button> - <button @click="goLast()">>></button> - / {{ queryInfo.total }} - </div> + <Navigation></Navigation> <div class="bookmarks-list"> <Bookmark v-for="bookmark in bookmarks" :key="bookmark.id" :bookmark="bookmark"></Bookmark> </div> @@ -21,11 +14,12 @@ import { Component, Prop, Vue } from 'vue-property-decorator' import Bookmark from '@/components/Bookmark' import CloudTags from '@/components/CloudTags' +import Navigation from '@/components/Navigation' @Component({ name: 'Home', props: ['id', 'tags', 'fulltext', 'query', 'orderby', 'orderasc', 'first'], - components: { CloudTags, Bookmark } + components: { CloudTags, Bookmark, Navigation } }) class Home extends Vue { @Prop id @@ -45,13 +39,6 @@ class Home extends Vue { errorMsg = '' - get last() { - if (this.queryInfo.first + this.queryInfo.limit <= this.queryInfo.total) { - return this.queryInfo.first + this.queryInfo.limit - } - return this.queryInfo.total - } - get bookmarks() { return this.queryResult } -- To stop receiving notification emails like this one, please contact chorem.org SCM administrator <admin+scm@chorem.org>.
participants (1)
-
chorem.org scm