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

app/src/plugins/app/_config/App.vue

@@ -5,11 +5,11 @@
 		</v-main>
 	</v-app>
 
-	<Z-team-modal 			ref="z-team-modal" />
+	<Z-team-modal 			ref="z-team-modal"  @update="onTeamUpdate" />
-	<Z-delete-team-modal 	ref="z-delete-team-modal" @deleted="onTeamDeleted" />
+	<Z-delete-team-modal 	ref="z-delete-team-modal" @update="onTeamUpdate" />
 
 	<Z-task-modal 			ref="z-task-modal" />
-	<Z-delete-task-modal 	ref="z-delete-task-modal" @deleted="onTaskDeleted" />
+	<Z-delete-task-modal 	ref="z-delete-task-modal" @update="onTaskDeleted" />
 	<Z-complete-task-modal 	ref="z-complete-task-modal" />
 	<Z-task-add-time-modal 	ref="z-task-add-time-modal" />
 	<Z-blocker-modal 		ref="z-blocker-modal" />
@@ -76,7 +76,7 @@ export default {
 	},
 
 	methods: {
-		onTeamDeleted(team) {
+		onTeamUpdate(team) {
 			this.$events.emit('on-team-deleted', team)
 		},
 

app/src/plugins/app/_config/main.ts

@@ -47,8 +47,8 @@ const options: Options = {
 			'POST v1/auth/login': true,
 			'POST v1/auth/post': true,
 
-			'GET v1/master-tasks/(id)': true,
+			// 'GET v1/master-tasks/(id)': true,
-			'GET v1/master-tasks': true,
+			// 'GET v1/master-tasks': true,
 			'POST v1/master-tasks/(id)': true,
 			'DELETE v1/master-tasks/(id)': true,
 			'POST v1/master-tasks': true,
@@ -64,11 +64,11 @@ const options: Options = {
 			'DELETE v1/tasks/(id)': true,
 
 			// 'GET v1/teams/(id)': true,
-			'POST v1/teams/(id)': true,
+			// 'POST v1/teams/(id)': true,
-			'DELETE v1/teams/(id)': true,
+			// 'DELETE v1/teams/(id)': true,
 			// 'GET v1/teams': true,
 			// 'GET v1/teamsx': true,
-			'POST v1/teams': true,
+			// 'POST v1/teams': true,
 
 			// 'GET v1/employees': true,
 			'GET v1/search': true,

app/src/plugins/app/_theme/_components/buttons.sass

@@ -0,0 +1,18 @@
+.button.primary
+	background: #7f39fb !important
+	border-radius: 4px !important
+	color: #fff !important
+	height: 50px
+	width: 100%
+	flex: 0 0 auto
+
+.button.secondary
+	color: #6200EE
+	border: 1px solid #E0E0E0
+	border-radius: 4px
+	height: 50px
+	width: 203px
+
+.button.cancel
+	border: thin solid rgba(var(--v-border-color), var(--v-border-opacity)) !important
+	color: #7f39fb !important

app/src/plugins/app/_theme/_components/modals.sass

@@ -0,0 +1,32 @@
+.modal-header
+	flex: 0 0 auto
+
+	.trash-icon
+		padding: 10px
+		background: rgba(0, 0, 0, 0.04)
+		margin-left: 12px
+		border-radius: 50%
+		cursor: pointer
+
+	.pencil-icon
+		padding: 10px
+		background: rgba(0, 0, 0, 0.04)
+		border-radius: 50%
+		cursor: pointer
+
+
+.modal-input
+	width: 100% !important
+	flex: 0 0 auto
+
+.modal-content
+	flex: 1 1 100%
+	margin: 10px 0
+	overflow-y: scroll
+
+.remove-input
+	pointer-events: auto
+	opacity: 2
+	position: absolute
+	left: 92%
+	top: 25%

app/src/plugins/app/_theme/_components/z-cancel-btn.sass

@@ -1,3 +0,0 @@
-.cancel-btn
-	border: thin solid rgba(var(--v-border-color), var(--v-border-opacity)) !important
-	color: #7f39fb !important

app/src/plugins/app/_theme/_components/z-default-btn.sass

@@ -1,4 +0,0 @@
-.z-btn
-	background: #7f39fb !important
-	border-radius: 4px !important
-	color: #fff !important

app/src/plugins/app/_theme/index.sass

@@ -1,13 +1,14 @@
 @import url('https://fonts.googleapis.com/css2?family=Roboto:wght@100&display=swap')
 
 @import './vuetify/v-dialog'
-@import './_components/z-default-btn'
-@import './_components/z-cancel-btn'
 @import './date-picker'
 
 @import './global'
 @import '@/plugins/lib@auth/_theme/auth.theme'
 
+@import './_components/buttons'
+@import './_components/modals'
+
 *
 	font-family: 'Roboto', sans-serif
 

app/src/plugins/lib@auth/reset-password/_components/a-reset-password-form.vue

@@ -43,7 +43,7 @@ export default {
 
 	methods: {
 		async submit() {
-			if (!(await this.v$.$validate())) return console.log(this.v$)
+			if (!(await this.v$.$validate())) return
 
 			try {
 				await this.$axios.post_data('v1/auth/reset', this.form)

app/src/plugins/lib@search/search/search.vue

@@ -24,7 +24,6 @@ export default {
 	created() {
 		try {
 			this.searchResults = this.$axios.get_auth_data('v1/search')
-			console.log(this.searchResults)
 		} catch (error) {
 			this.$toast.error(error)
 		}

app/src/plugins/tm@_utils/tm.utils.ts

@@ -0,0 +1,19 @@
+import moment from 'moment'
+
+export default {
+	enrichEmployeesByFullName(employees) {
+		return employees.map(employee => ({...employee, _fullName: `${ employee.name } ${ employee.surname }`}))
+	},
+
+	formatDateTime(date) {
+		return moment(date).format('DD.MM.yyyy, HH:mm')
+	},
+
+	isBefore(date, compareTo = null) {
+		return moment(date).isBefore(moment(compareTo))
+	},
+
+	isAfter(date, compareTo = null) {
+		return moment(date).isAfter(moment(compareTo))
+	}
+}

app/src/plugins/tm@dashboard/projects/projects.vue

@@ -53,7 +53,7 @@ export default {
 
 			// format masterTasks to event format for calendar
 			events = events.map(event => {
-				const color = this._stringToHexColor(`${event.project_code}${event.name}`)
+				const color = this._stringToHexColor(event.color)
 
 				return {
 					id: event.id,
@@ -81,7 +81,7 @@ export default {
 			try {
 				this.teams 			= await this.$axios.get_auth_data('v1/teams')
 				this.employees 		= await this.$axios.get_auth_data('v1/employees')
-				this.masterTasks 	= await this.$axios.get_auth_data('v1/master-tasks')
+				this.masterTasks 	= await this.$axios.get_auth_data('v1/mastertasks')
 			} catch (error) {
 				this.masterTasks = {error}
 			}
@@ -98,18 +98,18 @@ export default {
 		},
 
 		_stringToHexColor(string) {
-			let hash = 0;
+			let hash = 0
 
 			for (let i = 0; i < string.length; i++) {
-				hash = string.charCodeAt(i) + ((hash << 5) - hash);
+				hash = string.charCodeAt(i) + ((hash << 5) - hash)
 			}
 
-			let color = '#';
+			let color = '#'
 			for (let i = 0; i < 3; i++) {
-				let value = (hash >> (i * 8)) & 0xFF;
+				let value = (hash >> (i * 8)) & 0xFF
-				color += ('00' + value.toString(16)).substr(-2);
+				color += ('00' + value.toString(16)).substr(-2)
 			}
-			return color;
+			return color
 		}
 	}
 }

app/src/plugins/tm@dashboard/tasks/_components/a-tasks-filter.vue

@@ -3,7 +3,7 @@
 		<v-select
 			v-model="selectedEmployee"
 			class="subheader-input"
-			:items="employees"
+			:items="[null, ...employees]"
 			item-title="fullName"
 			item-value="id"
 			label="Zamestnanec"

app/src/plugins/tm@modal/_mixins/vuetify-fix-focus.ts

@@ -0,0 +1,23 @@
+export default {
+	// Mixin to fix autofocus on v-input in modals where date selects are used
+	data() {
+		return {
+			preventInputFocus: false
+		}
+	},
+
+	methods: {
+		onDateFocus($event) {
+			if ($event == undefined) {
+				this.preventInputFocus = true
+			}
+		},
+
+		onInputFocus($event) {
+			if (this.preventInputFocus) {
+				$event.target.blur()
+				this.preventInputFocus = false
+			}
+		}
+	}
+}

app/src/plugins/tm@modal/blocker/z-blocker-modal.vue

@@ -5,7 +5,7 @@
 				<div class="d-flex justify-space-between align-center modal-header">
 					<h1>{{ blocker.id ? 'Upraviť' : 'Vytvoriť'}} blocker</h1>
 					<v-icon
-						@click.stop="close()"
+						@click.stop="closeModal()"
 						icon="mdi-close"
 						size="large"
 					></v-icon>
@@ -26,7 +26,7 @@
 						variant="solo"
 					></v-text-field>
 					<div
-						class="employee-position w-100"
+						class="relative w-100"
 						v-for="(employee, index) in blocker.employees"
 						:key="employee.id"
 					>
@@ -66,7 +66,7 @@
 					/>
 				</v-card-actions>
 
-				<v-btn class="z-btn" @click="save()">{{ blocker.id ? 'UPRAVIŤ' : 'VYTVORIŤ'}}</v-btn>
+				<v-btn class="button primary" @click="save()">{{ blocker.id ? 'UPRAVIŤ' : 'VYTVORIŤ'}}</v-btn>
 			</v-card>
 		</W-loadable>
 	</v-dialog>
@@ -78,10 +78,14 @@ import Datepicker	 	from '@vuepic/vue-datepicker'
 import useVuelidate 		from '@vuelidate/core'
 import { required } 		from '@vuelidate/validators'
 import errorUtils 			from '@/plugins/lib@auth/_utils/error.utils'
+import VuetifyFixFocusMixin from  '@/plugins/tm@modal/_mixins/vuetify-fix-focus'
+import tmUtils 				from '@/plugins/tm@_utils/tm.utils'
 
 const atLeastOne = (value) => value.length
 
 export default {
+	mixins: [VuetifyFixFocusMixin],
+
 	emits: ['close'],
 
 	components: {
@@ -92,7 +96,7 @@ export default {
 	data() {
 		return {
 			visible: false,
-			allEmployees: null,
+			employees: null,
 			v$: useVuelidate(),
 			errorUtils,
 			blocker: null
@@ -104,7 +108,7 @@ export default {
 			const selectedEmployeesIds = this.blocker.employees.map(
 				(employee) => employee.id
 			)
-			const employees = this.allEmployees.filter(
+			const employees = this.employees.filter(
 				(employee) => !selectedEmployeesIds.includes(employee.id)
 			)
 
@@ -133,29 +137,22 @@ export default {
 			this.blocker = null
 
 			try {
-				const allEmployees = await this.$axios.get_auth_data('v1/employees')
+				const employees = await this.$axios.get_auth_data('v1/employees')
-				this.allEmployees  = this._enrichEmployeesByFullName(allEmployees)
+				this.employees 	= tmUtils.enrichEmployeesByFullName(employees)
-			} catch (error) {
-				this.$toast.error(error)
-			}
 
 				if (blocker?.id) {
-				await this._load(blocker.id)
+					const b 	  = await this.$axios.get_auth_data(`v1/blockers/${blocker.id}`)
+					this.blocker  = {...b, employees: tmUtils.enrichEmployeesByFullName(b.employees)}
 				} else {
-				const blocker = {
+					this.blocker  = {employees: []}
-					name: '',
-					date: null,
-					employees: []
 				}
-
+			} catch (error) {
-				setTimeout(() => {
+				this.$toast.error(error)
-					this.blocker = blocker
-				})
 			}
 		},
 
 		employeeSelected(selectedOption) {
-			const employee = this.allEmployees.find((empl) => empl.id == selectedOption.key)
+			const employee = this.employees.find((empl) => empl.id == selectedOption.key)
 			this.blocker.employees.push(employee)
 		},
 
@@ -165,97 +162,23 @@ export default {
 
 			try {
 				if (this.blocker.id)
-					await this._edit()
+					await this.$axios.post_auth(`v1/blockers/${this.blocker.id}`, this.blocker)
 				else
-					await this._create()
+					await this.$axios.post_auth('v1/blockers', this.blocker)
 
-				this.close()
+				this.closeModal()
+
+				// Kravarik: Toto tu ma byt?
 				this.$router.push({ name: 'Dashboard - Tasks' })
 			} catch (error) {
 				this.$toast(error)
 			}
 		},
 
-		close() {
+		closeModal() {
 			this.visible = false
 			this.$emit('close', this.blocker)
-		},
-
-		async _create() {
-			try {
-				await this.$axios.post_auth('v1/blockers', this.blocker)
-			} catch (error) {
-				this.$toast.error(error)
-			}
-		},
-
-		async _edit() {
-			try {
-				await this.$axios.post_auth(`v1/blockers/${this.blocker.id}`, this.blocker)
-			} catch (error) {
-				this.$toast.error(error)
-			}
-		},
-
-		async _load() {
-			try {
-				const blocker 		= await this.$axios.get_auth_data(`v1/blockers/${this.blocker.id}`)
-				blocker.employees 	= this._enrichEmployeesByFullName(blocker.employees)
-
-				this.blocker = blocker
-			} catch (error) {
-				this.$toast.error(error)
-			}
-		},
-
-		// Vuetify input was automatically focus after date input was clicked. This will prevent this unwanted behavior
-		onDateFocus($event) {
-			if ($event == undefined) {
-				this.preventInputFocus = true
-			}
-		},
-
-		onInputFocus($event) {
-			if (this.preventInputFocus) {
-				$event.target.blur()
-				this.preventInputFocus = false
-			}
-		},
-
-		_enrichEmployeesByFullName(employees) {
-			return employees.map(employee => {
-				employee._fullName = `${employee.name} ${employee.surname}`
-				return employee
-			})
 		}
 	}
 }
 </script>
-
-<style lang="sass" scoped>
-.modal-input
-	width: 100%
-	flex: 0 0 auto
-.modal-header
-	flex: 0 0 auto
-
-.modal-content
-	flex: 1 1 100%
-	margin: 10px 0
-	overflow-y: scroll
-
-.z-btn
-	height: 50px
-	width: 100%
-	flex: 0 0 auto
-
-.remove-input
-	pointer-events: auto
-	opacity: 2
-	position: absolute
-	left: 92%
-	top: 25%
-
-.employee-position
-	position: relative
-</style>

app/src/plugins/tm@modal/master-task/z-master-task-modal.vue

@@ -5,7 +5,7 @@
 				<div class="d-flex justify-space-between align-center modal-header">
 					<h1>{{ masterTask.id ? 'Upraviť master task' : 'Vytvoriť master task' }}</h1>
 					<v-icon
-						@click.stop="close()"
+						@click.stop="closeModal()"
 						icon="mdi-close"
 						size="large"
 					></v-icon>
@@ -64,7 +64,7 @@
 					></v-text-field>
 
 					<v-select
-						v-model="selectedTeam"
+						v-model="teamSelect"
 						@focus="onInputFocus"
 						class="modal-input border-select"
 						label="Tím"
@@ -101,7 +101,7 @@
 						@option-selected="employeeSelected"
 					/>
 
-					<v-btn class="w-100 mb-5 add-employee-btn" :disabled="!masterTask.team.employees" @click="showAddEmployeeInput = true">
+					<v-btn class="w-100 mb-5 button secondary" :disabled="!masterTask.team?.id" @click="showAddEmployeeInput = true">
 						<v-icon class="mx-1" icon="mdi-plus" />Pridať zamestnanca
 					</v-btn>
 
@@ -117,14 +117,14 @@
 					<Z-files-upload class="mt-15 files" @files-uploaded="filesUploaded"/>
 				</v-card-actions>
 
-				<v-btn class="z-btn" @click="save()">VYTVORIŤ</v-btn>
+				<v-btn class="button primary" @click="save()">VYTVORIŤ</v-btn>
 			</v-card>
 
 			<v-card v-else height="100%" class="d-flex flex-column scrolling">
 				<div class="d-flex justify-space-between align-center">
 					<p>{{ masterTask.project_code }}</p>
 					<v-icon
-						@click.stop="close()"
+						@click.stop="closeModal()"
 						icon="mdi-close"
 						size="large"
 						class="pb-5"
@@ -134,7 +134,7 @@
 					<h1>{{ masterTask.name }}</h1>
 					<div class="d-flex justify-start">
 						<img class="pencil-icon" :src="require('@/plugins/tm@overview/_img/pencil-icon.svg')" alt="pencil-icon" @click.stop="editMode = !editMode" />
-						<img class="trash-icon" :src="require('@/plugins/tm@overview/_img/trash-icon.svg')" alt="trash-icon" @click.stop="deleteTask()"/>
+						<img class="trash-icon" :src="require('@/plugins/tm@overview/_img/trash-icon.svg')" alt="trash-icon" @click.stop="_delete()"/>
 					</div>
 				</div>
 
@@ -173,7 +173,7 @@
 							</v-col>
 							<v-col cols="7">
 								<v-sheet class="ma-2">
-									<p :class="`${compareDates ? 'text-black' : 'text-red-darken-4'}`">{{ formattedDeadline }}</p>
+									<p :class="`${tmUtils.isAfter(masterTask.deadline) ? 'text-black' : 'text-red-darken-4'}`">{{ tmUtils.formatDateTime(masterTask.deadline) }}</p>
 								</v-sheet>
 							</v-col>
 						</v-row>
@@ -269,7 +269,7 @@
 							</div>
 						</div>
 						<div class="d-flex justify-start align-center mt-8">
-							<v-btn class="z-btn" @click="save()">Ukončiť mastertask</v-btn>
+							<v-btn class="button primary" @click="save()">Ukončiť mastertask</v-btn>
 						</div>
 						<v-table class="mt-7 mb-5">
 							<tbody class="px-5 py-5">
@@ -309,8 +309,10 @@ import useVuelidate 	from '@vuelidate/core'
 import { required } 	from '@vuelidate/validators'
 import errorUtils 		from '@/plugins/lib@auth/_utils/error.utils'
 import ZAutocomplete 	from '@/plugins/tm@_components/z-autocomplete.vue'
+import VuetifyFixFocusMixin from  '@/plugins/tm@modal/_mixins/vuetify-fix-focus'
 import moment 			from 'moment'
 import { QuillEditor } 	from '@vueup/vue-quill'
+import tmUtils 				from '@/plugins/tm@_utils/tm.utils'
 import * as FileSaver	from 'file-saver'
 import '@vueup/vue-quill/dist/vue-quill.snow.css'
 
@@ -318,6 +320,7 @@ const atLeastOne = (value) => value.length
 
 export default {
 	emits: ['close'],
+	mixins: [VuetifyFixFocusMixin],
 
 	components: {
 		Datepicker,
@@ -328,16 +331,18 @@ export default {
 
 	data() {
 		return {
+			tmUtils,
 			editMode: false,
 			visible: false,
 			errorUtils,
 			v$: useVuelidate(),
-			preventInputFocus: false,
 			teams: null,
 			employees: null,
-			selectedTeam: '',
+			employeeSelect: null,
-			showAddEmployeeInput: false,
+			teamSelect: '',
-			masterTask: null
+			masterTask: null,
+
+			showAddEmployeeInput: false
 		}
 	},
 
@@ -354,47 +359,31 @@ export default {
 	},
 
 	methods: {
-		// async downloadFile() {
+		itemSelected(x) {
-		// 	try {
+			console.log(x)
-		// 		const file = await this.$axios.get_auth(`v1/files/${this.file.basename}`, { responseType: 'arraybuffer' })
+		},
-		// 		const blob = new Blob([file], { type: this.file.mimetype })
-		// 		FileSaver.saveAs(blob, this.file.name)
-		// 		this.isLoading = false
-		// 	} catch(error) {
-		// 		this.$toast.error(error)
-		// 	}
-		// },
 
 		async showModal(masterTask, editMode = false) {
 			this.visible 		= true
 			this.masterTask 	= null
+			this.teamSelect 	= null
+			this.employeeSelect = null
 
 			try {
 				this.teams 		= await this.$axios.get_auth_data('v1/teams')
-				this.employees 	= await this.$axios.get_auth_data('v1/employees')
+				const employees = await this.$axios.get_auth_data('v1/employees')
-			} catch (error) {
+				this.employees 	= tmUtils.enrichEmployeesByFullName(employees)
-				this.$toast.error(error)
-			}
 
 				if (masterTask?.id) {
-				await this._load(masterTask.id)
+					this.masterTask = await this.$axios.get_auth_data(`v1/master-tasks/${masterTask.id}`)
-				this.editMode = editMode || !masterTask?.id
+					this.teamSelect = this.masterTask.team.id
 				} else {
-				const masterTask = {
+					this.masterTask = {team: {}, employees: []}
-					project_code: null,
-					name: null,
-					deadline: null,
-					duration: null,
-					team: {},
-					description: null,
-					employees: [],
-					files: []
 				}
 
-				setTimeout(() => {
+				this.editMode = (editMode || !this.masterTask.id)
-					this.masterTask = masterTask
+			} catch (error) {
-					this.editMode = editMode || !this.masterTask.id
+				this.$toast.error(error)
-				})
 			}
 		},
 
@@ -404,54 +393,32 @@ export default {
 
 			try {
 				if (this.masterTask.id)
-					await this._update()
+					await this.$axios.patch_auth(`v1/master-tasks/${this.masterTask.id}`, this.masterTask)
 
 				else
-					await this._create()
+					await this.$axios.post_auth('v1/mastertasks', this.masterTask)
 
-				this.close()
+				this.closeModal()
-				this.$router.push({ name: 'Dashboard - Tasks' })
+				// this.$router.push({ name: 'Dashboard - Tasks' })
 			} catch (error) {
 				this.$toast(error)
 			}
 		},
 
-		close() {
+		closeModal() {
 			this.visible = false
 			this.$emit('close', this.masterTask)
 		},
 
-		async _load(masterTaskId) {
+		async _delete() {
-			try {
+			// Kravarik: Tu sa ma volat delete-master-task-modal, ak taka funkcionalita vlastne je
-				this.masterTask = await this.$axios.get_auth_data(`v1/master-tasks/${masterTaskId}`)
-			} catch (error) {
-				this.$toast.error(error)
-			}
-		},
 
-		async _create() {
+			// try {
-			try {
+			// 	await this.$axios.delete(`v1/master-tasks/${this.masterTask.id}`)
-				await this.$axios.post_auth('v1/mastertasks')
+			// 	this.closeModal()
-			} catch (error) {
+			// } catch (error) {
-				this.$toast.error(error)
+			// 	this.$toast.error(error)
-			}
+			// }
-		},
-
-		async _update() {
-			try {
-				await this.$axios.post_auth(`v1/master-tasks/${this.masterTask.id}`)
-			} catch (error) {
-				this.$toast.error(error)
-			}
-		},
-
-		async deleteTask(masterTaskId) {
-			try {
-				await this.$axios.delete(`v1/master-tasks/${masterTaskId}`)
-				this.close()
-			} catch (error) {
-				this.$toast.error(error)
-			}
 		},
 
 		employeeSelected(selectedOption) {
@@ -460,27 +427,12 @@ export default {
 			this.showAddEmployeeInput = false
 		},
 
-		// Vuetify input was automatically focus after date input was clicked. This will prevent this unwanted behavior
-		onDateFocus($event) {
-			if ($event == undefined) {
-				this.preventInputFocus = true
-			}
-		},
-
-		onInputFocus($event) {
-			if (this.preventInputFocus) {
-				$event.target.blur()
-				this.preventInputFocus = false
-			}
-		},
-
 		filesUploaded(files) {
 			this.masterTask.files = files
 		}
 	},
 
 	computed: {
-
 		totalHours() {
 			let hours = 0
 
@@ -505,57 +457,36 @@ export default {
 					value: `${employee.name} ${employee.surname}`,
 				}
 			})
-		},
-
-		formattedDeadline() {
-			let deadline = moment(this.masterTask.deadline)
-			let date = deadline.format('DD.MM.yyyy')
-			return date
-		},
-
-		compareDates() {
-			const date1 = moment()
-			const date2 = moment(this.masterTask.deadline)
-			return moment(date1).isBefore(date2)
 		}
 	},
 
 	watch: {
-		selectedTeam() {
+		teamSelect(value) {
-			this.masterTask.team 		= this.teams.find(team => team.id == this.selectedTeam)
+			if (!value || !this.masterTask) return
+
+			this.masterTask.team 		= this.teams.find(team => team.id == value)
 			this.masterTask.employees 	= this.masterTask.team.employees
+		},
+
+		employeeSelect(value) {
+			if (!value || !this.masterTask) return
+
+			const employee 				= this.employees.find(employee => employee.id == value)
+			this.masterTask.employees.push(employee)
+
+			this.$nextTick(() => {
+				this.employeeSelect = null
+				this.$el.activeElement.blur()
+				// console.log(this.$refs['employee-select'])
+				// this.$refs['employee-select'].focused = false
+				// this.employeeSelect = ''
+			})
 		}
 	}
 }
 </script>
 
 <style lang="sass" scoped>
-.modal-input
-	width: 100% !important
-	flex: 0 0 auto
-.modal-header
-	flex: 0 0 auto
-
-.modal-content
-	flex: 1 1 100%
-	margin: 10px 0
-	overflow-y: scroll
-
-.z-btn
-	height: 50px
-	width: 100%
-	flex: 0 0 auto
-
-.remove-input
-	pointer-events: auto
-	opacity: 2
-	position: absolute
-	left: 92%
-	top: 25%
-
-.employee-position
-	position: relative
-
 .employee-select-avatar
 	background: #6200EE
 	color: #fff
@@ -568,28 +499,11 @@ export default {
 	top: 50%
 	right: 0
 	transform: translate(-50%, -50%)
-
-.add-employee-btn
-	color: #6200EE
-	border: 1px solid #E0E0E0
-	border-radius: 4px
-	height: 50px
 .scrolling
 	overflow: hidden !important
 
 .scroll-employees
 	overflow-x: scroll
-.trash-icon
-	padding: 10px
-	background: rgba(0, 0, 0, 0.04)
-	margin-left: 12px
-	border-radius: 50%
-	cursor: pointer
-.pencil-icon
-	padding: 10px
-	background: rgba(0, 0, 0, 0.04)
-	border-radius: 50%
-	cursor: pointer
 
 .border-bottom
 	border-bottom: 1px solid rgba(0,0,0,.1)

app/src/plugins/tm@modal/task/z-complete-task-modal.vue

@@ -11,8 +11,8 @@
 				></v-icon>
 			</div>
 			<v-card-actions class="mt-10 d-flex justify-start align-center">
-				<v-btn class="z-btn" variant="flat" @click="complete()">ÁNO</v-btn>
+				<v-btn class="button primary" variant="flat" @click="complete()">ÁNO</v-btn>
-				<v-btn class="ml-7 cancel-btn" @click.stop="visible = false">ZRUŠIŤ</v-btn>
+				<v-btn class="ml-7 button cancel" @click.stop="visible = false">ZRUŠIŤ</v-btn>
 			</v-card-actions>
 		</v-card>
 	</v-dialog>
@@ -20,7 +20,7 @@
 
 <script>
 export default {
-	emits: ['close'],
+	emits: ['close', 'task-completed'],
 
 	data() {
 		return {
@@ -37,14 +37,10 @@ export default {
 
 		async complete() {
 			try {
-				const task = {
+				const task = {...this.task, is_finished: true}
-					...this.task,
+				await this.$axios.patch_auth(`v1/tasks/${this.task.id}`, task)
-					is_finished: true
-				}
-
-				await this.$axios.post(`v1/tasks/${task.id}`, task)
 				this.visible = false
-				this.$emit('completeTask', task.id)
+				this.$emit('task-completed', task)
 			} catch (error) {
 				this.$toast.error(error)
 			}

app/src/plugins/tm@modal/task/z-delete-task-modal.vue

@@ -5,14 +5,14 @@
 				<h1>Ste si istý, že chcete zmazať <b>{{ task.title }}</b>?</h1>
 
 				<v-icon
-					@click.stop="visible = false"
+					@click.stop="closeModal()"
 					icon="mdi-close"
 					size="large"
 				></v-icon>
 			</div>
 			<v-card-actions class="mt-10 d-flex justify-start align-center">
-				<v-btn class="z-btn" variant="flat" @click="deleteTask()">ÁNO</v-btn>
+				<v-btn class="button primary" variant="flat" @click="deleteTask()">ÁNO</v-btn>
-				<v-btn class="ml-7 cancel-btn" @click.stop="visible = false">ZRUŠIŤ</v-btn>
+				<v-btn class="ml-7 button cancel" @click.stop="closeModal()">ZRUŠIŤ</v-btn>
 			</v-card-actions>
 		</v-card>
 	</v-dialog>
@@ -35,11 +35,15 @@ export default {
 			this.visible = true
 		},
 
+		closeModal() {
+			this.visible = false
+		},
+
 		async deleteTask() {
 			try {
 				await this.$axios.delete(`v1/tasks/${this.task.id}`)
-				this.visible = false
 				this.$emit('deleted', this.task)
+				this.closeModal()
 			} catch (error) {
 				this.$toast.error(error)
 			}

app/src/plugins/tm@modal/task/z-task-add-time-modal.vue

@@ -5,7 +5,7 @@
 				<h1>Prosím zadajte odpracovaný čas</h1>
 
 				<v-icon
-					@click.stop="close()"
+					@click.stop="closeModal()"
 					icon="mdi-close"
 					size="large"
 				></v-icon>
@@ -20,7 +20,7 @@
 					append-inner-icon="mdi-timer-outline"
 				></v-text-field>
 			</v-card-actions>
-			<v-btn class="z-btn mt-5">Potvrdiť</v-btn>
+			<v-btn class="button primary mt-5">Potvrdiť</v-btn>
 		</v-card>
 	</v-dialog>
 </template>
@@ -55,7 +55,7 @@ export default {
 			this.visible = true
 		},
 
-		close() {
+		closeModal() {
 			this.visible = false
 			this.$emit('close', this.blocker)
 			this.blocker = null
@@ -65,7 +65,7 @@ export default {
 </script>
 
 <style lang="sass" scoped>
-.z-btn
+.button primary
 	height: 48px !important
 
 h1

app/src/plugins/tm@modal/task/z-task-modal.vue

@@ -4,7 +4,7 @@
 			<v-card v-if="editMode" height="100%" class="d-flex flex-column scrolling">
 				<div class="d-flex justify-space-between align-center modal-header">
 					<h1>{{ task.id ? 'Upraviť task' : 'Vytvoriť task' }}</h1>
-					<v-icon @click.stop="close()" icon="mdi-close" size="large"></v-icon>
+					<v-icon @click.stop="closeModal()" icon="mdi-close" size="large"></v-icon>
 				</div>
 
 				<v-card-actions class="d-flex flex-column modal-content">
@@ -19,7 +19,7 @@
 
 					<!-- Toto treba fixnut -->
 					<v-select
-						v-model="selectedMasterTaskId"
+						v-model="masterTaskIdSelect"
 						@focus="onInputFocus"
 						class="modal-input border-select"
 						label="MasterTask"
@@ -30,7 +30,7 @@
 					></v-select>
 
 					<v-select
-						v-model="selectedEmployeeId"
+						v-model="employeeIdSelect"
 						@focus="onInputFocus"
 						class="modal-input border-select"
 						label="Priradený"
@@ -82,7 +82,7 @@
 					<Z-files-upload class="mt-15 files" @files-uploaded="filesUploaded" />
 				</v-card-actions>
 
-				<v-btn class="z-btn" @click="save()">{{
+				<v-btn class="button primary" @click="save()">{{
 					task.id ? 'UPRAVIŤ' : 'VYTVORIŤ'
 				}}</v-btn>
 			</v-card>
@@ -91,7 +91,7 @@
 				<div class="d-flex justify-space-between align-center">
 					<p>{{ task.project_code }}</p>
 					<v-icon
-						@click.stop="close()"
+						@click.stop="closeModal()"
 						icon="mdi-close"
 						size="large"
 						class="pb-5"
@@ -112,7 +112,7 @@
 							class="trash-icon"
 							:src="require('@/plugins/tm@overview/_img/trash-icon.svg')"
 							alt="trash-icon"
-							@click.stop="deleteTask(task)"
+							@click.stop="openDeleteTaskModal(task)"
 						/>
 					</div>
 				</div>
@@ -181,7 +181,7 @@
 								<v-sheet class="ma-2">
 									<p
 										v-html="
-											`${formattedStartDate} - ${formattedEndDate}`
+											`${tmUtils.formatDateTime(task.starts_at)} - ${tmUtils.formatDateTime(task.ends_at)}`
 										"
 									/>
 								</v-sheet>
@@ -307,10 +307,10 @@
 							</div>
 						</div>
 						<div class="d-flex justify-start align-center mt-8">
-							<v-btn class="done-btn" @click.stop="clickCompleteTask()"
+							<v-btn class="done-btn" @click.stop="task.is_finished = 1; save()"
 								>Dokončené</v-btn
 							>
-							<v-btn class="add-employee-btn" @click="save()"
+							<v-btn class="button secondary" @click="save()"
 								>Uložiť zmeny</v-btn
 							>
 						</div>
@@ -329,11 +329,14 @@ import { required } 	from '@vuelidate/validators'
 import errorUtils 		from '@/plugins/lib@auth/_utils/error.utils'
 import moment 			from 'moment'
 import { QuillEditor } 	from '@vueup/vue-quill'
+import VuetifyFixFocusMixin from  '@/plugins/tm@modal/_mixins/vuetify-fix-focus'
 import * as FileSaver 	from 'file-saver'
+import tmUtils 				from '@/plugins/tm@_utils/tm.utils'
 import '@vueup/vue-quill/dist/vue-quill.snow.css'
 
 export default {
 	emits: ['close', 'refresh'],
+	mixins: [VuetifyFixFocusMixin],
 
 	components: {
 		Datepicker,
@@ -343,6 +346,7 @@ export default {
 
 	data() {
 		return {
+			tmUtils,
 			editMode: false,
 			visible: false,
 			task: null,
@@ -350,17 +354,26 @@ export default {
 			v$: useVuelidate(),
 			preventInputFocus: false,
 			masterTasks: [],
-			selectedMasterTaskId: null,
+			masterTaskIdSelect: null,
-			selectedEmployeeId: null
+			employeeIdSelect: null
+		}
+	},
+
+	computed: {
+		employees() {
+			if (!this.task?.master_task?.employees)
+				return []
+
+			return tmUtils.enrichEmployeesByFullName(this.task.master_task.employees)
 		}
 	},
 
 	validations() {
 		return {
 			task: {
-				project_code: { required },
+				// project_code: { required },
 				date: { required },
-				team: { required },
+				// team: { required },
 				duration: { required },
 				employee: { required },
 			},
@@ -369,61 +382,35 @@ export default {
 
 	mounted() {
 		this.$events.on('on-task-deleted', (task) => {
-			if (task?.id == this.task?.id) this.close()
+			if (task?.id == this.task?.id) this.closeModal()
 		})
 	},
 
 	methods: {
-		// async downloadFile() {
-		// 	try {
-		// 		const file = await this.$axios.get_auth(`v1/files/${this.file.basename}`, { responseType: 'arraybuffer' })
-		// 		const blob = new Blob([file], { type: this.file.mimetype })
-		// 		FileSaver.saveAs(blob, this.file.name)
-		// 		this.isLoading = false
-		// 	} catch(error) {
-		// 		this.$toast.error(error)
-		// 	}
-		// },
-
 		async showModal(task, editMode = false) {
 			this.visible = true
 			this.task = null
 
 			try {
 				this.masterTasks = await this.$axios.get_auth_data('v1/mastertasks')
+				if (task?.id) {
+					const t = await this.$axios.get_auth_data(`v1/tasks/${task.id}`)
+
+					this.employeeIdSelect 	= t.employee.id
+					this.masterTaskIdSelect 	= t.master_task.id
+					this.task 					= t
+				} else {
+					this.task = {master_task: {}}
+				}
+
+				this.editMode = (editMode || !this.task.id)
 			} catch (error) {
 				this.$toast.error(error)
 			}
-
-			if (task?.id) {
-				await this._load(task.id)
-				this.editMode = editMode || !this.task?.id
-			} else {
-				const task = {
-					project_code: null,
-					date: null,
-					team: {},
-					employee: null,
-					duration: null,
-					description: null,
-					files: [],
-				}
-
-				setTimeout(() => {
-					this.task = task
-					this.editMode = editMode || !this.task.id
-				})
-			}
 		},
 
-		async clickCompleteTask() {
+		closeModal() {
-			try {
+			this.visible = false
-				await this.$axios.delete(`v1/tasks/${this.task.id}`)
-				this.close()
-			} catch (error) {
-				this.$toast.error(error)
-			}
-			this.close()
 		},
 
 		async save() {
@@ -431,186 +418,49 @@ export default {
 
 			try {
 				if (this.task.id) {
-					await this._update()
+					await this.$axios.patch_auth(`v1/master-tasks/${this.task.id}`, this.task)
-					this.close()
+				} else {
-				} else await this._create()
+					await this.$axios.post_auth('v1/mastertasks', this.task)
+				}
 
-				this.close()
+				this.closeModal()
+
+				// Kravarik: Toto tu ma byt?
 				this.$router.push({ name: 'Dashboard - Tasks' })
 			} catch (error) {
 				this.$toast.error(error)
 			}
 		},
 
-		close() {
+		openDeleteTaskModal(task) {
-			this.visible = false
-			this.$emit('close', this.task)
-		},
-
-		async _load(taskId) {
-			try {
-				const task = await this.$axios.get_auth_data(`v1/tasks/${taskId}`)
-
-				// const employees = task.master_task.employees.map(employee => {
-				// 	employee._fullName = `${employee.name} ${employee.surname}`
-				// 	return employee
-				// })
-
-				// this.employees 				= employees
-				this.task 					= task
-				this.selectedEmployeeId 	= this.task.employee.id
-				this.selectedMasterTaskId 	= this.task.master_task.id
-			} catch (error) {
-				this.$toast.error(error)
-			}
-		},
-
-		async _create() {
-			try {
-				await this.$axios.post_auth('v1/mastertasks')
-			} catch (error) {
-				this.$toast.error(error)
-			}
-		},
-
-		async _update() {
-			try {
-				await this.$axios.post_auth(`v1/master-tasks/${this.task.id}`)
-			} catch (error) {
-				this.$toast.error(error)
-			}
-		},
-
-		deleteTask(task) {
 			this.$events.emit('show-delete-task-modal', { task })
 		},
 
-		onTaskDeleted() {
-			this.$emit('refresh')
-		},
-
-		employeeSelected(selectedOption) {
-			const employee = this.task.master_task.employees.find(employee => employee.id == selectedOption.key)
-			this.task.employee = employee
-		},
-
-		// Vuetify input was automatically focus after date input was clicked. This will prevent this unwanted behavior
-		onDateFocus($event) {
-			if ($event == undefined) {
-				this.preventInputFocus = true
-			}
-		},
-
-		onInputFocus($event) {
-			if (this.preventInputFocus) {
-				$event.target.blur()
-				this.preventInputFocus = false
-			}
-		},
-
 		filesUploaded(files) {
 			this.task.files = files
 		},
 	},
 
-	computed: {
-		employees() {
-			if (!this.task?.master_task?.employees)
-				return []
-
-			return this.task.master_task.employees.map(employee => {
-				employee._fullName = `${employee.name} ${employee.surname}`
-				return employee
-			})
-		},
-
-		formattedStartDate() {
-			let startDate = moment(this.task.starts_at)
-			let date = startDate.format('DD.MM.yyyy, HH:mm')
-			return date
-		},
-
-		formattedEndDate() {
-			let endDate = moment(this.task.ends_at)
-			let date = endDate.format('DD.MM.yyyy, HH:mm')
-			return date
-		},
-	},
-
 	watch: {
-		selectedMasterTaskId() {
+		masterTaskIdSelect(value) {
-			this.task.master_task = this.masterTasks.find(
+			if (!value || !this.task) return
-				(masterTask) => masterTask.id == this.selectedMasterTaskId
-			)
 
-			// Kravarik: Tu bude treba vymsliet logiku resetovania, ale ked dam toto sa to trigeruje aj pri otvarani existujuceho tasku a hned to vymaze
+			this.task.master_task = this.masterTasks.find(masterTask => masterTask.id == value)
-			// this.selectedEmployeeId 	= null
-			// this.task.employee 			= {}
 		},
 
-		selectedEmployeeId() {
+		employeeIdSelect(value) {
-			this.task.employee = this.task.master_task.employees.find(
+			if (!value || !this.task) return
-				(employee) => employee.id == this.selectedEmployeeId
+
-			)
+			this.task.employee = this.task.master_task.employees.find(employee => employee.id == value)
 		},
 	},
 }
 </script>
 
 <style lang="sass" scoped>
-.modal-input
-	width: 100% !important
-	flex: 0 0 auto
-.modal-header
-	flex: 0 0 auto
-
-.modal-content
-	flex: 1 1 100%
-	margin: 10px 0
-	overflow-y: scroll
-
-.z-btn
-	height: 50px
-	width: 100%
-	flex: 0 0 auto
-
-.employee-position
-	position: relative
-
-.employee-select-avatar
-	background: #6200EE
-	color: #fff
-	border-radius: 50%
-	padding: 13px
-	font-size: 11.5px
-	height: 24px
-	width: 24px
-	position: absolute
-	top: 50%
-	right: 0
-	transform: translate(-50%, -50%)
-
-.add-employee-btn
-	color: #6200EE
-	border: 1px solid #E0E0E0
-	border-radius: 4px
-	height: 50px
-	width: 203px
 .scrolling
 	overflow: hidden !important
 
-.trash-icon
-	padding: 10px
-	background: rgba(0, 0, 0, 0.04)
-	margin-left: 12px
-	border-radius: 50%
-	cursor: pointer
-.pencil-icon
-	padding: 10px
-	background: rgba(0, 0, 0, 0.04)
-	border-radius: 50%
-	cursor: pointer
-
 .border-bottom
 	border-bottom: 1px solid rgba(0,0,0,.1)
 

app/src/plugins/tm@modal/team/z-delete-team-modal.vue

@@ -5,12 +5,12 @@
 				<h1>
 					Ste si istý, že chcete zmazať tím <b>{{ team.name }}</b>?
 				</h1>
-				<v-icon @click.stop="visible = false" icon="mdi-close" size="large"></v-icon>
+				<v-icon @click.stop="closeModal()" icon="mdi-close" size="large"></v-icon>
 			</div>
 
 			<v-card-actions class="mt-10 d-flex justify-start align-center">
-				<v-btn class="z-btn" variant="flat" @click="deleteTeam()">ÁNO</v-btn>
+				<v-btn class="button primary" variant="flat" @click="deleteTeam()">ÁNO</v-btn>
-				<v-btn class="ml-7 cancel-btn" @click.stop="visible = false">ZRUŠIŤ</v-btn>
+				<v-btn class="ml-7 button cancel" @click.stop="closeModal()">ZRUŠIŤ</v-btn>
 			</v-card-actions>
 		</v-card>
 	</v-dialog>
@@ -18,12 +18,12 @@
 
 <script>
 export default {
-	emits: ['deleted'],
+	emits: ['update'],
 
 	data() {
 		return {
 			visible: false,
-			team: null,
+			team: null
 		}
 	},
 
@@ -33,11 +33,15 @@ export default {
 			this.visible = true
 		},
 
+		closeModal() {
+			this.visible = false
+		},
+
 		async deleteTeam() {
 			try {
-				await this.$axios.delete(`v1/teams/${this.team.id}`)
+				await this.$axios.delete_auth(`v1/teams/${this.team.id}`)
 				this.visible = false
-				this.$emit('deleted', this.team)
+				this.$emit('update', this.team)
 			} catch (error) {
 				this.$toast.error(error)
 			}

app/src/plugins/tm@modal/team/z-team-modal.vue

@@ -5,7 +5,7 @@
 				<div class="d-flex justify-space-between align-center modal-header">
 					<h1>{{ team.id ? 'Upraviť tím' : 'Vytvoriť tím' }}</h1>
 					<v-icon
-						@click.stop="close()"
+						@click.stop="closeModal()"
 						icon="mdi-close"
 						size="large"
 					></v-icon>
@@ -26,7 +26,7 @@
 					></v-text-field>
 
 					<div
-						class="employee-position w-100"
+						class="relative w-100"
 						v-for="(employee, index) in team.employees"
 						:key="employee.id"
 					>
@@ -54,7 +54,7 @@
 					/>
 				</v-card-actions>
 
-				<v-btn class="z-btn" @click="save()">{{ team.id ? 'UPRAVIŤ' : 'VYTVORIŤ' }}</v-btn>
+				<v-btn class="button primary" @click="save()">{{ team.id ? 'UPRAVIŤ' : 'VYTVORIŤ' }}</v-btn>
 			</v-card>
 		</W-loadable>
 	</v-dialog>
@@ -65,11 +65,12 @@ import ZAutocomplete 	from '@/plugins/tm@_components/z-autocomplete.vue'
 import useVuelidate		from '@vuelidate/core'
 import { required } 	from '@vuelidate/validators'
 import errorUtils 		from '@/plugins/lib@auth/_utils/error.utils'
+import tmUtils 				from '@/plugins/tm@_utils/tm.utils'
 
 const atLeastOne = (value) => value.length
 
 export default {
-	emits: ['close'],
+	emits: ['close', 'update'],
 
 	components: {
 		ZAutocomplete,
@@ -95,74 +96,41 @@ export default {
 	},
 
 	methods: {
-		async save() {
-			if (!(await this.v$.$validate()))
-				return
-
-			try {
-				if (this.team.id)
-					await this._edit()
-				else
-					await this._create()
-
-				this.close()
-			} catch (error) {
-				this.$toast(error)
-			}
-		},
-
 		async showModal(team = null) {
 			this.visible = true
 			this.team = null
 
 			try {
 				const allEmployees = await this.$axios.get_auth_data('v1/employees')
-				this.allEmployees = this._enrichEmployeesByFullName(allEmployees)
+				this.allEmployees = tmUtils.enrichEmployeesByFullName(allEmployees)
+
+				if (team?.id) {
+					const t = await this.$axios.get_auth_data(`v1/teams/${team.id}`)
+					this.team  = {...t, employees: tmUtils.enrichEmployeesByFullName(t.employees)}
+				} else {
+					this.team = {employees: []}
+				}
 			} catch (error) {
 				this.$toast.error(error)
 			}
-
-			if (team?.id) {
-				await this._load(team.id)
-			} else {
-				const team = {
-					name: '',
-					employees: []
-				}
-
-				setTimeout(() => {
-					this.team = team
-				})
-			}
 		},
 
-		close() {
+		closeModal() {
 			this.visible = false
 			this.$emit('close', this.team)
 		},
 
-		async _create() {
+		async save() {
+			if (!(await this.v$.$validate())) return
+
 			try {
+				if (this.team.id)
+					await this.$axios.patch_auth(`v1/teams/${this.team.id}`, this.team)
+				else
 					await this.$axios.post_auth(`v1/teams`, this.team)
-			} catch (error) {
-				this.$toast.error(error)
-			}
-		},
 
-		async _edit() {
+				this.$emit('update', this.team)
-			try {
+				this.closeModal()
-				await this.$axios.post_auth(`v1/teams/${this.team.id}`, this.team)
-			} catch (error) {
-				this.$toast.error(error)
-			}
-		},
-
-		async _load(id) {
-			try {
-				const team 		= await this.$axios.get_auth_data(`v1/teams/${id}`)
-				team.employees 	= this._enrichEmployeesByFullName(team.employees)
-
-				this.team = team
 			} catch (error) {
 				this.$toast.error(error)
 			}
@@ -171,13 +139,6 @@ export default {
 		employeeSelected(selectedOption) {
 			const employee = this.allEmployees.find((empl) => empl.id == selectedOption.key)
 			this.team.employees.push(employee)
-		},
-
-		_enrichEmployeesByFullName(employees) {
-			return employees.map(employee => {
-				employee._fullName = `${employee.name} ${employee.surname}`
-				return employee
-			})
 		}
 	},
 
@@ -200,31 +161,3 @@ export default {
 	}
 }
 </script>
-
-<style lang="sass" scoped>
-.modal-input
-	width: 100%
-	flex: 0 0 auto
-.modal-header
-	flex: 0 0 auto
-
-.modal-content
-	flex: 1 1 100%
-	margin: 10px 0
-	overflow-y: scroll
-
-.z-btn
-	height: 50px
-	width: 100%
-	flex: 0 0 auto
-
-.remove-input
-	pointer-events: auto
-	opacity: 2
-	position: absolute
-	left: 92%
-	top: 25%
-
-.employee-position
-	position: relative
-</style>

app/src/plugins/tm@overview/_components/z-tasks-search.vue

@@ -5,7 +5,7 @@
 			class="subheader-input"
 			variant="outlined"
 			label="Zamestanec"
-			:items="allEmployees"
+			:items="[null, ...allEmployees]"
 			item-title="fullName"
 			item-value="id"
 		></v-select>

app/src/plugins/tm@overview/teams/teams.vue

@@ -1,6 +1,6 @@
 <template>
 	<W-loadable :content="teams">
-		<A-teams-table :teams="teams" />
+		<A-teams-table :teams="teams" @reloadData="_loadData" />
 	</W-loadable>
 </template>
 

app/src/plugins/tm@profile/profile/my-profile.vue

@@ -58,7 +58,7 @@
 		></v-text-field>
 	</div>
 	<div class="py-5 px-5">
-		<v-btn class="z-btn" @click="updateUserInfo()">ULOŽIŤ ZMENY</v-btn>
+		<v-btn class="button primary" @click="updateUserInfo()">ULOŽIŤ ZMENY</v-btn>
 	</div>
 </template>
 

app/src/plugins/w/axios/models/axios.ts

@@ -34,7 +34,7 @@ export default {
 
 	async post(url: string, params = null, config?: any) {
 
-		return axios.post(url, params, config)
+		return axios.post(url, {data: params}, config)
 			.then(response => response.data)
 			.catch(error => Promise.reject(error))
 	},
@@ -42,14 +42,14 @@ export default {
 	async post_auth(url: string, params = null, config?: any) {
 		config = this._config(config)
 
-		return axios.post(url, params, config)
+		return axios.post(url, {data: params}, config)
 			.then(response => response.data)
 			.catch(error => Promise.reject(error))
 	},
 
 	async post_data(url: string, params = null, config?: any) {
 
-		return axios.post(url, params, config)
+		return axios.post(url, {data: params}, config)
 			.then(response => response.data.data)
 			.catch(error => Promise.reject(error.response || error))
 	},
@@ -57,7 +57,7 @@ export default {
 	async post_auth_data(url: string, params = null, config?: any) {
 		config = this._config(config)
 
-		return axios.post(url, params, config)
+		return axios.post(url, {data: params}, config)
 			.then(response => response.data.data)
 			.catch(error => Promise.reject(error.response || error))
 	},
@@ -91,7 +91,7 @@ export default {
 	},
 
 	async patch(url: string, params = null, config?: any) {
-		return axios.patch(url, params, config)
+		return axios.patch(url, {data: params}, config)
 			.then(response => response.data)
 			.catch(error => Promise.reject(error))
 	},
@@ -99,13 +99,13 @@ export default {
 	async patch_auth(url: string, params = null, config?: any) {
 		config = this._config(config)
 
-		return axios.patch(url, params, config)
+		return axios.patch(url, {data: params}, config)
 			.then(response => response.data)
 			.catch(error => Promise.reject(error))
 	},
 
 	async patch_data(url: string, params = null, config?: any) {
-		return axios.patch(url, params, config)
+		return axios.patch(url, {data: params}, config)
 			.then(response => response.data.data)
 			.catch(error => Promise.reject(error.response || error))
 	},
@@ -113,7 +113,7 @@ export default {
 	async patch_auth_data(url: string, params = null, config?: any) {
 		config = this._config(config)
 
-		return axios.patch(url, params, config)
+		return axios.patch(url, {data: params}, config)
 			.then(response => response.data.data)
 			.catch(error => Promise.reject(error.response || error))
 	},

app/src/plugins/w/loadable/_components/w-loadable.vue

@@ -1,5 +1,5 @@
 <template>
-	<div>
+	<div ref="loadingContainer">
 		<div v-if="!content"></div>
 		<div v-else-if="content.error">{{ content.error }}</div>
 		<div v-else-if="(typeof content == 'array' && !array.length) || (typeof content == 'object' && !Object.values(content).length)">{{ emptyMessage }}</div>
@@ -32,6 +32,7 @@ export default {
 
 	methods: {
 		async _startLoading() {
+			// Kravarik: toto hadze tie warny v konzole. Fixnut
 			this.loader = await this.$loading.show()
 		},