#ImpolyzerDataStudio© 4.0.0.171 #FIREDAC #LOCALSQL #BATCHMOVE

 #ImpolyzerDataStudio© 4.0.0.171

POSTED BY GIULIANO PAGNINI, 19 GEN 2024

New!!  Path con variabili

Nei percorsi dei database [ORIGINE] e [DESTINAZIONE] è possibile inserire le variabili tra ## esempio; C:\LATISANA\#COMUNE#\2024

Tutte le fasi del progetto di importazione vengono aggiornate con il valore della variabile

Le variabili possono essere configurate nel menu REGOLE - Variabili del Progetto

New!!  Nuove regole "se il contenuto del campo > o <  di n.caratteri" allora copia il contenuto nel campo x , altrimenti altro o ignora regola.

New!!  Firedac local-sql potenziato

Creazione di complesse query [IN - NOT IN] con ORIGINI miste (Excel, CSV,SQL,CData,ect)

    Senza scrivere codice SQL

  Esempio di query IN tra due fogli Excel

New!!  REST Tester potenziato

Nuove funzioni in working..... 

#CStrapJSStudio© #Vue.js 3.4 #Bootstrap Italia - Uso dei componenti #vue.js senza compilazione

#Vue.js 3.4 in #Bootstrap Italia© con #CStrapJSStudio©

POSTED BY GIULIANO PAGNINI, 13 GEN 2024

Come utilizzare Vue.js 3.4 con Bootstrap Italia in siti o portali web senza compilazione e senza uso di strumenti aggiuntivi come Node,VueCli, ect, usando CStrapJSStudio.

Nel Component Manager di CStrapJSStudio sono stati implementati wizard per la creazione dei componenti Vue.js 3.4 senza compilazione

Un esempio di componente data-source creato dal Component-Manager per l'uso senza compilazione

il codice del data source e le proprietà dell'object inspector

le props  passate al componente e gli eventi intercettati

<data-source :url="'pg-url:'" :nodo="'pg-nodo:'" :name="'pg-name:'" @onsuccess="pg-Onsuccess:" @onmessage="pg-OnError:"></data-source>

Componente notizie di Bootstrap Italia riscritto per Vue.js 3.4 senza compilazione

il codice del componente notizie

  <notizie :dataset="pg-name:"></notizie>

la proprietà name: (nome del dataset del componente data source)

            

Componente tabella di Bootstrap Italia per Vue.js 3.4 senza compilazione

il codice del componente tabella

<table-custom :dataset="pg-name:" :columns="['title','description']"></table-custom>

la proprietà name: (nome del dataset del componente data source)

I componenti nella pagina del Router di Vue.js (senza compilazione e strumenti aggiuntivi) con anteprima istantanea delle modifiche
Il componente tabella e il componete notizie.

Il componente data source prima del Router. L'applicazione vue.js è inserita tra l'header e il footer del portale web.

Se il data source riceve correttamente i dati dal server Rest, attiva l'evento this.$emit('onsuccess', response.status) e viene aperta la 'page1' del router

 

CStrapJSStudio sempre più RAD e NO CODE.

#CStrapJSStudio© Vue.js 3 Bootstrap 5.2 - Gestione degli spuntisti [mercato] con ricarica PagoPa©

Gestione degli spuntisti [mercato] con ricarica PagoPa©.

POSTED BY GIULIANO PAGNINI, 28 DIC 2023 

In questo esempio un semplice case studies di un applicazione web destinata agli operatori del Comune per registrare le presenze degli spuntisti nei vari mercati comunali.

Lo spuntista acquista le ricariche con tagli predefiniti (€.20 /30/ 50) e l'operatore registra le presenza con l'app web collegata al database di UNICOXE

Il server web espone una serie di API-REST per l'autenticazione dell'operatore, l'elenco dei mercati comunali,il saldo disponibile, il calcolo del dovuto, e il salvataggio nel DB delle presenze.

Autenticazione dell'operatore

Selezione del mercato

Ricerca dello spuntista per IDUTENTE,NOME COGNOME,CODICE FISCALE - P.IVA

Ricerca dello spuntista per IDUTENTE,NOME COGNOME,CODICE FISCALE - P.IVA

Calcolo con le tariffe di UNICOXE e nuovo saldo disponibile.

Dettaglio del calcolo

Stampa e assegna posto se saldo disponibile.

Accesso diretto al database di UNICOXE

Novità della nuova versione di CStrapJS

Anteprima dei componenti e delle pagine del Router con aggiornamento automatico del layout al variare delle proprietà

New Controller  della logica dei componenti Vue.js e delle pagine del Routers

New Editor  con accesso diretto alle variabili, funzioni, metodi e proprietà del controller. Nuova gestione degli snipping

New Editor! Nuovi editor per gli snipping l'auto correzione del  codice e il completamento automatico

 

