integration-web-core--socle 1.4.2

package/cdp-due--customer-space-module-master/src/contents/loyalty/LoyaltyPage.vue

@@ -0,0 +1,262 @@
+<script setup>
+	import { computed } from 'vue';
+	import MButton from '@mozaic-ds/vue-3/src/components/button/MButton.vue';
+	import moment from 'moment';
+
+	import DownloadLoyaltyCardButton from '@/components/DownloadLoyaltyCardButton.vue';
+	import MlContainer from '@/components/grid/MlContainer.vue';
+	import MlFlexy from '@/components/grid/MlFlexy.vue';
+	import CardWithIcon from '@/components/ipn-commons/cards/CardWithIcon.vue';
+	import CardWithLabel from '@/components/ipn-commons/cards/CardWithLabel.vue';
+	import LoyaltyNotification from '@/components/ipn-commons/LoyaltyNotification/LoyaltyNotification.vue';
+	import { CUSTOMER_INFO_LOADER } from '@/components/loading/loaders';
+	import LoadingContainer from '@/components/loading/LoadingContainer.vue';
+	import SubTitle from '@/components/SubTitle.vue';
+	import Title from '@/components/Title.vue';
+	import { useCustomerInfo } from '@/composables/useCustomerInfo';
+	import useCustomerLoyalty from '@/composables/useCustomerLoyalty';
+	import useWindowResize from '@/composables/useWindowResize';
+	import { EMPLOYEE_FUNDING_ID, EMPLOYEE_ID, HOUSING_PASS_ID } from '@/constants/loyaltyType';
+	import LoyaltyCardAdvantages from '@/contents/loyalty/loyalty-card/loyalty-card-advantages/LoyaltyCardAdvantages.vue';
+	import LoyaltyCardEverywhere from '@/contents/loyalty/loyalty-card/LoyaltyCardEverywhere.vue';
+	import LoyaltyCardHeader from '@/contents/loyalty/loyalty-card/LoyaltyCardHeader.vue';
+	import LoyaltyCardOwned from '@/contents/loyalty/loyalty-card/LoyaltyCardOwned.vue';
+	import LoyaltyCardQuestion from '@/contents/loyalty/loyalty-card/LoyaltyCardQuestion.vue';
+	import advantagesCard from '@/contents/loyalty/loyalty-page-components/advantageConfig';
+	import { LOYALTY_ADHESION_ROUTE } from '@/contents/loyalty/routes';
+	import { formatter } from '@/utils/formatter';
+
+	import LoyaltyCardBasic from '../dashboard/loyalty-card/LoyaltyCardBasic.vue';
+
+	import LoyaltyStop from './loyalty-page-components/loyalty-stop/LoyaltyStop.vue';
+	import MyAdvantages from './loyalty-page-components/my-advantages/MyAdvantages.vue';
+	import DiscountContainer from './loyalty-page-components/my-discount/DiscountContainer.vue';
+
+	const { loyalty, goToLoyaltyPage } = useCustomerLoyalty();
+	const { customerInfo } = useCustomerInfo();
+
+	const hasLoyalty = computed(() => loyalty.value?.hasLoyalty);
+	const hasLoyaltyExpired = computed(() => loyalty.value?.expired);
+
+	const remembershipAvailable = computed(() => loyalty.value?.remembershipAvailable);
+	const isPassMaison = computed(() => loyalty.value?.type?.id === HOUSING_PASS_ID);
+	const isLoyaltyEmployee = computed(
+		() =>
+			loyalty.value?.type?.id === EMPLOYEE_ID ||
+			loyalty.value?.type?.id === EMPLOYEE_FUNDING_ID,
+	);
+
+	const labels = [
+		{
+			code: 'DBVU',
+			key: 'customer-space_loyalty-page_my-discount__welcome-discount--label',
+		},
+		{
+			code: 'D10F',
+			key: 'customer-space_loyalty-page_my-discount__10%-discount--label',
+		},
+		{
+			code: 'D10P',
+			key: 'customer-space_loyalty-page_my-discount__10%-passion-discount--label',
+		},
+		{
+			code: 'D15F',
+			key: 'customer-space_loyalty-page_my-discount__15%-collab-discount--label',
+		},
+		{
+			code: 'D10C',
+			key: 'customer-space_loyalty-page_my-discount__10%-collab-discount--label',
+
+			// },
+			// A décommenter lorsque  lyse sera prêt de leur côté.Actuellemnent, on ne les prends pas en compte
+			// {
+			//   code: 'VOUCHER_LMFR',
+			//   key: 'customer-space_loyalty-page_my-discount__VOUCHER_LMFR-collab-discount--label'
+			// },
+			// {
+			//   code: 'VOUCHER_LMFR_VIP',
+			//   key: 'customer-space_loyalty-page_my-discount_VOUCHER_LMFR_VIP-collab-discount--label'
+		},
+	];
+
+	const findLabel = (modelCode) => labels.find((label) => label.code === modelCode);
+
+	const rewards = computed(() => {
+		const rewardsFormatted = loyalty.value?.rewards?.reduce((accu, reward) => {
+			const label = findLabel(reward.modelCode);
+
+			if (label) {
+				accu.push({
+					percentage: reward.attributes.value,
+					expiredDate: formatter(reward.attributes.validityEndDate, 'date'),
+					label: label.key,
+				});
+			}
+			return accu;
+		}, []);
+
+		if (customerInfo.value?.movingDate?.isRewardEligible) {
+			const moveInOffer = {
+				percentage: 10,
+				expiredDate: formatter(
+					moment(customerInfo.value?.movingDate?.date, 'YYYY-MM-DD').add(6, 'M'),
+					'date',
+				),
+				label: 'customer-space_loyalty-page_my-discount__10%-move-in-offer--label',
+				link: {
+					href: 'https://media.leroymerlin.fr/Capture/94/77/3a4b630b4764975f79c177388c89/informations-carte-maison-leroy-merlin.pdf',
+					content: 'customer-space_loyalty-page_move-in_pdf--label',
+					icon: 'DownloadWeb48',
+					target: '_blank',
+				},
+			};
+			return [...rewardsFormatted, moveInOffer];
+		}
+		return rewardsFormatted;
+	});
+
+	const { isMobile } = useWindowResize();
+
+	const myHomePicturePath = computed(() =>
+		isMobile.value
+			? '/static/img/09_MyHome_Mobile_Background.png'
+			: '/static/img/09_MyHome_Desktop_Background.png',
+	);
+</script>
+
+<template>
+	<LoadingContainer :loader="CUSTOMER_INFO_LOADER" component="div" class="loyalty-page__loader">
+		<div
+			v-if="!hasLoyalty || (hasLoyaltyExpired && !remembershipAvailable) || isPassMaison"
+			:class="isPassMaison ? 'loyalty-page' : 'loyalty-page no-pass'"
+		>
+			<MlContainer class="loyalty-page__container">
+				<Title class="loyalty-page--title">
+					{{ $t('customer-space_loyalty-page--title') }}
+				</Title>
+
+				<LoyaltyCardHeader v-if="isPassMaison" />
+
+				<LoyaltyCardOwned />
+
+				<LoyaltyCardAdvantages @trigger-loyalty="goToLoyaltyPage" />
+			</MlContainer>
+
+			<LoyaltyCardEverywhere class="loyalty-page-everywhere" />
+
+			<MlContainer fluid>
+				<LoyaltyCardQuestion />
+			</MlContainer>
+
+			<LoyaltyStop />
+		</div>
+
+		<div v-else>
+			<MlContainer>
+				<LoyaltyNotification />
+
+				<Title class="loyalty-page--title">
+					{{ $t('customer-space_loyalty-page--title') }}
+				</Title>
+
+				<div class="loyalty-page__card-basic__container">
+					<LoyaltyCardBasic
+						:class="
+							hasLoyaltyExpired && remembershipAvailable
+								? 'loyalty-page__card-basic loyalty-page__card-basic--disabled'
+								: 'loyalty-page__card-basic'
+						"
+					/>
+
+					<MButton
+						is="a"
+						v-if="remembershipAvailable"
+						class="loyalty-page--button"
+						:label="$t('customer-space_loyalty-page_reenroll--button')"
+						:href="LOYALTY_ADHESION_ROUTE"
+						size="m"
+					/>
+
+					<DownloadLoyaltyCardButton
+						v-if="hasLoyalty && !hasLoyaltyExpired"
+						:label="$t('customer-space_loyalty-page_download-card--button')"
+					></DownloadLoyaltyCardButton>
+				</div>
+			</MlContainer>
+
+			<DiscountContainer
+				v-if="!!rewards"
+				:rewards="rewards"
+				:has-loyalty-expired="hasLoyaltyExpired"
+				:is-collab="isLoyaltyEmployee"
+			/>
+
+			<section v-if="isLoyaltyEmployee" class="employee-advantage">
+				<MlContainer>
+					<div class="section-header">
+						<SubTitle>
+							{{ $t('customer-space_dashboard_loyalty-advantage-card-title') }}
+						</SubTitle>
+
+						<p>
+							{{ $t('customer-space_dashboard_loyalty-advantage-card-subtitle') }}
+						</p>
+					</div>
+
+					<MlFlexy gutter>
+						<CardWithIcon
+							v-for="(advantageCard, id) in advantagesCard"
+							:key="id"
+							:content="advantageCard"
+						/>
+					</MlFlexy>
+				</MlContainer>
+
+				<MlContainer class="mu-mt-300">
+					<CardWithLabel
+						label="common_item-list_macro--filters-to-find-more"
+						content="customer-space_dashboard_loyalty-employee-advantages"
+						link-label="customer-space_dashboard_loyalty-employee-advantages-label-link"
+						link-href="https://sites.google.com/leroymerlin.fr/lm-moi/mon-quotidien-ma-vie-en-entreprise/je-b%C3%A9n%C3%A9ficie-davantages-collaborateurs"
+					/>
+				</MlContainer>
+
+				<MlContainer>
+					<section class="mu-mt-300">
+						<MlFlexy class="my-home-ad">
+							<picture>
+								<source :srcset="myHomePicturePath" alt="MyHome background" />
+
+								<img :src="myHomePicturePath" alt="MyHome background" />
+							</picture>
+						</MlFlexy>
+					</section>
+				</MlContainer>
+			</section>
+
+			<MyAdvantages />
+
+			<LoyaltyStop />
+		</div>
+	</LoadingContainer>
+</template>
+
+<style lang="scss">
+	@import 'settings-tools/_all-settings.scss';
+	@import './loyaltyPageStyle.scss';
+
+	.employee-advantage {
+		background-color: $color-grey-100;
+		padding: $mu100 0 $mu200 0;
+	}
+
+	.section-header {
+		margin: $mu200 0;
+	}
+
+	.my-home-ad {
+		img {
+			max-width: 100%;
+		}
+	}
+</style>

