perf(CompanyHeader): 性能优化与代码重构
- 移除不必要的 PageTitle 子组件(纯静态内容,memo 无意义) - 提取样式常量到 constants.ts,避免每次渲染重新创建对象 - 简化 SearchBox props,移除未使用的 stockCode - 点击搜索图标支持发起搜索 - 移除未使用的 FUI_GLASS 导入 - 简化 CompanyHeaderProps 类型定义 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
70
src/views/Company/components/CompanyHeader/constants.ts
Normal file
70
src/views/Company/components/CompanyHeader/constants.ts
Normal file
@@ -0,0 +1,70 @@
|
||||
/**
|
||||
* CompanyHeader 组件常量
|
||||
*/
|
||||
|
||||
import { FUI_COLORS, FUI_GLOW, FUI_ANIMATION } from '../../theme/fui';
|
||||
|
||||
/** 下拉菜单样式 */
|
||||
export const DROPDOWN_STYLE: React.CSSProperties = {
|
||||
backgroundColor: FUI_COLORS.bg.elevated,
|
||||
borderRadius: '6px',
|
||||
border: `1px solid ${FUI_COLORS.gold[400]}`,
|
||||
boxShadow: '0 4px 20px rgba(0, 0, 0, 0.5)',
|
||||
};
|
||||
|
||||
/** 搜索图标样式 */
|
||||
export const SEARCH_ICON_STYLE: React.CSSProperties = {
|
||||
color: FUI_COLORS.gold[400],
|
||||
fontSize: 16,
|
||||
cursor: 'pointer',
|
||||
};
|
||||
|
||||
/** 输入框样式 */
|
||||
export const INPUT_STYLE: React.CSSProperties = {
|
||||
backgroundColor: 'transparent',
|
||||
borderColor: FUI_COLORS.gold[400],
|
||||
borderRadius: 6,
|
||||
height: 44,
|
||||
color: FUI_COLORS.gold[400],
|
||||
};
|
||||
|
||||
/** AutoComplete 宽度样式 */
|
||||
export const AUTOCOMPLETE_STYLE: React.CSSProperties = {
|
||||
width: 320,
|
||||
};
|
||||
|
||||
/** 搜索框容器样式 */
|
||||
export const SEARCH_BOX_SX = {
|
||||
'.ant-select': {
|
||||
width: '320px !important',
|
||||
},
|
||||
'.ant-input-affix-wrapper': {
|
||||
backgroundColor: 'transparent !important',
|
||||
borderColor: `${FUI_COLORS.gold[400]} !important`,
|
||||
borderWidth: '1px !important',
|
||||
borderRadius: '6px !important',
|
||||
height: '44px !important',
|
||||
padding: '0 12px !important',
|
||||
transition: `all ${FUI_ANIMATION.duration.fast} ${FUI_ANIMATION.easing.default}`,
|
||||
'&:hover': {
|
||||
borderColor: `${FUI_COLORS.gold[300]} !important`,
|
||||
boxShadow: FUI_GLOW.gold.sm,
|
||||
},
|
||||
'&:focus-within, &.ant-input-affix-wrapper-focused': {
|
||||
borderColor: `${FUI_COLORS.gold[300]} !important`,
|
||||
boxShadow: `${FUI_GLOW.gold.md} !important`,
|
||||
},
|
||||
},
|
||||
'.ant-input': {
|
||||
backgroundColor: 'transparent !important',
|
||||
color: `${FUI_COLORS.gold[400]} !important`,
|
||||
fontSize: '14px !important',
|
||||
'&::placeholder': {
|
||||
color: `${FUI_COLORS.gold[400]} !important`,
|
||||
opacity: '0.7 !important',
|
||||
},
|
||||
},
|
||||
'.ant-input-prefix': {
|
||||
marginRight: '8px !important',
|
||||
},
|
||||
} as const;
|
||||
Reference in New Issue
Block a user