WIP MMCM

2022-11-16 13:47:07 +01:00
parent d2ce01c5e8
commit 75824fb589
6 changed files with 59 additions and 18 deletions
--- a/package-lock.json
+++ b/package-lock.json
@@ -17,6 +17,7 @@
        "vue-router": "^4.1.5"
      },
      "devDependencies": {
+        "@iconify/vue": "^4.0.0",
        "@vitejs/plugin-vue": "^3.1.0",
        "autoprefixer": "^10.4.12",
        "postcss": "^8.4.16",
@@ -80,6 +81,27 @@
        "node": ">=6"
      }
    },
+    "node_modules/@iconify/types": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/@iconify/types/-/types-2.0.0.tgz",
+      "integrity": "sha512-+wluvCrRhXrhyOmRDJ3q8mux9JkKy5SJ/v8ol2tu4FVjyYvtEzkc/3pK15ET6RKg4b4w4BmTk1+gsCUhf21Ykg==",
+      "dev": true
+    },
+    "node_modules/@iconify/vue": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/@iconify/vue/-/vue-4.0.0.tgz",
+      "integrity": "sha512-73z81Yf2HISfehu3qvN9GqL1OnUO7wEMKkiFwVGJ2pqAdGCR8FrVylhRhka+6U+gFLlng0ynnT20svk3jJYwow==",
+      "dev": true,
+      "dependencies": {
+        "@iconify/types": "^2.0.0"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/cyberalien"
+      },
+      "peerDependencies": {
+        "vue": ">=3"
+      }
+    },
    "node_modules/@nodelib/fs.scandir": {
      "version": "2.1.5",
      "resolved": "https://registry.npmjs.org/@nodelib/fs.scandir/-/fs.scandir-2.1.5.tgz",
@@ -1743,6 +1765,21 @@
      "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-free/-/fontawesome-free-6.2.0.tgz",
      "integrity": "sha512-CNR7qRIfCwWHNN7FnKUniva94edPdyQzil/zCwk3v6k4R6rR2Fr8i4s3PM7n/lyfPA6Zfko9z5WDzFxG9SW1uQ=="
    },
