feat: able to display quota in dollar

web/src/components/OperationSetting.js

@@ -13,9 +13,11 @@ const OperationSetting = () => {
     GroupRatio: '',
     TopUpLink: '',
     ChatLink: '',
+    QuotaPerUnit: 0,
     AutomaticDisableChannelEnabled: '',
     ChannelDisableThreshold: 0,
-    LogConsumeEnabled: ''
+    LogConsumeEnabled: '',
+    DisplayInCurrencyEnabled: ''
   });
   const [originInputs, setOriginInputs] = useState({});
   let [loading, setLoading] = useState(false);
@@ -118,6 +120,9 @@ const OperationSetting = () => {
         if (originInputs['ChatLink'] !== inputs.ChatLink) {
           await updateOption('ChatLink', inputs.ChatLink);
         }
+        if (originInputs['QuotaPerUnit'] !== inputs.QuotaPerUnit) {
+          await updateOption('QuotaPerUnit', inputs.QuotaPerUnit);
+        }
         break;
     }
   };
@@ -129,7 +134,7 @@ const OperationSetting = () => {
           <Header as='h3'>
             通用设置
           </Header>
-          <Form.Group widths={2}>
+          <Form.Group widths={3}>
             <Form.Input
               label='充值链接'
               name='TopUpLink'
@@ -148,6 +153,30 @@ const OperationSetting = () => {
               type='link'
               placeholder='例如 ChatGPT Next Web 的部署地址'
             />
+            <Form.Input
+              label='额度汇率'
+              name='QuotaPerUnit'
+              onChange={handleInputChange}
+              autoComplete='new-password'
+              value={inputs.QuotaPerUnit}
+              type='number'
+              step='0.01'
+              placeholder='一单位货币能兑换的额度'
+            />
+          </Form.Group>
+          <Form.Group inline>
+            <Form.Checkbox
+              checked={inputs.LogConsumeEnabled === 'true'}
+              label='启用额度消费日志记录'
+              name='LogConsumeEnabled'
+              onChange={handleInputChange}
+            />
+            <Form.Checkbox
+              checked={inputs.DisplayInCurrencyEnabled === 'true'}
+              label='以货币形式显示额度'
+              name='DisplayInCurrencyEnabled'
+              onChange={handleInputChange}
+            />
           </Form.Group>
           <Form.Button onClick={() => {
             submitConfig('general').then();
@@ -264,12 +293,6 @@ const OperationSetting = () => {
               placeholder='为一个 JSON 文本，键为分组名称，值为倍率'
             />
           </Form.Group>
-          <Form.Checkbox
-            checked={inputs.LogConsumeEnabled === 'true'}
-            label='启用额度消费日志记录'
-            name='LogConsumeEnabled'
-            onChange={handleInputChange}
-          />
           <Form.Button onClick={() => {
             submitConfig('ratio').then();
           }}>保存倍率设置</Form.Button>

web/src/components/RedemptionsTable.js

@@ -4,6 +4,7 @@ import { Link } from 'react-router-dom';
 import { API, copy, showError, showInfo, showSuccess, showWarning, timestamp2string } from '../helpers';
 
 import { ITEMS_PER_PAGE } from '../constants';
+import { renderQuota } from '../helpers/render';
 
 function renderTimestamp(timestamp) {
   return (
@@ -220,7 +221,7 @@ const RedemptionsTable = () => {
                   <Table.Cell>{redemption.id}</Table.Cell>
                   <Table.Cell>{redemption.name ? redemption.name : '无'}</Table.Cell>
                   <Table.Cell>{renderStatus(redemption.status)}</Table.Cell>
-                  <Table.Cell>{redemption.quota}</Table.Cell>
+                  <Table.Cell>{renderQuota(redemption.quota)}</Table.Cell>
                   <Table.Cell>{renderTimestamp(redemption.created_time)}</Table.Cell>
                   <Table.Cell>{redemption.redeemed_time ? renderTimestamp(redemption.redeemed_time) : "尚未兑换"} </Table.Cell>
                   <Table.Cell>

web/src/components/TokensTable.js

@@ -4,6 +4,7 @@ import { Link } from 'react-router-dom';
 import { API, copy, showError, showSuccess, showWarning, timestamp2string } from '../helpers';
 
 import { ITEMS_PER_PAGE } from '../constants';
+import { renderQuota } from '../helpers/render';
 
 function renderTimestamp(timestamp) {
   return (
@@ -220,7 +221,7 @@ const TokensTable = () => {
                 <Table.Row key={token.id}>
                   <Table.Cell>{token.name ? token.name : '无'}</Table.Cell>
                   <Table.Cell>{renderStatus(token.status)}</Table.Cell>
-                  <Table.Cell>{token.unlimited_quota ? '无限制' : token.remain_quota}</Table.Cell>
+                  <Table.Cell>{token.unlimited_quota ? '无限制' : renderQuota(token.remain_quota, 2)}</Table.Cell>
                   <Table.Cell>{renderTimestamp(token.created_time)}</Table.Cell>
                   <Table.Cell>{token.expired_time === -1 ? '永不过期' : renderTimestamp(token.expired_time)}</Table.Cell>
                   <Table.Cell>

web/src/components/UsersTable.js

@@ -4,7 +4,7 @@ import { Link } from 'react-router-dom';
 import { API, showError, showSuccess } from '../helpers';
 
 import { ITEMS_PER_PAGE } from '../constants';
-import { renderGroup, renderNumber, renderText } from '../helpers/render';
+import { renderGroup, renderNumber, renderQuota, renderText } from '../helpers/render';
 
 function renderRole(role) {
   switch (role) {
@@ -244,8 +244,8 @@ const UsersTable = () => {
                     {user.email ? <Popup hoverable content={user.email} trigger={<span>{renderText(user.email, 24)}</span>} /> : '无'}
                   </Table.Cell>
                   <Table.Cell>
-                    <Popup content='剩余额度' trigger={<Label>{renderNumber(user.quota)}</Label>} />
-                    <Popup content='已用额度' trigger={<Label>{renderNumber(user.used_quota)}</Label>} />
+                    <Popup content='剩余额度' trigger={<Label>{renderQuota(user.quota)}</Label>} />
+                    <Popup content='已用额度' trigger={<Label>{renderQuota(user.used_quota)}</Label>} />
                     <Popup content='请求次数' trigger={<Label>{renderNumber(user.request_count)}</Label>} />
                   </Table.Cell>
                   <Table.Cell>{renderRole(user.role)}</Table.Cell>