project-booster-vue 9.10.4 → 9.12.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.
Files changed (16) hide show
  1. package/package.json +6 -6
  2. package/src/components/estimates/PbEstimatesList.vue +1 -1
  3. package/src/components/mozaic/notifications/MNotification.stories.mdx +16 -1
  4. package/src/components/mozaic/notifications/MNotification.vue +8 -2
  5. package/src/components/mozaic/notifications/__snapshots__/storyshots-puppeteer-test-puppeteer-ts-image-storyshots-mozaic-components-m-notification-/360/237/247/254-showcase-is-big-1-snap.png +0 -0
  6. package/src/components/mozaic/notifications/__snapshots__/storyshots-puppeteer-test-puppeteer-ts-image-storyshots-mozaic-components-m-notification-/360/237/247/254-showcase-type-1-snap.png +0 -0
  7. package/src/components/projects/project-hub/PbProjectHub.vue +5 -5
  8. package/src/components/projects/project-hub/__snapshots__/storyshots-puppeteer-test-puppeteer-ts-image-storyshots-project-booster-components-projects-pb-project-hub-/360/237/246/240-features-appointment-showcase-with-appointment-in-the-past-1-snap.png +0 -0
  9. package/src/components/projects/project-hub/__snapshots__/storyshots-puppeteer-test-puppeteer-ts-image-storyshots-project-booster-components-projects-pb-project-hub-/360/237/246/240-features-appointment-showcase-with-cancelled-appointment-1-snap.png +0 -0
  10. package/src/components/projects/project-hub/__snapshots__/storyshots-puppeteer-test-puppeteer-ts-image-storyshots-project-booster-components-projects-pb-project-hub-/360/237/246/240-features-appointment-showcase-with-cancelled-appointment-in-the-past-1-snap.png +0 -0
  11. package/src/components/projects/project-hub/__snapshots__/storyshots-puppeteer-test-puppeteer-ts-image-storyshots-project-booster-components-projects-pb-project-hub-/360/237/246/240-features-appointment-showcase-with-store-appointment-1-snap.png +0 -0
  12. package/src/components/projects/project-hub/__snapshots__/storyshots-puppeteer-test-puppeteer-ts-image-storyshots-project-booster-components-projects-pb-project-hub-/360/237/246/240-features-appointment-showcase-with-visio-appointment-1-snap.png +0 -0
  13. package/src/components/scenario/scenarii/appointment-qualification-kitchen.json +76 -24
  14. package/src/services/scenarioConditionals.ts +6 -1
  15. package/src/stores/modules/appointmentQualificationStore.ts +16 -4
  16. package/src/stores/modules/estimatesStore.ts +35 -0
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "project-booster-vue",
3
- "version": "9.10.4",
3
+ "version": "9.12.0",
4
4
  "private": false,