package/cdp-due--customer-space-module-master/src/contents/loyalty/adherent-card/LoyaltyAdherentCardPage.no-layout.vue

@@ -0,0 +1,49 @@
+<script setup>
+	import Stepper from '@/components/ipn-commons/stepper/Stepper.vue';
+	import IpnForm from '@/components/ipn-form/IpnForm.vue';
+	import { FORM_NAMES } from '@/constants/form/formNames';
+
+	import { useLoyaltyAdherentPage } from './loyaltyAdherentPage.composable';
+
+	const {
+		loyaltyTitle,
+		isCheckedGdpr,
+		formValues,
+		steps,
+		currentStep,
+		currentStepIndex,
+		passStep,
+		nextStep,
+		onSubmit,
+		setStepDomRef,
+		nextButtonHiddenStepIndexes,
+	} = useLoyaltyAdherentPage();
+</script>
+
+<template>
+	<Stepper
+		:heading-title="loyaltyTitle"
+		:steps="steps"
+		:pass-step="passStep"
+		:hide-button="nextButtonHiddenStepIndexes"
+		:current-step="currentStepIndex"
+		:is-checked-gdpr="isCheckedGdpr"
+		class="mu-mb-250"
+		@next-step="nextStep()"
+		@on-submit="onSubmit()"
+	>
+		<IpnForm
+			:name="FORM_NAMES.LOYALTY_ADHESION_FORM"
+			:values="formValues"
+			:on-submit="onSubmit"
+		>
+			<section class="mu-mt-200">
+				<component
+					:is="currentStep.component"
+					v-bind="currentStep.props"
+					@displayed="setStepDomRef"
+				/>
+			</section>
+		</IpnForm>
+	</Stepper>
+</template>

