S7_snap7_Stremer_n_Recorder/help.md

3.6 KiB
Raw Blame History

Frontend User Guide — Dashboard Tabs

This short guide explains the purpose of each tab in the frontend Dashboard.jsx and what a typical user needs to know to use them.

Checklist

  • Describe each Dashboard tab and its main actions
  • Keep explanations short and aimed at end users (operators / engineers)
  • Include a couple of quick tips and common issues

Quick start

  1. Start the backend (Flask): run the Python backend as your project requires (commonly python main.py).
  2. Start the frontend: from the frontend folder run npm run dev (Vite development server).
  3. Open the UI at the configured address (usually http://localhost:5173/app or root served path).

Tabs overview

  1. Config (🔧)
  • Purpose: configure PLC connection and UDP/streaming settings.
  • What you do here: edit connection parameters (IP, rack/slot, DB mappings), UDP target and sampling interval, and save the PLC configuration.
  • Main actions: Save configuration, Import/Export the PLC config (JSON), Reset the form.
  • Tip: If the form shows "Loading..." wait for the backend to respond or check backend logs.
  1. Datasets (📊)
  • Purpose: define logical datasets and the PLC variables that belong to each dataset.
  • What you do here:
    • "Dataset Definitions" card: add, edit or remove datasets (name, id, metadata).
    • "Dataset Variables" area: choose a dataset (combo selector) and configure its variables and streaming settings.
  • Main actions: add dataset, save all datasets, import/export full dataset files or single dataset variables.
  • Tip: Create datasets first, then select a dataset to add variables for streaming/recording.
  1. Plots (📈)
  • Purpose: define real-time plots and map variables to visual traces.
  • What you do here: configure plots (plot id, name, variables to show), manage sessions, and export plot definitions.
  • Main actions: Add/modify plots, start a plotting session in the frontend or launch PlotJuggler for advanced visualization (if available).
  • Tip: Use export/import to share plot templates with colleagues.
  1. Historical (📉)
  • Purpose: explore recorded (CSV) historical data and play it back or export slices.
  • What you do here: open historical sessions, choose time ranges or files, and replay or export subsets for analysis.
  • Main actions: load CSV sessions, playback controls, export data subset.
  • Tip: For large datasets, prefer server-side filtering or export to file and analyze offline.
  1. CSV Files (📁)
  • Purpose: browse stored CSV recordings created by the streamer.
  • What you do here: view file list, download selected CSVs, and see recording metadata (timestamp, size).
  • Main actions: Download, inspect file names and timestamps.
  • Tip: Check disk space and retention policy in the backend if recordings stop appearing.
  1. Logs (📋)
  • Purpose: view recent application logs and events for troubleshooting.
  • What you do here: read recent log lines, refresh the view and export logs to a file.
  • Main actions: Refresh logs, Export logs.
  • Tip: If the UI shows backend disconnected, open backend logs (main.py / logs/) to diagnose.

Common issues & troubleshooting

  • Backend disconnected: StatusBar will show a connection error. Verify main.py is running and there are no firewall issues.
  • Import errors: Use the corresponding exported file as a template (array vs object shape matters). Single-item import expects one array elements structure.
  • Empty lists: "Add First Item" buttons appear in empty array forms — use them to create the initial configuration.

If you want, I can: add small JSON examples for each tab (sample dataset, variables, plot definition), translate this guide to Spanish, or embed screenshots.