added new user edit view

public/js/pages/UserEdit/UserEdit.css

@@ -97,6 +97,10 @@
     align-items: end;
 }
 
+.password-generation-grid .form-group {
+    margin-bottom: 0;
+}
+
 .selected-items-viewer {
     display: grid;
     grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));

public/js/pages/UserEdit/UserEdit.js

@@ -10,7 +10,7 @@ Vue.component("UserEdit", {
             </tt-tooltip>
           </div>
           <div class="user-form-grid">
-            <tt-input label="Username" v-model="user.username" sm/>
+            <tt-input label="Username" v-model="user.username" sm :disabled="!isNewUser"/>
             <tt-input label="Name" v-model="user.name" sm/>
             <tt-input label="Email" v-model="user.email" type="email" sm/>
             <tt-input label="Handy Nr." v-model="user.mobile" placeholder="+43..." sm/>
@@ -99,7 +99,7 @@ Vue.component("UserEdit", {
                 </div>
                 <tt-input label="Passwort wiederholen" v-model="password.repeat" type="password" sm/>
               </tt-card>
-              <tt-card>
+              <tt-card v-if="!isNewUser">
                 <label>API Key</label>
                 <div class="input-group">
                   <input type="text" class="form-control form-control-sm" :value="user.apikey" readonly>
@@ -164,12 +164,17 @@ Vue.component("UserEdit", {
         }
     },
     computed: {
+        isNewUser() {
+            return !this.user.id;
+        },
         templateOptions() {
             const options = this.lookups.permissionTemplates.map(t => ({ value: t.id, text: t.name }));
             options.unshift({ value: null, text: 'Vorlage auswählen...' });
             return options;
         },
         permissionChangesTooltip() {
+            if (this.isNewUser) return "Ein neuer Benutzer wird erstellt.";
+
             const added = [];
             const removed = [];
             for (const key in this.user.permissions) {
@@ -237,7 +242,7 @@ Vue.component("UserEdit", {
         async loadDataFromUser(userId) {
             if(!userId) return;
             try {
-                const response = await axios.get(`/UserEdit/getUserDataForTemplate?id=${userId}`);
+                const response = await axios.get(`/User/getUserDataForTemplate?id=${userId}`);
                 const dataToApply = response.data;
 
                 // Apply Permissions
@@ -263,6 +268,13 @@ Vue.component("UserEdit", {
         },
         saveUser() {
             this.isSaving = true;
+
+            if (this.isNewUser && !this.user.username) {
+                window.notify('error', 'Benutzername ist ein Pflichtfeld.');
+                this.isSaving = false;
+                return;
+            }
+
             if (this.password.new && this.password.new !== this.password.repeat) {
                 window.notify('error', 'Die Passwörter stimmen nicht überein!');
                 this.isSaving = false;
@@ -274,6 +286,10 @@ Vue.component("UserEdit", {
             const fields = ['id', 'username', 'name', 'email', 'mobile', 'address_id', 'employee_number', 'project_api_key', 'vodia_identity_domain', 'vodia_identity_username', 'vodia_identity_default'];
             fields.forEach(field => formData.append(field, this.user[field] || ''));
 
+            if (this.isNewUser) {
+                formData.delete('id');
+            }
+
             // Append booleans as 'true'/'false' strings
             formData.append('active', this.user.active ? 'true' : 'false');
             formData.append('twofactorrequired', this.user.twofactorrequired ? 'true' : 'false');
@@ -349,7 +365,17 @@ Vue.component("UserEdit", {
         });
         this.user.permissions = permissions;
         this.initialPermissions = JSON.parse(JSON.stringify(permissions)); // Deep copy for change tracking
-        this.user.active = this.user.active == 1;
-        this.user.twofactorrequired = this.user.twofactorrequired == 1;
+        this.user.active = this.user.active == 1 || this.isNewUser;
+        this.user.twofactorrequired = this.user.twofactorrequired == 1 || this.isNewUser;
+
+        // Set default collapse state for new users
+        if (this.isNewUser) {
+            this.collapsedSections = {
+                permissions: false,
+                employeeSpecific: false,
+                projects: false,
+                security: false,
+            };
+        }
     }
 });