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

fix: admin UI improvements

Browse Source
This commit is contained in:
NGPixel 2020-05-22 23:29:42 -04:00
parent d44c9a05cf
commit 15a45f8b91
18 changed files with 164 additions and 130 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
client/components/admin/admin-analytics.vue
View File

@ -8,7 +8,7 @@
.headline.primary--text.animated.fadeInLeft {{ $t('admin:analytics.title') }} .headline.primary--text.animated.fadeInLeft {{ $t('admin:analytics.title') }}
.subtitle-1.grey--text.animated.fadeInLeft.wait-p4s {{ $t('admin:analytics.subtitle') }} .subtitle-1.grey--text.animated.fadeInLeft.wait-p4s {{ $t('admin:analytics.subtitle') }}
v-spacer v-spacer
v-btn.animated.fadeInDown.wait-p2s.mr-3(outlined, color='grey', @click='refresh', large) v-btn.animated.fadeInDown.wait-p2s.mr-3(icon, outlined, color='grey', @click='refresh')
v-icon mdi-refresh v-icon mdi-refresh
v-btn.animated.fadeInDown(color='success', @click='save', depressed, large) v-btn.animated.fadeInDown(color='success', @click='save', depressed, large)
v-icon(left) mdi-check v-icon(left) mdi-check

4
client/components/admin/admin-api.vue
View File

@ -15,9 +15,9 @@
status-indicator.mr-3(negative, pulse) status-indicator.mr-3(negative, pulse)
.caption.red--text.animated.fadeInLeft {{$t('admin:api.disabled')}} .caption.red--text.animated.fadeInLeft {{$t('admin:api.disabled')}}
v-spacer v-spacer
v-btn.mr-3.animated.fadeInDown.wait-p2s(outlined, color='grey', large, @click='refresh') v-btn.mr-3.animated.fadeInDown.wait-p2s(outlined, color='grey', icon, @click='refresh')
v-icon mdi-refresh v-icon mdi-refresh
v-btn.mr-3.animated.fadeInDown.wait-p1s(:color='enabled ? `red` : `green`', depressed, large, @click='globalSwitch', dark, :loading='isToggleLoading') v-btn.mr-3.animated.fadeInDown.wait-p1s(:color='enabled ? `red` : `green`', depressed, @click='globalSwitch', dark, :loading='isToggleLoading')
v-icon(left) mdi-power v-icon(left) mdi-power
span(v-if='!enabled') {{$t('admin:api.enableButton')}} span(v-if='!enabled') {{$t('admin:api.enableButton')}}
span(v-else) {{$t('admin:api.disableButton')}} span(v-else) {{$t('admin:api.disableButton')}}

4
client/components/admin/admin-auth.vue
View File

@ -8,7 +8,9 @@
.headline.primary--text.animated.fadeInLeft {{ $t('admin:auth.title') }} .headline.primary--text.animated.fadeInLeft {{ $t('admin:auth.title') }}
.subtitle-1.grey--text.animated.fadeInLeft.wait-p4s {{ $t('admin:auth.subtitle') }} .subtitle-1.grey--text.animated.fadeInLeft.wait-p4s {{ $t('admin:auth.subtitle') }}
v-spacer v-spacer
v-btn.animated.fadeInDown.wait-p2s.mr-3(outlined, color='grey', @click='refresh', large) v-btn.animated.fadeInDown.wait-p3s(icon, outlined, color='grey', href='https://docs.requarks.io/auth', target='_blank')
v-icon mdi-help-circle
v-btn.animated.fadeInDown.wait-p2s.mx-3(icon, outlined, color='grey', @click='refresh')
v-icon mdi-refresh v-icon mdi-refresh
v-btn.animated.fadeInDown(color='success', @click='save', depressed, large) v-btn.animated.fadeInDown(color='success', @click='save', depressed, large)
v-icon(left) mdi-check v-icon(left) mdi-check

6
client/components/admin/admin-comments.vue
View File

@ -8,9 +8,11 @@
.headline.primary--text.animated.fadeInLeft {{$t('admin:comments.title')}} .headline.primary--text.animated.fadeInLeft {{$t('admin:comments.title')}}
.subtitle-1.grey--text.animated.fadeInLeft.wait-p2s {{$t('admin:comments.subtitle')}} .subtitle-1.grey--text.animated.fadeInLeft.wait-p2s {{$t('admin:comments.subtitle')}}
v-spacer v-spacer
v-btn.mx-1.animated.fadeInDown.wait-p2s(outlined, color='grey', @click='refresh', large) v-btn.animated.fadeInDown.wait-p3s(icon, outlined, color='grey', href='https://docs.requarks.io/comments', target='_blank')
v-icon mdi-help-circle
v-btn.mx-3.animated.fadeInDown.wait-p2s(icon, outlined, color='grey', @click='refresh')
v-icon mdi-refresh v-icon mdi-refresh
v-btn.ml-1.animated.fadeInDown(color='success', @click='save', depressed, large) v-btn.animated.fadeInDown(color='success', @click='save', depressed, large)
v-icon(left) mdi-check v-icon(left) mdi-check
span {{$t('common:actions.apply')}} span {{$t('common:actions.apply')}}

16
client/components/admin/admin-contribute.vue
View File

