Интеграция 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: 'ru' });
</script>

Altegio API

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

class AltegioPApiClient
{
    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 рабочих дней.