From 3049ad47e58c054d1bcbfbf554efdd5f92f023fb Mon Sep 17 00:00:00 2001
From: t0ng7u <dev@aiass.cc>
Date: Sat, 5 Jul 2025 00:03:12 +0800
Subject: [PATCH] =?UTF-8?q?=F0=9F=94=A2=20feat(user-edit):=20replace=20add?=
 =?UTF-8?q?-quota=20input=20with=20Semi-UI=20InputNumber?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Summary:
• Imported InputNumber from @douyinfe/semi-ui.
• Swapped plain Input for InputNumber in “Add Quota” modal.
• Added UX tweaks: full-width styling, showClear, step = 500 000.
• Initialized addQuotaLocal to an empty string so the field starts blank.
• Adjusted state handling and kept quota calculation logic unchanged.

This improves numeric input accuracy and overall user experience without breaking existing functionality.
---
 web/src/components/table/UsersTable.js |  2 +-
 web/src/i18n/locales/en.json           |  2 +-
 web/src/pages/User/EditUser.js         | 11 ++++++-----
 3 files changed, 8 insertions(+), 7 deletions(-)

diff --git a/web/src/components/table/UsersTable.js b/web/src/components/table/UsersTable.js
index 31a8b2c0..02a19b80 100644
--- a/web/src/components/table/UsersTable.js
+++ b/web/src/components/table/UsersTable.js
@@ -119,7 +119,7 @@ const UsersTable = () => {
             <Tooltip content={remark} position="top" showArrow>
               <Tag color='white' size='large' shape='circle' className="!text-xs">
                 <div className="flex items-center gap-1">
-                  <div className="w-2 h-2 flex-shrink-0" style={{ backgroundColor: '#10b981' }} />
+                  <div className="w-2 h-2 flex-shrink-0 rounded-full" style={{ backgroundColor: '#10b981' }} />
                   {displayRemark}
                 </div>
               </Tag>
diff --git a/web/src/i18n/locales/en.json b/web/src/i18n/locales/en.json
index de5d9bce..0d49d3ba 100644
--- a/web/src/i18n/locales/en.json
+++ b/web/src/i18n/locales/en.json
@@ -1199,7 +1199,7 @@
   "添加用户": "Add user",
   "角色": "Role",
   "已绑定的 Telegram 账户": "Bound Telegram account",
-  "新额度": "New quota",
+  "新额度：": "New quota: ",
   "需要添加的额度（支持负数）": "Need to add quota (supports negative numbers)",
   "此项只读，需要用户通过个人设置页面的相关绑定按钮进行绑定，不可直接修改": "Read-only, user's personal settings, and cannot be modified directly",
   "请输入新的密码，最短 8 位": "Please enter a new password, at least 8 characterss",
diff --git a/web/src/pages/User/EditUser.js b/web/src/pages/User/EditUser.js
index deaefb6a..4a8f46e9 100644
--- a/web/src/pages/User/EditUser.js
+++ b/web/src/pages/User/EditUser.js
@@ -22,6 +22,7 @@ import {
   Row,
   Col,
   Input,
+  InputNumber,
 } from '@douyinfe/semi-ui';
 import {
   IconUser,
@@ -39,7 +40,7 @@ const EditUser = (props) => {
   const userId = props.editingUser.id;
   const [loading, setLoading] = useState(true);
   const [addQuotaModalOpen, setIsModalOpen] = useState(false);
-  const [addQuotaLocal, setAddQuotaLocal] = useState('0');
+  const [addQuotaLocal, setAddQuotaLocal] = useState('');
   const [groupOptions, setGroupOptions] = useState([]);
   const formApiRef = useRef(null);
 
@@ -254,7 +255,6 @@ const EditUser = (props) => {
                           field='quota'
                           label={t('剩余额度')}
                           placeholder={t('请输入新的剩余额度')}
-                          min={0}
                           step={500000}
                           extraText={renderQuotaWithPrompt(values.quota || 0)}
                           rules={[{ required: true, message: t('请输入额度') }]}
@@ -328,18 +328,19 @@ const EditUser = (props) => {
               const current = formApiRef.current?.getValue('quota') || 0;
               return (
                 <Text type='secondary' className='block mb-2'>
-                  {`${t('新额度')}${renderQuota(current)} + ${renderQuota(addQuotaLocal)} = ${renderQuota(current + parseInt(addQuotaLocal || 0))}`}
+                  {`${t('新额度：')}${renderQuota(current)} + ${renderQuota(addQuotaLocal)} = ${renderQuota(current + parseInt(addQuotaLocal || 0))}`}
                 </Text>
               );
             })()
           }
         </div>
-        <Input
+        <InputNumber
           placeholder={t('需要添加的额度（支持负数）')}
-          type='number'
           value={addQuotaLocal}
           onChange={setAddQuotaLocal}
+          style={{ width: '100%' }}
           showClear
+          step={500000}
         />
       </Modal>
     </>