deblan/forms
1
0
Fork 0
Code Issues Pull requests Releases Wiki Activity

Results TopBar

Browse source 
Signed-off-by: Jonas Rittershofer <jotoeri@users.noreply.github.com>
This commit is contained in:
Jonas 2020-04-24 15:37:46 +02:00 committed by Jonas Rittershofer
parent 54c277e687
commit 865b44bb4d
1 changed files with 87 additions and 62 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

149
src/views/Results.vue
View file

@ -23,59 +23,85 @@
--> -->
<template> <template>
<AppContent> <AppContent v-if="loadingResults">
<div class="section"> <EmptyContent icon="icon-loading">
<h2>{{ t('forms', 'Results of {title}', { title: form.title }) }}</h2> {{ t('forms', 'Loading results') }}
<button class="button btn primary" @click="download"> </EmptyContent>
{{ t('forms', 'Export to CSV') }} </AppContent>
<AppContent v-else>
<TopBar>
<button @click="showEdit">
<span class="icon-forms" role="img" />
{{ t('forms', 'Back to form') }}
</button> </button>
</TopBar>
<header v-if="!noSubmissions">
<h2>{{ t('forms', 'Results of {title}', { title: form.title }) }}</h2>
<div v-for="sum in stats" :key="sum"> <div v-for="sum in stats" :key="sum">
{{ sum }} {{ sum }}
</div> </div>
<div id="app-content" :class="{'icon-loading': loading}"> </header>
<transition-group
name="list" <!-- No submissions -->
tag="div" <section v-if="noSubmissions">
class="table"> <EmptyContent>
<ResultItem {{ t('forms', 'There are no submissions to this form.') }}
key="0" <!-- Button to copy Share-Link? -->
:header="true" /> </EmptyContent>
<li </section>
is="resultItem"
v-for="(answer, index) in answers" <section v-else>
:key="answer.id" <button id="exportButton" class="primary" @click="download">
:answer="answer" <span class="icon-download-white" role="img" />
@viewResults="viewFormResults(index, form.form, 'results')" /> {{ t('forms', 'Export to CSV') }}
</transition-group> </button>
<modal-dialog /> <transition-group
</div> name="list"
</div> tag="div"
class="table">
<ResultItem
key="0"
:header="true" />
<ResultItem
v-for="answer in answers"
:key="answer.id"
:answer="answer" />
</transition-group>
</section>
</AppContent> </AppContent>
</template> </template>
<script> <script>
import { generateUrl } from '@nextcloud/router'
import { showError } from '@nextcloud/dialogs'
import AppContent from '@nextcloud/vue/dist/Components/AppContent'
import axios from '@nextcloud/axios'
import EmptyContent from '../components/EmptyContent'
import TopBar from '../components/TopBar'
import ViewsMixin from '../mixins/ViewsMixin'
import ResultItem from '../components/resultItem' import ResultItem from '../components/resultItem'
import json2csvParser from 'json2csv' import json2csvParser from 'json2csv'
import axios from '@nextcloud/axios'
import ViewsMixin from '../mixins/ViewsMixin'
import { generateUrl } from '@nextcloud/router'
import AppContent from '@nextcloud/vue/dist/Components/AppContent'
export default { export default {
name: 'Results', name: 'Results',
components: { components: {
AppContent, AppContent,
EmptyContent,
ResultItem, ResultItem,
TopBar,
}, },
mixins: [ViewsMixin], mixins: [ViewsMixin],
data() { data() {
return { return {
loading: true, loadingResults: true,
answers: [], answers: [],
} }
}, },
@ -111,41 +137,46 @@ export default {
return sums.sort() return sums.sort()
}, },
noSubmissions() {
return this.answers && this.answers.length === 0
},
}, },
created() { beforeMount() {
this.indexPage = OC.generateUrl('apps/forms/') this.loadFormResults()
this.loadForms()
}, },
methods: { methods: {
loadForms() {
this.loading = true showEdit() {
axios.get(generateUrl('apps/forms/api/v1/submissions/{hash}', { hash: this.$route.params.hash }))
.then((response) => {
if (response.data == null) {
this.answers = null
OC.Notification.showTemporary('Access Denied')
} else {
this.answers = response.data
}
this.loading = false
}, (error) => {
/* eslint-disable-next-line no-console */
console.log(error.response)
this.loading = false
})
},
viewFormResults(index, form, name) {
this.$router.push({ this.$router.push({
name: name, name: 'edit',
params: { params: {
hash: form.id, hash: this.form.hash,
}, },
}) })
}, },
download() {
async loadFormResults() {
this.loadingResults = true
console.debug('Loading Results')
try {
const response = await axios.get(generateUrl('/apps/forms/api/v1/submissions/{hash}', {
hash: this.form.hash,
}))
this.answers = response.data
console.debug(this.answers)
} catch (error) {
console.error(error)
showError(t('forms', 'There was an error while loading results'))
} finally {
this.loadingResults = false
}
},
download() {
this.loading = true this.loading = true
axios.get(OC.generateUrl('apps/forms/get/form/' + this.$route.params.hash)) axios.get(OC.generateUrl('apps/forms/get/form/' + this.$route.params.hash))
.then((response) => { .then((response) => {
@ -178,8 +209,7 @@ export default {
} }
</script> </script>
<style lang="scss"> <style lang="scss" scoped>
.table { .table {
width: 100%; width: 100%;
margin-top: 45px; margin-top: 45px;
@ -189,12 +219,7 @@ export default {
flex-wrap: nowrap; flex-wrap: nowrap;
} }
#emptycontent { #exportButton {
.icon-forms { width: max-content;
background-color: black;
-webkit-mask: url('./img/app.svg') no-repeat 50% 50%;
mask: url('./img/app.svg') no-repeat 50% 50%;
}
} }
</style> </style>