project-booster-vue 10.24.6 → 10.24.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "project-booster-vue",
3
- "version": "10.24.6",
3
+ "version": "10.24.7",
4
4
  "private": false,
5
5
  "scripts": {
6
6
  "serve": "vue-cli-service serve",
@@ -21,10 +21,26 @@
21
21
  : ''
22
22
  }`"
23
23
  >
24
- <div class="pb-configurations-import__answer">
25
- <div class="mc-button mc-button--bordered-neutral" @click="displayConfigurationDialog">
26
- Sélectionner un fichier
27
- </div>
24
+ <div
25
+ class="pb-configurations-import__answer mc-button mc-button--bordered"
26
+ @click="displayConfigurationDialog"
27
+ >
28
+ <svg
29
+ aria-hidden="true"
30
+ width="24px"
31
+ height="24px"
32
+ fill="#188803"
33
+ xmlns="http://www.w3.org/2000/svg"
34
+ viewBox="0 0 24 24"
35
+ >
36
+ <path
37
+ d="M8.71 7.71L11 5.41V16a1 1 0 002 0V5.41l2.29 2.3a1 1 0 001.41 0 1 1 0 000-1.41l-4-4a1 1 0 00-1.41 0l-4 4a1 1 0 101.42 1.41z"
38
+ ></path>
39
+ <path
40
+ d="M16.22 12.44a1 1 0 00-1.2.75 1 1 0 00.76 1.19C18.55 15 20 16.17 20 17c0 1.22-3.12 3-8 3s-8-1.78-8-3c0-.83 1.45-2 4.22-2.6A1 1 0 009 13.22a1 1 0 00-1.18-.77C4.16 13.25 2 15 2 17c0 2.85 4.3 5 10 5s10-2.15 10-5c0-2-2.16-3.75-5.78-4.56z"
41
+ ></path>
42
+ </svg>
43
+ <span class="pb-configurations-import__answer__text">Sélectionner un fichier</span>
28
44
  </div>
29
45
  <div v-for="configuration in selectedConfigurations" :key="configuration.simulationId">
30
46
  <div class="pb-configurations-import__answer">
@@ -52,7 +68,6 @@
52
68
  class="next-step-cta"
53
69
  :label="payload.viewModel.redirectLink.label"
54
70
  @click="callAction(payload.viewModel.redirectLink.nextStep)"
55
- theme="primary"
56
71
  ></m-link>
57
72
  </div>
58
73
 
@@ -378,25 +393,24 @@ $answers-apparition-duration: '0.5s';
378
393
  display: flex;
379
394
  flex-wrap: wrap;
380
395
  justify-content: flex-start;
381
- margin: 0 auto;
382
396
  max-width: 1024px;
383
397
  width: 100%;
384
398
 
385
- &--centered {
386
- @include set-from-screen($responsive-breakpoint) {
387
- justify-content: center !important;
388
- }
399
+ margin: 0 auto;
400
+ padding-left: $mu050;
401
+
402
+ @include set-from-screen($responsive-breakpoint) {
403
+ margin-top: $mu100;
404
+ padding-left: 0;
389
405
  }
390
406
  }
391
407
 
392
408
  &__answer {
393
- box-sizing: border-box;
394
- height: 100%;
395
- width: 100%;
396
- padding: $mu050;
409
+ align-items: center;
410
+ width: 16rem;
397
411
 
398
- @include set-from-screen($responsive-breakpoint) {
399
- padding: $mu100 0;
412
+ &__text {
413
+ margin-left: $mu050;
400
414
  }
401
415
 
402
416
  &-card {
@@ -405,7 +419,7 @@ $answers-apparition-duration: '0.5s';
405
419
  }
406
420
 
407
421
  &__redirect-link {
408
- margin: $mu100 $mu050 0 $mu050;
422
+ margin: $mu100 0 0 $mu050;
409
423
 
410
424
  @include set-from-screen($responsive-breakpoint) {
411
425
  margin: $mu100 0 0 0;
@@ -31,65 +31,86 @@
31
31
  :name="showMoreAnimation"
32
32
  tag="div"
33
33
  >
34
- <m-flexy-col
35
- :width="payload.viewModel.forceOneCardPerLineOnMobile ? 'full' : '1of2'"
36
- width-from-m="1of3"
37
- width-from-l="1of3"
38
- >
39
- <div class="pb-upload-document__answer">
40
- <div v-if="payload.viewModel.upload" class="pb-upload-document__answer__upload">
41
- <div
42
- class="pb-upload-document__answer__upload__content mc-button mc-button--bordered-neutral"
43
- @click="displayDocumentDialog"
44
- >
45
- <span>{{ payload.viewModel.upload.label || 'Sélectionner un fichier' }}</span>
34
+ <div>
35
+ <m-flexy-col
36
+ :width="payload.viewModel.forceOneCardPerLineOnMobile ? 'full' : '1of2'"
37
+ width-from-m="1of3"
38
+ width-from-l="1of3"
39
+ >
40
+ <div class="pb-upload-document__answer">
41
+ <div v-if="payload.viewModel.upload" class="pb-upload-document__answer__upload">
42
+ <div
43
+ class="pb-upload-document__answer__upload__content mc-button mc-button--bordered"
44
+ @click="displayDocumentDialog"
45
+ >
46
+ <svg
47
+ aria-hidden="true"
48
+ width="24px"
49
+ height="24px"
50
+ fill="#188803"
51
+ xmlns="http://www.w3.org/2000/svg"
52
+ viewBox="0 0 24 24"
53
+ >
54
+ <path
55
+ d="M8.71 7.71L11 5.41V16a1 1 0 002 0V5.41l2.29 2.3a1 1 0 001.41 0 1 1 0 000-1.41l-4-4a1 1 0 00-1.41 0l-4 4a1 1 0 101.42 1.41z"
56
+ ></path>
57
+ <path
58
+ d="M16.22 12.44a1 1 0 00-1.2.75 1 1 0 00.76 1.19C18.55 15 20 16.17 20 17c0 1.22-3.12 3-8 3s-8-1.78-8-3c0-.83 1.45-2 4.22-2.6A1 1 0 009 13.22a1 1 0 00-1.18-.77C4.16 13.25 2 15 2 17c0 2.85 4.3 5 10 5s10-2.15 10-5c0-2-2.16-3.75-5.78-4.56z"
59
+ ></path>
60
+ </svg>
61
+ <span class="pb-upload-document__answer__upload__content__text">{{
62
+ payload.viewModel.upload.label || 'Sélectionner un fichier'
63
+ }}</span>
64
+ </div>
46
65
  </div>
47
- </div>
48
- <div v-if="payload.viewModel.download" class="pb-upload-document__answer__download">
49
- <a
50
- class="pb-upload-document__answer__download__content mc-button mc-button--bordered-neutral"
51
- target="_blank"
52
- :href="payload.viewModel.download.href"
53
- :download="payload.viewModel.download.fileName ? '' : ''"
54
- >
55
- <svg
56
- aria-hidden="true"
57
- width="24px"
58
- height="24px"
59
- fill="#454545"
60
- xmlns="http://www.w3.org/2000/svg"
61
- viewBox="0 0 24 24"
66
+ <div v-if="payload.viewModel.download" class="pb-upload-document__answer__download">
67
+ <a
68
+ class="pb-upload-document__answer__download__content mc-button mc-button--bordered-neutral"
69
+ target="_blank"
70
+ :href="payload.viewModel.download.href"
71
+ :download="payload.viewModel.download.fileName ? '' : ''"
62
72
  >
63
- <path
64
- d="M11.29 15.71a1 1 0 001.42 0l4-4a1 1 0 00-1.42-1.42L13 12.59V3a1 1 0 00-2 0v9.59l-2.29-2.3a1 1 0 10-1.42 1.42z"
65
- ></path>
66
- <path
67
- d="M19.48 13.61a1 1 0 00-1.36.4 1 1 0 00.4 1.35c.94.52 1.48 1.12 1.48 1.64 0 1.22-3.12 3-8 3s-8-1.78-8-3c0-.52.54-1.12 1.48-1.64a1 1 0 00.4-1.36 1 1 0 00-1.36-.4C2.89 14.5 2 15.71 2 17c0 2.85 4.3 5 10 5s10-2.15 10-5c0-1.29-.89-2.5-2.52-3.39z"
68
- ></path>
69
- </svg>
70
- <span class="pb-upload-document__answer__download__content__text">{{
71
- payload.viewModel.download.label || 'Télécharger un fichier'
72
- }}</span>
73
- </a>
73
+ <svg
74
+ aria-hidden="true"
75
+ width="24px"
76
+ height="24px"
77
+ fill="#454545"
78
+ xmlns="http://www.w3.org/2000/svg"
79
+ viewBox="0 0 24 24"
80
+ >
81
+ <path
82
+ d="M11.29 15.71a1 1 0 001.42 0l4-4a1 1 0 00-1.42-1.42L13 12.59V3a1 1 0 00-2 0v9.59l-2.29-2.3a1 1 0 10-1.42 1.42z"
83
+ ></path>
84
+ <path
85
+ d="M19.48 13.61a1 1 0 00-1.36.4 1 1 0 00.4 1.35c.94.52 1.48 1.12 1.48 1.64 0 1.22-3.12 3-8 3s-8-1.78-8-3c0-.52.54-1.12 1.48-1.64a1 1 0 00.4-1.36 1 1 0 00-1.36-.4C2.89 14.5 2 15.71 2 17c0 2.85 4.3 5 10 5s10-2.15 10-5c0-1.29-.89-2.5-2.52-3.39z"
86
+ ></path>
87
+ </svg>
88
+ <span class="pb-upload-document__answer__download__content__text">{{
89
+ payload.viewModel.download.label || 'Télécharger un fichier'
90
+ }}</span>
91
+ </a>
92
+ </div>
93
+ </div>
94
+ </m-flexy-col>
95
+ </div>
96
+ <div class="pb-upload-document__answers__document">
97
+ <m-flexy
98
+ v-for="document in selectedDocuments"
99
+ :key="`pb-upload-document__answers-${document.id}`"
100
+ :width="payload.viewModel.forceOneCardPerLineOnMobile ? 'full' : '1of2'"
101
+ width-from-m="1of3"
102
+ width-from-l="1of4"
103
+ >
104
+ <div class="pb-upload-document__answer">
105
+ <pb-card
106
+ class="pb-upload-document__answer__component"
107
+ :image="thumbnailUrl.replace('@@PB_MEDIA_ID_FILLER@@', document.id)"
108
+ :title="document.title"
109
+ flattened
110
+ />
74
111
  </div>
75
- </div>
76
- </m-flexy-col>
77
- <m-flexy-col
78
- v-for="document in selectedDocuments"
79
- :key="`pb-upload-document__answers-${document.id}`"
80
- :width="payload.viewModel.forceOneCardPerLineOnMobile ? 'full' : '1of2'"
81
- width-from-m="1of3"
82
- width-from-l="1of4"
83
- >
84
- <div class="pb-upload-document__answer">
85
- <pb-card
86
- class="pb-upload-document__answer__component"
87
- :image="thumbnailUrl.replace('@@PB_MEDIA_ID_FILLER@@', document.id)"
88
- :title="document.title"
89
- flattened
90
- />
91
- </div>
92
- </m-flexy-col>
112
+ </m-flexy>
113
+ </div>
93
114
  </transition-group>
94
115
  <div
95
116
  v-if="showMoreButtonDisplayed"
@@ -108,7 +129,7 @@
108
129
  </div>
109
130
 
110
131
  <div class="pb-upload-document__redirect-link" v-if="payload.viewModel.redirectLink">
111
- <m-link @click="validMultiSelect(payload.viewModel.redirectLink)" theme="primary">{{
132
+ <m-link @click="validMultiSelect(payload.viewModel.redirectLink)">{{
112
133
  payload.viewModel.redirectLink.label
113
134
  }}</m-link>
114
135
  </div>
@@ -137,23 +158,23 @@
137
158
  </template>
138
159
 
139
160
  <script lang="ts" setup>
140
- import { computed, onMounted, ref, PropType } from 'vue';
141
- import { MButton, MLink } from '@mozaic-ds/vue-3';
142
- import MContainer from '../../../mozaic/grid/MContainer.vue';
143
- import MFlexy from '../../../mozaic/grid/MFlexy.vue';
144
- import MFlexyCol from '../../../mozaic/grid/MFlexyCol.vue';
145
- import PbCard from '../../../cards/PbCard.vue';
146
- import MPbMediaUpload from '../../media/upload/MPbMediaUpload.vue';
147
- import { useStore } from 'vuex';
148
161
  import {
149
162
  UploadDocumentMultiSelectAction,
150
163
  UploadDocumentPayload,
151
164
  UploadDocumentViewModel,
152
165
  } from '@/components/question/upload-document/UploadDocument';
153
- import { ScenarioStepAnswer } from '@/types/pb/Scenario';
154
166
  import { decorate, doEval } from '@/services/decorate';
155
- import { EmitEventName } from '../../services/emit';
167
+ import { ScenarioStepAnswer } from '@/types/pb/Scenario';
168
+ import { MButton, MLink } from '@mozaic-ds/vue-3';
169
+ import { PropType, computed, onMounted, ref } from 'vue';
170
+ import { useStore } from 'vuex';
171
+ import PbCard from '../../../cards/PbCard.vue';
172
+ import MContainer from '../../../mozaic/grid/MContainer.vue';
173
+ import MFlexy from '../../../mozaic/grid/MFlexy.vue';
174
+ import MFlexyCol from '../../../mozaic/grid/MFlexyCol.vue';
175
+ import MPbMediaUpload from '../../media/upload/MPbMediaUpload.vue';
156
176
  import MPbNavigation from '../../navigation/MPbNavigation.vue';
177
+ import { EmitEventName } from '../../services/emit';
157
178
 
158
179
  const BACK_ICON =
159
180
  'https://storage.googleapis.com/project-booster-media/mozaic-icons/svg/Navigation_Arrow_Arrow--Left_16px.svg';
@@ -356,7 +377,7 @@ $answers-apparition-duration: '0.5s';
356
377
  }
357
378
 
358
379
  &__redirect-link {
359
- margin: $mu100 $mu100 0 $mu100;
380
+ margin: $mu100 0 0 $mu050;
360
381
 
361
382
  @include set-from-screen($responsive-breakpoint) {
362
383
  margin: $mu100 0 0 0;
@@ -448,6 +469,12 @@ $answers-apparition-duration: '0.5s';
448
469
  max-width: 1024px;
449
470
  width: 100%;
450
471
 
472
+ &__document {
473
+ display: flex;
474
+ flex-direction: row;
475
+ flex-wrap: wrap;
476
+ }
477
+
451
478
  &--centered {
452
479
  @include set-from-screen($responsive-breakpoint) {
453
480
  justify-content: center !important;
@@ -476,6 +503,11 @@ $answers-apparition-duration: '0.5s';
476
503
  padding: $mu100 0 0 0;
477
504
  }
478
505
 
506
+ &__component {
507
+ margin-right: 1rem;
508
+ width: 10rem;
509
+ }
510
+
479
511
  :deep(.pb-upload-document__answer__component) {
480
512
  box-sizing: border-box;
481
513
  height: 100% !important;
@@ -490,12 +522,8 @@ $answers-apparition-duration: '0.5s';
490
522
  align-items: center;
491
523
  width: 16rem;
492
524
 
493
- color: $color-primary-01-500;
494
- border-color: $color-primary-01-500;
495
-
496
- &:hover {
497
- color: white;
498
- background-color: $color-primary-01-500;
525
+ &__text {
526
+ margin-left: $mu050;
499
527
  }
500
528
  }
501
529
  }
@@ -1,85 +1,54 @@
1
1
  {
2
2
  "viewModel": {
3
- "label": "Partagez votre plan de salle de bains :",
4
- "subtitle": "Le plan de votre salle de bains est indispensable en amont du RDV. Cela permettra à votre conseiller de préparer au mieux votre projet. Formats acceptés : .jpg .jpeg .pdf .png 56Go max.",
5
- "answersComponent": "PbCard",
6
- "startOpened": false,
3
+ "label": "Transmettre vos mesures pour votre futur projet jardin",
4
+ "subtitle": "Vous pouvez utiliser votre propre plan annoté, ou vous baser sur la fiche de cote que nous mettons à votre disposition.",
5
+
6
+ "upload": {
7
+ "label": "Sélectionner un fichier"
8
+ },
9
+ "download": {
10
+ "label": "Télécharger notre fiche de cote",
11
+ "href": "https://pics.craiyon.com/2023-10-23/ad93a138e3aa491389f9ada191aed967.webp",
12
+ "fileName": "fiche-de-cote.pdf"
13
+ },
14
+
7
15
  "redirectLink": {
8
- "label": "Je préfère utiliser un plan 3D réalisé sur mon espace client.",
16
+ "label": "Utiliser une simulation existante sur Leroy Merlin",
9
17
  "nextStep": {
10
- "code": ""
18
+ "code": "LMFR_QUESTION_SCENARIO_ADD_SIMULATION"
11
19
  }
12
20
  },
21
+ "showMore": {
22
+ "itemsPerPage": 4,
23
+ "label": "Afficher plus de photos"
24
+ },
13
25
  "mediaPayload": {
14
26
  "viewModel": {
15
- "type": "documentsPlan",
16
- "acceptedFileTypes": "image/jpeg, image/png, image/heif, image/heic, image/heif-sequence, image/heic-sequence, application/pdf",
27
+ "type": "documentsPlans",
28
+ "acceptedFileTypes": "image/jpeg, image/png, image/heif, image/heic",
17
29
  "dialog": {
18
30
  "hideCross": false,
19
31
  "fullscreen": false,
20
- "title": "Importer un fichier",
32
+ "title": "Ajouter un plan",
21
33
  "successUpload": "Votre plan a bien été ajouté",
22
34
  "chooseAnotherMediaLabel": "Choisir un autre plan",
23
35
  "uploadProgressTitle": "Chargement de votre plan",
24
- "errorUploadTitle": "Une erreur est survenue lors de l'envoi de votre plan ",
25
- "uploadPreviewTitle": "Nom de plan ",
26
- "documentTypeTitle": "De quel type de plan s’agit il ?",
27
- "acceptedMediaTypesErrorLabel": "Seuls les formats JPG et PNG, et PDF sont acceptés",
36
+ "errorUploadTitle": "Une erreur est survenue lors de l'envoi de votre plan",
37
+ "uploadPreviewTitle": "Nom du plan",
28
38
  "mediaTypes": [
29
39
  {
30
40
  "type": "PLAN",
31
41
  "subtype": "HAND_DRAWN_PLAN",
32
- "code": "HAND_DRAWN_PLAN",
33
- "label": "Un plan fait moi-même"
42
+ "label": "Un plan fait moi même"
34
43
  },
35
44
  {
36
45
  "type": "PLAN",
37
46
  "subtype": "ARCHITECT_PLAN",
38
- "code": "ARCHITECT_PLAN",
39
47
  "label": "Un plan d’architecte"
40
- },
41
- {
42
- "type": "PLAN",
43
- "subtype": "KITCHEN_DESIGNER_PLAN",
44
- "code": "KITCHEN_DESIGNER_PLAN",
45
- "label": "Un plan d’un autre cuisiniste"
46
48
  }
47
49
  ]
48
50
  }
49
51
  }
50
52
  }
51
- },
52
- "callToActions": [
53
- {
54
- "label": "Précédent",
55
- "theme": "bordered-primary-02",
56
- "icon": "ArrowLeft48"
57
- },
58
- {
59
- "label": "Suivant",
60
- "icon": "ArrowRight48",
61
- "iconPosition": "right"
62
- }
63
- ],
64
- "skippable": [
65
- {
66
- "label": "Ajouter un plan plus tard",
67
- "theme": "text-primary",
68
- "width": "full",
69
- "widthFromM": "fit",
70
- "nextStep": {
71
- "code": "LMFR_QUESTION_ADD_PLAN_LATER"
72
- }
73
- }
74
- ],
75
- "multiSelect": {
76
- "actions": {
77
- "VALIDATE": {
78
- "label": "Continuer",
79
- "nextStep": {
80
- "code": "__END__"
81
- }
82
- }
83
- }
84
53
  }
85
54
  }