liz/wikijs-fork
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat: content rendering improvements + save fix

Browse Source
This commit is contained in:
Nicolas Giard
2018-11-10 23:40:55 -05:00
parent 91b79dfa1f
commit 0b5a4e0c63
16 changed files with 125 additions and 48 deletions
Download Patch File Download Diff File Expand all files Collapse all files

72
client/components/common/nav-footer.vue
View File

@@ -1,72 +0,0 @@
<template lang="pug">
v-footer.justify-center(:color='bgColor', inset)
.caption.grey--text.text--darken-1
span(v-if='company && company.length > 0') {{ $t('common:footer.copyright', { company: company, year: currentYear, interpolation: { escapeValue: false } }) }} |&nbsp;
span {{ $t('common:footer.poweredBy') }} #[a(href='https://wiki.js.org', ref='nofollow') Wiki.js]
v-snackbar(
:color='notification.style'
bottom
right
multi-line
v-model='notificationState'
)
.text-xs-left
v-icon.mr-3(dark) {{ notification.icon }}
span {{ notification.message }}
</template>
<script>
import { get, sync } from 'vuex-pathify'
export default {
props: {
color: {
type: String,
default: 'grey lighten-3'
},
darkColor: {
type: String,
default: 'grey darken-3'
}
},
data() {
return {
currentYear: (new Date()).getFullYear()
}
},
computed: {
company: get('site/company'),
notification: get('notification'),
darkMode: get('site/dark'),
notificationState: sync('notification@isActive'),
bgColor() {
if (!this.darkMode) {
return this.color
} else {
return this.darkColor
}
}
}
}
</script>
<style lang="scss">
.v-footer {
a {
text-decoration: none;
}
&.altbg {
background: mc('theme', 'primary');
span {
color: mc('blue', '300');
}
a {
color: mc('blue', '200');
}
}
}
</style>

7
client/components/common/nav-header.vue
View File

