From 51ac44116a81b8bf5aa98127450fac6184acdfd8 Mon Sep 17 00:00:00 2001 From: Troplo Date: Thu, 21 Jan 2021 19:02:20 +1100 Subject: [PATCH] prerelease2 MarketplaceItem, Marketplace, Pagination, Update modal popup for new releases --- package.json | 2 + src/App.vue | 6 +- src/components/Navbar.vue | 41 +++++++ src/components/Pagination.vue | 66 ++++++++++ src/locales/en.json | 22 +++- src/main.js | 6 + src/router/index.js | 16 +++ src/store/index.js | 12 +- src/views/Forums.vue | 3 +- src/views/Marketplace.vue | 221 +++++++++++++++++++++++++++++++++- src/views/MarketplaceItem.vue | 111 +++++++++++++++++ src/views/User.vue | 6 +- src/views/Users.vue | 64 +++++++--- vue.config.js | 2 +- yarn.lock | 10 ++ 15 files changed, 550 insertions(+), 38 deletions(-) create mode 100644 src/components/Pagination.vue create mode 100644 src/views/MarketplaceItem.vue diff --git a/package.json b/package.json index 74ec45b..fcb794a 100644 --- a/package.json +++ b/package.json @@ -15,6 +15,7 @@ "core-js": "^3.6.5", "crypto-random-string": "^3.3.0", "dotenv-webpack": "^6.0.0", + "lodash.throttle": "^4.1.1", "socket.io": "^3.1.0", "to-boolean": "^1.0.0", "v-offline": "^1.3.0", @@ -22,6 +23,7 @@ "vue-axios": "^3.2.2", "vue-i18n": "^8.17.3", "vue-keypress": "^2.1.1", + "vue-matomo": "^3.14.0-0", "vue-router": "^3.2.0", "vue-socket.io": "^3.0.10", "vuex": "^3.4.0" diff --git a/src/App.vue b/src/App.vue index 3680c94..a5ef97e 100644 --- a/src/App.vue +++ b/src/App.vue @@ -13,7 +13,6 @@
-
@@ -30,6 +29,11 @@ export default { Footer }, mounted() { + if(JSON.parse( + localStorage.getItem('token'))) { + this.$store.commit('setToken', JSON.parse( + localStorage.getItem('token'))) + } if(JSON.parse( localStorage.getItem('wind404'))) { var wind = JSON.parse( diff --git a/src/components/Navbar.vue b/src/components/Navbar.vue index 02db076..eb2b699 100644 --- a/src/components/Navbar.vue +++ b/src/components/Navbar.vue @@ -142,6 +142,34 @@ + +
+
+
+

{{$t('update.title')}}

+
+
+

What's new in {{$store.state.client.clientVersion}}?

+
    +
  • Marketplace
    • +
  • Pagination Component
    • +
  • Fix crashing when token is null
    • +
  • User list pagination
    • +
  • Marketplace Item
    • +
+
+
+ +
+
+
+
@@ -354,6 +382,7 @@ export default { showBanner: true, showOutdatedBanner: true, friendCount: 0, + updateModal: false, settings: { tab: 0, general: { @@ -513,6 +542,17 @@ export default { this.showBanner = true } }, + updateDismissed() { + localStorage.setItem("update-" + this.$store.state.client.clientVersion, true) + this.updateModal = false + }, + showUpdate() { + if(!localStorage.getItem("update-" + this.$store.state.client.clientVersion)) { + this.updateModal = true + } else { + this.updateModal = false + } + }, removeBannerId() { localStorage.setItem(this.$store.state.client.bannerId, true) this.$store.state.client.bannerEnabled = false @@ -699,6 +739,7 @@ export default { this.loading = false }) } + this.showUpdate() } } \ No newline at end of file diff --git a/src/components/Pagination.vue b/src/components/Pagination.vue new file mode 100644 index 0000000..dad3fe3 --- /dev/null +++ b/src/components/Pagination.vue @@ -0,0 +1,66 @@ + + + \ No newline at end of file diff --git a/src/locales/en.json b/src/locales/en.json index fd185ff..a333859 100644 --- a/src/locales/en.json +++ b/src/locales/en.json @@ -175,7 +175,8 @@ "relationships": { "pending": "Cancel Friend Request", "notFriends": "Send Friend Request", - "pendingCanAccept": "Accept Friend Request" + "pendingCanAccept": "Accept Friend Request", + "accepted": "Remove friend" }, "modifyUser": { "title": "Modify User", @@ -266,6 +267,25 @@ "soon": "(SOON)" } }, + "marketplace": { + "hats": "Hats", + "faces": "Faces", + "shirts": "Shirts", + "pants": "Pants", + "collections": "Collections", + "moreInfo": "More info", + "filter": "Filters", + "search": "Search the Marketplace" + }, + "update": { + "title": "Changelog for new update" + }, + "marketplaceItem": { + "moreInfo": "Information and Stats", + "price": "Price", + "originalPrice": "Original Price", + "creator": "The Creator" + }, "currency": "Koins", "close": "Close", "tos": "Terms of Service", diff --git a/src/main.js b/src/main.js index 7cedc5b..b6bf52b 100644 --- a/src/main.js +++ b/src/main.js @@ -6,10 +6,16 @@ import Buefy, {Snackbar} from 'buefy' import axios from 'axios' import VueAxios from 'vue-axios' import i18n from './i18n' +import moment from 'moment' Vue.use(VueAxios, axios) Vue.use(Buefy) Vue.config.productionTip = false Vue.prototype.$snackbar = Snackbar +Vue.filter('formatDate', function(value) { + if (value) { + return moment(String(value)).format('hh:mm A, DD/MM/YYYY') + } +}) new Vue({ router, store, diff --git a/src/router/index.js b/src/router/index.js index 0582ba5..781b083 100644 --- a/src/router/index.js +++ b/src/router/index.js @@ -77,6 +77,22 @@ const routes = [ name: 'Roadmap', component: route('Roadmap') }, + { + path: '/marketplace/', + redirect: '/marketplace/HATS', + name: 'Marketplace', + component: route('Marketplace') + }, + { + path: '/marketplace/:category', + name: 'Marketplace', + component: route('Marketplace') + }, + { + path: '/m/:id', + name: 'MarketplaceItem', + component: route('MarketplaceItem') + }, { path: '/stats', name: 'Stats', diff --git a/src/store/index.js b/src/store/index.js index e57de21..34960fc 100644 --- a/src/store/index.js +++ b/src/store/index.js @@ -2,21 +2,13 @@ import Vue from 'vue' import Vuex from 'vuex' import tb from 'to-boolean'; Vue.use(Vuex) -if(JSON.parse( - localStorage.getItem('token'))) { - var token = JSON.parse( - localStorage.getItem('token')) -} else { - // eslint-disable-next-line no-redeclare - var token = '' -} export default new Vuex.Store({ state: { debug: tb(process.env.VUE_APP_STAGING), wind: false, enableBrokenRoutes: false, client: { - clientVersion: '1.0.0-prerelease', + clientVersion: '1.0.0-prerelease2', latestClientVersion: '', latestAPIVersion: '', bannerText: '', @@ -48,7 +40,7 @@ export default new Vuex.Store({ avatar: 'default', bot: '', system: '', - token: token, + token: '', koins: 0, emailVerified: false, modeler: false, diff --git a/src/views/Forums.vue b/src/views/Forums.vue index e764563..26026da 100644 --- a/src/views/Forums.vue +++ b/src/views/Forums.vue @@ -54,7 +54,7 @@

- Created At: {{thread.createdAt}} + Created At: {{thread.createdAt | formatDate()}}
@@ -120,7 +120,6 @@ export default { }, $route () { this.selectedCategory = this.$route.path.split('/')[2].toUpperCase() - this.newThreads = 0 this.getThreads(true) } }, diff --git a/src/views/Marketplace.vue b/src/views/Marketplace.vue index a333130..f06f565 100644 --- a/src/views/Marketplace.vue +++ b/src/views/Marketplace.vue @@ -1,5 +1,220 @@ \ No newline at end of file + + \ No newline at end of file diff --git a/src/views/MarketplaceItem.vue b/src/views/MarketplaceItem.vue new file mode 100644 index 0000000..d64471a --- /dev/null +++ b/src/views/MarketplaceItem.vue @@ -0,0 +1,111 @@ + + \ No newline at end of file diff --git a/src/views/User.vue b/src/views/User.vue index b287800..1e3c38d 100644 --- a/src/views/User.vue +++ b/src/views/User.vue @@ -26,7 +26,7 @@
{{ $t('user.description') }}: {{user.description}}

{{$t('user.description')}}: {{$t('user.defaultDesc')}} {{user.username}}
- {{ $t('user.created') }}: {{user.createdAt}}
+ {{ $t('user.created') }}: {{user.createdAt | formatDate()}}
{{ $t('user.marketplace') }}:
@@ -59,7 +59,7 @@ import AjaxErrorHandler from '../../assets/js/errorHandler' import Badges from '../components/Badges' export default { - name: 'user', + name: 'User', components: { Badges }, @@ -313,7 +313,7 @@ export default { return selectedIndex } }, - created () { + mounted () { this.resetFetchData() this.selected = this.getIndexFromRoute(this.$route.path) diff --git a/src/views/Users.vue b/src/views/Users.vue index a8262dd..d077453 100644 --- a/src/views/Users.vue +++ b/src/views/Users.vue @@ -6,6 +6,14 @@ +

{{user.username}} 

@@ -13,6 +21,7 @@ View Profile
+
@@ -90,37 +99,58 @@ import AjaxErrorHandler from "../../assets/js/errorHandler"; import Badges from "../components/Badges" import NoItems from "../components/NoItems" +import Pagination from "../components/Pagination" export default { name: 'Users', components: { Badges, - NoItems + NoItems, + Pagination }, data() { return { users: [], offset: 0, - limit: 15, + paginate: true, + limit: 30, loading: true } }, + methods: { + getUsers(initial) { + if(initial) { + this.users = [] + this.loading = true + this.offset = 0 + this.paginate = true + } + this.axios + .get(process.env.VUE_APP_APIENDPOINT + process.env.VUE_APP_APIVERSION + '/' + 'user/' + '?offset=' + this.offset) + .then(res => { + if(res.data < this.limit) { + this.offset = null; + } else { + this.offset+= this.limit; + } + if(!initial && !res.data.length) { + this.paginate = false + } + if(initial) { + this.users = res.data + } else { + this.users.push(...res.data) + } + this.loading = false + }) + .catch((e) => { + this.loading = false + AjaxErrorHandler(this.$store)(e) + }) + } + }, mounted() { this.loading = true - this.axios - .get(process.env.VUE_APP_APIENDPOINT + process.env.VUE_APP_APIVERSION + `/` + `user?offset=${this.offset};`) - .then(res => { - this.users.push(...res.data); - if(res.data.length < this.limit) { - this.offset = null; - } else { - this.offset+= this.limit; - } - this.loading = false - }) - .catch(e => { - AjaxErrorHandler(this.$store)(e) - this.loading = false - }) + this.getUsers() } } \ No newline at end of file diff --git a/vue.config.js b/vue.config.js index 5d272ff..3f71605 100644 --- a/vue.config.js +++ b/vue.config.js @@ -1,7 +1,7 @@ const Dotenv = require('dotenv-webpack'); module.exports = { devServer: { - proxy: 'http://localhost:23981' + proxy: 'http://localhost:23982' }, publicPath: '/', diff --git a/yarn.lock b/yarn.lock index 8828309..1e1e72a 100644 --- a/yarn.lock +++ b/yarn.lock @@ -8234,6 +8234,11 @@ lodash.templatesettings@^4.0.0: dependencies: lodash._reinterpolate "^3.0.0" +lodash.throttle@^4.1.1: + version "4.1.1" + resolved "https://registry.yarnpkg.com/lodash.throttle/-/lodash.throttle-4.1.1.tgz#c23e91b710242ac70c37f1e1cda9274cc39bf2f4" + integrity sha1-wj6RtxAkKscMN/HhzaknTMOb8vQ= + lodash.transform@^4.6.0: version "4.6.0" resolved "https://registry.yarnpkg.com/lodash.transform/-/lodash.transform-4.6.0.tgz#12306422f63324aed8483d3f38332b5f670547a0" @@ -12671,6 +12676,11 @@ vue-loader@^15.9.2: vue-hot-reload-api "^2.3.0" vue-style-loader "^4.1.0" +vue-matomo@^3.14.0-0: + version "3.14.0-0" + resolved "https://registry.yarnpkg.com/vue-matomo/-/vue-matomo-3.14.0-0.tgz#f8e668c26ec1f2f7b4498f758edfb7c387259735" + integrity sha512-i1IkZGSXNY84zg1gVU8TOuaqajYDWQYl4Vs7M1mEb21cNhlMZKUxxgElvj+xmv7ytYUc/6ekZbxIS+y6W4qTMQ== + vue-router@^3.2.0: version "3.4.9" resolved "https://registry.yarnpkg.com/vue-router/-/vue-router-3.4.9.tgz#c016f42030ae2932f14e4748b39a1d9a0e250e66"