@ozdao/martyrs 0.2.604 → 0.2.605

package/src/modules/orders/components/pages/Customers.vue

@@ -4,7 +4,7 @@
       v-if="!MOBILE_APP"
       title="Customers"
       :actions="[
-        { method: () => openCreatePopup(), label: 'Create Customer' }
+        { method: () => openCreatePopup(), label: '+ Add Customer' }
       ]"
       class="mn-b-small"
     />
@@ -14,19 +14,10 @@
       title="Statistics"
       class="mn-b-small"
     >
-      <div class="gap-micro flex-nowrap flex">
-        <div class="w-100 bg-white radius-small pd-small">
-          <p class="mn-b-thin">Total</p>
-          <h3>{{totalCustomers}}</h3>
-        </div>
-        <div class="w-100 bg-white radius-small pd-small">
-          <p class="mn-b-thin">Active</p>
-          <h3>{{activeCustomers}}</h3>
-        </div>
-        <div class="w-100 bg-white radius-small pd-small">
-          <p class="mn-b-thin">New This Month</p>
-          <h3>{{newCustomersThisMonth}}</h3>
-        </div>
+      <div class="flex gap-micro mobile:flex-column">
+        <CardStat title="Total" :value="String(totalCustomers)" />
+        <CardStat title="Active" :value="String(activeCustomers)" />
+        <CardStat title="New This Month" :value="String(newCustomersThisMonth)" />
       </div>
     </Block>
 
@@ -64,12 +55,12 @@
     </Feed>
 
     <!-- View Customer Popup -->
-    <Popup 
+    <Popup
       :isPopupOpen="showViewPopup"
       @close-popup="closeViewPopup"
+      :align="isPhone() || isTablet() ? 'bottom center' : 'center right'"
       title="Customer Details"
-      align="center right"
-      class="bg-white h-min-100 w-max-50r pd-medium"
+      class="bg-white h-min-100 w-max-50r pd-medium mobile:h-min-auto mobile:w-100 mobile:radius-zero mobile:radius-tr-medium mobile:radius-tl-medium"
     >
       <CustomerDetails
         v-if="selectedCustomer"
@@ -80,12 +71,12 @@
     </Popup>
 
     <!-- Create/Edit Customer Popup -->
-    <Popup 
+    <Popup
       :isPopupOpen="showFormPopup"
       @close-popup="closeFormPopup"
       :title="isCreateMode ? 'Create Customer' : 'Edit Customer'"
-      align="center right"
-      class="bg-white h-min-100 w-max-50r pd-medium"
+      :align="isPhone() || isTablet() ? 'bottom center' : 'center right'"
+      class="bg-white h-min-100 w-max-50r pd-medium mobile:h-min-auto mobile:w-100 mobile:radius-zero mobile:radius-tr-medium mobile:radius-tl-medium"
     >
       <FormCustomerDetails 
         v-model:customer="formCustomer"
@@ -98,10 +89,11 @@
 </template>
 
 <script setup>
-  import { computed, onMounted, ref } from 'vue';
+  import { computed, onMounted, ref, watch } from 'vue';
   import { useRoute, useRouter } from 'vue-router';
 
   import Block from '@martyrs/src/components/Block/Block.vue';
+  import CardStat from '@martyrs/src/modules/core/views/components/blocks/CardStat.vue';
   import Popup from '@martyrs/src/components/Popup/Popup.vue';
   import customers from '@martyrs/src/modules/orders/store/customers.store.js';
   import SectionPageTitle from '@martyrs/src/modules/core/views/components/sections/SectionPageTitle.vue'
@@ -115,7 +107,7 @@
 
   const route = useRoute();
   const router = useRouter();
-  const { formatDate } = useGlobalMixins();
+  const { formatDate, isPhone, isTablet } = useGlobalMixins();
 
   const statusFilter = ref('all')
 
@@ -223,6 +215,8 @@
         if (data.notes) updateData.notes = data.notes;
         if (data.status) updateData.status = data.status;
         if (data.address) updateData.address = data.address;
+        if (data.socials) updateData.socials = data.socials;
+        if (data.messenger) updateData.messenger = data.messenger;
 
         const updated = await customers.update(updateData);
         customers.updateItem(updated, currentCustomers.value);
@@ -246,7 +240,25 @@
     }
   };
 
+  // Open customer popup from route query (?customerId=...)
+  const openCustomerFromRoute = async () => {
+    const customerId = route.query.customerId
+    if (!customerId) return
+    try {
+      const result = await customers.read({ _id: customerId })
+      if (result && result.length > 0) {
+        openViewPopup(result[0])
+      }
+    } catch (err) {
+      console.error('Error loading customer from route:', err)
+    }
+  }
+
+  watch(() => route.query.customerId, (newId) => {
+    if (newId) openCustomerFromRoute()
+  })
+
   onMounted(async () => {
-   
+    openCustomerFromRoute()
   });
 </script>