Initial Nuxt frontend import

- Complete GGZ Ecademy Nuxt.js user portal
- Learning products browser and management
- Member management interface
- User authentication and roles
- Multi-language support (NL/EN)
- Vuex store for state management
- Component-based architecture

pages/manager/members/control.vue

@@ -0,0 +1,137 @@
+<template>
+  <div>
+    <div class="pa-6">
+      <page-header class="d-flex justify-space-between">
+        <div class="subtitle-1">
+          <span class="mr-4 display-1">
+            Ledencontrole
+            <small class="font-weight-light">( {{ changes.length }})</small>
+          </span>
+        </div>
+      </page-header>
+    </div>
+
+    <members-changes :items="changes" :users="users" />
+  </div>
+</template>
+
+<script>
+import PageHeader from '~/components/UI/PageHeader/PageHeader'
+import MembersChanges from '~/components/Members/MembersChanges'
+
+export default {
+  layout: `${process.env.CUSTOMER}Admin`,
+  middleware: 'allowSuperAdminOrAdmin',
+  components: {
+    PageHeader,
+    MembersChanges,
+  },
+
+  async asyncData({ $axios, store }) {
+    try {
+      if (store.getters.isSuperAdminOrAdmin) {
+        await store.dispatch('members/pullData')
+        const response = await $axios.get('/admin/users/getList')
+        return { users: response.data }
+      }
+      return { users: [] }
+    } catch (error) {
+      console.log('Data -> error', error)
+    }
+  },
+
+  data() {
+    return {
+      users: [],
+    }
+  },
+
+  computed: {
+    allMembers() {
+      return this.$store.getters['members/membersFiltered']
+    },
+
+    changes() {
+      const tmp = []
+
+      // cycle members
+      this.allMembers.forEach((member) => {
+        member['changes'] = []
+        let found = null
+
+        // cycle addresses, contacts, summaries
+        // const properties = [
+        //   'addresses',
+        //   'contacts',
+        //   'contributions',
+        //   'summaries',
+        // ]
+
+        // Doesn't work due to a vuex error
+        // properties.forEach((property) => {
+        //   if (member[property].length) {
+        //     member[property].some((item) => {
+        //       if (!item.approved_at) {
+        //         if (!member[property].includes(property)) {
+        //           member[property].push(property)
+        //         }
+        //         found = true
+        //       }
+        //     })
+        //   }
+        // })
+
+        if (member.addresses.length) {
+          member.addresses.some((a) => {
+            if (!a.approved_at) {
+              if (!member['changes'].includes('Addresses')) {
+                member['changes'].push('Addresses')
+              }
+              found = true
+            }
+          })
+        }
+
+        if (member.contacts.length) {
+          member.contacts.some((c) => {
+            if (!c.approved_at) {
+              if (!member['changes'].includes('Contacts')) {
+                member['changes'].push('Contacts')
+              }
+              found = true
+            }
+          })
+        }
+
+        if (member.contributions.length) {
+          member.contributions.some((c) => {
+            if (!c.approved_at) {
+              if (!member['changes'].includes('Contributions')) {
+                member['changes'].push('Contributions')
+              }
+              found = true
+            }
+          })
+        }
+
+        if (member.summaries.length) {
+          member.summaries.some((s) => {
+            if (!s.approved_at) {
+              if (!member['changes'].includes('Werknemers')) {
+                member['changes'].push('Werknemers')
+              }
+              found = true
+            }
+          })
+        }
+
+        if (found) {
+          tmp.push(member)
+        }
+      })
+
+      return tmp
+    },
+  },
+}
+</script>