first commit

2026-10-09 08:21:06 +02:00
parent db7456df87
commit d259c62304
3761 changed files with 896046 additions and 0 deletions
@@ -0,0 +1,142 @@
+<script setup lang="ts">
+import { useForm } from '@inertiajs/vue3';
+import { computed, ref } from 'vue';
+import AvatarCard from '@/components/users/AvatarCard.vue';
+import LoginDetailsForm from '@/components/users/LoginDetailsForm.vue';
+import TwoFactorPanel from '@/components/users/TwoFactorPanel.vue';
+import UserDetailsForm from '@/components/users/UserDetailsForm.vue';
+import Message from '@/components/ui/Message.vue';
+import type { SelectOption } from '@/components/ui/Select.vue';
+import Tabs from '@/components/ui/Tabs.vue';
+import { useSettings, useTranslations } from '@/composables/useVanguard';
+import AppLayout from '@/layouts/AppLayout.vue';
+import type {
+    AvatarSource,
+    LoginDetailsFormData,
+    TwoFactorState,
+    UserDetailsFormData,
+    UserFormPayload,
+} from '@/types';
+
+const props = defineProps<{
+    user: UserFormPayload;
+    roles: SelectOption[];
+    statuses: SelectOption[];
+    countries: SelectOption[];
+    avatarSources: AvatarSource[];
+    twoFactor: TwoFactorState;
+    forcePasswordChange: boolean;
+    activeTab: string;
+}>();
+
+const { __ } = useTranslations();
+const { setting } = useSettings();
+
+const details = useForm<UserDetailsFormData>({
+    role_id: props.user.role_id,
+    status: props.user.status,
+    first_name: props.user.first_name,
+    last_name: props.user.last_name,
+    birthday: props.user.birthday,
+    phone: props.user.phone,
+    address: props.user.address,
+    country_id: props.user.country_id,
+});
+
+const login = useForm<LoginDetailsFormData>({
+    email: props.user.email,
+    username: props.user.username,
+    password: '',
+    password_confirmation: '',
+});
+
+const tabs = computed(() => {
+    const items = [
+        { value: 'details', label: __('User Details') },
+        { value: 'login', label: __('Login Details') },
+    ];
+
+    if (setting('2fa.enabled')) {
+        items.push({ value: '2fa', label: __('Two-Factor Authentication') });
+    }
+
+    return items;
+});
+
+const tab = ref(props.activeTab);
+</script>
+
+<template>
+    <AppLayout
+        :title="__('My Profile')"
+        :heading="__('My Profile')"
+        :breadcrumbs="[{ label: __('My Profile') }]"
+    >
+        <Message v-if="forcePasswordChange" severity="warn" class="mb-4">
+            {{ __('Before continuing please update your password and set a new one.') }}
+        </Message>
+
+        <div class="grid grid-cols-1 gap-4 lg:grid-cols-3">
+            <div class="lg:col-span-2">
+                <div class="rounded-lg border border-slate-200 bg-white p-6 shadow-sm">
+                    <Tabs v-model="tab" :tabs="tabs">
+                        <template #details>
+                            <form
+                                @submit.prevent="
+                                    details.put(route('profile.update.details'), {
+                                        preserveScroll: true,
+                                    })
+                                "
+                            >
+                                <!--
+                                    Role and status are read only here, matching the
+                                    disabled selects the Blade profile rendered.
+                                -->
+                                <UserDetailsForm
+                                    v-model="details"
+                                    locked
+                                    :roles="roles"
+                                    :statuses="statuses"
+                                    :countries="countries"
+                                    :errors="details.errors"
+                                    :submit-label="__('Update Details')"
+                                    :processing="details.processing"
+                                />
+                            </form>
+                        </template>
+
+                        <template #login>
+                            <form
+                                @submit.prevent="
+                                    login.put(route('profile.update.login-details'), {
+                                        preserveScroll: true,
+                                    })
+                                "
+                            >
+                                <LoginDetailsForm
+                                    v-model="login"
+                                    edit
+                                    :errors="login.errors"
+                                    :submit-label="__('Update Details')"
+                                    :processing="login.processing"
+                                />
+                            </form>
+                        </template>
+
+                        <template #2fa>
+                            <TwoFactorPanel :user-id="user.id" :two-factor="twoFactor" />
+                        </template>
+                    </Tabs>
+                </div>
+            </div>
+
+            <AvatarCard
+                :avatar="user.avatar"
+                :name-or-email="user.nameOrEmail"
+                :sources="avatarSources"
+                :upload-url="route('profile.update.avatar')"
+                :external-url="route('profile.update.avatar-external')"
+            />
+        </div>
+    </AppLayout>
+</template>