قل وداعًا لمثال التعليمات البرمجية المضمن الذي يتيح حساب جداول الواجهة الأمامية تلقائيًا

مقدمة

عندما كان فريقي يقوم بتطوير وحدة النظام الضريبي، وجدت أنهم بحاجة إلى قضاء 80% من وقتهم في حل المشكلات الحسابية، وخاصة الحسابات في الشبكة، وقد تم قضاء هذا الوقت في:

لذلك قمت بالتحقق من وظائف الوحدات الضريبية الأخرى ووجدت أن النظام الضريبي يستخدم عددًا كبيرًا من ضوابط الجدول، والتي تنطوي بشكل أو بآخر على مشاكل حسابية. طرق الحساب كلها مشفرة.

الحساب، وهو إجراء الترميز الشائع هذا، يذكرنا كثيرًا بالصيغ الموجودة في Excel، ناهيك عن أن مستند المتطلبات نفسه يتم تقديمه في شكل Excel. عندما نستخدم Excel، يمكننا تعيين الصيغ في الخلايا عن طريق تغيير قيمة الخلية المصدر، سيقوم Excel تلقائيًا بحساب صيغة الخلية وتعيين القيمة الناتجة للخلية المستهدفة. إذن، هل يمكننا الرجوع إلى هذا النموذج؟ لم يعد المطورون بحاجة إلى كتابة منطق حسابي معقد وصعب، بل يحتاجون فقط إلى تحويله إلى عبارات بتنسيق معين وفقًا للصيغ التي يوفرها التنفيذ، ثم استدعاء محرك حساب معين. إخراج النتائج أو تقديم النتائج للمستخدم أو الاحتفاظ بها في قاعدة البيانات؟ الجواب هو نعم، وجوهر كل ذلك هو محرك الحساب التلقائي-AutoCalculate.

تأثير

يعد AutoCalculate حلاً لحسابات الجدول المعقدة، مما يسمح لك بحفظ مئات أو آلاف الأسطر من التعليمات البرمجية المنطقية للحساب، من الآن فصاعدًا، أصبحت كتابة التعليمات البرمجية سهلة مثل كتابة صيغ Excel.

نطاق التطبيق

مكتب الاستقبال:

مناسب للعمليات المعقدة باستخدام الصيغ في جميع عناصر تحكم جدول js مثل جداول ElementUI، وعناصر تحكم EasyUI Grid، وParamQuery Grid، وما إلى ذلك.

خلف الكواليس:

قابل للتطبيق، ويتطلب محرك V8

استخدام مكتب الاستقبال

يتكون الحساب التلقائي من جزأين، وهما الصيغة ومحرك الحساب. الصيغة عبارة عن سلسلة مكتوبة وفقًا لبناء جملة محدد، مثل: [Month12,1]#3 = [Month11,1] * 10. محرك الحساب هو AutoCalculate. .js المسؤول عن تحليل الصيغ. لنبدأ بكيفية كتابة الصيغ.

خلية

لنفترض أن هناك مثل هذا السيناريو، الخلية ① = الخلية ② + الخلية ③، الصيغة المقابلة هي:

[الشهر1,1] = [الشهر1,2] + [الشهر1,3] 

دعونا أولاً نلقي نظرة على ما يمثله [Month1,1] . أولاً، تمثل الأقواس المربعة [ ] خلية، وMonth1 هو اسم العمود المقابل لـ "يناير"، متبوعًا بفاصلة , ويمثل الرقم 1 التالي RowNo = 1. وهكذا،

يمثل [Month1,2] الخلية التي يكون عمودها "يناير" ورقم الصف = 2

يمثل [Month1,3] الخلية التي يكون عمودها "يناير" ورقم الصف = 3

لذلك يمكننا استخدام [y,x] لتمثيل خلية، وy هو اسم العمود، ويسمى أيضًا الإحداثي، وx هي قيمة RowNo، وتسمى أيضًا الإحداثي الإحداثي

ماذا لو كان الجدول لا يحتوي على عمود RowNo؟ إذا كنت تريد العثور على الإجابة، يرجى مواصلة القراءة

