# Foglalási adatok dinamikus kiírása: állapot, egységek, foglalások száma

> A tétel foglaltsági állapotának, a szabad egységek és a foglalások számának kiírása dinamikus címkékkel és makrókkal a listázásban és az egyoldalas sablonban.

A JetBooking saját dinamikus címkéket és makrót ad a JetEngine-hez. Ezekkel a listázási vagy egyoldalas sablonban kiírhatod, hogy egy tétel szabad-e, hány szabad egysége van, és hányszor foglalták le. Szükséges: Elementor (vagy a blokkszerkesztő), JetEngine és JetBooking. A példák Elementor szerkesztőben szólnak; a blokkszerkesztőben a mezők fölötti **Dynamic Tags** gombbal érheted el ugyanezeket.

## Foglaltsági állapot kiírása

A „Booking Accommodation Status” makró a bejegyzés foglaltsági állapotát írja ki szövegként. Három állapota van:

| Állapot | Mikor jelenik meg |
|---|---|
| Szabad (Available) | A tétel szabad. Ha egyáltalán nincs foglalás az oldalon, minden tétel ezt kapja |
| Függőben (Pending) | A tétel a mai naptól számított hét napon belül szabadul fel |
| Foglalt (Reserved) | A tétel a mai naptól számított hét napnál tovább foglalt |

### A makró beállítása a listázási sablonban

1. Nyisd meg a **JetEngine → Listázások/komponensek** oldalt, és szerkeszd azt a listaelemet, amelyben az állapotot ki szeretnéd írni (vagy készíts újat a [Foglalási példányok megjelenítése rácsban](https://hub.hellowp.io/hu/plugins/jet-booking/megjelenites-foglalasi-peldanyok-racsban/) fejezet szerint).
2. Adj hozzá egy **Heading** elemet (bármilyen más elem is jó, amely a dinamikus makrókat támogatja).
3. A **Title** mező melletti **Dynamic Tags** gombbal válaszd ki a JetBooking szakaszból az „Accommodation Status” makrót.
4. Kattints a kiválasztott makró nevére a beállításai megnyitásához. Itt átírhatod az alapértelmezett feliratokat: **Available Label**, **Pending Label**, **Reserved Label**.
5. Állítsd be a stílust, és mentsd a listaelemet az **Update** gombbal.

A makrót a JetEngine **Makrógenerátorával** is összeállíthatod. Ott a három feliratot, a **Context** és a **Fallback** értéket is megadhatod, és a kész makrót kimásolhatod.

### Az oldalra helyezés

1. Nyisd meg az oldalt, ahol a listát meg szeretnéd jeleníteni, és add hozzá a **Listing Grid** elemet.
2. Válaszd ki a szerkesztett listázási sablont, majd tedd közzé az oldalt.

### Az állapotok színezése

A frontenden az állapot a `status` osztályú `span` elemben jelenik meg, a mostani állapotnak megfelelő másik osztállyal. A színezéshez írj CSS-t a **Megjelenés → Testreszabás → További CSS** oldalra:

```css
span.status.available {
	color: #00ff00
}

span.status.reserved {
	color: #ff0000
}

span.status.pending {
	color: #0000ff
}
```

## Szabad egységek számának kiírása

Ha egy tételnek több egysége van ([Egységek kezelése a vezérlőpultról](https://hub.hellowp.io/hu/plugins/jet-booking/egysegek-es-arazas-egysegek-kezelese/)), kiírhatod, mennyi szabad maradt belőle.

1. Vedd fel az egységeket a tétel szerkesztőjében az **Add Units** (egységek hozzáadása) blokkban: írd a **Number** mezőbe a darabszámot (például 5), és kattints az **Add Units** gombra. A létrehozott egységek az **Available Units** blokkban jelennek meg.
2. Nyisd meg a bejegyzéstípus egyoldalas sablonját, és adj hozzá egy dinamikus címkét támogató elemet (például **Headline**).
3. Kattints a **Dynamic Tag** gombra, görgess a JetEngine szakaszhoz, és válaszd a „JetBooking: Units count” címkét.
4. A címke haladó beállításaiban kitöltheted a **Before**, **After** és **Fallback** mezőt. Ha például az **After** mezőbe „egység” kerül, az érték után ez a szó áll.
5. Frissítsd a sablont.

Az érték a szabad egységeket mutatja az adott napra. Csak az „On hold” (tartva) és „Completed” (teljesített) állapotú foglalásokat veszi figyelembe. Ha például öt egységből hármat már lefoglaltak ugyanarra a napra, a számláló kettőt mutat.

## Foglalások számának kiírása

A „JetBooking: Bookings count” címke megmutatja, hányszor foglalták le a tételt egy adott időszakra.

1. Nyisd meg a **JetEngine → Listázások/komponensek** oldalt, vidd az egérmutatót a foglalási példányok listaelemére, és kattints az **Edit with Elementor** gombra.
2. Húzz be egy **Heading** elemet.
3. Kattints a **Dynamic Tag** gombra, és válaszd a JetEngine szakaszból a „JetBooking: Bookings count” címkét.
4. A címke beállításaiban a **Bookings Period** szakaszban add meg a **Start Date** és **End Date** értéket, a haladó részben pedig a **Before** és **After** szöveget.
5. Tedd közzé a sablont, majd az oldalon használd a **Listing Grid** elemet a listaelemmel.

Ha még nincs foglalás az adott időszakban, a számláló „0”-t ír ki.