package/cdp-due--customer-space-module-master/src/contents/loyalty/adherent-card/OnDisplayStepAnalyticsWrapper.vue

@@ -0,0 +1,16 @@
+<script setup>
+	import { onMounted, ref } from 'vue';
+
+	const emit = defineEmits(['displayed']);
+	const forAnalyticsRef = ref(null);
+
+	onMounted(() => {
+		emit('displayed', forAnalyticsRef.value);
+	});
+</script>
+
+<template>
+	<div ref="forAnalyticsRef">
+		<slot></slot>
+	</div>
+</template>

package/cdp-due--customer-space-module-master/src/contents/loyalty/adherent-card/composables/utils/__tests__/defineFormValues.js

@@ -0,0 +1,68 @@
+// import { NO_ACCOUNT } from '@/constants/accountStatus';
+
+// import { defineFormValues } from '../defineFormValues';
+
+// const email = 'registered@email.com';
+// const siret = 'zeijfozief';
+// const legalForm = 'fiejez';
+// const name = 'Big company';
+// const professionalOrganisation = {
+// 	siret,
+// 	legalForm,
+// 	name,
+// };
+// const zipCode = '53000';
+// const mainAddress = {
+// 	zipCode,
+// };
+// const mainPhone = '0123456789';
+// const storeCode = 300;
+
+// // TODO : adapt those test to use the rule method + new param
+
+// describe('an initial form on loyalty selection', () => {
+// 	it('should be empty if no user informations', () => {
+// 		const result = defineFormValues(null);
+// 		expect(result).toBe(undefined);
+// 	});
+// 	it('should use the given email if has no account', () => {
+// 		const customerWithoutAccount = {
+// 			storeCode,
+// 			webUser: { status: NO_ACCOUNT },
+// 			email,
+// 			professionalOrganisation,
+// 		};
+// 		const result = defineFormValues(customerWithoutAccount, mainAddress, mainPhone);
+// 		expect(result).toEqual({
+// 			legalForm,
+// 			login: email,
+// 			name,
+// 			phone: mainPhone,
+// 			siret,
+// 			store: storeCode,
+// 			zipCode,
+// 		});
+// 	});
+// 	it('should be empty if no user informations', () => {
+// 		const customerWithoutAccount = {
+// 			storeCode,
+// 			webUser: { status: 'otherThanNoAccount' },
+// 			email,
+// 			professionalOrganisation,
+// 		};
+// 		const result = defineFormValues(customerWithoutAccount, mainAddress, mainPhone);
+// 		expect(result).toEqual({
+// 			legalForm,
+// 			name,
+// 			phone: mainPhone,
+// 			siret,
+// 			store: storeCode,
+// 			zipCode,
+// 		});
+// 	});
+// });
+describe('FIX THIS', () => {
+	it('should', () => {
+		expect(true).toBe(true);
+	});
+});

