Skip to content

Commit

Permalink
chore: Move left sidebar to specific component
Browse files Browse the repository at this point in the history
Signed-off-by: Vitor Mattos <vitor@php.rio>
  • Loading branch information
vitormattos authored and backportbot-libresign[bot] committed Apr 2, 2024
1 parent 1abe822 commit d08e31b
Show file tree
Hide file tree
Showing 2 changed files with 140 additions and 94 deletions.
97 changes: 3 additions & 94 deletions src/App.vue
Original file line number Diff line number Diff line change
Expand Up @@ -23,54 +23,7 @@

<template>
<NcContent app-name="libresign">
<NcAppNavigation :class="{'icon-loading' : loading }">
<template #list>
<NcAppNavigationItem v-if="back_to_signature"
class="back_to_signature"
icon="icon-history"
:name="t('libresign', 'Back to sign')"
@click="goToSign" />

<NcAppNavigationItem v-if="canRequestSign"
id="request-files"
:to="{name: 'requestFiles'}"
:name="t('libresign', 'Request')"
@click="unselectFile">
<template #icon>
<FileSignIcon :size="20" />
</template>
</NcAppNavigationItem>
<NcAppNavigationItem id="timeline"
:to="{ name: 'timeline' }"
:name="t('libresign', 'Files')"
@click="unselectFile">
<template #icon>
<FolderIcon :size="20" />
</template>
</NcAppNavigationItem>
<NcAppNavigationItem id="validation"
:to="{name: 'validation'}"
:name="t('libresign', 'Validate')"
@click="unselectFile">
<template #icon>
<FileCheckIcon :size="20" />
</template>
</NcAppNavigationItem>

<NcAppNavigationItem v-if="config.identificationDocumentsFlow && config.isApprover"
:to="{name: 'DocsAccountValidation'}"
:name="t('libresign', 'Documents Validation')">
<template #icon>
<AccountCheckIcon :size="20" />
</template>
</NcAppNavigationItem>
</template>
<template #footer>
<NcAppNavigationSettings :title="t('libresign', 'Settings')">
<CroppedLayoutSettings />
</NcAppNavigationSettings>
</template>
</NcAppNavigation>
<LeftSidebar />
<NcAppContent :class="{'icon-loading' : loading }">
<router-view v-if="!loading" :key="$route.name " :loading.sync="loading" />
<NcEmptyContent v-if="isRoot" :description="t('libresign', 'LibreSign, digital signature app for Nextcloud.')">
Expand All @@ -85,82 +38,38 @@

<script>
import NcContent from '@nextcloud/vue/dist/Components/NcContent.js'
import NcAppNavigation from '@nextcloud/vue/dist/Components/NcAppNavigation.js'
import NcAppNavigationItem from '@nextcloud/vue/dist/Components/NcAppNavigationItem.js'
import NcAppNavigationSettings from '@nextcloud/vue/dist/Components/NcAppNavigationSettings.js'
import NcAppContent from '@nextcloud/vue/dist/Components/NcAppContent.js'
import NcEmptyContent from '@nextcloud/vue/dist/Components/NcEmptyContent.js'
import LogoLibreSign from './../img/logo-gray.svg'
import CroppedLayoutSettings from './Components/Settings/CroppedLayoutSettings.vue'
import LeftSidebar from './Components/LeftSidebar/LeftSidebar.vue'
import RightSidebar from './Components/RightSidebar/RightSidebar.vue'
import { loadState } from '@nextcloud/initial-state'
import FileSignIcon from 'vue-material-design-icons/FileSign.vue'
import FolderIcon from 'vue-material-design-icons/Folder.vue'
import FileCheckIcon from 'vue-material-design-icons/FileCheck.vue'
import AccountCheckIcon from 'vue-material-design-icons/AccountCheck.vue'
import { useFilesStore } from './store/files.js'
export default {
name: 'App',
components: {
NcContent,
NcAppNavigation,
NcAppNavigationItem,
NcAppNavigationSettings,
NcAppContent,
NcEmptyContent,
CroppedLayoutSettings,
LeftSidebar,
RightSidebar,
FileSignIcon,
FolderIcon,
FileCheckIcon,
AccountCheckIcon,
},
setup() {
const filesStore = useFilesStore()
return { filesStore }
},
data() {
return {
canRequestSign: loadState('libresign', 'can_request_sign', false),
config: loadState('libresign', 'config', {
hasSignatureFile: false,
identificationDocumentsFlow: false,
isApprover: false,
phoneNumber: '',
}),
loading: false,
LogoLibreSign,
}
},
computed: {
back_to_signature() {
return this.$route.query._back_to_signature
},
isRoot() {
return this.$route.path === '/'
},
},
methods: {
unselectFile() {
this.filesStore.selectFile()
},
goToSign() {
const route = this.$router.resolve({ name: 'SignPDF', params: { uuid: this.back_to_signature } })
window.location = route.href
},
},
}
</script>