Molto altro in arrivo.... Buon fine e Buon inizio!!!!

#CStrapJSStudio© e #ChatGPT©. Come creare un componente form dinamico con bootstrap© e axios.js

Come creare un componente form dinamico con bootstrap© e axios.js.

POSTED BY GIULIANO PAGNINI, 01 DIC 2023

In questo esempio vedremo come creare un form dinamico per il post dei dati che si adatta a ogni schema tabella.

Partiamo da un database Excel che verrà trasformato in MemTable e salvato nel server REST per testare le nostre API-REST

Con ImpolyzerDataStudio apriamo il file Excel (ODBC Source o CDATA connector)

Salviamo la tabella nella sottocartella TABLE del server REST (Esporta in MemTable)

Da ImpolyzerDataStudio testiamo il collegamento  [GET] http://127.0.0.1:8081/memtable?table=budget.bin

Inseriamo un componente Form in CStrapJSStudio

In CStrapJSStudio tutti i componenti che contengono un Form vengono evidenziati nello schema manager con 

E il comando Add Field si attiva

Con il comando Add Field è possibile aggiungere al form i campi di qualsiasi MemTable creata con ImpolyzerDataStudio

Confermare i campi desiderati e selezionare il comando Crea Campi

Nel Form verranno aggiunti in automatico tutti i campi della MemTable con la rispettiva Type

e sarà possibile testare il funzionamento del form con i salvataggi sulla MemTable

ogni input box può essere personalizzato con il type desiderato:

L'impaginazione degli elementi con anteprima immediata per tutti i dispositivi

(con bootstrap nella dodicesima parte dello schermo)

Il codice JS del form 

const form = document.getElementById('myForm-pg-id:'); rende unico il form nell'applicazione

#C++Builder #RadStudio #ImpolyzerDataStudio #Citizen Developer #RadWebBuilder

CSTRAPJSSTUDIO© e ChatGPT©. Come creare un componente DBGrid dinamico con bootstrap© e campo ricerca.

 #CStrapJSStudio© e  #ChatGPT©.  Come creare un componente DBGrid dinamico con bootstrap© e campo ricerca.

POSTED BY GIULIANO PAGNINI, 27 NOV 2023

In questo esempio vediamo come utilizzare la proprietà SCRIPT_SERVICE,  la proprietà ID e lo switch RELEASE/DEBUG

Quando si lavora con le API-REST è fondamentale avere un ambiente di test (magari senza autenticazione per testare i vari controlli/funzioni)

Nel menu progetto è possibile configurare le proprietà globali Release e Debug

La finestra con nome della proprietà Globale e il codice/testo da inserire in Debug/Release

Abbiamo rivolto a ChatGPT la seguente domanda: il codice per creare una tabella dinamica, che legge i dati da API-Rest, con campo ricerca. 

Questo lo script. 

Questo il codice HTML:

                                                        Lo style:

Per creare il componente in CStraJSStudio, dal menu File - Crea componente/Blocco con ChatGPT

Lo script è stato creato come service con il suo JID identificativo unico, in questo modo non sarà mai duplicato e sarà inserito dal compilatore prima di tutti gli altri script e disponibile a tutti i componenti.

Come rendere lo script di ChatGPT una funzione disponibile a tutti i controlli DBGrid? basta trasformarlo in funzione.

Questo il codice originale:

Queste le modifiche per renderlo Service:

Alla funzione bisogna passare gli ID della tabella relativi all'header, body e edit di ricerca oltre all'URL e al nome del nodo della response

(IDtableHeaders,IDTableBody,IDsearchInput,URLLink,table)

Come rendere il componente autonomo? con la proprietà ID e Script_Bottom

Aggiungiamo al componente le proprietà ID e script_pg_bottom

nella proprietà script_pg_bottom inseriamo il seguente codice

InitTableRest('tableHeaderspg-id:','tableBodypg-id:','searchInputpg-id:'

,'pg-URLLink:','table');

Aggiorniamo il codice HTML del componente aggiungendo ai vari elementi ID il terminatore pg-id:

<tbody id="tableBody">

<input type="text" id="searchInput" 
 <tr id="tableHeaders">
diventano:
<tbody id="tableBodypg-id:">
<input type="text" id="searchInputpg-id:" 
 <tr id="tableHeaderspg-id:">

Con poche modifiche abbiamo creato un componente DBGrid dinamico autonomo con ricerca su tutti i campi della tabella, da utilizzare nei progetti bootstrap.

Salvare il nuovo blocco come componente riutilizzabile con la funzione Salva Blocco come componente

Il componente disponibile per nuovi progetti

Un esempio di due tabella nella stessa pagina collegate a comuni.bin e vie.bin.

Personalizzare lo stile a proprio piacimento.

Ne vedremo delle belle!!!!!!!