mirror of
https://bitbucket.org/studiotem/jandl-taskmanager-app.git
synced 2026-10-21 14:29:34 +00:00
refactor(task-modals): updated timeblocks to new local dat format
This commit is contained in:
Matej Glasnák committed
1 parent
eaf83bf0cc
commit
0035251080
8 files changed
+1059
-597
No files matched your search
@@ -1,86 +1,139 @@
|
||||
<template>
|
||||
<v-dialog v-model="visible" max-width="500" persistent>
|
||||
<v-card>
|
||||
<div class="d-flex justify-space-between align-center">
|
||||
<h4 class="mt-3">Vyberte časový úsek, ktorý chcete odstrániť</h4>
|
||||
<v-dialog v-model="visible" max-width="500" persistent>
|
||||
<v-card>
|
||||
<div class="d-flex justify-space-between align-center">
|
||||
<h4 class="mt-3">Vyberte časový úsek, ktorý chcete odstrániť</h4>
|
||||
|
||||
<v-icon
|
||||
@click.stop="closeModal()"
|
||||
icon="mdi-close"
|
||||
size="large"
|
||||
></v-icon>
|
||||
</div>
|
||||
<div v-for="(timeblock, index) in subtask.timeblocks" :key="timeblock.id" class="d-flex align-center justify-center mb-3 mt-3">
|
||||
<p class="task-badge rounded-pill" :class="{'strike-through': timeblock.is_finished}">{{ tmUtils.formatDateTime(timeblock.start) }} - {{ tmUtils.formatDateTime(timeblock.end) }}</p>
|
||||
<v-icon @click.stop="subtask.id ? deleteTimeblock(timeblock) : deleteTimeblockWithoutId(index)" class="close-icon circle-border cursor-pointer ml-3 text-red" icon="mdi-close" size="medium" />
|
||||
</div>
|
||||
</v-card>
|
||||
</v-dialog>
|
||||
<v-icon
|
||||
@click.stop="closeModal()"
|
||||
icon="mdi-close"
|
||||
size="large"
|
||||
></v-icon>
|
||||
</div>
|
||||
<div
|
||||
v-for="(timeblock, index) in subtask.timeblocks"
|
||||
:key="timeblock.id"
|
||||
class="d-flex align-center justify-center mb-3 mt-3"
|
||||
>
|
||||
<p
|
||||
class="task-badge rounded-pill"
|
||||
:class="{ 'strike-through': timeblock.is_finished }"
|
||||
>
|
||||
{{ tmUtils.formatDateTime(timeblock.start) }} -
|
||||
{{ tmUtils.formatDateTime(timeblock.end) }}
|
||||
</p>
|
||||
<v-icon
|
||||
@click.stop="
|
||||
subtask.id
|
||||
? deleteTimeblock(timeblock)
|
||||
: deleteTimeblockWithoutId(index)
|
||||
"
|
||||
class="close-icon circle-border cursor-pointer ml-3 text-red"
|
||||
icon="mdi-close"
|
||||
size="medium"
|
||||
/>
|
||||
</div>
|
||||
</v-card>
|
||||
</v-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import modalMixin from '@/plugins/tm@modal/_mixins/modal.mixin'
|
||||
import tmUtils from '@/plugins/tm@_utils/tm.utils'
|
||||
import modalMixin from '@/plugins/tm@modal/_mixins/modal.mixin';
|
||||
import tmUtils from '@/plugins/tm@_utils/tm.utils';
|
||||
import moment from 'moment';
|
||||
|
||||
export default {
|
||||
mixins: [ modalMixin ],
|
||||
emits: ['on-subtask-edited'],
|
||||
mixins: [modalMixin],
|
||||
emits: ['on-subtask-edited'],
|
||||
|
||||
data() {
|
||||
return {
|
||||
visible: false,
|
||||
subtask: null,
|
||||
isDeleting: false,
|
||||
tmUtils
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
visible: false,
|
||||
subtask: null,
|
||||
isDeleting: false,
|
||||
tmUtils,
|
||||
};
|
||||
},
|
||||
|
||||
methods: {
|
||||
async showModal({ subtask }) {
|
||||
this.subtask = subtask
|
||||
this.visible = true
|
||||
},
|
||||
methods: {
|
||||
async showModal({ subtask }) {
|
||||
this.subtask = subtask;
|
||||
this.visible = true;
|
||||
},
|
||||
|
||||
closeModal() {
|
||||
this.visible = false
|
||||
},
|
||||
closeModal() {
|
||||
this.visible = false;
|
||||
},
|
||||
|
||||
async deleteTimeblock({ id }) {
|
||||
const subtask = JSON.parse(JSON.stringify(this.subtask))
|
||||
subtask.timeblocks = subtask.timeblocks.filter(timeblock => timeblock.id != id)
|
||||
if(subtask.deadline) subtask.deadline = tmUtils.formatDateTimeForBackend(subtask.deadline)
|
||||
async deleteTimeblock({ id }) {
|
||||
const subtask = JSON.parse(JSON.stringify(this.subtask));
|
||||
subtask.timeblocks = subtask.timeblocks.filter(
|
||||
(timeblock) => timeblock.id != id,
|
||||
);
|
||||
if (subtask.deadline)
|
||||
subtask.deadline = tmUtils.formatDateTimeForBackend(subtask.deadline);
|
||||
|
||||
this._update(subtask)
|
||||
},
|
||||
this._update(subtask);
|
||||
},
|
||||
|
||||
deleteTimeblockWithoutId(i) {
|
||||
this.$emit('delete-timeblock')
|
||||
},
|
||||
deleteTimeblockWithoutId(i) {
|
||||
this.$emit('delete-timeblock');
|
||||
},
|
||||
|
||||
async _update(data) {
|
||||
try {
|
||||
const timesheets = data.timesheets.map((timesheet) => {
|
||||
delete timesheet.employee_name
|
||||
return timesheet
|
||||
})
|
||||
async _update(data) {
|
||||
try {
|
||||
const timesheets = data.timesheets.map((timesheet) => {
|
||||
delete timesheet.employee_name;
|
||||
return timesheet;
|
||||
});
|
||||
|
||||
const { subtask } = await this.$axios.put_auth(`v1/subtasks/${data.id}`, {...data, timesheets})
|
||||
// Convert timeblocks from internal format to BE format
|
||||
const timeblocks = (data.timeblocks || [])
|
||||
.filter((timeblock) => {
|
||||
// Filter timeblocks that have either old format (date) or new format (start)
|
||||
return timeblock.date || timeblock.start;
|
||||
})
|
||||
.map((timeblock) => {
|
||||
// If already in BE format (has start field), return as is
|
||||
if (timeblock.start && !timeblock.date) {
|
||||
return {
|
||||
id: timeblock.id || null,
|
||||
start: timeblock.start,
|
||||
end: timeblock.end,
|
||||
is_finished: timeblock.is_finished || 0,
|
||||
};
|
||||
}
|
||||
|
||||
this.closeModal()
|
||||
this.$events.emit('on-subtask-edited', subtask)
|
||||
} catch (error) {
|
||||
this.$toast.error(error.message || error)
|
||||
// Convert from internal format to BE format
|
||||
const dateStr = moment(timeblock.date).format('YYYY-MM-DD');
|
||||
return {
|
||||
id: timeblock.id || null,
|
||||
start: `${dateStr} ${timeblock.starts_at_time}:00`,
|
||||
end: `${dateStr} ${timeblock.ends_at_time}:00`,
|
||||
is_finished: timeblock.is_finished || 0,
|
||||
};
|
||||
});
|
||||
|
||||
if (process.env.NODE_ENV === 'development')
|
||||
console.log('[z-delete-timeblock-modal.vue] Error: ', error)
|
||||
}
|
||||
},
|
||||
}
|
||||
}
|
||||
const { subtask } = await this.$axios.put_auth(
|
||||
`v1/subtasks/${data.id}`,
|
||||
{ ...data, timesheets, timeblocks },
|
||||
);
|
||||
|
||||
this.closeModal();
|
||||
this.$events.emit('on-subtask-edited', subtask);
|
||||
} catch (error) {
|
||||
this.$toast.error(error.message || error);
|
||||
|
||||
if (process.env.NODE_ENV === 'development')
|
||||
console.log('[z-delete-timeblock-modal.vue] Error: ', error);
|
||||
}
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="sass" scoped>
|
||||
.close-icon:hover
|
||||
background: red
|
||||
color: #fff !important
|
||||
</style>
|
||||
</style>
|
||||
Reference in new issue
Block a user