دع الصيغة تصبح سارية المفعول

// قدم أولاً AutoCalculate.js
استيراد AutoCalculate من '../components/AutoCalculate'؛
...

// تحديد مثيل AutoCalculate، الصيغ هي مصفوفة الصيغة Let autoCal = new AutoCalculate(formulas);

/* استدعاء طريقة cal * GridDatas (مطلوب): بيانات الجدول * refField (مطلوب): حقل مرجعي، أي قيمة الحقل هي x في الخلية [y,x] */
autoCal.cal(gridDatas, refField);

صيغة المنطقة

في الحقيقة، بالإضافة إلى يناير، فبراير، مارس... هناك أيضًا صيغة مشابهة لشهر أكتوبر، وهي:

[الشهر1,1] = [الشهر1,2] + [الشهر1,3]

[الشهر2،1] = [الشهر2،2] + [الشهر2،3]

[الشهر3،1] = [الشهر3،2] + [الشهر3،3]

…
…
…

[الشهر10,1] = [الشهر10,2] + [الشهر10,3]

بمعنى آخر، نحتاج إلى كتابة 10 صيغ من هذا القبيل، بالنسبة للسيناريوهات البسيطة، فهذه ليست مشكلة، ومع ذلك، بالنسبة لبعض الجداول التي تحتوي على عدد كبير من الصيغ، فإن طريقة الكتابة هذه لها بعض العيوب، مثل سهولة ارتكاب الأخطاء. كما أن الصيغة طويلة وتستغرق وقتًا أطول للانتهاء من كتابتها. لذلك، هناك صيغة المنطقة.

وبملاحظة الصيغ المذكورة أعلاه، نجد أن كل صيغة يمكن استبدالها فعليا بصيغة، مثل الصيغة التالية:

[@,1] = [@,2] + [@,3]

لا يوجد اسم عمود واضح هنا، فقط يتم استخدام العنصر النائب @، ولكنه يكفي لتمثيل الصيغ العشرة المذكورة أعلاه. في هذا الوقت، نحتاج فقط إلى ملء أسماء الأعمدة في المواضع المناسبة، وبالتالي فإن الصيغة النهائية هي:

{الشهر1، الشهر2، الشهر3، الشهر4، الشهر5، الشهر6، الشهر7، الشهر8، الشهر9، الشهر10}[@,1] = [@,2] + [@,3]

تحتاج إلى فصل أسماء الأعمدة بـ , ووضعها بين قوسين متعرجين { } ، بحيث تكون الصيغة الواحدة تعادل 10 صيغ.

يمكن استخدام العناصر النائبة ليس فقط للإحداثي، ولكن أيضًا للإحداثي الإحداثي، كما هو موضح في الصيغة التالية:

// الصيغة 1:
[إجمالي السنة،3] = [الشهر1،3] + [الشهر2،3] + [الشهر3،3] + [الشهر4،3] + [الشهر5،3] + [الشهر6،3] + [الشهر7،3] + [الشهر8 ,3] + [شهر 9,3] + [شهر 10,3]

// الصيغة 2:
[إجمالي السنة،4] = [الشهر1،4] + [الشهر2،4] + [الشهر3،4] + [الشهر4،4] + [الشهر5،4] + [الشهر6،4] + [الشهر7،4] + [الشهر8 ,4] + [الشهر9,4] + [الشهر10,4]

// الصيغة 3:
[إجمالي السنة،5] = [الشهر1،5] + [الشهر2،5] + [الشهر3،5] + [الشهر4،5] + [الشهر5،5] + [الشهر6،5] + [الشهر7،5] + [الشهر8 ,5] + [الشهر9,5] + [الشهر10,5]

// الصيغة 4:
[إجمالي السنة،6] = [الشهر1،6] + [الشهر2،6] + [الشهر3،6] + [الشهر4،6] + [الشهر5،6] + [الشهر6،6] + [الشهر7،6] + [الشهر8 ,6] + [الشهر9,6] + [الشهر10,6]

