Browse Source

🍎style(button): Optimize the colors of all buttons to reduce visual fatigue

t0ng7u 6 months ago
parent
commit
5f011502d1

+ 80 - 119
web/src/components/table/ChannelsTable.js

@@ -563,7 +563,7 @@ const ChannelsTable = () => {
             {
               node: 'item',
               name: t('复制'),
-              type: 'primary',
+              type: 'tertiary',
               onClick: () => {
                 Modal.confirm({
                   title: t('确定是否要复制此渠道?'),
@@ -581,15 +581,15 @@ const ChannelsTable = () => {
                 aria-label={t('测试单个渠道操作项目组')}
               >
                 <Button
-                  theme='light'
                   size="small"
+                  type='tertiary'
                   onClick={() => testChannel(record, '')}
                 >
                   {t('测试')}
                 </Button>
                 <Button
-                  theme='light'
                   size="small"
+                  type='tertiary'
                   icon={<IconTreeTriangleDown />}
                   onClick={() => {
                     setCurrentTestChannel(record);
@@ -605,8 +605,7 @@ const ChannelsTable = () => {
                   {
                     record.status === 1 ? (
                       <Button
-                        theme='light'
-                        type='warning'
+                        type='danger'
                         size="small"
                         onClick={() => manageChannel(record.id, 'disable', record)}
                       >
@@ -614,8 +613,6 @@ const ChannelsTable = () => {
                       </Button>
                     ) : (
                       <Button
-                        theme='light'
-                        type='secondary'
                         size="small"
                         onClick={() => manageChannel(record.id, 'enable', record)}
                       >
@@ -635,7 +632,6 @@ const ChannelsTable = () => {
                     ]}
                   >
                     <Button
-                      theme='light'
                       type='tertiary'
                       size="small"
                       icon={<IconTreeTriangleDown />}
@@ -645,8 +641,7 @@ const ChannelsTable = () => {
               ) : (
                 record.status === 1 ? (
                   <Button
-                    theme='light'
-                    type='warning'
+                    type='danger'
                     size="small"
                     onClick={() => manageChannel(record.id, 'disable', record)}
                   >
@@ -654,8 +649,6 @@ const ChannelsTable = () => {
                   </Button>
                 ) : (
                   <Button
-                    theme='light'
-                    type='secondary'
                     size="small"
                     onClick={() => manageChannel(record.id, 'enable', record)}
                   >
@@ -665,7 +658,6 @@ const ChannelsTable = () => {
               )}
 
               <Button
-                theme='light'
                 type='tertiary'
                 size="small"
                 onClick={() => {
@@ -683,7 +675,6 @@ const ChannelsTable = () => {
               >
                 <Button
                   icon={<IconMore />}
-                  theme='light'
                   type='tertiary'
                   size="small"
                 />
@@ -695,23 +686,20 @@ const ChannelsTable = () => {
           return (
             <Space wrap>
               <Button
-                theme='light'
-                type='secondary'
+                type='tertiary'
                 size="small"
                 onClick={() => manageTag(record.key, 'enable')}
               >
                 {t('启用全部')}
               </Button>
               <Button
-                theme='light'
-                type='warning'
+                type='tertiary'
                 size="small"
                 onClick={() => manageTag(record.key, 'disable')}
               >
                 {t('禁用全部')}
               </Button>
               <Button
-                theme='light'
                 type='tertiary'
                 size="small"
                 onClick={() => {
@@ -783,22 +771,13 @@ const ChannelsTable = () => {
         onCancel={() => setShowColumnSelector(false)}
         footer={
           <div className="flex justify-end">
-            <Button
-              theme="light"
-              onClick={() => initDefaultColumns()}
-            >
+            <Button onClick={() => initDefaultColumns()}>
               {t('重置')}
             </Button>
-            <Button
-              theme="light"
-              onClick={() => setShowColumnSelector(false)}
-            >
+            <Button onClick={() => setShowColumnSelector(false)}>
               {t('取消')}
             </Button>
-            <Button
-              type='primary'
-              onClick={() => setShowColumnSelector(false)}
-            >
+            <Button onClick={() => setShowColumnSelector(false)}>
               {t('确定')}
             </Button>
           </div>
@@ -1605,7 +1584,6 @@ const ChannelsTable = () => {
           <Button
             size='small'
             disabled={!enableBatchDelete}
-            theme='light'
             type='danger'
             className="w-full md:w-auto"
             onClick={() => {
@@ -1622,8 +1600,7 @@ const ChannelsTable = () => {
           <Button
             size='small'
             disabled={!enableBatchDelete}
-            theme='light'
-            type='primary'
+            type='tertiary'
             onClick={() => setShowBatchSetTag(true)}
             className="w-full md:w-auto"
           >
@@ -1638,8 +1615,7 @@ const ChannelsTable = () => {
                 <Dropdown.Item>
                   <Button
                     size='small'
-                    theme='light'
-                    type='warning'
+                    type='tertiary'
                     className="w-full"
                     onClick={() => {
                       Modal.confirm({
@@ -1657,58 +1633,54 @@ const ChannelsTable = () => {
                 <Dropdown.Item>
                   <Button
                     size='small'
-                    theme='light'
-                    type='secondary'
                     className="w-full"
                     onClick={() => {
                       Modal.confirm({
-                        title: t('确定?'),
-                        content: t('确定要更新所有已启用通道余额吗?'),
-                        onOk: () => updateAllChannelsBalance(),
+                        title: t('确定是否要修复数据库一致性?'),
+                        content: t('进行该操作时,可能导致渠道访问错误,请仅在数据库出现问题时使用'),
+                        onOk: () => fixChannelsAbilities(),
                         size: 'sm',
                         centered: true,
                       });
                     }}
                   >
-                    {t('更新所有已启用通道余额')}
+                    {t('修复数据库一致性')}
                   </Button>
                 </Dropdown.Item>
                 <Dropdown.Item>
                   <Button
                     size='small'
-                    theme='light'
-                    type='danger'
+                    type='secondary'
                     className="w-full"
                     onClick={() => {
                       Modal.confirm({
-                        title: t('确定是否要删除禁用通道?'),
-                        content: t('此修改将不可逆'),
-                        onOk: () => deleteAllDisabledChannels(),
+                        title: t('确定?'),
+                        content: t('确定要更新所有已启用通道余额吗?'),
+                        onOk: () => updateAllChannelsBalance(),
                         size: 'sm',
                         centered: true,
                       });
                     }}
                   >
-                    {t('删除禁用通道')}
+                    {t('更新所有已启用通道余额')}
                   </Button>
                 </Dropdown.Item>
                 <Dropdown.Item>
                   <Button
                     size='small'
-                    theme='light'
-                    type='tertiary'
+                    type='danger'
                     className="w-full"
                     onClick={() => {
                       Modal.confirm({
-                        title: t('确定是否要修复数据库一致性?'),
-                        content: t('进行该操作时,可能导致渠道访问错误,请仅在数据库出现问题时使用'),
-                        onOk: () => fixChannelsAbilities(),
+                        title: t('确定是否要删除禁用通道?'),
+                        content: t('此修改将不可逆'),
+                        onOk: () => deleteAllDisabledChannels(),
                         size: 'sm',
                         centered: true,
                       });
                     }}
                   >
-                    {t('修复数据库一致性')}
+                    {t('删除禁用通道')}
                   </Button>
                 </Dropdown.Item>
               </Dropdown.Menu>
@@ -1721,8 +1693,7 @@ const ChannelsTable = () => {
 
           <Button
             size='small'
-            theme='light'
-            type='secondary'
+            type='tertiary'
             className="w-full md:w-auto"
             onClick={() => setCompactMode(!compactMode)}
           >
@@ -1825,8 +1796,7 @@ const ChannelsTable = () => {
 
           <Button
             size='small'
-            theme='light'
-            type='primary'
+            type='tertiary'
             className="w-full md:w-auto"
             onClick={refresh}
           >
@@ -1835,7 +1805,6 @@ const ChannelsTable = () => {
 
           <Button
             size='small'
-            theme='light'
             type='tertiary'
             onClick={() => setShowColumnSelector(true)}
             className="w-full md:w-auto"
@@ -1898,7 +1867,7 @@ const ChannelsTable = () => {
             </div>
             <Button
               size='small'
-              type="primary"
+              type="tertiary"
               htmlType="submit"
               loading={loading || searching}
               className="w-full md:w-auto"
@@ -1907,7 +1876,7 @@ const ChannelsTable = () => {
             </Button>
             <Button
               size='small'
-              theme='light'
+              type='tertiary'
               onClick={() => {
                 if (formApi) {
                   formApi.reset();
@@ -2033,9 +2002,55 @@ const ChannelsTable = () => {
                   {t('共')} {currentTestChannel.models.split(',').length} {t('个模型')}
                 </Typography.Text>
               </div>
-
+            </div>
+          )
+        }
+        visible={showModelTestModal && currentTestChannel !== null}
+        onCancel={handleCloseModal}
+        footer={
+          <div className="flex justify-end">
+            {isBatchTesting ? (
+              <Button
+                type='danger'
+                onClick={handleCloseModal}
+              >
+                {t('停止测试')}
+              </Button>
+            ) : (
+              <Button
+                type='tertiary'
+                onClick={handleCloseModal}
+              >
+                {t('取消')}
+              </Button>
+            )}
+            <Button
+              onClick={batchTestModels}
+              loading={isBatchTesting}
+              disabled={isBatchTesting}
+            >
+              {isBatchTesting ? t('测试中...') : t('批量测试${count}个模型').replace(
+                '${count}',
+                currentTestChannel
+                  ? currentTestChannel.models
+                    .split(',')
+                    .filter((model) =>
+                      model.toLowerCase().includes(modelSearchKeyword.toLowerCase())
+                    ).length
+                  : 0
+              )}
+            </Button>
+          </div>
+        }
+        maskClosable={!isBatchTesting}
+        className="!rounded-lg"
+        size={isMobile() ? 'full-width' : 'large'}
+      >
+        <div className="model-test-scroll">
+          {currentTestChannel && (
+            <div>
               {/* 搜索与操作按钮 */}
-              <div className="flex items-center justify-end gap-2 w-full">
+              <div className="flex items-center justify-end gap-2 w-full mb-2">
                 <Input
                   placeholder={t('搜索模型...')}
                   value={modelSearchKeyword}
@@ -2049,7 +2064,6 @@ const ChannelsTable = () => {
                 />
 
                 <Button
-                  theme='light'
                   onClick={() => {
                     if (selectedModelKeys.length === 0) {
                       showError(t('请先选择模型!'));
@@ -2068,8 +2082,7 @@ const ChannelsTable = () => {
                 </Button>
 
                 <Button
-                  theme='light'
-                  type='primary'
+                  type='tertiary'
                   onClick={() => {
                     if (!currentTestChannel) return;
                     const successKeys = currentTestChannel.models
@@ -2088,57 +2101,6 @@ const ChannelsTable = () => {
                   {t('选择成功')}
                 </Button>
               </div>
-            </div>
-          )
-        }
-        visible={showModelTestModal && currentTestChannel !== null}
-        onCancel={handleCloseModal}
-        footer={
-          <div className="flex justify-end">
-            {isBatchTesting ? (
-              <Button
-                theme='light'
-                type='warning'
-                onClick={handleCloseModal}
-              >
-                {t('停止测试')}
-              </Button>
-            ) : (
-              <Button
-                theme='light'
-                type='tertiary'
-                onClick={handleCloseModal}
-              >
-                {t('取消')}
-              </Button>
-            )}
-            <Button
-              theme='light'
-              type='primary'
-              onClick={batchTestModels}
-              loading={isBatchTesting}
-              disabled={isBatchTesting}
-            >
-              {isBatchTesting ? t('测试中...') : t('批量测试${count}个模型').replace(
-                '${count}',
-                currentTestChannel
-                  ? currentTestChannel.models
-                    .split(',')
-                    .filter((model) =>
-                      model.toLowerCase().includes(modelSearchKeyword.toLowerCase())
-                    ).length
-                  : 0
-              )}
-            </Button>
-          </div>
-        }
-        maskClosable={!isBatchTesting}
-        className="!rounded-lg"
-        size={isMobile() ? 'full-width' : 'large'}
-      >
-        <div className="model-test-scroll">
-          {currentTestChannel && (
-            <div>
               <Table
                 columns={[
                   {
@@ -2197,8 +2159,7 @@ const ChannelsTable = () => {
                       const isTesting = testingModels.has(record.model);
                       return (
                         <Button
-                          theme='light'
-                          type='primary'
+                          type='tertiary'
                           onClick={() => testChannel(currentTestChannel, record.model)}
                           loading={isTesting}
                           size='small'

+ 9 - 20
web/src/components/table/LogsTable.js

@@ -697,22 +697,13 @@ const LogsTable = () => {
         onCancel={() => setShowColumnSelector(false)}
         footer={
           <div className='flex justify-end'>
-            <Button
-              theme='light'
-              onClick={() => initDefaultColumns()}
-            >
+            <Button onClick={() => initDefaultColumns()}>
               {t('重置')}
             </Button>
-            <Button
-              theme='light'
-              onClick={() => setShowColumnSelector(false)}
-            >
+            <Button onClick={() => setShowColumnSelector(false)}>
               {t('取消')}
             </Button>
-            <Button
-              type='primary'
-              onClick={() => setShowColumnSelector(false)}
-            >
+            <Button onClick={() => setShowColumnSelector(false)}>
               {t('确定')}
             </Button>
           </div>
@@ -1222,7 +1213,7 @@ const LogsTable = () => {
                     style={{
                       fontWeight: 500,
                       boxShadow: '0 2px 8px rgba(0, 0, 0, 0.1)',
-                      padding: 15,
+                      padding: 13,
                     }}
                     className='!rounded-lg'
                   >
@@ -1233,7 +1224,7 @@ const LogsTable = () => {
                     style={{
                       fontWeight: 500,
                       boxShadow: '0 2px 8px rgba(0, 0, 0, 0.1)',
-                      padding: 15,
+                      padding: 13,
                     }}
                     className='!rounded-lg'
                   >
@@ -1245,7 +1236,7 @@ const LogsTable = () => {
                       border: 'none',
                       boxShadow: '0 2px 8px rgba(0, 0, 0, 0.1)',
                       fontWeight: 500,
-                      padding: 15,
+                      padding: 13,
                     }}
                     className='!rounded-lg'
                   >
@@ -1254,8 +1245,7 @@ const LogsTable = () => {
                 </Space>
 
                 <Button
-                  theme='light'
-                  type='secondary'
+                  type='tertiary'
                   className="w-full md:w-auto"
                   onClick={() => setCompactMode(!compactMode)}
                   size="small"
@@ -1384,7 +1374,7 @@ const LogsTable = () => {
 
                   <div className='flex gap-2 w-full sm:w-auto justify-end'>
                     <Button
-                      type='primary'
+                      type='tertiary'
                       htmlType='submit'
                       loading={loading}
                       size="small"
@@ -1392,7 +1382,7 @@ const LogsTable = () => {
                       {t('查询')}
                     </Button>
                     <Button
-                      theme='light'
+                      type='tertiary'
                       onClick={() => {
                         if (formApi) {
                           formApi.reset();
@@ -1407,7 +1397,6 @@ const LogsTable = () => {
                       {t('重置')}
                     </Button>
                     <Button
-                      theme='light'
                       type='tertiary'
                       onClick={() => setShowColumnSelector(true)}
                       size="small"

+ 6 - 17
web/src/components/table/MjLogsTable.js

@@ -741,22 +741,13 @@ const LogsTable = () => {
         onCancel={() => setShowColumnSelector(false)}
         footer={
           <div className="flex justify-end">
-            <Button
-              theme="light"
-              onClick={() => initDefaultColumns()}
-            >
+            <Button onClick={() => initDefaultColumns()}>
               {t('重置')}
             </Button>
-            <Button
-              theme="light"
-              onClick={() => setShowColumnSelector(false)}
-            >
+            <Button onClick={() => setShowColumnSelector(false)}>
               {t('取消')}
             </Button>
-            <Button
-              type='primary'
-              onClick={() => setShowColumnSelector(false)}
-            >
+            <Button onClick={() => setShowColumnSelector(false)}>
               {t('确定')}
             </Button>
           </div>
@@ -831,8 +822,7 @@ const LogsTable = () => {
                   )}
                 </div>
                 <Button
-                  theme='light'
-                  type='secondary'
+                  type='tertiary'
                   className="w-full md:w-auto"
                   onClick={() => setCompactMode(!compactMode)}
                   size="small"
@@ -897,7 +887,7 @@ const LogsTable = () => {
                     <div></div>
                     <div className="flex gap-2">
                       <Button
-                        type='primary'
+                        type='tertiary'
                         htmlType='submit'
                         loading={loading}
                         size="small"
@@ -905,7 +895,7 @@ const LogsTable = () => {
                         {t('查询')}
                       </Button>
                       <Button
-                        theme='light'
+                        type='tertiary'
                         onClick={() => {
                           if (formApi) {
                             formApi.reset();
@@ -920,7 +910,6 @@ const LogsTable = () => {
                         {t('重置')}
                       </Button>
                       <Button
-                        theme='light'
                         type='tertiary'
                         onClick={() => setShowColumnSelector(true)}
                         size="small"

+ 5 - 11
web/src/components/table/RedemptionsTable.js

@@ -139,6 +139,7 @@ const RedemptionsTable = () => {
       title: '',
       dataIndex: 'operate',
       fixed: 'right',
+      width: 205,
       render: (text, record, index) => {
         // 创建更多操作的下拉菜单项
         const moreMenuItems = [
@@ -191,7 +192,6 @@ const RedemptionsTable = () => {
           <Space>
             <Popover content={record.key} style={{ padding: 20 }} position='top'>
               <Button
-                theme='light'
                 type='tertiary'
                 size="small"
               >
@@ -199,8 +199,6 @@ const RedemptionsTable = () => {
               </Button>
             </Popover>
             <Button
-              theme='light'
-              type='secondary'
               size="small"
               onClick={async () => {
                 await copyText(record.key);
@@ -209,7 +207,6 @@ const RedemptionsTable = () => {
               {t('复制')}
             </Button>
             <Button
-              theme='light'
               type='tertiary'
               size="small"
               onClick={() => {
@@ -226,7 +223,6 @@ const RedemptionsTable = () => {
               menu={moreMenuItems}
             >
               <Button
-                theme='light'
                 type='tertiary'
                 size="small"
                 icon={<IconMore />}
@@ -435,8 +431,7 @@ const RedemptionsTable = () => {
             <Text>{t('兑换码可以批量生成和分发,适合用于推广活动或批量充值。')}</Text>
           </div>
           <Button
-            theme='light'
-            type='secondary'
+            type='tertiary'
             className="w-full md:w-auto"
             onClick={() => setCompactMode(!compactMode)}
             size="small"
@@ -452,7 +447,6 @@ const RedemptionsTable = () => {
         <div className="flex flex-col sm:flex-row gap-2 w-full md:w-auto order-2 md:order-1">
           <div className="flex gap-2 w-full sm:w-auto">
             <Button
-              theme='light'
               type='primary'
               className="w-full sm:w-auto"
               onClick={() => {
@@ -466,7 +460,7 @@ const RedemptionsTable = () => {
               {t('添加兑换码')}
             </Button>
             <Button
-              type='warning'
+              type='tertiary'
               className="w-full sm:w-auto"
               onClick={async () => {
                 if (selectedKeys.length === 0) {
@@ -539,7 +533,7 @@ const RedemptionsTable = () => {
             </div>
             <div className="flex gap-2 w-full md:w-auto">
               <Button
-                type="primary"
+                type="tertiary"
                 htmlType="submit"
                 loading={loading || searching}
                 className="flex-1 md:flex-initial md:w-auto"
@@ -548,7 +542,7 @@ const RedemptionsTable = () => {
                 {t('查询')}
               </Button>
               <Button
-                theme="light"
+                type="tertiary"
                 onClick={() => {
                   if (formApi) {
                     formApi.reset();

+ 6 - 17
web/src/components/table/TaskLogsTable.js

@@ -595,22 +595,13 @@ const LogsTable = () => {
         onCancel={() => setShowColumnSelector(false)}
         footer={
           <div className="flex justify-end">
-            <Button
-              theme="light"
-              onClick={() => initDefaultColumns()}
-            >
+            <Button onClick={() => initDefaultColumns()}>
               {t('重置')}
             </Button>
-            <Button
-              theme="light"
-              onClick={() => setShowColumnSelector(false)}
-            >
+            <Button onClick={() => setShowColumnSelector(false)}>
               {t('取消')}
             </Button>
-            <Button
-              type='primary'
-              onClick={() => setShowColumnSelector(false)}
-            >
+            <Button onClick={() => setShowColumnSelector(false)}>
               {t('确定')}
             </Button>
           </div>
@@ -667,8 +658,7 @@ const LogsTable = () => {
                   <Text>{t('任务记录')}</Text>
                 </div>
                 <Button
-                  theme='light'
-                  type='secondary'
+                  type='tertiary'
                   className="w-full md:w-auto"
                   onClick={() => setCompactMode(!compactMode)}
                   size="small"
@@ -733,7 +723,7 @@ const LogsTable = () => {
                     <div></div>
                     <div className="flex gap-2">
                       <Button
-                        type='primary'
+                        type='tertiary'
                         htmlType='submit'
                         loading={loading}
                         size="small"
@@ -741,7 +731,7 @@ const LogsTable = () => {
                         {t('查询')}
                       </Button>
                       <Button
-                        theme='light'
+                        type='tertiary'
                         onClick={() => {
                           if (formApi) {
                             formApi.reset();
@@ -756,7 +746,6 @@ const LogsTable = () => {
                         {t('重置')}
                       </Button>
                       <Button
-                        theme='light'
                         type='tertiary'
                         onClick={() => setShowColumnSelector(true)}
                         size="small"

+ 8 - 21
web/src/components/table/TokensTable.js

@@ -372,9 +372,8 @@ const TokensTable = () => {
               aria-label={t('项目操作按钮组')}
             >
               <Button
-                theme='light'
                 size="small"
-                style={{ color: 'rgba(var(--semi-teal-7), 1)' }}
+                type='tertiary'
                 onClick={() => {
                   if (chatsArray.length === 0) {
                     showError(t('请联系管理员配置聊天链接'));
@@ -395,11 +394,7 @@ const TokensTable = () => {
                 menu={chatsArray}
               >
                 <Button
-                  style={{
-                    padding: '4px 4px',
-                    color: 'rgba(var(--semi-teal-7), 1)',
-                  }}
-                  type='primary'
+                  type='tertiary'
                   icon={<IconTreeTriangleDown />}
                   size="small"
                 ></Button>
@@ -407,7 +402,6 @@ const TokensTable = () => {
             </SplitButtonGroup>
 
             <Button
-              theme='light'
               type='tertiary'
               size="small"
               onClick={() => {
@@ -419,7 +413,6 @@ const TokensTable = () => {
             </Button>
 
             <Button
-              theme='light'
               type='danger'
               size="small"
               onClick={() => {
@@ -705,8 +698,7 @@ const TokensTable = () => {
             <Text>{t('令牌用于API访问认证,可以设置额度限制和模型权限。')}</Text>
           </div>
           <Button
-            theme="light"
-            type="secondary"
+            type="tertiary"
             className="w-full md:w-auto"
             onClick={() => setCompactMode(!compactMode)}
             size="small"
@@ -721,7 +713,6 @@ const TokensTable = () => {
       <div className="flex flex-col md:flex-row justify-between items-center gap-4 w-full">
         <div className="flex flex-wrap gap-2 w-full md:w-auto order-2 md:order-1">
           <Button
-            theme="light"
             type="primary"
             className="flex-1 md:flex-initial"
             onClick={() => {
@@ -735,8 +726,7 @@ const TokensTable = () => {
             {t('添加令牌')}
           </Button>
           <Button
-            theme="light"
-            type="warning"
+            type='tertiary'
             className="flex-1 md:flex-initial"
             onClick={() => {
               if (selectedKeys.length === 0) {
@@ -750,8 +740,7 @@ const TokensTable = () => {
                 footer: (
                   <Space>
                     <Button
-                      type="primary"
-                      theme="solid"
+                      type='tertiary'
                       onClick={async () => {
                         let content = '';
                         for (let i = 0; i < selectedKeys.length; i++) {
@@ -765,7 +754,6 @@ const TokensTable = () => {
                       {t('名称+密钥')}
                     </Button>
                     <Button
-                      theme="light"
                       onClick={async () => {
                         let content = '';
                         for (let i = 0; i < selectedKeys.length; i++) {
@@ -786,8 +774,7 @@ const TokensTable = () => {
             {t('复制所选令牌')}
           </Button>
           <Button
-            theme="light"
-            type="danger"
+            type='danger'
             className="w-full md:w-auto"
             onClick={() => {
               if (selectedKeys.length === 0) {
@@ -844,7 +831,7 @@ const TokensTable = () => {
             </div>
             <div className="flex gap-2 w-full md:w-auto">
               <Button
-                type="primary"
+                type="tertiary"
                 htmlType="submit"
                 loading={loading || searching}
                 className="flex-1 md:flex-initial md:w-auto"
@@ -853,7 +840,7 @@ const TokensTable = () => {
                 {t('查询')}
               </Button>
               <Button
-                theme="light"
+                type='tertiary'
                 onClick={() => {
                   if (formApi) {
                     formApi.reset();

+ 3 - 8
web/src/components/table/UsersTable.js

@@ -287,7 +287,6 @@ const UsersTable = () => {
         return (
           <Space>
             <Button
-              theme='light'
               type='tertiary'
               size="small"
               onClick={() => {
@@ -303,7 +302,6 @@ const UsersTable = () => {
               menu={moreMenuItems}
             >
               <Button
-                theme='light'
                 type='tertiary'
                 size="small"
                 icon={<IconMore />}
@@ -525,8 +523,7 @@ const UsersTable = () => {
             <Text>{t('用户管理页面,可以查看和管理所有注册用户的信息、权限和状态。')}</Text>
           </div>
           <Button
-            theme='light'
-            type='secondary'
+            type='tertiary'
             className="w-full md:w-auto"
             onClick={() => setCompactMode(!compactMode)}
             size="small"
@@ -541,8 +538,6 @@ const UsersTable = () => {
       <div className="flex flex-col md:flex-row justify-between items-center gap-4 w-full">
         <div className="flex gap-2 w-full md:w-auto order-2 md:order-1">
           <Button
-            theme='light'
-            type='primary'
             className="w-full md:w-auto"
             onClick={() => {
               setShowAddUser(true);
@@ -598,7 +593,7 @@ const UsersTable = () => {
             </div>
             <div className="flex gap-2 w-full md:w-auto">
               <Button
-                type="primary"
+                type="tertiary"
                 htmlType="submit"
                 loading={loading || searching}
                 className="flex-1 md:flex-initial md:w-auto"
@@ -607,7 +602,7 @@ const UsersTable = () => {
                 {t('查询')}
               </Button>
               <Button
-                theme="light"
+                type='tertiary'
                 onClick={() => {
                   if (formApi) {
                     formApi.reset();

+ 4 - 4
web/src/helpers/render.js

@@ -53,18 +53,18 @@ import {
 
 // 侧边栏图标颜色映射
 export const sidebarIconColors = {
-  dashboard: '#4F46E5', // 紫蓝
+  dashboard: '#10B981', // 绿
   terminal: '#10B981', // 绿色
   message: '#06B6D4', // 青色
   key: '#3B82F6', // 蓝色
-  chart: '#8B5CF6', // 紫
+  chart: '#F59E0B', // 琥珀
   image: '#EC4899', // 粉色
   check: '#F59E0B', // 琥珀色
   credit: '#F97316', // 橙色
   layers: '#EF4444', // 红色
   gift: '#F43F5E', // 玫红色
-  user: '#6366F1', // 靛蓝
-  settings: '#6B7280', // 灰
+  user: '#10B981', // 绿
+  settings: '#F97316', // 橙
 };
 
 // 获取侧边栏Lucide图标组件

+ 6 - 0
web/src/index.css

@@ -59,6 +59,11 @@ code {
 
 .semi-navigation-item {
   margin-bottom: 4px !important;
+  padding: 4px 12px !important;
+}
+
+.semi-navigation-sub-title {
+  padding: 0 !important;
 }
 
 .semi-navigation-item-icon {
@@ -70,6 +75,7 @@ code {
   margin-right: 0;
 }
 
+.semi-navigation-item,
 .semi-navigation-sub-title {
   height: 100% !important;
 }