优化渠道余额显示

Calcium-Ion · Dec 11, 2023 · 3b63d9b · 3b63d9b
1 parent b99b24f
commit 3b63d9b
Show file tree

Hide file tree

Showing 2 changed files with 31 additions and 3 deletions.
diff --git a/web/src/components/ChannelsTable.js b/web/src/components/ChannelsTable.js
@@ -13,7 +13,7 @@ import {
 } from '../helpers';
 
 import {CHANNEL_OPTIONS, ITEMS_PER_PAGE} from '../constants';
-import {renderGroup, renderNumber, renderQuota, renderQuotaWithPrompt} from '../helpers/render';
+import {renderGroup, renderNumber, renderNumberWithPoint, renderQuota, renderQuotaWithPrompt} from '../helpers/render';
 import {
     Avatar,
     Tag,
@@ -142,8 +142,8 @@ const ChannelsTable = () => {
                             <Tooltip content={'已用额度'}>
                                 <Tag color='white' type='ghost' size='large'>{renderQuota(record.used_quota)}</Tag>
                             </Tooltip>
-                            <Tooltip content={'剩余额度，点击更新'}>
-                                <Tag color='white' type='ghost' size='large' onClick={() => {updateChannelBalance(record)}}>${record.balance.toFixed(2)}</Tag>
+                            <Tooltip content={'剩余额度' + record.balance + '，点击更新'}>
+                                <Tag color='white' type='ghost' size='large' onClick={() => {updateChannelBalance(record)}}>${renderNumberWithPoint(record.balance)}</Tag>
                             </Tooltip>
                         </Space>
                     </div>

diff --git a/web/src/helpers/render.js b/web/src/helpers/render.js
@@ -42,6 +42,34 @@ export function renderNumber(num) {
   }
 }
 
+export function renderNumberWithPoint(num) {
+  num = num.toFixed(2);
+  if (num >= 100000) {
+    // Convert number to string to manipulate it
+    let numStr = num.toString();
+    // Find the position of the decimal point
+    let decimalPointIndex = numStr.indexOf('.');
+
+    let wholePart = numStr;
+    let decimalPart = '';
+
+    // If there is a decimal point, split the number into whole and decimal parts
+    if (decimalPointIndex !== -1) {
+      wholePart = numStr.slice(0, decimalPointIndex);
+      decimalPart = numStr.slice(decimalPointIndex);
+    }
+
+    // Take the first two and last two digits of the whole number part
+    let shortenedWholePart = wholePart.slice(0, 2) + '..' + wholePart.slice(-2);
+
+    // Return the formatted number
+    return shortenedWholePart + decimalPart;
+  }
+
+  // If the number is less than 100,000, return it unmodified
+  return num;
+}
+
 export function getQuotaPerUnit() {
   let quotaPerUnit = localStorage.getItem('quota_per_unit');
   quotaPerUnit = parseFloat(quotaPerUnit);