@@ -17,7 +17,7 @@
@keyup.enter='searchEnter'
)
v-menu(open-on-hover, offset-y, bottom, left, min-width='250')
v-toolbar-side-icon(slot='activator')
v-toolbar-side-icon.btn-animate-app(slot='activator')
v-icon view_module
v-list(dense, :light='!$vuetify.dark').py-0
v-list-tile(avatar, href='/')
@@ -84,12 +84,12 @@
)
v-icon(color='grey') search
v-tooltip(bottom)
v-btn(icon, href='/a', slot='activator')
v-btn.btn-animate-rotate(icon, href='/a', slot='activator')
v-icon(color='grey') settings
span Admin
v-menu(offset-y, min-width='300')
v-tooltip(bottom, slot='activator')
v-btn(icon, slot='activator')
v-btn.btn-animate-grow(icon, slot='activator', outline, color='grey darken-3')
v-icon(color='grey') account_circle
span Account
v-list.py-0(:light='!$vuetify.dark')
@@ -212,4 +212,5 @@ export default {
.navHeaderLoading { // To avoid search bar jumping
width: 22px;
}
</style>

35
client/components/common/nav-sidebar.vue
View File

@@ -1,35 +0,0 @@
<template lang="pug">
v-list(dense, :class='color', :dark='dark')
v-list-tile.pt-2(href='/')
v-list-tile-avatar: v-icon home
v-list-tile-title Home
v-divider.my-2
v-subheader.pl-4 Navigation
v-list-tile
v-list-tile-avatar: v-icon stars
v-list-tile-title The Universe
v-list-tile
v-list-tile-avatar: v-icon directions_boat
v-list-tile-title Ships
v-list-tile
v-list-tile-avatar: v-icon local_airport
v-list-tile-title Airports
</template>
<script>
export default {
props: {
color: {
type: String,
default: 'primary'
},
dark: {
type: Boolean,
default: true
}
},
data() {
return {}
}
}
</script>

39
client/components/editor.vue
View File

@@ -142,6 +142,10 @@ export default {
initContent: {
type: String,
default: null
},
pageId: {
type: Number,
default: 0
}
},
data() {
@@ -158,6 +162,7 @@ export default {
notificationState: sync('notification@isActive')
},
created() {
this.$store.commit('page/SET_ID', this.pageId)
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)
@@ -212,16 +217,16 @@ export default {
mutation: createPageMutation,
variables: {
content: this.$store.get('editor/content'),
description: this.$store.get('editor/description'),
description: this.$store.get('page/description'),
editor: 'markdown',
locale: this.$store.get('editor/locale'),
locale: this.$store.get('page/locale'),
isPrivate: false,
isPublished: this.$store.get('editor/isPublished'),
path: this.$store.get('editor/path'),
publishEndDate: this.$store.get('editor/publishEndDate'),
publishStartDate: this.$store.get('editor/publishStartDate'),
tags: this.$store.get('editor/tags'),
title: this.$store.get('editor/title')
isPublished: this.$store.get('page/isPublished'),
path: this.$store.get('page/path'),
publishEndDate: this.$store.get('page/publishEndDate'),
publishStartDate: this.$store.get('page/publishStartDate'),
tags: this.$store.get('page/tags'),
title: this.$store.get('page/title')
}
})
resp = _.get(resp, 'data.pages.create', {})
@@ -244,18 +249,18 @@ export default {
let resp = await this.$apollo.mutate({
mutation: updatePageMutation,
variables: {
id: this.$store.get('editor/id'),
id: this.$store.get('page/id'),
content: this.$store.get('editor/content'),
description: this.$store.get('editor/description'),
description: this.$store.get('page/description'),
editor: 'markdown',
locale: this.$store.get('editor/locale'),
locale: this.$store.get('page/locale'),
isPrivate: false,
isPublished: this.$store.get('editor/isPublished'),
path: this.$store.get('editor/path'),
publishEndDate: this.$store.get('editor/publishEndDate'),
publishStartDate: this.$store.get('editor/publishStartDate'),
tags: this.$store.get('editor/tags'),
title: this.$store.get('editor/title')
isPublished: this.$store.get('page/isPublished'),
path: this.$store.get('page/path'),
publishEndDate: this.$store.get('page/publishEndDate'),
publishStartDate: this.$store.get('page/publishStartDate'),
tags: this.$store.get('page/tags'),
title: this.$store.get('page/title')
}
})
resp = _.get(resp, 'data.pages.update', {})

8
client/components/editor/editor-markdown.vue
View File

@@ -206,7 +206,7 @@ export default {
self.$parent.save()
})
cm.setSize(null, 'calc(100vh - 100px)')
cm.setSize(null, 'calc(100vh - 112px)')
cm.setOption('extraKeys', keyBindings)
cm.on('cursorActivity', cm => {
this.toolbarSync(cm)
@@ -270,7 +270,7 @@ export default {
background-color: darken(mc('grey', '900'), 4.5%);
flex: 1 1 50%;
display: block;
height: calc(100vh - 96px);
height: calc(100vh - 112px);
position: relative;
&-title {
@@ -300,7 +300,7 @@ export default {
flex: 1 1 50%;
background-color: mc('grey', '100');
position: relative;
height: calc(100vh - 100px);
height: calc(100vh - 112px);
overflow: hidden;
@include until($tablet) {
@@ -321,7 +321,7 @@ export default {
}
&-content {
height: calc(100vh - 100px);
height: calc(100vh - 112px);
overflow-y: scroll;
padding: 30px 1rem 1rem 1rem;
width: calc(100% + 1rem + 17px)

16
client/components/editor/editor-modal-properties.vue
View File

@@ -207,14 +207,14 @@ export default {
},
computed: {
mode: get('editor/mode'),
title: sync('editor/title'),
description: sync('editor/description'),
locale: sync('editor/locale'),
tags: sync('editor/tags'),
path: sync('editor/path'),
isPublished: sync('editor/isPublished'),
publishStartDate: sync('editor/publishStartDate'),
publishEndDate: sync('editor/publishEndDate')
title: sync('page/title'),
description: sync('page/description'),
locale: sync('page/locale'),
tags: sync('page/tags'),
path: sync('page/path'),
isPublished: sync('page/isPublished'),
publishStartDate: sync('page/publishStartDate'),
publishEndDate: sync('page/publishEndDate')
},
mounted() {
this.isShown = true