Configurer un tableau de saisie avec filtres et sélection de date

mndiaye · June 3, 2024, 12:06pm

Version

Version 5.2.54

Description

Bonjour à tous,

Je suis actuellement confronté à un problème. Je dois permettre à l’utilisateur de saisir des données directement sur la plateforme. Cependant, le problème auquel je suis confronté est que l’utilisateur doit entrer environ une vingtaine de lignes en moyenne pour chaque objet, et le template classique ne permet la saisie que ligne à ligne et champ par champ, ce qui peut être fastidieux.

Je souhaiterais créer un template sous la forme d’un tableau pour simplifier cette tâche. Idéalement, l’utilisateur pourrait utiliser des boutons de filtre pour choisir des valeurs par défaut pour certains champs, et remplirait les autres champs manuellement.

De plus, s’agissant de données chronologiques mensuelles, je voudrais que l’utilisateur puisse choisir une date via une liste déroulante (par exemple, janvier 2025) et que cela génère automatiquement le bon nombre de lignes pour la saisie (par exemple, de juin 2024 à janvier 2025, soit 8 lignes).

Voici mes besoins en résumé :

Créer un template de saisie de données sous forme de tableau.
Permettre à l’utilisateur de sélectionner des valeurs par défaut pour certains champs via des boutons de filtre.
Simplifier la saisie des autres champs restants.
Générer automatiquement le nombre de lignes nécessaires en fonction de la période sélectionnée.

Est-ce que quelqu’un a déjà rencontré ce type de besoin ou aurait des conseils ou des exemples à partager sur la manière de procéder ?

Merci d’avance pour votre aide !

Mathias.

nathalie · June 3, 2024, 12:59pm

Bonjour,

Toutes les listes Simplicité sont éditables. Vous pouvez donc proposer aux utilisateurs d’utiliser cette fonction pour la saisie des données.
https://docs.simplicite.io/lesson/docs/ui/basic-usage#edit-list
Les valeurs par défaut peuvent s’implémenter par paramétrage ou par code lorsque nécessaire.
Le fait de générer des données à la volée peut également s’implémenter par code en fonction de dates ou autres.
https://docs.simplicite.io/lesson/docs/core/advanced-code-examples

mndiaye · June 3, 2024, 1:45pm

Bonjour Nathalie,

Merci pour votre réponse.

Je sais qu’il est possible d’utiliser la fonction “Edit List / Create on List” pour créer des instances de notre objet plus rapidement. Cependant, cela reste long et fastidieux pour l’utilisateur lorsqu’il doit saisir de nombreuses lignes.

Pour résoudre ce problème, j’aimerais modifier l’interface du menu “Create on List” en ajoutant des boutons et des champs de texte permettant à l’utilisateur de spécifier le nombre de lignes qu’il souhaite charger. De plus, avec ces boutons, il aurait la possibilité de choisir des valeurs par défaut pour certains champs.

L’idée est que l’utilisateur n’aurait qu’à remplir les champs qui ne sont pas automatiquement générés, puis sauvegarder. Cela rendrait le processus beaucoup plus efficace et rapide.

Cependant, je n’ai pas trouvé ce type d’implémentation dans la documentation. Auriez-vous des exemples ou des conseils sur la manière de procéder pour personnaliser l’interface de cette manière ?

Merci d’avance pour votre aide !

Mathias

nathalie · June 3, 2024, 2:02pm

Je vous conseille alors de faire une action de liste avec des attributs d’actions pour les valeurs par défaut. cette action de liste ne s’effectuerait que sur une liste filtrée ou une sélection de données.

https://docs.simplicite.io/lesson/docs/core/custom-actions-examples

mndiaye · June 6, 2024, 8:05am

Bonjour Nathalie,

Merci pour ton aide. Je viens de finir l’implémentation de l’action de liste avec dans mon code la partie javascript pour afficher la liste en format éditable. Cependant lorsque j’essaye d’entrer des valeurs et de sauvegarder j’ai ce message d’erreur pour toutes les lignes. Une idée pourquoi ?

nathalie · June 6, 2024, 8:30am

Bonjour Mathias,

C’est un message de concurrence d’accès.
Est ce que l’action est sur la liste principale ou une page d’accueil ?

mndiaye · June 6, 2024, 8:45am

