refactor: storeDetail adjust Pos loop

src/models/storeData.ts

@@ -5,9 +5,11 @@ interface Store {
   telephone: string
   photoLink: string
   enseigne: string
-  nb_caisses: number
+  nbcaisses: number
+  pays: string
   adresse: string
   caisses: Caisse[]
+  date_migration: string
 }
 
 interface Caisse {
@@ -15,6 +17,21 @@ interface Caisse {
   ip: string
 }
 
+interface storePos {
+  workstationId: number
+  ip: string
+  version: string
+  businessDate: Date
+  businessDateS: string
+  openingDate: string
+  closingDate: string
+  boTransaction: Transaction
+  replication: Replication
+  saleTransaction: xStoreTransaction
+  primaryRegister: boolean
+  fatalError: boolean
+}
+
 interface Replication {
   pendingReplications: number
   minPendingReplicationDate: string
@@ -25,10 +42,9 @@ interface Transaction {
   backOfficeTransactions: number
   minBackOfficeTransactionDate: string
   maxBackOfficeTransactionDate: string
-  backOfficeBusinessDate: string
 }
 
-interface XstoreTransaction {
+interface xStoreTransaction {
   count: number
   minDate: string
   minDateT: string
@@ -40,12 +56,5 @@ interface XstoreTransaction {
 
 export interface StoreData {
   store: Store
-  replication: Replication
-  transaction: Transaction
-  openingTransaction: XstoreTransaction
-  closingTransaction: XstoreTransaction
-  saleTransaction: XstoreTransaction
-  xstoreVersion: string
-  xstoreVersionDate: string
-  xstoreVersionCustomer: string
+  pos: storePos[]
 }

src/views/pages/store/view/StoreHeader.vue

@@ -28,9 +28,20 @@ const props = defineProps<Props>()
       </div>
 
       <div class="user-profile-info w-100 mt-16 pt-6 pt-sm-0 mt-sm-0">
-        <h5 class="text-h5 text-center text-sm-start font-weight-medium mb-3">
+        <div class="d-flex align-center justify-center justify-sm-space-between flex-wrap gap-4 mb-3">
+          <div class="d-flex flex-wrap justify-center justify-sm-start flex-grow-1 gap-4">
+            <span class="d-flex">
+              <span class="text-h5">
                 {{ props.storeData.store.id_structure }} - {{ props.storeData.store.nom }}
-        </h5>
+              </span>
+            </span>
+          </div>
+          <div class="d-flex align-center gap-4">
+            <div class="d-flex flex-column">
+              <span class="text-h6 font-weight-medium">{{ props.storeData.store.date_migration }}</span>
+            </div>
+          </div>
+        </div>
 
         <div class="d-flex align-center justify-center justify-sm-space-between flex-wrap gap-4">
           <div class="d-flex flex-wrap justify-center justify-sm-start flex-grow-1 gap-4">
@@ -63,7 +74,7 @@ const props = defineProps<Props>()
                 class="me-1"
               />
               <span class="text-body-1">
-                {{ props.storeData.store.adresse }}
+                {{ props.storeData.store.adresse }} - ({{ props.storeData.store.pays }})
               </span>
             </span>
           </div>
@@ -74,13 +85,13 @@ const props = defineProps<Props>()
               variant="tonal"
               size="42"
             >
-              <VIcon icon="tabler-git-merge" />
+              <VIcon icon="tabler-http-post" />
             </VAvatar>
 
             <div class="d-flex flex-column">
-              <span class="text-h5 font-weight-medium">{{ props.storeData.xstoreVersion }} ({{ props.storeData.xstoreVersionCustomer }})</span>
+              <span class="text-h5 font-weight-medium">{{ props.storeData.store.nbcaisses }}</span>
               <span class="text-sm">
-                {{ props.storeData.xstoreVersionDate }}
+                Caisses
               </span>
             </div>
           </div>

src/views/pages/store/view/StoreTabGeneral.vue

@@ -5,11 +5,48 @@ interface Props {
   storeData: StoreData
 }
 
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
 const props = defineProps<Props>()
 </script>
 
 <template>
-  <VRow class="py-6">
+  <div
+    v-for="(pos, index) in storeData.pos"
+    :key="index"
+  >
+    <VChip
+      label
+      size="small"
+      class="text-capitalize me-1"
+    >
+      Pos {{ pos.workstationId }}
+    </VChip>
+    <VChip
+      label
+      size="small"
+      class="text-capitalize"
+    >
+      {{ pos.ip }}
+    </VChip>
+    /
+    <VChip
+      label
+      size="small"
+      class="text-capitalize me-3"
+      color="primary"
+    >
+      {{ pos.primaryRegister ? 'Primary' : 'Slave' }}
+    </VChip>
+    <VChip
+      v-if="pos.fatalError"
+      label
+      size="small"
+      class="text-capitalize"
+      color="error"
+    >
+      Fatal
+    </VChip>
+    <VRow class="py-3 mb-1">
       <!-- 👉 Business date & opening hours -->
       <VCol
         cols="12"
@@ -35,7 +72,7 @@ const props = defineProps<Props>()
                 <div>
                   <span class="text-base">Business date</span>
                   <h4 class="text-h4 font-weight-medium text-primary">
-                  {{ storeData.openingTransaction.maxDateT }}
+                    {{ pos.businessDateS }}
                   </h4>
                 </div>
               </div>
@@ -55,8 +92,8 @@ const props = defineProps<Props>()
                 </VAvatar>
                 <div>
                   <span class="text-base">Opening hours</span>
-                <h4 class="text-h4 font-weight-medium text-info">
-                  {{ storeData.openingTransaction.maxDateH }}{{ storeData.closingTransaction.maxDateH ? ` / ${storeData.closingTransaction.maxDateH}` : '' }}
+                  <h4 class="text-h6 font-weight-medium text-info">
+                    {{ pos.openingDate }}{{ pos.closingDate ? ` ${pos.closingDate}` : '' }}
                   </h4>
                 </div>
               </div>
@@ -77,7 +114,7 @@ const props = defineProps<Props>()
               Pending replication
             </h5>
             <div class="text-h3 mb-2">
-            {{ props.storeData.replication.pendingReplications }}
+              {{ pos.replication.pendingReplications }}
             </div>
             <span class="mb-1">
               <div>
@@ -88,7 +125,7 @@ const props = defineProps<Props>()
                 >
                   Min
                 </VChip>
-              {{ props.storeData.replication.minPendingReplicationDate }}
+                {{ pos.replication.minPendingReplicationDate }}
               </div>
             </span>
             <span class="mb-1">
@@ -100,7 +137,7 @@ const props = defineProps<Props>()
                 >
                   Max
                 </VChip>
-              {{ props.storeData.replication.maxPendingReplicationDate }}
+                {{ pos.replication.maxPendingReplicationDate }}
               </div>
             </span>
           </div>
@@ -119,7 +156,7 @@ const props = defineProps<Props>()
               XSTORE Tickets
             </h5>
             <div class="text-h3 mb-2">
-            {{ props.storeData.saleTransaction.count }}
+              {{ pos.saleTransaction.count }}
             </div>
             <span class="mb-1">
               <div>
@@ -130,7 +167,7 @@ const props = defineProps<Props>()
                 >
                   Min
                 </VChip>
-              {{ props.storeData.saleTransaction.minDate }}
+                {{ pos.saleTransaction.minDate }}
               </div>
             </span>
             <span class="mb-1">
@@ -142,7 +179,7 @@ const props = defineProps<Props>()
                 >
                   Max
                 </VChip>
-              {{ props.storeData.saleTransaction.maxDate }}
+                {{ pos.saleTransaction.maxDate }}
               </div>
             </span>
           </div>
@@ -160,7 +197,7 @@ const props = defineProps<Props>()
               DOTSOFT Tickets
             </h5>
             <div class="text-h3 mb-2">
-            {{ props.storeData.transaction.backOfficeTransactions }}
+              {{ pos.boTransaction.backOfficeTransactions }}
             </div>
             <span class="mb-1">
               <div>
@@ -171,7 +208,7 @@ const props = defineProps<Props>()
                 >
                   Min
                 </VChip>
-              {{ props.storeData.transaction.minBackOfficeTransactionDate }}
+                {{ pos.boTransaction.minBackOfficeTransactionDate }}
               </div>
             </span>
             <span class="mb-1">
@@ -183,11 +220,12 @@ const props = defineProps<Props>()
                 >
                   Max
                 </VChip>
-              {{ props.storeData.transaction.maxBackOfficeTransactionDate }}
+                {{ pos.boTransaction.maxBackOfficeTransactionDate }}
               </div>
             </span>
           </div>
         </div>
       </VCol>
     </VRow>
+  </div>
 </template>