studio-variable/designtopack
3
0
Fork 0
Code Issues 7 Pull requests Projects Releases Packages Wiki Activity Actions

add isProjectLoadingState

Browse source
This commit is contained in:
isUnknown 2025-02-05 11:52:54 +01:00
parent 7ce5878898
commit fd9db75f2a
2 changed files with 30 additions and 27 deletions
Download patch file Download diff file Expand all files Collapse all files

34
src/components/Projects.vue
View file

@ -10,6 +10,7 @@
tabindex="0"
:aria-label="tabs[0].label"
class="flow"
:class="{ loading: isProjectsLoading }"
>
<Project
v-for="project in currentProjects"
@ -24,7 +25,7 @@
tabindex="0"
:aria-label="tabs[1].label"
class="flow"
>
>
<Project
v-for="project in archivedProjects"
:key="project.id"
@ -33,30 +34,29 @@
</section>
</template>
<script setup>
import Tabs from "./Tabs.vue";
import Project from "./project/Project.vue";
import { useProjectsStore } from "../stores/projects";
import { ref, computed } from "vue";
import { storeToRefs } from "pinia";
import Tabs from './Tabs.vue';
import Project from './project/Project.vue';
import { useProjectsStore } from '../stores/projects';
import { ref, computed } from 'vue';
import { storeToRefs } from 'pinia';
const { projects, currentProjects, archivedProjects } = storeToRefs(
useProjectsStore()
);
const { projects, currentProjects, archivedProjects, isProjectsLoading } =
storeToRefs(useProjectsStore());
const currentTab = ref("currentProjects");
const currentTab = ref('currentProjects');
const tabs = computed(() => {
return [
{
label: "Projets en cours",
id: "currentProjects",
label: 'Projets en cours',
id: 'currentProjects',
count: currentProjects.value.length,
isActive: currentTab.value === "currentProjects",
isActive: currentTab.value === 'currentProjects',
},
{
label: "Projets archivés",
id: "archivedProjects",
label: 'Projets archivés',
id: 'archivedProjects',
count: archivedProjects.value.length,
isActive: currentTab.value === "archivedProjects",
isActive: currentTab.value === 'archivedProjects',
},
];
});
@ -72,7 +72,7 @@ section {
min-height: calc(100vh - 8.5rem);
}
section:empty::after {
content: "Aucun projet pour le moment.";
content: 'Aucun projet pour le moment.';
position: absolute;
inset: 0;
display: grid;