createHeldReservation( )

1import { reservations } from 'wix-table-reservations.v2';
2
3/* Sample reservationDetails value:
4 * {
5 *   "reservationLocationId": "fab8cc1f-31cf-462f-b5bb-392594624bf2", 
6 *   "startDate": new Date("2024-12-14T15:30:00Z"),
7 *   "partySize": 2
8 * }
9 */
10
11reservations.createHeldReservation(reservationDetails)
12  .then((createdHeldReservation) => {
13    const id = createdHeldReservation._id;
14    const status = createdHeldReservation.status;
15
16    console.log('Success! Created a held reservation:', createdHeldReservation);
17    return createdHeldReservation;
18  })
19  .catch((error) => {
20    console.error(error);
21    // Handle the error
22  });
23
24/* Promise resolves to:
25 * {
26 *   "reservation": {
27 *     "status": "HELD",
28 *     "source": "UNKNOWN",
29 *     "details": {
30 *       "reservationLocationId": "fab8cc1f-31cf-462f-b5bb-392594624bf2",
31 *       "tableIds": [],
32 *       "startDate": "2024-12-14T15:30:00.000Z",
33 *       "endDate": "2024-12-14T17:00:00.000Z",
34 *       "partySize": 2
35 *     },
36 *     "revision": "1",
37 *     "migrationNotes": [],
38 *     "tablesWithReservationConflicts": [],
39 *     "_id": "26bf7609-8bf4-45ac-aef0-dbb3e54f69ad",
40 *     "_createdDate": "2024-01-17T10:07:56.966Z"
41 *   }
42 * }
43 */
44

