/** * 图片处理工具 */ // 默认头像(base64编码的SVG) const DEFAULT_AVATAR = 'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAwIiBoZWlnaHQ9IjIwMCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cmVjdCB3aWR0aD0iMjAwIiBoZWlnaHQ9IjIwMCIgZmlsbD0iI2U1ZTVlNSIvPjxjaXJjbGUgY3g9IjEwMCIgY3k9IjgwIiByPSIzMCIgZmlsbD0iI2NjYyIvPjxwYXRoIGQ9Ik02MCAxNDAgQzYwIDEyMCA4MCAxMTAgMTAwIDExMCBDMTIwIDExMCAxNDAgMTIwIDE0MCAxNDAgTDYwIDE0MCIgZmlsbD0iI2NjYyIvPjwvc3ZnPg==' // 默认商品图片 const DEFAULT_PRODUCT = 'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAwIiBoZWlnaHQ9IjIwMCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cmVjdCB3aWR0aD0iMjAwIiBoZWlnaHQ9IjIwMCIgZmlsbD0iI2Y1ZjVmNSIvPjxyZWN0IHg9IjYwIiB5PSI2MCIgd2lkdGg9IjgwIiBoZWlnaHQ9IjgwIiBmaWxsPSIjZGRkIi8+PHRleHQgeD0iMTAwIiB5PSIxMzAiIGZvbnQtc2l6ZT0iMTQiIHRleHQtYW5jaG9yPSJtaWRkbGUiIGZpbGw9IiM5OTkiPuaaguaXoOWbvueJhzwvdGV4dD48L3N2Zz4=' // 默认背景图片 const DEFAULT_BACKGROUND = 'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNjAwIiBoZWlnaHQ9IjMwMCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48ZGVmcz48bGluZWFyR3JhZGllbnQgaWQ9ImciIHgxPSIwJSIgeTE9IjAlIiB4Mj0iMTAwJSIgeTI9IjEwMCUiPjxzdG9wIG9mZnNldD0iMCUiIHN0eWxlPSJzdG9wLWNvbG9yOiM2NmJiNmE7c3RvcC1vcGFjaXR5OjEiIC8+PHN0b3Agb2Zmc2V0PSIxMDAlIiBzdHlsZT0ic3RvcC1jb2xvcjojNDNhMDQ3O3N0b3Atb3BhY2l0eToxIiAvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHdpZHRoPSI2MDAiIGhlaWdodD0iMzAwIiBmaWxsPSJ1cmwoI2cpIi8+PC9zdmc+' // API基础URL - 根据环境自动切换 // #ifdef MP-WEIXIN const API_BASE_URL = 'https://px.ddn-ai.cloud/api' // 生产环境 // #endif // #ifdef H5 const API_BASE_URL = process.env.NODE_ENV === 'production' ? 'https://px.ddn-ai.cloud/api' // 生产环境 : 'http://localhost:8089' // 开发环境 // #endif // #ifndef MP-WEIXIN || H5 const API_BASE_URL = 'http://localhost:8089' // 其他环境默认本地 // #endif /** * 获取图片URL * @param {String} url - 图片URL或路径 * @param {String} type - 图片类型:avatar, product, background * @returns {String} 完整的图片URL */ export function getImageUrl(url, type = 'avatar') { // 如果没有URL,返回默认图片 if (!url) { return getDefaultImage(type) } // 如果是完整的HTTP/HTTPS URL,直接返回 if (url.startsWith('http://') || url.startsWith('https://')) { return url } // 如果是base64或data URL,直接返回 if (url.startsWith('data:')) { return url } // 如果是相对路径,拼接API基础URL if (url.startsWith('/')) { return `${API_BASE_URL}${url}` } // 其他情况,拼接API基础URL return `${API_BASE_URL}/${url}` } /** * 获取默认图片 * @param {String} type - 图片类型 * @returns {String} 默认图片的base64编码 */ export function getDefaultImage(type = 'avatar') { switch (type) { case 'avatar': return DEFAULT_AVATAR case 'product': return DEFAULT_PRODUCT case 'background': return DEFAULT_BACKGROUND default: return DEFAULT_AVATAR } } /** * 处理图片加载错误 * @param {Event} e - 错误事件 * @param {String} type - 图片类型 */ export function handleImageError(e, type = 'avatar') { console.warn('图片加载失败:', e) // 返回默认图片 return getDefaultImage(type) } /** * 获取头像URL * @param {String} avatar - 头像URL或路径 * @returns {String} 完整的头像URL */ export function getAvatarUrl(avatar) { return getImageUrl(avatar, 'avatar') } /** * 获取商品图片URL * @param {String} image - 图片URL或路径 * @returns {String} 完整的图片URL */ export function getProductImageUrl(image) { return getImageUrl(image, 'product') } /** * 获取背景图片URL * @param {String} image - 图片URL或路径 * @returns {String} 完整的图片URL */ export function getBackgroundImageUrl(image) { return getImageUrl(image, 'background') } /** * 批量处理图片URL * @param {Array} images - 图片数组 * @param {String} type - 图片类型 * @returns {Array} 处理后的图片URL数组 */ export function processImages(images, type = 'product') { if (!Array.isArray(images)) { return [] } return images.map(img => { if (typeof img === 'string') { return getImageUrl(img, type) } if (img && img.url) { return getImageUrl(img.url, type) } return getDefaultImage(type) }) } export default { getImageUrl, getDefaultImage, handleImageError, getAvatarUrl, getProductImageUrl, getBackgroundImageUrl, processImages }