package/cdp-due--customer-space-module-master/src/contents/loyalty/adherent-card/constants/notifications.js

@@ -0,0 +1,25 @@
+import { addNotification } from '@/components/ipn-notification-toast/module/actions';
+import { tc } from '@/i18n';
+
+export function onInformationSuccess() {
+	addNotification({
+		type: 'success',
+		title: tc('customer-space-adherent-card-information_success-toast--title'),
+		text: tc('customer-space-adherent-card-information_success-toast--text'),
+	});
+}
+
+export function onLoyaltyCreationSuccess() {
+	addNotification({
+		type: 'success',
+		title: tc('customer-space_loyalty-adherent-card-page_notification_adherent-success--title'),
+		text: tc('customer-space_loyalty-adherent-card-page_notification_adherent-success--text'),
+	});
+}
+export function onLoyaltyCreationError() {
+	addNotification({
+		type: 'danger',
+		title: tc('customer-space_loyalty-adherent-card-page_notification_adherent-error--title'),
+		text: tc('customer-space_loyalty-adherent-card-page_notification_adherent-error--text'),
+	});
+}

package/cdp-due--customer-space-module-master/src/contents/loyalty/adherent-card/constants/storage.js

@@ -0,0 +1 @@
+export const LOYALTY_SIGNUP_REDIRECT = 'loyaltySignupRedirect';