1/* This example requires the following elements:
2 * A dropdown element named `locationDropdown`.
3 * A dropdown element named `partySizeDropdown`.
4 * A dropdown element named `timeSlotDropdown`.
5 * A button named `confirmButton`.
6 * A text element named `heldReservationNotification`.
7 */
8
9/**********************************************
10 * Backend code - reservationLocations.web.js *
11 **********************************************/
12
13import { Permissions, webMethod } from 'wix-web-module';
14import { locations } from 'wix-business-tools.v2';
15import { elevate } from 'wix-auth';
16
17export const getRestaurantLocation = webMethod(Permissions.Anyone, async (location_id) => {
18  const elevatedGetLocation = elevate(locations.getLocation);
19
20  try {
21     const result = await elevatedGetLocation(location_id);
22     return result;
23   } catch (error) {
24     console.error(error);
25     // Handle the error
26   }
27});
28
29/*************
30 * Page code *
31 *************/
32
33import { reservationLocations } from 'wix-table-reservations.v2';
34import { reservations } from 'wix-table-reservations.v2';
35import { timeSlots } from 'wix-table-reservations.v2';
36
37import { getRestaurantLocation } from 'backend/reservationLocations.web';
38
39$w.onReady(async function () {
40  $w('#timeSlotDropdown').hide();
41  $w('#partySizeDropdown').hide();
42  $w('#confirmButton').hide();
43  $w('#heldReservationNotification').hide();
44
45  //Get the list of reservation locations
46  const myReservationLocationList = await (async () => {
47    try {
48      let fullListObject = await reservationLocations.listReservationLocations();
49      return fullListObject.reservationLocations;
50    } catch (error) {
51     console.error(error);
52     // Handle the error
53   }
54  })();
55
56  //Create an array to hold names and values for our locations dropdown list
57  let locationDropdownOptions = [];
58  for (const object in myReservationLocationList){
59    //Use the _id stored in the reservation location's location object to get the location's name from the `locations` service
60    const locationObject = await getRestaurantLocation(myReservationLocationList[object].location._id);
61    locationDropdownOptions.push({
62      "label": locationObject.name, 
63      "value": myReservationLocationList[object]._id
64    })	
65  }
66  //Populate our dropdown list with the array
67  $w("#locationDropdown").options = locationDropdownOptions;
68
69  //Create an array to hold numbers and values for our party size dropdown list
70  let partySizeDropdownOptions = [];
71  for (let i = 1; i<10; i++){
72    partySizeDropdownOptions.push({
73      "label": String(i), 
74      "value": String(i)
75    })	
76  }
77  //Populate our dropdown list with the array
78  $w("#partySizeDropdown").options = partySizeDropdownOptions;
79
80  $w('#locationDropdown').onChange( (event) => {
81    if ($w('#locationDropdown').value) {
82      $w('#partySizeDropdown').show();
83      $w('#timeSlotDropdown').hide()
84      $w('#confirmButton').hide();
85    }
86  });
87
88  $w('#partySizeDropdown').onChange( async (event) => {
89    if ($w('#locationDropdown').value) {
90      $w('#timeSlotDropdown').show()
91      $w('#confirmButton').hide();
92
93      const timeSlotDetails = {
94        "reservationLocationId": $w('#locationDropdown').value, 
95        "date": new Date(),
96        "partySize": parseInt($w('#partySizeDropdown').value)
97      };
98
99      const timeSlotOptions = {
100        "duration": 30,
101	"slotsAfter": 8,
102	"slotsBefore": 0
103      };
104
105      //Get the list of time slots according to the details and options above
106      const availableTimeSlots = await (async () => {
107        try {
108          let fullListObject = await timeSlots.getTimeSlots(timeSlotDetails.reservationLocationId, timeSlotDetails.date, timeSlotDetails.partySize, timeSlotOptions);
109          return fullListObject.timeSlots;
110        } catch (error) {
111          console.error(error);
112          // Handle the error
113        }
114      })();
115
116      //Create an array to hold numbers and values for our time slot dropdown list
117      let timeSlotDropdownOptions = [];
118      for (const timeSlot in availableTimeSlots){
119        if(availableTimeSlots[timeSlot].status == "AVAILABLE"){
120          timeSlotDropdownOptions.push({
121            "label": String(availableTimeSlots[timeSlot].startDate), 
122            "value": String(availableTimeSlots[timeSlot].startDate)
123          })
124        }	
125      }
126      //Populate our dropdown list with the array
127      $w("#timeSlotDropdown").options = timeSlotDropdownOptions;
128    }
129  });
130
131  $w('#timeSlotDropdown').onChange( async (event) => {
132    if ($w('#timeSlotDropdown').value) {
133      $w('#confirmButton').show();
134    }
135  });
136
137  $w('#confirmButton').onClick( async (event) => {
138    //Get the list of time slots according to the details and options above
139    
140    const createdHeldReservation = await (async () => {
141      try {
142        const reservationDetails = {
143          "reservationLocationId": $w('#locationDropdown').value, 
144          "startDate": new Date($w("#timeSlotDropdown").value),
145          "partySize": parseInt($w('#partySizeDropdown').value)
146        };
147
148        return await reservations.createHeldReservation(reservationDetails);
149      } catch (error) {
150        console.error(error);
151        // Handle the error
152      }
153    })();
154
155    if(createdHeldReservation){
156      $w('#heldReservationNotification').text = "Held reservation created successfully."
157      $w('#heldReservationNotification').show();
158    }
159  });
160});
161

1import { Permissions, webMethod } from 'wix-web-module';
2import { reservations } from 'wix-table-reservations.v2';
3
4/* Sample reservationDetails value:
5 * {
6 *   "reservationLocationId": "fab8cc1f-31cf-462f-b5bb-392594624bf2", 
7 *   "startDate": new Date("2024-12-14T15:30:00Z"),
8 *   "partySize": 2
9 * }
10 */
11
12export const myCreateContactFunction = webMethod(Permissions.Anyone, async (reservationDetails) => {
13  try {
14    const createdHeldReservation = await reservations.createHeldReservation(reservationDetails);
15
16    const id = createdHeldReservation._id;
17    const status = createdHeldReservation.status;
18
19    console.log('Success! Created a held reservation:', createdHeldReservation);
20    return createdHeldReservation;
21  } catch (error) {
22    console.error(error);
23    // Handle the error
24  }
25
26});