✨ Update all for Postgres and new techniques

{{cookiecutter.project_slug}}/frontend/src/views/main/Dashboard.vue

@@ -23,11 +23,11 @@ import { readUserProfile } from '@/store/main/accessors';
 export default class Dashboard extends Vue {
   get greetedUser() {
     const userProfile = readUserProfile(this.$store);
-    if (userProfile && userProfile.human_name) {
-      if (userProfile.human_name) {
-        return userProfile.human_name;
+    if (userProfile && userProfile.full_name) {
+      if (userProfile.full_name) {
+        return userProfile.full_name;
       } else {
-        return userProfile.name;
+        return userProfile.email;
       }
     }
   }

{{cookiecutter.project_slug}}/frontend/src/views/main/admin/Admin.vue

@@ -6,7 +6,6 @@
 import { Component, Vue } from 'vue-property-decorator';
 import { store } from '@/store';
 import { readHasAdminAccess } from '@/store/main/accessors';
-import { dispatchGetRoles } from '@/store/admin/accessors';
 
 const routeGuardAdmin = async (to, from, next) => {
   if (!readHasAdminAccess(store)) {
@@ -17,7 +16,7 @@ const routeGuardAdmin = async (to, from, next) => {
 };
 
 @Component
-export default class Start extends Vue {
+export default class Admin extends Vue {
   public beforeRouteEnter(to, from, next) {
     routeGuardAdmin(to, from, next);
   }
@@ -25,9 +24,5 @@ export default class Start extends Vue {
   public beforeRouteUpdate(to, from, next) {
     routeGuardAdmin(to, from, next);
   }
-
-  public async mounted() {
-    await dispatchGetRoles(this.$store);
-  }
 }
 </script>

{{cookiecutter.project_slug}}/frontend/src/views/main/admin/AdminUsers.vue

@@ -11,15 +11,13 @@
       <template slot="items" slot-scope="props">
         <td>{{ props.item.name }}</td>
         <td>{{ props.item.email }}</td>
-        <td>{{ props.item.human_name }}</td>
-        <td>{{ props.item.disabled }}</td>
-        <td>
-          <v-chip v-for="role in props.item.admin_roles" :key="role">{{role}}</v-chip>
-        </td>
+        <td>{{ props.item.full_name }}</td>
+        <td><v-icon v-if="props.item.is_active">checkmark</v-icon></td>
+        <td><v-icon v-if="props.item.is_superuser">checkmark</v-icon></td>
         <td class="justify-center layout px-0">
           <v-tooltip top>
             <span>Edit</span>
-            <v-btn slot="activator" flat :to="{name: 'main-admin-users-edit', params: {name: props.item.name}}">
+            <v-btn slot="activator" flat :to="{name: 'main-admin-users-edit', params: {id: props.item.id}}">
               <v-icon>edit</v-icon>
             </v-btn>
           </v-tooltip>
@@ -36,7 +34,7 @@ import { IUserProfile } from '@/interfaces';
 import { readAdminUsers, dispatchGetUsers } from '@/store/admin/accessors';
 
 @Component
-export default class UserProfile extends Vue {
+export default class AdminUsers extends Vue {
   public headers = [
     {
       text: 'Name',
@@ -53,23 +51,24 @@ export default class UserProfile extends Vue {
     {
       text: 'Full Name',
       sortable: true,
-      value: 'human_name',
+      value: 'full_name',
       align: 'left',
     },
     {
-      text: 'Disabled',
+      text: 'Is Active',
       sortable: true,
-      value: 'disabled',
+      value: 'isActive',
       align: 'left',
     },
     {
-      text: 'Roles',
-      value: 'admin_roles',
+      text: 'Is Superuser',
+      sortable: true,
+      value: 'isSuperuser',
       align: 'left',
     },
     {
       text: 'Actions',
-      value: 'name',
+      value: 'id',
     },
   ];
   get users() {

{{cookiecutter.project_slug}}/frontend/src/views/main/admin/CreateUser.vue

@@ -7,13 +7,12 @@
       <v-card-text>
         <template>
           <v-form v-model="valid" ref="form" lazy-validation>
-            <v-text-field label="Username" v-model="name" required></v-text-field>
             <v-text-field label="Full Name" v-model="fullName" required></v-text-field>
             <v-text-field label="E-mail" type="email" v-model="email" v-validate="'required|email'" data-vv-name="email" :error-messages="errors.collect('email')" required></v-text-field>
-            <div class="subheading secondary--text text--lighten-2">Roles</div>
-            <v-checkbox v-for="(value, role) in selectedRoles" :key="role" :label="role" v-model="selectedRoles[role]"></v-checkbox>
-            <div class="subheading secondary--text text--lighten-2">Disable User <span v-if="userDisabled">(currently disabled)</span><span v-else>(currently enabled)</span></div>
-            <v-checkbox :label="'Disabled'" v-model="userDisabled"></v-checkbox>
+            <div class="subheading secondary--text text--lighten-2">User is superuser <span v-if="isSuperuser">(currently is a superuser)</span><span v-else>(currently is not a superuser)</span></div>
+            <v-checkbox label="Is Superuser" v-model="isSuperuser"></v-checkbox>
+            <div class="subheading secondary--text text--lighten-2">User is active <span v-if="isActive">(currently active)</span><span v-else>(currently not active)</span></div>
+            <v-checkbox label="Is Active" v-model="isActive"></v-checkbox>
             <v-layout align-center>
               <v-flex>
                 <v-text-field type="password" ref="password" label="Set Password" data-vv-name="password" data-vv-delay="100" v-validate="{required: true}" v-model="password1" :error-messages="errors.first('password')">
@@ -41,38 +40,32 @@ import {
   IUserProfileUpdate,
   IUserProfileCreate,
 } from '@/interfaces';
-import { dispatchGetUsers, dispatchGetRoles, dispatchCreateUser, readAdminRoles } from '@/store/admin/accessors';
+import { dispatchGetUsers, dispatchCreateUser } from '@/store/admin/accessors';
 
 @Component
-export default class EditUser extends Vue {
+export default class CreateUser extends Vue {
   public valid = false;
-  public name: string = '';
   public fullName: string = '';
   public email: string = '';
+  public isActive: boolean = true;
+  public isSuperuser: boolean = false;
   public setPassword = false;
   public password1: string = '';
   public password2: string = '';
-  public userDisabled: boolean = false;
-
-  public selectedRoles: { [role: string]: boolean } = {};
 
   public async mounted() {
     await dispatchGetUsers(this.$store);
-    await dispatchGetRoles(this.$store);
     this.reset();
   }
 
   public reset() {
     this.password1 = '';
     this.password2 = '';
-    this.name = '';
     this.fullName = '';
     this.email = '';
-    this.userDisabled = false;
+    this.isActive = true;
+    this.isSuperuser = false;
     this.$validator.reset();
-    this.availableRoles.forEach((value) => {
-      Vue.set(this.selectedRoles, value, false);
-    });
   }
 
   public cancel() {
@@ -82,29 +75,20 @@ export default class EditUser extends Vue {
   public async submit() {
     if (await this.$validator.validateAll()) {
       const updatedProfile: IUserProfileCreate = {
-        name: this.name,
+        email: this.email,
       };
       if (this.fullName) {
-        updatedProfile.human_name = this.fullName;
+        updatedProfile.full_name = this.fullName;
       }
       if (this.email) {
         updatedProfile.email = this.email;
       }
-      updatedProfile.disabled = this.userDisabled;
-      updatedProfile.admin_roles = [];
-      this.availableRoles.forEach((role: string) => {
-        if (this.selectedRoles[role]) {
-          updatedProfile.admin_roles!.push(role);
-        }
-      });
+      updatedProfile.is_active = this.isActive;
+      updatedProfile.is_superuser = this.isSuperuser;
       updatedProfile.password = this.password1;
       await dispatchCreateUser(this.$store, updatedProfile);
       this.$router.push('/main/admin/users');
     }
   }
-
-  get availableRoles() {
-    return readAdminRoles(this.$store);
-  }
 }
 </script>

{{cookiecutter.project_slug}}/frontend/src/views/main/admin/EditUser.vue

@@ -8,16 +8,16 @@
         <template>
           <div class="my-3">
             <div class="subheading secondary--text text--lighten-2">Username</div>
-            <div class="title primary--text text--darken-2" v-if="user">{{user.name}}</div>
+            <div class="title primary--text text--darken-2" v-if="user">{{user.email}}</div>
             <div class="title primary--text text--darken-2" v-else>-----</div>
           </div>
           <v-form v-model="valid" ref="form" lazy-validation>
             <v-text-field label="Full Name" v-model="fullName" required></v-text-field>
             <v-text-field label="E-mail" type="email" v-model="email" v-validate="'required|email'" data-vv-name="email" :error-messages="errors.collect('email')" required></v-text-field>
-            <div class="subheading secondary--text text--lighten-2">Roles</div>
-            <v-checkbox v-for="(value, role) in selectedRoles" :key="role" :label="role" v-model="selectedRoles[role]"></v-checkbox>
-            <div class="subheading secondary--text text--lighten-2">Disable User <span v-if="userDisabled">(currently disabled)</span><span v-else>(currently enabled)</span></div>
-            <v-checkbox :label="'Disabled'" v-model="userDisabled"></v-checkbox>
+            <div class="subheading secondary--text text--lighten-2">User is superuser <span v-if="isSuperuser">(currently is a superuser)</span><span v-else>(currently is not a superuser)</span></div>
+            <v-checkbox label="Is Superuser" v-model="isSuperuser"></v-checkbox>
+            <div class="subheading secondary--text text--lighten-2">User is active <span v-if="isActive">(currently active)</span><span v-else>(currently not active)</span></div>
+            <v-checkbox label="Is Active" v-model="isActive"></v-checkbox>
             <v-layout align-center>
               <v-flex shrink>
                 <v-checkbox v-model="setPassword" class="mr-2"></v-checkbox>
@@ -48,31 +48,23 @@ import { Component, Vue } from 'vue-property-decorator';
 import { IUserProfile, IUserProfileUpdate } from '@/interfaces';
 import {
   dispatchGetUsers,
-  dispatchGetRoles,
   dispatchUpdateUser,
   readAdminOneUser,
-  readAdminRoles,
 } from '@/store/admin/accessors';
 
 @Component
 export default class EditUser extends Vue {
   public valid = true;
-  public name: string = '';
   public fullName: string = '';
   public email: string = '';
+  public isActive: boolean = true;
+  public isSuperuser: boolean = false;
   public setPassword = false;
   public password1: string = '';
   public password2: string = '';
-  public userDisabled: boolean = false;
-
-  public selectedRoles: { [role: string]: boolean } = {};
 
   public async mounted() {
     await dispatchGetUsers(this.$store);
-    await dispatchGetRoles(this.$store);
-    this.availableRoles.forEach((value) => {
-      Vue.set(this.selectedRoles, value, false);
-    });
     this.reset();
   }
 
@@ -82,17 +74,10 @@ export default class EditUser extends Vue {
     this.password2 = '';
     this.$validator.reset();
     if (this.user) {
-      this.name = this.user.name;
-      this.fullName = this.user.human_name;
+      this.fullName = this.user.full_name;
       this.email = this.user.email;
-      this.userDisabled = this.user.disabled;
-      this.availableRoles.forEach((role: string) => {
-        if (this.user!.admin_roles.includes(role)) {
-          Vue.set(this.selectedRoles, role, true);
-        } else {
-          Vue.set(this.selectedRoles, role, false);
-        }
-      });
+      this.isActive = this.user.is_active;
+      this.isSuperuser = this.user.is_superuser;
     }
   }
 
@@ -104,33 +89,23 @@ export default class EditUser extends Vue {
     if (await this.$validator.validateAll()) {
       const updatedProfile: IUserProfileUpdate = {};
       if (this.fullName) {
-        updatedProfile.human_name = this.fullName;
+        updatedProfile.full_name = this.fullName;
       }
       if (this.email) {
         updatedProfile.email = this.email;
       }
-      updatedProfile.disabled = this.userDisabled;
-      updatedProfile.admin_roles = [];
-      this.availableRoles.forEach((role: string) => {
-        if (this.selectedRoles[role]) {
-          updatedProfile.admin_roles!.push(role);
-        }
-      });
+      updatedProfile.is_active = this.isActive;
+      updatedProfile.is_superuser = this.isSuperuser;
       if (this.setPassword) {
         updatedProfile.password = this.password1;
       }
-      const payload = { name: this.name, user: updatedProfile };
-      await dispatchUpdateUser(this.$store, payload);
+      await dispatchUpdateUser(this.$store, { id: this.user!.id, user: updatedProfile });
       this.$router.push('/main/admin/users');
     }
   }
 
   get user() {
-    return readAdminOneUser(this.$store)(this.$router.currentRoute.params.name);
-  }
-
-  get availableRoles() {
-    return readAdminRoles(this.$store);
+    return readAdminOneUser(this.$store)(+this.$router.currentRoute.params.id);
   }
 }
 </script>

{{cookiecutter.project_slug}}/frontend/src/views/main/profile/UserProfile.vue

@@ -7,12 +7,7 @@
       <v-card-text>
         <div class="my-4">
           <div class="subheading secondary--text text--lighten-3">Full Name</div>
-          <div class="title primary--text text--darken-2" v-if="userProfile && userProfile.human_name">{{userProfile.human_name}}</div>
-          <div class="title primary--text text--darken-2" v-else>-----</div>
-        </div>
-        <div class="my-3">
-          <div class="subheading secondary--text text--lighten-3">Username</div>
-          <div class="title primary--text text--darken-2" v-if="userProfile && userProfile.name">{{userProfile.name}}</div>
+          <div class="title primary--text text--darken-2" v-if="userProfile && userProfile.full_name">{{userProfile.full_name}}</div>
           <div class="title primary--text text--darken-2" v-else>-----</div>
         </div>
         <div class="my-3">

{{cookiecutter.project_slug}}/frontend/src/views/main/profile/UserProfileEdit.vue

@@ -6,11 +6,6 @@
       </v-card-title>
       <v-card-text>
         <template>
-          <div class="my-3">
-            <div class="subheading secondary--text text--lighten-2">Username</div>
-            <div class="title primary--text text--darken-2" v-if="userProfile.name">{{userProfile.name}}</div>
-            <div class="title primary--text text--darken-2" v-else>-----</div>
-          </div>
           <v-form v-model="valid" ref="form" lazy-validation>
             <v-text-field label="Full Name" v-model="fullName" required></v-text-field>
             <v-text-field label="E-mail" type="email" v-model="email" v-validate="'required|email'" data-vv-name="email" :error-messages="errors.collect('email')" required></v-text-field>
@@ -41,7 +36,7 @@ export default class UserProfileEdit extends Vue {
   public created() {
     const userProfile = readUserProfile(this.$store);
     if (userProfile) {
-      this.fullName = userProfile.human_name;
+      this.fullName = userProfile.full_name;
       this.email = userProfile.email;
     }
   }
@@ -53,7 +48,7 @@ export default class UserProfileEdit extends Vue {
   public reset() {
     const userProfile = readUserProfile(this.$store);
     if (userProfile) {
-      this.fullName = userProfile.human_name;
+      this.fullName = userProfile.full_name;
       this.email = userProfile.email;
     }
   }
@@ -66,7 +61,7 @@ export default class UserProfileEdit extends Vue {
     if ((this.$refs.form as any).validate()) {
       const updatedProfile: IUserProfileUpdate = {};
       if (this.fullName) {
-        updatedProfile.human_name = this.fullName;
+        updatedProfile.full_name = this.fullName;
       }
       if (this.email) {
         updatedProfile.email = this.email;

{{cookiecutter.project_slug}}/frontend/src/views/main/profile/UserProfileEditPassword.vue

@@ -7,9 +7,9 @@
       <v-card-text>
         <template>
           <div class="my-3">
-            <div class="subheading secondary--text text--lighten-2">Username</div>
-            <div class="title primary--text text--darken-2" v-if="userProfile.name">{{userProfile.name}}</div>
-            <div class="title primary--text text--darken-2" v-else>-----</div>
+            <div class="subheading secondary--text text--lighten-2">User</div>
+            <div class="title primary--text text--darken-2" v-if="userProfile.full_name">{{userProfile.full_name}}</div>
+            <div class="title primary--text text--darken-2" v-else>{{userProfile.email}}</div>
           </div>
           <v-form ref="form">
             <v-text-field