// الصيغة 5:
[إجمالي السنة،2] = [الشهر1،2] + [الشهر2،2] + [الشهر3،2] + [الشهر4،2] + [الشهر5،2] + [الشهر6،2] + [الشهر7،2] + [الشهر8 ,2] + [شهر 9,2] + [شهر 10,2]

// الصيغة 6:
[إجمالي السنة،7] = [الشهر1،7] + [الشهر2،7] + [الشهر3،7] + [الشهر4،7] + [الشهر5،7] + [الشهر6،7] + [الشهر7،7] + [الشهر8 ,7] + [الشهر9,7] + [الشهر10,7]

// الصيغة 7:
[إجمالي السنة،9] = [الشهر1،9] + [الشهر2،9] + [الشهر3،9] + [الشهر4،9] + [الشهر5،9] + [الشهر6،9] + [الشهر7،9] + [الشهر8 ,9] + [الشهر9,9] + [الشهر10,9]

// الصيغة 8:
[إجمالي السنة،12] = [الشهر1،12] + [الشهر2،12] + [الشهر3،12] + [الشهر4،12] + [الشهر5،12] + [الشهر6،12] + [الشهر7،12] + [الشهر8 ,12] + [شهر 9,12] + [شهر 10,12]

// الصيغة 9:
[إجمالي السنة،13] = [الشهر1،13] + [الشهر2،13] + [الشهر3،13] + [الشهر4،13] + [الشهر5،13] + [الشهر6،13] + [الشهر7،13] + [الشهر8 ,13] + [شهر 9,13] + [شهر 10,13]

باستخدام صيغة المنطقة، يمكن كتابة هذا على النحو التالي:

{2، 3، 4، 5، 6، 7، 9، 12، 13}[إجمالي العام،@] = [Month1,@] + [Month2,@] + [Month3,@] + [Month4,@] + [ الشهر5,@] + [الشهر6,@] + [الشهر7,@] + [الشهر8,@] + [الشهر9,@] + [الشهر10@]

يمكن ملاحظة أن صيغة المساحة توفر راحة كبيرة في كتابة الصيغ.

دعم بناء جملة شبيبة

في السيناريوهات الفعلية، غالبًا ما نواجه بعض الصيغ المعقدة، كما هو موضح أدناه. تستخدم صيغة الخلية الدالة Max التي تأتي مع Excel. بالنسبة لهذه الصيغة، يمكننا كتابتها على النحو التالي:

[Month1,9] = ([Month1,6] - [Month1,7] - [Month1,8] > 0 ? [Month1,6] - [Month1,7] - [Month1,8] : 0) + [Month1 ,5] 

كما ترى، تدعم الصيغة بناء جملة js. يمكنك وضع متغير js أو حتى دالة js على الجانب الأيمن من علامة المساواة للصيغة، طالما أنها صيغة يتعرف عليها محرك تحليل js، فهي مدعومة .

شيء واحد يجب ملاحظته هنا هو أنه لا يمكنك وضع عناصر المصفوفة في الصيغ، لأن عناصر المصفوفة js عادةً ما تحتوي على رموز "[ ]"، والتي تتعارض مع مؤشر الخلية "[ ]" في الصيغ، لذا فإن عناصر المصفوفة محظورة، يرجى العلم بذلك هذا.

[ص] الصيغة

بعد ذلك، دعونا نلقي نظرة على سيناريو آخر، كما هو موضح في الشكل، حيث توجد مثل هذه العلاقة:

الخلية ① = الخلية ② - الخلية ③

يمكنك كتابة الصيغة التالية بسرعة:

[العمود3،1] = [العمود2،1] - [العمود1،1]
[العمود3،2] = [العمود2،2] - [العمود1،2] 

