project-booster-vue 9.59.2 → 9.60.0

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": "9.59.2",
3
+ "version": "9.60.0",
4
4
  "private": false,
5
5
  "scripts": {
6
6
  "serve": "vue-cli-service serve",
@@ -9,7 +9,11 @@
9
9
  AS_SOON_AS_POSSIBLE: 'Dès que possible',
10
10
  IN_LESS_THAN_TWO_WEEKS: 'Dans moins de 15 jours',
11
11
  IN_LESS_THAN_THREE_MONTHS: 'Dans moins de 3 mois',
12
+ IN_THREE_MONTHS: 'Dans 3 mois',
12
13
  IN_MORE_THAN_THREE_MONTHS: 'Dans plus de 3 mois',
14
+ IN_SIX_MONTHS: 'Dans 6 mois',
15
+ IN_MORE_THAN_SIX_MONTHS: 'Dans plus de 6 mois',
16
+ DO_NOT_KNOW_YET: 'Je ne sais pas',
13
17
  }[attribute.value]
14
18
  "
15
19
  :image="
@@ -22,6 +26,14 @@
22
26
  'https://storage.googleapis.com/project-booster-media/project-attributes/work-start-date/in-less-than-three-months.jpg',
23
27
  IN_MORE_THAN_THREE_MONTHS:
24
28
  'https://storage.googleapis.com/project-booster-media/project-attributes/work-start-date/in-more-than-three-months.jpg',
29
+ IN_THREE_MONTHS:
30
+ 'https://storage.googleapis.com/project-booster-media/project-attributes/work-start-date/as-soon-as-possible.jpg',
31
+ IN_SIX_MONTHS:
32
+ 'https://storage.googleapis.com/project-booster-media/project-attributes/work-start-date/as-soon-as-possible.jpg',
33
+ IN_MORE_THAN_SIX_MONTHS:
34
+ 'https://storage.googleapis.com/project-booster-media/project-attributes/work-start-date/as-soon-as-possible.jpg',
35
+ DO_NOT_KNOW_YET:
36
+ 'https://storage.googleapis.com/project-booster-media/project-attributes/work-start-date/as-soon-as-possible.jpg',
25
37
  }[attribute.value]
26
38
  "
27
39
  />
@@ -71,18 +83,42 @@
71
83
  label="Budget"
72
84
  :value="
73
85
  {
86
+ BETWEEN_1000_AND_3000_EUROS: '1000-3000€',
74
87
  BETWEEN_1500_AND_2000_EUROS: '1500-2000 €',
75
88
  BETWEEN_2000_AND_3000_EUROS: '2000-3000 €',
76
89
  BETWEEN_3000_AND_4000_EUROS: '3000-4000 €',
90
+ BETWEEN_3000_AND_6000_EUROS: '3000-6000€',
77
91
  BETWEEN_4000_AND_5000_EUROS: '4000-5000 €',
78
92
  MORE_THAN_5000_EUROS: 'Plus de 5000 €',
93
+ BETWEEN_5000_AND_7000_EUROS: '5000-7000€',
94
+ MORE_THAN_6000_EUROS: 'Plus de 6000€',
95
+ BETWEEN_7000_AND_10000_EUROS: '7000-10000€',
96
+ MORE_THAN_10000_EUROS: 'Plus de 10000€',
79
97
  DO_NOT_KNOW_YET: 'Pas d\'idée de budget',
80
98
  }[attribute.value]
81
99
  "
82
- image="https://storage.googleapis.com/project-booster-media/project-attributes/budget/budget-attribute.jpg
83
- "
100
+ image="https://storage.googleapis.com/project-booster-media/project-attributes/budget/budget-attribute.jpg"
84
101
  />
85
102
  </template>
