developer/template-10582
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge remote-tracking branch 'origin/main'

Browse Source
This commit is contained in:
赵忠林
2026-06-01 10:57:43 +08:00
parent 2d4d73d0d1 20f77ff886
commit c58060fbd7
9 changed files with 454 additions and 61 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
src/app.config.ts
View File

@@ -2,6 +2,7 @@ export default defineAppConfig({
pages: [ pages: [
'pages/index/index', 'pages/index/index',
'pages/brochure/index', 'pages/brochure/index',
'pages/brochure/viewer',
'pages/cart/cart', 'pages/cart/cart',
'pages/find/find', 'pages/find/find',
'pages/user/user' 'pages/user/user'

30
src/pages/brochure/pdf.ts Normal file
View File

@@ -0,0 +1,30 @@
export const DEFAULT_CATALOG_URL = 'https://file.websoft.top/nnlc.pdf'
const safeDecodeUrl = (value: string) => {
let nextValue = value
for (let index = 0; index < 2; index += 1) {
try {
const decodedValue = decodeURIComponent(nextValue)
if (decodedValue === nextValue) {
break
}
nextValue = decodedValue
} catch {
break
}
}
return nextValue
}
export const normalizePdfUrl = (value?: string) => {
const trimmedValue = (value || '').trim()
if (!trimmedValue) {
return DEFAULT_CATALOG_URL
}
return safeDecodeUrl(trimmedValue)
}
export const isPdfUrl = (value?: string) => /\.pdf(\?|#|$)/i.test((value || '').trim())

97
src/pages/brochure/shared.ts Normal file
View File

@@ -0,0 +1,97 @@
import Taro from '@tarojs/taro'
const PREVIEW_TITLE = '品牌画册'
const BROCHURE_API_BASE = 'https://cms-api.websoft.top/api'
interface BrochureGoods {
goodsId?: number
name?: string
goodsName?: string
files?: string
}
export interface BrochurePayload {
title: string
images: string[]
}
const parseFiles = (files?: string): string[] => {
if (!files) {
return []
}
try {
const parsed = JSON.parse(files)
if (Array.isArray(parsed)) {
return parsed.reduce<string[]>((result, item: any) => {
if (typeof item === 'string') {
result.push(item)
return result
}
if (item && typeof item.url === 'string') {
result.push(item.url)
}
return result
}, [])
}
if (typeof parsed === 'string') {
return [parsed]
}
if (parsed && typeof parsed.url === 'string') {
return [parsed.url]
}
} catch (error) {
if (/^https?:\/\//.test(files) || files.startsWith('/')) {
return [files]
}
console.error('解析画册图片失败:', error)
return []
}
return []
}
export const getBrochurePayload = async (): Promise<BrochurePayload> => {
const response = await Taro.request<BrochureGoods[]>({
url: `${BROCHURE_API_BASE}/shop/shop-goods`,
method: 'GET',
header: {
'Content-Type': 'application/json',
Tenantid: '10582'
}
})
const responseData: any = response.data
const goodsList: BrochureGoods[] = Array.isArray(responseData)
? responseData
: (Array.isArray(responseData?.data) ? responseData.data : [])
if (!goodsList.length) {
throw new Error('画册加载失败，请稍后重试')
}
const title = goodsList[0]?.goodsName || goodsList[0]?.name || PREVIEW_TITLE
const images: string[] = []
goodsList.forEach((item) => {
const parsedImages = parseFiles(item.files)
if (parsedImages.length) {
images.push(...parsedImages)
}
})
if (!images.length) {
throw new Error('当前商品未配置画册图片')
}
return {
title,
images
}
}

5
src/pages/brochure/viewer.config.ts Normal file
View File

@@ -0,0 +1,5 @@
export default definePageConfig({
navigationBarTitleText: '品牌画册',
navigationBarBackgroundColor: '#ffffff',
navigationBarTextStyle: 'black'
})

19
src/pages/brochure/viewer.scss Normal file
View File

@@ -0,0 +1,19 @@
.brochure-viewer {
min-height: 100vh;
padding: 0;
box-sizing: border-box;
background: #ffffff;
display: flex;
flex-direction: column;
&--loading {
display: flex;
align-items: center;
justify-content: center;
}
&__image {
width: 100%;
display: block;
}
}

60
src/pages/brochure/viewer.tsx Normal file
View File

@@ -0,0 +1,60 @@
import { useEffect, useState } from 'react'
import Taro from '@tarojs/taro'
import { View, Image } from '@tarojs/components'
import { Loading } from '@nutui/nutui-react-taro'
import { getBrochurePayload } from './shared'
import './viewer.scss'
function BrochureViewer() {
const [loading, setLoading] = useState(true)
const [images, setImages] = useState<string[]>([])
const [errorMessage, setErrorMessage] = useState('')
useEffect(() => {
const loadBrochure = async () => {
try {
const { title, images: nextImages } = await getBrochurePayload()
setImages(nextImages)
Taro.setNavigationBarTitle({
title
})
} catch (error: any) {
const nextMessage = error?.message || error?.errMsg || '画册加载失败，请稍后重试'
setErrorMessage(nextMessage)
Taro.showToast({
title: nextMessage,
icon: 'none'
})
} finally {
setLoading(false)
}
}
loadBrochure()
}, [])
if (loading) {
return (
<View className="brochure-viewer brochure-viewer--loading">
<Loading>加载中</Loading>
</View>
)
}
return (
<View className="brochure-viewer">
{errorMessage ? null : images.map((item, index) => (
<Image
key={`${item}-${index}`}
className="brochure-viewer__image"
src={item}
mode="widthFix"
lazyLoad
showMenuByLongpress
/>
))}
</View>
)
}
export default BrochureViewer

93
src/pages/index/CatalogShowcase.scss
View File

@@ -108,3 +108,96 @@
&:nth-child(3) { height: 32px; } &:nth-child(3) { height: 32px; }
} }
} }
.catalog-swiper {
margin: 24px 16px 8px;
&__header {
display: flex;
align-items: flex-end;
justify-content: space-between;
padding: 0 4px 12px;
gap: 12px;
}
&__title-wrap {
display: flex;
flex-direction: column;
gap: 4px;
}
&__eyebrow {
font-size: 20px;
line-height: 1;
letter-spacing: 3px;
color: #94a3b8;
}
&__title {
font-size: 36px;
line-height: 1.2;
font-weight: 700;
color: #0f172a;
}
&__cta {
display: inline-flex;
align-items: center;
gap: 4px;
padding: 10px 14px;
border-radius: 999px;
background: linear-gradient(135deg, #1e3a5f 0%, #2563eb 100%);
flex-shrink: 0;
}
&__cta-text {
font-size: 24px;
line-height: 1;
color: #ffffff;
font-weight: 600;
}
&__body {
border-radius: 20px;
overflow: hidden;
background: linear-gradient(135deg, #1e293b 0%, #2563eb 100%);
box-shadow: 0 12px 32px rgba(37, 99, 235, 0.18);
}
&__slide {
width: 100%;
//height: 220px;
overflow: hidden;
}
&__image {
width: 100%;
//height: 220px;
display: block;
}
&__placeholder {
//height: 220px;
display: flex;
align-items: center;
justify-content: center;
padding: 24px;
}
&__placeholder-text {
font-size: 28px;
color: rgba(255, 255, 255, 0.88);
}
.nut-swiper {
//height: 220px !important;
}
.nut-swiper-item {
//height: 220px !important;
}
.nut-swiper-item__inner {
height: 100%;
}
}

150
src/pages/index/CatalogShowcase.tsx
View File

@@ -1,69 +1,115 @@
import { View, Text } from '@tarojs/components' import { useEffect, useState } from 'react'
import { View, Text, Image } from '@tarojs/components'
import Taro from '@tarojs/taro' import Taro from '@tarojs/taro'
import { Swiper } from '@nutui/nutui-react-taro'
import { ArrowRight } from '@nutui/icons-react-taro' import { ArrowRight } from '@nutui/icons-react-taro'
import { getBrochurePayload } from '@/pages/brochure/shared'
import './CatalogShowcase.scss' import './CatalogShowcase.scss'
const CATALOG_URL = 'https://book.yunzhan365.com/mdfy/tjcs/mobile/index.html'
function CatalogShowcase() { function CatalogShowcase() {
const handleViewCatalog = () => { const [images, setImages] = useState<string[]>([])
Taro.setClipboardData({ const [current, setCurrent] = useState(0)
data: CATALOG_URL,
success: () => { useEffect(() => {
Taro.showToast({ getBrochurePayload()
title: '链接已复制', .then(({ images: nextImages }) => {
icon: 'success', setImages(nextImages)
duration: 2000 })
}) .catch(() => undefined)
setTimeout(() => { }, [])
Taro.showModal({
title: '提示', const handlePreviewCurrent = () => {
content: '链接已复制到剪贴板，请前往浏览器打开查看品牌画册', if (!images.length) {
showCancel: false, Taro.showToast({
confirmText: '知道了' title: '画册加载中',
}) icon: 'none'
}, 2100) })
}, return
fail: () => { }
Taro.showToast({ title: '复制失败，请重试', icon: 'none' })
} Taro.previewImage({
current: images[current] || images[0],
urls: images
}) })
} }
return ( return (
<View className="catalog-card" onClick={handleViewCatalog}> <>
{/* 装饰性背景元素 */} {/* 旧版品牌画册卡片保留，按需求先注释，不直接删除
<View className="catalog-card__deco catalog-card__deco--1" /> <View className="catalog-card" onClick={handleViewCatalog}>
<View className="catalog-card__deco catalog-card__deco--2" /> <View className="catalog-card__deco catalog-card__deco--1" />
<View className="catalog-card__deco catalog-card__deco--2" />
<View className="catalog-card__content"> <View className="catalog-card__content">
<View className="catalog-card__left"> <View className="catalog-card__left">
<Text className="text-xs text-gray-400 tracking-widest">BRAND CATALOG</Text> <Text className="text-xs text-gray-400 tracking-widest">BRAND CATALOG</Text>
<Text className="text-2xl font-bold text-white mb-1">品牌画册</Text> <Text className="text-2xl font-bold text-white mb-1">品牌画册</Text>
<Text className="text-xs text-gray-300 leading-relaxed" style={{ <Text className="text-xs text-gray-300 leading-relaxed" style={{ width: '90%' }}>
width: '90%' 了解南南佐顿门窗的完整产品线与定制方案
}}> </Text>
了解南南佐顿门窗的完整产品线与定制方案 <View className="catalog-card__cta">
</Text> <Text className="text-base font-semibold text-white px-4">点击查看画册</Text>
<View className="catalog-card__cta"> <ArrowRight size={16} color="#ffffff" />
<Text className="text-base font-semibold text-white px-4">点击查看画册</Text> </View>
<ArrowRight size={16} color="#ffffff" /> </View>
</View>
</View> <View className="catalog-card__right">
<View className="catalog-card__book">
<View className="catalog-card__right"> <View className="catalog-card__book-spine" />
<View className="catalog-card__book"> <View className="catalog-card__book-pages">
<View className="catalog-card__book-spine" /> <View className="catalog-card__book-page" />
<View className="catalog-card__book-pages"> <View className="catalog-card__book-page" />
<View className="catalog-card__book-page" /> <View className="catalog-card__book-page" />
<View className="catalog-card__book-page" /> </View>
<View className="catalog-card__book-page" /> <Text className="text-lg font-bold text-gray-300 px-1">2026</Text>
</View> </View>
<Text className="text-lg font-bold text-gray-300 px-1">2026</Text>
</View> </View>
</View> </View>
</View> </View>
</View> */}
<View className="catalog-swiper">
<View className="catalog-swiper__header">
<View className="catalog-swiper__title-wrap">
<Text className="catalog-swiper__eyebrow">BRAND CATALOG</Text>
<Text className="catalog-swiper__title">品牌画册</Text>
</View>
{/*<View className="catalog-swiper__cta">*/}
{/* <Text className="catalog-swiper__cta-text">点击预览当前图片</Text>*/}
{/* <ArrowRight size={14} color="#ffffff" />*/}
{/*</View>*/}
</View>
<View className="catalog-swiper__body" onClick={handlePreviewCurrent}>
{images.length ? (
<Swiper
defaultValue={0}
indicator
autoPlay={3000}
height="180px"
onChange={(event) => setCurrent(event.detail.current)}
>
{images.map((item, index) => (
<Swiper.Item key={`${item}-${index}`}>
<View className="catalog-swiper__slide">
<Image
className="catalog-swiper__image"
src={item}
mode="aspectFill"
lazyLoad
/>
</View>
</Swiper.Item>
))}
</Swiper>
) : (
<View className="catalog-swiper__placeholder">
<Text className="catalog-swiper__placeholder-text">画册加载中...</Text>
</View>
)}
</View>
</View>
</>
) )
} }

60
src/utils/request.ts
View File

@@ -53,7 +53,49 @@ const DEFAULT_CONFIG = {
showError: true showError: true
}; };
let baseUrl = Taro.getStorageSync('ApiUrl') || BaseUrl; const getStorageSyncSafe = <T = any>(key: string): T | undefined => {
try {
if (typeof Taro.getStorageSync === 'function') {
return Taro.getStorageSync(key) as T;
}
} catch (error) {
console.warn(`读取存储失败: ${key}`, error);
}
if (typeof window !== 'undefined' && window.localStorage) {
const rawValue = window.localStorage.getItem(key);
if (rawValue === null) {
return undefined;
}
try {
return JSON.parse(rawValue) as T;
} catch {
return rawValue as T;
}
}
return undefined;
};
const removeStorageSyncSafe = (key: string) => {
try {
if (typeof Taro.removeStorageSync === 'function') {
Taro.removeStorageSync(key);
return;
}
} catch (error) {
console.warn(`删除存储失败: ${key}`, error);
}
if (typeof window !== 'undefined' && window.localStorage) {
window.localStorage.removeItem(key);
}
};
const getBaseUrl = (): string => {
return getStorageSyncSafe<string>('ApiUrl') || BaseUrl;
};
// 开发环境配置 // 开发环境配置
if (process.env.NODE_ENV === 'development') { if (process.env.NODE_ENV === 'development') {
@@ -63,8 +105,8 @@ if (process.env.NODE_ENV === 'development') {
// 请求拦截器 // 请求拦截器
const requestInterceptor = (config: RequestConfig): RequestConfig => { const requestInterceptor = (config: RequestConfig): RequestConfig => {
// 添加认证token // 添加认证token
const token = Taro.getStorageSync('access_token'); const token = getStorageSyncSafe<string>('access_token');
const tenantId = Taro.getStorageSync('TenantId') || TenantId; const tenantId = getStorageSyncSafe<string>('TenantId') || TenantId;
const defaultHeaders: Record<string, string> = { const defaultHeaders: Record<string, string> = {
'Content-Type': 'application/json', 'Content-Type': 'application/json',
@@ -156,11 +198,11 @@ const responseInterceptor = <T>(response: any, config: RequestConfig): T => {
const handleAuthError = () => { const handleAuthError = () => {
// 清除本地存储的认证信息 // 清除本地存储的认证信息
try { try {
Taro.removeStorageSync('access_token'); removeStorageSyncSafe('access_token');
Taro.removeStorageSync('User'); removeStorageSyncSafe('User');
Taro.removeStorageSync('UserId'); removeStorageSyncSafe('UserId');
Taro.removeStorageSync('TenantId'); removeStorageSyncSafe('TenantId');
Taro.removeStorageSync('Phone'); removeStorageSyncSafe('Phone');
} catch (error) { } catch (error) {
console.error('清除认证信息失败:', error); console.error('清除认证信息失败:', error);
} }
@@ -293,7 +335,7 @@ export async function request<T>(options: RequestConfig): Promise<T> {
// 构建完整URL // 构建完整URL
const buildUrl = (url: string): string => { const buildUrl = (url: string): string => {
if (url.indexOf('http') === -1) { if (url.indexOf('http') === -1) {
return baseUrl + url; return getBaseUrl() + url;
} }
return url; return url;
}; };