+    "@iconify/types": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/@iconify/types/-/types-2.0.0.tgz",
+      "integrity": "sha512-+wluvCrRhXrhyOmRDJ3q8mux9JkKy5SJ/v8ol2tu4FVjyYvtEzkc/3pK15ET6RKg4b4w4BmTk1+gsCUhf21Ykg==",
+      "dev": true
+    },
+    "@iconify/vue": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/@iconify/vue/-/vue-4.0.0.tgz",
+      "integrity": "sha512-73z81Yf2HISfehu3qvN9GqL1OnUO7wEMKkiFwVGJ2pqAdGCR8FrVylhRhka+6U+gFLlng0ynnT20svk3jJYwow==",
+      "dev": true,
+      "requires": {
+        "@iconify/types": "^2.0.0"
+      }
+    },
    "@nodelib/fs.scandir": {
      "version": "2.1.5",
      "resolved": "https://registry.npmjs.org/@nodelib/fs.scandir/-/fs.scandir-2.1.5.tgz",
--- a/package.json
+++ b/package.json
@@ -18,6 +18,7 @@
    "vue-router": "^4.1.5"
  },
  "devDependencies": {
+    "@iconify/vue": "^4.0.0",
    "@vitejs/plugin-vue": "^3.1.0",
    "autoprefixer": "^10.4.12",
    "postcss": "^8.4.16",
--- a/src/main.js
+++ b/src/main.js
@@ -7,6 +7,8 @@ import brands from '@fortawesome/fontawesome-free/css/brands.css'
 import solid from '@fortawesome/fontawesome-free/css/solid.css'
 import regular from '@fortawesome/fontawesome-free/css/regular.css'

+import { Icon } from '@iconify/vue';
+

 import App from './App.vue'
 import router from "./router/index"
@@ -21,4 +23,5 @@ const app = createApp(App)
 app.use(router);
 app.use(pinia)
 app.component('Datepicker', Datepicker);
+app.component('Icon', Icon);
 app.mount("#app");
--- a/src/views/address-check.vue
+++ b/src/views/address-check.vue
@@ -2,15 +2,14 @@
  <div style="min-height: 350px">
    <div class="step_title">Indiquez votre adresse de livraison :</div>

-    <div class="alert alert-danger" role="alert" v-if="noOfferFound">
+    <div class="alert alert-warning" role="alert" v-if="alertBox === 1">
      Nous sommes désolé mais votre adresse est trop eloignée de la pharmacie pour bénéficier de ce service<br/>
      Nous vous invitions à utiliser le service de La Poste pour trouver une pharmacie proche de chez vous :
      <a href="https://www.mesmedicamentschezmoi.com" target="_blank">Accéder à mesmedicamentschezmoi.com</a>
-
    </div>

-    <div class="alert alert-danger" role="alert" v-if="!geolocation">
-      Nous sommes désolé nous ne parvenons pas à géolocaliser l'adresse saisie<br/>
+    <div class="alert alert-danger" role="alert" v-if="alertBox === 2">
+      <i class="fa-solid fa-circle-exclamation"></i> Nous sommes désolé nous ne parvenons pas à géolocaliser l'adresse saisie<br/>
    </div>

    <div class="input-group mb-3">
@@ -77,14 +76,14 @@ import {add, format} from "date-fns";
 export default {
  setup() {
    const store = useMMCMStore()
-    const noOfferFound = ref(false)
+    const alertBox = ref(0)

    const query = ref(store.fullAddress !== null ? store.fullAddress : import.meta.env.DEV ? "9 Impasse des Peupliers 13008 Marseill" : '')

    return {
      query,
      store,
-      noOfferFound
+      alertBox
    }
  },
  name: "address-check",
@@ -93,7 +92,6 @@ export default {
      searchResults: [],
      isSearching: false,
      isChecking: false,
-      geolocation: true,
      addressBook: [],
      isConnected: null,
      currentBtSearch: null
@@ -142,7 +140,8 @@ export default {
      if (import.meta.env.DEV) {
        console.log(urlApi)
      }
-      let productList = await fetch(urlApi)
+
+      let apiResult = await fetch(urlApi)
          .then(response => {
            if (response.ok) {
              return response.json();
@@ -152,15 +151,13 @@ export default {

      this.isChecking = false

-      if (productList.hasOwnProperty('data') && productList.data.result === 'KO') {
-        this.geolocation = false
-        this.noOfferFound = false
-      } else if (productList.length > 0) {
-        this.store.setProductList(productList);
+      if (apiResult.hasOwnProperty('address_state') && apiResult.address_state === false) {
+        this.alertBox = 2
+      } else if (apiResult.service_list.length > 0) {
+        this.store.setProductList(apiResult.service_list);
        this.$router.push({path: '/delivery-option-step-1'});
      } else {
-        this.noOfferFound = true
-        this.geolocation = true
+        this.alertBox = 1
      }

    }
--- a/src/views/delivery-option-step-2.vue
+++ b/src/views/delivery-option-step-2.vue
@@ -8,8 +8,11 @@
  <div v-else class="d-flex flex-lg-row flex-column align-items-stretch">
    <FlexCard v-for="(product, i) in store.productList" :card="product">

-      <template v-slot:card-image><img :alt="product.name" :src="product.media_list[0].filename" class="me-2"
-                                       height="50"/></template>
+      <template v-slot:card-image>
+
+        <img v-if="product.media_list.filter(m=>m.use==='icon').length === 1" :alt="product.name" :src="product.media_list.filter(m=>m.use==='icon')[0].filename" class="me-2" height="50"/>
+        <Icon v-else icon="fluent-emoji:delivery-truck" width="50" />
+      </template>

      <template v-slot:card-body>
        <div class="fw-bold mb-2 text-primary"><i class="fa-solid fa-calendar-days"></i> {{ store.msgDelivery[i] }}
--- a/src/views/delivery-option-summary.vue
+++ b/src/views/delivery-option-summary.vue
@@ -78,7 +78,7 @@ export default {
      }

      if (import.meta.env.DEV) {
-        urlApi += '&ID_SESSION=U0hENaZr';
+        urlApi += '&ID_SESSION=3LnS0bwF';
        console.log(urlApi)
      }