changes UI

resources/js/Components/PersonInfo/PersonInfoGrid.vue

@@ -2,6 +2,8 @@
 import { ref, computed } from "vue";
 import { router } from "@inertiajs/vue3";
 import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/Components/ui/tabs";
+import { Button } from "@/Components/ui/button";
+import { PlusIcon } from "@/Utilities/Icons";
 import PersonUpdateForm from "./PersonUpdateForm.vue";
 import AddressCreateForm from "./AddressCreateForm.vue";
 import AddressUpdateForm from "./AddressUpdateForm.vue";
@@ -20,7 +22,6 @@ import PersonInfoPhonesTab from "./PersonInfoPhonesTab.vue";
 import PersonInfoEmailsTab from "./PersonInfoEmailsTab.vue";
 import PersonInfoTrrTab from "./PersonInfoTrrTab.vue";
 import PersonInfoSmsDialog from "./PersonInfoSmsDialog.vue";
-import Separator from "../ui/separator/Separator.vue";
 
 const props = defineProps({
   person: Object,
@@ -95,8 +96,12 @@ const openDrawerAddAddress = (edit = false, id = 0) => {
 
 const closeDrawerAddAddress = () => {
   drawerAddAddress.value = false;
+  const wasEdit = editAddress.value;
   editAddress.value = false;
   editAddressId.value = 0;
+  if (!wasEdit) {
+    switchToTab('addresses');
+  }
 };
 
 // Phone handlers
@@ -111,8 +116,12 @@ const operDrawerAddPhone = openDrawerAddPhone;
 
 const closeDrawerAddPhone = () => {
   drawerAddPhone.value = false;
+  const wasEdit = editPhone.value;
   editPhone.value = false;
   editPhoneId.value = 0;
+  if (!wasEdit) {
+    switchToTab('phones');
+  }
 };
 
 // Email handlers
@@ -122,6 +131,16 @@ const openDrawerAddEmail = (edit = false, id = 0) => {
   editEmailId.value = id;
 };
 
+const closeDrawerAddEmail = () => {
+  drawerAddEmail.value = false;
+  const wasEdit = editEmail.value;
+  editEmail.value = false;
+  editEmailId.value = 0;
+  if (!wasEdit) {
+    switchToTab('emails');
+  }
+};
+
 // TRR handlers
 const openDrawerAddTrr = (edit = false, id = 0) => {
   drawerAddTrr.value = true;
@@ -129,6 +148,16 @@ const openDrawerAddTrr = (edit = false, id = 0) => {
   editTrrId.value = id;
 };
 
+const closeDrawerAddTrr = () => {
+  drawerAddTrr.value = false;
+  const wasEdit = editTrr.value;
+  editTrr.value = false;
+  editTrrId.value = 0;
+  if (!wasEdit) {
+    switchToTab('trr');
+  }
+};
+
 // Confirm dialog handlers
 const openConfirm = (type, id, label = "") => {
   confirm.value = {
@@ -258,10 +287,16 @@ const trrsCount = computed(() => {
 const formatBadgeCount = (count) => {
   return count >= 999 ? '999+' : String(count);
 };
+
+// Tab switching
+const activeTab = ref('person');
+const switchToTab = (tab) => {
+  activeTab.value = tab;
+};
 </script>
 
 <template>
-  <Tabs default-value="person" class="mt-2">
+  <Tabs v-model="activeTab" class="mt-2">
     <TabsList class="flex w-full bg-white gap-2 p-1">
       <TabsTrigger value="person" class="border border-gray-200 data-[state=active]:bg-primary-50 data-[state=active]:text-primary-700 flex-1 py-2">Oseba</TabsTrigger>
       <TabsTrigger value="addresses" class="border border-gray-200 data-[state=active]:bg-primary-50 data-[state=active]:text-primary-700 flex-1 py-2 px-3">
@@ -403,14 +438,14 @@ const formatBadgeCount = (count) => {
   <!-- Email Dialogs -->
   <EmailCreateForm
     :show="drawerAddEmail && !editEmail"
-    @close="drawerAddEmail = false"
+    @close="closeDrawerAddEmail"
     :person="person"
     :types="types.email_types ?? []"
     :is-client-context="!!person?.client"
   />
   <EmailUpdateForm
     :show="drawerAddEmail && editEmail"
-    @close="drawerAddEmail = false"
+    @close="closeDrawerAddEmail"
     :person="person"
     :types="types.email_types ?? []"
     :id="editEmailId"
@@ -420,7 +455,7 @@ const formatBadgeCount = (count) => {
   <!-- TRR Dialogs -->
   <TrrCreateForm
     :show="drawerAddTrr && !editTrr"
-    @close="drawerAddTrr = false"
+    @close="closeDrawerAddTrr"
     :person="person"
     :types="types.trr_types ?? []"
     :banks="types.banks ?? []"
@@ -428,7 +463,7 @@ const formatBadgeCount = (count) => {
   />
   <TrrUpdateForm
     :show="drawerAddTrr && editTrr"
-    @close="drawerAddTrr = false"
+    @close="closeDrawerAddTrr"
     :person="person"
     :types="types.trr_types ?? []"
     :banks="types.banks ?? []"