feat: page history UI + nav links fix
This commit is contained in:
parent
b26f30ae20
commit
9a2a9c220a
@ -159,6 +159,7 @@ Vue.prototype.Velocity = Velocity
|
||||
|
||||
Vue.component('admin', () => import(/* webpackChunkName: "admin" */ './components/admin.vue'))
|
||||
Vue.component('editor', () => import(/* webpackPrefetch: -100, webpackChunkName: "editor" */ './components/editor.vue'))
|
||||
Vue.component('history', () => import(/* webpackChunkName: "history" */ './components/history.vue'))
|
||||
Vue.component('login', () => import(/* webpackPrefetch: true, webpackChunkName: "login" */ './components/login.vue'))
|
||||
Vue.component('nav-footer', () => import(/* webpackMode: "eager" */ './components/common/nav-footer.vue'))
|
||||
Vue.component('nav-header', () => import(/* webpackMode: "eager" */ './components/common/nav-header.vue'))
|
||||
|
@ -134,7 +134,8 @@ export default {
|
||||
},
|
||||
computed: {
|
||||
isLoading: get('isLoading'),
|
||||
title: get('site/title')
|
||||
title: get('site/title'),
|
||||
path: get('page/path')
|
||||
},
|
||||
created() {
|
||||
if (this.hideSearch || this.dense || this.$vuetify.breakpoint.smAndDown) {
|
||||
@ -157,10 +158,10 @@ export default {
|
||||
|
||||
},
|
||||
pageEdit () {
|
||||
|
||||
window.location.assign(`/e/${this.path}`)
|
||||
},
|
||||
pageHistory () {
|
||||
|
||||
window.location.assign(`/h/${this.path}`)
|
||||
},
|
||||
pageSource () {
|
||||
|
||||
|
@ -157,6 +157,14 @@ export default {
|
||||
notification: get('notification'),
|
||||
notificationState: sync('notification@isActive')
|
||||
},
|
||||
created() {
|
||||
this.$store.commit('page/SET_DESCRIPTION', this.description)
|
||||
this.$store.commit('page/SET_IS_PUBLISHED', this.isPublished)
|
||||
this.$store.commit('page/SET_LOCALE', this.locale)
|
||||
this.$store.commit('page/SET_PATH', this.path)
|
||||
this.$store.commit('page/SET_TAGS', this.tags)
|
||||
this.$store.commit('page/SET_TITLE', this.title)
|
||||
},
|
||||
mounted() {
|
||||
this.$store.set('editor/mode', this.initMode || 'create')
|
||||
this.$store.set('editor/content', this.initContent ? window.atob(this.initContent) : '# Header\n\nYour content here')
|
||||
|
136
client/components/history.vue
Normal file
136
client/components/history.vue
Normal file
@ -0,0 +1,136 @@
|
||||
<template lang='pug'>
|
||||
v-app(:dark='darkMode').history
|
||||
nav-header
|
||||
v-content
|
||||
v-toolbar(color='primary', dark)
|
||||
.subheading Viewing history of page #[strong /{{path}}]
|
||||
v-spacer
|
||||
.caption.blue--text.text--lighten-3 ID {{id}}
|
||||
v-btn.ml-4(depressed, color='blue darken-1', @click='goLive') Return to Live Version
|
||||
v-container(fluid, grid-list-xl)
|
||||
v-layout(row, wrap)
|
||||
v-flex(xs5)
|
||||
v-chip.ma-0.grey--text.text--darken-2(
|
||||
label
|
||||
small
|
||||
color='grey lighten-2'
|
||||
)
|
||||
span Live
|
||||
v-timeline(
|
||||
dense
|
||||
)
|
||||
v-timeline-item(
|
||||
fill-dot
|
||||
color='primary'
|
||||
icon='edit'
|
||||
)
|
||||
v-card.grey.lighten-3.radius-7(flat)
|
||||
v-card-text
|
||||
v-layout(justify-space-between)
|
||||
v-flex(xs7)
|
||||
v-chip.ml-0.mr-3(
|
||||
label
|
||||
small
|
||||
color='primary'
|
||||
)
|
||||
span.white--text Viewing
|
||||
span Edited by John Doe
|
||||
v-flex(xs5, text-xs-right, align-center, d-flex)
|
||||
.caption Today at 12:34 PM
|
||||
|
||||
v-timeline-item(
|
||||
fill-dot
|
||||
small
|
||||
color='primary'
|
||||
icon='edit'
|
||||
)
|
||||
v-card.grey.lighten-3.radius-7(flat)
|
||||
v-card-text
|
||||
v-layout(justify-space-between)
|
||||
v-flex(xs7)
|
||||
span Edited by Jane Doe
|
||||
v-flex(xs5, text-xs-right, align-center, d-flex)
|
||||
.caption Today at 12:27 PM
|
||||
|
||||
v-timeline-item(
|
||||
fill-dot
|
||||
small
|
||||
color='purple'
|
||||
icon='forward'
|
||||
)
|
||||
v-card.purple.lighten-5.radius-7(flat)
|
||||
v-card-text
|
||||
v-layout(justify-space-between)
|
||||
v-flex(xs7)
|
||||
span Moved page from #[strong /test] to #[strong /home] by John Doe
|
||||
v-flex(xs5, text-xs-right, align-center, d-flex)
|
||||
.caption Yesterday at 10:45 AM
|
||||
|
||||
v-timeline-item(
|
||||
fill-dot
|
||||
color='teal'
|
||||
icon='add'
|
||||
)
|
||||
v-card.teal.lighten-5.radius-7(flat)
|
||||
v-card-text
|
||||
v-layout(justify-space-between)
|
||||
v-flex(xs7): span Initial page creation by John Doe
|
||||
v-flex(xs5, text-xs-right, align-center, d-flex)
|
||||
.caption Last Tuesday at 7:56 PM
|
||||
v-chip.ma-0.grey--text.text--darken-2(
|
||||
label
|
||||
small
|
||||
color='grey lighten-2'
|
||||
) End of history
|
||||
|
||||
v-flex(xs7)
|
||||
v-card.radius-7
|
||||
v-card-text
|
||||
v-card.grey.lighten-4.radius-7(flat)
|
||||
v-card-text
|
||||
.subheading Page Title
|
||||
.caption Some page description
|
||||
|
||||
nav-footer
|
||||
</template>
|
||||
|
||||
<script>
|
||||
/* global siteConfig */
|
||||
|
||||
export default {
|
||||
props: {
|
||||
id: {
|
||||
type: Number,
|
||||
default: 0
|
||||
},
|
||||
locale: {
|
||||
type: String,
|
||||
default: 'en'
|
||||
},
|
||||
path: {
|
||||
type: String,
|
||||
default: 'home'
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {}
|
||||
},
|
||||
computed: {
|
||||
darkMode() { return siteConfig.darkMode }
|
||||
},
|
||||
created () {
|
||||
this.$store.commit('page/SET_ID', this.id)
|
||||
this.$store.commit('page/SET_LOCALE', this.locale)
|
||||
this.$store.commit('page/SET_PATH', this.path)
|
||||
},
|
||||
methods: {
|
||||
goLive() {
|
||||
window.location.assign(`/${this.path}`)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang='scss'>
|
||||
|
||||
</style>
|
@ -4,6 +4,7 @@ import Vuex from 'vuex'
|
||||
import pathify from 'vuex-pathify' // eslint-disable-line import/no-duplicates
|
||||
import { make } from 'vuex-pathify' // eslint-disable-line import/no-duplicates
|
||||
|
||||
import page from './page'
|
||||
import site from './site'
|
||||
|
||||
Vue.use(Vuex)
|
||||
@ -49,6 +50,7 @@ export default new Vuex.Store({
|
||||
},
|
||||
actions: { },
|
||||
modules: {
|
||||
page,
|
||||
site
|
||||
}
|
||||
})
|
||||
|
21
client/store/page.js
Normal file
21
client/store/page.js
Normal file
@ -0,0 +1,21 @@
|
||||
import { make } from 'vuex-pathify'
|
||||
|
||||
const state = {
|
||||
id: 0,
|
||||
authorId: 0,
|
||||
authorName: 'Unknown',
|
||||
createdAt: '',
|
||||
description: '',
|
||||
isPublished: true,
|
||||
locale: 'en',
|
||||
path: '',
|
||||
tags: [],
|
||||
title: '',
|
||||
updatedAt: ''
|
||||
}
|
||||
|
||||
export default {
|
||||
namespaced: true,
|
||||
state,
|
||||
mutations: make.mutations(state)
|
||||
}
|
@ -194,6 +194,18 @@ export default {
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.$store.commit('page/SET_AUTHOR_ID', this.authorId)
|
||||
this.$store.commit('page/SET_AUTHOR_NAME', this.authorName)
|
||||
this.$store.commit('page/SET_CREATED_AT', this.createdAt)
|
||||
this.$store.commit('page/SET_DESCRIPTION', this.description)
|
||||
this.$store.commit('page/SET_IS_PUBLISHED', this.isPublished)
|
||||
this.$store.commit('page/SET_LOCALE', this.locale)
|
||||
this.$store.commit('page/SET_PATH', this.path)
|
||||
this.$store.commit('page/SET_TAGS', this.tags)
|
||||
this.$store.commit('page/SET_TITLE', this.title)
|
||||
this.$store.commit('page/SET_UPDATED_AT', this.updatedAt)
|
||||
},
|
||||
mounted () {
|
||||
Prism.highlightAllUnder(this.$refs.container)
|
||||
},
|
||||
|
68
package.json
68
package.json
@ -67,7 +67,7 @@
|
||||
"express-brute": "1.0.1",
|
||||
"express-brute-redis": "0.0.1",
|
||||
"express-session": "1.15.6",
|
||||
"file-type": "10.0.0",
|
||||
"file-type": "10.2.0",
|
||||
"filesize.js": "1.0.2",
|
||||
"follow-redirects": "1.5.9",
|
||||
"fs-extra": "7.0.0",
|
||||
@ -75,14 +75,14 @@
|
||||
"graphql": "14.0.2",
|
||||
"graphql-list-fields": "2.0.2",
|
||||
"graphql-subscriptions": "1.0.0",
|
||||
"graphql-tools": "4.0.1",
|
||||
"highlight.js": "9.13.0",
|
||||
"i18next": "11.9.1",
|
||||
"graphql-tools": "4.0.2",
|
||||
"highlight.js": "9.13.1",
|
||||
"i18next": "12.0.0",
|
||||
"i18next-express-middleware": "1.4.1",
|
||||
"i18next-localstorage-cache": "1.1.1",
|
||||
"i18next-node-fs-backend": "2.1.0",
|
||||
"image-size": "0.6.3",
|
||||
"ioredis": "4.0.2",
|
||||
"ioredis": "4.2.0",
|
||||
"js-binary": "1.2.0",
|
||||
"js-yaml": "3.12.0",
|
||||
"jsonwebtoken": "8.3.0",
|
||||
@ -104,20 +104,20 @@
|
||||
"markdown-it-sup": "1.0.0",
|
||||
"markdown-it-task-lists": "2.1.1",
|
||||
"mathjax-node": "2.1.1",
|
||||
"mime-types": "2.1.20",
|
||||
"mime-types": "2.1.21",
|
||||
"moment": "2.22.2",
|
||||
"moment-timezone": "0.5.21",
|
||||
"mongodb": "3.1.8",
|
||||
"mssql": "4.2.1",
|
||||
"mssql": "4.2.2",
|
||||
"multer": "1.4.1",
|
||||
"mysql2": "1.6.1",
|
||||
"node-2fa": "1.1.2",
|
||||
"node-cache": "4.2.0",
|
||||
"oauth2orize": "1.11.0",
|
||||
"objection": "1.3.0",
|
||||
"objection": "1.4.0",
|
||||
"ora": "3.0.0",
|
||||
"passport": "0.4.0",
|
||||
"passport-auth0": "1.0.0",
|
||||
"passport-auth0": "1.1.0",
|
||||
"passport-azure-ad-oauth2": "0.0.4",
|
||||
"passport-cas": "0.1.1",
|
||||
"passport-discord": "0.1.3",
|
||||
@ -135,7 +135,7 @@
|
||||
"passport-slack": "0.0.7",
|
||||
"passport-twitch": "1.0.3",
|
||||
"passport-windowslive": "1.0.2",
|
||||
"pg": "7.5.0",
|
||||
"pg": "7.6.0",
|
||||
"pg-hstore": "2.3.2",
|
||||
"pm2": "3.2.2",
|
||||
"pug": "2.0.3",
|
||||
@ -148,7 +148,7 @@
|
||||
"scim-query-filter-parser": "1.1.0",
|
||||
"semver": "5.6.0",
|
||||
"serve-favicon": "2.5.0",
|
||||
"sqlite3": "4.0.2",
|
||||
"sqlite3": "4.0.3",
|
||||
"subscriptions-transport-ws": "0.9.15",
|
||||
"uslug": "1.0.4",
|
||||
"uuid": "3.3.2",
|
||||
@ -174,8 +174,8 @@
|
||||
"@panter/vue-i18next": "0.13.0",
|
||||
"@vue/cli": "3.0.5",
|
||||
"animated-number-vue": "0.1.3",
|
||||
"apollo-cache-inmemory": "1.3.5",
|
||||
"apollo-client": "2.4.2",
|
||||
"apollo-cache-inmemory": "1.3.7",
|
||||
"apollo-client": "2.4.4",
|
||||
"apollo-fetch": "0.7.0",
|
||||
"apollo-link": "1.2.3",
|
||||
"apollo-link-batch-http": "1.2.3",
|
||||
@ -183,8 +183,8 @@
|
||||
"apollo-link-http": "1.5.5",
|
||||
"apollo-link-persisted-queries": "0.2.1",
|
||||
"apollo-link-ws": "1.0.9",
|
||||
"apollo-utilities": "1.0.21",
|
||||
"autoprefixer": "9.1.5",
|
||||
"apollo-utilities": "1.0.24",
|
||||
"autoprefixer": "9.3.1",
|
||||
"babel-eslint": "10.0.1",
|
||||
"babel-jest": "23.6.0",
|
||||
"babel-loader": "^8.0.4",
|
||||
@ -193,18 +193,18 @@
|
||||
"babel-plugin-transform-imports": "1.5.1",
|
||||
"brace": "0.11.1",
|
||||
"cache-loader": "1.2.2",
|
||||
"chart.js": "2.7.2",
|
||||
"chart.js": "2.7.3",
|
||||
"clean-webpack-plugin": "0.1.19",
|
||||
"copy-webpack-plugin": "4.5.3",
|
||||
"copy-webpack-plugin": "4.5.4",
|
||||
"css-loader": "1.0.0",
|
||||
"cssnano": "4.1.4",
|
||||
"cssnano": "4.1.7",
|
||||
"duplicate-package-checker-webpack-plugin": "3.0.0",
|
||||
"epic-spinners": "1.0.3",
|
||||
"eslint": "5.7.0",
|
||||
"epic-spinners": "1.0.4",
|
||||
"eslint": "5.8.0",
|
||||
"eslint-config-requarks": "1.0.7",
|
||||
"eslint-config-standard": "12.0.0",
|
||||
"eslint-plugin-import": "2.14.0",
|
||||
"eslint-plugin-node": "7.0.1",
|
||||
"eslint-plugin-node": "8.0.0",
|
||||
"eslint-plugin-promise": "4.0.1",
|
||||
"eslint-plugin-standard": "4.0.0",
|
||||
"eslint-plugin-vue": "4.7.1",
|
||||
@ -221,25 +221,25 @@
|
||||
"ignore-loader": "0.1.2",
|
||||
"js-cookie": "2.2.0",
|
||||
"mini-css-extract-plugin": "0.4.4",
|
||||
"node-sass": "4.9.3",
|
||||
"node-sass": "4.9.4",
|
||||
"offline-plugin": "5.0.5",
|
||||
"optimize-css-assets-webpack-plugin": "5.0.1",
|
||||
"postcss-cssnext": "3.1.0",
|
||||
"postcss-flexbugs-fixes": "4.1.0",
|
||||
"postcss-flexibility": "2.0.0",
|
||||
"postcss-import": "12.0.0",
|
||||
"postcss-import": "12.0.1",
|
||||
"postcss-loader": "3.0.0",
|
||||
"postcss-preset-env": "6.1.1",
|
||||
"postcss-selector-parser": "5.0.0-rc.3",
|
||||
"postcss-preset-env": "6.3.0",
|
||||
"postcss-selector-parser": "5.0.0-rc.4",
|
||||
"pug-lint": "2.5.0",
|
||||
"pug-loader": "2.4.0",
|
||||
"pug-plain-loader": "1.0.0",
|
||||
"raw-loader": "0.5.1",
|
||||
"react": "16.5.2",
|
||||
"react-dom": "16.5.2",
|
||||
"react": "16.6.0",
|
||||
"react-dom": "16.6.0",
|
||||
"resolve-url-loader": "3.0.0",
|
||||
"sass-loader": "7.1.0",
|
||||
"sass-resources-loader": "1.3.3",
|
||||
"sass-resources-loader": "1.3.4",
|
||||
"script-ext-html-webpack-plugin": "2.0.1",
|
||||
"simple-progress-webpack-plugin": "1.1.2",
|
||||
"style-loader": "0.23.1",
|
||||
@ -247,7 +247,7 @@
|
||||
"stylus-loader": "3.0.2",
|
||||
"twemoji-awesome": "1.0.6",
|
||||
"url-loader": "1.1.2",
|
||||
"vee-validate": "2.1.0-beta.11",
|
||||
"vee-validate": "2.1.1",
|
||||
"velocity-animate": "1.5.2",
|
||||
"viz.js": "2.0.0",
|
||||
"vue": "2.5.17",
|
||||
@ -261,18 +261,18 @@
|
||||
"vue-moment": "4.0.0",
|
||||
"vue-router": "3.0.1",
|
||||
"vue-simple-breakpoints": "1.0.3",
|
||||
"vue-status-indicator": "1.1.0",
|
||||
"vue-status-indicator": "1.1.1",
|
||||
"vue-template-compiler": "2.5.17",
|
||||
"vue-tour": "1.0.1",
|
||||
"vue-tour": "1.1.0",
|
||||
"vue-tree-navigation": "3.0.1",
|
||||
"vue2-animate": "2.1.0",
|
||||
"vuedraggable": "2.16.0",
|
||||
"vuetify": "1.2.9",
|
||||
"vuetify": "1.3.3",
|
||||
"vuex": "3.0.1",
|
||||
"vuex-pathify": "1.1.3",
|
||||
"vuex-persistedstate": "2.5.4",
|
||||
"webpack": "4.20.2",
|
||||
"webpack-bundle-analyzer": "3.0.2",
|
||||
"webpack": "4.23.1",
|
||||
"webpack-bundle-analyzer": "3.0.3",
|
||||
"webpack-cli": "3.1.2",
|
||||
"webpack-dev-middleware": "3.4.0",
|
||||
"webpack-hot-middleware": "2.24.3",
|
||||
|
@ -45,6 +45,24 @@ router.get(['/p', '/p/*'], (req, res, next) => {
|
||||
res.render('profile')
|
||||
})
|
||||
|
||||
/**
|
||||
* View document
|
||||
*/
|
||||
router.get(['/h', '/h/*'], async (req, res, next) => {
|
||||
const pageArgs = pageHelper.parsePath(req.path)
|
||||
const page = await WIKI.models.pages.getPage({
|
||||
path: pageArgs.path,
|
||||
locale: pageArgs.locale,
|
||||
userId: req.user.id,
|
||||
isPrivate: false
|
||||
})
|
||||
if (page) {
|
||||
res.render('history', { page })
|
||||
} else {
|
||||
res.redirect(`/${pageArgs.path}`)
|
||||
}
|
||||
})
|
||||
|
||||
/**
|
||||
* View document
|
||||
*/
|
||||
|
11
server/views/history.pug
Normal file
11
server/views/history.pug
Normal file
@ -0,0 +1,11 @@
|
||||
extends master.pug
|
||||
|
||||
block head
|
||||
|
||||
block body
|
||||
#root
|
||||
history(
|
||||
id=page.id
|
||||
locale=page.localeCode
|
||||
path=page.path
|
||||
)
|
Loading…
Reference in New Issue
Block a user