VDS-componenten

VDS staat voor Vtiger Design Systems, dat de belangrijkste HTML-componenten definieert die door het VTAP-platform worden aangeboden. VDS biedt componenten die herbruikbare UI-blokken zijn.

U kunt componenten gebruiken om uw toepassingen te bouwen en aan te passen. Ze kunnen overal worden gebruikt: aangepaste pagina's, widgets, pop-ups of binnen andere aangepaste componenten.

Hieronder vindt u de lijst met componenten die VTAP biedt:

vds-tekst

Te gebruiken: Gebruikt voor een invoervak. Hiermee kunnen gebruikers informatie invoeren.

Syntaxis:

Attributen details:
naam om een ​​willekeurige naam in te stellen voor het invoerelement
invalide waar/onwaar, om het uit te schakelen
plaatshouder om een ​​hint voor de invoer weer te geven
invoertype Alle geldige HTML-invoertypen zoals e-mail, nummer, enz. (Lees hieronder voor meer informatie.)
verplicht om dit veld verplicht te maken 
v-model Dit is de vue (reactieve) gegevensbinding, deze kan worden gebruikt om de waarde in te stellen of te lezen.

Naast tekst ondersteunt VDS ook andere invoertypen. Bijvoorbeeld: 

  • vds-e-mail
  • vds-nummer
  • vds-percentage
  • vds-decimaal
  • vds-telefoon
  • vds-datum
  • vds-tijd
  • vds-url

Al deze componenten zijn verschillende invoertypen. Ze hebben de eigenschappen van een vds-teksttype maar komen met hun eigen invoertypevalidaties. 

Vds-drop-down

Gebruikmogelijkheden: Om een ​​vervolgkeuzelijst weer te geven met een gegeven lijst met items

Syntax:

Ondersteunde attributen:
opties Reeks vervolgkeuzelijsten
meervoudig waar/niet waar, om de vervolgkeuzelijst met meerdere selecties weer te geven
leeg-optie Als u eerst een lege optie wilt weergeven
invalide waar onwaar
verplicht waar onwaar

vds-eigenaar

Gebruikmogelijkheden: Het is een interactief onderdeel dat gebruikers en groepen laat zien als een vervolgkeuzelijst. Het is hetzelfde als het veld Toegewezen aan in elke module in de CRM.

Syntax:

Ondersteunde attributen:
alleen-gebruikers Als u alleen gebruikers in de vervolgkeuzelijst wilt zien
alleen-groepen Als u alleen groepen in de vervolgkeuzelijst wilt zien

vds-checkbox

Gebruikmogelijkheden: Om een ​​checkbox-invoer weer te geven

Syntax:

vds-schakelaar

Gebruikmogelijkheden: Om een ​​wissel weer te geven

Syntax:

vds-datepicker

Gebruikmogelijkheden: Om een ​​datumkiezer weer te geven voor alle datumvelden.

Syntax:

Kenmerk ondersteund:
datumnotatie Datumnotatie moet worden weergegeven als DD-MM-JJJJ, MM-DD-JJJJ, JJJJ-MM-DD

vds-daterange-picker

Gebruikmogelijkheden: Om een ​​datumkiezer weer te geven om een ​​datumbereik te selecteren

Syntax:

Kenmerk ondersteund:
datumnotatie Datumnotatie moet worden weergegeven als DD-MM-JJJJ, MM-DD-JJJJ, JJJJ-MM-DD

vds-timepicker

Gebruikmogelijkheden: Om een ​​tijdkiezer weer te geven

Syntax:

Kenmerk ondersteund:
formaat 12- of 24-uurs indeling 

vds-rte

Gebruikmogelijkheden: Om een ​​CKEditor weer te geven, de veld-UI die u ziet in het RTF-editorveld 

Syntax:

vds-beoordeling

Gebruikmogelijkheden: Om een ​​beoordelingssterveld weer te geven. Er worden maximaal 5 sterren weergegeven.

Syntax:

Kenmerk ondersteund:
reeks Waarde tussen 1 en 5

vds-iframe

Gebruikmogelijkheden: Een iframe tonen met bepaalde HTML-inhoud

Syntax:

vds-voortgang

Gebruikmogelijkheden: Om het voortgangspercentage weer te geven

Syntax:

Ondersteunde attributen:
waarde % van de kleur
aangepaste kleurcode standaard wordt de voortgang in het blauw weergegeven, u kunt elke geldige kleurnaam doorgeven
 
 
 

VTAP klant use case

 
 

Een van onze klanten gebruikt een andere applicatie om hun projecten en voortgang bij te houden. 

Ze wilden Vtiger Projects gaan gebruiken, maar de gebruikersinterface was de enige hindernis om Vtiger Projects te gebruiken. De interface gaf niet de volledige details van mijlpalen en taken op één scherm voor een project, zoals de klant wilde.

