fix: hide page actions when not applicable

This commit is contained in:
Nicolas Giard 2018-11-19 01:08:55 -05:00
parent 27adad8dad
commit aaeb24a8ec
8 changed files with 52 additions and 31 deletions

View File

@ -125,7 +125,10 @@ export default {
computed: {
darkMode: get('site/dark')
},
router
router,
created() {
this.$store.commit('page/SET_MODE', 'admin')
}
}
</script>

View File

@ -26,23 +26,27 @@
v-list-tile(avatar, @click='pageNew')
v-list-tile-avatar: v-icon(color='green') add_box
v-list-tile-content New Page
v-divider.my-0
v-subheader Current Page
v-list-tile(avatar, @click='pageEdit')
v-list-tile-avatar: v-icon(color='indigo') edit
v-list-tile-content Edit
v-list-tile(avatar, @click='pageHistory')
v-list-tile-avatar: v-icon(color='indigo') history
v-list-tile-content History
v-list-tile(avatar, @click='pageSource')
v-list-tile-avatar: v-icon(color='indigo') code
v-list-tile-content View Source
v-list-tile(avatar, @click='pageMove')
v-list-tile-avatar: v-icon(color='indigo') forward
v-list-tile-content Move / Rename
v-list-tile(avatar, @click='pageDelete')
v-list-tile-avatar: v-icon(color='red darken-2') delete
v-list-tile-content Delete
template(v-if='path && path.length')
v-divider.my-0
v-subheader Current Page
v-list-tile(avatar, @click='pageView', v-if='mode !== `view`')
v-list-tile-avatar: v-icon(color='indigo') subject
v-list-tile-content View
v-list-tile(avatar, @click='pageEdit', v-if='mode !== `edit`')
v-list-tile-avatar: v-icon(color='indigo') edit
v-list-tile-content Edit
v-list-tile(avatar, @click='pageHistory', v-if='mode !== `history`')
v-list-tile-avatar: v-icon(color='indigo') history
v-list-tile-content History
v-list-tile(avatar, @click='pageSource', v-if='mode !== `source`')
v-list-tile-avatar: v-icon(color='indigo') code
v-list-tile-content View Source
v-list-tile(avatar, @click='pageMove')
v-list-tile-avatar: v-icon(color='indigo') forward
v-list-tile-content Move / Rename
v-list-tile(avatar, @click='pageDelete')
v-list-tile-avatar: v-icon(color='red darken-2') delete
v-list-tile-content Delete
v-divider.my-0
v-subheader Assets
v-list-tile(avatar, @click='')
@ -138,7 +142,8 @@ export default {
computed: {
isLoading: get('isLoading'),
title: get('site/title'),
path: get('page/path')
path: get('page/path'),
mode: get('page/mode')
},
created() {
if (this.hideSearch || this.dense || this.$vuetify.breakpoint.smAndDown) {
@ -160,6 +165,9 @@ export default {
pageNew () {
this.newPageModal = true
},
pageView () {
window.location.assign(`/${this.path}`)
},
pageEdit () {
window.location.assign(`/e/${this.path}`)
},
@ -167,7 +175,7 @@ export default {
window.location.assign(`/h/${this.path}`)
},
pageSource () {
window.location.assign(`/s/${this.path}`)
},
pageMove () {

View File

@ -11,13 +11,6 @@
v-icon(color='green', :left='$vuetify.breakpoint.lgAndUp') check
span.white--text(v-if='$vuetify.breakpoint.lgAndUp') {{ mode === 'create' ? $t('common:actions.create') : $t('common:actions.save') }}
v-btn.mx-0(
outline
color='red'
:class='{ "is-icon": $vuetify.breakpoint.mdAndDown }'
)
v-icon(color='red', :left='$vuetify.breakpoint.lgAndUp') close
span.white--text(v-if='$vuetify.breakpoint.lgAndUp') {{ $t('common:actions.discard') }}
v-btn(
outline
color='blue'
@click.native.stop='openModal(`properties`)'
@ -25,6 +18,13 @@
)
v-icon(color='blue', :left='$vuetify.breakpoint.lgAndUp') sort_by_alpha
span.white--text(v-if='$vuetify.breakpoint.lgAndUp') {{ $t('editor:page') }}
v-btn(
outline
color='red'
:class='{ "is-icon": $vuetify.breakpoint.mdAndDown }'
)
v-icon(color='red', :left='$vuetify.breakpoint.lgAndUp') close
span.white--text(v-if='$vuetify.breakpoint.lgAndUp') {{ $t('common:actions.discard') }}
v-content
component(:is='currentEditor')
component(:is='currentModal')
@ -170,6 +170,8 @@ export default {
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_MODE', 'edit')
},
mounted() {
this.$store.set('editor/mode', this.initMode || 'create')

View File

@ -122,6 +122,8 @@ export default {
this.$store.commit('page/SET_ID', this.id)
this.$store.commit('page/SET_LOCALE', this.locale)
this.$store.commit('page/SET_PATH', this.path)
this.$store.commit('page/SET_MODE', 'history')
},
methods: {
goLive() {

View File

@ -60,7 +60,10 @@ export default {
computed: {
darkMode() { return siteConfig.darkMode }
},
router
router,
created() {
this.$store.commit('page/SET_MODE', 'profile')
}
}
</script>

View File

@ -13,7 +13,8 @@ const state = {
publishStartDate: '',
tags: [],
title: '',
updatedAt: ''
updatedAt: '',
mode: ''
}
export default {

View File

@ -210,6 +210,8 @@ export default {
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)
this.$store.commit('page/SET_MODE', 'view')
},
mounted () {
Prism.highlightAllUnder(this.$refs.container)

View File

@ -88,9 +88,9 @@
}
code {
background-color: rgba(mc('pink', '500'), .1);
background-color: rgba(mc('indigo', '50'), 1);
padding: 0 5px;
color: mc('pink', '800');
color: mc('indigo', '800');
font-family: 'Source Code Pro', monospace;
font-weight: normal;
font-size: 1rem;