Merge branch 'main' of bitbucket.org:studiotem/jandl-taskmanager-app

This commit is contained in:
StudioTem committed 2023-07-12 14:46:46 +02:00
commit a8abb07d29
10 files changed
+118 -21

No files matched your search

Binary file not shown.

After

Width:  |  Height:  |  Size: 86 KiB

@@ -21,6 +21,9 @@
<v-icon size="small" icon="mdi-close" @click.stop="remove(uploadedFiles.indexOf(file))"></v-icon> <v-icon size="small" icon="mdi-close" @click.stop="remove(uploadedFiles.indexOf(file))"></v-icon>
</v-chip> </v-chip>
</div> </div>
<div v-if="isSaving" class="d-flex align-center">
<img v-if="isSaving" class="gif-loader" :src="require('@/plugins/app/_img/spinner.gif')" alt="Loading...">
</div>
</div> </div>
</div> </div>
</template> </template>
@@ -33,6 +36,11 @@ export default {
files: { files: {
type: Array, type: Array,
default: () => [] default: () => []
},
isSaving: {
type: Boolean,
required: false
} }
}, },
@@ -78,4 +86,7 @@ export default {
position: absolute position: absolute
width: 1px width: 1px
height: 1px height: 1px
.gif-loader
height: 30px
</style> </style>
@@ -58,7 +58,6 @@ export default {
mounted() { mounted() {
const monthIndex = new Date().getMonth() const monthIndex = new Date().getMonth()
this.filter.month = monthIndex < 9 ? `0${monthIndex + 1}` : `${monthIndex + 1}` this.filter.month = monthIndex < 9 ? `0${monthIndex + 1}` : `${monthIndex + 1}`
console.log(this.enrichedEmployees)
}, },
computed: { computed: {
@@ -1,15 +1,20 @@
<template> <template>
<p class="mt-5">Prílohy</p> <p class="mt-5">Prílohy</p>
<div class="w-100 d-flex align-center"> <div class="w-100 d-flex align-center">
<W-loadable :content="files" emptyMessage="Žiadne prílohy neboli nahraté">
<div v-for="(file, index) in files" :key="file.id" class="d-flex align-center flex-wrap" :class="[index === 0 ? 'ml-0' : 'ml-2']"> <div v-for="(file, index) in files" :key="file.id" class="d-flex align-center flex-wrap" :class="[index === 0 ? 'ml-0' : 'ml-2']">
<v-chip class="mt-2"> <v-chip class="mt-2">
<p @click="downloadFile(index)" class="cursor-pointer"> <p @click="handleDownload(index)" class="cursor-pointer">{{ file.name }}</p>
{{ file.name }}
</p>
<v-icon class="mx-1" icon="mdi-paperclip"></v-icon> <v-icon class="mx-1" icon="mdi-paperclip"></v-icon>
<p>{{ (file.file_size / (1024 * 1024)).toFixed(2) }} MB</p>
</v-chip> </v-chip>
<div v-if="showDownload" class="d-flex align-center">
<img class="gif-loader" :src="require('@/plugins/app/_img/spinner.gif')" alt="Loading...">
<p class="ml-2">Súbor sa sťahuje, počkajte prosím</p>
</div> </div>
</div> </div>
</W-loadable>
</div>
</template> </template>
<script> <script>
@@ -18,7 +23,29 @@ export default {
files: { files: {
type: Array, type: Array,
default: () => [] default: () => []
},
downloadFile: {
type: Function,
required: true
},
showDownload: {
type: Boolean,
required: true
}
},
methods: {
handleDownload(index) {
this.downloadFile(index)
} }
} }
} }
</script> </script>
<style lang="sass" scoped>
.gif-loader
height: 30px
margin-left: 30px
</style>
@@ -7,10 +7,12 @@
<Z-remaining-time :hours="mastertask.duration - mastertask.time_worked" /> <Z-remaining-time :hours="mastertask.duration - mastertask.time_worked" />
<Z-spent-time :hours="mastertask.time_worked" :is-exceeded="mastertask.time_worked > mastertask.duration" /> <Z-spent-time :hours="mastertask.time_worked" :is-exceeded="mastertask.time_worked > mastertask.duration" />
<Z-description :description="mastertask.description" /> <Z-description :description="mastertask.description" />
<Z-files :files="mastertask.files" /> <Z-files :files="mastertask.files" :download-file="downloadFile" :showDownload="showDownload" />
</template> </template>
<script> <script>
import * as FileSaver from "file-saver"
import ZCreatedBy from '../../_components/read-only/z-created-by.vue' import ZCreatedBy from '../../_components/read-only/z-created-by.vue'
import ZDeadline from '../../_components/read-only/z-deadline.vue' import ZDeadline from '../../_components/read-only/z-deadline.vue'
import ZDescription from '../../_components/read-only/z-description.vue' import ZDescription from '../../_components/read-only/z-description.vue'
@@ -39,6 +41,31 @@ export default {
type: Object, type: Object,
required: true required: true
} }
},
data() {
return {
showDownload: false
}
},
methods: {
async downloadFile(id) {
this.showDownload = true // Show loader
const file = this.mastertask.files[id]
// Iterate over each file in the task
const fileName = file.name
fetch(file.path)
.then(response => response.blob())
.then(blob => {
FileSaver.saveAs(blob, fileName)
this.showDownload = false
})
.catch(error => this.$toast.error(error))
},
} }
} }
</script> </script>
@@ -45,10 +45,11 @@
<QuillEditor ref="description" v-model="mastertask.description" placeholder="Popis" theme="snow" class="rich-text-editor" @input="mastertask.description = $event.srcElement.innerHTML" /> <QuillEditor ref="description" v-model="mastertask.description" placeholder="Popis" theme="snow" class="rich-text-editor" @input="mastertask.description = $event.srcElement.innerHTML" />
</div> </div>
<Z-files-upload class="mt-15 files" :files="mastertask.files" @files-uploaded="filesUploaded" /> <Z-files-upload class="mt-15 files" :files="mastertask.files" @files-uploaded="filesUploaded" :is-saving="isSaving" />
</v-card-actions> </v-card-actions>
<v-btn class="button primary" @click="save()">{{ mastertask.id ? 'ULOŽIŤ' : 'VYTVORIŤ' }}</v-btn> <v-btn class="button primary" v-if="!isSaving" @click="save()">{{ mastertask.id ? 'ULOŽIŤ' : 'VYTVORIŤ' }}</v-btn>
<v-btn class="button primary disabled" v-else disabled>{{ $t('Ukladám...')}}</v-btn>
</v-card> </v-card>
<v-card v-else height="100%" class="d-flex flex-column scrolling"> <v-card v-else height="100%" class="d-flex flex-column scrolling">
@@ -130,6 +131,7 @@ export default {
errorUtils, errorUtils,
v$: useVuelidate(), v$: useVuelidate(),
mastertask: null, mastertask: null,
isSaving: false,
showAddEmployeeInput: false, showAddEmployeeInput: false,
date: null, date: null,
projectCodeSearch: null projectCodeSearch: null
@@ -226,6 +228,7 @@ export default {
}, },
async showModal({mastertask, editMode = false}) { async showModal({mastertask, editMode = false}) {
this.isSaving = false
this.editMode = null this.editMode = null
this.visible = true this.visible = true
this.mastertask = null this.mastertask = null
@@ -269,6 +272,7 @@ export default {
this._mergeDeadlineTimeDate() this._mergeDeadlineTimeDate()
try { try {
this.isSaving = true
this.mastertask.deadline = moment(this.mastertask.deadline).format('YYYY-MM-DD HH:MM:SS') this.mastertask.deadline = moment(this.mastertask.deadline).format('YYYY-MM-DD HH:MM:SS')
if (this.mastertask.id) await this.$axios.put_auth_data(`v1/mastertasks/${this.mastertask.id}`, this.mastertask) if (this.mastertask.id) await this.$axios.put_auth_data(`v1/mastertasks/${this.mastertask.id}`, this.mastertask)
@@ -278,6 +282,8 @@ export default {
this.closeModal() this.closeModal()
} catch (error) { } catch (error) {
this.$toast.error(error) this.$toast.error(error)
} finally {
this.isSaving = true
} }
}, },
@@ -54,6 +54,7 @@ import moment from 'moment'
import errorUtils from '@/plugins/lib@auth/_utils/error.utils' import errorUtils from '@/plugins/lib@auth/_utils/error.utils'
import useVuelidate from '@vuelidate/core' import useVuelidate from '@vuelidate/core'
import { required, numeric, minValue } from '@vuelidate/validators' import { required, numeric, minValue } from '@vuelidate/validators'
import tmUtils from '@/plugins/tm@_utils/tm.utils'
export default { export default {
props: { props: {
@@ -101,12 +102,15 @@ export default {
time: typeof this.form.hours == 'string' ? parseFloat(this.form.hours) : this.form.hours time: typeof this.form.hours == 'string' ? parseFloat(this.form.hours) : this.form.hours
}) })
if(subtask.deadline) subtask.deadline = tmUtils.formatDateTimeForBackend(subtask.deadline)
this._update(subtask) this._update(subtask)
}, },
async deleteTimesheet({ id }) { async deleteTimesheet({ id }) {
const subtask = JSON.parse(JSON.stringify(this.subtask)) const subtask = JSON.parse(JSON.stringify(this.subtask))
subtask.timesheets = subtask.timesheets.filter(timesheet => timesheet.id != id) subtask.timesheets = subtask.timesheets.filter(timesheet => timesheet.id != id)
if(subtask.deadline) subtask.deadline = tmUtils.formatDateTimeForBackend(subtask.deadline)
this._update(subtask) this._update(subtask)
}, },
@@ -8,10 +8,12 @@
<A-task-remaining-time :hours="subtask.duration - subtask.spent_time" /> <A-task-remaining-time :hours="subtask.duration - subtask.spent_time" />
<A-task-spent-time :hours="subtask.spent_time" :subtask="subtask" /> <A-task-spent-time :hours="subtask.spent_time" :subtask="subtask" />
<A-task-description :description="subtask.description" :mastertask-description="subtask.master_task_description" /> <A-task-description :description="subtask.description" :mastertask-description="subtask.master_task_description" />
<Z-files :files="subtask.files" /> <Z-files :files="subtask.files" :download-file="downloadFile" :showDownload="showDownload" />
</template> </template>
<script> <script>
import * as FileSaver from "file-saver"
import AMastertaskName from './_components/a-mastertask-name.vue' import AMastertaskName from './_components/a-mastertask-name.vue'
import AMastertaskStatus from './_components/a-mastertask-status.vue' import AMastertaskStatus from './_components/a-mastertask-status.vue'
import ATaskTimeblocks from './_components/a-task-timeblocks.vue' import ATaskTimeblocks from './_components/a-task-timeblocks.vue'
@@ -44,6 +46,30 @@ export default {
type: Object, type: Object,
required: true required: true
} }
},
data() {
return {
showDownload: false
}
},
methods: {
async downloadFile(id) {
this.showDownload = true // Show loader
// Iterate over each file in the task
const file = this.subtask.files[id]
const fileName = file.name
fetch(file.path)
.then(response => response.blob())
.then(blob => {
FileSaver.saveAs(blob, fileName)
this.showDownload = false
})
.catch(error => this.$toast.error(error))
},
} }
} }
</script> </script>
+8 -11
View File
@@ -55,10 +55,11 @@
<QuillEditor ref="description" v-model="subtask.description" placeholder="Popis" theme="snow" class="rich-text-editor" @input="subtask.description = $event.srcElement.innerHTML" /> <QuillEditor ref="description" v-model="subtask.description" placeholder="Popis" theme="snow" class="rich-text-editor" @input="subtask.description = $event.srcElement.innerHTML" />
</div> </div>
<Z-files-upload class="mt-15 files" :files="subtask.files" @files-uploaded="filesUploaded" /> <Z-files-upload class="mt-15 files" :files="subtask.files" @files-uploaded="filesUploaded" :is-saving="isSaving" />
</v-card-actions> </v-card-actions>
<v-btn class="button primary" @click="save()">{{ subtask.id ? "UPRAVIŤ" : "VYTVORIŤ" }}</v-btn> <v-btn class="button primary" v-if="!isSaving" @click="save()">{{ subtask.id ? "UPRAVIŤ" : "VYTVORIŤ" }}</v-btn>
<v-btn class="button primary disabled" v-else disabled>{{ $t('Ukladám...')}}</v-btn>
</v-card> </v-card>
<v-card v-else height="100%" class="d-flex flex-column scrolling"> <v-card v-else height="100%" class="d-flex flex-column scrolling">
@@ -138,6 +139,7 @@ export default {
editMode: false, editMode: false,
visible: false, visible: false,
subtask: null, subtask: null,
isSaving: false,
errorUtils, errorUtils,
v$: useVuelidate(), v$: useVuelidate(),
employeeValidations: [], employeeValidations: [],
@@ -188,6 +190,7 @@ export default {
methods: { methods: {
async showModal({subtask, editMode = false, mastertask = {}}) { async showModal({subtask, editMode = false, mastertask = {}}) {
this.isSaving = false
this.subtask = null this.subtask = null
this.visible = true this.visible = true
this.$nextTick(() => this.v$.$reset()) this.$nextTick(() => this.v$.$reset())
@@ -233,6 +236,7 @@ export default {
this._mergeDeadlineTimeDate() this._mergeDeadlineTimeDate()
try { try {
this.isSaving = true
this.subtask.deadline = moment(this.subtask.deadline).format('YYYY-MM-DD HH:mm:SS') this.subtask.deadline = moment(this.subtask.deadline).format('YYYY-MM-DD HH:mm:SS')
if (this.subtask?.id) { if (this.subtask?.id) {
@@ -259,15 +263,8 @@ export default {
} catch (error) { } catch (error) {
console.error(error) console.error(error)
this.$toast.error(error) this.$toast.error(error)
} } finally {
}, this.isSaving = true
async downloadFile(id) {
try {
const file = await this.$axios.get_auth_data(`v1/subtasks/${this.subtask.id}`, { responseType: "arraybuffer" })
FileSaver.saveAs(file.files[id].path, file.files[id].name)
} catch (error) {
this.$toast.error(error)
} }
}, },
@@ -54,6 +54,6 @@ export default {
</script> </script>
<style lang="sass" scoped> <style lang="sass" scoped>
div // div
height: calc( 100vh - 329px ) // height: calc( 100vh - 329px )
</style> </style>