github/directus
1
1
Fork 0
mirror of https://github.com/directus/directus.git synced 2026-04-25 03:00:53 -04:00
Code Issues Packages Projects Releases Wiki Activity

Stores (#417)

Browse Source 
* Fix store identifier

* Add relations store

* Remove rolesStore in favor of composition for user nav

* Fix tests
This commit is contained in:
Rijk van Zanten
2020-04-14 17:33:26 -04:00
committed by GitHub
parent 5e3914de9f
commit 7e2866373d
12 changed files with 103 additions and 47 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
src/modules/users/components/navigation/navigation.vue
View File

@@ -5,7 +5,13 @@
<v-list-item-content>{{ $t('all_users') }}</v-list-item-content>
</v-list-item>
<v-divider />
<v-divider v-if="(roles && roles.length > 0) || loading" />
<template v-if="loading">
<v-list-item v-for="n in 4" :key="n">
<v-skeleton-loader type="list-item-icon" />
</v-list-item>
</template>
<v-list-item v-for="{ name, id } in roles" :key="id" :to="`/${project}/users/${id}`">
<v-list-item-icon><v-icon name="people" /></v-list-item-icon>
@@ -16,15 +22,15 @@
<script lang="ts">
import { defineComponent } from '@vue/composition-api';
import useRolesStore from '@/stores/roles';
import useProjectsStore from '@/stores/projects';
import useNavigation from '../../compositions/use-navigation';
export default defineComponent({
setup() {
const rolesStore = useRolesStore();
const projectsStore = useProjectsStore();
const { roles, loading } = useNavigation();
return { roles: rolesStore.state.roles, project: projectsStore.state.currentProjectKey };
return { roles, loading, project: projectsStore.state.currentProjectKey };
},
});
</script>

34
src/modules/users/compositions/use-navigation.ts Normal file
View File

@@ -0,0 +1,34 @@
import { ref, Ref } from '@vue/composition-api';
import useProjectsStore from '@/stores/projects';
import api from '@/api';
import { Role } from '@/stores/user/types';
let roles: Ref<Role[] | null> | null = null;
let loading: Ref<boolean> | null = null;
export default function useNavigation() {
if (roles === null) {
roles = ref<Role[]>(null);
}
if (loading === null) {
loading = ref(false);
}
if (roles.value === null && loading?.value === false) {
fetchRoles();
}
return { roles, loading };
async function fetchRoles() {
if (!loading || !roles) return;
loading.value = true;
const projectsStore = useProjectsStore();
const currentProjectKey = projectsStore.state.currentProjectKey;
const rolesResponse = await api.get(`/${currentProjectKey}/roles`);
roles.value = rolesResponse.data.data;
loading.value = false;
}
}