لا حرج في الكتابة بهذه الطريقة، ولكن يجب أن أذكرك أن الصفوف هنا ليست ثابتة، وهذا يعني أن عدد الصفوف في الجدول يعتمد كليًا على حالة قاعدة البيانات في ذلك الوقت هناك 3 صفوف فقط من البيانات اليوم، و5 صفوف غدًا، وبعد غد سيكون هناك 50 سطرًا. من المستحيل بالنسبة لنا إضافة صيغ مع زيادة عدد الصفوف، لذلك بالنسبة لهذا النوع من الجداول التي تحتوي على عدد غير محدد من الصفوف، لدينا طريقة جديدة في الكتابة أسميها الصيغة [y]، لأنها مقارنة بالصيغ العادية ، ليس له إحداثيات أفقية:

[العمود3] = [العمود2] - [العمود1]

باستخدام صف واحد فقط من الصيغ، ستقوم AutoCalculate بتطبيق الصيغة على كافة الصفوف الموجودة ضمن اسم العمود المحدد.

إجمالي الأعمدة والمنازل العشرية

في بعض الأحيان، نحتاج إلى إيجاد مجموع عمود معين على الرغم من أن العثور على مجموع عمود معين قد لا يكون هدفنا النهائي، إلا أنه خطوة ضرورية بالنسبة لنا لإكمال العملية الحسابية، على سبيل المثال، توجد العلاقة التالية:

الخلية ③ = الخلية ① / الخلية ②

الخلية ② هي القيمة الإجمالية لعمود GroupApprovedTotal ، الذي نستخدم <列名> لتمثيله، وهو: <GroupApprovedTotal> . بالإضافة إلى ذلك، الصفوف هنا ليست ثابتة ويجب استخدام الصيغة [y]، لذا يجب كتابة الصيغة على النحو التالي:

[GroupApprovedTotalPercent] = [GroupApprovedTotal] / <GroupApprovedTotal>

نحن نعلم أن المقسوم عليه في القسمة لا يمكن أن يكون 0، لذا فإن الطريقة الصحيحة لكتابته هي:

[GroupApprovedTotalPercent] = <GroupApprovedTotal> === 0 ? : [GroupApprovedTotal] / <GroupApprovedTotal>

عندما تضع هذه الصيغة في التعليمات البرمجية الخاصة بك وتبدأ البرنامج، يجب أن تكون ذكيًا وتكتشف بسرعة أن القيمة التي تحصل عليها ليست دقيقة بدرجة كافية. على سبيل المثال، القيمة المعروضة في الخلية ③ أعلاه هي 66.91% إذا كانت الخلية ① والخلية ② لها نفس قيمة الصورة أعلاه. من المحتمل أن تبلغ قيمة الخلية ③ 67%. لماذا هذا؟

افتراضيًا، ستحتفظ عملية الحساب التلقائي بنتيجة الحساب بمنزلتين عشريتين، 67%، وهي 0.67. إذا كنت تريد الحصول على 66.91%، وهي 0.6691، فأنت بحاجة إلى الاحتفاظ بأربع منازل عشرية. في هذا الوقت، يجب عليك إخبار AutoCalculate أنك بحاجة إلى الاحتفاظ بأربعة منازل عشرية، لذلك يجب أن تكون الكتابة الكاملة:

[GroupApprovedTotalPercent]#4 = <GroupApprovedTotal> === 0 ? : [GroupApprovedTotal] / <GroupApprovedTotal>

على يسار علامة المساواة في الصيغة وعلى يمين الخلية المخصصة، أضف علامة "#"، متبوعة بعدد المنازل العشرية. لاحظ أنه لا يمكن أن يكون هناك مسافة بين "#" ورقم المنازل العشرية، ويمكن أن يكون هناك مسافات قبل وبعد.

الجدول بدون صف

لقد حان الوقت أخيرًا للإجابة على هذا السؤال، أريد أن أسأل الجميع، كيف يمكننا العثور على نقطة على متن الطائرة؟ الجواب هو أننا بحاجة إلى الإحداثي والإحداثي لهذه النقطة، وبالمثل، كيفية العثور على خلية في الجدول؟ أولاً يمكننا تحديد الإحداثي لأن جميع أسماء الأعمدة معروفة، والمفتاح يكمن في تحديد الإحداثي. إذا كنت تستخدم RowNo لتحديد الموضع، فستشعر بالتأكيد أنك مألوف، لأنه يشبه إلى حد كبير الرقم التسلسلي الموجود على الجانب الأيسر من Excel، لكن هذا لا يعني أنه يمكن استخدام الأرقام فقط كعلامة الإحداثي الإحداثي. طالما أن القيمة فريدة، أي غير متكررة، فيمكن استخدامها كعلامة الإحداثي الإحداثي.

