feat: add new status columns

pages/dashboard/interest-list.vue

@@ -125,13 +125,6 @@
                   </div>
                 </div>
               </td>
-              <td>
-                <div v-if="item['Yacht Name']" class="d-flex align-center">
-                  <v-icon size="small" class="mr-2" color="blue-darken-2">mdi-sail-boat</v-icon>
-                  <span>{{ item["Yacht Name"] }}</span>
-                </div>
-                <span v-else class="text-grey-darken-1">—</span>
-              </td>
               <td>
                 <v-chip
                   v-if="item['Berth Number']"
@@ -149,10 +142,38 @@
                 />
               </td>
               <td>
-                <div v-if="item['Phone Number']" class="d-flex align-center">
-                  <v-icon size="small" class="mr-2" color="green-darken-2">mdi-phone</v-icon>
-                  <span>{{ item["Phone Number"] }}</span>
-                </div>
+                <EOIStatusBadge
+                  v-if="item['EOI Status']"
+                  :eoiStatus="item['EOI Status']"
+                />
+                <span v-else class="text-grey-darken-1">—</span>
+              </td>
+              <td>
+                <BerthInfoSentStatusBadge
+                  v-if="item['Berth Info Sent Status']"
+                  :berthInfoSentStatus="item['Berth Info Sent Status']"
+                />
+                <span v-else class="text-grey-darken-1">—</span>
+              </td>
+              <td>
+                <ContractSentStatusBadge
+                  v-if="item['Contract Sent Status']"
+                  :contractSentStatus="item['Contract Sent Status']"
+                />
+                <span v-else class="text-grey-darken-1">—</span>
+              </td>
+              <td>
+                <Deposit10PercentStatusBadge
+                  v-if="item['Deposit 10% Status']"
+                  :deposit10PercentStatus="item['Deposit 10% Status']"
+                />
+                <span v-else class="text-grey-darken-1">—</span>
+              </td>
+              <td>
+                <ContractStatusBadge
+                  v-if="item['Contract Status']"
+                  :contractStatus="item['Contract Status']"
+                />
                 <span v-else class="text-grey-darken-1">—</span>
               </td>
               <td><LeadCategoryBadge :leadCategory="item['Lead Category']" /></td>
@@ -177,7 +198,7 @@
                   </template>
                   <span>{{ item["Extra Comments"] }}</span>
                 </v-tooltip>
-                <span v-else class="text-grey-darken-1">—</span>
+                <span v-else class="text-grey-darken-1"></span>
               </td>
             </tr>
           </template>
@@ -207,6 +228,11 @@ import LeadCategoryBadge from "~/components/LeadCategoryBadge.vue";
 import InterestSalesBadge from "~/components/InterestSalesBadge.vue";
 import InterestDetailsModal from "~/components/InterestDetailsModal.vue";
 import CreateInterestModal from "~/components/CreateInterestModal.vue";
+import EOIStatusBadge from "~/components/EOIStatusBadge.vue";
+import BerthInfoSentStatusBadge from "~/components/BerthInfoSentStatusBadge.vue";
+import ContractSentStatusBadge from "~/components/ContractSentStatusBadge.vue";
+import Deposit10PercentStatusBadge from "~/components/Deposit10PercentStatusBadge.vue";
+import ContractStatusBadge from "~/components/ContractStatusBadge.vue";
 import { useFetch } from "#app";
 import { ref, computed } from "vue";
 import type { Interest } from "@/utils/types";
@@ -258,14 +284,17 @@ const handleInterestCreated = async (interest: Interest) => {
 };
 
 const headers = [
-  { title: "Contact", key: "Full Name", sortable: true, width: "25%" },
-  { title: "Yacht", key: "Yacht Name", sortable: true },
+  { title: "Contact", key: "Full Name", sortable: true, width: "20%" },
   { title: "Berth", key: "Berth Number", sortable: true },
-  { title: "Status", key: "Sales Process Level", sortable: true },
-  { title: "Phone", key: "Phone Number", sortable: false },
+  { title: "Sales Status", key: "Sales Process Level", sortable: true },
+  { title: "EOI Status", key: "EOI Status", sortable: true },
+  { title: "Berth Info", key: "Berth Info Sent Status", sortable: true },
+  { title: "Contract Sent", key: "Contract Sent Status", sortable: true },
+  { title: "Deposit 10%", key: "Deposit 10% Status", sortable: true },
+  { title: "Contract", key: "Contract Status", sortable: true },
   { title: "Category", key: "Lead Category", sortable: true },
   { title: "Created", key: "Created At", sortable: true },
-  { title: "Notes", key: "Extra Comments", sortable: false },
+  { title: "", key: "Extra Comments", sortable: false },
 ];
 
 const formatDate = (dateString: string) => {

pages/dashboard/interest-status.vue

@@ -297,7 +297,7 @@ const getColumnIcon = (level: string) => {
     'General Qualified Interest': 'mdi-account-search',
     'Specific Qualified Interest': 'mdi-account-check',
     'LOI and NDA Sent': 'mdi-email-send',
-    'Signed LOI and NDA': 'mdi-file-sign',
+    'Signed LOI and NDA': 'mdi-file-check',
     'Made Reservation': 'mdi-calendar-check',
     'Contract Negotiation': 'mdi-handshake',
     'Contract Negotiations Finalized': 'mdi-file-document-check',
@@ -406,7 +406,7 @@ const handleDrop = async (event: DragEvent, targetLevel: string) => {
     const response = await $fetch('/api/update-interest', {
       method: 'POST',
       headers: {
-        'x-tag': user.value?.email ? "094ut234" : "pjnvü1230"
+        'x-tag': user.value?.email ? "094ut234" : "pjnvü1230",
       },
       body: {
         id: interestId,