feat: user PasswordUpdate script setup (#1933)

Co-authored-by: Dominik Pschenitschni <mail@celement.de>
Reviewed-on: #1933
Co-authored-by: Dominik Pschenitschni <dpschen@noreply.kolaente.de>
Co-committed-by: Dominik Pschenitschni <dpschen@noreply.kolaente.de>

src/views/user/settings/PasswordUpdate.vue

@@ -53,36 +53,40 @@
 
 <script lang="ts">
 import {defineComponent} from 'vue'
-import PasswordUpdateService from '@/services/passwordUpdateService'
-import PasswordUpdateModel from '@/models/passwordUpdate'
 
 export default defineComponent({
 	name: 'user-settings-password-update',
-	data() {
+})
-		return {
+</script>
-			passwordUpdateService: new PasswordUpdateService(),
+
-			passwordUpdate: new PasswordUpdateModel(),
+<script setup lang="ts">
-			passwordConfirm: '',
+import {ref, reactive, shallowReactive, computed} from 'vue'
-		}
+import { useI18n } from 'vue-i18n'
-	},
+import { useStore } from 'vuex'
-	mounted() {
+
-		this.setTitle(`${this.$t('user.settings.newPasswordTitle')} - ${this.$t('user.settings.title')}`)
+import PasswordUpdateService from '@/services/passwordUpdateService'
-	},
+import PasswordUpdateModel from '@/models/passwordUpdate'
-	computed: {
+
-		isLocalUser() {
+import {useTitle} from '@/composables/useTitle'
-			return this.$store.state.auth.info?.isLocalUser
+import {success, error} from '@/message'
-		},
+
-	},
+const passwordUpdateService = shallowReactive(new PasswordUpdateService())
-	methods: {
+const passwordUpdate = reactive(new PasswordUpdateModel())
-		async updatePassword() {
+const passwordConfirm = ref('')
-			if (this.passwordConfirm !== this.passwordUpdate.newPassword) {
+
-				this.$message.error({message: this.$t('user.settings.passwordsDontMatch')})
+const {t} = useI18n()
+const store = useStore()
+useTitle(() => `${t('user.settings.newPasswordTitle')} - ${t('user.settings.title')}`)
+
+const isLocalUser = computed(() => store.state.auth.info?.isLocalUser)
+
+async function updatePassword() {
+	if (passwordConfirm.value !== passwordUpdate.newPassword) {
+		error({message: t('user.settings.passwordsDontMatch')})
 		return
 	}
 
-			await this.passwordUpdateService.update(this.passwordUpdate)
+	await passwordUpdateService.update(passwordUpdate)
-			this.$message.success({message: this.$t('user.settings.passwordUpdateSuccess')})
+	success({message: t('user.settings.passwordUpdateSuccess')})
-		},
+}
-	},
-})
 </script>