🎨 style: unify card header UI, switch to Avatar icons & remove oversized props

Summary
• Replaced gradient header blocks with compact, neutral headers wrapped in `Avatar` across the following pages:
  - Channel / EditChannel.js
  - Channel / EditTagModal.js
  - Redemption / EditRedemption.js
  - Token / EditToken.js
  - User / EditUser.js
  - User / AddUser.js

Details
1. Added `Avatar` import and substituted raw icon elements, assigning semantic colors (`blue`, `green`, `purple`, `orange`, etc.) and consistent 16 px icons for a cleaner look.
2. Removed gradient backgrounds, decorative “blur-ball” shapes, and extra paddings from header containers to achieve a tight, flat design.
3. Stripped all `size="large"` attributes from `Button`, `Input`, `Select`, `DatePicker`, `AutoComplete`, and `Avatar` components, allowing default sizing for better visual density.
4. Eliminated redundant `bodyStyle` background overrides in some `SideSheet` components.
5. No business logic touched; all changes are purely presentational.

Result
The editing and creation dialogs now share a unified, compact style consistent with the latest design language, improving readability and user experience without altering functionality.

web/src/pages/Redemption/EditRedemption.js

@@ -22,6 +22,7 @@ import {
   Tag,
   Form,
   DatePicker,
+  Avatar,
 } from '@douyinfe/semi-ui';
 import {
   IconCreditCard,
@@ -157,10 +158,7 @@ const EditRedemption = (props) => {
           borderBottom: '1px solid var(--semi-color-border)',
           padding: '24px'
         }}
-        bodyStyle={{
-          backgroundColor: 'var(--semi-color-bg-0)',
-          padding: '0'
-        }}
+        bodyStyle={{ padding: '0' }}
         visible={props.visiable}
         width={isMobile() ? '100%' : 600}
         footer={
@@ -168,7 +166,6 @@ const EditRedemption = (props) => {
             <Space>
               <Button
                 theme="solid"
-                size="large"
                 className="!rounded-full"
                 onClick={submit}
                 icon={<IconSave />}
@@ -178,7 +175,6 @@ const EditRedemption = (props) => {
               </Button>
               <Button
                 theme="light"
-                size="large"
                 className="!rounded-full"
                 type="primary"
                 onClick={handleCancel}
@@ -195,20 +191,14 @@ const EditRedemption = (props) => {
         <Spin spinning={loading}>
           <div className="p-6">
             <Card className="!rounded-2xl shadow-sm border-0 mb-6">
-              <div className="flex items-center mb-4 p-6 rounded-xl" style={{
-                background: 'linear-gradient(135deg, #1e3a8a 0%, #2563eb 50%, #3b82f6 100%)',
-                position: 'relative'
-              }}>
-                <div className="absolute inset-0 overflow-hidden">
-                  <div className="absolute -top-10 -right-10 w-40 h-40 bg-white opacity-5 rounded-full"></div>
-                  <div className="absolute -bottom-8 -left-8 w-24 h-24 bg-white opacity-10 rounded-full"></div>
-                </div>
-                <div className="w-10 h-10 rounded-full bg-white/20 flex items-center justify-center mr-4 relative">
-                  <IconGift size="large" style={{ color: '#ffffff' }} />
-                </div>
-                <div className="relative">
-                  <Text style={{ color: '#ffffff' }} className="text-lg font-medium">{t('基本信息')}</Text>
-                  <div style={{ color: '#ffffff' }} className="text-sm opacity-80">{t('设置兑换码的基本信息')}</div>
+              {/* Header: Basic Info */}
+              <div className="flex items-center mb-2">
+                <Avatar size="small" color="blue" className="mr-2 shadow-md">
+                  <IconGift size={16} />
+                </Avatar>
+                <div>
+                  <Text className="text-lg font-medium">{t('基本信息')}</Text>
+                  <div className="text-xs text-gray-600">{t('设置兑换码的基本信息')}</div>
                 </div>
               </div>
 
@@ -220,7 +210,6 @@ const EditRedemption = (props) => {
                     onChange={(value) => handleInputChange('name', value)}
                     value={name}
                     autoComplete="new-password"
-                    size="large"
                     className="!rounded-lg"
                     showClear
                     required={!isEdit}
@@ -241,7 +230,6 @@ const EditRedemption = (props) => {
                         handleInputChange('expired_time', timestamp);
                       }
                     }}
-                    size="large"
                     className="!rounded-lg w-full"
                   />
                 </div>
@@ -249,20 +237,14 @@ const EditRedemption = (props) => {
             </Card>
 
             <Card className="!rounded-2xl shadow-sm border-0">
-              <div className="flex items-center mb-4 p-6 rounded-xl" style={{
-                background: 'linear-gradient(135deg, #065f46 0%, #059669 50%, #10b981 100%)',
-                position: 'relative'
-              }}>
-                <div className="absolute inset-0 overflow-hidden">
-                  <div className="absolute -top-10 -right-10 w-40 h-40 bg-white opacity-5 rounded-full"></div>
-                  <div className="absolute -bottom-8 -left-8 w-24 h-24 bg-white opacity-10 rounded-full"></div>
-                </div>
-                <div className="w-10 h-10 rounded-full bg-white/20 flex items-center justify-center mr-4 relative">
-                  <IconCreditCard size="large" style={{ color: '#ffffff' }} />
-                </div>
-                <div className="relative">
-                  <Text style={{ color: '#ffffff' }} className="text-lg font-medium">{t('额度设置')}</Text>
-                  <div style={{ color: '#ffffff' }} className="text-sm opacity-80">{t('设置兑换码的额度和数量')}</div>
+              {/* Header: Quota Settings */}
+              <div className="flex items-center mb-2">
+                <Avatar size="small" color="green" className="mr-2 shadow-md">
+                  <IconCreditCard size={16} />
+                </Avatar>
+                <div>
+                  <Text className="text-lg font-medium">{t('额度设置')}</Text>
+                  <div className="text-xs text-gray-600">{t('设置兑换码的额度和数量')}</div>
                 </div>
               </div>
 
@@ -278,7 +260,6 @@ const EditRedemption = (props) => {
                     value={quota}
                     autoComplete="new-password"
                     type="number"
-                    size="large"
                     className="w-full !rounded-lg"
                     prefix={<IconCreditCard />}
                     data={[
@@ -301,7 +282,6 @@ const EditRedemption = (props) => {
                       value={count}
                       autoComplete="new-password"
                       type="number"
-                      size="large"
                       className="!rounded-lg"
                       prefix={<IconPlusCircle />}
                     />