vue jsplumb editor

Vue-Jsplomb-Editor

Aperçu en ligne

Points fonctionnels

Zone de nœud de menu

• Faites glisser un nœud du menu vers la zone de conception principale pour placer le nœud
• Organiser les nœuds par type de nœud

Zone de conception principale

• L'opération peut être révoquée
• Casserole et zoom de fond
• Peut recevoir des nœuds traînés à partir du menu
• Le nœud traîné dans le point de terminaison correspondant en fonction des informations actuelles du nœud (utilisées pour faire glisser la connexion)
• Les points d'extrémité générés sont divisés en deux types: point de terminaison source et point d'extrémité cible, qui doit être distingué dans le style.
• Le point de terminaison source est placé dans la position du bas du nœud, et le nœud cible empêche le nœud d'être en position supérieure (pour faciliter la traînée de la ligne de connexion de haut en bas)
• Tous les nœuds peuvent être déplacés en faisant glisser et en se déplaçant
• Tous les nœuds et lignes de connexion peuvent être supprimés
• Tous les nœuds et points de terminaison doivent avoir une boîte à instamment pour inciter les informations de nœud ou de point de terminaison dans la souris
• Tous les nœuds, points de terminaison et lignes de connexion doivent être définis différents styles lors du flottement de la souris
• Tous les nœuds et lignes de connexion peuvent être sélectionnés
• L'opération enregistre les données en temps réel
• Importer un tableau de flux de génération de données

Zone de configuration du nœud

• Lors de la sélection d'un nœud dans la zone de conception, la zone de configuration du nœud affiche un panneau de configuration de nœud correspondant
• Différents nœuds doivent avoir des panneaux de configuration de nœud correspondants
• Le panneau de nœud est utilisé pour afficher et configurer les propriétés du nœud

Cliquez avec le bouton droit sur la fonction de menu

• nœud:
  • copie
  • supprimer
  • Afficher les données
  • Rebaptiser
• Câble de connexion:
  • supprimer
• arrière-plan:
  • Coller

Dépendances d'installation

 npm install

Modèle de développement

 npm run serve

Compiler le code de production

 npm run build