Préface
Lorsque mon équipe développait le module de système fiscal, j'ai constaté qu'elle devait consacrer 80 % de son temps à résoudre des problèmes de calcul, notamment les calculs dans la grille. Ce temps était consacré à :
Écrivez le code js frontal (car la saisie de l'utilisateur dans le tableau affectera d'autres cellules, donc la nouvelle valeur après le calcul doit être présentée immédiatement à l'utilisateur) Écrivez le code back-end (car les modifications apportées par l'utilisateur aux données du tableau affecteront d'autres tables, il est donc nécessaire de mettre à jour les données de la table concernée lorsque l'utilisateur clique sur Enregistrer) Implémenter des méthodes de calcul modifiées, obligeant les développeurs à modifier le codeJ'ai donc étudié les fonctions d'autres modules fiscaux et constaté que le système fiscal utilise un grand nombre de contrôles de table, qui impliquent plus ou moins des problèmes de calcul. Les méthodes de calcul sont toutes codées en dur.
Le calcul, cette action de codage courante, rappelle en fait beaucoup les formules d'Excel, sans compter que le document d'exigences lui-même est fourni sous forme d'Excel. Lorsque nous utilisons Excel, nous pouvons définir des formules dans les cellules En modifiant la valeur de la cellule source, Excel calculera automatiquement la formule de la cellule et attribuera la valeur du résultat à la cellule cible. Alors, peut-on se référer à ce modèle ? Les développeurs n'ont plus besoin d'écrire une logique de calcul compliquée et difficile. Il leur suffit de les convertir en instructions dans un certain format selon les formules fournies par l'implémentation, puis d'appeler un certain moteur de calcul pour le faire. afficher les résultats, présenter les résultats à l'utilisateur ou les conserver dans la base de données ? La réponse est oui, et le cœur de tout cela est le moteur de calcul automatique, AutoCalculate.
effet
AutoCalculate est une solution pour les calculs de tableaux complexes, vous permettant d'enregistrer des centaines ou des milliers de lignes de code logique de calcul. Désormais, écrire du code est aussi simple que d'écrire des formules Excel.
Champ d'application
réception :
Convient aux opérations complexes avec des formules dans tous les contrôles de table js tels que les tables ElementUI, les contrôles EasyUI Grid, ParamQuery Grid, etc.
En coulisses :
Applicable, nécessite un moteur V8
Utilisation de la réception
AutoCalculate se compose de deux parties, à savoir la formule et le moteur de calcul. La formule est une chaîne écrite selon une syntaxe spécifique, telle que : [Month12,1]#3 = [Month11,1] * 10. Le moteur de calcul est AutoCalculate. .js. Responsable de l'analyse des formules. Commençons par comment écrire des formules.
cellule
Supposons qu'il existe un tel scénario, cellule ① = cellule ② + cellule ③, la formule correspondante est :
[Mois1,1] = [Mois1,2] + [Mois1,3]
Voyons d'abord ce que représente [Month1,1] Tout d'abord, les crochets [ ] représentent une cellule, Month1 est le nom de la colonne correspondant à « Janvier », suivi d'une virgule , et le 1 suivant représente RowNo = 1. . Et ainsi de suite,
[Month1,2] représente la cellule dont la colonne est "Janvier" et RowNo = 2
[Month1,3] représente la cellule dont la colonne est "Janvier" et RowNo = 3
Nous pouvons donc utiliser [y,x] pour représenter une cellule, y est le nom de la colonne, également appelé ordonnée, x est la valeur de RowNo, également appelée abscisse
Que se passe-t-il si le tableau n'a pas de colonne RowNo ? Si vous voulez trouver la réponse, continuez à lire
Laissez la formule faire effet
//Introduisez d'abord AutoCalculate.js importer AutoCalculate depuis '../components/AutoCalculate' ; ... //Définissez une instance AutoCalculate, formulas est le tableau de formules let autoCal = new AutoCalculate(formulas); /* Appelez la méthode cal * gridDatas (obligatoire) : données de la table * refField (obligatoire) : champ de référence, c'est-à-dire quelle valeur de champ est x dans la cellule [y,x] */ autoCal.cal(gridDatas, refField);
formule de surface
En effet, en plus de janvier, février, mars... il existe également une formule similaire pour octobre, à savoir :
[Mois1,1] = [Mois1,2] + [Mois1,3] [Mois2,1] = [Mois2,2] + [Mois2,3] [Mois3,1] = [Mois3,2] + [Mois3,3] … … … [Mois10,1] = [Mois10,2] + [Mois10,3]
En d'autres termes, nous devons écrire 10 formules de ce type. Pour des scénarios simples, cela ne pose pas de problème. Cependant, pour certains tableaux contenant un grand nombre de formules, cette méthode d'écriture présente certains inconvénients, comme la facilité de faire des erreurs, et la formule est longue, il faut aussi plus de temps pour finir d'écrire. Il existe donc la formule de l’aire.
En observant les formules ci-dessus, nous pouvons constater que chaque formule peut en fait être remplacée par une formule, telle que la formule suivante :
[@,1] = [@,2] + [@,3]
Il n'y a pas de nom de colonne clair ici, juste un espace réservé @ est utilisé, mais il suffit de représenter les 10 formules ci-dessus. Pour le moment, il nous suffit de remplir les noms de colonnes aux positions appropriées, la formule finale est donc :
{Mois1, Mois2, Mois3, Mois4, Mois5, Mois6, Mois7, Mois8, Mois9, Mois10}[@,1] = [@,2] + [@,3] Vous devez séparer les noms de colonnes par , les placer entre accolades { } , de sorte qu'1 formule équivaut à 10 formules.
Les espaces réservés peuvent être utilisés non seulement pour les ordonnées, mais également pour les abscisses, comme le montre la formule suivante :
//Formule 1 : [AnnéeTotal,3] = [Mois1,3] + [Mois2,3] + [Mois3,3] + [Mois4,3] + [Mois5,3] + [Mois6,3] + [Mois7,3] + [Mois8 ,3] + [Mois9,3] + [Mois10,3] //Formule 2 : [AnnéeTotal,4] = [Mois1,4] + [Mois2,4] + [Mois3,4] + [Mois4,4] + [Mois5,4] + [Mois6,4] + [Mois7,4] + [Mois8 ,4] + [Mois9,4] + [Mois10,4] //Formule 3 : [AnnéeTotal,5] = [Mois1,5] + [Mois2,5] + [Mois3,5] + [Mois4,5] + [Mois5,5] + [Mois6,5] + [Mois7,5] + [Mois8 ,5] + [Mois9,5] + [Mois10,5] //Formule 4 : [AnnéeTotal,6] = [Mois1,6] + [Mois2,6] + [Mois3,6] + [Mois4,6] + [Mois5,6] + [Mois6,6] + [Mois7,6] + [Mois8 ,6] + [Mois9,6] + [Mois10,6] //Formule 5 : [AnnéeTotal,2] = [Mois1,2] + [Mois2,2] + [Mois3,2] + [Mois4,2] + [Mois5,2] + [Mois6,2] + [Mois7,2] + [Mois8 ,2] + [Mois9,2] + [Mois10,2] //Formule 6 : [AnnéeTotal,7] = [Mois1,7] + [Mois2,7] + [Mois3,7] + [Mois4,7] + [Mois5,7] + [Mois6,7] + [Mois7,7] + [Mois8 ,7] + [Mois9,7] + [Mois10,7] //Formule 7 : [AnnéeTotal,9] = [Mois1,9] + [Mois2,9] + [Mois3,9] + [Mois4,9] + [Mois5,9] + [Mois6,9] + [Mois7,9] + [Mois8 ,9] + [Mois9,9] + [Mois10,9] //Formule 8 : [AnnéeTotal,12] = [Mois1,12] + [Mois2,12] + [Mois3,12] + [Mois4,12] + [Mois5,12] + [Mois6,12] + [Mois7,12] + [Mois8 ,12] + [Mois9,12] + [Mois10,12] //Formule 9 : [AnnéeTotal,13] = [Mois1,13] + [Mois2,13] + [Mois3,13] + [Mois4,13] + [Mois5,13] + [Mois6,13] + [Mois7,13] + [Mois8 ,13] + [Mois9,13] + [Mois10,13]
En utilisant la formule d’aire, cela peut s’écrire :
{2, 3, 4, 5, 6, 7, 9, 12, 13}[AnnéeTotal,@] = [Mois1,@] + [Mois2,@] + [Mois3,@] + [Mois4,@] + [ Mois5,@] + [Mois6,@] + [Mois7,@] + [Mois8,@] + [Mois9,@] + [Mois10,@]On voit que la formule d’aire apporte une grande commodité à l’écriture des formules.
Prise en charge de la syntaxe js
Dans les scénarios réels, nous rencontrons souvent des formules complexes, comme indiqué ci-dessous. La formule de cellule utilise la fonction Max fournie avec Excel. Pour une telle formule, nous pouvons l'écrire comme ceci :
[Mois1,9] = ([Mois1,6] - [Mois1,7] - [Mois1,8] > 0 ? [Mois1,6] - [Mois1,7] - [Mois1,8] : 0) + [Mois1 ,5]
Comme vous pouvez le voir, la formule prend en charge la syntaxe js. Vous pouvez mettre une variable js ou même une fonction js à droite du signe égal de la formule. Tant qu'il s'agit d'une syntaxe reconnue par le moteur d'analyse js, elle est prise en charge. .
Une chose à noter ici est que vous ne pouvez pas mettre des éléments de tableau dans des formules, car les éléments de tableau js ont généralement des symboles "[ ]", ce qui entre en conflit avec l'indicateur de cellule "[ ]" dans les formules, donc les éléments de tableau sont interdits, veuillez être conscient de ce.
[y]Formule
Examinons ensuite un autre scénario, comme le montre la figure, dans lequel il existe une telle relation :
Cellule ① = Cellule ② - Cellule ③
Vous pourriez écrire rapidement la formule suivante :
[colonne3,1] = [colonne2,1] - [colonne1,1] [colonne3,2] = [colonne2,2] - [colonne1,2]
Il n'y a rien de mal à écrire de cette façon, mais je dois vous rappeler que les lignes ici ne sont pas fixes, c'est-à-dire que le nombre de lignes dans le tableau dépend entièrement de la situation de la base de données à ce moment-là. il n'y a que 3 lignes de données aujourd'hui, 5 lignes demain et après-demain il y aura 50 lignes. Il nous est impossible d'ajouter des formules à mesure que le nombre de lignes augmente, donc pour ce genre de tableau avec un nombre de lignes incertain, nous avons une nouvelle façon d'écrire, je l'appelle la formule [y], car par rapport aux formules ordinaires. , il n'a pas de coordonnée horizontale :
[colonne3] = [colonne2] - [colonne1]
Avec une seule ligne de formules, AutoCalculate appliquera la formule à toutes les lignes sous le nom de colonne spécifié.
Total des colonnes et décimales
Parfois, nous devons trouver la somme d'une certaine colonne. Bien que trouver la somme d'une certaine colonne ne soit pas notre objectif ultime, c'est une étape nécessaire pour terminer le calcul. Par exemple, la relation suivante existe :
Cellule ③ = Cellule ① / Cellule ②
La cellule ② est la valeur totale de GroupApprovedTotal , que nous utilisons <列名> pour représenter, c'est-à-dire : <GroupApprovedTotal> . De plus, les lignes ici ne sont pas fixes et la formule [y] doit être utilisée, la formule doit donc être écrite comme suit :
[GroupApprovedTotalPercent] = [GroupApprovedTotal] / <GroupApprovedTotal>
Nous savons qu'en division, le diviseur ne peut pas être 0, donc la bonne façon de l'écrire devrait être :
[GroupApprovedTotalPercent] = <GroupApprovedTotal> === 0 : [GroupApprovedTotal] / <GroupApprovedTotal>
Lorsque vous mettez cette formule dans votre code et démarrez le programme, vous devez être intelligent et constater rapidement que la valeur que vous obtenez n'est pas assez précise. Par exemple, la valeur affichée dans la cellule ③ ci-dessus est de 66,91 % si votre cellule ① et Cell. ② a la même valeur que l'image ci-dessus. Votre cellule ③ est probablement de 67 %. Pourquoi ?
Par défaut, AutoCalculate conservera le résultat du calcul à 2 décimales, 67 %, soit 0,67. Si vous souhaitez obtenir 66,91 %, soit 0,6691, vous devez conserver 4 décimales. À ce stade, vous devez indiquer à AutoCalculate. que vous devez conserver 4 décimales. L'écriture complète doit donc être :
[GroupApprovedTotalPercent]#4 = <GroupApprovedTotal> === 0 : [GroupApprovedTotal] / <GroupApprovedTotal>
À gauche du signe égal dans la formule et à droite de la cellule attribuée, ajoutez un signe « # », suivi du nombre de décimales. Notez qu'il ne peut pas y avoir d'espace entre le « # » et le nombre de. décimales, et il peut y avoir des espaces avant et après.
Tableau sans RowNo
Il est enfin temps de répondre à cette question. Je veux demander à tout le monde : comment trouver un point dans un avion ? La réponse est que nous avons besoin de l’abscisse et de l’ordonnée de ce point. De même, comment trouver une cellule dans un tableau ? Nous pouvons d’abord déterminer l’ordonnée car tous les noms de colonnes sont connus. La clé réside dans la détermination de l’abscisse. Si vous utilisez RowNo pour le positionnement, vous vous sentirez certainement familier, car il est très similaire au numéro de série sur le côté gauche d'Excel, mais cela ne signifie pas que seuls les chiffres peuvent être utilisés comme abscisses. Tant que la valeur est unique, c’est-à-dire non répétée, elle peut être utilisée comme abscisse.
Par exemple, en supposant que le tableau suivant comporte deux lignes fixes et aucun RowNo, mais que l'on peut voir que le numéro d'entreprise (BuCode) est unique, alors BuCode peut être utilisé comme champ de référence, et la valeur de BuCode est l'abscisse, alors la formule peut s'écrire :
[SumDiffMonth1,F1136] = [GroupApprovalMonth1,F1136] - [Mois1,F1136] [SumDiffMonth1,F2056] = [GroupApprovalMonth1,F2056] - [Mois1,F2056]
S'il y a RowNo, utilisez RowNo comme champ de référence et écrivez comme ceci :
[SumDiffMonth1,2] = [GroupApprovalMonth1,2] - [Mois1,2] [SumDiffMonth1,3] = [GroupApprovalMonth1,3] - [Mois1,3]
Calculer sur plusieurs sources de données
Qu’est-ce que le calcul multi-sources de données ? Les amis qui ont utilisé des formules Excel devraient être capables de comprendre ce que représente la formule dans la cellule ci-dessous. Évidemment, la valeur de cette cellule est la valeur calculée d'autres données de feuille. Le calcul de sources de données croisées est spécifiquement conçu pour gérer de tels scénarios.
Nous effectuons rarement, voire jamais, des calculs de sources de données croisées au premier plan. Ici, je veux vous expliquer comment écrire des formules et appeler AutoCalculate afin que vous puissiez réellement l'utiliser dans le chapitre "Utilisation du backend".
Tout d’abord, afin d’obtenir des données à partir d’autres cellules sources de données, nous devons développer les cellules. Avant, nos cellules ressemblaient à ceci : [y,x]. y], devient une seule cellule. Maintenant, vous verrez une seule cellule comme celle-ci. Cellule : [Source de données externe, y, recherchez les données souhaitées.
Il s'agit d'une formule utilisant des cellules à trois éléments :
[Mois1,4] = [Taxe de sortie,Mois1,7]
Parmi eux, OutputTax est le nom d'une certaine source de données. Vous pouvez la nommer arbitrairement, plus elle est concise, mieux c'est, sinon les formules complexes seront écrites très longues et difficiles à lire.
La formule suivante prendra les valeurs de deux sources de données, OutputTax et TaxRate :
[Mois1,5] = [OutputTax, Month1,10] * (1 + [TaxRate, Month1,1] / 100)
Je pense qu'en lisant le contenu des chapitres précédents, vous pouvez déjà comprendre la signification des formules suivantes. Les trois premières lignes de formules utilisent des sources de données externes et sont combinées avec la méthode d'écriture des formules régionales.
Il est temps d'appeler notre méthode de calcul. Pour démontrer l'effet, j'ai ajouté un bouton et écrit la méthode dans l'événement bouton.
Voyez ce que nous avons fait :
① Obtenez les outputTaxDatas à partir d'une source de données externe
② Obtenez la source de données payableTaxDatas de la table actuelle
③ Obtenez une autre source de données externe taxRateDatas à partir de la base de données
④ Voici le point clé. Jetons un coup d'œil au constructeur d'AutoCalculate. Il y a deux paramètres :
formules : formule, un tableau
options : paramètre facultatif, un objet objet
Options a un attribut externalDatas, qui représente une source de données externe. Il s'agit d'un tableau, car il peut y avoir plusieurs données. Chaque élément du tableau est un objet et possède 3 attributs :
name : Le nom de la source de données externe. Le nom choisi ici correspond au nom de la source de données externe dans la formule.
refField : champ de référence
données : source de données
Après avoir instancié AutoCalculate, une nouvelle méthode calculate est appelée ici, qui a 2 paramètres :
gridDatas : les données de la table qui doivent être recalculées, qui sont un tableau
refField : champ de référence
AutoCalculate prend en charge tous les contrôles de table js et peut être appelé en arrière-plan à l'aide de cette méthode, car quel que soit le type de contrôle de table js, il peut extraire les données de la table (données pures). un tableau. Tant que cela passe simplement dans le tableau.
⑤ Après avoir appelé calculate, la valeur de payableTaxDatas est déjà la dernière valeur calculée. Il suffit maintenant de la lier à la table actuelle.
L'interface après avoir exécuté le programme :
Après avoir cliqué pour obtenir des données :
Utilisation du back-end
Pour appeler AutoCalculate en arrière-plan, nous devons utiliser le moteur V8. Un autre point important est que des formules sont également nécessaires pour appeler AutoCalculate en arrière-plan. Notre approche précédente consistait à placer toutes les formules dans le fichier Extjs Controller, comme indiqué ci-dessous :
Afin de faciliter les appels en arrière-plan, nous extrayons la formule dans un fichier séparé
L'appel en arrière-plan AutoCalculate est encapsulé dans le projet et est très simple à utiliser.
La méthode d'appel est comme indiqué dans la figure :
Ou analysez-le étape par étape :
① Enregistrez les données de la table actuelle
② Obtenez le répertoire du fichier js où se trouve la formule
③ Obtenez deux sources de données externes
④ Appelez la méthode d'arrière-plan encapsulée, en utilisant les données obtenues aux étapes ② et ③, où FormulaExpression est l'expression de formule, c'est-à-dire en utilisant cette expression pour trouver la formule dans le fichier js que vous avez fourni
⑤ Les newData renvoyées à l'étape précédente sont déjà les dernières données après le calcul. Enregistrez maintenant ces données dans la base de données.
Choses à noter
Il y a deux points à noter lors de l'écriture de formules :
Aucun espace n'est autorisé dans les cellules
/Façon correcte d'écrire : [Mois12,1] = [Mois11,1] * 10 //mauvaise écriture : [Mois12,1] = [Mois11, 1] * 10
Il ne doit y avoir aucun espace avant la décimale et la décimale.
//Ecriture correcte : [Mois12,1] #3 = [Mois11,1] * 10 //mauvaise écriture : [Mois12,1] # 3 = [Mois11,1] * 10
Ceci conclut cet article sur la façon de dire adieu au codage en dur et de permettre à vos tables frontales de calculer automatiquement. Pour plus d'informations sur les calculs automatiques des tables frontales, veuillez rechercher les articles précédents sur downcodes.com ou continuer à parcourir les articles connexes ci-dessous. j'espère que vous le ferez à l'avenir. Soutenez beaucoup downcodes.com !