https://www.wagrain-kleinarl.at/js/mt-addition/mt-addition-bookingsuccess.js

1/* eslint-disable import/no-absolute-path */
2import mwCore from "/js/mw-core/mw-core.js";
3import mwUtility from "/js/mw-core/mw-utility.js";
4
5class mtAdditionBookingSuccess extends mwCore {
6	beforeFirstRender() {
7		const queryString = window.location.search;
8		const urlParams = new URLSearchParams(queryString);
9
10		this._guid = urlParams.get("guid");
11
12		if (!this._guid) {
13			fetch(`/log.api?type=3&message=Booking Success URL error. Guid missing`);
14			return "";
15		}
16
17		this.fetchBookingData();
18
19		let template;
20
21		try {
22			template = this.querySelector(`template`);
23
24			if (template) {
25				this._content = template.innerHTML;
26
27				template.remove();
28			}
29		} catch (error) {
30			console.error(error);
31		}
32	}
33
34	get apibase() {
35		return this.getAttribute(`apibase`);
36	}
37
38	set apibase(val) {
39		this.setAttribute(`apibase`, val);
40	}
41
42	styles() {
43		return [
44			`<link href="/css/styleguide.css" rel="stylesheet">`,
45			`
46				@media all and (min-width: 500px){
47					.content {
48						text-align: center;
49					}
50				}
51			`
52		];
53	}
54
55	render() {
56		if (!this._bookingNumber || !this._email || !this._datefrom) {
57			return "";
58		}
59
60		return `
61			<div class="container layout-margin layout-padding layout-width">
62				<div class="content normal-text">
63					${this._content
64						.replace("%%bookingNumber%%", this._bookingNumber)
65						.replace("%%datefrom%%", this._datefrom)
66						.replace("%%email%%", this._email)}
67				</div>
68			</div>
69		`;
70	}
71
72	fetchBookingData() {
73		const url = `${
74			this.apibase ? this.apibase : `/`
75		}Micado.Tourism.Web/Micado.Tourism.Web.IO.Api.CartApi/GetReservationDetails.api?guid=${
76			this._guid
77		}`;
78
79		fetch(url)
80			.then((response) => response.json())
81			.then((data) => {
82				this._bookingNumber = data.bookingNumber;
83				if (data.dateFrom) {
84					this._datefrom = mwUtility.formatDateToString(
85						new Date(data.dateFrom)
86					);
87				}
88				this._email = data.email;
89
90				if (data && data?.bookingNumber) {
91					this.fireEventTracking(`BOOKINGSUCCESS`, data);
92
93					if (window.dataLayer) {
94						dataLayer.push({
95							'event' : 'GAEvent',
96							'eventCategory' : 'Buchung',
97							'eventLabel' : window.location.href
98						});
99					}
100				}
101
102				this.reRender();
103			});
104	}
105
106	fireEventTracking(action, data) {
107
108		document.body.dispatchEvent(
109			new CustomEvent(`ecommerce-tracking`, {
110				detail: {
111					type: `BOOKING`,
112					action: action,
113					data: data
114				}
115			})
116		);
117
118	}
119
120}
121
122customElements.define(`mt-addition-bookingsuccess`, mtAdditionBookingSuccess);