Інтеграція Altegio для онлайн-запису на сайті

Інтеграція Altegio для онлайн-запису на сайті

Altegio (раніше YCLIENTS Business) — платформа для управління сервісним бізнесом з розширеними можливостями CRM, складського обліку та аналітики. Інтеграція дозволяє вбудувати онлайн-запис Altegio на сайт та синхронізувати дані через API.

Вбудовування віджета

<!-- Віджет Altegio через iframe -->
<iframe
  src="https://widget.altegio.com/widget/[COMPANY_ID]/record?interface=2"
  width="100%"
  height="800"
  frameborder="0"
  allow="geolocation"
></iframe>

<!-- Або попап через JS -->
<script src="https://widget.altegio.com/widgetJS.js"></script>
<button onclick="AltegioPro.booking.open()">Записаться</button>
<script>
  AltegioPro.init({ company_id: 'COMPANY_ID', lang: 'uk' });
</script>

Altegio API

API сумісна з YCLIENTS API v2 — це одна платформа з двома брендами:

class AltegioApiClient
{
    private const BASE_URL = 'https://api.altegio.com/api/v1';

    public function getServices(): array
    {
        return $this->request('GET', "/services/{$this->companyId}")->json('data');
    }

    public function getStaff(): array
    {
        return $this->request('GET', "/staff/{$this->companyId}")->json('data');
    }

    public function getAvailableDates(int $staffId, int $serviceId): array
    {
        return $this->request('GET', "/book_dates/{$this->companyId}", [
            'staff_id'   => $staffId,
            'service_id' => $serviceId,
        ])->json('data');
    }

    public function createRecord(array $data): array
    {
        return $this->request('POST', "/records/{$this->companyId}", $data)->json('data');
    }
}

Кастомна форма запису поверх API

Якщо стандартний віджет не вписується в дизайн сайту — реалізуємо власний UI з використанням Altegio API на бекенді:

function CustomBookingForm() {
  const [step, setStep]       = useState<'service' | 'master' | 'datetime' | 'confirm'>('service');
  const [serviceId, setService] = useState<number | null>(null);
  const [masterId,  setMaster]  = useState<number | null>(null);

  const { data: services } = useQuery({ queryKey: ['services'], queryFn: fetchServices });
  const { data: staff }    = useQuery({
    queryKey: ['staff', serviceId],
    queryFn:  () => fetchStaff(serviceId!),
    enabled:  !!serviceId,
  });

  // ... багатошагова форма
}

Терміни

Вбудовування стандартного віджета: 1 день. Кастомна форма через Altegio API: 4–6 робочих днів.