package/cdp-due--customer-space-module-master/src/contents/loyalty/adherent-card/constants/tracking.js

@@ -0,0 +1,83 @@
+export const personalInfosEventData = {
+	onDisplay: {
+		event_name: 'step.display',
+		event_data: {
+			funnel_name: 'loyalty subscription',
+			step_name: 'personal information',
+			step_number: '1',
+			feature_name: 'loyalty program',
+		},
+	},
+	onSubmit: {
+		event_name: 'step.submit',
+		event_data: {
+			funnel_name: 'loyalty subscription',
+			step_name: 'personal information',
+			step_number: '1',
+			feature_name: 'loyalty program',
+		},
+	},
+};
+
+export const additionalInfosStepEventData = {
+	onDisplay: {
+		event_name: 'step.display',
+		event_data: {
+			funnel_name: 'loyalty subscription',
+			step_name: 'additional questions',
+			step_number: '2',
+			feature_name: 'loyalty program',
+		},
+	},
+	onSubmit: {
+		event_name: 'step.submit',
+		event_data: {
+			funnel_name: 'loyalty subscription',
+			step_name: 'additional questions',
+			step_number: '2',
+			step_method: 'continue',
+			feature_name: 'loyalty program',
+		},
+	},
+};
+
+export const preferenceManagementEventData = {
+	onDisplay: {
+		event_name: 'step.display',
+		event_data: {
+			funnel_name: 'loyalty subscription',
+			step_name: 'preference management',
+			step_number: '3',
+			feature_name: 'loyalty program',
+		},
+	},
+	onSubmit: {
+		event_name: 'step.submit',
+		event_data: {
+			funnel_name: 'loyalty subscription',
+			step_name: 'preference management',
+			step_number: '3',
+			feature_name: 'loyalty program',
+		},
+	},
+	joinLoyalty: {
+		event_name: 'loyalty.join',
+		event_data: {
+			origin: 'loyalty subscription',
+			feature_name: 'loyalty program',
+		},
+	},
+};
+
+export function getPreferenceFieldEvent(fieldName, value) {
+	return {
+		event_name: 'step.field',
+		event_data: {
+			funnel_name: 'loyalty subscription',
+			step_name: 'preference management',
+			field_name: fieldName,
+			field_value: value ? 'true' : 'false',
+			feature_name: 'loyalty program',
+		},
+	};
+}

package/cdp-due--customer-space-module-master/src/contents/loyalty/adherent-card/constants/translations.js

@@ -0,0 +1,13 @@
+import { tc } from '@/i18n';
+
+export const labels = {
+	personalInfosStep: tc('customer-space-adherent-stepper-first-step--item--text'),
+	additionalInfosStep: `
+    ${tc('customer-space-adherent-stepper-second-step--item--text')}
+    - <sub class="optional">
+    ${tc('customer-space_form-field--optional')}
+    </sub>
+    `,
+	preferenceManagementStep: tc('customer-space-adherent-stepper-last-step--item--text'),
+	loyaltySelectionStep: tc('customer-space-adherent-stepper-choose-loyalty-step--item--text'),
+};