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

refactor: vuex re-org + modal-create-page

Browse Source
This commit is contained in:
NGPixel
2017-05-25 20:54:03 -04:00
parent 12132ad42e
commit f075c266ef
19 changed files with 98 additions and 73 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
client/js/app.js
View File

@@ -4,9 +4,11 @@
/* eslint-disable no-new */
import $ from 'jquery'
import _ from 'lodash'
import Vue from 'vue'
import VueResource from 'vue-resource'
import VueClipboards from 'vue-clipboards'
import VueLodash from 'vue-lodash'
import store from './store'
import io from 'socket-io-client'
import i18next from 'i18next'
@@ -15,6 +17,12 @@ import VueI18Next from '@panter/vue-i18next'
import 'jquery-smooth-scroll'
import 'jquery-sticky'
// ====================================
// Load Helpers
// ====================================
import helpers from './helpers'
// ====================================
// Load Vue Components
// ====================================
@@ -40,6 +48,7 @@ import sourceViewComponent from './pages/source-view.component.js'
Vue.use(VueResource)
Vue.use(VueClipboards)
Vue.use(VueI18Next)
Vue.use(VueLodash, _)
i18next
.use(i18nextXHR)
@@ -78,6 +87,7 @@ $(() => {
const i18n = new VueI18Next(i18next)
new Vue({
mixins: [helpers],
components: {
alert: alertComponent,
adminProfile: adminProfileComponent,

27
client/js/components/modal-create-page.vue
View File

@@ -1,12 +1,12 @@
<template lang="pug">
.modal(v-if='isShown')
.modal(v-bind:class='{ "is-active": isShown }')
.modal-background
.modal-container
.modal-content
header.is-light-blue Create New Document
section
label.label Enter the new document path:
p.control.is-fullwidth(v-class='{ "is-loading": isLoading }')
p.control.is-fullwidth(v-bind:class='{ "is-loading": isLoading }')
input.input(type='text', placeholder='page-name', v-model='entrypath', autofocus)
span.help.is-danger(v-show='isInvalid') This document path is invalid!
footer
@@ -15,30 +15,29 @@
</template>
<script>
import { isEmpty } from 'lodash'
// import { makeSafePath } from '../helpers/pages'
import { mapState } from 'vuex'
export default {
name: 'modal-create',
name: 'modal-create-page',
props: ['basepath'],
data () {
return {
isLoading: false
}
},
computed: mapState('createPage', {
entrypath: '',
isShown: 'shown',
isInvalid: 'invalid'
}),
computed: {
entrypath () { return this.$store.state.modalCreatePage.entrypath }
isShown () { return this.$store.state.modalCreatePage.shown }
isInvalid () { return this.$store.state.modalCreatePage.invalid }
},
methods: {
cancel: function () {
this.$store.dispatch('createPageClose')
this.$store.dispatch('modalCreatePage/close')
},
create: function () {
this.isInvalid = false
let newDocPath = makeSafePath(this.entrypath)
if (isEmpty(newDocPath)) {
let newDocPath = this.helpers.pages.makeSafePath(this.entrypath)
if (this._.isEmpty(newDocPath)) {
this.$store.createPage.commit('')
} else {
this.isLoading = true
@@ -47,7 +46,7 @@
}
},
mounted () {
// this.entrypath = currentBasePath + '/new-page'
this.$store.commit('modalCreatePage/pathChange', this.basepath + '/new-page')
}
}
</script>

6
client/js/components/modal-create-user.vue
View File

@@ -36,7 +36,7 @@
<script>
export default {
name: 'admin-users-create',
name: 'modal-create-user',
data () {
return {
email: '',
@@ -48,12 +48,12 @@
},
computed: {
isShown () {
return this.$store.state.adminUsersCreate.shown
return this.$store.state.modalCreateUser.shown
}
},
methods: {
cancel () {
this.$store.dispatch('adminUsersCreateClose')
this.$store.dispatch('modalCreateUser/close')
this.email = ''
this.provider = 'local'
},

6
client/js/components/page-loader.js
View File

@@ -1,13 +1,13 @@
'use strict'
import $ from 'jquery'
import delay from 'lodash/delay'
import _ from 'lodash'
module.exports = {
complete () {
complete() {
$('#page-loader').addClass('is-loaded')
delay(() => {
_.delay(() => {
$('#page-loader').addClass('is-hidden')
}, 1100)
}

3
client/js/components/search.vue
View File

@@ -18,7 +18,6 @@
</template>
<script>
import * as _ from 'lodash'
import * as $ from 'jquery'
export default {
@@ -44,7 +43,7 @@
socket.emit('search', { terms: val }, (data) => {
self.searchres = data.match
self.searchsuggest = data.suggest
self.searchmovearr = _.concat([], self.searchres, self.searchsuggest)
self.searchmovearr = self._.concat([], self.searchres, self.searchsuggest)
if (self.searchload > 0) { self.searchload-- }
})
} else {

14
client/js/components/tree.vue
View File

@@ -15,8 +15,6 @@
</template>
<script>
import * as _ from 'lodash'
export default {
name: '',
data () {
@@ -31,9 +29,9 @@
self.$nextTick(() => {
socket.emit('treeFetch', { basePath }, (data) => {
if (self.tree.length > 0) {
let branch = _.last(self.tree)
let branch = self._.last(self.tree)
branch.hasChildren = true
_.find(branch.pages, { _id: basePath }).isActive = true
self._.find(branch.pages, { _id: basePath }).isActive = true
}
self.tree.push({
hasChildren: false,
@@ -49,14 +47,14 @@
unfold (entryPath) {
let self = this
let lastIndex = 0
_.forEach(self.tree, branch => {
self._.forEach(self.tree, branch => {
lastIndex++
if (_.find(branch.pages, { _id: entryPath }) !== undefined) {
if (self._.find(branch.pages, { _id: entryPath }) !== undefined) {
return false
}
})
self.tree = _.slice(self.tree, 0, lastIndex)
let branch = _.last(self.tree)
self.tree = self._.slice(self.tree, 0, lastIndex)
let branch = self._.last(self.tree)
branch.hasChildren = false
branch.pages.forEach(page => {
page.isActive = false

8
client/js/helpers/index.js Normal file
View File

@@ -0,0 +1,8 @@
'use strict'
export default {
helpers: {
form: require('./form'),
pages: require('./pages')
}
}

12
client/js/store/modules/modal-create-page.js
View File

@@ -1,15 +1,19 @@
'use strict'
export default {
namespaced: true,
state: {
shown: false
entrypath: '',
shown: false,
invalid: false
},
getters: {},
mutations: {
shownChange: (state, shownState) => { state.shown = shownState }
shownChange: (state, shownState) => { state.shown = shownState },
pathChange: (state, newpath) => { state.entrypath = newpath }
},
actions: {
adminUsersCreateOpen({ commit }) { commit('shownChange', true) },
adminUsersCreateClose({ commit }) { commit('shownChange', false) }
open({ commit }) { commit('shownChange', true) },
close({ commit }) { commit('shownChange', false) }
}
}

5
client/js/store/modules/modal-create-user.js
View File

@@ -1,6 +1,7 @@
'use strict'
export default {
namespaced: true,
state: {
shown: false
},
@@ -9,7 +10,7 @@ export default {
shownChange: (state, shownState) => { state.shown = shownState }
},
actions: {
adminUsersCreateOpen({ commit }) { commit('shownChange', true) },
adminUsersCreateClose({ commit }) { commit('shownChange', false) }
open({ commit }) { commit('shownChange', true) },
close({ commit }) { commit('shownChange', false) }
}
}

56
fuse.js
View File

@@ -46,6 +46,32 @@ if (args.d) {
console.info(colors.bgWhite.black(' Starting Fuse in BUILD mode... '))
}
// ======================================================
// BUILD VARS
// ======================================================
const ALIASES = {
'brace-ext-modelist': 'brace/ext/modelist.js',
'simplemde': 'simplemde/dist/simplemde.min.js',
'socket-io-client': 'socket.io-client/dist/socket.io.js',
'vue': (dev) ? 'vue/dist/vue.js' : 'vue/dist/vue.min.js',
'vue-lodash': 'vue-lodash/dist/vue-lodash.min.js'
}
const SHIMS = {
_preinit: {
source: '.build/_preinit.js',
exports: '_preinit'
},
jquery: {
source: 'node_modules/jquery/dist/jquery.js',
exports: '$'
},
mathjax: {
source: 'node_modules/mathjax/MathJax.js',
exports: 'MathJax'
}
}
// ======================================================
// Global Tasks
// ======================================================
@@ -191,27 +217,6 @@ let globalTasks = Promise.mapSeries([
// Fuse Tasks
// ======================================================
const ALIASES = {
'brace-ext-modelist': 'brace/ext/modelist.js',
'simplemde': 'simplemde/dist/simplemde.min.js',
'socket-io-client': 'socket.io-client/dist/socket.io.js',
'vue': (dev) ? 'vue/dist/vue.js' : 'vue/dist/vue.min.js'
}
const SHIMS = {
_preinit: {
source: '.build/_preinit.js',
exports: '_preinit'
},
jquery: {
source: 'node_modules/jquery/dist/jquery.js',
exports: '$'
},
mathjax: {
source: 'node_modules/mathjax/MathJax.js',
exports: 'MathJax'
}
}
globalTasks.then(() => {
let fuse = fsbx.FuseBox.init({
homeDir: './client',
@@ -222,7 +227,7 @@ globalTasks.then(() => {
fsbx.EnvPlugin({ NODE_ENV: (dev) ? 'development' : 'production' }),
fsbx.VuePlugin(),
['.scss', fsbx.SassPlugin({ outputStyle: (dev) ? 'nested' : 'compressed' }), fsbx.CSSPlugin()],
fsbx.BabelPlugin({ comments: false, presets: ['es2015'] }),
dev && fsbx.BabelPlugin({ comments: false, presets: ['es2015'] }),
fsbx.JSONPlugin(),
!dev && fsbx.UglifyESPlugin({
compress: { unused: false },
@@ -240,13 +245,14 @@ globalTasks.then(() => {
})
}
const bundleLibs = fuse.bundle('libs').instructions('~ index.js - brace')
const bundleApp = fuse.bundle('app').instructions('!> [index.js]')
// const bundleLibs = fuse.bundle('libs').instructions('~ index.js - brace')
// const bundleApp = fuse.bundle('app').instructions('!> [index.js]')
const bundleApp = fuse.bundle('app').instructions('> index.js')
const bundleSetup = fuse.bundle('configure').instructions('> configure.js')
switch (mode) {
case 'dev':
bundleLibs.watch()
// bundleLibs.watch()
bundleApp.watch()
break
case 'dev-configure':

4
package.json
View File

@@ -139,7 +139,7 @@
"eslint-plugin-node": "latest",
"eslint-plugin-promise": "latest",
"eslint-plugin-standard": "latest",
"fuse-box": "^2.0.0",
"fuse-box": "2.1.0-beta.10",
"i18next-xhr-backend": "^1.4.1",
"jest": "latest",
"jquery": "^3.2.1",
@@ -147,6 +147,7 @@
"jquery-simple-upload": "^1.0.0",
"jquery-smooth-scroll": "^2.2.0",
"jquery-sticky": "^1.0.4",
"lodash-cli": "^4.17.4",
"lodash-es": "^4.17.4",
"mathjax": "^2.7.1",
"node-sass": "latest",
@@ -159,6 +160,7 @@
"vee-validate": "^2.0.0-rc.3",
"vue": "^2.3.3",
"vue-clipboards": "^1.0.0",
"vue-lodash": "^1.0.3",
"vue-resource": "^1.3.3",
"vue-template-compiler": "^2.3.3",
"vue-template-es2015-compiler": "^1.5.2",

2
server/views/auth/login.pug
View File

@@ -18,7 +18,7 @@ html(data-logic='login')
link(rel='manifest', href='/manifest.json')
// JS / CSS
script(type='text/javascript', src='/js/libs.min.js')
//- script(type='text/javascript', src='/js/libs.min.js')
script(type='text/javascript', src='/js/app.min.js')
body

2
server/views/error-forbidden.pug
View File

@@ -18,7 +18,7 @@ html(data-logic='error')
link(rel='manifest', href='/manifest.json')
// JS / CSS
script(type='text/javascript', src='/js/libs.min.js')
//- script(type='text/javascript', src='/js/libs.min.js')
script(type='text/javascript', src='/js/app.min.js')
body(class='is-forbidden')

2
server/views/error-notexist.pug
View File

@@ -18,7 +18,7 @@ html(data-logic='error')
link(rel='manifest', href='/manifest.json')
// JS / CSS
script(type='text/javascript', src='/js/libs.min.js')
//- script(type='text/javascript', src='/js/libs.min.js')
script(type='text/javascript', src='/js/app.min.js')
body(class='is-notexist')

2
server/views/error.pug
View File

@@ -18,7 +18,7 @@ html(data-logic='error')
link(rel='manifest', href='/manifest.json')
// JS / CSS
script(type='text/javascript', src='/js/libs.min.js')
//- script(type='text/javascript', src='/js/libs.min.js')
script(type='text/javascript', src='/js/app.min.js')
body(class='is-error')

2
server/views/layout.pug
View File

@@ -23,7 +23,7 @@ html
var siteRoot = '!{appconfig.host}';
//- JS / CSS
script(type='text/javascript', src='/js/libs.min.js')
//- script(type='text/javascript', src='/js/libs.min.js')
script(type='text/javascript', src='/js/app.min.js')
block head

4
server/views/pages/admin/users.pug
View File

@@ -3,7 +3,7 @@ extends ./_layout.pug
block rootNavRight
loading-spinner
.nav-item
a.button(v-on:click='$store.dispatch("adminUsersCreateOpen")')
a.button(v-on:click='$store.dispatch("modalCreateUser/open")')
i.icon-plus
span= t('admin:users.createauthorize')
@@ -43,4 +43,4 @@ block adminContent
td.is-centered= moment(usr.createdAt).format('lll')
td.is-centered= moment(usr.updatedAt).format('lll')
admin-users-create
modal-create-user

6
server/views/pages/view.pug
View File

@@ -25,13 +25,12 @@ block rootNavRight
a.button(href='/edit/' + pageData.meta.path)
i.icon-document-text
span= t('nav.edit')
a.button.btn-create-prompt
a.button(v-on:click='$store.dispatch("modalCreatePage/open")')
i.icon-plus
span= t('nav.create')
block content
//- #page-type-view.page-type-container(data-entrypath=pageData.meta.path)
content-view(inline-template)
.container.is-fluid.has-mkcontent
.columns.is-gapless
@@ -82,6 +81,5 @@ block content
.content.mkcontent
!= pageData.html
include ../modals/create.pug
include ../modals/move.pug
modal-create-page(basepath=pageData.meta.path)
anchor

BIN
yarn.lock
View File

Binary file not shown.