feat: VNC, reload store

src/pages/store/list/index.vue

@@ -6,6 +6,7 @@ const { t } = useI18n()
 const headers = computed(() => [
   { title: 'ID', key: 'id_structure' },
   { title: t('Name'), key: 'nom' },
+  { title: t('Migration'), key: 'date_migration' },
   { title: 'Pos', key: 'nbcaisses' },
   { title: 'IP', key: 'ip_master', sortable: false },
   { title: t('Phone'), key: 'telephone', sortable: false },
@@ -17,10 +18,16 @@ const headers = computed(() => [
 const selectedCountry = ref()
 const selectedBrand = ref()
 const selectedNbPos = ref()
-const searchQuery = ref('')
+
+const storesList = ref<any>('')
+const searchQuery = ref<any>('')
 
 // Data table options
-const { data: storesList } = await useApi<any>(createUrl('/stores'))
+const { data: storesListData } = await useApi<any>(createUrl('/stores'))
+const isLoading = ref(false)
+
+storesList.value = storesListData.value
+
 const options = ref({ page: 1, itemsPerPage: 10, sortBy: [''], sortDesc: [false] })
 
 const brand = computed(() => {
@@ -93,6 +100,25 @@ interface Caisse {
   id_caisse: number
   ip: string
 }
+
+const reloadStores = async () => {
+  isLoading.value = true
+
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
+  const { data, error } = await useApi<any>(createUrl('/stores/reload'))
+
+  if (!isEmpty(error.value))
+    console.error('Error loading store data:', error.value)
+
+  // Reload the store data
+  const { data: storeData, error: storeError } = await useApi<any>(createUrl('/stores'))
+  if (!isEmpty(storeError.value))
+    console.error('Error loading store data:', storeError.value)
+  else
+    storesList.value = storeData.value
+
+  isLoading.value = false
+}
 </script>
 
 <template>
@@ -166,9 +192,9 @@ interface Caisse {
           <VBtn
             color="primary"
             prepend-icon="tabler-reload"
-            @click="$router.push('/apps/ecommerce/product/add')"
+            @click="reloadStores"
           >
-            Reload
+            {{ t("Reload") }}
           </VBtn>
         </div>
       </div>
@@ -176,8 +202,15 @@ interface Caisse {
       <VDivider class="mt-4" />
 
       <VCol cols="12">
+        <div v-if="isLoading">
+          <VProgressCircular
+            indeterminate
+            color="primary"
+          />
+        </div>
         <!-- 👉 Datatable  -->
         <VDataTable
+          v-else
           :headers="headers"
           :items="filteredStoresList"
           :items-per-page="options.itemsPerPage"

src/plugins/i18n/locales/ar.json

@@ -20,6 +20,7 @@
   "TYPE": "TYPE",
   "PARENT": "PARENT",
   "LEVEL": "LEVEL",
+  "Migration": "MIGRATION",
   "EFFECTIVE DATE": "EFFECTIVE DATE",
   "EXPIRATION DATE": "EXPIRATION DATE",
   "DATE_CREATE": "CREATE DATE",

src/plugins/i18n/locales/en.json

@@ -20,6 +20,7 @@
   "TYPE": "TYPE",
   "PARENT": "PARENT",
   "LEVEL": "LEVEL",
+  "Migration": "MIGRATION",
   "EFFECTIVE DATE": "EFFECTIVE DATE",
   "EXPIRATION DATE": "EXPIRATION DATE",
   "DATE_CREATE": "CREATE DATE",

src/plugins/i18n/locales/fr.json

@@ -20,6 +20,7 @@
   "TYPE": "TYPE",
   "PARENT": "PARENT",
   "LEVEL": "NIVEAU",
+  "Migration": "MIGRATION",
   "EFFECTIVE DATE": "DATE EFFECTIVE",
   "EXPIRATION DATE": "DATE EXPIRATION",
   "DATE_CREATE": "DATE CREATION",

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

@@ -6,6 +6,8 @@ import logoVNC from '@images/misc/remote_128.png'
 const props = defineProps<Props>()
 const drive = ['M:', 'N:', 'O:', 'P:', 'Q:', 'R:', 'S:', 'T:']
 
+const selectedProtocol = ref('hdpos')
+
 interface Props {
   storeData: StoreData
 }
@@ -22,7 +24,7 @@ onMounted(() => {
 })
 
 const openVnc = (ip: string) => {
-  const url = `vnc://${ip}`
+  const url = `${selectedProtocol.value}://${ip}`
 
   window.open(url, '_blank')
 }
@@ -45,11 +47,19 @@ const mountDrive = (ip: string, drive: string) => {
         flat
         border
       >
-        <VCardText class="text-center">
+        <VCardText>
+          <VCardText class="text-center d-flex align-center justify-left">
             <img
               :src="logoVNC"
               size="128"
             >
+            <AppSelect
+              v-model="selectedProtocol"
+              :items="['hdpos', 'vnc']"
+              class="me-3"
+              style="max-inline-size: 130px"
+            />
+          </VCardText>
           <div v-if="localStoreData && localStoreData.store.caisses">
             <div
               v-for="(caisse, index) in localStoreData.store.caisses"