Configurazione dell'interfaccia utente Stablenet

Imposta l'URL del portale Analytics

1. Nella sezione Gestione / Amministrazione / Proprietà predefinite di Stablenet, cerca la proprietà URL del portale Analytics StableNet®.

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

   

Configura 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 (non devono esistere utenti con nomi identici in SKOOR)

CORS (Cross-Origin Resource Sharing)

Per consentire all'interfaccia utente StableNet di inviare richieste a SKOOR Auth e SKOOR Webservice, l'URL StableNet deve essere aggiunto come origine consentita.

Supponendo che l'accesso all'interfaccia utente StableNet avvenga tramite https://stablenet.domain.com:5443, è necessaria la seguente configurazione sul sistema SKOOR:

/etc/opt/eranger/eranger-webservice.cfg

cors.allowed.origins=https://stablenet.domain.com:5443

/etc/opt/erangerer/anger-auth.conf

[cors]
allowed_origins = https://stablenet.domain.com:5443

Poiché SKOOR è integrato utilizzando un IFRAME, l'origine StableNet deve essere impostata come frame ancestor consentito.

/etc/opt/erangerer/eranger-stablenet.conf

<Location "/skoor-dashboard/">
  Header always set Content-Security-Policy "default-src 'self'; base-uri 'self'; object-src 'self'; frame-ancestors 'self' https://stablenet.domain.com:5443; form-action 'self' http://localhost:8181; script-src 'self' maps.googleapis.com maps.gstatic.com; style-src 'self' 'unsafe-inline' fonts.googleapis.com; img-src 'self' data: maps.googleapis.com maps.gstatic.com; font-src 'self' data: fonts.gstatic.com; connect-src 'self' maps.googleapis.com; worker-src 'self' blob:; upgrade-insecure-requests" "expr=%{resp:Content-Type} =~ m#(?:text/html|application/xhtml\+xml|image/svg\+xml)#i"
</Location>

HTTPD, SKOOR Auth e SKOOR Webservice devono essere riavviati per rendere attiva questa impostazione.

systemctl restart httpd && systemctl restart eranger-auth && systemctl restart eranger-webservice

Configurazione dell'interfaccia utente SKOOR

Configurare il gruppo di utenti

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

   

2. Passare a /root /Users

3. Creare un gruppo di utenti in SKOOR

   

4. Inserire il nome del gruppo di utenti Stablenet nel campo Gruppo remoto

   

5. Imposta un ruolo utente che rifletta le autorizzazioni per questo gruppo di utenti

6. Scegliere una pagina iniziale. Questa pagina si apre dopo aver effettuato l'accesso a SKOOR

Icone StableNet®

Installazione standard di SKOOR

Crea una nuova directory favicon:

mkdir /srv/eranger/html/favicons_stablenet

Aggiungere le icone alla nuova directory favicons_stablenet (richiedere l'archivio zip delle icone al supporto SKOOR):

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

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

/opt/eranger/eranger-dashboards/settings.json

{
  "title":"StableNet® Analytics Portal",
  "faviconRoot": "/favicons_stablenet"
}

Installazione Docker Compose

Aggiungere le icone StableNet e i certificati SSL alla sezione dell'ambiente dei servizi eranger-ui del file SKOOR docker-compose.yaml:

• È necessario creare la directory favicons_stablenet e aggiungere gli elementi

• 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 del dashboard alla sezione dell'ambiente dei servizi eranger-webservice del file SKOOR docker-compose.yaml:

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

Tema StableNet®

Accedere alla sezione Impostazioni per modificare il tema del dashboard:

Quindi fare clic sulla scheda Tema:

Imposta 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;
}