feat: 完善 Telegram 推送通知功能
- 推送模板优化: - 优先使用账户名称而不是钱包地址 - 使用市场标题而不是16进制ID - 添加可点击的市场链接(支持 slug 和 conditionId) - 添加市场方向(outcome)显示 - 数量和价格从订单详情API获取实际值 - 失败通知只显示后端返回的msg,不显示完整堆栈 - 多语言支持: - 后端推送消息支持多语言(使用前端最后请求的语言) - 添加所有 ErrorCode 的多语言资源文件(中文简体、繁体、英文) - 通知消息文本全部使用多语言资源 - 功能改进: - 从订单详情获取实际的 side、price、size、outcome - 支持买入/卖出方向的多语言显示 - 错误信息优化,只显示后端返回的错误消息
This commit is contained in:
@@ -0,0 +1,170 @@
|
||||
import React from 'react'
|
||||
|
||||
interface LogoProps {
|
||||
/**
|
||||
* Logo 尺寸
|
||||
* @default 'normal'
|
||||
*/
|
||||
size?: 'small' | 'normal' | 'large'
|
||||
/**
|
||||
* 是否只显示图标(不显示文字)
|
||||
* @default false
|
||||
*/
|
||||
iconOnly?: boolean
|
||||
/**
|
||||
* 是否使用深色模式(用于深色背景)
|
||||
* @default false
|
||||
*/
|
||||
darkMode?: boolean
|
||||
/**
|
||||
* 自定义样式类名
|
||||
*/
|
||||
className?: string
|
||||
/**
|
||||
* 自定义样式
|
||||
*/
|
||||
style?: React.CSSProperties
|
||||
}
|
||||
|
||||
/**
|
||||
* PolyHermes Logo 组件
|
||||
*
|
||||
* 设计理念:
|
||||
* - Hermes(赫尔墨斯)是希腊神话中的信使神,代表快速传递和连接
|
||||
* - 结合交易元素(箭头、连接线)体现跟单交易的核心功能
|
||||
* - 现代简洁的设计风格,适配深色和浅色背景
|
||||
*/
|
||||
const Logo: React.FC<LogoProps> = ({
|
||||
size = 'normal',
|
||||
iconOnly = false,
|
||||
darkMode = false,
|
||||
className = '',
|
||||
style = {}
|
||||
}) => {
|
||||
// 根据尺寸确定图标大小
|
||||
const iconSizes = {
|
||||
small: 24,
|
||||
normal: 32,
|
||||
large: 48
|
||||
}
|
||||
|
||||
// 根据尺寸确定文字大小
|
||||
const textSizes = {
|
||||
small: 14,
|
||||
normal: 18,
|
||||
large: 24
|
||||
}
|
||||
|
||||
const iconSize = iconSizes[size]
|
||||
const textSize = textSizes[size]
|
||||
|
||||
// 根据深色模式选择颜色
|
||||
const gradientColors = darkMode
|
||||
? { start: '#69c0ff', end: '#b37feb' } // 深色背景使用较亮的颜色
|
||||
: { start: '#1890ff', end: '#722ed1' } // 浅色背景使用标准颜色
|
||||
|
||||
const textColor = darkMode ? '#fff' : 'inherit'
|
||||
|
||||
return (
|
||||
<div
|
||||
className={`polyhermes-logo ${className}`}
|
||||
style={{
|
||||
display: 'flex',
|
||||
alignItems: 'center',
|
||||
gap: '8px',
|
||||
...style
|
||||
}}
|
||||
>
|
||||
{/* Logo 图标 */}
|
||||
<svg
|
||||
width={iconSize}
|
||||
height={iconSize}
|
||||
viewBox="0 0 64 64"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
style={{ flexShrink: 0 }}
|
||||
>
|
||||
{/* 渐变定义 */}
|
||||
<defs>
|
||||
<linearGradient id={`logoGradient-${darkMode ? 'dark' : 'light'}`} x1="0%" y1="0%" x2="100%" y2="100%">
|
||||
<stop offset="0%" stopColor={gradientColors.start} />
|
||||
<stop offset="100%" stopColor={gradientColors.end} />
|
||||
</linearGradient>
|
||||
</defs>
|
||||
|
||||
{/* 主图标设计:双箭头连接,代表跟单交易 */}
|
||||
{/* 左侧箭头(指向中心) */}
|
||||
<path
|
||||
d="M 16 32 L 8 24 L 8 40 Z"
|
||||
fill={`url(#logoGradient-${darkMode ? 'dark' : 'light'})`}
|
||||
/>
|
||||
|
||||
{/* 中心连接线(代表跟单连接) */}
|
||||
<line
|
||||
x1="20"
|
||||
y1="32"
|
||||
x2="44"
|
||||
y2="32"
|
||||
stroke={`url(#logoGradient-${darkMode ? 'dark' : 'light'})`}
|
||||
strokeWidth="3"
|
||||
strokeLinecap="round"
|
||||
/>
|
||||
|
||||
{/* 右侧箭头(指向中心) */}
|
||||
<path
|
||||
d="M 48 32 L 56 24 L 56 40 Z"
|
||||
fill={`url(#logoGradient-${darkMode ? 'dark' : 'light'})`}
|
||||
/>
|
||||
|
||||
{/* 中心圆点(代表交易节点/数据同步点) */}
|
||||
<circle
|
||||
cx="32"
|
||||
cy="32"
|
||||
r="5"
|
||||
fill={`url(#logoGradient-${darkMode ? 'dark' : 'light'})`}
|
||||
/>
|
||||
|
||||
{/* 装饰性数据流弧线(代表实时数据同步) */}
|
||||
<path
|
||||
d="M 20 20 Q 32 14 44 20"
|
||||
stroke={`url(#logoGradient-${darkMode ? 'dark' : 'light'})`}
|
||||
strokeWidth="2"
|
||||
fill="none"
|
||||
opacity="0.5"
|
||||
strokeLinecap="round"
|
||||
/>
|
||||
<path
|
||||
d="M 20 44 Q 32 50 44 44"
|
||||
stroke={`url(#logoGradient-${darkMode ? 'dark' : 'light'})`}
|
||||
strokeWidth="2"
|
||||
fill="none"
|
||||
opacity="0.5"
|
||||
strokeLinecap="round"
|
||||
/>
|
||||
</svg>
|
||||
|
||||
{/* Logo 文字 */}
|
||||
{!iconOnly && (
|
||||
<span
|
||||
style={{
|
||||
fontSize: `${textSize}px`,
|
||||
fontWeight: 'bold',
|
||||
background: darkMode
|
||||
? 'linear-gradient(135deg, #69c0ff 0%, #b37feb 100%)'
|
||||
: 'linear-gradient(135deg, #1890ff 0%, #722ed1 100%)',
|
||||
WebkitBackgroundClip: 'text',
|
||||
WebkitTextFillColor: 'transparent',
|
||||
backgroundClip: 'text',
|
||||
letterSpacing: '0.5px',
|
||||
color: textColor
|
||||
}}
|
||||
>
|
||||
PolyHermes
|
||||
</span>
|
||||
)}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default Logo
|
||||
|
||||
Reference in New Issue
Block a user