147 lines
4.4 KiB
JavaScript
147 lines
4.4 KiB
JavaScript
/**
|
||
* 图片处理工具
|
||
*/
|
||
|
||
// 默认头像（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
|
||
}
|