Close navigation on mobile on new form
Signed-off-by: Jonas Rittershofer <jotoeri@users.noreply.github.com>
This commit is contained in:
parent
6a52d83675
commit
749466923c
|
@ -28,6 +28,7 @@
|
|||
<AppNavigationForm v-for="form in forms"
|
||||
:key="form.id"
|
||||
:form="form"
|
||||
@mobile-close-navigation="mobileCloseNavigation"
|
||||
@delete="onDeleteForm" />
|
||||
</AppNavigation>
|
||||
|
||||
|
@ -66,6 +67,7 @@
|
|||
</template>
|
||||
|
||||
<script>
|
||||
import { emit } from '@nextcloud/event-bus'
|
||||
import { showError } from '@nextcloud/dialogs'
|
||||
import { generateUrl } from '@nextcloud/router'
|
||||
import axios from '@nextcloud/axios'
|
||||
|
@ -74,6 +76,7 @@ import AppContent from '@nextcloud/vue/dist/Components/AppContent'
|
|||
import AppNavigation from '@nextcloud/vue/dist/Components/AppNavigation'
|
||||
import AppNavigationNew from '@nextcloud/vue/dist/Components/AppNavigationNew'
|
||||
import Content from '@nextcloud/vue/dist/Components/Content'
|
||||
import isMobile from '@nextcloud/vue/src/mixins/isMobile'
|
||||
|
||||
import AppNavigationForm from './components/AppNavigationForm'
|
||||
import EmptyContent from './components/EmptyContent'
|
||||
|
@ -90,6 +93,8 @@ export default {
|
|||
EmptyContent,
|
||||
},
|
||||
|
||||
mixins: [isMobile],
|
||||
|
||||
data() {
|
||||
return {
|
||||
loading: true,
|
||||
|
@ -124,6 +129,15 @@ export default {
|
|||
},
|
||||
|
||||
methods: {
|
||||
/**
|
||||
* Closes the App-Navigation on mobile-devices
|
||||
*/
|
||||
mobileCloseNavigation() {
|
||||
if (this.isMobile) {
|
||||
emit('toggle-navigation', { open: false })
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Initial forms load
|
||||
*/
|
||||
|
@ -150,6 +164,7 @@ export default {
|
|||
const newForm = response.data
|
||||
this.forms.push(newForm)
|
||||
this.$router.push({ name: 'edit', params: { hash: newForm.hash } })
|
||||
this.mobileCloseNavigation()
|
||||
} catch (error) {
|
||||
showError(t('forms', 'Unable to create a new form'))
|
||||
console.error(error)
|
||||
|
|
|
@ -26,7 +26,8 @@
|
|||
:exact="true"
|
||||
:icon="icon"
|
||||
:title="formTitle"
|
||||
:to="{ name: 'edit', params: { hash: form.hash } }">
|
||||
:to="{ name: 'edit', params: { hash: form.hash } }"
|
||||
@click="mobileCloseNavigation">
|
||||
<template v-if="!loading" #actions>
|
||||
<ActionLink
|
||||
:href="formLink"
|
||||
|
@ -38,7 +39,8 @@
|
|||
<ActionRouter :close-after-click="true"
|
||||
:exact="true"
|
||||
icon="icon-comment"
|
||||
:to="{ name: 'results', params: { hash: form.hash } }">
|
||||
:to="{ name: 'results', params: { hash: form.hash } }"
|
||||
@click="mobileCloseNavigation">
|
||||
{{ t('forms', 'Responses') }}
|
||||
</ActionRouter>
|
||||
<!-- <ActionRouter :close-after-click="true"
|
||||
|
@ -158,6 +160,13 @@ export default {
|
|||
},
|
||||
|
||||
methods: {
|
||||
/**
|
||||
* Closes the App-Navigation on mobile-devices
|
||||
*/
|
||||
mobileCloseNavigation() {
|
||||
this.$emit('mobile-close-navigation')
|
||||
},
|
||||
|
||||
async onDeleteForm() {
|
||||
if (!confirm(t('forms', 'Are you sure you want to delete {title}?', { title: this.formTitle }))) {
|
||||
return
|
||||
|
|
|
@ -54,6 +54,7 @@ export default {
|
|||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
text-align: center;
|
||||
|
||||
&__icon {
|
||||
width: 64px;
|
||||
|
|
Loading…
Reference in a new issue