123 lines
3.9 KiB
Vue
123 lines
3.9 KiB
Vue
<template>
|
|
<div class="side-bar__panel side-bar__panel--menu">
|
|
<div class="menu-info-entries">
|
|
<div class="menu-entry menu-entry--info flex flex--row flex--align-center" v-if="loginToken">
|
|
<div class="menu-entry__icon menu-entry__icon--image">
|
|
<user-image :user-id="loginToken.sub"></user-image>
|
|
</div>
|
|
<span>Signed in as <b>{{loginToken.name}}</b>.</span>
|
|
</div>
|
|
<div class="menu-entry menu-entry--info flex flex--row flex--align-center" v-if="syncToken">
|
|
<div class="menu-entry__icon menu-entry__icon--image">
|
|
<icon-provider :provider-id="currentWorkspace.providerId"></icon-provider>
|
|
</div>
|
|
<span><b>{{currentWorkspace.name}}</b> synced.</span>
|
|
</div>
|
|
<div class="menu-entry menu-entry--info flex flex--row flex--align-center" v-else>
|
|
<div class="menu-entry__icon menu-entry__icon--disabled">
|
|
<icon-sync-off></icon-sync-off>
|
|
</div>
|
|
<span><b>{{currentWorkspace.name}}</b> not synced.</span>
|
|
</div>
|
|
</div>
|
|
<menu-entry v-if="!loginToken" @click.native="signin">
|
|
<icon-login slot="icon"></icon-login>
|
|
<div>Sign in with Google</div>
|
|
<span>Sync your main workspace and unlock functionalities.</span>
|
|
</menu-entry>
|
|
<menu-entry @click.native="setPanel('workspaces')">
|
|
<icon-database slot="icon"></icon-database>
|
|
<div>Workspaces</div>
|
|
<span>Switch to another workspace.</span>
|
|
</menu-entry>
|
|
<hr>
|
|
<menu-entry @click.native="setPanel('sync')">
|
|
<icon-sync slot="icon"></icon-sync>
|
|
<div>Synchronize</div>
|
|
<span>Sync your files in the Cloud.</span>
|
|
</menu-entry>
|
|
<menu-entry @click.native="setPanel('publish')">
|
|
<icon-upload slot="icon"></icon-upload>
|
|
<div>Publish</div>
|
|
<span>Export your files to the web.</span>
|
|
</menu-entry>
|
|
<menu-entry @click.native="setPanel('history')">
|
|
<icon-history slot="icon"></icon-history>
|
|
<div>File history</div>
|
|
<span>Track and restore file revisions.</span>
|
|
</menu-entry>
|
|
<menu-entry @click.native="fileProperties">
|
|
<icon-view-list slot="icon"></icon-view-list>
|
|
<div>File properties</div>
|
|
<span>Add metadata and configure extensions.</span>
|
|
</menu-entry>
|
|
<hr>
|
|
<menu-entry @click.native="setPanel('toc')">
|
|
<icon-toc slot="icon"></icon-toc>
|
|
Table of contents
|
|
</menu-entry>
|
|
<menu-entry @click.native="setPanel('help')">
|
|
<icon-help-circle slot="icon"></icon-help-circle>
|
|
Markdown cheat sheet
|
|
</menu-entry>
|
|
<hr>
|
|
<menu-entry @click.native="setPanel('import')">
|
|
<icon-content-save slot="icon"></icon-content-save>
|
|
Import from disk
|
|
</menu-entry>
|
|
<menu-entry @click.native="setPanel('export')">
|
|
<icon-content-save slot="icon"></icon-content-save>
|
|
Export to disk
|
|
</menu-entry>
|
|
<menu-entry @click.native="print">
|
|
<icon-printer slot="icon"></icon-printer>
|
|
Print
|
|
</menu-entry>
|
|
<hr>
|
|
<menu-entry @click.native="setPanel('more')">
|
|
More...
|
|
</menu-entry>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import { mapGetters, mapActions } from 'vuex';
|
|
import MenuEntry from './common/MenuEntry';
|
|
import UserImage from '../UserImage';
|
|
import googleHelper from '../../services/providers/helpers/googleHelper';
|
|
import syncSvc from '../../services/syncSvc';
|
|
|
|
export default {
|
|
components: {
|
|
MenuEntry,
|
|
UserImage,
|
|
},
|
|
computed: {
|
|
...mapGetters('workspace', [
|
|
'currentWorkspace',
|
|
'syncToken',
|
|
'loginToken',
|
|
]),
|
|
},
|
|
methods: {
|
|
...mapActions('data', {
|
|
setPanel: 'setSideBarPanel',
|
|
}),
|
|
signin() {
|
|
return googleHelper.signin()
|
|
.then(
|
|
() => syncSvc.requestSync(),
|
|
() => {}, // Cancel
|
|
);
|
|
},
|
|
fileProperties() {
|
|
return this.$store.dispatch('modal/open', 'fileProperties')
|
|
.catch(() => {}); // Cancel
|
|
},
|
|
print() {
|
|
print();
|
|
},
|
|
},
|
|
};
|
|
</script>
|