Narzędzie lokalizacji zapasów

Narzędzie Stock Locator Tool to komponent React, który wyświetla w czasie rzeczywistym ceny i dostępność dla danego numeru części producenta — stany magazynowe, progi cenowe i linki do dystrybutorów — zasilany przez API Octopart. Możesz osadzić go na stronach produktów, w narzędziach zakupowych lub w dowolnej aplikacji React.

Wymagania wstępne

• Projekt React

• Token dostępu OAuth 2.0 z zakresem supply.domain — ten sam token używany do bezpośrednich zapytań do API (zobacz Authorization)

Instalacja

npm i @altiumnexar/stock-locator-tool

Podstawowe użycie

import { StockLocatorTool } from "@altiumnexar/stock-locator-tool";

function MyPage() {
  return (
    <StockLocatorTool
      searchParameters={{ token: "YOUR_ACCESS_TOKEN" }}
    />
  );
}

Powoduje to wyrenderowanie pełnego interfejsu wyszukiwania, w którym użytkownicy mogą wprowadzić dowolny numer MPN, aby zobaczyć aktualne oferty i stany magazynowe.

Tryb pojedynczej części

Aby wstępnie wypełnić część i ukryć pasek wyszukiwania — przydatne na stronie szczegółów produktu:

<StockLocatorTool
  searchParameters={{
    token: "YOUR_ACCESS_TOKEN",
    q: "LM358DR",
    disableSearch: true,
  }}
/>

Obsługa tokenu

Tokeny dostępu wygasają po 24 godzinach. Podczas programowania możesz tymczasowo wpisać token na stałe. W środowisku produkcyjnym pobieraj token z backendu za pomocą mechanizmu client_credentials grant i odświeżaj go przed wygaśnięciem. Nigdy nie ujawniaj swojego Client Secret w kodzie po stronie klienta.

Dalsze informacje

Repozytorium GitHub repository dokumentuje wszystkie dostępne propsy:

• searchParameters — region, waluta, filtry authorized/in-stock, widoczność paska wyszukiwania, limit ofert i inne

• styles — jasny/ciemny motyw, czcionka i pełna dokumentacja niestandardowych tokenów kolorów

• hideColumns — kontrola, które kolumny pojawiają się w tabeli ofert