CaWittMN08/custom_ui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Added tabs to Client detail page.

Browse Source
This commit is contained in:
rocketdebris 2025-11-11 20:41:13 -05:00
parent 254cbf37a1
commit ba507f8e6a
1 changed files with 43 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

45
frontend/src/components/pages/Client.vue
View File

@ -1,8 +1,40 @@
<template>
<div>{{ clientId }}</div>
<div>{{ clientName }}</div>
<Tabs value="0">
<TabList>
<Tab value="0">Overview</Tab>
<Tab value="1">Contact Info</Tab>
<Tab value="2">Project Status</Tab>
<Tab value="3">Accounting</Tab>
<Tab value="4">History</Tab>
</TabList>
<TabPanels>
<TabPanel value="0">
<h1>Overview</h1>
</TabPanel>
<TabPanel value="1">
<h1>Contact Info</h1>
</TabPanel>
<TabPanel value="2">
<h1>Project Status</h1>
</TabPanel>
<TabPanel value="3">
<h1>Accounting</h1>
</TabPanel>
<TabPanel value="4">
<h1>History</h1>
</TabPanel>
</TabPanels>
</Tabs>
</template>
<script setup>
import { onMounted, ref } from "vue";
import Tabs from 'primevue/tabs';
import TabList from 'primevue/tablist';
import Tab from 'primevue/tab';
import TabPanels from 'primevue/tabpanels';
import TabPanel from 'primevue/tabpanel';
const client = ref({});
const { clientName } = defineProps({
clientName: { type: String, required: true },
@ -18,4 +50,13 @@ onMounted(() => {
}
});
</script>
<style lang="css"></style>
<style lang="css">
.tab-bar {
display: flex;
}
.tab-button {
border: black 1px;
border-radius: 5px;
}
</style>