This commit is contained in:
2025-09-12 11:09:42 +08:00
parent f8a687a6ab
commit c4ea5eb18f
628 changed files with 717 additions and 534 deletions
@@ -87,16 +87,26 @@
<article data-uid="">
<h1 id="numeric-inputoutput-utilities">Numeric Input/Output Utilities</h1>
<p>The <code>numeric-utils.js</code> module provides essential utilities for handling numeric input/output in web forms, especially for floating-point values with special cases.</p>
<h2 id="purpose">Purpose</h2>
<p>The utilities solve the common problem of handling special numeric values (Infinity, -Infinity, NaN) in JSON serialization and user interfaces. JavaScript's JSON.stringify converts these special values to null or strings, which can cause issues when communicating with C# backend APIs. This module provides consistent conversion between numeric values and display strings, ensuring proper handling across the full stack. It also formats regular numbers with appropriate precision for display while avoiding unnecessary trailing zeros.</p>
<h2 id="key-features">Key Features</h2>
<p>Handle special numeric values (Infinity, -Infinity, NaN) in web forms to prevent JSON serialization issues between JavaScript frontend and C# backend.</p>
<h2 id="implementation-requirements">Implementation Requirements</h2>
<p>Your <code>numeric-utils.js</code> module should:</p>
<ul>
<li>Converts Infinity to &ldquo;INF&rdquo;, -Infinity to &ldquo;-INF&rdquo;, and NaN to &ldquo;NaN&rdquo; for display</li>
<li>Parses these special strings back to their numeric equivalents</li>
<li>Formats regular numbers with appropriate precision (4 significant digits)</li>
<li>Provides a Vue mixin for easy integration in components</li>
<li>Handles both numeric and string inputs from JSON responses</li>
<li>Convert special values for display: Infinity &ldquo;INF&rdquo;, -Infinity &ldquo;-INF&rdquo;, NaN &ldquo;NaN&rdquo;</li>
<li>Parse display strings back to numeric values</li>
<li>Format regular numbers with 4 significant digits</li>
<li>Provide Vue mixin for component integration</li>
</ul>
<h2 id="required-exports">Required Exports</h2>
<ul>
<li><code>numericToDisplay(value)</code> - Converts numeric to display string</li>
<li><code>displayToNumeric(displayValue, defaultValue)</code> - Parses display to numeric</li>
<li><code>NumericInputMixin</code> - Vue mixin with formatNumericDisplay and parseNumericDisplay methods</li>
</ul>
<h2 id="source-code-path">Source Code Path</h2>
<p>See <a href="../index.html">this page</a> for git repository.</p>
<h3 id="web-page-application-source-code-path">Web Page Application Source Code Path</h3>
<ul>
<li>wwwroot/common/numeric-utils.js</li>
</ul>
</article>