adalal/solidtime
1
0
Fork 0
mirror of https://github.com/solidtime-io/solidtime.git synced 2026-08-16 12:12:15 +01:00
Code Issues Packages Projects Releases Wiki Activity

add responsive tables and time/client/member/tags index page

Browse Source
This commit is contained in:
Gregor Vostrak
2024-04-13 03:19:22 +02:00
parent 335a057ba1
commit 38535142b2
31 changed files with 83 additions and 95 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
resources/js/Pages/Clients.vue
View File

@@ -10,6 +10,7 @@ import { onMounted, ref } from 'vue';
import { useClientsStore } from '@/utils/useClients';
import ClientTable from '@/Components/Common/Client/ClientTable.vue';
import ClientCreateModal from '@/Components/Common/Client/ClientCreateModal.vue';
import PageTitle from '@/Components/Common/PageTitle.vue';
onMounted(() => {
useClientsStore().fetchClients();
@@ -23,12 +24,7 @@ const createClient = ref(false);
<MainContainer
class="py-5 border-b border-default-background-separator flex justify-between items-center">
<div class="flex items-center space-x-6">
<h3
class="text-white font-bold text-base flex items-center space-x-2.5">
<UserCircleIcon
class="w-6 text-icon-default"></UserCircleIcon>
<span> Clients </span>
</h3>
<PageTitle :icon="UserCircleIcon" title="Clients"> </PageTitle>
<TabBar>
<TabBarItem>All</TabBarItem>
<TabBarItem active>Active</TabBarItem>

4
resources/js/Pages/Dashboard.vue
View File

@@ -50,11 +50,11 @@ const props = defineProps<{
<template>
<AppLayout title="Dashboard" data-testid="dashboard_view">
<MainContainer
class="pt-8 pb-6 border-b border-default-background-separator">
class="pt-5 sm:pt-8 pb-4 sm:pb-6 border-b border-default-background-separator">
<TimeTracker></TimeTracker>
</MainContainer>
<MainContainer
class="grid gap-6 grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 pt-5 pb-6 border-b border-default-background-separator items-stretch">
class="grid gap-5 sm:gap-6 grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 pt-3 sm:pt-5 pb-4 sm:pb-6 border-b border-default-background-separator items-stretch">
<RecentlyTrackedTasksCard
:latestTasks="props.latestTasks"></RecentlyTrackedTasksCard>
<LastSevenDaysCard

2
resources/js/Pages/MainContainer.vue
View File

@@ -1,7 +1,7 @@
<script setup lang="ts"></script>
<template>
<div class="px-4 sm:px-6 lg:px-8 3xl:px-12 mx-auto">
<div class="px-3 sm:px-6 lg:px-8 3xl:px-12 mx-auto">
<slot></slot>
</div>
</template>

10
resources/js/Pages/Members.vue
View File

@@ -10,6 +10,7 @@ import { ref } from 'vue';
import MemberTable from '@/Components/Common/Member/MemberTable.vue';
import MemberInviteModal from '@/Components/Common/Member/MemberInviteModal.vue';
import type { Role } from '@/types/jetstream';
import PageTitle from '@/Components/Common/PageTitle.vue';
const inviteMember = ref(false);
@@ -22,13 +23,8 @@ defineProps<{
<AppLayout title="Members" data-testid="members_view">
<MainContainer
class="py-5 border-b border-default-background-separator flex justify-between items-center">
<div class="flex items-center space-x-6">
<h3
class="text-white font-bold text-base flex items-center space-x-2.5">
<UserGroupIcon
class="w-6 text-icon-default"></UserGroupIcon>
<span> Members </span>
</h3>
<div class="flex items-center space-x-4 sm:space-x-6">
<PageTitle :icon="UserGroupIcon" title="Members"> </PageTitle>
<TabBar>
<TabBarItem active>All</TabBarItem>
<TabBarItem>Active</TabBarItem>

11
resources/js/Pages/Projects.vue
View File

@@ -9,6 +9,7 @@ import ProjectTable from '@/Components/Common/Project/ProjectTable.vue';
import { onMounted, ref } from 'vue';
import { useProjectsStore } from '@/utils/useProjects';
import ProjectCreateModal from '@/Components/Common/Project/ProjectCreateModal.vue';
import PageTitle from '@/Components/Common/PageTitle.vue';
onMounted(() => {
useProjectsStore().fetchProjects();
@@ -20,13 +21,9 @@ const createProject = ref(false);
<template>
<AppLayout title="Projects" data-testid="projects_view">
<MainContainer
class="py-5 border-b border-default-background-separator flex justify-between items-center">
<div class="flex items-center space-x-6">
<h3
class="text-white font-bold text-base flex items-center space-x-2.5">
<FolderIcon class="w-6 text-icon-default"></FolderIcon>
<span> Projects </span>
</h3>
class="py-3 sm:py-5 border-b border-default-background-separator flex justify-between items-center">
<div class="flex items-center space-x-3 sm:space-x-6">
<PageTitle :icon="FolderIcon" title="Projects"> </PageTitle>
<TabBar>
<TabBarItem>All</TabBarItem>
<TabBarItem active>Active</TabBarItem>

7
resources/js/Pages/Tags.vue
View File

@@ -6,6 +6,7 @@ import SecondaryButton from '@/Components/SecondaryButton.vue';
import { ref } from 'vue';
import TagTable from '@/Components/Common/Tag/TagTable.vue';
import TagCreateModal from '@/Components/Common/Tag/TagCreateModal.vue';
import PageTitle from '@/Components/Common/PageTitle.vue';
const createTag = ref(false);
</script>
@@ -15,11 +16,7 @@ const createTag = ref(false);
<MainContainer
class="py-5 border-b border-default-background-separator flex justify-between items-center">
<div class="flex items-center space-x-6">
<h3
class="text-white font-bold text-base flex items-center space-x-2.5">
<FolderIcon class="w-6 text-icon-default"></FolderIcon>
<span> Tags </span>
</h3>
<PageTitle :icon="FolderIcon" title="Tags"> </PageTitle>
</div>
<SecondaryButton :icon="PlusIcon" @click="createTag = true"
>Create Tag</SecondaryButton

2
resources/js/Pages/Time.vue
View File

@@ -49,7 +49,7 @@ const groupedTimeEntries = computed(() => {
<template>
<AppLayout title="Dashboard" data-testid="time_view">
<MainContainer
class="py-8 border-b border-default-background-separator">
class="py-4 sm:py-8 border-b border-default-background-separator">
<TimeTracker></TimeTracker>
</MainContainer>
<div v-for="(value, key) in groupedTimeEntries" :key="key">