interface IUserInfo { id: string | number; name: string; officialEmail: string | null; officialNumber: string | null; role: 'STUDENT' | 'TEACHER' | 'ADMIN' | null; userAvatar: string | null; createTime: string | null; englishName: string | null; gender: 'MAN' | 'WOMAN' | null; birthday: string | null; phone: string | null; contentEmail: string | null; pid: string | number; openid: string | null; unionid: string | null; isWechatBound: boolean; } // 预设的渐变色方案 const gradientColors = [ { primary: '#3498DB', secondary: '#5DADE2', name: 'ocean' }, { primary: '#F39C12', secondary: '#F4D03F', name: 'sunset' }, { primary: '#5DADE2', secondary: '#AED6F1', name: 'sky' }, { primary: '#58D68D', secondary: '#82E0AA', name: 'forest' }, { primary: '#E74C3C', secondary: '#F1948A', name: 'coral' } ] // 渐变方向 const gradientDirections = [ '135deg', '45deg', '225deg', '315deg' ] /** * 基于用户信息生成一致的哈希值 */ function generateUserHash(userInfo: IUserInfo): number { const hashString = `${userInfo.id || 0}-${userInfo.name || ''}-${userInfo.officialEmail || ''}` let hash = 0 if (hashString.length === 0) return hash for (let i = 0; i < hashString.length; i++) { const char = hashString.charCodeAt(i) hash = ((hash << 5) - hash) + char hash = hash & hash // Convert to 32bit integer } return Math.abs(hash) } /** * 生成用户名的首字母显示 */ function generateAvatarText(userInfo: IUserInfo): string { if (userInfo.name) { // 如果是中文名,取最后一个字 if (/[\u4e00-\u9fa5]/.test(userInfo.name)) { return userInfo.name.slice(-1) } // 如果是英文名,取首字母 return userInfo.name.charAt(0).toUpperCase() } if (userInfo.englishName) { return userInfo.englishName.charAt(0).toUpperCase() } if (userInfo.officialEmail) { return userInfo.officialEmail.charAt(0).toUpperCase() } return '☁️' } /** * 生成完整的默认头像配置 * @param userInfo 用户信息 * @returns 完整的头像配置对象 */ export function generateDefaultAvatar(userInfo: IUserInfo) { const hash = generateUserHash(userInfo) // 基于哈希值选择颜色方案和方向 const colorIndex = hash % gradientColors.length const directionIndex = hash % gradientDirections.length const selectedColor = gradientColors[colorIndex] const selectedDirection = gradientDirections[directionIndex] return { // 是否为默认头像 isDefault: true, // 头像显示文字 text: generateAvatarText(userInfo), // 渐变背景样式 background: `linear-gradient(${selectedDirection}, ${selectedColor.primary} 0%, ${selectedColor.secondary} 100%)`, // 颜色信息 colors: { primary: selectedColor.primary, secondary: selectedColor.secondary, name: selectedColor.name }, // 渐变方向 direction: selectedDirection, // 完整的样式对象(用于Vue组件) style: { background: `linear-gradient(${selectedDirection}, ${selectedColor.primary} 0%, ${selectedColor.secondary} 100%)`, color: '#ffffff', fontWeight: '600', textShadow: '0 2rpx 4rpx rgba(0, 0, 0, 0.1)' } } } /** * 获取用户头像配置(自定义头像或默认头像) * @param userInfo 用户信息 * @returns 头像配置对象 */ export function getUserAvatarConfig(userInfo: IUserInfo) { // 如果有自定义头像 const isDefault = !userInfo.userAvatar || userInfo.userAvatar === 'default_avatar_url'; if(isDefault){ // 返回默认头像配置 return generateDefaultAvatar(userInfo) } return { isDefault: false, src: userInfo.userAvatar, text: '', background: '', style: {} } }