على سبيل المثال، بافتراض أن الجدول التالي يحتوي على صفين ثابتين ولا يحتوي على RowNo، ولكن يمكن ملاحظة أن رقم الشركة (BuCode) فريد، فيمكن استخدام BuCode كحقل مرجعي، وقيمة BuCode هي الإحداثي الإحداثي، ثم يمكن كتابة الصيغة على النحو التالي:

[SumDiffMonth1,F1136] = [GroupApprovalMonth1,F1136] - [Month1,F1136]
[SumDiffMonth1,F2056] = [GroupApprovalMonth1,F2056] - [Month1,F2056]

إذا كان هناك RowNo، فاستخدم RowNo كحقل مرجعي واكتب كما يلي:

[SumDiffMonth1,2] = [GroupApprovalMonth1,2] - [Month1,2]
[SumDiffMonth1,3] = [GroupApprovalMonth1,3] - [Month1,3]

حساب عبر مصادر البيانات

ما هي الحوسبة عبر مصدر البيانات؟ يجب أن يكون الأصدقاء الذين استخدموا صيغ Excel قادرين على فهم ما تمثله الصيغة الموجودة في الخلية أدناه. من الواضح أن قيمة هذه الخلية هي القيمة المحسوبة لبيانات الورقة الأخرى. وقد تم تصميم حساب مصدر البيانات المتقاطعة خصيصًا للتعامل مع مثل هذه السيناريوهات.

نادرًا ما نقوم، أو حتى لا نقوم أبدًا، بإجراء حسابات مصدر بيانات مشتركة في المقدمة. وهنا أريد أن أخبرك بكيفية كتابة الصيغ واستدعاء AutoCalculate حتى تتمكن من استخدامها فعليًا في فصل "الاستخدام الخلفي".

