Risolto merge conflict in setup-1549dev.md
This commit is contained in:
Giuseppe De Franceschi
commit
f195ca80a2
|
|
@ -0,0 +1,380 @@
|
|||
# Setup VM Proxmox per AI Documentazione MD + Supporto SysmacStudio
|
||||
|
||||
## Specifiche VM Consigliate
|
||||
|
||||
### Hardware VM
|
||||
- **RAM**: 16GB (12GB per AI + 4GB sistema)
|
||||
- **CPU**: 6-8 cores
|
||||
- **Storage**: 100GB SSD
|
||||
- **OS**: Ubuntu 22.04 LTS Server + Desktop Environment leggero
|
||||
|
||||
### Motivazione Specs
|
||||
- SysmacStudio può essere pesante se usato tramite Wine/VM Windows
|
||||
- I modelli AI per programmazione PLC richiedono più context
|
||||
|
||||
## Installazione Base Sistema
|
||||
|
||||
```bash
|
||||
# Update sistema
|
||||
sudo apt update && sudo apt upgrade -y
|
||||
|
||||
# Installa desktop environment leggero
|
||||
sudo apt install ubuntu-desktop-minimal -y
|
||||
|
||||
# Strumenti sviluppo
|
||||
sudo apt install git curl wget build-essential python3-pip nodejs npm -y
|
||||
|
||||
# Docker per container AI
|
||||
sudo apt install docker.io docker-compose -y
|
||||
sudo usermod -aG docker $USER
|
||||
```
|
||||
|
||||
## Setup Ollama per Documentazione + PLC
|
||||
|
||||
```bash
|
||||
# Installa Ollama
|
||||
curl -fsSL https://ollama.ai/install.sh | sh
|
||||
|
||||
# Modelli specializzati
|
||||
ollama pull codellama:13b-instruct # Per programmazione generale
|
||||
ollama pull deepseek-coder:6.7b # Ottimo per documentazione tecnica
|
||||
ollama pull mistral:7b-instruct # Buono per spiegazioni tecniche
|
||||
ollama pull phind-codellama:34b # Se hai RAM sufficiente, eccellente per coding
|
||||
```
|
||||
|
||||
## Configurazione Ambiente Documentazione
|
||||
|
||||
```bash
|
||||
# Node.js per Docusaurus/GitLab Pages
|
||||
npm install -g @docusaurus/core @docusaurus/preset-classic
|
||||
|
||||
# Python tools per processing
|
||||
pip3 install markdown beautifulsoup4 pyyaml jinja2
|
||||
|
||||
# Strumenti markdown avanzati
|
||||
npm install -g markdownlint-cli prettier
|
||||
```
|
||||
|
||||
## Script Automatizzazione Documentazione
|
||||
|
||||
### Script Generatore MD (`generate_docs.py`)
|
||||
```python
|
||||
#!/usr/bin/env python3
|
||||
import os
|
||||
import requests
|
||||
import json
|
||||
from datetime import datetime
|
||||
|
||||
class OllamaDocGenerator:
|
||||
def __init__(self):
|
||||
self.ollama_url = "http://localhost:11434/api/generate"
|
||||
self.model = "deepseek-coder:6.7b"
|
||||
|
||||
def generate_md_page(self, topic, context=""):
|
||||
prompt = f"""
|
||||
Crea una pagina di documentazione Markdown per: {topic}
|
||||
|
||||
Context: {context}
|
||||
|
||||
La pagina deve includere:
|
||||
- Header con metadata frontmatter
|
||||
- Introduzione
|
||||
- Sezioni tecniche dettagliate
|
||||
- Esempi pratici
|
||||
- Note e warning box
|
||||
- Collegamenti correlati
|
||||
|
||||
Formato output: Markdown puro compatibile con Docusaurus
|
||||
"""
|
||||
|
||||
payload = {
|
||||
"model": self.model,
|
||||
"prompt": prompt,
|
||||
"stream": False,
|
||||
"options": {
|
||||
"temperature": 0.3,
|
||||
"top_p": 0.9
|
||||
}
|
||||
}
|
||||
|
||||
response = requests.post(self.ollama_url, json=payload)
|
||||
if response.status_code == 200:
|
||||
return response.json()["response"]
|
||||
return None
|
||||
|
||||
def create_plc_documentation(self, program_path):
|
||||
# Analizza file SysmacStudio e genera docs
|
||||
# Placeholder per logica più complessa
|
||||
pass
|
||||
|
||||
# Uso
|
||||
generator = OllamaDocGenerator()
|
||||
content = generator.generate_md_page(
|
||||
"Configurazione I/O SysmacStudio",
|
||||
"Documentazione per configurazione moduli I/O in ambiente industriale"
|
||||
)
|
||||
|
||||
with open("docs/sysmac-io-config.md", "w") as f:
|
||||
f.write(content)
|
||||
```
|
||||
|
||||
### Script Assistente PLC (`plc_assistant.py`)
|
||||
```python
|
||||
#!/usr/bin/env python3
|
||||
import requests
|
||||
|
||||
class PLCAssistant:
|
||||
def __init__(self):
|
||||
self.ollama_url = "http://localhost:11434/api/generate"
|
||||
self.model = "codellama:13b-instruct"
|
||||
|
||||
def analyze_ladder_code(self, code_snippet):
|
||||
prompt = f"""
|
||||
Analizza questo codice Ladder Logic di SysmacStudio:
|
||||
|
||||
{code_snippet}
|
||||
|
||||
Fornisci:
|
||||
1. Spiegazione della logica
|
||||
2. Possibili ottimizzazioni
|
||||
3. Potenziali problemi
|
||||
4. Best practices Omron
|
||||
5. Documentazione suggerita
|
||||
|
||||
Rispondi in italiano con terminologia tecnica PLC.
|
||||
"""
|
||||
|
||||
payload = {
|
||||
"model": self.model,
|
||||
"prompt": prompt,
|
||||
"stream": False
|
||||
}
|
||||
|
||||
response = requests.post(self.ollama_url, json=payload)
|
||||
return response.json()["response"] if response.status_code == 200 else None
|
||||
|
||||
def suggest_structured_text(self, requirements):
|
||||
prompt = f"""
|
||||
Crea codice Structured Text per SysmacStudio basato su questi requisiti:
|
||||
|
||||
{requirements}
|
||||
|
||||
Il codice deve:
|
||||
- Seguire standard IEC 61131-3
|
||||
- Usare convenzioni Omron
|
||||
- Includere commenti esplicativi
|
||||
- Gestire error handling
|
||||
- Essere modulare e riutilizzabile
|
||||
"""
|
||||
# Implementazione simile...
|
||||
pass
|
||||
```
|
||||
|
||||
## Configurazione SysmacStudio Support
|
||||
|
||||
### Wine per SysmacStudio (se necessario)
|
||||
```bash
|
||||
# Installa Wine per eseguire SysmacStudio
|
||||
sudo apt install wine64 winetricks -y
|
||||
|
||||
# Configura wine per applicazioni Omron
|
||||
winecfg
|
||||
```
|
||||
|
||||
### VM Windows Nested (Alternativa)
|
||||
```bash
|
||||
# Se preferisci VM Windows dentro Proxmox per SysmacStudio
|
||||
# Configura passthrough USB per programmatori Omron
|
||||
# Abilita nested virtualization nel host Proxmox
|
||||
```
|
||||
|
||||
## Web Interface per AI Assistant
|
||||
|
||||
### Simple Flask App (`web_assistant.py`)
|
||||
```python
|
||||
from flask import Flask, render_template, request, jsonify
|
||||
import requests
|
||||
|
||||
app = Flask(__name__)
|
||||
|
||||
@app.route('/')
|
||||
def index():
|
||||
return render_template('assistant.html')
|
||||
|
||||
@app.route('/generate_docs', methods=['POST'])
|
||||
def generate_docs():
|
||||
topic = request.json.get('topic')
|
||||
context = request.json.get('context', '')
|
||||
|
||||
# Chiamata a Ollama
|
||||
payload = {
|
||||
"model": "deepseek-coder:6.7b",
|
||||
"prompt": f"Crea documentazione MD per: {topic}. Context: {context}",
|
||||
"stream": False
|
||||
}
|
||||
|
||||
response = requests.post("http://localhost:11434/api/generate", json=payload)
|
||||
|
||||
if response.status_code == 200:
|
||||
return jsonify({"content": response.json()["response"]})
|
||||
return jsonify({"error": "Errore generazione"}), 500
|
||||
|
||||
@app.route('/analyze_plc', methods=['POST'])
|
||||
def analyze_plc():
|
||||
code = request.json.get('code')
|
||||
# Logica analisi PLC con Ollama
|
||||
# ...
|
||||
return jsonify({"analysis": "Analisi completata"})
|
||||
|
||||
if __name__ == '__main__':
|
||||
app.run(host='0.0.0.0', port=5000, debug=True)
|
||||
```
|
||||
|
||||
## Template HTML per Web Interface
|
||||
|
||||
### `templates/assistant.html`
|
||||
```html
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>AI Assistant - Documentazione & PLC</title>
|
||||
<meta charset="utf-8">
|
||||
<style>
|
||||
body { font-family: Arial, sans-serif; margin: 20px; }
|
||||
.container { max-width: 1200px; margin: 0 auto; }
|
||||
.section { margin-bottom: 30px; padding: 20px; border: 1px solid #ddd; }
|
||||
textarea { width: 100%; height: 200px; }
|
||||
button { padding: 10px 20px; background: #007cba; color: white; border: none; }
|
||||
.output { background: #f5f5f5; padding: 15px; margin-top: 10px; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="container">
|
||||
<h1>AI Assistant - Documentazione & SysmacStudio</h1>
|
||||
|
||||
<div class="section">
|
||||
<h2>Generatore Documentazione MD</h2>
|
||||
<input type="text" id="topic" placeholder="Argomento documentazione">
|
||||
<textarea id="context" placeholder="Contesto aggiuntivo..."></textarea>
|
||||
<button onclick="generateDocs()">Genera Documentazione</button>
|
||||
<div class="output" id="docs-output"></div>
|
||||
</div>
|
||||
|
||||
<div class="section">
|
||||
<h2>Analizzatore Codice PLC</h2>
|
||||
<textarea id="plc-code" placeholder="Incolla qui il codice Ladder/ST..."></textarea>
|
||||
<button onclick="analyzePLC()">Analizza Codice</button>
|
||||
<div class="output" id="plc-output"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
async function generateDocs() {
|
||||
const topic = document.getElementById('topic').value;
|
||||
const context = document.getElementById('context').value;
|
||||
|
||||
const response = await fetch('/generate_docs', {
|
||||
method: 'POST',
|
||||
headers: {'Content-Type': 'application/json'},
|
||||
body: JSON.stringify({topic, context})
|
||||
});
|
||||
|
||||
const data = await response.json();
|
||||
document.getElementById('docs-output').innerHTML =
|
||||
'<pre>' + data.content + '</pre>';
|
||||
}
|
||||
|
||||
async function analyzePLC() {
|
||||
const code = document.getElementById('plc-code').value;
|
||||
|
||||
const response = await fetch('/analyze_plc', {
|
||||
method: 'POST',
|
||||
headers: {'Content-Type': 'application/json'},
|
||||
body: JSON.stringify({code})
|
||||
});
|
||||
|
||||
const data = await response.json();
|
||||
document.getElementById('plc-output').innerHTML =
|
||||
'<pre>' + data.analysis + '</pre>';
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
```
|
||||
|
||||
## Integrazione GitLab CI/CD
|
||||
|
||||
### `.gitlab-ci.yml` per auto-deploy
|
||||
```yaml
|
||||
stages:
|
||||
- generate-docs
|
||||
- build
|
||||
- deploy
|
||||
|
||||
generate-docs:
|
||||
image: python:3.9
|
||||
stage: generate-docs
|
||||
script:
|
||||
- pip install requests pyyaml
|
||||
- python scripts/auto_generate_docs.py
|
||||
artifacts:
|
||||
paths:
|
||||
- docs/generated/
|
||||
|
||||
build-site:
|
||||
image: node:18
|
||||
stage: build
|
||||
script:
|
||||
- npm ci
|
||||
- npm run build
|
||||
artifacts:
|
||||
paths:
|
||||
- build/
|
||||
|
||||
pages:
|
||||
stage: deploy
|
||||
script:
|
||||
- cp -r build/* public/
|
||||
artifacts:
|
||||
paths:
|
||||
- public/
|
||||
only:
|
||||
- main
|
||||
```
|
||||
|
||||
## Comandi Utili
|
||||
|
||||
```bash
|
||||
# Avvia tutti i servizi
|
||||
./start_services.sh
|
||||
|
||||
# Genera documentazione automatica
|
||||
python3 generate_docs.py --topic "Motion Control" --output docs/
|
||||
|
||||
# Analizza progetto SysmacStudio
|
||||
python3 plc_assistant.py --analyze project.smc
|
||||
|
||||
# Deploy su GitLab Pages
|
||||
git add . && git commit -m "Update docs" && git push
|
||||
```
|
||||
|
||||
## Note Aggiuntive
|
||||
|
||||
- **Backup regolare**: I modelli AI scaricati occupano spazio
|
||||
- **Monitoring risorse**: Tieni d'occhio RAM/CPU durante inferenza
|
||||
- **Versioning**: Mantieni versioni diverse dei modelli per test
|
||||
- **Security**: Accesso web interface solo da rete fidata
|
||||
- **Performance**: Considera GPU passthrough se disponibile in Proxmox
|
||||
|
||||
## Modelli Specializzati Aggiuntivi (Opzionale)
|
||||
|
||||
```bash
|
||||
# Per documentazione tecnica avanzata
|
||||
ollama pull wizard-vicuna:13b
|
||||
|
||||
# Per traduzioni multilingue
|
||||
ollama pull aya:8b
|
||||
|
||||
# Per analisi codice molto complessa
|
||||
ollama pull magicoder:7b-s-cl-q4_0
|
||||
```
|
||||
|
|
@ -0,0 +1,562 @@
|
|||
# Guida Completa Markdown per Docusaurus
|
||||
|
||||
> **Guida di riferimento completa per la sintassi Markdown in Docusaurus**
|
||||
>
|
||||
> Autore: Giuseppe
|
||||
> Ultimo aggiornamento: Settembre 2025
|
||||
> Repository: [docs.git](https://gitlab.dffm.it/giuseppe/docs.git)
|
||||
|
||||
---
|
||||
|
||||
## Indice
|
||||
|
||||
- [1. Frontmatter (Metadati del documento)](#1-frontmatter-metadati-del-documento)
|
||||
- [2. Intestazioni](#2-intestazioni)
|
||||
- [3. Formattazione del Testo](#3-formattazione-del-testo)
|
||||
- [4. Liste](#4-liste)
|
||||
- [5. Link e Riferimenti](#5-link-e-riferimenti)
|
||||
- [6. Immagini](#6-immagini)
|
||||
- [7. Blocchi di Codice](#7-blocchi-di-codice)
|
||||
- [8. Tabelle](#8-tabelle)
|
||||
- [9. Citazioni](#9-citazioni)
|
||||
- [10. Separatori Orizzontali](#10-separatori-orizzontali)
|
||||
- [11. Componenti Docusaurus Specifici](#11-componenti-docusaurus-specifici)
|
||||
- [12. MDX - Componenti React](#12-mdx---componenti-react)
|
||||
|
||||
---
|
||||
|
||||
## 1. Frontmatter (Metadati del documento)
|
||||
|
||||
Il frontmatter è il blocco YAML all'inizio del file che definisce metadati e configurazioni del documento.
|
||||
|
||||
```yaml
|
||||
---
|
||||
id: my-doc-id
|
||||
title: Titolo del Documento
|
||||
sidebar_label: Label Sidebar
|
||||
sidebar_position: 2
|
||||
description: Descrizione del documento per SEO
|
||||
keywords: [docusaurus, markdown, guida]
|
||||
tags: [tutorial, documentation]
|
||||
slug: /custom-url
|
||||
draft: false
|
||||
hide_title: false
|
||||
hide_table_of_contents: false
|
||||
pagination_next: null
|
||||
pagination_prev: null
|
||||
custom_edit_url: https://github.com/repo/edit/main/docs/doc.md
|
||||
---
|
||||
```
|
||||
|
||||
**Campi principali:**
|
||||
- `id`: Identificatore univoco del documento
|
||||
- `title`: Titolo visualizzato nella pagina
|
||||
- `sidebar_label`: Etichetta nella sidebar (se diversa dal titolo)
|
||||
- `sidebar_position`: Posizione numerica nella sidebar
|
||||
- `description`: Meta descrizione per SEO
|
||||
- `keywords`: Array di parole chiave per la ricerca
|
||||
- `tags`: Tag per categorizzare il documento
|
||||
- `slug`: URL personalizzato per la pagina
|
||||
- `draft`: Se `true`, nasconde il documento in produzione
|
||||
|
||||
---
|
||||
|
||||
## 2. Intestazioni
|
||||
|
||||
Le intestazioni creano la struttura gerarchica del documento e generano automaticamente l'indice.
|
||||
|
||||
```markdown
|
||||
# H1 - Titolo principale
|
||||
## H2 - Sottotitolo
|
||||
### H3 - Sezione
|
||||
#### H4 - Sottosezione
|
||||
##### H5 - Paragrafo
|
||||
###### H6 - Sottoparagrafo
|
||||
```
|
||||
|
||||
**Best practices:**
|
||||
- Usa solo un H1 per documento
|
||||
- Mantieni la gerarchia logica (H1 → H2 → H3)
|
||||
- Evita di saltare livelli di intestazione
|
||||
|
||||
---
|
||||
|
||||
## 3. Formattazione del Testo
|
||||
|
||||
```markdown
|
||||
**Testo in grassetto**
|
||||
*Testo in corsivo*
|
||||
***Testo in grassetto e corsivo***
|
||||
~~Testo barrato~~
|
||||
`Codice inline`
|
||||
```
|
||||
|
||||
Per sottolineato ed evidenziato:
|
||||
```html
|
||||
<u>Testo sottolineato</u>
|
||||
<mark>Testo evidenziato</mark>
|
||||
```
|
||||
|
||||
**Risultato:**
|
||||
- **Testo in grassetto**
|
||||
- *Testo in corsivo*
|
||||
- ***Testo in grassetto e corsivo***
|
||||
- ~~Testo barrato~~
|
||||
- `Codice inline`
|
||||
|
||||
---
|
||||
|
||||
## 4. Liste
|
||||
|
||||
### Liste non ordinate
|
||||
```markdown
|
||||
- Elemento 1
|
||||
- Elemento 2
|
||||
- Sottoelemento 2.1
|
||||
- Sottoelemento 2.2
|
||||
- Elemento 3
|
||||
|
||||
* Alternativa con asterisco
|
||||
+ Alternativa con più
|
||||
```
|
||||
|
||||
### Liste ordinate
|
||||
```markdown
|
||||
1. Primo elemento
|
||||
2. Secondo elemento
|
||||
1. Sottoelemento ordinato
|
||||
2. Altro sottoelemento
|
||||
3. Terzo elemento
|
||||
```
|
||||
|
||||
### Liste di attività (Task Lists)
|
||||
```markdown
|
||||
- [x] Attività completata
|
||||
- [ ] Attività da fare
|
||||
- [x] Altra attività completata
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 5. Link e Riferimenti
|
||||
|
||||
```markdown
|
||||
[Link esterno](https://example.com)
|
||||
[Link con titolo](https://example.com "Titolo del link")
|
||||
[Link a documento interno](./altro-documento.md)
|
||||
[Link a sezione](#sezione-specifica)
|
||||
[Link di riferimento][1]
|
||||
|
||||
[1]: https://example.com
|
||||
|
||||
<!-- Link automatici -->
|
||||
https://example.com
|
||||
<email@example.com>
|
||||
```
|
||||
|
||||
**Tipi di link supportati:**
|
||||
- **Esterni**: Collegamenti a siti web esterni
|
||||
- **Interni**: Collegamenti ad altri documenti del progetto
|
||||
- **Ancore**: Collegamenti a sezioni specifiche della stessa pagina
|
||||
- **Automatici**: URL e email riconosciuti automaticamente
|
||||
|
||||
---
|
||||
|
||||
## 6. Immagini
|
||||
|
||||
### Sintassi Markdown base
|
||||
```markdown
|
||||
|
||||
|
||||
```
|
||||
|
||||
### Immagini con HTML (per controllo avanzato)
|
||||
```html
|
||||
<img src="./images/immagine.png" alt="Alt text" width="500" height="300" />
|
||||
```
|
||||
|
||||
### Immagini centrate
|
||||
```html
|
||||
<div style={{textAlign: 'center'}}>
|
||||
<img src="./images/immagine.png" alt="Alt text" />
|
||||
</div>
|
||||
```
|
||||
|
||||
**Formati supportati:**
|
||||
- PNG, JPG, JPEG, GIF, SVG
|
||||
- WebP (per performance ottimizzate)
|
||||
- Immagini locali e remote
|
||||
|
||||
---
|
||||
|
||||
## 7. Blocchi di Codice
|
||||
|
||||
### Codice inline
|
||||
```markdown
|
||||
Usa `console.log()` per stampare in console.
|
||||
```
|
||||
|
||||
### Blocchi di codice con evidenziazione sintassi
|
||||
|
||||
JavaScript:
|
||||
```javascript
|
||||
function saluta(nome) {
|
||||
console.log(`Ciao, ${nome}!`);
|
||||
}
|
||||
saluta("Mondo");
|
||||
```
|
||||
|
||||
Python:
|
||||
```python
|
||||
def saluta(nome):
|
||||
print(f"Ciao, {nome}!")
|
||||
|
||||
saluta("Mondo")
|
||||
```
|
||||
|
||||
Bash:
|
||||
```bash
|
||||
npm install docusaurus
|
||||
npm start
|
||||
```
|
||||
|
||||
### Blocchi di codice con titolo
|
||||
````markdown
|
||||
```js title="src/components/HelloWorld.js"
|
||||
import React from 'react';
|
||||
|
||||
export default function HelloWorld() {
|
||||
return <h1>Hello World!</h1>;
|
||||
}
|
||||
```
|
||||
````
|
||||
|
||||
### Evidenziazione di righe specifiche
|
||||
````markdown
|
||||
```js {1,4-6,11}
|
||||
import React from 'react';
|
||||
|
||||
function MyComponent() {
|
||||
const [count, setCount] = useState(0);
|
||||
const increment = () => setCount(count + 1);
|
||||
const decrement = () => setCount(count - 1);
|
||||
|
||||
return (
|
||||
<div>
|
||||
<p>Count: {count}</p>
|
||||
<button onClick={increment}>+</button>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
```
|
||||
````
|
||||
|
||||
### Code Block con numerazione righe
|
||||
````markdown
|
||||
```js showLineNumbers
|
||||
function calculateSum(a, b) {
|
||||
return a + b;
|
||||
}
|
||||
|
||||
const result = calculateSum(5, 3);
|
||||
console.log(result);
|
||||
```
|
||||
````
|
||||
|
||||
**Linguaggi supportati:**
|
||||
JavaScript, TypeScript, Python, Java, C#, PHP, Go, Rust, HTML, CSS, SQL, JSON, YAML, e molti altri.
|
||||
|
||||
---
|
||||
|
||||
## 8. Tabelle
|
||||
|
||||
```markdown
|
||||
| Colonna 1 | Colonna 2 | Colonna 3 |
|
||||
|-----------|-----------|-----------|
|
||||
| Riga 1 | Dato 1 | Dato 2 |
|
||||
| Riga 2 | Dato 3 | Dato 4 |
|
||||
```
|
||||
|
||||
### Tabelle con allineamento
|
||||
```markdown
|
||||
| Sinistra | Centro | Destra |
|
||||
|:---------|:------:|-------:|
|
||||
| Testo | Testo | Testo |
|
||||
| Esempio | Test | 123 |
|
||||
```
|
||||
|
||||
**Allineamento:**
|
||||
- `:---` = Allineato a sinistra
|
||||
- `:---:` = Centrato
|
||||
- `---:` = Allineato a destra
|
||||
|
||||
---
|
||||
|
||||
## 9. Citazioni
|
||||
|
||||
```markdown
|
||||
> Questa è una citazione semplice.
|
||||
|
||||
> Questa è una citazione
|
||||
> su più righe.
|
||||
```
|
||||
|
||||
### Citazioni complesse
|
||||
```markdown
|
||||
> ## Citazione con intestazione
|
||||
>
|
||||
> Puoi includere **formattazione** nelle citazioni.
|
||||
>
|
||||
> - Liste
|
||||
> - Anche nelle citazioni
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 10. Separatori Orizzontali
|
||||
|
||||
```markdown
|
||||
---
|
||||
```
|
||||
|
||||
Oppure:
|
||||
```markdown
|
||||
***
|
||||
___
|
||||
```
|
||||
|
||||
Tutti e tre i metodi producono lo stesso risultato: una linea orizzontale di separazione.
|
||||
|
||||
---
|
||||
|
||||
## 11. Componenti Docusaurus Specifici
|
||||
|
||||
### Admonitions (Avvisi)
|
||||
|
||||
Gli admonitions sono blocchi colorati per evidenziare informazioni importanti.
|
||||
|
||||
```markdown
|
||||
:::note
|
||||
Questa è una nota informativa.
|
||||
:::
|
||||
|
||||
:::tip
|
||||
Questo è un suggerimento utile.
|
||||
:::
|
||||
|
||||
:::info
|
||||
Questa è un'informazione importante.
|
||||
:::
|
||||
|
||||
:::warning
|
||||
Questo è un avvertimento.
|
||||
:::
|
||||
|
||||
:::danger
|
||||
Questo è un avviso di pericolo.
|
||||
:::
|
||||
```
|
||||
|
||||
### Admonitions con titolo personalizzato
|
||||
```markdown
|
||||
:::tip Titolo personalizzato
|
||||
Puoi personalizzare il titolo degli admonition.
|
||||
:::
|
||||
|
||||
:::note[Nota con titolo personalizzato]
|
||||
Sintassi alternativa per il titolo.
|
||||
:::
|
||||
```
|
||||
|
||||
### Admonitions collassabili
|
||||
```markdown
|
||||
:::details Clicca per espandere
|
||||
Contenuto nascosto che si può espandere.
|
||||
:::
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 12. MDX - Componenti React
|
||||
|
||||
MDX permette di utilizzare componenti React direttamente nel Markdown.
|
||||
|
||||
### Componenti inline
|
||||
```markdown
|
||||
export const Highlight = ({children, color}) => (
|
||||
<span style={{backgroundColor: color, borderRadius: '2px', color: '#fff', padding: '0.2rem'}}>
|
||||
{children}
|
||||
</span>
|
||||
);
|
||||
|
||||
Ecco un testo <Highlight color="#25c2a0">evidenziato in verde</Highlight>.
|
||||
```
|
||||
|
||||
### Live Code Editor
|
||||
````markdown
|
||||
```jsx live
|
||||
function Button() {
|
||||
const [count, setCount] = useState(0);
|
||||
return (
|
||||
<button onClick={() => setCount(count + 1)}>
|
||||
Count: {count}
|
||||
</button>
|
||||
);
|
||||
}
|
||||
```
|
||||
````
|
||||
|
||||
### Importare componenti esterni
|
||||
```markdown
|
||||
import MyComponent from '@site/src/components/MyComponent';
|
||||
|
||||
<MyComponent name="Giuseppe" />
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 13. Funzionalità Avanzate
|
||||
|
||||
### Footnotes (Note a piè di pagina)
|
||||
```markdown
|
||||
Questo è un testo con una nota[^1].
|
||||
|
||||
[^1]: Questa è la nota a piè di pagina.
|
||||
```
|
||||
|
||||
### Emoji support
|
||||
```markdown
|
||||
:smile: :heart: :thumbsup: :rocket: :warning:
|
||||
|
||||
Oppure direttamente: 😄 ❤️ 👍 🚀 ⚠️
|
||||
```
|
||||
|
||||
### Keyboard keys
|
||||
```html
|
||||
Premi <kbd>Ctrl</kbd>+<kbd>C</kbd> per copiare.
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 14. Diagrammi
|
||||
|
||||
### Mermaid (se abilitato)
|
||||
````markdown
|
||||
```mermaid
|
||||
graph TD;
|
||||
A-->B;
|
||||
A-->C;
|
||||
B-->D;
|
||||
C-->D;
|
||||
```
|
||||
````
|
||||
|
||||
### Diagramma di flusso
|
||||
````markdown
|
||||
```mermaid
|
||||
flowchart LR
|
||||
A[Start] --> B{Decision}
|
||||
B -->|Yes| C[Process]
|
||||
B -->|No| D[End]
|
||||
C --> D
|
||||
```
|
||||
````
|
||||
|
||||
---
|
||||
|
||||
## 15. Math (se KaTeX abilitato)
|
||||
|
||||
### Equazioni inline
|
||||
```markdown
|
||||
La formula di Einstein è $E = mc^2$.
|
||||
```
|
||||
|
||||
### Equazioni in blocco
|
||||
```markdown
|
||||
$$
|
||||
\int_{-\infty}^{\infty} e^{-x^2} dx = \sqrt{\pi}
|
||||
$$
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 16. Best Practices
|
||||
|
||||
### Struttura dei file
|
||||
```
|
||||
docs/
|
||||
├── intro.md
|
||||
├── tutorial/
|
||||
│ ├── _category_.json
|
||||
│ ├── basics/
|
||||
│ │ ├── create-document.md
|
||||
│ │ └── markdown-features.md
|
||||
│ └── advanced/
|
||||
│ └── deploy.md
|
||||
└── api/
|
||||
└── users.md
|
||||
```
|
||||
|
||||
### File _category_.json
|
||||
```json
|
||||
{
|
||||
"label": "Tutorial",
|
||||
"position": 2,
|
||||
"link": {
|
||||
"type": "generated-index",
|
||||
"description": "Tutorial per imparare Docusaurus."
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
### Performance e SEO
|
||||
- **Immagini ottimizzate**: Usa formati moderni (WebP) e dimensioni appropriate
|
||||
- **Meta description**: Includi sempre una descrizione nel frontmatter
|
||||
- **Keywords**: Utilizza parole chiave rilevanti per la ricerca
|
||||
- **Struttura gerarchica**: Mantieni una gerarchia logica delle intestazioni
|
||||
- **Heading sequenziali**: Usa heading in ordine (H1 → H2 → H3)
|
||||
|
||||
### Accessibilità
|
||||
- **Alt text**: Fornisci sempre testo alternativo per le immagini
|
||||
- **Struttura heading**: Usa intestazioni per strutturare il contenuto
|
||||
- **Link descrittivi**: Assicurati che i link abbiano testo descrittivo
|
||||
- **Contrasto colori**: Usa colori con contrasto adeguato negli elementi personalizzati
|
||||
|
||||
### Organizzazione contenuti
|
||||
- **Naming consistency**: Usa convenzioni coerenti per nomi file e ID
|
||||
- **Logical grouping**: Organizza documenti in cartelle logiche
|
||||
- **Cross-references**: Crea collegamenti tra documenti correlati
|
||||
- **Regular updates**: Mantieni aggiornata la documentazione
|
||||
|
||||
---
|
||||
|
||||
## Risoluzione Problemi Comuni
|
||||
|
||||
### Errori MDX
|
||||
1. **Tag auto-chiudenti**: Usa `<img />` invece di `<img>`
|
||||
2. **Attributi JSX**: Usa `className` invece di `class`
|
||||
3. **Sintassi mista**: Non mischiare Markdown e JSX nello stesso blocco
|
||||
4. **Import mancanti**: Importa tutti i componenti che usi
|
||||
|
||||
### Debug dei link
|
||||
- Usa percorsi relativi per documenti interni
|
||||
- Controlla che i file esistano effettivamente
|
||||
- Verifica l'estensione dei file (.md vs .mdx)
|
||||
|
||||
### Problemi di build
|
||||
- Controlla la sintassi YAML nel frontmatter
|
||||
- Verifica che non ci siano caratteri speciali nei nomi file
|
||||
- Assicurati che tutti gli import siano corretti
|
||||
|
||||
---
|
||||
|
||||
## Risorse Aggiuntive
|
||||
|
||||
- 📚 [Documentazione Ufficiale Docusaurus](https://docusaurus.io/)
|
||||
- 🎯 [Markdown Guide](https://www.markdownguide.org/)
|
||||
- 🔧 [MDX Documentation](https://mdxjs.com/)
|
||||
- 🎨 [Infima CSS Framework](https://infima.dev/) (utilizzato da Docusaurus)
|
||||
|
||||
---
|
||||
|
||||
> **Nota**: Questa guida è stata creata per il progetto [docs.git](https://gitlab.dffm.it/giuseppe/docs.git) e può essere liberamente utilizzata e modificata secondo le esigenze del progetto.
|
||||
|
|
@ -1,148 +1,187 @@
|
|||
---
|
||||
id: GestioneSiteManager1
|
||||
sidebar_position: 2
|
||||
title: 'Secomea SiteManager 1549 Dev Separation'
|
||||
sidebar_label: SiteManager 1549 Dev Separation
|
||||
pagination_prev: null
|
||||
hide_table_of_contents: true
|
||||
id: sitemanager-dev-port-separation
|
||||
title: Sitemanager 1549 - DEV Port Separation
|
||||
sidebar_label: DEV Port Separation
|
||||
sidebar_position: 1
|
||||
description: Guida per configurare la separazione delle porte DEV sul Sitemanager 1549 Secomea
|
||||
keywords: [secomea, sitemanager, 1549, dev port, separation, network, configuration]
|
||||
tags: [secomea, networking, configuration]
|
||||
---
|
||||
|
||||
# Sitemanager 1549 - DEV Port Separation
|
||||
|
||||
Questa guida illustra come configurare la **separazione delle porte DEV** sul Sitemanager 1549 di Secomea per creare reti separate.
|
||||
|
||||
Term
|
||||
: Definition for the term.
|
||||
: Another definition for the same term.
|
||||
## Panoramica
|
||||
|
||||
Another Term
|
||||
: Definition of another term.
|
||||
La funzionalità DEV Port Separation consente di separare le porte DEV del Sitemanager per creare segmenti di rete isolati, utile per:
|
||||
- Separare diverse reti di automazione
|
||||
- Isolare gruppi di dispositivi
|
||||
- Implementare segmentazione di sicurezza
|
||||
|
||||
## Prerequisiti
|
||||
|
||||
:::info Obiettivo
|
||||
Avere due reti separate e sicure, accessibili in modo indipendente tramite GateManager.
|
||||
- Accesso alla GUI del Sitemanager (locale o tramite GateManager)
|
||||
- Privilegi di amministrazione
|
||||
- Conoscenza della topologia di rete target
|
||||
|
||||
Questa guida è pensata per tecnici e amministratori di sistema che devono configurare un SiteManager per isolare la rete di una macchina (DEV2) dalla rete di impianto principale (DEV1).
|
||||
---
|
||||
|
||||
## Procedura di Configurazione
|
||||
|
||||
### Step 1: Accesso alla GUI
|
||||
|
||||
Accedere alla GUI del Sitemanager attraverso:
|
||||
- **GUI locale**: Connessione diretta al dispositivo
|
||||
- **GateManager**: Accesso remoto tramite piattaforma cloud
|
||||
|
||||
### Step 2: Configurazione Porta DEV2
|
||||
|
||||
1. **Selezionare la porta DEV2**
|
||||
- Cliccare su **DEV2** nel menu delle interfacce
|
||||
|
||||
2. **Configurare la modalità Separation**
|
||||
- **Mode**: Cambiare da `Bridge` (default) a `Separation`
|
||||
- **IP Address**: Inserire l'indirizzo IP del gateway della nuova rete
|
||||
- **Subnet Mask**: Specificare la subnet mask appropriata
|
||||
|
||||
3. **Salvare e riavviare**
|
||||
- Cliccare **Save** per salvare le configurazioni
|
||||
- Riavviare il dispositivo per applicare le modifiche
|
||||
|
||||
:::warning Attenzione
|
||||
Il riavvio del dispositivo causerà una breve interruzione delle connessioni di rete.
|
||||
:::
|
||||
|
||||
### **1️⃣ Accesso all'interfaccia di Configurazione**
|
||||
1️
|
||||
### Step 3: Creazione Agent Layer2
|
||||
|
||||
1. Prima di iniziare, accedi all'interfaccia web del SiteManager.
|
||||
1. **Creare nuovo Agent**
|
||||
- Navigare nella sezione **Agents**
|
||||
- Creare un nuovo **Agent Layer2**
|
||||
- Cliccare su **Edit** per modificarlo
|
||||
|
||||
Apri un browser e collegati all'indirizzo IP del SiteManager.
|
||||
2. **Configurare l'interfaccia**
|
||||
- **Interface**: Selezionare `DEV2`
|
||||
- Cliccare **Save and Back** per confermare
|
||||
|
||||
Accedi tramite la rete locale (porta DEV1) o, se già configurato, attraverso il GateManager.
|
||||
---
|
||||
|
||||
Una volta dentro, naviga nel menu
|
||||
## Risultato
|
||||
|
||||
System per visualizzare tutte le interfacce di rete.
|
||||
Dopo la configurazione, nel **GateManager** saranno visibili:
|
||||
- **2 connessioni Layer2** distinte
|
||||
- Separazione completa tra i segmenti di rete
|
||||
|
||||
---
|
||||
|
||||
2️⃣ Configurazione della Porta DEV2
|
||||
Ora configuriamo la porta DEV2 per operare come una rete indipendente.
|
||||
---
|
||||
|
||||
Dal menu
|
||||
## Convenzioni e Standard Aziendali
|
||||
|
||||
System, clicca sulla scheda DEV2.
|
||||
### Utilizzo delle Porte
|
||||
- **DEV1**: Sempre per rete di supervisione (HMI, programmazione)
|
||||
- **DEV2**: Sempre per rete di campo (automazione, I/O)
|
||||
- **DEV3**: Non utilizzare per questa configurazione
|
||||
|
||||
Imposta i seguenti parametri nella pagina di configurazione:
|
||||
### Network Map Standard
|
||||
#### DEV1
|
||||
- **Classe IP**: `172.16.224.0/20` per tutte le macchine
|
||||
- **Gateway**: `172.16.239.254` per rete di supervisione
|
||||
- **Compatibilità**: Ottimizzata (HMI, PLC, programmazione)
|
||||
#### DEV2
|
||||
- **Classe IP**: `172.16.0.0/17` per tutte le macchine
|
||||
- **Gateway**: `172.16.127.254` per rete di campo
|
||||
- **Compatibilità**: Ottimizzata per circuiti MagneMotion
|
||||
|
||||
---
|
||||
|
||||
Mode: Seleziona Separation dal menu a tendina.
|
||||
## Verifica Configurazione
|
||||
|
||||
### Controlli post-configurazione
|
||||
|
||||
1. **Verificare connettività**
|
||||
- Testare la connessione ai dispositivi su entrambe le reti
|
||||
- Verificare l'isolamento tra i segmenti
|
||||
|
||||
IP Address: Assegna l'indirizzo IP che farà da gateway per la nuova rete (es. 172.16.223.254).
|
||||
2. **Controllo GateManager**
|
||||
- Confermare che vengano visualizzate 2 connessioni Layer2
|
||||
- Verificare lo stato delle connessioni
|
||||
|
||||
3. **Test di isolamento**
|
||||
- Verificare che i dispositivi su DEV1 non possano comunicare con quelli su DEV2
|
||||
- Confermare il corretto routing del traffico
|
||||
|
||||
---
|
||||
|
||||
## Diagramma di Rete
|
||||
|
||||
Subnet Mask: Inserisci la maschera di sottorete corrispondente (es. 255.255.240.0).
|
||||
```mermaid
|
||||
graph TD
|
||||
A[Sitemanager 1549] --> |Rete di Supervisione| B[DEV1 - Bridge Mode]
|
||||
A -->|Rete di Campo| C[DEV2 - Separation Mode
|
||||
automazione, I/O]
|
||||
A --> D[DEV3 - Bridge Mode]
|
||||
|
||||
B --> E[Rete Principale]
|
||||
C --> |Isolata|F[Rete Separata]
|
||||
D --> G[Non usare]
|
||||
|
||||
E -.-> |Isolata| F
|
||||
|
||||
|
||||
style C fill:#ffeb3b
|
||||
style F fill:#ffeb3b
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
Clicca su
|
||||
## Parametri di Configurazione
|
||||
|
||||
Save per memorizzare le impostazioni.
|
||||
| Parametro | Valore | Note |
|
||||
|-----------|--------|------|
|
||||
| **Modalità DEV2** | Separation | Cambiare da Bridge (default) |
|
||||
| **IP Gateway** | IP della nuova rete | Configurare secondo topologia |
|
||||
| **Subnet** | Subnet della nuova rete | Deve corrispondere alla rete target |
|
||||
| **Agent Type** | Layer2 | Creare specificamente per DEV2 |
|
||||
|
||||
---
|
||||
|
||||
Apparirà un avviso per il riavvio. Clicca sul pulsante
|
||||
## Troubleshooting
|
||||
|
||||
Reboot per rendere effettive le modifiche.
|
||||
### Problemi Comuni
|
||||
|
||||
#### Connessione non disponibile dopo riavvio
|
||||
- **Causa**: Configurazione IP errata
|
||||
- **Soluzione**: Verificare IP e subnet mask del gateway
|
||||
|
||||
<br/>
|
||||
<img src="/img/screenshots/sitemanager/dev2_separation.jpg" alt="Configurazione Porta DEV2 in Separation Mode" style={{ maxWidth: '70%', borderRadius: '8px' }} />
|
||||
#### Agent non visibile in GateManager
|
||||
- **Causa**: Agent non correttamente associato a DEV2
|
||||
- **Soluzione**: Verificare che l'interfaccia selezionata sia DEV2
|
||||
|
||||
:::danger Attenzione
|
||||
Il riavvio è un passaggio obbligatorio. Senza di esso, la porta DEV2 non funzionerà nella nuova modalità. Il riavvio cancella i log di sistema.
|
||||
#### Comunicazione tra reti non isolata
|
||||
- **Causa**: Modalità ancora in Bridge
|
||||
- **Soluzione**: Confermare che DEV2 sia in modalità Separation
|
||||
|
||||
---
|
||||
|
||||
## Note Aggiuntive
|
||||
|
||||
### Sicurezza
|
||||
- La separazione delle porte aumenta la sicurezza isolando i segmenti di rete
|
||||
- Implementare firewall rules appropriate se necessario
|
||||
|
||||
:::
|
||||
### Performance
|
||||
- La modalità Separation può influire sulle performance di throughput
|
||||
- Monitorare le metriche di rete dopo la configurazione
|
||||
|
||||
3️⃣ Creazione dell'Agente Layer 2
|
||||
Dopo il riavvio, la porta DEV2 è attiva sulla sua nuova rete. Ora dobbiamo creare un "Agente" per potervi accedere da remoto.
|
||||
### Manutenzione
|
||||
- Documentare la configurazione di rete per future modifiche
|
||||
- Mantenere aggiornato il firmware del Sitemanager
|
||||
|
||||
Spostati nella sezione GateManager -> Agents.
|
||||
---
|
||||
|
||||
Crea un nuovo agente.
|
||||
## Riferimenti
|
||||
|
||||
Come
|
||||
|
||||
Device Type, seleziona Layer2 (GENERIC).
|
||||
|
||||
|
||||
Una volta creato, clicca sull'icona
|
||||
|
||||
Edit (matita) per configurarlo.
|
||||
|
||||
4️⃣ Associazione Agente-Interfaccia
|
||||
Questo è il passaggio cruciale per collegare l'agente software alla porta fisica corretta.
|
||||
|
||||
All'interno delle impostazioni dell'agente, trova il menu a tendina Interface.
|
||||
|
||||
Seleziona
|
||||
|
||||
DEV2 dall'elenco.
|
||||
|
||||
|
||||
Clicca su
|
||||
|
||||
Save e poi su Back per tornare alla lista agenti.
|
||||
|
||||
<br/>
|
||||
<img src="/img/screenshots/sitemanager/agent_interface_dev2.jpg" alt="Associazione Agente a Interfaccia DEV2" style={{ maxWidth: '70%', borderRadius: '8px' }} />
|
||||
|
||||
:::tip
|
||||
Non è necessario compilare i campi "Device IP Address" o "Device MAC Address" a meno che tu non voglia limitare l'accesso a un singolo dispositivo specifico su quella rete.
|
||||
|
||||
|
||||
:::
|
||||
|
||||
5️⃣ ✔️ Verifica Finale
|
||||
Se la configurazione è andata a buon fine, il risultato sarà immediatamente visibile sul GateManager.
|
||||
|
||||
Doppia Connessione: Vedrai due agenti Layer 2 attivi per lo stesso SiteManager:
|
||||
|
||||
Un agente per la rete su
|
||||
|
||||
DEV1.
|
||||
|
||||
Un agente per la nuova rete su
|
||||
|
||||
DEV2.
|
||||
|
||||
Questo conferma che le reti sono isolate e accessibili in modo indipendente.
|
||||
|
||||
:::info Nota Pratica
|
||||
Per convenzione, su alcuni impianti (es. Rockwell) si preferisce usare le porte
|
||||
|
||||
DEV1 e DEV3. La procedura per configurare la porta DEV3 è identica a quella descritta per la DEV2.
|
||||
|
||||
|
||||
:::
|
||||
|
||||
🔗 Risorse Utili
|
||||
|
||||
|
||||
Help Online del SiteManager: L'interfaccia del dispositivo contiene una sezione di aiuto dettagliata per ogni parametro di configurazione.
|
||||
- [Documentazione Ufficiale Secomea](https://www.secomea.com)
|
||||
- [Manuale Sitemanager 1549](https://www.secomea.com/support)
|
||||
- [GateManager User Guide](https://www.secomea.com/gatemanager)
|
||||
Loading…
Reference in New Issue