J’aurais tendance à dire sur la liste principale. On a une vu qui nous permet de voir toutes les instances de notre objet. Voila à quoi ca ressemble.

nathalie · June 6, 2024, 8:48am

Peux tu m’envoyer le code de l’action ?

mndiaye · June 6, 2024, 8:54am

/** Action: load HV CPI */
@BusinessObjectAction
public String loadHVCPI(Map<String, String> params) {
try {

	BusinessObjectTool fevTool = new BusinessObjectTool(this);
	ForexForeignExchangeRate foreignExchangeRate = (ForexForeignExchangeRate) getGrant().getTmpObject("ForexForeignExchangeRate");
	foreignExchangeRate.setForeignExchangeRateTool();

	//Retrieve values the user gave
	String country = params.get("countryToLoad");
	String nbRates = params.get("nbRatesToLoad");
	int nbRatesInt = Integer.parseInt(nbRates);
	String importDateToLoad = params.get("importDateToLoad");
	String businessProcessString = params.get("businessProcessToLoad");
	String isoCode = "";
	
	//Process data to have data to the right format 
	switch(businessProcessString){
		case "Monthly_Forecast":
			businessProcessString = "Monthly Forecast High Volatility CPI";
			break;
		
		case "Monthly_Actual":
			businessProcessString = "Monthly Actual High Volatility CPI";
			break;
	}
	
	switch(country){
		case "Argentina":
			isoCode = "AR";
			break;
		
		case "Turkey":
			isoCode = "TR";
			break;
	}
	
	DateTimeFormatter originalFormat = DateTimeFormatter.ofPattern("yyyy-MM-dd");
    	DateTimeFormatter targetFormat = DateTimeFormatter.ofPattern("dd/MM/yyyy");

    	// Parse the date string to a LocalDate object
		LocalDate date = LocalDate.parse(importDateToLoad, originalFormat);

    // Format the LocalDate object to the target date string
    String importDateToLoadFormatted = date.format(targetFormat);
	
	//Setting up Business Process Object
	ForexBusinessProcess businessProcess;
	businessProcess = (ForexBusinessProcess)getGrant().getTmpObject("ForexBusinessProcess");
	businessProcess.setBusinessProcessTool();
	
	BusinessProcess bpToLoad= businessProcess.getBpByAttributes(businessProcessString);
	String type = bpToLoad.getType();

	
	ForeignExchangeRate ferCPI = null;

	
	//To create or find right rate status
	if(type.equals("ACTUAL")){
		ferCPI = foreignExchangeRate.getFerByAttributes(null, bpToLoad.getRowId());
		
		if(ferCPI ==  null){
			foreignExchangeRate.setForeignExchangeRate("Renault Headquarter", bpToLoad.getProductionProcess(), ForeignExchangeRate.Status.VALIDATED.label, null, bpToLoad.getRowId());
			ferCPI = foreignExchangeRate.getFerByAttributes(null, bpToLoad.getRowId());
		}
	}
	
	//To create or find right rate status
	if(type.equals("FORECAST")){
		ferCPI = foreignExchangeRate.getFerByAttributes(importDateToLoadFormatted, bpToLoad.getRowId());
		
		if(ferCPI ==  null){
			foreignExchangeRate.setForeignExchangeRate("Renault Headquarter", bpToLoad.getProductionProcess(), ForeignExchangeRate.Status.VALIDATED.label, importDateToLoad, bpToLoad.getRowId());
			ferCPI = foreignExchangeRate.getFerByAttributes(importDateToLoadFormatted, bpToLoad.getRowId());
		}
	}

	//Generate pre-filled rows
	for(int i=0; i < nbRatesInt; i++){
		this.resetValues(true);;
		this.setFieldValue("forexEcoValuesId", "1234");  //id doesn't matter cause it will be overriden
		this.setFieldValue("forexEcoValuesCountry", country);
        this.setFieldValue("forexEcoValuesCountryIsoCode", isoCode);
        //this.setFieldValue("forexEcoValuesValue", 1.14);
        this.setFieldValue("forexEcoValuesPhase", type);
        //this.setFieldValue("forexEcoValuesValueDate", "2021");
        this.setFieldValue("ForexEcoValues_ForexForeignExchangeRate_id", ferCPI.getRowId());
        fevTool.validateAndSave();
	}
	
	return "javascript: $ui.displayList(null, \"ForexEcoValues\",{nav:'add', fixedFilters: {'ForexEcoValues_ForexForeignExchangeRate_id': '671'}, edit: \"rows\", context: $ui.CONTEXT_UPDATE}, null)";
	
} catch (Exception e) {
	AppLog.info("Error message : " + e, getGrant());
	return null;
}

}