Om deze hindernis te overwinnen, hebben we de volgende oplossing voorgesteld.

Ze zouden ons low-code platform Module Designer kunnen gebruiken om een ​​pagina te ontwerpen die in 3 delen zou worden opgedeeld. 

Het eerste deel toont een lijst met projecten, het volgende deel toont mijlpalen die zijn gekoppeld aan het geselecteerde project en het derde deel toont de taken die zijn gekoppeld aan het geselecteerde project en mijlpalen. Het zou lijken op de Outlook-mailbox, die e-mails en hun inhoud aan de rechterkant toont. In dit geval geeft het 3-niveau taakdetails aan het einde weer.

Om deze mogelijkheid te bouwen, zouden we een aangepaste lijstpagina bouwen die kan worden toegevoegd met behulp van de 'LIST_ADD_VIEWTYPE' bestanddeel. Zien hier bijvoorbeeld. 

Vervolgens wordt de functie VTAP.API.Get gebruikt om de project-, projectmijlpaal- en taakgegevens op te halen. Ze zouden in afzonderlijke kolommen worden weergegeven, maar zouden nog steeds met elkaar verbonden zijn. U kunt de code kopiëren van hier om het in actie te zien.
 

Een van onze klanten gebruikt een andere applicatie om hun projecten en voortgang bij te houden. 

Ze wilden Vtiger Projects gaan gebruiken, maar de gebruikersinterface was de enige hindernis om Vtiger Projects te gebruiken. De interface gaf niet de volledige details van mijlpalen en taken op één scherm voor een project, zoals de klant wilde.

Om deze hindernis te overwinnen, hebben we de volgende oplossing voorgesteld.

Ze zouden ons low-code platform Module Designer kunnen gebruiken om een ​​pagina te ontwerpen die in 3 delen zou worden opgedeeld. 

Het eerste deel toont een lijst met projecten, het volgende deel toont mijlpalen die zijn gekoppeld aan het geselecteerde project en het derde deel toont de taken die zijn gekoppeld aan het geselecteerde project en mijlpalen. Het zou lijken op de Outlook-mailbox, die e-mails en hun inhoud aan de rechterkant toont. In dit geval geeft het 3-niveau taakdetails aan het einde weer.

Om deze mogelijkheid te bouwen, zouden we een aangepaste lijstpagina bouwen die kan worden toegevoegd met behulp van de 'LIST_ADD_VIEWTYPE' bestanddeel. Zien hier bijvoorbeeld. 

Vervolgens wordt de functie VTAP.API.Get gebruikt om de project-, projectmijlpaal- en taakgegevens op te halen. Ze zouden in afzonderlijke kolommen worden weergegeven, maar zouden nog steeds met elkaar verbonden zijn. U kunt de code kopiëren van hier om het in actie te zien.
 
 

Vtiger APPtitude 

 

Hulpmiddelen die we leuk vinden

 
 

Elasticsearch is een geweldig open-sourceproject om aan bij te dragen als je geïnteresseerd bent in datawetenschap. Het kan grote hoeveelheden gegevens in realtime analyseren, doorzoeken en opslaan. Elasticsearch helpt haar gebruikers om data op veel verschillende manieren aan het werk te zetten.
 

Elasticsearch is een geweldig open-sourceproject om aan bij te dragen als je geïnteresseerd bent in datawetenschap. Het kan grote hoeveelheden gegevens in realtime analyseren, doorzoeken en opslaan. Elasticsearch helpt haar gebruikers om data op veel verschillende manieren aan het werk te zetten.
 
 

Binnenkort Beschikbaar

 
 

App-ontwerper 

Met de app-ontwerper van Vtiger kunt u aangepaste apps bouwen die al dan niet afhankelijk zijn van de CRM. Het geeft je de flexibiliteit om apps te schrijven in elk JavaScript-framework waar je expertise in hebt.

Met krachtige VTAP JavaScript API's kunt u ook verbinding maken met de CRM en gegevens hiervan pushen/puwen om eenvoudig aangepaste applicaties te bouwen.
 

App-ontwerper 

Met de app-ontwerper van Vtiger kunt u aangepaste apps bouwen die al dan niet afhankelijk zijn van de CRM. Het geeft je de flexibiliteit om apps te schrijven in elk JavaScript-framework waar je expertise in hebt.

Met krachtige VTAP JavaScript API's kunt u ook verbinding maken met de CRM en gegevens hiervan pushen/puwen om eenvoudig aangepaste applicaties te bouwen.
 
 

Schrijf je in om de laatste updates te ontvangen!

 
 

Copyright 2024 Vtiger. Alle rechten voorbehouden. Diverse handelsmerken van hun respectievelijke eigenaren.