UI e stili di StableNet®

Configurazione dell'interfaccia utente di Stablenet

Impostare l'URL del portale analitico

  1. Nella sezione Gestione / Amministrazione / Proprietà predefinite di Stablenet, cercare la proprietà StableNet® Analytics Portal URL.

  2. Modificare la proprietà e impostarla su un indirizzo HTTPS di host SKOOR:

    image-20240308-144939.png

Configurare il gruppo di utenti

  1. Creare un gruppo di utenti in Gestione/Amministrazione/Utenti/Clienti.

  2. Aggiungere gli utenti al gruppo nella sezione Membri del gruppo (gli utenti con nomi identici non devono esistere in SKOOR).

Configurazione dell'interfaccia utente di SKOOR

Configurazione del gruppo di utenti

  1. Nell'interfaccia utente di SKOOR, passare al componente Engine

    image-20240515-113724.png
  2. Navigare in /root /Utenti

  3. Creare un gruppo di utenti in SKOOR

    image-20240515-114336.png
  4. Inserire il nome del gruppo di utenti Stablenet nel campo Gruppo remoto

    image-20240515-114254.png
  5. Impostare un ruolo utente che rifletta le autorizzazioni per questo gruppo di utenti.

  6. Scegliere una pagina iniziale. Questa pagina si apre dopo il login in SKOOR

Icone StableNet

Installazione standard di SKOOR

Creare una nuova cartella favicon:

mkdir /srv/eranger/html/favicons_stablenet

Aggiungere le icone alla nuova directory favicons_stablenet (chiedere al supporto SKOOR un archivio zip inconsistente):

unzip stablenet_favicons.zip -d /srv/eranger/html/favicons_stablenet/

Per configurare le Dashboard di SKOOR in modo che utilizzino le nuove icone, aggiungere o modificare i parametri title e faviconRoot nel file settings.json:

/opt/eranger/eranger-dashboards/settings.json
{
  "title":"StableNet® Analytics Portal",
  "faviconRoot": "/favicons_stablenet"
}

Installazione di Docker Compose

Aggiungere le icone StableNet e i certificati SSL alla sezione eranger-ui services environment del file SKOOR docker-compose.yaml:

  • La directory favicons_stablenet deve essere creata e gli elementi devono essere aggiunti.

  • I percorsi dei certificati devono essere modificati in posizioni valide del sistema host.

      - "${PERSISTENT_FS}/engine/favicons_stablenet:/srv/eranger/html/favicons_stablenet"
      - "${PERSISTENT_FS}/ssl/fullchain.pem:/etc/pki/tls/certs/localhost.crt"
      - "${PERSISTENT_FS}/ssl/privkey.pem:/etc/pki/tls/private/localhost.key"

Aggiungere le icone e il titolo della dashboard alla sezione dell'ambiente SKOOR Webservice del docker-compose.yaml:

      - SKOOR_DASHBOARD_title=StableNet® Analytics Portal
      - SKOOR_DASHBOARD_faviconRoot=/favicons_stablenet
      - SKOOR_DASHBOARD_etlService=true

Tema StableNet

Passare alla sezione Impostazioni per modificare il tema della dashboard:

image-20240905-065056.png

Fare clic sulla scheda Tema:

image-20240905-065237.png

Impostare i colori dell'interfaccia utente del tema come segue:

  • Tinta di sfondo (chiara): #a9a9a9

  • Accento 1 (chiaro e scuro): #54e0cc

CSS

div.layout-footer {
  display: none;
}

body.plain.stablenet.dark {
  background-color: #2a2a2a;
}

body.plain.stablenet .layout-titlebar {
  display: flex !important;
  height: 48px;
  padding-left: 20px !important;
}

body.plain.stablenet .layout-titlebar-actions {
  display: none;
}

body.plain.stablenet .layout-titlebar .dashboard-title {
  padding-left: 0 !important;
}

body.plain.stablenet .layout-titlebar .dashboard-title h1 {
  font-size: 1.2em;
  color: rgb(0, 40, 70);
  font-weight: 600;
}

body.plain.stablenet.dark .layout-titlebar .dashboard-title h1 {
  color: var(--color-text);
}

body.plain.stablenet .layout-titlebar .date-picker-value {
  font-size: 1.2em;
}

body.plain.stablenet .layout-titlebar .date-picker-value h1 {
  min-width: 200px; 
}

body.plain.stablenet .layout-content-sidebar-backdrop {
  display: none;   
}

@media (max-width: 992px)
html:not(.print) body.plain.stablenet .sidebar-visible .layout-content-sidebar-backdrop {
    display: none; 
}

body.stablenet .widget.date_picker svg {
  fill: #115797;
}

body.stablenet.dark .widget.date_picker svg {
  fill: #00cccc;
}