103
+
104
+ <div class="pb-project-attributes__section-title">
105
+ <h2>Les éléments que vous souhaitez installer</h2>
106
+ </div>
107
+
108
+ <ul class="pb-project-attributes__works">
109
+ <template v-for="[attributeId, attribute] of displayedProjectAttributes" :key="attributeId">
110
+ <template v-if="attributeId === 'works' && isArray(attribute.value)">
111
+ <li v-for="value in JSON.parse(attribute.value)">
112
+ {{ works[value] }}
113
+ </li>
114
+ </template>
115
+ <template v-else-if="attributeId === 'works'">
116
+ <li>
117
+ {{ works[attribute.value] }}
118
+ </li>
119
+ </template>
120
+ </template>
121
+ </ul>
86
122
  </m-flexy>
87
123
  </template>
88
124
 
@@ -96,6 +132,20 @@ export default defineComponent({
96
132
 
97
133
  components: { MFlexy, PbProjectAttribute },
98
134
 
135
+ data() {
136
+ return {
137
+ works: {
138
+ FURNITURES: 'Meubles',
139
+ SHOWER: 'Douche',
140
+ BATHTUB: 'Baignoire',
141
+ WC: 'WC',
142
+ COVERING_FLOOR: 'Revêtement sol',
143
+ COVERING_WALL: 'Revêtement mûr',
144
+ REPLACE_BATHTUB_TO_SHOWER: 'Remplacer une baignoire par une douche',
145
+ },
146
+ };
147
+ },
148
+
99
149
  props: {
100
150
  /**
101
151
  * The project attributes
@@ -106,6 +156,12 @@ export default defineComponent({
106
156
  },
107
157
  },
108
158
 
159
+ methods: {
160
+ isArray(value: any) {
161
+ return value.includes('[') ? true : false;
162
+ },
163
+ },
164
+
109
165
  computed: {
110
166
  displayedProjectAttributes() {
111
167
  return Object.entries(this.projectAttributes);
@@ -126,5 +182,30 @@ $responsive-breakpoint: 'l';
126
182
  .pb-project-attributes {
127
183
  align-items: stretch;
128
184
  height: 100%;
185
+
186
+ &__section-title {
187
+ width: 100%;
188
+ @include set-font-face('semi-bold');
189
+ @include set-font-scale('05', 'm');
190
+
191
+ color: $color-grey-800;
192
+ margin-left: $mu100;
193
+ }
194
+
195
+ &__works {
196
+ list-style: none;
197
+ margin: 0;
198
+ padding: 0 $mu100;
199
+ width: 100%;
200
+
201
+ li {
202
+ @include set-font-face('semi-bold');
203
+
204
+ margin: 0;
205
+ padding: $mu125 $mu025;
206
+ border-bottom: 1px solid $color-primary-02-200;
207
+ width: 100%;
208
+ }
209
+ }
129
210
  }
130
211
  </style>
@@ -65,10 +65,14 @@ const props = defineProps({
65
65
  * @param action
66
66
  */
67
67
  const callAction = (action: PayloadAction) => {
68
- emit('step-completed', {
69
- answers: [],
70
- nextStep: action,
71
- });
68
+ if (action.code != '__BACK__') {
69
+ emit('step-completed', {
70
+ answers: [],
71
+ nextStep: action,
72
+ });
73
+ } else {
74
+ emit('go-back');
75
+ }
72
76
  };
73
77
  </script>
74
78
 
@@ -37,12 +37,12 @@
37
37
  width-from-l="1of3"
38
38
  >
39
39
  <div class="pb-upload-document__answer">
40
- <pb-card
41
- class="pb-upload-document__answer-card"
42
- :title="payload.viewModel.addTitle || 'Ajouter un plan'"
43
- :text="payload.viewModel.addText || ''"
44
- @card-click="displayDocumentDialog"
45
- />
40
+ <div
41
+ class="pb-upload-document__answer-plan mc-button mc-button--bordered-neutral"
42
+ @click="displayDocumentDialog"
43
+ >
44
+ {{ payload.viewModel.addTitle || 'Importer un fichier' }}
45
+ </div>
46
46
  </div>
47
47
  </m-flexy-col>
48
48
  <m-flexy-col
@@ -79,6 +79,17 @@
79
79
  </m-flexy>
80
80
  </m-container>
81
81
  </div>
82
+
83
+ <div class="pb-upload-document__redirect-link" v-if="payload.viewModel.redirectLink">
84
+ <m-link :label="payload.viewModel.redirectLink.label" theme="primary"></m-link>
85
+ </div>
86
+
87
+ <div class="pb-upload-document__buttons row-flex" v-if="payload.callToActions">
88
+ <div class="pb-upload-document__buttons__button" v-for="button in payload.callToActions">
89
+ <m-button :label="button.label" @click="callAction(button.nextStep)" :theme="button.theme" />
90
+ </div>
91
+ </div>
92
+
82
93
  <pb-sticky-footer
83
94
  v-if="payload.skippable || payload.multiSelect"
84
95
  ref="pbStickyFooter"
@@ -153,6 +164,7 @@ import {
153
164
  } from '@/components/question/upload-document/UploadDocument';
154
165
  import { ScenarioStepAnswer } from '@/types/pb/Scenario';
155
166
  import { decorate, doEval } from '@/services/decorate';
167
+ import { PayloadAction } from '../../types/genericPayload';
156
168
 
157
169
  const BACK_ICON =
158
170
  'https://storage.googleapis.com/project-booster-media/mozaic-icons/svg/Navigation_Arrow_Arrow--Left_16px.svg';
@@ -302,6 +314,21 @@ export default defineComponent({
302
314
  showMoreAnimation.value = 'pb-upload-document__answers-animation';
303
315
  };
304
316
 
317
+ /**
318
+ * Send action to completed step
319
+ * @param action
320
+ */
321
+ const callAction = (action: PayloadAction) => {
322
+ if (action.code != '__BACK__') {
323
+ emit('step-completed', {
324
+ answers: [],
325
+ nextStep: action,
326
+ });
327
+ } else {
328
+ emit('go-back');
329
+ }
330
+ };
331
+
305
332
  return {
306
333
  ADD_ICON,
307
334
  BACK_ICON,
@@ -322,6 +349,7 @@ export default defineComponent({
322
349
  displayDocumentDialog,
323
350
  handleMediaUploaded,
324
351
  handleShowMoreClick,
352
+ callAction,
325
353
  };
326
354
  },
327
355
  });
@@ -329,6 +357,7 @@ export default defineComponent({
329
357
 
330
358
  <style lang="scss" scoped>
331
359
  @import 'pb-variables';
360
+ @import '../../styles/global.scss';
332
361
 
333
362
  $responsive-breakpoint: 'm';
334
363
  $answers-apparition-duration: '0.5s';
@@ -360,6 +389,23 @@ $answers-apparition-duration: '0.5s';
360
389
  height: auto;
361
390
  width: 100%;
362
391
 
392
+ &__buttons {
393
+ padding: 0 $mu100;
394
+ margin-top: $mu250;
395
+
396
+ &__button {
397
+ width: 50%;
398
+
399
+ &:last-child {
400
+ text-align: right;
401
+ }
402
+ }
403
+ }
404
+
405
+ &__redirect-link {
406
+ margin: $mu100 $mu100 0 $mu100;
407
+ }
408
+
363
409
  &__back-button {
364
410
  position: absolute;
365
411
  top: 0;
@@ -4,6 +4,12 @@
4
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
5
  "answersComponent": "PbCard",
6
6
  "startOpened": false,
7
+ "redirectLink": {
8
+ "label": "Je préfère utiliser un plan 3D réalisé sur mon espace client.",
9
+ "nextStep": {
10
+ "code": ""
11
+ }
12
+ },
7
13
  "mediaPayload": {
8
14
  "viewModel": {
9
15
  "type": "documentsPlan",
@@ -43,6 +49,15 @@
43
49
  }
44
50
  }
45
51
  },
52
+ "callToActions": [
53
+ {
54
+ "label": "Précédent",
55
+ "theme": "bordered-primary-02"
56
+ },
57
+ {
58
+ "label": "Suivant"
59
+ }
60
+ ],
46
61
  "skippable": [
47
62
  {
48
63
  "label": "Ajouter un plan plus tard",
@@ -712,7 +712,7 @@
712
712
  "code": "NATURAL",
713
713
  "viewModel": {
714
714
  "title": "Nature",
715
- "image": "https://storage.googleapis.com/project-booster-media/bathroom/size/size-small.png"
715
+ "image": "https://storage.googleapis.com/project-booster-media/bathroom/styles/nature.jpg"
716
716
  },
717
717
  "meta": {
718
718
  "ranking": 1
@@ -722,7 +722,7 @@
722
722
  "code": "INDUSTRIAL",
723
723
  "viewModel": {
724
724
  "title": "Industriel",
725
- "image": "https://storage.googleapis.com/project-booster-media/bathroom/size/size-medium.png"
725
+ "image": "https://storage.googleapis.com/project-booster-media/bathroom/styles/industriel.jpg"
726
726
  },
727
727
  "meta": {
728
728
  "ranking": 2
@@ -732,7 +732,7 @@
732
732
  "code": "GLAMOR_CHIC",
733
733
  "viewModel": {
734
734
  "title": "Glamour Chic",
735
- "image": "https://storage.googleapis.com/project-booster-media/bathroom/size/size-large.png"
735
+ "image": "https://storage.googleapis.com/project-booster-media/bathroom/styles/glamour.jpg"
736
736
  },
737
737
  "meta": {
738
738
  "ranking": 3
@@ -742,7 +742,7 @@
742
742
  "code": "DESIGN",
743
743
  "viewModel": {
744
744
  "title": "Design",
745
- "image": "https://storage.googleapis.com/project-booster-media/bathroom/size/size-medium.png"
745
+ "image": "https://storage.googleapis.com/project-booster-media/bathroom/styles/design.jpg"
746
746
  },
747
747
  "meta": {
748
748
  "ranking": 2
@@ -752,11 +752,21 @@
752
752
  "code": "CHARME",
753
753
  "viewModel": {
754
754
  "title": "Charme",
755
- "image": "https://storage.googleapis.com/project-booster-media/bathroom/size/size-large.png"
755
+ "image": "https://storage.googleapis.com/project-booster-media/bathroom/styles/charme.jpg"
756
756
  },
757
757
  "meta": {
758
758
  "ranking": 3
759
759
  }
760
+ },
761
+ "NEO": {
762
+ "code": "NEO",
763
+ "viewModel": {
764
+ "title": "Néo-classique",
765
+ "image": "https://storage.googleapis.com/project-booster-media/bathroom/styles/neo-classique.jpg"
766
+ },
767
+ "meta": {
768
+ "ranking": 4
769
+ }
760
770
  }
761
771
  }
762
772
  }
@@ -906,13 +916,32 @@
906
916
  "title": "Voulez-vous télécharger vos plans plus tard ?",
907
917
  "type": "warning",
908
918
  "exitOptionsTitle": "Réaliser rapidement votre plan :",
909
- "exitOptions": []
919
+ "exitOptions": [
920
+ {
921
+ "code": "CARD-1",
922
+ "viewModel": {
923
+ "url": "https://www.leroymerlin.fr/produits/cuisine/cuisine-equipee-delinia-id/",
924
+ "image": "https://storage.googleapis.com/project-booster-media/kitchen/kitchen-range.jpeg",
925
+ "title": "Découvrir nos gammes de cuisines",
926
+ "subtitle": "Découvrir nos gammes de cuisines"
927
+ }
928
+ },
929
+ {
930
+ "code": "CARD-2",
931
+ "viewModel": {
932
+ "url": "https://www.leroymerlin.fr/produits/cuisine/cuisine-equipee-delinia-id/",
933
+ "image": "https://storage.googleapis.com/project-booster-media/kitchen/kitchen-range.jpeg",
934
+ "title": "Découvrir nos gammes de cuisines",
935
+ "subtitle": "Découvrir nos gammes de cuisines"
936
+ }
937
+ }
938
+ ]
910
939
  },
911
940
  "callToActions": [
912
941
  {
913
942
  "label": "Précédent",
914
943
  "nextStep": {
915
- "code": "LMFR_BATHROOM_DOWNLOAD_PLAN"
944
+ "code": "__BACK__"
916
945
  },
917
946
  "theme": "bordered-primary-02"
918
947
  },
@@ -944,7 +973,8 @@
944
973
  "component": "MPbUploadDocument",
945
974
  "payload": {
946
975
  "viewModel": {
947
- "label": "Les photos de votre cuisine",
976
+ "label": "Souhaitez-vous nous transmettre des photos de votre salle de bain ou de vos inspirations ?",
977
+ "subtitle": "En joignant des photos, votre expert sera en mesure de vous proposer une solution qui correspond au mieux à vos attentes.",
948
978
  "addTitle": "Ajouter une photo",
949
979
  "addText": " ",
950
980
  "answersComponent": "PbCard",
@@ -973,6 +1003,21 @@
973
1003
  }
974
1004
  }
975
1005
  },
1006
+ "callToActions": [
1007
+ {
1008
+ "label": "Précédent",
1009
+ "theme": "bordered-primary-02",
1010
+ "nextStep": {
1011
+ "code": "__BACK__"
1012
+ }
1013
+ },
1014
+ {
1015
+ "label": "Suivant",
1016
+ "nextStep": {
1017
+ "code": "LMFR_BATHROOM_TIME_TO_START"
1018
+ }
1019
+ }
1020
+ ],
976
1021
  "skippable": [
977
1022
  {
978
1023
  "isAnswer": true,
@@ -1046,6 +1091,12 @@
1046
1091
  "label": "Votre projet de salle de bains"
1047
1092
  }
1048
1093
  },
1094
+ "redirectLink": {
1095
+ "label": "Je préfère utiliser un plan 3D réalisé sur mon espace client.",
1096
+ "nextStep": {
1097
+ "code": "LMFR_BATHROOM_ADD_SIMULATION"
1098
+ }
1099
+ },
1049
1100
  "payload": {
1050
1101
  "viewModel": {
1051
1102
  "label": "Partagez votre plan de salle de bains :",
@@ -1078,6 +1129,21 @@
1078
1129
  }
1079
1130
  }
1080
1131
  },
1132
+ "callToActions": [
1133
+ {
1134
+ "label": "Précédent",
1135
+ "theme": "bordered-primary-02",
1136
+ "nextStep": {
1137
+ "code": "__BACK__"
1138
+ }
1139
+ },
1140
+ {
1141
+ "label": "Suivant",
1142
+ "nextStep": {
1143
+ "code": "LMFR_BATHROOM_DOWNLOAD"
1144
+ }
1145
+ }
1146
+ ],
1081
1147
  "skippable": [
1082
1148
  {
1083
1149
  "isAnswer": true,
@@ -228,6 +228,26 @@
228
228
  "budget": {
229
229
  "value": "BETWEEN_2000_AND_3000_EUROS",
230
230
  "date": "2019-08-23T13:53:25.137541515Z"
231
+ },
232
+ "works": {
233
+ "id": "7cfd6d6a-6c39-404d-9186-255ce4e86703",
234
+ "name": "works",
235
+ "value": "SHOWER",
236
+ "date": "2022-07-21T15:06:58.33537Z",
237
+ "inhabitantProjectId": "caf335a6-95f1-4903-83bd-3c8fcd2881b3",
238
+ "businessUnit": "001",
239
+ "ownerId": "90817164",
240
+ "creatorId": "90817164"
241
+ },
242
+ "bathroomStyle": {
243
+ "id": "7cfd6d6a-6c39-404d-9186-255ce4e86703",
244
+ "name": "bathroomStyle",
245
+ "value": "INDUSTRIAL",
246
+ "date": "2022-07-21T15:06:58.33537Z",
247
+ "inhabitantProjectId": "caf335a6-95f1-4903-83bd-3c8fcd2881b3",
248
+ "businessUnit": "001",
249
+ "ownerId": "90817164",
250
+ "creatorId": "90817164"
231
251
  }
232
252
  }
233
253
  },