<style lang="scss">
.app-libresign {
.app-navigation {
.back_to_signature
.app-navigation-entry__title {
color: var(--color-warning, #eca700);
}
.app-navigation-entry.active {
background-color: var(--color-primary-element) !important;
.app-navigation-entry-link{
Expand Down
137 changes: 137 additions & 0 deletions src/Components/LeftSidebar/LeftSidebar.vue
Original file line number Diff line number Diff line change
@@ -0,0 +1,137 @@
<!--
- @copyright Copyright (c) 2024 Vitor Mattos <vitor@php.rio>
-
- @author Vitor Mattos <vitor@php.rio>
-
- @license GNU AGPL version 3 or any later version
-
- This program is free software: you can redistribute it and/or modify
- it under the terms of the GNU Affero General Public License as
- published by the Free Software Foundation, either version 3 of the
- License, or (at your option) any later version.
-
- This program is distributed in the hope that it will be useful,
- but WITHOUT ANY WARRANTY; without even the implied warranty of
- MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
- GNU Affero General Public License for more details.
-
- You should have received a copy of the GNU Affero General Public License
- along with this program. If not, see <http://www.gnu.org/licenses/>.
-->

<template>
<NcAppNavigation>
<template #list>
<NcAppNavigationItem v-if="back_to_signature"
class="back_to_signature"
icon="icon-history"
:name="t('libresign', 'Back to sign')"
@click="goToSign" />

<NcAppNavigationItem v-if="canRequestSign"
id="request-files"
:to="{name: 'requestFiles'}"
:name="t('libresign', 'Request')"
@click="unselectFile">
<template #icon>
<FileSignIcon :size="20" />
</template>
</NcAppNavigationItem>
<NcAppNavigationItem id="timeline"
:to="{ name: 'timeline' }"
:name="t('libresign', 'Files')"
@click="unselectFile">
<template #icon>
<FolderIcon :size="20" />
</template>
</NcAppNavigationItem>
<NcAppNavigationItem id="validation"
:to="{name: 'validation'}"
:name="t('libresign', 'Validate')"
@click="unselectFile">
<template #icon>
<FileCheckIcon :size="20" />
</template>
</NcAppNavigationItem>

<NcAppNavigationItem v-if="config.identificationDocumentsFlow && config.isApprover"
:to="{name: 'DocsAccountValidation'}"
:name="t('libresign', 'Documents Validation')">
<template #icon>
<AccountCheckIcon :size="20" />
</template>
</NcAppNavigationItem>
</template>
<template #footer>
<NcAppNavigationSettings :title="t('libresign', 'Settings')">
<CroppedLayoutSettings />
</NcAppNavigationSettings>
</template>
</NcAppNavigation>
</template>

<script>
import NcAppNavigation from '@nextcloud/vue/dist/Components/NcAppNavigation.js'
import NcAppNavigationItem from '@nextcloud/vue/dist/Components/NcAppNavigationItem.js'
import NcAppNavigationSettings from '@nextcloud/vue/dist/Components/NcAppNavigationSettings.js'
import { loadState } from '@nextcloud/initial-state'
import { useFilesStore } from '../../store/files.js'
import AccountCheckIcon from 'vue-material-design-icons/AccountCheck.vue'
import FileCheckIcon from 'vue-material-design-icons/FileCheck.vue'
import FileSignIcon from 'vue-material-design-icons/FileSign.vue'
import FolderIcon from 'vue-material-design-icons/Folder.vue'
import CroppedLayoutSettings from '../Settings/CroppedLayoutSettings.vue'
export default {
name: 'LeftSidebar',
components: {
NcAppNavigation,
NcAppNavigationItem,
NcAppNavigationSettings,
AccountCheckIcon,
FileCheckIcon,
FolderIcon,
FileSignIcon,
CroppedLayoutSettings,
},
setup() {
const filesStore = useFilesStore()
return { filesStore }
},
data() {
return {
canRequestSign: loadState('libresign', 'can_request_sign', false),
config: loadState('libresign', 'config', {
identificationDocumentsFlow: false,
isApprover: false,
}),
}
},
computed: {
back_to_signature() {
return this.$route.query._back_to_signature
},
},
methods: {
unselectFile() {
this.filesStore.selectFile()
},
goToSign() {
const route = this.$router.resolve({ name: 'SignPDF', params: { uuid: this.back_to_signature } })
window.location = route.href
},
},
}
</script>

<style lang="scss">
.app-libresign {
.app-navigation {
.back_to_signature
.app-navigation-entry__title {
color: var(--color-warning, #eca700);
}
}
}
</style>

0 comments on commit d08e31b

Please sign in to comment.