nathalie · June 6, 2024, 9:30am

Vous devez utiliser une instance différente de la main instance pour générer vos ForexEcoValues (une instance Tmp par exemple).

https://docs.simplicite.io/lesson/tutorial/development/instances

Dans les versions 5 la méthode de l’action a comme paramètre

public String myAction(Action action) {
	// String field (text, date...)
	String param = action.getConfirmField("myStringField").getValue();
    int i = action.getConfirmField("myStringField").getInt(0);
    ...

mndiaye · June 6, 2024, 2:50pm

Merci, je réussis à sauvergarder la liste éditée maitenant. Cependant, une fois la liste sauvegardée je ne vois plus que la liste filtrée que j’ai filtrée avec la commande javascript. Et il m’est impossible de retirer le filtre manuellement comme tu peux le voir ci-dessous. Le seul moyen que j’ai trouvé pour revoir la liste complète est de recharger la page, saurais-tu m’aider sur ce point ?

J’en profite également pour poser une autre question. Voici la commande javascript pour afficher la liste en format éditable avec les bon filtres :
javascript: $ui.displayList(null, "ForexEcoValues",{nav:‘add’, fixedFilters: {‘ForexEcoValues_ForexForeignExchangeRate_id’: ‘671’}, edit: "rows", context: $ui.CONTEXT_UPDATE}, null)

Sais-tu comment je pourrais passer une valeur en paramètre pour que le filtrage se fasse dynamiquement en fonction d’une variable en back ?

Merci d’avance Nathalie.

nathalie · June 6, 2024, 4:00pm

Utilise plutôt des filtres utilisateurs qui peuvent être enlevés par l’utilisateur.
filters au lieu de fixedFilters.

Voici un exemple avec une valeur paramétrable et en V5
context : $ui.app.CONTEXT_UPDATE

String js ="$ui.displayList(null, \"DemoClient\",{"
                        + "nav:'add', edit: \"rows\", context: $app.CONTEXT_UPDATE,"
                        + "filters:{\"demoCliLastname\":'"
                        + value
                        + "' }"
                        + "}, null)";

mndiaye · June 7, 2024, 7:53am

Bonjour Nathalie,

Merci pour ta réponse.

Voici ci-dessous mon string js. J’utilise bien l’option filters désormais à la place de fixedFilters. Mais je ne peux toujours pas retirer les filtres manuellement une fois la liste éditéé. (comme tu peux le voir ci-dessous)

String js = "javascript: $ui.displayList(null, \"ForexEcoValues\",{"
        				+ "nav:'add', filters: {'ForexEcoValues_ForexForeignExchangeRate_id': '"
        				+ ferCPI.getRowId()
        				+ "'}, edit: \"rows\", context: $ui.CONTEXT_UPDATE}, null)"

nathalie · June 7, 2024, 9:48am

Bonjour Mathias,

Je ne le vois pas dans ta copie d’écran.
Normalement, tu vois les filtres sur l’entête de liste.

mndiaye · June 7, 2024, 1:00pm

Bonjour Nathalie,

Justement c’est ca la problème. Maintenant j’utilise bien filters et non fixedFilters mais je ne vois quand même pas les filtres sur l’entête de liste.

nathalie · June 7, 2024, 4:03pm

L’id n’est pas un champ de recherche. Il faut choisir un libellé.

mndiaye · June 11, 2024, 9:27am

Top merci, tout marche parfaitement maintenant !
Merci beaucoup pour ton aide précieuse Nathalie !

nathalie · June 11, 2024, 9:42am

Nous conseillons aux utilisateurs de marquer comme “solution” la réponse résolvant leur problématique pour permettre au support de mieux suivre les sujets non résolus, et à la communauté de trouver plus facilement la bonne réponse.

Vos messages indiquant une résolution du problème, nous avons réalisé cette opération pour vous.

system · June 11, 2024, 10:43am

This topic was automatically closed 60 minutes after the last reply. New replies are no longer allowed.