@ -27,7 +27,7 @@
) )
v-tab v-tab
span GitHub span GitHub
v-icon.my-1(size='24') mdi-github-circle v-icon.my-1(size='24') mdi-github
v-tab v-tab
span Patreon span Patreon
img.my-1(src='/_assets/svg/icon-patreon.svg', style='height: 24px;') img.my-1(src='/_assets/svg/icon-patreon.svg', style='height: 24px;')
@ -46,22 +46,22 @@
v-tab-item(:transition='false', :reverse-transition='false') v-tab-item(:transition='false', :reverse-transition='false')
.body-2.pa-3 {{ $t('admin:contribute.github') }} .body-2.pa-3 {{ $t('admin:contribute.github') }}
a.ml-3(href='https://github.com/users/NGPixel/sponsorship', :title='$t(`admin:contribute.becomeASponsor`)') a.ml-3(href='https://github.com/users/NGPixel/sponsorship', :title='$t(`admin:contribute.becomeASponsor`)')
img(src='/img/donate_github.svg', :alt='$t(`admin:contribute.becomeASponsor`)' style='width:200px;') img(src='/_assets/img/donate_github.svg', :alt='$t(`admin:contribute.becomeASponsor`)' style='width:200px;')
v-tab-item(:transition='false', :reverse-transition='false') v-tab-item(:transition='false', :reverse-transition='false')
.body-2.pa-3 {{ $t('admin:contribute.patreon') }} .body-2.pa-3 {{ $t('admin:contribute.patreon') }}
a.ml-3(href='https://www.patreon.com/bePatron?u=16744039', :title='$t(`admin:contribute.becomeAPatron`)') a.ml-3(href='https://www.patreon.com/bePatron?u=16744039', :title='$t(`admin:contribute.becomeAPatron`)')
img(src='/img/donate_patreon.png', :alt='$t(`admin:contribute.becomeAPatron`)' style='width:200px;') img(src='/_assets/img/donate_patreon.png', :alt='$t(`admin:contribute.becomeAPatron`)' style='width:200px;')
v-tab-item(:transition='false', :reverse-transition='false') v-tab-item(:transition='false', :reverse-transition='false')
.body-2.pa-3 {{ $t('admin:contribute.openCollective') }} .body-2.pa-3 {{ $t('admin:contribute.openCollective') }}
a.ml-3(href='https://opencollective.com/wikijs/donate', :title='$t(`admin:contribute.makeADonation`)') a.ml-3(href='https://opencollective.com/wikijs/donate', :title='$t(`admin:contribute.makeADonation`)')
img(src='/img/donate_opencollective.png', :alt='$t(`admin:contribute.makeADonation`)' style='width:300px;') img(src='/_assets/img/donate_opencollective.png', :alt='$t(`admin:contribute.makeADonation`)' style='width:300px;')
v-tab-item(:transition='false', :reverse-transition='false') v-tab-item(:transition='false', :reverse-transition='false')
.body-2.pa-3 {{ $t('admin:contribute.paypal') }} .body-2.pa-3 {{ $t('admin:contribute.paypal') }}
.ml-3 .ml-3
form(action='https://www.paypal.com/cgi-bin/webscr', method='post', target='_top') form(action='https://www.paypal.com/cgi-bin/webscr', method='post', target='_top')
input(type='hidden', name='cmd', value='_s-xclick') input(type='hidden', name='cmd', value='_s-xclick')
input(type='hidden', name='hosted_button_id', value='FLV5X255Z9CJU') input(type='hidden', name='hosted_button_id', value='FLV5X255Z9CJU')
input(type='image', src='/img/donate_paypal.png', border='0', name='submit', title='PayPal - The safer, easier way to pay online!', alt='Donate with PayPal button') input(type='image', src='/_assets/img/donate_paypal.png', border='0', name='submit', title='PayPal - The safer, easier way to pay online!', alt='Donate with PayPal button')
img(alt='', border='0', src='https://www.paypal.com/en_CA/i/scr/pixel.gif', width='1', height='1') img(alt='', border='0', src='https://www.paypal.com/en_CA/i/scr/pixel.gif', width='1', height='1')
v-tab-item(:transition='false', :reverse-transition='false') v-tab-item(:transition='false', :reverse-transition='false')
.body-2.pa-3 {{ $t('admin:contribute.ethereum') }} .body-2.pa-3 {{ $t('admin:contribute.ethereum') }}
@ -69,7 +69,7 @@
.admin-contribute-ethaddress .admin-contribute-ethaddress
strong Ethereum Address strong Ethereum Address
span 0xE1d55C19aE86f6Bcbfb17e7f06aCe96BdBb22Cb5 span 0xE1d55C19aE86f6Bcbfb17e7f06aCe96BdBb22Cb5
div: img(src='/img/donate_eth_qr.png') div: img(src='/_assets/img/donate_eth_qr.png')
v-tab-item(:transition='false', :reverse-transition='false') v-tab-item(:transition='false', :reverse-transition='false')
.body-2.pa-3 {{ $t('admin:contribute.tshirts') }} .body-2.pa-3 {{ $t('admin:contribute.tshirts') }}
v-card-actions.ml-2 v-card-actions.ml-2
@ -81,7 +81,7 @@
.body-2.pl-3 .body-2.pl-3
ul ul
i18next(path='admin:contribute.submitAnIdea', tag='li') i18next(path='admin:contribute.submitAnIdea', tag='li')
a(href='https://wiki.js.org/feedback', target='_blank') {{ $t('admin:contribute.submitAnIdeaLink') }} a(href='https://requests.requarks.io/wiki', target='_blank') {{ $t('admin:contribute.submitAnIdeaLink') }}
i18next(path='admin:contribute.foundABug', tag='li') i18next(path='admin:contribute.foundABug', tag='li')
a(href='https://github.com/Requarks/wiki/issues', target='_blank') Github a(href='https://github.com/Requarks/wiki/issues', target='_blank') Github
i18next(path='admin:contribute.helpTranslate', tag='li') i18next(path='admin:contribute.helpTranslate', tag='li')
@ -159,7 +159,7 @@
v-divider v-divider
v-list-item v-list-item
v-list-item-avatar(tile) v-list-item-avatar(tile)
img(src='/svg/logo-icons8.svg', alt='Icons8') img(src='/_assets/svg/logo-icons8.svg', alt='Icons8')
v-list-item-content v-list-item-content
v-list-item-title Icons8 v-list-item-title Icons8
v-list-item-subtitle All the Icons You Need. Guaranteed. v-list-item-subtitle All the Icons You Need. Guaranteed.

