[Modals] Refactoring

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

@@ -1,4 +1,6 @@
 .modal-header
+	flex: 0 0 auto
+
 	.trash-icon
 		padding: 10px
 		background: rgba(0, 0, 0, 0.04)
@@ -10,4 +12,21 @@
 		padding: 10px
 		background: rgba(0, 0, 0, 0.04)
 		border-radius: 50%
-		cursor: pointer
+		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/index.sass

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

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

@@ -1,17 +0,0 @@
-.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
-
-.remove-input
-	pointer-events: auto
-	opacity: 2
-	position: absolute
-	left: 92%
-	top: 25%

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

@@ -101,17 +101,7 @@
 						@option-selected="employeeSelected"
 					/>
 
-					<!-- Kravarik: Tu je original autocomplete, skus to spravit radsej cez tento -->
+					<v-btn class="w-100 mb-5 button secondary" :disabled="!masterTask.team?.id" @click="showAddEmployeeInput = true">
-					<!-- <v-autocomplete
-						ref="employee-select"
-						v-model="employeeSelect"
-						:items="employees"
-						item-value="id"
-						item-title="_fullName"
-						class="modal-input"
-					/> -->
-
-					<v-btn class="w-100 mb-5 button secondary" :disabled="!masterTask.team.employees" @click="showAddEmployeeInput = true">
 						<v-icon class="mx-1" icon="mdi-plus" />Pridať zamestnanca
 					</v-btn>
 
@@ -318,7 +308,7 @@ import ZFilesUpload 	from '@/plugins/tm@_components/z-files-upload.vue'
 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 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'
@@ -335,7 +325,7 @@ export default {
 	components: {
 		Datepicker,
 		ZFilesUpload,
-		// ZAutocomplete,
+		ZAutocomplete,
 		QuillEditor
 	},
 

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

@@ -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ý"
@@ -354,8 +354,8 @@ export default {
 			v$: useVuelidate(),
 			preventInputFocus: false,
 			masterTasks: [],
-			selectedMasterTaskId: null,
+			masterTaskIdSelect: null,
-			selectedEmployeeId: null
+			employeeIdSelect: null
 		}
 	},
 
@@ -371,9 +371,9 @@ export default {
 	validations() {
 		return {
 			task: {
-				project_code: { required },
+				// project_code: { required },
 				date: { required },
-				team: { required },
+				// team: { required },
 				duration: { required },
 				employee: { required },
 			},
@@ -396,8 +396,8 @@ export default {
 				if (task?.id) {
 					const t = await this.$axios.get_auth_data(`v1/tasks/${task.id}`)
 
-					this.selectedEmployeeId 	= t.employee.id
+					this.employeeIdSelect 	= t.employee.id
-					this.selectedMasterTaskId 	= t.master_task.id
+					this.masterTaskIdSelect 	= t.master_task.id
 					this.task 					= t
 				} else {
 					this.task = {master_task: {}}
@@ -442,20 +442,16 @@ export default {
 	},
 
 	watch: {
-		selectedMasterTaskId(value) {
+		masterTaskIdSelect(value) {
 			if (!value || !this.task) return
 
-			this.task.master_task = this.masterTasks.find(
+			this.task.master_task = this.masterTasks.find(masterTask => masterTask.id == value)
-				(masterTask) => masterTask.id == value
-			)
 		},
 
-		selectedEmployeeId(value) {
+		employeeIdSelect(value) {
 			if (!value || !this.task) return
 
-			this.task.employee = this.task.master_task.employees.find(
+			this.task.employee = this.task.master_task.employees.find(employee => employee.id == value)
-				(employee) => employee.id == value
-			)
 		},
 	},
 }

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

@@ -29,7 +29,7 @@ export default {
 	methods: {
 		async _loadData() {
 			this.teams = null
-			
+
 			try {
 				this.teams = await this.$axios.get_auth_data('v1/teams')
 			} catch (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()
 		},