Vorwort
Als mein Team das Steuersystemmodul entwickelte, stellte ich fest, dass es 80 % seiner Zeit damit verbringen musste, Berechnungsprobleme zu lösen, insbesondere die Berechnungen im Raster. Diese Zeit wurde für Folgendes aufgewendet:
Schreiben Sie Front-End-JS-Code (da sich die Eingaben des Benutzers in der Tabelle auf andere Zellen auswirken, sodass der neue Wert nach der Berechnung dem Benutzer sofort angezeigt werden muss). Schreiben Sie Back-End-Code (da sich die Änderungen des Benutzers an den Tabellendaten auswirken andere Tabellen, daher ist es notwendig, die Daten der betroffenen Tabelle zu aktualisieren, wenn der Benutzer auf Speichern klickt.) Implementieren Sie geänderte Berechnungsmethoden, was dazu führt, dass Entwickler den Code ändern müssenDeshalb habe ich die Funktionen anderer Steuermodule untersucht und festgestellt, dass das Steuersystem eine Vielzahl von Tabellensteuerelementen verwendet, die mehr oder weniger mit Rechenproblemen verbunden sind. Die Berechnungsmethoden sind alle fest codiert.
Die Berechnung, diese übliche Codierungsaktion, erinnert tatsächlich stark an die Formeln in Excel, ganz zu schweigen davon, dass das Anforderungsdokument selbst in Form von Excel bereitgestellt wird. Wenn wir Excel verwenden, können wir Formeln in Zellen festlegen. Durch Ändern des Werts der Quellzelle berechnet Excel automatisch die Zellformel und weist den Ergebniswert der Zielzelle zu. Können wir uns also auf dieses Modell beziehen? Entwickler müssen keine komplizierte und schwierige Berechnungslogik mehr schreiben. Sie müssen sie nur gemäß den von der Implementierung bereitgestellten Formeln in Anweisungen umwandeln und dann eine bestimmte Berechnungs-Engine aufrufen Die Ergebnisse ausgeben, dem Benutzer präsentieren oder sie in der Datenbank speichern? Die Antwort lautet „Ja“, und das Herzstück des Ganzen ist die automatische Berechnungs-Engine AutoCalculate.
Wirkung
AutoCalculate ist eine Lösung für komplexe Tabellenberechnungen, mit der Sie Hunderte oder Tausende Zeilen Berechnungslogikcode speichern können. Von nun an ist das Schreiben von Code so einfach wie das Schreiben von Excel-Formeln.
Anwendungsbereich
Rezeption:
Geeignet für komplexe Operationen mit Formeln in allen js-Tabellensteuerelementen wie ElementUI-Tabellen, EasyUI Grid-Steuerelementen, ParamQuery Grid usw.
Backstage:
Anwendbar, erfordert V8-Motor
Nutzung der Rezeption
AutoCalculate besteht aus zwei Teilen, nämlich der Formel und der Berechnungs-Engine. Die Formel ist eine Zeichenfolge, die gemäß einer bestimmten Syntax geschrieben wird, wie zum Beispiel: [Monat12,1]#3 = [Monat11,1] * 10. Die Berechnungs-Engine ist AutoCalculate .js. Verantwortlich für das Parsen von Formeln. Beginnen wir mit dem Schreiben von Formeln.
Zelle
Angenommen, es gibt ein solches Szenario, Zelle ① = Zelle ② + Zelle ③, die entsprechende Formel lautet:
[Monat1,1] = [Monat1,2] + [Monat1,3]
Schauen wir uns zunächst an, was [Month1,1] darstellt. Zuerst stellen die eckigen Klammern [ ] eine Zelle dar, Monat1 ist der Spaltenname, der „Januar“ entspricht, gefolgt von einem Komma , und die folgende 1 steht für RowNo = 1 . Und so weiter,
[Month1,2] stellt die Zelle dar, deren Spalte „Januar“ und RowNo = 2 ist
[Month1,3] stellt die Zelle dar, deren Spalte „Januar“ und RowNo = 3 ist
Wir können also [y,x] verwenden, um eine Zelle darzustellen. y ist der Spaltenname, auch Ordinate genannt, x ist der Wert von RowNo, auch Abszisse genannt
Was ist, wenn die Tabelle keine RowNo-Spalte enthält? Wenn Sie die Antwort finden möchten, lesen Sie bitte weiter
Lassen Sie die Formel wirken
//Führen Sie zuerst AutoCalculate.js ein AutoCalculate aus '../components/AutoCalculate' importieren; ... //Definiere eine AutoCalculate-Instanz, Formulas ist das Formel-Array let autoCal = new AutoCalculate(formulas); /* Cal-Methode aufrufen * GridDatas (erforderlich): Tabellendaten * RefField (erforderlich): Referenzfeld, d. h. welcher Feldwert ist x in Zelle [y,x] */ autoCal.cal(gridDatas, refField);
Flächenformel
Tatsächlich gibt es neben Januar, Februar, März... auch eine ähnliche Formel für Oktober, nämlich:
[Monat1,1] = [Monat1,2] + [Monat1,3] [Monat2,1] = [Monat2,2] + [Monat2,3] [Monat3,1] = [Monat3,2] + [Monat3,3] … … … [Monat10,1] = [Monat10,2] + [Monat10,3]
Mit anderen Worten, wir müssen 10 solcher Formeln schreiben. Für einfache Szenarien ist dies kein Problem. Bei einigen Tabellen mit einer großen Anzahl von Formeln hat diese Schreibmethode jedoch einige Nachteile, z. B. dass es leicht zu Fehlern kommt. und die Formel ist lang. Außerdem dauert es länger, sie fertig zu schreiben. Daher gibt es die Flächenformel.
Wenn wir die obigen Formeln beobachten, können wir feststellen, dass jede Formel tatsächlich durch eine Formel ersetzt werden kann, beispielsweise durch die folgende Formel:
[@,1] = [@,2] + [@,3]
Hier gibt es keinen eindeutigen Spaltennamen, es wird lediglich ein Platzhalter @ verwendet, der jedoch ausreicht, um die oben genannten 10 Formeln darzustellen. Zu diesem Zeitpunkt müssen wir nur die Spaltennamen an den entsprechenden Positionen eingeben, sodass die endgültige Formel lautet:
{Monat1, Monat2, Monat3, Monat4, Monat5, Monat6, Monat7, Monat8, Monat9, Monat10}[@,1] = [@,2] + [@,3] Sie müssen die Spaltennamen durch trennen , sie in geschweifte Klammern { } setzen, sodass 1 Formel 10 Formeln entspricht.
Platzhalter können nicht nur für die Ordinate, sondern auch für die Abszisse verwendet werden, wie in der folgenden Formel dargestellt:
//Formel 1: [YearTotal,3] = [Monat1,3] + [Monat2,3] + [Monat3,3] + [Monat4,3] + [Monat5,3] + [Monat6,3] + [Monat7,3] + [Monat8 ,3] + [Monat9,3] + [Monat10,3] //Formel 2: [YearTotal,4] = [Monat1,4] + [Monat2,4] + [Monat3,4] + [Monat4,4] + [Monat5,4] + [Monat6,4] + [Monat7,4] + [Monat8 ,4] + [Monat9,4] + [Monat10,4] //Formel 3: [YearTotal,5] = [Monat1,5] + [Monat2,5] + [Monat3,5] + [Monat4,5] + [Monat5,5] + [Monat6,5] + [Monat7,5] + [Monat8 ,5] + [Monat9,5] + [Monat10,5] //Formel 4: [YearTotal,6] = [Monat1,6] + [Monat2,6] + [Monat3,6] + [Monat4,6] + [Monat5,6] + [Monat6,6] + [Monat7,6] + [Monat8 ,6] + [Monat9,6] + [Monat10,6] //Formel 5: [YearTotal,2] = [Monat1,2] + [Monat2,2] + [Monat3,2] + [Monat4,2] + [Monat5,2] + [Monat6,2] + [Monat7,2] + [Monat8 ,2] + [Monat9,2] + [Monat10,2] //Formel 6: [YearTotal,7] = [Monat1,7] + [Monat2,7] + [Monat3,7] + [Monat4,7] + [Monat5,7] + [Monat6,7] + [Monat7,7] + [Monat8 ,7] + [Monat9,7] + [Monat10,7] //Formel 7: [YearTotal,9] = [Monat1,9] + [Monat2,9] + [Monat3,9] + [Monat4,9] + [Monat5,9] + [Monat6,9] + [Monat7,9] + [Monat8 ,9] + [Monat9,9] + [Monat10,9] //Formel 8: [YearTotal,12] = [Monat1,12] + [Monat2,12] + [Monat3,12] + [Monat4,12] + [Monat5,12] + [Monat6,12] + [Monat7,12] + [Monat8 ,12] + [Monat9,12] + [Monat10,12] //Formel 9: [YearTotal,13] = [Monat1,13] + [Monat2,13] + [Monat3,13] + [Monat4,13] + [Monat5,13] + [Monat6,13] + [Monat7,13] + [Monat8 ,13] + [Monat9,13] + [Monat10,13]
Mit der Flächenformel kann dies wie folgt geschrieben werden:
{2, 3, 4, 5, 6, 7, 9, 12, 13}[YearTotal,@] = [Monat1,@] + [Monat2,@] + [Monat3,@] + [Monat4,@] + [ Monat5,@] + [Monat6,@] + [Monat7,@] + [Monat8,@] + [Monat9,@] + [Monat10,@]Es ist ersichtlich, dass die Flächenformel das Schreiben von Formeln sehr erleichtert.
Unterstützt die JS-Syntax
In tatsächlichen Szenarien stoßen wir häufig auf komplexe Formeln, wie unten gezeigt. Die Zellformel verwendet die in Excel enthaltene Max-Funktion. Eine solche Formel können wir folgendermaßen schreiben:
[Monat1,9] = ([Monat1,6] - [Monat1,7] - [Monat1,8] > 0 ? [Monat1,6] - [Monat1,7] - [Monat1,8] : 0) + [Monat1 ,5]
Wie Sie sehen, unterstützt die Formel die js-Syntax. Sie können eine js-Variable oder sogar eine js-Funktion auf der rechten Seite des Gleichheitszeichens der Formel einfügen. Solange es sich um eine von der js-Parsing-Engine erkannte Syntax handelt, wird sie unterstützt .
Hier ist zu beachten, dass Sie keine Array-Elemente in Formeln einfügen können, da js-Array-Elemente normalerweise „[]“-Symbole haben, was mit dem Zellindikator „[]“ in Formeln in Konflikt steht. Daher sind Array-Elemente verboten. Bitte beachten Sie dies Das.
[y]Formel
Schauen wir uns als Nächstes ein anderes Szenario an, wie in der Abbildung dargestellt, in dem eine solche Beziehung besteht:
Zelle ① = Zelle ② - Zelle ③
Sie könnten schnell die folgende Formel schreiben:
[Spalte3,1] = [Spalte2,1] - [Spalte1,1] [Spalte3,2] = [Spalte2,2] - [Spalte1,2]
Es ist nichts Falsches daran, so zu schreiben, aber ich muss Sie daran erinnern, dass die Zeilen hier nicht festgelegt sind. Das heißt, die Anzahl der Zeilen in der Tabelle hängt vollständig von der aktuellen Datenbanksituation ab Heute gibt es nur 3 Zeilen Daten, morgen 5 Zeilen und übermorgen werden es 50 Zeilen sein. Es ist für uns unmöglich, Formeln hinzuzufügen, wenn die Anzahl der Zeilen zunimmt. Daher haben wir für diese Art von Tabelle mit einer unbestimmten Anzahl von Zeilen eine neue Schreibweise, die ich im Vergleich zu gewöhnlichen Formeln die [y]-Formel nenne , es hat keine horizontale Koordinate:
[Spalte3] = [Spalte2] - [Spalte1]
Bei nur einer Zeile mit Formeln wendet AutoCalculate die Formel auf alle Zeilen unter dem angegebenen Spaltennamen an.
Gesamtspalten und Dezimalstellen
Manchmal müssen wir die Summe einer bestimmten Spalte ermitteln, obwohl es möglicherweise nicht unser ultimatives Ziel ist, die Berechnung abzuschließen. Es besteht beispielsweise die folgende Beziehung:
Zelle ③ = Zelle ① / Zelle ②
Zelle ② ist der Gesamtwert GroupApprovedTotal , den wir mit <列名> darstellen, also: <GroupApprovedTotal> . Darüber hinaus sind die Zeilen hier nicht festgelegt und es muss die [y]-Formel verwendet werden, daher sollte die Formel wie folgt geschrieben werden:
[GroupApprovedTotalPercent] = [GroupApprovedTotal] / <GroupApprovedTotal>
Wir wissen, dass der Divisor bei der Division nicht 0 sein kann, daher sollte die korrekte Schreibweise wie folgt lauten:
[GroupApprovedTotalPercent] = <GroupApprovedTotal> === 0 ? 0 : [GroupApprovedTotal] / <GroupApprovedTotal>
Wenn Sie diese Formel in Ihren Code einfügen und das Programm starten, sollten Sie schnell feststellen, dass der in Zelle ③ angezeigte Wert nicht genau genug ist. Wenn Ihre Zelle ① und Zelle ② hat den gleichen Wert wie das Bild oben. Ihre Zelle ③ beträgt wahrscheinlich 67 %.
Standardmäßig behält AutoCalculate das Berechnungsergebnis bei 2 Dezimalstellen, also 67 %, was 0,67 entspricht. Wenn Sie 66,91 % erhalten möchten, was 0,6691 entspricht, müssen Sie 4 Dezimalstellen beibehalten. Zu diesem Zeitpunkt müssen Sie AutoCalculate mitteilen dass Sie 4 Dezimalstellen einhalten müssen. Daher sollte die vollständige Schreibweise wie folgt lauten:
[GroupApprovedTotalPercent]#4 = <GroupApprovedTotal> === 0 ? 0 : [GroupApprovedTotal] / <GroupApprovedTotal>
Fügen Sie links vom Gleichheitszeichen in der Formel und rechts von der zugewiesenen Zelle ein „#“-Zeichen ein, gefolgt von der Anzahl der Dezimalstellen. Beachten Sie, dass zwischen dem „#“ und der Anzahl der Dezimalstellen kein Leerzeichen stehen darf Dezimalstellen, es können Leerzeichen davor und danach stehen.
Tabelle ohne RowNo
Es ist endlich an der Zeit, diese Frage zu beantworten. Ich möchte alle fragen: Wie finden wir einen Punkt in einem Flugzeug? Die Antwort ist, dass wir die Abszisse und die Ordinate dieses Punktes benötigen. Wie findet man außerdem eine Zelle in einer Tabelle? Zuerst können wir die Ordinate bestimmen, da alle Spaltennamen bekannt sind. Der Schlüssel liegt in der Bestimmung der Abszisse. Wenn Sie RowNo zur Positionierung verwenden, werden Sie sich auf jeden Fall vertraut fühlen, da es der Seriennummer auf der linken Seite von Excel sehr ähnlich ist. Dies bedeutet jedoch nicht, dass nur Zahlen als Abszisse verwendet werden können. Solange der Wert eindeutig ist, also nicht wiederholt wird, kann er als Abszisse verwendet werden.
Angenommen, die folgende Tabelle enthält zwei feste Zeilen und keine RowNo, es ist jedoch ersichtlich, dass die Firmennummer (BuCode) eindeutig ist. Dann kann BuCode als Referenzfeld verwendet werden und der Wert von BuCode ist die Abszisse. dann kann die Formel wie folgt geschrieben werden:
[SumDiffMonth1,F1136] = [GroupApprovalMonth1,F1136] – [Month1,F1136] [SumDiffMonth1,F2056] = [GroupApprovalMonth1,F2056] – [Month1,F2056]
Wenn RowNo vorhanden ist, verwenden Sie RowNo als Referenzfeld und schreiben Sie wie folgt:
[SumDiffMonth1,2] = [GroupApprovalMonth1,2] – [Month1,2] [SumDiffMonth1,3] = [GroupApprovalMonth1,3] – [Month1,3]
Datenquellenübergreifend berechnen
Was ist Cross-Data-Source-Computing? Freunde, die Excel-Formeln verwendet haben, sollten verstehen, was die Formel in der Zelle unten darstellt. Offensichtlich ist der Wert dieser Zelle der berechnete Wert anderer Blattdaten. Die datenquellenübergreifende Berechnung ist speziell für die Bewältigung solcher Szenarien konzipiert.
Datenquellenübergreifende Berechnungen führen wir selten oder gar nie im Vordergrund durch. Hier möchte ich Ihnen im Kapitel „Backend-Nutzung“ erklären, wie man Formeln schreibt und AutoCalculate aufruft.
Um Daten aus anderen Datenquellenzellen zu erhalten, müssen wir die Zellen zunächst so erweitern: [y,x]. y] wird zu einer einzelnen Zelle. Jetzt sehen Sie eine einzelne Zelle wie diese Zelle: [Externe Datenquelle, y, Suchen Sie die gewünschten Daten.
Dies ist eine Formel, die Zellen mit drei Elementen verwendet:
[Monat1,4] = [Ausgabesteuer,Monat1,7]
Darunter ist OutputTax der Name einer bestimmten Datenquelle. Je prägnanter, desto besser, sonst werden komplexe Formeln sehr lang und schwer lesbar.
Die folgende Formel übernimmt Werte aus zwei Datenquellen, OutputTax und TaxRate:
[Month1,5] = [OutputTax,Month1,10] * (1 + [TaxRate,Month1,1] / 100)
Ich glaube, dass Sie durch die Lektüre des Inhalts der vorherigen Kapitel bereits die Bedeutung der folgenden Formeln verstehen können. Die ersten drei Formelreihen verwenden externe Datenquellen und werden mit der Schreibmethode regionaler Formeln kombiniert.
Es ist Zeit, unsere Berechnungsmethode aufzurufen. Um den Effekt zu demonstrieren, habe ich eine Schaltfläche hinzugefügt und die Methode in das Schaltflächenereignis geschrieben.
Sehen Sie, was wir getan haben:
① OutputTaxDatas von einer externen Datenquelle abrufen
② Rufen Sie die Datenquelle payableTaxDatas der aktuellen Tabelle ab
③ Rufen Sie eine weitere externe Datenquelle taxRateDatas aus der Datenbank ab
④ Hier ist der entscheidende Punkt. Schauen wir uns den Konstruktor von AutoCalculate an.
Formeln: Formel, ein Array
Optionen: optionaler Parameter, ein Objektobjekt
Optionen verfügen über ein Attribut externalDatas, das eine externe Datenquelle darstellt. Es handelt sich um ein Array, da mehrere Daten vorhanden sein können und jedes Array-Element ein Objekt mit drei Attributen ist:
Name: Der Name der externen Datenquelle entspricht dem Namen der externen Datenquelle in der Formel.
refField: Referenzfeld
Daten: Datenquelle
Nach der Instanziierung von AutoCalculate wird hier eine neue Methode berechne aufgerufen, die über 2 Parameter verfügt:
GridDatas: Tabellendaten, die neu berechnet werden müssen, sind ein Array
refField: Referenzfeld
AutoCalculate unterstützt alle JS-Tabellensteuerelemente und kann mit Hilfe dieser Methode im Hintergrund aufgerufen werden, da es unabhängig von der Art des JS-Tabellensteuerelements Tabellendaten (reine Daten) extrahieren kann. Die Daten liegen normalerweise in der Form vor ein Array. Solange dies der Fall ist, übergeben Sie einfach das Array.
⑤ Nach dem Aufruf von „berechnen“ ist der Wert von payableTaxDatas bereits der zuletzt berechnete Wert. Binden Sie ihn nun einfach an die aktuelle Tabelle.
Die Schnittstelle nach dem Ausführen des Programms:
Nach dem Klicken, um Daten abzurufen:
Backend-Nutzung
Um AutoCalculate im Hintergrund aufzurufen, müssen wir die V8-Engine verwenden. Ein weiterer wichtiger Punkt ist, dass Formeln auch zum Aufrufen von AutoCalculate im Hintergrund benötigt werden. Unser bisheriger Ansatz bestand darin, alle Formeln in die Extjs-Controller-Datei einzufügen, wie unten gezeigt.
Um Hintergrundaufrufe zu erleichtern, extrahieren wir die Formel als separate Datei
Der Hintergrundaufruf AutoCalculate ist im Projekt gekapselt und sehr einfach zu verwenden.
Die aufrufende Methode ist wie in der Abbildung dargestellt:
Oder analysieren Sie es Schritt für Schritt:
① Speichern Sie die Daten der aktuellen Tabelle
② Rufen Sie das Verzeichnis der js-Datei ab, in dem sich die Formel befindet
③ Besorgen Sie sich zwei externe Datenquellen
④ Rufen Sie die gekapselte Hintergrundmethode auf und verwenden Sie dabei die in den Schritten ② und ③ erhaltenen Daten, wobei FormulaExpression der Formelausdruck ist. Das heißt, Sie verwenden diesen Ausdruck, um die Formel in der von Ihnen bereitgestellten js-Datei zu finden
⑤ Die im vorherigen Schritt zurückgegebenen neuen Daten sind nach der Berechnung bereits die neuesten Daten. Speichern Sie diese Daten nun in der Datenbank.
Dinge zu beachten
Beim Schreiben von Formeln sind zwei Punkte zu beachten:
In Zellen sind keine Leerzeichen erlaubt
/Richtige Schreibweise: [Monat12,1] = [Monat11,1] * 10 //falsche Schreibweise: [Monat12,1] = [Monat11, 1] * 10
Vor dem Dezimalzeichen und der Dezimalstelle dürfen keine Leerzeichen stehen.
//Richtiges Schreiben: [Monat12,1] #3 = [Monat11,1] * 10 //falsche Schreibweise: [Monat12,1] # 3 = [Monat11,1] * 10
Damit ist dieser Artikel über den Abschied von der harten Codierung und die automatische Berechnung Ihrer Front-End-Tabellen abgeschlossen. Weitere Informationen zu automatischen Front-End-Tabellenberechnungen finden Sie in früheren Artikeln auf downcodes.com oder durchsuchen Sie die folgenden verwandten Artikel Ich hoffe, Sie werden dies in Zukunft tun.