9
client/components/admin/admin-groups-edit.vue
View File

@ -8,13 +8,11 @@
.headline.blue--text.text--darken-2 Edit Group .headline.blue--text.text--darken-2 Edit Group
.subtitle-1.grey--text {{group.name}} .subtitle-1.grey--text {{group.name}}
v-spacer v-spacer
.caption.grey--text ID #[strong {{group.id}}] v-btn(color='grey', icon, outlined, to='/groups')
v-divider.mx-3(vertical)
v-btn(color='grey', large, outlined, to='/groups')
v-icon mdi-arrow-left v-icon mdi-arrow-left
v-dialog(v-model='deleteGroupDialog', max-width='500', v-if='!group.isSystem') v-dialog(v-model='deleteGroupDialog', max-width='500', v-if='!group.isSystem')
template(v-slot:activator='{ on }') template(v-slot:activator='{ on }')
v-btn.ml-2(color='red', large, outlined, v-on='on') v-btn.ml-2(color='red', icon, outlined, v-on='on')
v-icon(color='red') mdi-trash-can-outline v-icon(color='red') mdi-trash-can-outline
v-card v-card
.dialog-header.is-red Delete Group? .dialog-header.is-red Delete Group?
@ -46,6 +44,9 @@
v-tab-item(key='users', :transition='false', :reverse-transition='false') v-tab-item(key='users', :transition='false', :reverse-transition='false')
group-users(v-model='group', @refresh='refresh') group-users(v-model='group', @refresh='refresh')
v-card-chin
v-spacer
.caption.grey--text.pr-2 Group ID #[strong {{group.id}}]
</template> </template>
<script> <script>

2
client/components/admin/admin-groups.vue
View File

@ -8,7 +8,7 @@
.headline.blue--text.text--darken-2.animated.fadeInLeft Groups .headline.blue--text.text--darken-2.animated.fadeInLeft Groups
.subtitle-1.grey--text.animated.fadeInLeft.wait-p4s Manage groups and their permissions .subtitle-1.grey--text.animated.fadeInLeft.wait-p4s Manage groups and their permissions
v-spacer v-spacer
v-btn.animated.fadeInDown.wait-p2s.mr-3(color='grey', outlined, @click='refresh', large) v-btn.animated.fadeInDown.wait-p2s.mr-3(color='grey', outlined, @click='refresh', icon)
v-icon mdi-refresh v-icon mdi-refresh
v-dialog(v-model='newGroupDialog', max-width='500') v-dialog(v-model='newGroupDialog', max-width='500')
template(v-slot:activator='{ on }') template(v-slot:activator='{ on }')

2
client/components/admin/admin-navigation.vue
View File

@ -8,7 +8,7 @@
.headline.primary--text.animated.fadeInLeft {{$t('navigation.title')}} .headline.primary--text.animated.fadeInLeft {{$t('navigation.title')}}
.subtitle-1.grey--text.animated.fadeInLeft.wait-p4s {{$t('navigation.subtitle')}} .subtitle-1.grey--text.animated.fadeInLeft.wait-p4s {{$t('navigation.subtitle')}}
v-spacer v-spacer
v-btn.animated.fadeInDown.wait-p2s.mr-3(outlined, color='grey', @click='refresh', large) v-btn.animated.fadeInDown.wait-p2s.mr-3(icon, outlined, color='grey', @click='refresh')
v-icon mdi-refresh v-icon mdi-refresh
v-btn.animated.fadeInDown(color='success', depressed, @click='save', large) v-btn.animated.fadeInDown(color='success', depressed, @click='save', large)
v-icon(left) mdi-check v-icon(left) mdi-check

138
client/components/admin/admin-pages-edit.vue
View File

