Merge remote-tracking branch 'origin/main'

src/app.config.ts

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

src/pages/brochure/pdf.ts

@@ -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())

src/pages/brochure/shared.ts

@@ -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
+  }
+}

src/pages/brochure/viewer.config.ts

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

src/pages/brochure/viewer.scss

@@ -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;
+  }
+}

src/pages/brochure/viewer.tsx

@@ -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

src/pages/index/CatalogShowcase.scss

@@ -108,3 +108,96 @@
     &: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%;
+  }
+}

src/pages/index/CatalogShowcase.tsx

@@ -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 { Swiper } from '@nutui/nutui-react-taro'
 import { ArrowRight } from '@nutui/icons-react-taro'
+import { getBrochurePayload } from '@/pages/brochure/shared'
 import './CatalogShowcase.scss'
 
-const CATALOG_URL = 'https://book.yunzhan365.com/mdfy/tjcs/mobile/index.html'
-
 function CatalogShowcase() {
-  const handleViewCatalog = () => {
-    Taro.setClipboardData({
-      data: CATALOG_URL,
-      success: () => {
-        Taro.showToast({
-          title: '链接已复制',
-          icon: 'success',
-          duration: 2000
-        })
-        setTimeout(() => {
-          Taro.showModal({
-            title: '提示',
-            content: '链接已复制到剪贴板，请前往浏览器打开查看品牌画册',
-            showCancel: false,
-            confirmText: '知道了'
-          })
-        }, 2100)
-      },
-      fail: () => {
-        Taro.showToast({ title: '复制失败，请重试', icon: 'none' })
-      }
+  const [images, setImages] = useState<string[]>([])
+  const [current, setCurrent] = useState(0)
+
+  useEffect(() => {
+    getBrochurePayload()
+      .then(({ images: nextImages }) => {
+        setImages(nextImages)
+      })
+      .catch(() => undefined)
+  }, [])
+
+  const handlePreviewCurrent = () => {
+    if (!images.length) {
+      Taro.showToast({
+        title: '画册加载中',
+        icon: 'none'
+      })
+      return
+    }
+
+    Taro.previewImage({
+      current: images[current] || images[0],
+      urls: images
     })
   }
 
   return (
-    <View className="catalog-card" onClick={handleViewCatalog}>
-      {/* 装饰性背景元素 */}
-      <View className="catalog-card__deco catalog-card__deco--1" />
-      <View className="catalog-card__deco catalog-card__deco--2" />
+    <>
+      {/* 旧版品牌画册卡片保留，按需求先注释，不直接删除
+      <View className="catalog-card" onClick={handleViewCatalog}>
+        <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__left">
-          <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-xs text-gray-300 leading-relaxed" style={{
-            width: '90%'
-          }}>
-            了解南南佐顿门窗的完整产品线与定制方案
-          </Text>
-          <View className="catalog-card__cta">
-            <Text className="text-base font-semibold text-white px-4">点击查看画册</Text>
-            <ArrowRight size={16} color="#ffffff" />
-          </View>
-        </View>
-
-        <View className="catalog-card__right">
-          <View className="catalog-card__book">
-            <View className="catalog-card__book-spine" />
-            <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__content">
+          <View className="catalog-card__left">
+            <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-xs text-gray-300 leading-relaxed" style={{ width: '90%' }}>
+              了解南南佐顿门窗的完整产品线与定制方案
+            </Text>
+            <View className="catalog-card__cta">
+              <Text className="text-base font-semibold text-white px-4">点击查看画册</Text>
+              <ArrowRight size={16} color="#ffffff" />
+            </View>
+          </View>
+
+          <View className="catalog-card__right">
+            <View className="catalog-card__book">
+              <View className="catalog-card__book-spine" />
+              <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>
+              <Text className="text-lg font-bold text-gray-300 px-1">2026</Text>
             </View>
-            <Text className="text-lg font-bold text-gray-300 px-1">2026</Text>
           </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>
+    </>
   )
 }
 

src/utils/request.ts

@@ -53,7 +53,49 @@ const DEFAULT_CONFIG = {
   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') {
@@ -63,8 +105,8 @@ if (process.env.NODE_ENV === 'development') {
 // 请求拦截器
 const requestInterceptor = (config: RequestConfig): RequestConfig => {
   // 添加认证token
-  const token = Taro.getStorageSync('access_token');
-  const tenantId = Taro.getStorageSync('TenantId') || TenantId;
+  const token = getStorageSyncSafe<string>('access_token');
+  const tenantId = getStorageSyncSafe<string>('TenantId') || TenantId;
 
   const defaultHeaders: Record<string, string> = {
     'Content-Type': 'application/json',
@@ -156,11 +198,11 @@ const responseInterceptor = <T>(response: any, config: RequestConfig): T => {
 const handleAuthError = () => {
   // 清除本地存储的认证信息
   try {
-    Taro.removeStorageSync('access_token');
-    Taro.removeStorageSync('User');
-    Taro.removeStorageSync('UserId');
-    Taro.removeStorageSync('TenantId');
-    Taro.removeStorageSync('Phone');
+    removeStorageSyncSafe('access_token');
+    removeStorageSyncSafe('User');
+    removeStorageSyncSafe('UserId');
+    removeStorageSyncSafe('TenantId');
+    removeStorageSyncSafe('Phone');
   } catch (error) {
     console.error('清除认证信息失败:', error);
   }
@@ -293,7 +335,7 @@ export async function request<T>(options: RequestConfig): Promise<T> {
 // 构建完整URL
 const buildUrl = (url: string): string => {
   if (url.indexOf('http') === -1) {
-    return baseUrl + url;
+    return getBaseUrl() + url;
   }
   return url;
 };