أولاً، من أجل الحصول على البيانات من خلايا مصدر البيانات الأخرى، نحتاج إلى توسيع الخلايا في السابق، وكانت خلايانا تبدو هكذا: [y,x]. y]، تصبح خلية واحدة الآن، سترى خلية واحدة مثل هذا الخلية: [مصدر البيانات الخارجي، y، ابحث عن البيانات التي تريدها.

هذه صيغة تستخدم خلايا مكونة من ثلاثة عناصر:

[Month1,4] = [ضريبة الإخراج،Month1,7]

من بينها، OutputTax هو اسم مصدر بيانات معين، يمكنك تسميته بشكل تعسفي كلما كان ذلك أفضل، وإلا سيتم كتابة الصيغ المعقدة لفترة طويلة جدًا ويصعب قراءتها.

ستأخذ الصيغة التالية القيم من مصدرين للبيانات، OutputTax وTaxRate:

[Month1,5] = [ضريبة المخرجات،Month1,10] * (1 + [معدل الضريبة،Month1,1] / 100)

أعتقد أنه من خلال قراءة محتوى الفصول السابقة، يمكنك بالفعل فهم معنى الصيغ التالية. تستخدم الصفوف الثلاثة الأولى من الصيغ مصادر بيانات خارجية ويتم دمجها مع طريقة كتابة الصيغ الإقليمية.

حان الوقت لاستدعاء طريقة الحساب الخاصة بنا لتوضيح التأثير، أضفت زرًا وكتبت الطريقة في حدث الزر.

انظر ماذا فعلنا:

① احصل على OutputTaxDatas من مصدر بيانات خارجي

② احصل على مصدر البيانات payableTaxDatas للجدول الحالي

③ احصل على TaxRateDatas لمصدر بيانات خارجي آخر من قاعدة البيانات

④ هذه هي النقطة الأساسية دعونا نلقي نظرة على مُنشئ AutoCalculate. هناك معلمتان:

الصيغ: صيغة، صفيف

الخيارات: معلمة اختيارية، كائن كائن

تحتوي الخيارات على سمة ExternalDatas، والتي تمثل مصدر بيانات خارجي وهي عبارة عن مصفوفة، لأنه قد يكون هناك بيانات متعددة، كل عنصر من عناصر المصفوفة هو كائن وله ثلاث سمات:

الاسم: اسم مصدر البيانات الخارجي، الاسم الذي تم اختياره هنا يتوافق مع اسم مصدر البيانات الخارجي في الصيغة.

refField: الحقل المرجعي

البيانات: مصدر البيانات

بعد إنشاء حساب تلقائي، يتم استدعاء طريقة حساب جديدة هنا، والتي تحتوي على معلمتين:

GridDatas: بيانات الجدول التي يجب إعادة حسابها، وهي عبارة عن مصفوفة

refField: الحقل المرجعي

يدعم AutoCalculate جميع عناصر تحكم جدول js ويمكن استدعاؤه في الخلفية بمساعدة هذه الطريقة، لأنه بغض النظر عن نوع عنصر التحكم في جدول js، يمكنه استخراج بيانات الجدول (البيانات النقية عادة ما تكون في شكل صفيف. طالما أن هذا مجرد تمرير في الصفيف.

⑤ بعد استدعاء الحساب، تكون قيمة payableTaxDatas هي بالفعل أحدث قيمة محسوبة، والآن فقط قم بربطها بالجدول الحالي.

الواجهة بعد تشغيل البرنامج:

بعد النقر للحصول على البيانات:

استخدام الواجهة الخلفية

لاستدعاء AutoCalculate في الخلفية، نحتاج إلى استخدام محرك V8. وهناك نقطة أخرى مهمة وهي أن الصيغ مطلوبة أيضًا لاستدعاء AutoCalculate في الخلفية. كان أسلوبنا السابق هو وضع جميع الصيغ في ملف Extjs Controller، كما هو موضح أدناه:

لتسهيل إجراء المكالمات في الخلفية، نقوم باستخراج الصيغة كملف منفصل

يتم تضمين استدعاء الخلفية AutoCalculate في المشروع وهو سهل الاستخدام للغاية.

طريقة الاستدعاء كما هو موضح في الشكل:

أو قم بتحليلها خطوة بخطوة:

① احفظ بيانات الجدول الحالي

② احصل على دليل ملف js حيث توجد الصيغة

③ احصل على مصدرين للبيانات الخارجية

④ استدعاء طريقة الخلفية المغلفة، باستخدام البيانات التي تم الحصول عليها في الخطوتين ② و③، حيث FormulaExpression هو تعبير الصيغة، أي استخدام هذا التعبير للعثور على الصيغة في ملف js الذي قدمته

⑤ البيانات الجديدة التي تم إرجاعها في الخطوة السابقة هي بالفعل أحدث البيانات بعد الحساب. الآن قم بحفظ هذه البيانات في قاعدة البيانات.

أشياء يجب ملاحظتها

هناك نقطتان يجب ملاحظتهما عند كتابة الصيغ:

لا يسمح بوجود مسافات في الخلايا

/الطريقة الصحيحة للكتابة:
[الشهر12,1] = [الشهر11,1] * 10

//كتابة خاطئة:
[الشهر12،1] = [الشهر11، 1] * 10

يجب ألا تكون هناك مسافات قبل العلامة العشرية والعلامة العشرية.

// الكتابة الصحيحة:
[الشهر12,1] #3 = [الشهر11,1] * 10

//كتابة خاطئة:
[الشهر12,1] # 3 = [الشهر11,1] * 10

بهذا نختتم هذه المقالة بقول وداعًا للبرمجة الصعبة والسماح بحساب جداول الواجهة الأمامية تلقائيًا. لمزيد من المعلومات حول حسابات جداول الواجهة الأمامية التلقائية، يرجى البحث في المقالات السابقة على موقع downcodes.com أو متابعة تصفح المقالات ذات الصلة أدناه أتمنى أن تفعل ذلك في المستقبل.