@ -23,32 +23,71 @@
status-indicator.mr-3.ml-4(active, pulse) status-indicator.mr-3.ml-4(active, pulse)
.caption.blue--text {{$t('common:page.global')}} .caption.blue--text {{$t('common:page.global')}}
v-spacer v-spacer
v-btn.mx-1.animated.fadeInRight.wait-p4s(color='grey', large, outlined, to='/pages') v-btn.animated.fadeInDown.wait-p3s(color='grey', icon, outlined, to='/pages')
v-icon mdi-arrow-left v-icon mdi-arrow-left
v-divider.mx-1.animated.fadeInRight.wait-p3s.mx-1(vertical) v-menu(offset-y, origin='top right')
v-dialog(v-model='deletePageDialog', max-width='500')
template(v-slot:activator='{ on }') template(v-slot:activator='{ on }')
v-btn.mx-1.animated.fadeInDown.wait-p1s(color='red', large, outlined, v-on='on') v-btn.mx-3.animated.fadeInDown.wait-p2s(color='black', v-on='on', depressed, dark)
v-icon(color='red') mdi-trash-can-outline span Actions
v-card v-icon(right) mdi-chevron-down
.dialog-header.is-short.is-red v-list(dense, nav)
v-icon.mr-2(color='white') mdi-file-document-box-remove-outline v-list-item(:href='`/` + page.locale + `/` + page.path')
span {{$t('common:page.delete')}} v-list-item-icon
v-card-text.pt-5 v-icon(color='indigo') mdi-text-subject
i18next.body-2(path='common:page.deleteTitle', tag='div') v-list-item-title View
span.red--text.text--darken-2(place='title') {{page.title}} v-list-item(:href='`/e/` + page.locale + `/` + page.path')
.caption {{$t('common:page.deleteSubtitle')}} v-list-item-icon
v-chip.mt-3.ml-0.mr-1(label, color='red lighten-4', disabled, small) v-icon(color='indigo') mdi-pencil
.caption.red--text.text--darken-2 {{page.locale.toUpperCase()}} v-list-item-title Edit
v-chip.mt-3.mx-0(label, color='red lighten-5', disabled, small) v-list-item(@click='', disabled)
span.red--text.text--darken-2 /{{page.path}} v-list-item-icon
v-card-chin v-icon(color='grey') mdi-cube-scan
v-spacer v-list-item-title Re-Render
v-btn(text, @click='deletePageDialog = false', :disabled='loading') {{$t('common:actions.cancel')}} v-list-item(@click='', disabled)
v-btn(color='red darken-2', @click='deletePage', :loading='loading').white--text {{$t('common:actions.delete')}} v-list-item-icon
v-btn.ml-1.animated.fadeInDown(color='teal', large, outlined, @click='rerenderPage') v-icon(color='grey') mdi-earth-remove
v-icon(left) mdi-cube-scan v-list-item-title Unpublish
span Re-render v-list-item(:href='`/s/` + page.locale + `/` + page.path')
v-list-item-icon
v-icon(color='indigo') mdi-code-tags
v-list-item-title View Source
v-list-item(:href='`/h/` + page.locale + `/` + page.path')
v-list-item-icon
v-icon(color='indigo') mdi-history
v-list-item-title View History
v-list-item(@click='', disabled)
v-list-item-icon
v-icon(color='grey') mdi-content-duplicate
v-list-item-title Duplicate
v-list-item(@click='', disabled)
v-list-item-icon
v-icon(color='grey') mdi-content-save-move-outline
v-list-item-title Move / Rename
v-dialog(v-model='deletePageDialog', max-width='500')
template(v-slot:activator='{ on }')
v-list-item(v-on='on')
v-list-item-icon
v-icon(color='red') mdi-trash-can-outline
v-list-item-title Delete
v-card
.dialog-header.is-short.is-red
v-icon.mr-2(color='white') mdi-file-document-box-remove-outline
span {{$t('common:page.delete')}}
v-card-text.pt-5
i18next.body-2(path='common:page.deleteTitle', tag='div')
span.red--text.text--darken-2(place='title') {{page.title}}
.caption {{$t('common:page.deleteSubtitle')}}
v-chip.mt-3.ml-0.mr-1(label, color='red lighten-4', disabled, small)
.caption.red--text.text--darken-2 {{page.locale.toUpperCase()}}
v-chip.mt-3.mx-0(label, color='red lighten-5', disabled, small)
span.red--text.text--darken-2 /{{page.path}}
v-card-chin
v-spacer
v-btn(text, @click='deletePageDialog = false', :disabled='loading') {{$t('common:actions.cancel')}}
v-btn(color='red darken-2', @click='deletePage', :loading='loading').white--text {{$t('common:actions.delete')}}
v-btn.animated.fadeInDown(color='success', large, depressed, disabled)
v-icon(left) mdi-check
span Save Changes
v-flex(xs12, lg6) v-flex(xs12, lg6)
v-card.animated.fadeInUp v-card.animated.fadeInUp
v-toolbar(color='primary', dense, dark, flat) v-toolbar(color='primary', dense, dark, flat)
@ -69,17 +108,11 @@
v-list-item-content v-list-item-content
v-list-item-title: .overline.grey--text Locale v-list-item-title: .overline.grey--text Locale
v-list-item-subtitle.body-2(:class='$vuetify.theme.dark ? `grey--text text--lighten-2` : `grey--text text--darken-3`') {{ page.locale }} v-list-item-subtitle.body-2(:class='$vuetify.theme.dark ? `grey--text text--lighten-2` : `grey--text text--darken-3`') {{ page.locale }}
v-list-item-action
v-btn(icon, x-small)
v-icon(color='grey') mdi-pencil
v-divider v-divider
v-list-item v-list-item
v-list-item-content v-list-item-content
v-list-item-title: .overline.grey--text Path v-list-item-title: .overline.grey--text Path
v-list-item-subtitle.body-2(:class='$vuetify.theme.dark ? `grey--text text--lighten-2` : `grey--text text--darken-3`') {{ page.path }} v-list-item-subtitle.body-2(:class='$vuetify.theme.dark ? `grey--text text--lighten-2` : `grey--text text--darken-3`') {{ page.path }}
v-list-item-action
v-btn(icon, x-small)
v-icon(color='grey') mdi-pencil
v-divider v-divider
v-list-item v-list-item
v-list-item-content v-list-item-content
@ -90,27 +123,11 @@
v-list-item-content v-list-item-content
v-list-item-title: .overline.grey--text Content Type v-list-item-title: .overline.grey--text Content Type
v-list-item-subtitle.body-2(:class='$vuetify.theme.dark ? `grey--text text--lighten-2` : `grey--text text--darken-3`') {{ page.contentType || '?' }} v-list-item-subtitle.body-2(:class='$vuetify.theme.dark ? `grey--text text--lighten-2` : `grey--text text--darken-3`') {{ page.contentType || '?' }}
v-divider
v-toolbar.elevation-2.mt-3.animated.fadeInUp.wait-p4s(:color='$vuetify.theme.dark ? `grey darken-3-d5` : `white`', dense) v-list-item
v-spacer v-list-item-content
v-btn(color='primary', text, :href='`/` + page.locale + `/` + page.path') v-list-item-title: .overline.grey--text Page Hash
v-icon(left) mdi-text-subject v-list-item-subtitle.body-2(:class='$vuetify.theme.dark ? `grey--text text--lighten-2` : `grey--text text--darken-3`') {{ page.hash }}
span View
v-divider.mx-2(vertical)
v-btn(color='primary', text, :href='`/e/` + page.locale + `/` + page.path')
v-icon(left) mdi-pencil
span Edit
v-divider.mx-2(vertical)
v-btn(color='primary', text, :href='`/s/` + page.locale + `/` + page.path')
v-icon(left) mdi-code-tags
span Source
v-divider.mx-2(vertical)
v-btn(color='primary', text, :href='`/h/` + page.locale + `/` + page.path')
v-icon(left) mdi-history
span History
v-spacer
.caption.mt-4.grey--text.animated.fadeInUp.wait-p6s Page Hash: {{ page.hash }}
v-flex(xs12, lg6) v-flex(xs12, lg6)
v-card.animated.fadeInUp.wait-p2s v-card.animated.fadeInUp.wait-p2s
@ -137,25 +154,6 @@
v-list-item-subtitle.body-2(:class='$vuetify.theme.dark ? `grey--text text--lighten-2` : `grey--text text--darken-3`') {{ page.authorName }} #[em.caption ({{ page.authorEmail }})] v-list-item-subtitle.body-2(:class='$vuetify.theme.dark ? `grey--text text--lighten-2` : `grey--text text--darken-3`') {{ page.authorName }} #[em.caption ({{ page.authorEmail }})]
v-list-item-action v-list-item-action
v-list-item-action-text {{ page.updatedAt | moment('calendar') }} v-list-item-action-text {{ page.updatedAt | moment('calendar') }}
v-card.mt-3.animated.fadeInUp.wait-p4s
v-toolbar(color='primary', dense, dark, flat)
v-icon.mr-2 mdi-history
span Recent History
v-spacer
v-chip(label, color='white', small).primary--text coming soon
v-timeline.mx-3(dense, clipped)
v-timeline-item(color='teal', small, v-if='page.createdAt !== page.updatedAt')
v-layout(justify-space-between)
v-flex(xs7).body-2 Page Modified by #[strong {{ page.authorName }}] #[em.caption ({{ page.authorEmail }})]
v-flex.text-right(xs5).caption.grey--text.text-darken-2 {{ page.updatedAt | moment('calendar') }}
v-timeline-item(hide-dot, small)
.body-2 ...
v-btn.mx-0.mt-1(outlined, color='grey', :href='`/h/` + page.locale + `/` + page.path') View Full History
.body-2 ...
v-timeline-item(color='pink', small)
v-layout(justify-space-between)
v-flex(xs7).body-2 Page created by #[strong {{ page.creatorName }}] #[em.caption ({{ page.creatorEmail }})]
v-flex.text-right(xs5).caption.grey--text.text-darken-2 {{ page.createdAt | moment('calendar') }}
v-layout(row, align-center, v-else) v-layout(row, align-center, v-else)
v-progress-circular(indeterminate, width='2', color='grey') v-progress-circular(indeterminate, width='2', color='grey')

