[master-task-modal employees]

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

@@ -1,5 +1,123 @@
 <template>
-	<div>
-		
-	</div>
-</template>
+	<W-loadable :content="user ? true : false">
+		<div v-if="user">
+			<div class="border-bottom py-5 px-5">
+				<h1>Všeobecné informácie</h1>
+				<v-text-field
+					class="w-75"
+					variant="solo"
+					label="Meno"
+					v-model="user.name"
+					:class="{ error: v$.user.name.$errors.length }"
+					:hint="
+						v$.user.name.$errors
+							? errorUtils.parseErrors(v$.user.name.$errors)
+							: null
+					"
+				></v-text-field>
+				<v-text-field
+					class="w-75"
+					variant="solo"
+					label="Priezvisko"
+					v-model="user.surname"
+					:class="{ error: v$.user.surname.$errors.length }"
+					:hint="
+						v$.user.surname.$errors
+							? errorUtils.parseErrors(v$.user.surname.$errors)
+							: null
+					"
+				></v-text-field>
+			</div>
+			<div class="py-5 px-5 border-bottom">
+				<h1>Pracovná doba</h1>
+				<v-text-field
+					class="w-75"
+					variant="solo"
+					label="Začiatok"
+					v-model="user.work_hours_from"
+					append-inner-icon="mdi-clock-outline"
+					type="time"
+					:class="{ error: v$.user.work_hours_from.$errors.length }"
+					:hint="
+						v$.user.work_hours_from.$errors
+							? errorUtils.parseErrors(v$.user.work_hours_from.$errors)
+							: null
+					"
+				></v-text-field>
+				<v-text-field
+					class="w-75"
+					variant="solo"
+					label="Koniec"
+					v-model="user.work_hours_to"
+					append-inner-icon="mdi-clock-outline"
+					:class="{ error: v$.user.work_hours_to.$errors.length }"
+					:hint="
+						v$.user.work_hours_to.$errors
+							? errorUtils.parseErrors(v$.user.work_hours_to.$errors)
+							: null
+					"
+					type="time"
+				></v-text-field>
+			</div>
+			<div class="py-5 px-5">
+				<v-btn class="z-btn" @click="updateUserInfo()">ULOŽIŤ ZMENY</v-btn>
+			</div>
+		</div>
+	</W-loadable>
+</template>
+
+<script>
+import useVuelidate 	from '@vuelidate/core'
+import { required } 	from '@vuelidate/validators'
+import errorUtils 		from '@/plugins/lib@auth/_utils/error.utils'
+import { mapGetters } 	from 'vuex'
+
+export default {
+	data() {
+		return {
+			errorUtils,
+			v$: useVuelidate(),
+		}
+	},
+
+	computed: {
+		...mapGetters('auth', ['user']),
+	},
+
+	created() {
+		// TEMP
+		this.$store.dispatch('auth/login', {
+			email: 'xx@asdasd.asd',
+			password: 'sdfsdfsdf'
+		})
+	},
+
+	validations() {
+		return {
+			user: {
+				name: { required },
+				surname: { required },
+				work_hours_from: { required },
+				work_hours_to: { required },
+			},
+		}
+	},
+
+	methods: {
+		async updateUserInfo() {
+			if (!(await this.v$.$validate())) return
+			try {
+				await this.$store.dispatch('wAuth/updateUserInfo', this.user)
+				this.$toast.success('Profil bol úspešne zmenený')
+			} catch (error) {
+				this.$toast.error(error.response.data.error)
+			}
+		},
+	},
+}
+</script>
+
+<style lang="sass" scoped>
+.border-bottom
+	border-bottom: 1px solid #EDEDED
+</style>