5
5
  "scripts": {
6
6
  "serve": "vue-cli-service serve",
@@ -119,12 +119,12 @@
119
119
  "@typescript-eslint/parser": "4.18.0",
120
120
  "@vue/babel-preset-app": "4.5.13",
121
121
  "@vue/compat": "3.2.6",
122
- "@vue/cli": "5.0.0-beta.7",
123
- "@vue/cli-plugin-babel": "5.0.0-beta.7",
124
- "@vue/cli-plugin-eslint": "5.0.0-beta.7",
125
- "@vue/cli-plugin-typescript": "4.5.13",
122
+ "@vue/cli": "5.0.4",
123
+ "@vue/cli-plugin-babel": "5.0.4",
124
+ "@vue/cli-plugin-eslint": "5.0.4",
125
+ "@vue/cli-plugin-typescript": "5.0.4",
126
126
  "@vue/cli-plugin-unit-jest": "4.5.16",
127
- "@vue/cli-service": "5.0.0-beta.7",
127
+ "@vue/cli-service": "5.0.4",
128
128
  "@vue/compiler-sfc": "3.2.31",
129
129
  "@vue/eslint-config-prettier": "6.0.0",
130
130
  "@vue/eslint-config-standard": "6.0.0",
@@ -71,7 +71,7 @@
71
71
  class="pb-estimates-list__show-more-button"
72
72
  theme="bordered"
73
73
  label="Voir plus"
74
- @click="$store.dispatch('estimates/loadEstimates')"
74
+ @click="$store.dispatch('estimates/loadMoreEstimates')"
75
75
  width="fit"
76
76
  :style="`transition-delay: ${showMoreButtonAnimationDelay}ms;`"
77
77
  />
@@ -184,7 +184,22 @@ export const TemplateSandbox = (args, { argTypes }) => ({
184
184
  <m-notification title="success" type="success" />
185
185
  <m-notification title="warning" type="warning" />
186
186
  <m-notification title="danger" type="danger" />
187
- <m-notification title="appointment" is-big />
187
+ </div>
188
+ `,
189
+ }}
190
+ </Story>
191
+ </Canvas>
192
+
193
+ ## **isBig** prop
194
+
195
+ <Canvas>
196
+ <Story name="Showcase - Is big" parameters={{ controls: { disable: true } }}>
197
+ {{
198
+ components: { MNotification },
199
+ template: `
200
+ <div style="display: flex;flex-direction: column;gap: 1rem;">
201
+ <m-notification title="Normal" text="Some text" type="information" link-label="The lnk label" link-href="#"/>
202
+ <m-notification title="Big" text="Some text" type="information" link-label="The lnk label" link-href="#" is-big />
188
203
  </div>
189
204
  `,
190
205
  }}
@@ -252,10 +252,16 @@ $responsive-breakpoint: 'm';
252
252
 
253
253
  .mc-notification__message {
254
254
  @include set-font-scale('06', 's');
255
+
256
+ margin-top: $mu100;
255
257
  }
256
258
 
257
- .mc-notification__link .mc-link__label {
258
- @include set-font-scale('06', 's');
259
+ .mc-notification__link {
260
+ margin-top: $mu100;
261
+
262
+ .mc-link__label {
263
+ @include set-font-scale('06', 's');
264
+ }
259
265
  }
260
266
  }
261
267
 
@@ -130,7 +130,7 @@
130
130
  </m-flexy>
131
131
  <m-link
132
132
  class="pb-project-hub__section-content-link"
133
- label="Gérer vos documents"
133
+ label="Gérer les documents"
134
134
  @click="$router.push({ name: 'PbDocuments' })"
135
135
  />
136
136
  </m-container>
@@ -442,7 +442,7 @@
442
442
  </m-flexy>
443
443
  <m-link
444
444
  class="pb-project-hub__section-content-link"
445
- label="Gérer vos inspirations"
445
+ label="Gérer les inspirations"
446
446
  @click="$router.push({ name: 'PbInspirations' })"
447
447
  />
448
448
  </m-container>
@@ -1129,7 +1129,7 @@ export default defineComponent({
1129
1129
  })} à ${appointmentDate.toLocaleTimeString('fr-FR', { hour: '2-digit', minute: '2-digit' })}`;
1130
1130
  const appointmentTypeLabel = (<Record<string, string>>{
1131
1131
  KITCHEN_IN_STORE: 'en magasin',
1132
- KITCHEN_REMOTE: 'en visio-conférence',
1132
+ KITCHEN_REMOTE: 'à distance',
1133
1133
  })[this.appointment.appointmentType];
1134
1134
  return `${prefix} le ${appointmenDateLabel} ${appointmentTypeLabel}`;
1135
1135
  },
@@ -1140,8 +1140,8 @@ export default defineComponent({
1140
1140
  : this.appointment.isPast
1141
1141
  ? 'Date du rendez-vous passée.'
1142
1142
  : this.appointment.appointmentType === 'KITCHEN_IN_STORE'
1143
- ? 'N’oubliez pas !'
1144
- : "Retrouvez le lien d'accès à la visio-conférence dans le mail qui vous est envoyé. \n" + 'N’oubliez pas !';
1143
+ ? 'Si vous le souhaitez vous pourrez annuler le rendez-vous dans le mail qui vous a été envoyé.<br/>N’oubliez pas !'
1144
+ : "Retrouvez le lien d'accès à la visio-conférence dans le mail qui vous a été envoyé.<br/>Si vous le souhaitez vous pourrez annuler le rendez-vous dans ce mail.<br/>N’oubliez pas !";
1145
1145
  },
1146
1146
 
1147
1147
  appointmentNotificationLinkLabel() {
@@ -117,7 +117,7 @@
117
117
  "NOT_UNDERSTOOD": {
118
118
  "code": "NOT_UNDERSTOOD",
119
119
  "viewModel": {
120
- "title": "Je n’ai pas compris ce qu’on attend de moi"
120
+ "title": "C'est trop compliqué"
121
121
  },
122
122
  "meta": {
123
123
  "ranking": 1
@@ -135,7 +135,7 @@
135
135
  "PROJECT_UNDEFINED": {
136
136
  "code": "PROJECT_UNDEFINED",
137
137
  "viewModel": {
138
- "title": "Mon projet n’est pas clair pour le moment"
138
+ "title": "J'ai besoin de plus de temps pour avoir les idées claires sur mon projet"
139
139
  },
140
140
  "meta": {
141
141
  "ranking": 3
@@ -144,7 +144,7 @@
144
144
  "PROJECT_STORE": {
145
145
  "code": "PROJECT_STORE",
146
146
  "viewModel": {
147
- "title": "Je préfère me déplacer directement en magasin"
147
+ "title": "Je préfère un accompagnement en magasin pour préparer mon projet"
148
148
  },
149
149
  "meta": {
150
150
  "ranking": 4
@@ -176,16 +176,42 @@
176
176
  "title": "Merci pour votre réponse",
177
177
  "icon": "https://storage.googleapis.com/project-booster-media/vad/fin-de-parcours/check_80.svg"
178
178
  },
179
- "multiSelect": {
180
- "actions": {
181
- "VALIDATE": {
182
- "label": "Continuer et prendre RDV",
183
- "nextStep": {
184
- "code": "APPOINTMENT_FORM"
185
- }
179
+ "cards": [
180
+ {
181
+ "code": "Estimer votre projet cuisine",
182
+ "viewModel": {
183
+ "url": "https://www.leroymerlin.fr/estimez-le-cout-de-votre-prochaine-cuisine.html?leadSource=Appointment_Qualification&leadSourceDetail=Cuisine",
184
+ "image": "https://media.leroymerlin.fr/Capture/37/bc/a121f7e74212ad2d356fd3cf2c8a/estimer-mon-budget-cuisine5e5d20ae063b330009a4a372.jpg?width=500&auto=webp&crop=16:9",
185
+ "title": "Estimer votre budget cuisine en quelques clics",
186
+ "width": "full",
187
+ "widthFromM": "1of3",
188
+ "widthFromL": "1of3"
189
+ }
190
+ },
191
+ {
192
+ "code": "Découvrir nos gammes de cuisines",
193
+ "viewModel": {
194
+ "url": "https://www.leroymerlin.fr/produits/cuisine/cuisine-equipee-delinia-id/",
195
+ "image": "https://storage.googleapis.com/project-booster-media/kitchen/kitchen-range.jpeg",
196
+ "title": "Découvrir nos gammes de cuisines",
197
+ "width": "full",
198
+ "widthFromM": "1of3",
199
+ "widthFromL": "1of3"
200
+ }
201
+ },
202
+ {
203
+ "code": "Des idées et conseils pour votre cuisine",
204
+ "viewModel": {
205
+ "value": "3",
206
+ "url": "https://www.leroymerlin.fr/inspiration/les-meilleures-idees-pour-chaque-piece/cuisine/",
207
+ "image": "https://storage.googleapis.com/project-booster-media/vad/fin-de-parcours/inspiration-cuisine.jpg",
208
+ "title": "Des idées et conseils pour votre cuisine",
209
+ "width": "full",
210
+ "widthFromM": "1of3",
211
+ "widthFromL": "1of3"
186
212
  }
187
213
  }
188
- }
214
+ ]
189
215
  }
190
216
  },
191
217
  "LMFR_QUESTION_SCENARIO": {
@@ -606,7 +632,17 @@
606
632
  "nextStep": {
607
633
  "conditionals": [
608
634
  {
609
- "conditions": ["runtimeOptions.postQualificationAppointment === true"],
635
+ "conditions": [
636
+ "runtimeOptions.postQualificationAppointment === true && (hasAnswers('LMFR_QUESTION_SCENARIO_ADD_SIMULATION') || hasAnswers('LMFR_QUESTION_ADD_PLAN'))"
637
+ ],
638
+ "nextStep": {
639
+ "code": "__END__"
640
+ }
641
+ },
642
+ {
643
+ "conditions": [
644
+ "runtimeOptions.postQualificationAppointment === true && !hasAnswers('LMFR_QUESTION_SCENARIO_ADD_SIMULATION') && !hasAnswers('LMFR_QUESTION_ADD_PLAN')"
645
+ ],
610
646
  "nextStep": {
611
647
  "code": "START_LATER"
612
648
  }
@@ -735,7 +771,17 @@
735
771
  "nextStep": {
736
772
  "conditionals": [
737
773
  {
738
- "conditions": ["runtimeOptions.postQualificationAppointment === true"],
774
+ "conditions": [
775
+ "runtimeOptions.postQualificationAppointment === true && (hasAnswers('LMFR_QUESTION_SCENARIO_ADD_SIMULATION') || hasAnswers('LMFR_QUESTION_ADD_PLAN'))"
776
+ ],
777
+ "nextStep": {
778
+ "code": "__END__"
779
+ }
780
+ },
781
+ {
782
+ "conditions": [
783
+ "runtimeOptions.postQualificationAppointment === true && !hasAnswers('LMFR_QUESTION_SCENARIO_ADD_SIMULATION') && !hasAnswers('LMFR_QUESTION_ADD_PLAN')"
784
+ ],
739
785
  "nextStep": {
740
786
  "code": "START_LATER"
741
787
  }
@@ -958,7 +1004,7 @@
958
1004
  "icon": "https://storage.googleapis.com/project-booster-media/vad/fin-de-parcours/mail_80.svg",
959
1005
  "description": [
960
1006
  {
961
- "icon": "https://storage.googleapis.com/project-booster-media/vad/lm-advisor.png",
1007
+ "icon": "https://storage.googleapis.com/project-booster-media/vad/fin-de-parcours/picto_plan_pour-espace-projet-compte.png",
962
1008
  "label": "Retrouvez votre projet dans votre compte Leroy Merlin, vous pourrez encore ajouter des plans et photos."
963
1009
  },
964
1010
  {
@@ -971,7 +1017,7 @@
971
1017
  {
972
1018
  "code": "Retrouver mon projet dans mon compte Leroy Merlin",
973
1019
  "viewModel": {
974
- "url": "https://www.leroymerlin.fr/espace-perso/espace-projets.html#/projects/@@PB_PROJECT_ID_FILLER@@",
1020
+ "url": "/espace-perso/espace-projets.html#/projects/@@PB_PROJECT_ID_FILLER@@",
975
1021
  "image": "https://storage.googleapis.com/project-booster-media/vad/fin-de-parcours/Qualif-RDV-VAD-%20Conseiller-de-vente.png",
976
1022
  "title": "Retrouver mon projet dans mon compte Leroy Merlin",
977
1023
  "width": "full",
@@ -1017,7 +1063,7 @@
1017
1063
  "description": [
1018
1064
  {
1019
1065
  "label": "Retrouvez votre projet dans votre compte Leroy Merlin, vous pourrez encore ajouter des plans et photos",
1020
- "icon": "https://storage.googleapis.com/project-booster-media/vad/lm-advisor.png"
1066
+ "icon": "https://storage.googleapis.com/project-booster-media/vad/fin-de-parcours/picto_plan_pour-espace-projet-compte.png"
1021
1067
  },
1022
1068
  {
1023
1069
  "label": "Votre conseiller a accès à vos plans et informations utiles pour le rendez-vous.",
@@ -1051,18 +1097,24 @@
1051
1097
  "viewModel": {
1052
1098
  "title": "Les informations de votre projet ont été mises à jour",
1053
1099
  "icon": "https://storage.googleapis.com/project-booster-media/vad/fin-de-parcours/check_80.svg",
1054
- "description": {
1055
- "label": "Votre conseiller aura accès à vos plans et informations utiles pour le rendez-vous. Si vous souhaitez encore ajouter des plans retrouvez votre projet dans votre compte Leroy Merlin.",
1056
- "icon": "https://storage.googleapis.com/project-booster-media/vad/lm-advisor.png"
1057
- }
1100
+ "description": [
1101
+ {
1102
+ "icon": "https://storage.googleapis.com/project-booster-media/vad/fin-de-parcours/picto_plan_pour-espace-projet-compte.png",
1103
+ "label": "Retrouvez votre projet dans votre compte Leroy Merlin, vous pourrez encore modifier vos informations, ajouter des plans ou des photos."
1104
+ },
1105
+ {
1106
+ "icon": "https://storage.googleapis.com/project-booster-media/vad/lm-advisor.png",
1107
+ "label": "Votre conseiller a accès à vos plans et informations utiles pour le rendez-vous."
1108
+ }
1109
+ ]
1058
1110
  },
1059
1111
  "cards": [
1060
1112
  {
1061
- "code": "Estimer votre budget cuisine en quelques clics",
1113
+ "code": "Retrouver mon projet dans mon compte Leroy Merlin",
1062
1114
  "viewModel": {
1063
- "url": "https://www.leroymerlin.fr/estimez-le-cout-de-votre-prochaine-cuisine.html?leadSource=Appointment_Qualification&leadSourceDetail=Cuisine",
1064
- "image": "https://media.leroymerlin.fr/Capture/37/bc/a121f7e74212ad2d356fd3cf2c8a/estimer-mon-budget-cuisine5e5d20ae063b330009a4a372.jpg?width=500&auto=webp&crop=16:9",
1065
- "title": "Estimer votre budget cuisine en quelques clics",
1115
+ "url": "/espace-perso/espace-projets.html#/projects/@@PB_PROJECT_ID_FILLER@@",
1116
+ "image": "https://storage.googleapis.com/project-booster-media/vad/fin-de-parcours/Qualif-RDV-VAD-%20Conseiller-de-vente.png",
1117
+ "title": "Retrouver mon projet dans mon compte Leroy Merlin",
1066
1118
  "width": "full",
1067
1119
  "widthFromM": "1of3",
1068
1120
  "widthFromL": "1of3"
@@ -17,13 +17,18 @@ const Condition = (
17
17
  }) > -1
18
18
  );
19
19
  };
20
+ const hasAnswers = (questionCode: string) => {
21
+ const questionAnswers = answers.get(questionCode)!;
22
+ return questionAnswers.length > 0;
23
+ };
20
24
  const isValid: boolean = new Function(
21
25
  'isAnswerMatching',
22
26
  'isAnswerContaining',
27
+ 'hasAnswers',
23
28
  'answers',
24
29
  'runtimeOptions',
25
30
  `return ${condition}`,
26
- ).call(this, isAnswerMatching, isAnswerContaining, answers, runtimeOptions);
31
+ ).call(this, isAnswerMatching, isAnswerContaining, hasAnswers, answers, runtimeOptions);
27
32
  return { isValid };
28
33
  };
29
34
 
@@ -19,6 +19,7 @@ export interface AppointmentQualificationState {
19
19
  isAppointmentsError: boolean;
20
20
  currentAppointmentQualification: any;
21
21
  sessions: any;
22
+ isQualificationAborted: boolean;
22
23
  }
23
24
 
24
25
  type AppointmentQualificationContext = ActionContext<AppointmentQualificationState, State>;
@@ -27,6 +28,7 @@ export default {
27
28
  namespaced: true,
28
29
 
29
30
  state: {
31
+ clicRDVBaseUrl: '',
30
32
  createProjectError: null,
31
33
  isLoadingProject: false,
32
34
  appointmentLinkedError: null,
@@ -35,6 +37,7 @@ export default {
35
37
  isAppointmentsError: false,
36
38
  currentAppointmentQualification: {},
37
39
  sessions: {},
40
+ isQualificationAborted: false,
38
41
  },
39
42
 
40
43
  getters: {
@@ -59,6 +62,9 @@ export default {
59
62
  getClicRDVBaseUrl(state: AppointmentQualificationState) {
60
63
  return state.clicRDVBaseUrl;
61
64
  },
65
+ isQualificationAborted(state: AppointmentQualificationState) {
66
+ return state.isQualificationAborted;
67
+ },
62
68
  },
63
69
 
64
70
  mutations: {
@@ -83,6 +89,9 @@ export default {
83
89
  setClicRDVBaseUrl(state: AppointmentQualificationState, baseURL: any) {
84
90
  state.clicRDVBaseUrl = baseURL;
85
91
  },
92
+ setIsQualificationAborted(state: AppointmentQualificationState, isQualificationAborted: boolean) {
93
+ state.isQualificationAborted = isQualificationAborted;
94
+ },
86
95
  },
87
96
 
88
97
  actions: {
@@ -169,10 +178,7 @@ export default {
169
178
  },
170
179
  correlationId: state.sessions.correlationId,
171
180
  };
172
- const result = await linkInhabitantProjectToAppointmentQualification(
173
- state.currentAppointmentQualification.inhabitantProjectId,
174
- data,
175
- );
181
+ const result = await linkInhabitantProjectToAppointmentQualification(state.sessions.inhabitantProjectId, data);
176
182
  commit('setCurrentAppointmentQualification', result);
177
183
  commit('setIsLoadingProject', false);
178
184
  } catch (e) {
@@ -202,5 +208,11 @@ export default {
202
208
  commit('setClicRDVBaseUrl', 'https://www.clicrdv.com');
203
209
  }
204
210
  },
211
+ abortQualification({ commit }: AppointmentQualificationContext, abort: boolean) {
212
+ commit('setIsQualificationAborted', abort);
213
+ if (abort) {
214
+ commit('setCurrentAppointmentQualification', null);
215
+ }
216
+ },
205
217
  },
206
218
  };
@@ -207,10 +207,12 @@ export default {
207
207
  },
208
208
  async loadEstimates({ commit, state }: EstimatesContext, projectId: string) {
209
209
  commit('setIsDisplayed', true);
210
+ commit('setEstimates', []);
210
211
  commit('setCurrentProjectId', projectId);
211
212
  commit('setIsLoadingEstimates', true);
212
213
  commit('setEstimatesLoadError', null);
213
214
  commit('setEstimateCreationError', null);
215
+ commit('setCurrentEstimatesPage', 0);
214
216
 
215
217
  try {
216
218
  const estimates = await getAllEstimates(state.currentEstimatesPage, state.estimatesPerPageCount, projectId);
@@ -235,6 +237,39 @@ export default {
235
237
  commit('setIsLoadingEstimates', false);
236
238
  });
237
239
  },
240
+ async loadMoreEstimates({ commit, state }: EstimatesContext) {
241
+ commit('setIsDisplayed', true);
242
+ commit('setIsLoadingEstimates', true);
243
+ commit('setEstimatesLoadError', null);
244
+ commit('setEstimateCreationError', null);
245
+
246
+ try {
247
+ const estimates = await getAllEstimates(
248
+ state.currentEstimatesPage,
249
+ state.estimatesPerPageCount,
250
+ state.currentProjectId!,
251
+ );
252
+
253
+ if (estimates.results) {
254
+ commit('addEstimates', estimates.results);
255
+ }
256
+
257
+ if (state?.estimates?.length >= estimates.total) {
258
+ commit('setHasStillEstimates', false);
259
+ } else {
260
+ commit('setHasStillEstimates', true);
261
+ }
262
+
263
+ commit('setCurrentEstimatesPage', state.currentEstimatesPage + 1);
264
+ } catch (error) {
265
+ console.error('Failure when loading estimates', error);
266
+ commit('setEstimatesLoadError', error);
267
+ }
268
+
269
+ setTimeout(() => {
270
+ commit('setIsLoadingEstimates', false);
271
+ });
272
+ },
238
273
  async saveEstimate({ commit }: EstimatesContext, estimateToCreate: Estimate) {
239
274
  commit('setIsCreatingEstimate', true);
240
275
  commit('setEstimateCreationError', null);