26
client/components/admin/admin-pages.vue
View File

@ -8,39 +8,47 @@
.headline.blue--text.text--darken-2.animated.fadeInLeft Pages .headline.blue--text.text--darken-2.animated.fadeInLeft Pages
.subtitle-1.grey--text.animated.fadeInLeft.wait-p2s Manage pages .subtitle-1.grey--text.animated.fadeInLeft.wait-p2s Manage pages
v-spacer v-spacer
v-btn.animated.fadeInDown.wait-p1s(color='grey', outlined, @click='refresh', large) v-btn.animated.fadeInDown.wait-p1s(icon, color='grey', outlined, @click='refresh')
v-icon.grey--text mdi-refresh v-icon.grey--text mdi-refresh
v-btn.animated.fadeInDown.mx-3(color='primary', outlined, large, @click='recyclebin', disabled) v-btn.animated.fadeInDown.mx-3(color='primary', outlined, @click='recyclebin', disabled)
v-icon(left) mdi-delete-outline v-icon(left) mdi-delete-outline
span Recycle Bin span Recycle Bin
v-btn.animated.fadeInDown(color='primary', depressed, large, to='pages/visualize') v-btn.animated.fadeInDown(color='primary', depressed, large, to='pages/visualize')
v-icon(left) mdi-graph v-icon(left) mdi-graph
span Visualize span Visualize
v-card.wiki-form.mt-3.animated.fadeInUp v-card.mt-3.animated.fadeInUp
v-toolbar(flat, :color='$vuetify.theme.dark ? `grey darken-3-d5` : `grey lighten-5`', height='80') .pa-2.d-flex.align-center(:class='$vuetify.theme.dark ? `grey darken-3-d5` : `grey lighten-3`')
v-spacer
v-text-field( v-text-field(
outlined solo
flat
v-model='search' v-model='search'
prepend-inner-icon='mdi-file-search-outline' prepend-inner-icon='mdi-file-search-outline'
label='Search Pages...' label='Search Pages...'
hide-details hide-details
dense
style='max-width: 400px;'
) )
v-spacer
v-select.ml-2( v-select.ml-2(
outlined solo
flat
hide-details hide-details
dense
label='Locale' label='Locale'
:items='langs' :items='langs'
v-model='selectedLang' v-model='selectedLang'
style='max-width: 250px;'
) )
v-select.ml-2( v-select.ml-2(
outlined solo
flat
hide-details hide-details
dense
label='Publish State' label='Publish State'
:items='states' :items='states'
v-model='selectedState' v-model='selectedState'
style='max-width: 250px;'
) )
v-spacer
v-divider v-divider
v-data-table( v-data-table(
:items='filteredPages' :items='filteredPages'

25
client/components/admin/admin-rendering.vue
View File

@ -5,9 +5,12 @@
.admin-header .admin-header
img.animated.fadeInUp(src='/_assets/svg/icon-process.svg', alt='Rendering', style='width: 80px;') img.animated.fadeInUp(src='/_assets/svg/icon-process.svg', alt='Rendering', style='width: 80px;')
.admin-header-title .admin-header-title
.headline.primary--text.animated.fadeInLeft Rendering .headline.primary--text.animated.fadeInLeft {{ $t('admin:rendering.title') }}
.subtitle-1.grey--text.animated.fadeInLeft.wait-p4s {{ $t('admin:rendering.subtitle') }}
v-spacer v-spacer
v-btn.mx-3.animated.fadeInDown.wait-p2s(outlined, color='grey', @click='refresh', large) v-btn.animated.fadeInDown.wait-p3s(icon, outlined, color='grey', href='https://docs.requarks.io/rendering', target='_blank')
v-icon mdi-help-circle
v-btn.mx-3.animated.fadeInDown.wait-p2s(icon, outlined, color='grey', @click='refresh')
v-icon mdi-refresh v-icon mdi-refresh
v-btn.animated.fadeInDown(color='success', @click='save', depressed, large) v-btn.animated.fadeInDown(color='success', @click='save', depressed, large)
v-icon(left) mdi-check v-icon(left) mdi-check
@ -15,7 +18,7 @@
v-flex.animated.fadeInUp(lg3, xs12) v-flex.animated.fadeInUp(lg3, xs12)
v-toolbar( v-toolbar(
color='primary' color='blue darken-2'
dense dense
flat flat
dark dark
@ -66,7 +69,7 @@
v-flex(lg9, xs12) v-flex(lg9, xs12)
v-card.wiki-form.animated.fadeInUp v-card.wiki-form.animated.fadeInUp
v-toolbar( v-toolbar(
color='grey darken-1' color='indigo'
dark dark
flat flat
dense dense
@ -82,6 +85,16 @@
hide-details hide-details
inset inset
) )
v-card-text.py-2.pl-4
.body-2.pt-3 {{currentRenderer.description}}
.body-2.pt-1.pb-5: a(href='https://docs.requarks.io/en/rendering', target='_blank') Documentation
i18next.body-2(path='admin:auth.strategyState', tag='div', v-if='currentRenderer.isEnabled')
v-chip(color='green', small, dark, label, place='state') {{$t('admin:auth.strategyStateActive')}}
span(v-if='selectedCore === `local`', place='locked') {{$t('admin:auth.strategyStateLocked')}}
span(v-else, place='locked', v-text='')
i18next.body-2(path='admin:auth.strategyState', tag='div', v-else)
v-chip(color='red', small, dark, label, place='state') {{$t('admin:auth.strategyStateInactive')}}
v-divider.mt-3
v-card-text.pb-4.pt-2.pl-4 v-card-text.pb-4.pt-2.pl-4
.overline.my-5 Rendering Module Configuration .overline.my-5 Rendering Module Configuration
.body-2.ml-3(v-if='!currentRenderer.config || currentRenderer.config.length < 1'): em This rendering module has no configuration options you can modify. .body-2.ml-3(v-if='!currentRenderer.config || currentRenderer.config.length < 1'): em This rendering module has no configuration options you can modify.
@ -96,13 +109,14 @@
:hint='cfg.value.hint ? cfg.value.hint : ""' :hint='cfg.value.hint ? cfg.value.hint : ""'
persistent-hint persistent-hint
:class='cfg.value.hint ? "mb-2" : ""' :class='cfg.value.hint ? "mb-2" : ""'
color='indigo'
) )
v-switch( v-switch(
v-else-if='cfg.value.type === "boolean"' v-else-if='cfg.value.type === "boolean"'
:key='cfg.key' :key='cfg.key'
:label='cfg.value.title' :label='cfg.value.title'
v-model='cfg.value.value' v-model='cfg.value.value'
color='primary' color='indigo'
:hint='cfg.value.hint ? cfg.value.hint : ""' :hint='cfg.value.hint ? cfg.value.hint : ""'
persistent-hint persistent-hint
inset inset
@ -116,6 +130,7 @@
:hint='cfg.value.hint ? cfg.value.hint : ""' :hint='cfg.value.hint ? cfg.value.hint : ""'
persistent-hint persistent-hint
:class='cfg.value.hint ? "mb-2" : ""' :class='cfg.value.hint ? "mb-2" : ""'
color='indigo'
) )
v-divider.my-5(v-if='idx < currentRenderer.config.length - 1') v-divider.my-5(v-if='idx < currentRenderer.config.length - 1')
v-card-chin v-card-chin

8
client/components/admin/admin-search.vue
View File

@ -8,12 +8,14 @@
.headline.primary--text.animated.fadeInLeft {{$t('admin:search.title')}} .headline.primary--text.animated.fadeInLeft {{$t('admin:search.title')}}
.subtitle-1.grey--text.animated.fadeInLeft.wait-p2s {{$t('admin:search.subtitle')}} .subtitle-1.grey--text.animated.fadeInLeft.wait-p2s {{$t('admin:search.subtitle')}}
v-spacer v-spacer
v-btn.mx-1.animated.fadeInDown.wait-p2s(outlined, color='grey', @click='refresh', large) v-btn.mr-3.animated.fadeInDown.wait-p3s(icon, outlined, color='grey', href='https://docs.requarks.io/search', target='_blank')
v-icon mdi-help-circle
v-btn.animated.fadeInDown.wait-p2s(icon, outlined, color='grey', @click='refresh')
v-icon mdi-refresh v-icon mdi-refresh
v-btn.mx-2.animated.fadeInDown.wait-p1s(color='black', dark, large, depressed, @click='rebuild') v-btn.mx-3.animated.fadeInDown.wait-p1s(color='black', dark, depressed, @click='rebuild')
v-icon(left) mdi-cached v-icon(left) mdi-cached
span {{$t('admin:search.rebuildIndex')}} span {{$t('admin:search.rebuildIndex')}}
v-btn.ml-1.animated.fadeInDown(color='success', @click='save', depressed, large) v-btn.animated.fadeInDown(color='success', @click='save', depressed, large)
v-icon(left) mdi-check v-icon(left) mdi-check
span {{$t('common:actions.apply')}} span {{$t('common:actions.apply')}}

4
client/components/admin/admin-storage.vue
View File

@ -8,7 +8,9 @@
.headline.primary--text.animated.fadeInLeft {{$t('admin:storage.title')}} .headline.primary--text.animated.fadeInLeft {{$t('admin:storage.title')}}
.subtitle-1.grey--text.animated.fadeInLeft.wait-p4s {{$t('admin:storage.subtitle')}} .subtitle-1.grey--text.animated.fadeInLeft.wait-p4s {{$t('admin:storage.subtitle')}}
v-spacer v-spacer
v-btn.mx-3.animated.fadeInDown.wait-p2s(outlined, color='grey', @click='refresh', large) v-btn.animated.fadeInDown.wait-p3s(icon, outlined, color='grey', href='https://docs.requarks.io/storage', target='_blank')
v-icon mdi-help-circle
v-btn.mx-3.animated.fadeInDown.wait-p2s(icon, outlined, color='grey', @click='refresh')
v-icon mdi-refresh v-icon mdi-refresh
v-btn.animated.fadeInDown(color='success', @click='save', depressed, large) v-btn.animated.fadeInDown(color='success', @click='save', depressed, large)
v-icon(left) mdi-check v-icon(left) mdi-check

2
client/components/admin/admin-tags.vue
View File

@ -8,7 +8,7 @@
.headline.primary--text.animated.fadeInLeft {{$t('tags.title')}} .headline.primary--text.animated.fadeInLeft {{$t('tags.title')}}
.subtitle-1.grey--text.animated.fadeInLeft.wait-p4s {{$t('tags.subtitle')}} .subtitle-1.grey--text.animated.fadeInLeft.wait-p4s {{$t('tags.subtitle')}}
v-spacer v-spacer
v-btn.animated.fadeInDown(outlined, color='grey', @click='refresh', large) v-btn.animated.fadeInDown(outlined, color='grey', @click='refresh', icon)
v-icon mdi-refresh v-icon mdi-refresh
v-container.pa-0.mt-3(fluid, grid-list-lg) v-container.pa-0.mt-3(fluid, grid-list-lg)
v-layout(row) v-layout(row)

9
client/components/admin/admin-users-edit.vue
View File

@ -8,6 +8,8 @@
.headline.blue--text.text--darken-2.animated.fadeInLeft {{$t('admin:users.edit')}} .headline.blue--text.text--darken-2.animated.fadeInLeft {{$t('admin:users.edit')}}
.subtitle-1.grey--text.animated.fadeInLeft.wait-p2s {{user.name}} .subtitle-1.grey--text.animated.fadeInLeft.wait-p2s {{user.name}}
v-spacer v-spacer
i18next.pr-4.caption.grey--text.animated.fadeInDown(path='admin:users.id', tag='div')
strong(place='id') {{user.id}}
template(v-if='user.isActive') template(v-if='user.isActive')
status-indicator.mr-3(positive, pulse) status-indicator.mr-3(positive, pulse)
.caption.green--text {{$t('admin:users.active')}} .caption.green--text {{$t('admin:users.active')}}
@ -21,14 +23,11 @@
status-indicator.mr-3.ml-4(intermediary, pulse) status-indicator.mr-3.ml-4(intermediary, pulse)
.caption.deep-orange--text {{$t('admin:users.unverified')}} .caption.deep-orange--text {{$t('admin:users.unverified')}}
v-spacer v-spacer
i18next.caption.grey--text.animated.fadeInRight.wait-p5s(path='admin:users.id', tag='div') v-btn.ml-3.animated.fadeInDown.wait-p3s(color='grey', icon, outlined, to='/users')
strong(place='id') {{user.id}}
v-divider.animated.fadeInRight.wait-p4s.ml-3(vertical)
v-btn.ml-3.animated.fadeInDown.wait-p3s(color='grey', large, outlined, to='/users')
v-icon mdi-arrow-left v-icon mdi-arrow-left
v-menu(offset-y, origin='top right') v-menu(offset-y, origin='top right')
template(v-slot:activator='{ on }') template(v-slot:activator='{ on }')
v-btn.ml-3.animated.fadeInDown.wait-p2s(color='indigo', v-on='on', large, depressed, dark) v-btn.ml-3.animated.fadeInDown.wait-p2s(color='black', v-on='on', depressed, dark)
span Actions span Actions
v-icon(right) mdi-chevron-down v-icon(right) mdi-chevron-down
v-list(dense, nav) v-list(dense, nav)

23
client/components/admin/admin-users.vue
View File

@ -8,31 +8,36 @@
.headline.blue--text.text--darken-2.animated.fadeInLeft Users .headline.blue--text.text--darken-2.animated.fadeInLeft Users
.subtitle-1.grey--text.animated.fadeInLeft.wait-p2s Manage users .subtitle-1.grey--text.animated.fadeInLeft.wait-p2s Manage users
v-spacer v-spacer
v-btn.animated.fadeInDown.wait-p2s.mr-3(outlined, color='grey', large, @click='refresh') v-btn.animated.fadeInDown.wait-p2s.mr-3(outlined, color='grey', icon, @click='refresh')
v-icon mdi-refresh v-icon mdi-refresh
v-btn.animated.fadeInDown(color='primary', large, depressed, @click='createUser') v-btn.animated.fadeInDown(color='primary', large, depressed, @click='createUser')
v-icon(left) mdi-plus v-icon(left) mdi-plus
span New User span New User
v-card.wiki-form.mt-3.animated.fadeInUp v-card.mt-3.animated.fadeInUp
v-toolbar(flat, :color='$vuetify.theme.dark ? `grey darken-3-d5` : `grey lighten-5`', height='80') .pa-2.d-flex.align-center(:class='$vuetify.theme.dark ? `grey darken-3-d5` : `grey lighten-3`')
v-spacer
v-text-field( v-text-field(
outlined solo
flat
v-model='search' v-model='search'
prepend-inner-icon='mdi-account-search-outline' prepend-inner-icon='mdi-account-search-outline'
label='Search Users...' label='Search Users...'
hide-details hide-details
style='max-width: 400px;'
dense
) )
v-select.ml-2( v-spacer
outlined v-select(
solo
flat
hide-details hide-details
label='Identity Provider' label='Identity Provider'
:items='strategies' :items='strategies'
v-model='filterStrategy' v-model='filterStrategy'
item-text='title' item-text='title'
item-value='key' item-value='key'
style='max-width: 300px;'
dense
) )
v-spacer
v-divider v-divider
v-data-table( v-data-table(
v-model='selected' v-model='selected'
@ -172,7 +177,7 @@ export default {
update: (data) => { update: (data) => {
return _.concat({ return _.concat({
key: 'all', key: 'all',
title: 'All' title: 'All Providers'
}, data.authentication.strategies) }, data.authentication.strategies)
}, },
watchLoading (isLoading) { watchLoading (isLoading) {

12
client/components/editor/editor-modal-editorselect.vue
View File

@ -15,7 +15,7 @@
ripple ripple
) )
v-card-text.text-center(@click='') v-card-text.text-center(@click='')
img(src='/svg/editor-icon-api.svg', alt='API', style='width: 36px; opacity: .5;') img(src='/_assets/svg/editor-icon-api.svg', alt='API', style='width: 36px; opacity: .5;')
.body-2.blue--text.mt-2.text--lighten-2 API Docs .body-2.blue--text.mt-2.text--lighten-2 API Docs
.caption.blue--text.text--lighten-1 REST / GraphQL .caption.blue--text.text--lighten-1 REST / GraphQL
v-fade-transition v-fade-transition
@ -35,7 +35,7 @@
ripple ripple
) )
v-card-text.text-center(@click='') v-card-text.text-center(@click='')
img(src='/svg/editor-icon-wikitext.svg', alt='WikiText', style='width: 36px; opacity: .5;') img(src='/_assets/svg/editor-icon-wikitext.svg', alt='WikiText', style='width: 36px; opacity: .5;')
.body-2.blue--text.mt-2.text--lighten-2 Blog .body-2.blue--text.mt-2.text--lighten-2 Blog
.caption.blue--text.text--lighten-1 Timeline of Posts .caption.blue--text.text--lighten-1 Timeline of Posts
v-fade-transition v-fade-transition
@ -53,7 +53,7 @@
ripple ripple
) )
v-card-text.text-center(@click='selectEditor("code")') v-card-text.text-center(@click='selectEditor("code")')
img(src='/svg/editor-icon-code.svg', alt='Code', style='width: 36px;') img(src='/_assets/svg/editor-icon-code.svg', alt='Code', style='width: 36px;')
.body-2.primary--text.mt-2 Code .body-2.primary--text.mt-2 Code
.caption.grey--text Raw HTML .caption.grey--text Raw HTML
v-flex(xs4) v-flex(xs4)
@ -63,7 +63,7 @@
ripple ripple
) )
v-card-text.text-center(@click='selectEditor("markdown")') v-card-text.text-center(@click='selectEditor("markdown")')
img(src='/svg/editor-icon-markdown.svg', alt='Markdown', style='width: 36px;') img(src='/_assets/svg/editor-icon-markdown.svg', alt='Markdown', style='width: 36px;')
.body-2.primary--text.mt-2 Markdown .body-2.primary--text.mt-2 Markdown
.caption.grey--text Plain Text Formatting .caption.grey--text Plain Text Formatting
v-flex(xs4) v-flex(xs4)
@ -75,7 +75,7 @@
ripple ripple
) )
v-card-text.text-center(@click='') v-card-text.text-center(@click='')
img(src='/svg/editor-icon-tabular.svg', alt='Tabular', style='width: 36px; opacity: .5;') img(src='/_assets/svg/editor-icon-tabular.svg', alt='Tabular', style='width: 36px; opacity: .5;')
.body-2.blue--text.mt-2.text--lighten-2 Tabular .body-2.blue--text.mt-2.text--lighten-2 Tabular
.caption.blue--text.text--lighten-1 Excel-like .caption.blue--text.text--lighten-1 Excel-like
v-fade-transition v-fade-transition
@ -93,7 +93,7 @@
ripple ripple
) )
v-card-text.text-center(@click='selectEditor("ckeditor")') v-card-text.text-center(@click='selectEditor("ckeditor")')
img(src='/svg/editor-icon-ckeditor.svg', alt='Visual Editor', style='width: 36px;') img(src='/_assets/svg/editor-icon-ckeditor.svg', alt='Visual Editor', style='width: 36px;')
.body-2.mt-2.primary--text Visual Editor .body-2.mt-2.primary--text Visual Editor
.caption.grey--text Rich-text WYSIWYG .caption.grey--text Rich-text WYSIWYG
.caption.blue--text.text--lighten-2 {{$t('editor:select.cannotChange')}} .caption.blue--text.text--lighten-2 {{$t('editor:select.cannotChange')}}

2
client/components/welcome.vue
View File

@ -2,7 +2,7 @@
v-app v-app
.onboarding .onboarding
.onboarding-content .onboarding-content
img.animated.fadeIn(src='/svg/logo-wikijs.svg', alt='Wiki.js') img.animated.fadeIn(src='/_assets/svg/logo-wikijs.svg', alt='Wiki.js')
.headline.animated.fadeInUp {{ $t('welcome.title') }} .headline.animated.fadeInUp {{ $t('welcome.title') }}
.subtitle-1.mt-3.animated.fadeInUp.wait-p1s {{ $t('welcome.subtitle') }} .subtitle-1.mt-3.animated.fadeInUp.wait-p1s {{ $t('welcome.subtitle') }}
v-btn.mt-5.animated.fadeInUp.wait-p2s(color='primary', :href='`/e/` + locale + `/home`', x-large) v-btn.mt-5.animated.fadeInUp.wait-p2s(color='primary', :href='`/e/` + locale + `/home`', x-large)