From d57592ca7d17ce3d209458375b3de10683099cca Mon Sep 17 00:00:00 2001
From: cyh666666 <2398882793@qq.com>
Date: Fri, 30 Jan 2026 17:29:02 +0800
Subject: [PATCH] =?UTF-8?q?=E7=BB=A7=E7=BB=AD=E5=AE=8C=E5=96=84?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 pages/mall/consumer/address-edit.uvue         |  199 +-
 pages/mall/consumer/address-list copy.uvue    |  219 +++
 pages/mall/consumer/address-list.uvue         |   87 +-
 pages/mall/consumer/cart copy.uvue            |  225 ++-
 pages/mall/consumer/cart.uvue                 |  254 ++-
 pages/mall/consumer/checkout copy 2.uvue      | 1733 +++++++++++++++++
 pages/mall/consumer/checkout.uvue             |  491 ++++-
 .../mall/consumer/product-detail copy 2.uvue  | 1392 +++++++++++++
 pages/mall/consumer/product-detail copy.uvue  | 1163 +++++++++++
 ...roduct-detail copy完成商品详情数据获取.uvue} |  223 ++-
 ...oduct-detail copy完成图片数量数据获取.uvue | 1359 +++++++++++++
 pages/mall/consumer/product-detail.uvue       |  452 ++++-
 types/mall-types.uts                          |    9 +
 utils/supabaseService.uts                     |  604 +++++-
 14 files changed, 8003 insertions(+), 407 deletions(-)
 create mode 100644 pages/mall/consumer/address-list copy.uvue
 create mode 100644 pages/mall/consumer/checkout copy 2.uvue
 create mode 100644 pages/mall/consumer/product-detail copy 2.uvue
 create mode 100644 pages/mall/consumer/product-detail copy.uvue
 rename pages/mall/consumer/{product-detail - 副本.uvue => product-detail copy完成商品详情数据获取.uvue} (72%)
 create mode 100644 pages/mall/consumer/product-detail copy完成图片数量数据获取.uvue

diff --git a/pages/mall/consumer/address-edit.uvue b/pages/mall/consumer/address-edit.uvue
index 18ee45d0..ce30fb61 100644
--- a/pages/mall/consumer/address-edit.uvue
+++ b/pages/mall/consumer/address-edit.uvue
@@ -53,6 +53,7 @@
 <script setup lang="uts">
 import { ref, reactive, computed } from 'vue'
 import { onLoad } from '@dcloudio/uni-app'
+import { supabaseService } from '@/utils/supabaseService.uts'
 
 type Address = {
   id: string
@@ -94,18 +95,52 @@ onLoad((options) => {
   }
 })
 
-const loadAddress = (id: string) => {
-  const storedAddresses = uni.getStorageSync('addresses')
-  if (storedAddresses) {
-    const addresses = JSON.parse(storedAddresses as string) as Address[]
-    const address = addresses.find(item => item.id === id)
+const loadAddress = async (id: string) => {
+  try {
+    // 从Supabase加载地址详情
+    const address = await supabaseService.getAddressById(id)
     if (address) {
-      formData.name = address.name
+      formData.name = address.recipient_name
       formData.phone = address.phone
-      formData.detail = address.detail
-      formData.isDefault = address.isDefault
+      formData.detail = address.detail_address
+      formData.isDefault = address.is_default
       formData.label = address.label || ''
       regionString.value = `${address.province} ${address.city} ${address.district}`.trim()
+    } else {
+      // 如果Supabase没有找到，尝试从本地存储加载
+      const storedAddresses = uni.getStorageSync('addresses')
+      if (storedAddresses) {
+        const addresses = JSON.parse(storedAddresses as string) as Address[]
+        const localAddress = addresses.find(item => item.id === id)
+        if (localAddress) {
+          formData.name = localAddress.name
+          formData.phone = localAddress.phone
+          formData.detail = localAddress.detail
+          formData.isDefault = localAddress.isDefault
+          formData.label = localAddress.label || ''
+          regionString.value = `${localAddress.province} ${localAddress.city} ${localAddress.district}`.trim()
+        }
+      }
+    }
+  } catch (error) {
+    console.error('加载地址详情失败:', error)
+    // 失败时从本地存储加载
+    const storedAddresses = uni.getStorageSync('addresses')
+    if (storedAddresses) {
+      try {
+        const addresses = JSON.parse(storedAddresses as string) as Address[]
+        const address = addresses.find(item => item.id === id)
+        if (address) {
+          formData.name = address.name
+          formData.phone = address.phone
+          formData.detail = address.detail
+          formData.isDefault = address.isDefault
+          formData.label = address.label || ''
+          regionString.value = `${address.province} ${address.city} ${address.district}`.trim()
+        }
+      } catch (e) {
+        console.error('解析本地地址数据失败', e)
+      }
     }
   }
 }
@@ -122,7 +157,7 @@ const onSwitchChange = (e: UniSwitchChangeEvent) => {
   formData.isDefault = e.detail.value
 }
 
-const saveAddress = () => {
+const saveAddress = async () => {
   if (!formData.name) {
     uni.showToast({ title: '请填写收货人', icon: 'none' })
     return
@@ -146,28 +181,66 @@ const saveAddress = () => {
   const city = regions[1] || ''
   const district = regions.slice(2).join(' ') || ''
 
-  const storedAddresses = uni.getStorageSync('addresses')
-  let addresses: Address[] = []
-  if (storedAddresses) {
-    try {
-      addresses = JSON.parse(storedAddresses as string) as Address[]
-    } catch (e) {
-      addresses = []
-    }
-  }
-  
-  // 如果设为默认，取消其他默认
-  if (formData.isDefault) {
-    addresses.forEach(item => {
-      item.isDefault = false
-    })
+  // 构建地址对象
+  const addressData = {
+    recipient_name: formData.name,
+    phone: formData.phone,
+    province: province,
+    city: city,
+    district: district,
+    detail_address: formData.detail,
+    postal_code: '', // 如果需要可以添加邮政编码字段
+    is_default: formData.isDefault,
+    label: formData.label || ''
   }
+
+  let success = false
   
   if (isEdit.value) {
-    const index = addresses.findIndex(item => item.id === addressId.value)
-    if (index !== -1) {
-      addresses[index] = {
-        ...addresses[index],
+    // 更新地址
+    success = await supabaseService.updateAddress(addressId.value, addressData)
+  } else {
+    // 添加新地址
+    success = await supabaseService.addAddress(addressData)
+  }
+
+  if (success) {
+    // 同时更新本地存储作为缓存
+    const storedAddresses = uni.getStorageSync('addresses')
+    let addresses: Address[] = []
+    if (storedAddresses) {
+      try {
+        addresses = JSON.parse(storedAddresses as string) as Address[]
+      } catch (e) {
+        addresses = []
+      }
+    }
+    
+    // 如果设为默认，取消其他默认
+    if (formData.isDefault) {
+      addresses.forEach(item => {
+        item.isDefault = false
+      })
+    }
+    
+    if (isEdit.value) {
+      const index = addresses.findIndex(item => item.id === addressId.value)
+      if (index !== -1) {
+        addresses[index] = {
+          ...addresses[index],
+          name: formData.name,
+          phone: formData.phone,
+          province: province,
+          city: city,
+          district: district,
+          detail: formData.detail,
+          isDefault: formData.isDefault,
+          label: formData.label
+        }
+      }
+    } else {
+      const newAddress: Address = {
+        id: `addr_${Date.now()}`, // 临时ID，实际由Supabase生成
         name: formData.name,
         phone: formData.phone,
         province: province,
@@ -177,36 +250,26 @@ const saveAddress = () => {
         isDefault: formData.isDefault,
         label: formData.label
       }
+      addresses.push(newAddress)
     }
+    
+    uni.setStorageSync('addresses', JSON.stringify(addresses))
+    
+    uni.showToast({
+      title: '保存成功',
+      icon: 'success'
+    })
+    
+    setTimeout(() => {
+      uni.navigateBack()
+    }, 1500)
   } else {
-    const newAddress: Address = {
-      id: `addr_${Date.now()}`,
-      name: formData.name,
-      phone: formData.phone,
-      province: province,
-      city: city,
-      district: district,
-      detail: formData.detail,
-      isDefault: formData.isDefault,
-      label: formData.label
-    }
-    // 如果是第一个地址，自动设为默认
-    if (addresses.length === 0) {
-      newAddress.isDefault = true
-    }
-    addresses.push(newAddress)
+    console.error('保存地址失败')
+    uni.showToast({
+      title: '保存失败',
+      icon: 'none'
+    })
   }
-  
-  uni.setStorageSync('addresses', JSON.stringify(addresses))
-  
-  uni.showToast({
-    title: '保存成功',
-    icon: 'success'
-  })
-  
-  setTimeout(() => {
-    uni.navigateBack()
-  }, 1500)
 }
 
 const parseSmartInput = () => {
@@ -244,17 +307,23 @@ const parseSmartInput = () => {
     formData.detail = addrText
   }
 }
-const deleteAddress = () => {
+const deleteAddress = async () => {
   uni.showModal({
     title: '提示',
     content: '确定要删除该地址吗？',
-    success: (res) => {
+    success: async (res) => {
       if (res.confirm) {
-        const storedAddresses = uni.getStorageSync('addresses')
-        if (storedAddresses) {
-          let addresses = JSON.parse(storedAddresses as string) as Address[]
-          addresses = addresses.filter(item => item.id !== addressId.value)
-          uni.setStorageSync('addresses', JSON.stringify(addresses))
+        // 调用Supabase服务删除地址
+        const success = await supabaseService.deleteAddress(addressId.value)
+        
+        if (success) {
+          // 同时从本地存储中移除
+          const storedAddresses = uni.getStorageSync('addresses')
+          if (storedAddresses) {
+            let addresses = JSON.parse(storedAddresses as string) as Address[]
+            addresses = addresses.filter(item => item.id !== addressId.value)
+            uni.setStorageSync('addresses', JSON.stringify(addresses))
+          }
           
           uni.showToast({
             title: '删除成功',
@@ -264,6 +333,12 @@ const deleteAddress = () => {
           setTimeout(() => {
             uni.navigateBack()
           }, 1500)
+        } else {
+          console.error('删除地址失败')
+          uni.showToast({
+            title: '删除失败',
+            icon: 'none'
+          })
         }
       }
     }
diff --git a/pages/mall/consumer/address-list copy.uvue b/pages/mall/consumer/address-list copy.uvue
new file mode 100644
index 00000000..1b6aeefa
--- /dev/null
+++ b/pages/mall/consumer/address-list copy.uvue	
@@ -0,0 +1,219 @@
+<template>
+  <view class="address-list-page">
+    <view class="address-list">
+      <view v-if="addresses.length === 0" class="empty-state">
+        <text class="empty-icon">📍</text>
+        <text class="empty-text">暂无收货地址</text>
+      </view>
+      
+      <view v-else v-for="(item, index) in addresses" :key="item.id" class="address-item" @click="selectAddress(item)">
+        <view class="item-content">
+          <view class="item-header">
+            <text class="user-name">{{ item.name }}</text>
+            <text class="user-phone">{{ item.phone }}</text>
+            <text v-if="item.isDefault" class="default-tag">默认</text>
+            <text v-if="item.label" class="label-tag">{{ item.label }}</text>
+          </view>
+          <text class="address-text">{{ getFullAddress(item) }}</text>
+        </view>
+        <view class="item-actions">
+            <view class="action-item" @click.stop="editAddress(item.id)">
+                <text class="action-icon">📝</text>
+            </view>
+            <view class="action-item" @click.stop="deleteAddress(item.id)">
+                <text class="action-icon">�️</text>
+            </view>
+        </view>
+      </view>
+    </view>
+    
+    <view class="footer-btn">
+      <button class="add-btn" @click="addAddress">新建收货地址</button>
+    </view>
+  </view>
+</template>
+
+<script setup lang="uts">
+import { ref, onMounted } from 'vue'
+import { onShow } from '@dcloudio/uni-app'
+
+type Address = {
+  id: string
+  name: string
+  phone: string
+  province: string
+  city: string
+  district: string
+  detail: string
+  isDefault: boolean
+  label?: string
+}
+
+const addresses = ref<Address[]>([])
+const selectionMode = ref<boolean>(false)
+let openerEventChannel: any = null
+
+onShow(() => {
+  loadAddresses()
+})
+
+onMounted(() => {
+  try {
+    const ec = uni.getOpenerEventChannel()
+    openerEventChannel = ec
+    ec?.on('setSelectMode', (data: any) => {
+      if (data && typeof data.selectMode === 'boolean') {
+        selectionMode.value = data.selectMode
+      }
+    })
+  } catch (e) {
+    // ignore
+  }
+})
+
+const loadAddresses = () => {
+  const storedAddresses = uni.getStorageSync('addresses')
+  if (storedAddresses) {
+    try {
+      addresses.value = JSON.parse(storedAddresses as string) as Address[]
+    } catch (e) {
+      console.error('Failed to parse addresses', e)
+      addresses.value = []
+    }
+  } else {
+    // 初始Mock数据
+    addresses.value = [
+      {
+        id: 'addr_001',
+        name: '张三',
+        phone: '13800138000',
+        province: '北京市',
+        city: '北京市',
+        district: '朝阳区',
+        detail: '三里屯SOHO A座',
+        isDefault: true,
+        label: '公司'
+      }
+    ]
+    uni.setStorageSync('addresses', JSON.stringify(addresses.value))
+  }
+}
+
+const getFullAddress = (item: Address): string => {
+  return `${item.province}${item.city}${item.district} ${item.detail}`
+}
+
+const addAddress = () => {
+  uni.navigateTo({
+    url: '/pages/mall/consumer/address-edit'
+  })
+}
+
+// 删除地址
+const deleteAddress = (id: string) => {
+    uni.showModal({
+        title: '提示',
+        content: '确定要删除该地址吗？',
+        success: (res) => {
+            if (res.confirm) {
+                const index = addresses.value.findIndex(addr => addr.id === id)
+                if (index !== -1) {
+                    addresses.value.splice(index, 1)
+                    uni.setStorageSync('addresses', JSON.stringify(addresses.value))
+                    uni.showToast({
+                        title: '删除成功',
+                        icon: 'success'
+                    })
+                }
+            }
+        }
+    })
+}
+
+const editAddress = (id: string) => {
+  uni.navigateTo({
+    url: `/pages/mall/consumer/address-edit?id=${id}`
+  })
+}
+
+const selectAddress = (item: Address) => {
+  if (selectionMode.value && openerEventChannel) {
+    openerEventChannel.emit('addressSelected', {
+      id: item.id,
+      recipient_name: item.name,
+      phone: item.phone,
+      province: item.province,
+      city: item.city,
+      district: item.district,
+      detail: item.detail,
+      is_default: item.isDefault
+    })
+    uni.navigateBack()
+  } else {
+    editAddress(item.id)
+  }
+}
+</script>
+
+<style>
+.item-actions {
+  padding: 10px;
+  border-left: 1px solid #f0f0f0;
+  display: flex;
+  flex-direction: column; /* 竖向排列图标 */
+  justify-content: center;
+  align-items: center;
+  gap: 15px;
+}
+
+.footer-btn {
+  position: fixed;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  background-color: white;
+  padding: 10px 15px;
+  padding-bottom: calc(10px + env(safe-area-inset-bottom));
+  box-shadow: 0 -2px 10px rgba(0,0,0,0.05);
+  display: flex;
+  justify-content: center; /* 居中显示 */
+  align-items: center;
+}
+
+.add-btn {
+  background-color: #ff5000;
+  color: white;
+  border-radius: 25px;
+  font-size: 16px;
+  height: 44px;
+  line-height: 44px;
+  border: none;
+  width: 100%; /* 默认占满 */
+  max-width: 100%;
+}
+
+/* 响应式布局优化 */
+@media screen and (min-width: 768px) {
+  .address-list {
+    max-width: 800px;
+    margin: 0 auto;
+  }
+  
+  .address-list-page {
+    background-color: #f5f5f5;
+  }
+  
+  .footer-btn {
+    max-width: 800px;
+    margin: 0 auto;
+    left: 50%;
+    transform: translateX(-50%);
+    box-shadow: 0 -2px 10px rgba(0,0,0,0.05);
+    border-radius: 12px 12px 0 0; /* 桌面端加点圆角更美观 */
+  }
+  
+  .add-btn {
+    width: 300px; /* 桌面端限制宽度 */
+  }
+}
+</style>
diff --git a/pages/mall/consumer/address-list.uvue b/pages/mall/consumer/address-list.uvue
index 1b6aeefa..9938dd2a 100644
--- a/pages/mall/consumer/address-list.uvue
+++ b/pages/mall/consumer/address-list.uvue
@@ -36,6 +36,7 @@
 <script setup lang="uts">
 import { ref, onMounted } from 'vue'
 import { onShow } from '@dcloudio/uni-app'
+import { supabaseService, type UserAddress as SupabaseUserAddress } from '@/utils/supabaseService.uts'
 
 type Address = {
   id: string
@@ -71,31 +72,42 @@ onMounted(() => {
   }
 })
 
-const loadAddresses = () => {
-  const storedAddresses = uni.getStorageSync('addresses')
-  if (storedAddresses) {
-    try {
-      addresses.value = JSON.parse(storedAddresses as string) as Address[]
-    } catch (e) {
-      console.error('Failed to parse addresses', e)
+const loadAddresses = async () => {
+  try {
+    // 从Supabase加载地址数据
+    const supabaseAddresses = await supabaseService.getAddresses()
+    
+    // 转换数据格式以匹配前端界面
+    const transformedAddresses = supabaseAddresses.map((item: SupabaseUserAddress) => ({
+      id: item.id,
+      name: item.recipient_name,
+      phone: item.phone,
+      province: item.province,
+      city: item.city,
+      district: item.district,
+      detail: item.detail_address,
+      isDefault: item.is_default,
+      label: '' // Supabase表没有label字段，可以后续考虑添加或使用其他字段
+    }))
+    
+    addresses.value = transformedAddresses
+    
+    // 同时更新本地存储作为缓存
+    uni.setStorageSync('addresses', JSON.stringify(addresses.value))
+  } catch (error) {
+    console.error('加载地址数据失败:', error)
+    // 如果API调用失败，尝试从本地存储加载
+    const storedAddresses = uni.getStorageSync('addresses')
+    if (storedAddresses) {
+      try {
+        addresses.value = JSON.parse(storedAddresses as string) as Address[]
+      } catch (e) {
+        console.error('解析地址数据失败', e)
+        addresses.value = []
+      }
+    } else {
       addresses.value = []
     }
-  } else {
-    // 初始Mock数据
-    addresses.value = [
-      {
-        id: 'addr_001',
-        name: '张三',
-        phone: '13800138000',
-        province: '北京市',
-        city: '北京市',
-        district: '朝阳区',
-        detail: '三里屯SOHO A座',
-        isDefault: true,
-        label: '公司'
-      }
-    ]
-    uni.setStorageSync('addresses', JSON.stringify(addresses.value))
   }
 }
 
@@ -110,19 +122,32 @@ const addAddress = () => {
 }
 
 // 删除地址
-const deleteAddress = (id: string) => {
+const deleteAddress = async (id: string) => {
     uni.showModal({
         title: '提示',
         content: '确定要删除该地址吗？',
-        success: (res) => {
+        success: async (res) => {
             if (res.confirm) {
-                const index = addresses.value.findIndex(addr => addr.id === id)
-                if (index !== -1) {
-                    addresses.value.splice(index, 1)
-                    uni.setStorageSync('addresses', JSON.stringify(addresses.value))
+                // 调用Supabase服务删除地址
+                const success = await supabaseService.deleteAddress(id)
+                
+                if (success) {
+                    // 从本地列表移除
+                    const index = addresses.value.findIndex(addr => addr.id === id)
+                    if (index !== -1) {
+                        addresses.value.splice(index, 1)
+                        // 更新本地存储缓存
+                        uni.setStorageSync('addresses', JSON.stringify(addresses.value))
+                        uni.showToast({
+                            title: '删除成功',
+                            icon: 'success'
+                        })
+                    }
+                } else {
+                    console.error('删除地址失败')
                     uni.showToast({
-                        title: '删除成功',
-                        icon: 'success'
+                        title: '删除失败',
+                        icon: 'none'
                     })
                 }
             }
diff --git a/pages/mall/consumer/cart copy.uvue b/pages/mall/consumer/cart copy.uvue
index 7d6e20f8..25d48391 100644
--- a/pages/mall/consumer/cart copy.uvue	
+++ b/pages/mall/consumer/cart copy.uvue	
@@ -439,15 +439,18 @@ const addToCart = (product: any) => {
 		}
 	}
 	
-	// 检查商品是否已存在
-	const existingItem = currentItems.find((item: any) => item.id === product.id)
+	// 检查商品是否已存在 (使用商品ID匹配，因为推荐商品没有SKU)
+	const existingItem = currentItems.find((item: any) => 
+		item.productId === product.id || item.id === product.id
+	)
 	
 	if (existingItem) {
 		existingItem.quantity++
 	} else {
 		// 添加新商品
 		currentItems.push({
-			id: product.id,
+			id: product.id, // 商品ID（因为没有SKU）
+			productId: product.id, // 同样存储商品ID
 			shopId: product.shopId || 'shop_recommend',
 			shopName: product.shopName || '推荐好物',
 			name: product.name,
@@ -477,7 +480,21 @@ const goShopping = () => {
 }
 
 const navigateToProduct = (product: any) => {
-	uni.navigateTo({ url: `/pages/mall/consumer/product-detail?id=${product.id}` })
+	// 使用productId（如果存在）作为跳转的商品ID，否则使用id
+	const productId = product.productId || product.id
+	// 传递完整的参数，确保商品详情页能正确加载
+	const params = new URLSearchParams()
+	params.append('id', productId)
+	params.append('productId', productId)
+	params.append('price', product.price?.toString() || '0')
+	// 商品详情页期望的参数名是originalPrice
+	params.append('originalPrice', (product.original_price || product.originalPrice || (product.price * 1.2).toFixed(2))?.toString())
+	params.append('name', encodeURIComponent(product.name || ''))
+	params.append('image', encodeURIComponent(product.image || '/static/product1.jpg'))
+	
+	uni.navigateTo({ 
+		url: `/pages/mall/consumer/product-detail?${params.toString()}` 
+	})
 }
 
 const goToCheckout = () => {
@@ -1090,7 +1107,7 @@ const goToCheckout = () => {
 	}
 }
 
-	/* 购物车操作栏样式 */
+	/* 购物车操作栏样式 - 自适应横向排列 */
 	.cart-action-bar {
 		background-color: white;
 		margin: 10px;
@@ -1104,117 +1121,157 @@ const goToCheckout = () => {
 		flex-direction: row;
 		align-items: center;
 		justify-content: space-between;
+		gap: 10px;
 	}
 
 	.action-left, .action-right {
 		display: flex;
 		align-items: center;
+		flex-wrap: nowrap;
 	}
 
 	.action-right {
 		justify-content: flex-end;
+		flex: 1;
+		min-width: 0; /* 防止溢出 */
 	}
 	
-	/* 底部结算栏 */
-    /*
-	.cart-footer {
-		position: fixed;
-		bottom: 0;
-		left: 0;
-		right: 0;
-		height: 60px;
-		background-color: white;
-		border-top: 1px solid #eee;
-		display: flex;
-		align-items: center;
-		justify-content: center; 
-		padding: 0 15px;
-		z-index: 900;
-		padding-bottom: env(safe-area-inset-bottom);
-	}
-    */
-	
-    /* 复用之前的样式 */
-	.footer-content {
-		width: 100%;
-		display: flex;
-		align-items: center;
-		justify-content: space-between;
-	}
-
-	.footer-left {
-		display: flex;
-		align-items: center;
-	}
-
-	.select-all {
-		display: flex;
-		align-items: center;
-	}
-
-	.select-all-text {
-		margin-left: 8px;
-		font-size: 14px;
-		color: #333;
-	}
-
-	.footer-right {
-		display: flex;
-		align-items: center;
-	}
-
+	/* 合计信息区域 - 自适应横向排列 */
 	.total-info {
-		margin-right: 15px;
-		text-align: right;
+		display: flex;
+		align-items: center;
+		margin-right: 12px;
+		flex-shrink: 0;
 	}
-
+	
 	.total-text {
 		font-size: 14px;
 		color: #333;
 		margin-right: 5px;
+		white-space: nowrap;
 	}
-
+	
 	.total-price {
 		font-size: 18px;
 		color: #ff5000;
 		font-weight: bold;
+		white-space: nowrap;
 	}
-
-	.checkout-btn {
+	
+	/* 结算按钮 */
+	.checkout-btn, .delete-btn {
 		background-color: #ff5000;
 		color: white;
 		border: none;
 		border-radius: 25px;
 		padding: 8px 20px;
 		font-size: 14px;
+		white-space: nowrap;
+		flex-shrink: 0;
 	}
-
+	
 	.delete-btn {
 		background-color: #ff3b30; /* 红色删除按钮 */
-		color: white;
-		border: none;
-		border-radius: 25px;
 		padding: 8px 25px;
-		font-size: 14px;
 	}
-    
-    /* 响应式调整 */
-    @media screen and (min-width: 768px) {
-        .cart-action-bar {
-            margin: 20px auto;
-            max-width: 95%;
-        }
-    }
-    
-    @media screen and (min-width: 1024px) {
-        .cart-action-bar {
-            max-width: 1200px;
-        }
-    }
-    
-    @media screen and (min-width: 1400px) {
-        .cart-action-bar {
-            max-width: 1400px;
-        }
-    }
+	
+	/* 全选区域 */
+	.select-all {
+		display: flex;
+		align-items: center;
+	}
+	
+	.select-all-text {
+		margin-left: 8px;
+		font-size: 14px;
+		color: #333;
+		white-space: nowrap;
+	}
+	
+	/* 响应式调整 */
+	/* 手机端小屏幕优化 */
+	@media screen and (max-width: 375px) {
+		.action-bar-content {
+			gap: 8px;
+		}
+		
+		.total-text {
+			font-size: 13px;
+		}
+		
+		.total-price {
+			font-size: 16px;
+		}
+		
+		.checkout-btn, .delete-btn {
+			padding: 8px 15px;
+			font-size: 13px;
+		}
+		
+		.select-all-text {
+			font-size: 13px;
+		}
+	}
+	
+	/* 平板端优化 */
+	@media screen and (min-width: 768px) {
+		.cart-action-bar {
+			margin: 20px auto;
+			max-width: 95%;
+			padding: 20px;
+		}
+		
+		.action-bar-content {
+			gap: 20px;
+		}
+		
+		.total-price {
+			font-size: 20px;
+		}
+		
+		.checkout-btn, .delete-btn {
+			padding: 10px 30px;
+			font-size: 16px;
+		}
+	}
+	
+	/* 桌面端优化 */
+	@media screen and (min-width: 1024px) {
+		.cart-action-bar {
+			max-width: 1200px;
+			padding: 20px 30px;
+		}
+		
+		.action-bar-content {
+			justify-content: space-between;
+		}
+		
+		.total-info {
+			margin-right: 30px;
+		}
+		
+		.total-text {
+			font-size: 16px;
+		}
+		
+		.total-price {
+			font-size: 22px;
+		}
+		
+		.checkout-btn, .delete-btn {
+			padding: 12px 40px;
+			font-size: 16px;
+		}
+		
+		.select-all-text {
+			font-size: 16px;
+		}
+	}
+	
+	/* 大屏幕优化 */
+	@media screen and (min-width: 1400px) {
+		.cart-action-bar {
+			max-width: 1400px;
+		}
+	}
 </style>
diff --git a/pages/mall/consumer/cart.uvue b/pages/mall/consumer/cart.uvue
index 25d48391..b2f9f6d7 100644
--- a/pages/mall/consumer/cart.uvue
+++ b/pages/mall/consumer/cart.uvue
@@ -168,6 +168,7 @@
 <script setup lang="uts">
 import { ref, computed, onMounted } from 'vue'
 import { onShow } from '@dcloudio/uni-app'
+import { supabaseService, type CartItem as SupabaseCartItem } from '@/utils/supabaseService.uts'
 
 // 响应式数据
 const cartItems = ref<any[]>([])
@@ -269,6 +270,12 @@ const totalPrice = computed(() => {
 		.toFixed(2)
 })
 
+// 检查店铺是否全选
+const isShopSelected = (shopId: string) => {
+	const group = cartGroups.value.find(g => g.shopId === shopId)
+	return group ? group.items.every(item => item.selected) : false
+}
+
 const toggleManageMode = () => {
 	isManageMode.value = !isManageMode.value
 }
@@ -289,48 +296,68 @@ onShow(() => {
 })
 
 // 加载数据
-const loadCartData = () => {
+const loadCartData = async () => {
 	loading.value = true
 	
-	// 从本地存储加载购物车数据
-	const cartData = uni.getStorageSync('cart')
-	if (cartData) {
-		try {
-			cartItems.value = JSON.parse(cartData as string) as any[]
-		} catch (e) {
-			console.error('解析购物车数据失败', e)
-			cartItems.value = []
-		}
-	} else {
-		// 如果本地没有数据，使用Mock数据（可选，或者直接为空）
-		// 为了演示效果，这里可以保留一部分Mock数据，或者初始化为空
-		// cartItems.value = [...mockCartItems]
-		cartItems.value = [] 
-	}
-	
-	setTimeout(() => {
-		// 模拟推荐商品加载
+	try {
+		// 从Supabase加载购物车数据
+		const supabaseCartItems = await supabaseService.getCartItems()
+		
+		// 转换数据格式以匹配前端界面
+		const transformedItems = supabaseCartItems.map((item: SupabaseCartItem) => ({
+			id: item.id,
+			shopId: item.shop_id || 'unknown_shop',
+			shopName: item.shop_name || '未知店铺',
+			name: item.product_name || '商品',
+			price: item.product_price || 0,
+			image: item.product_image || '/static/product1.jpg',
+			spec: item.product_specification || '默认规格',
+			quantity: item.quantity || 1,
+			selected: item.selected || false,
+			productId: item.product_id // 保留productId用于后续操作
+		}))
+		
+		cartItems.value = transformedItems
+		
+		// 加载推荐商品（暂时保持Mock数据）
 		recommendProducts.value = [...mockRecommendProducts]
+	} catch (error) {
+		console.error('加载购物车数据失败:', error)
+		// 如果API调用失败，尝试从本地存储加载
+		const cartData = uni.getStorageSync('cart')
+		if (cartData) {
+			try {
+				cartItems.value = JSON.parse(cartData as string) as any[]
+			} catch (e) {
+				console.error('解析购物车数据失败', e)
+				cartItems.value = []
+			}
+		}
+	} finally {
 		loading.value = false
-	}, 500)
+	}
 }
 
-// 监听购物车数据变化并保存到本地存储
-const saveCartData = () => {
-	uni.setStorageSync('cart', JSON.stringify(cartItems.value))
-}
-
-// 商品操作 - 增加保存逻辑
-const toggleSelect = (itemId: string) => {
+// 商品操作 - 更新选中状态到Supabase
+const toggleSelect = async (itemId: string) => {
 	const index = cartItems.value.findIndex(item => item.id === itemId)
 	if (index !== -1) {
-		cartItems.value[index].selected = !cartItems.value[index].selected
+		const newSelected = !cartItems.value[index].selected
+		cartItems.value[index].selected = newSelected
 		cartItems.value = [...cartItems.value] // 触发响应式更新
-		saveCartData()
+		
+		// 更新到Supabase
+		const success = await supabaseService.updateCartItemSelection(itemId, newSelected)
+		if (!success) {
+			console.error('更新选中状态失败')
+			// 恢复状态
+			cartItems.value[index].selected = !newSelected
+			cartItems.value = [...cartItems.value]
+		}
 	}
 }
 
-const toggleShopSelect = (shopId: string) => {
+const toggleShopSelect = async (shopId: string) => {
 	const group = cartGroups.value.find((g: any) => g.shopId === shopId)
 	if (!group) return
 	
@@ -338,56 +365,110 @@ const toggleShopSelect = (shopId: string) => {
 	const isAllShopSelected = (group.items as any[]).every((item: any) => item.selected)
 	const newState = !isAllShopSelected
 	
-	// 更新该店铺下所有商品的状态
-	cartItems.value.forEach(item => {
-		if (item.shopId === shopId) {
-			item.selected = newState
-		}
-	})
-	cartItems.value = [...cartItems.value]
-	saveCartData()
-}
-
-const toggleSelectAll = () => {
-	const newSelectedState = !allSelected.value
-	cartItems.value = cartItems.value.map(item => ({
-		...item,
-		selected: newSelectedState
-	}))
-	saveCartData()
-}
-
-const increaseQuantity = (itemId: string) => {
-	const index = cartItems.value.findIndex(item => item.id === itemId)
-	if (index !== -1) {
-		cartItems.value[index].quantity++
+	// 获取该店铺下所有商品的ID
+	const shopItemIds = cartItems.value
+		.filter(item => item.shopId === shopId)
+		.map(item => item.id)
+	
+	// 批量更新到Supabase
+	const success = await supabaseService.batchUpdateCartItemSelection(shopItemIds, newState)
+	
+	if (success) {
+		// 更新本地状态
+		cartItems.value.forEach(item => {
+			if (item.shopId === shopId) {
+				item.selected = newState
+			}
+		})
 		cartItems.value = [...cartItems.value]
-		saveCartData()
+	} else {
+		console.error('批量更新店铺商品选中状态失败')
+		uni.showToast({
+			title: '操作失败',
+			icon: 'none'
+		})
 	}
 }
 
-const decreaseQuantity = (itemId: string) => {
+const toggleSelectAll = async () => {
+	const newSelectedState = !allSelected.value
+	const selectedItems = cartItems.value.map(item => ({
+		...item,
+		selected: newSelectedState
+	}))
+	
+	// 更新到Supabase
+	const itemIds = cartItems.value.map(item => item.id)
+	const success = await supabaseService.batchUpdateCartItemSelection(itemIds, newSelectedState)
+	
+	if (success) {
+		cartItems.value = selectedItems
+	} else {
+		console.error('批量更新选中状态失败')
+		uni.showToast({
+			title: '操作失败',
+			icon: 'none'
+		})
+	}
+}
+
+const increaseQuantity = async (itemId: string) => {
+	const index = cartItems.value.findIndex(item => item.id === itemId)
+	if (index !== -1) {
+		const newQuantity = cartItems.value[index].quantity + 1
+		cartItems.value[index].quantity = newQuantity
+		cartItems.value = [...cartItems.value]
+		
+		// 更新到Supabase
+		const success = await supabaseService.updateCartItemQuantity(itemId, newQuantity)
+		if (!success) {
+			console.error('更新商品数量失败')
+			// 恢复状态
+			cartItems.value[index].quantity = newQuantity - 1
+			cartItems.value = [...cartItems.value]
+		}
+	}
+}
+
+const decreaseQuantity = async (itemId: string) => {
 	const index = cartItems.value.findIndex(item => item.id === itemId)
 	if (index !== -1) {
 		if (cartItems.value[index].quantity > 1) {
-			cartItems.value[index].quantity--
+			const newQuantity = cartItems.value[index].quantity - 1
+			cartItems.value[index].quantity = newQuantity
 			cartItems.value = [...cartItems.value]
-			saveCartData()
+			
+			// 更新到Supabase
+			const success = await supabaseService.updateCartItemQuantity(itemId, newQuantity)
+			if (!success) {
+				console.error('更新商品数量失败')
+				// 恢复状态
+				cartItems.value[index].quantity = newQuantity + 1
+				cartItems.value = [...cartItems.value]
+			}
 		} else {
 			// 数量为1时，询问是否删除
 			uni.showModal({
 				title: '提示',
 				content: '确定要从购物车移除该商品吗？',
-				success: (res) => {
+				success: async (res) => {
 					if (res.confirm) {
-						cartItems.value.splice(index, 1)
-						cartItems.value = [...cartItems.value]
-						saveCartData()
-						
-						uni.showToast({
-							title: '已移除',
-							icon: 'none'
-						})
+						// 从Supabase删除
+						const success = await supabaseService.deleteCartItem(itemId)
+						if (success) {
+							cartItems.value.splice(index, 1)
+							cartItems.value = [...cartItems.value]
+							uni.showToast({
+								title: '已移除',
+								icon: 'none'
+							})
+						} else {
+							console.error('删除商品失败')
+							uni.showToast({
+								title: '删除失败',
+								icon: 'none'
+							})
+						}
 					}
 				}
 			})
@@ -396,7 +477,7 @@ const decreaseQuantity = (itemId: string) => {
 }
 
 // 删除商品 - 增加保存逻辑
-const deleteSelectedItems = () => {
+const deleteSelectedItems = async () => {
 	if (selectedCount.value === 0) {
 		uni.showToast({
 			title: '请选择要删除的商品',
@@ -408,19 +489,35 @@ const deleteSelectedItems = () => {
 	uni.showModal({
 		title: '提示',
 		content: `确定要删除选中的 ${selectedCount.value} 件商品吗？`,
-		success: (res) => {
+		success: async (res) => {
 			if (res.confirm) {
-				cartItems.value = cartItems.value.filter(item => !item.selected)
-				saveCartData()
+				// 获取选中的商品ID
+				const selectedItemIds = cartItems.value
+					.filter(item => item.selected)
+					.map(item => item.id)
 				
-				// 如果购物车删空了，退出管理模式
-				if (cartItems.value.length === 0) {
-					isManageMode.value = false
+				// 批量删除到Supabase
+				const success = await supabaseService.batchDeleteCartItems(selectedItemIds)
+				
+				if (success) {
+					// 从本地列表移除
+					cartItems.value = cartItems.value.filter(item => !item.selected)
+					
+					// 如果购物车删空了，退出管理模式
+					if (cartItems.value.length === 0) {
+						isManageMode.value = false
+					}
+					uni.showToast({
+						title: '删除成功',
+						icon: 'success'
+					})
+				} else {
+					console.error('批量删除商品失败')
+					uni.showToast({
+						title: '删除失败',
+						icon: 'none'
+					})
 				}
-				uni.showToast({
-					title: '删除成功',
-					icon: 'success'
-				})
 			}
 		}
 	})
@@ -506,9 +603,6 @@ const goToCheckout = () => {
 		return
 	}
 	
-	// 确保最新状态已保存到本地存储
-	saveCartData()
-	
 	// 获取选中的商品 (直接过滤cartItems，不依赖cartGroups)
 	const selectedItems = cartItems.value
 		.filter(item => item.selected)
diff --git a/pages/mall/consumer/checkout copy 2.uvue b/pages/mall/consumer/checkout copy 2.uvue
new file mode 100644
index 00000000..3c744516
--- /dev/null
+++ b/pages/mall/consumer/checkout copy 2.uvue	
@@ -0,0 +1,1733 @@
+<!-- 结算页面 -->
+<template>
+	<view class="checkout-page">
+		<scroll-view class="checkout-content" scroll-y>
+			<!-- 收货地址 -->
+			<view class="address-section" @click="selectAddress">
+				<view v-if="selectedAddress" class="address-info">
+					<view class="address-header">
+						<text class="recipient">{{ selectedAddress.recipient_name }}</text>
+						<text class="phone">{{ selectedAddress.phone }}</text>
+						<view v-if="selectedAddress.is_default" class="default-tag">
+							<text class="tag-text">默认</text>
+						</view>
+					</view>
+					<text class="address-detail">{{ getFullAddress(selectedAddress) }}</text>
+				</view>
+				<view v-else class="no-address">
+					<text class="no-address-text">请选择收货地址</text>
+					<text class="no-address-arrow">›</text>
+				</view>
+			</view>
+
+			<!-- 商品列表 -->
+			<view class="products-section">
+				<!-- 调试信息 -->
+				<view v-if="checkoutItems.length > 0" class="debug-info">
+					<text class="debug-text">调试：共{{ checkoutItems.length }}件商品，总价计算：{{ totalAmount }}</text>
+				</view>
+				<view v-if="checkoutItems.length > 0">
+					<view v-for="item in checkoutItems" :key="item.id" class="product-item">
+						<image class="product-image" :src="item.product_image" />
+						<view class="product-info">
+							<text class="product-name">{{ item.product_name }}</text>
+							<text v-if="item.sku_specifications" class="product-spec">{{ getSpecText(item.sku_specifications) }}</text>
+							<view class="product-bottom">
+								<text class="product-price">¥{{ item.price }}</text>
+								<text class="product-quantity">×{{ item.quantity }}</text>
+							</view>
+						</view>
+					</view>
+				</view>
+				<view v-else class="no-products">
+					<text class="no-products-text">暂无商品信息</text>
+				</view>
+			</view>
+
+			<!-- 配送方式 -->
+			<view class="delivery-section">
+				<text class="section-title">配送方式</text>
+				<view class="delivery-options">
+					<view v-for="option in deliveryOptions" 
+								:key="option.id" 
+								:class="['delivery-option', { selected: selectedDelivery === option.id }]"
+								@click="selectDelivery(option)">
+						<text class="option-name">{{ option.name }}</text>
+						<text class="option-price">¥{{ option.price }}</text>
+						<text v-if="selectedDelivery === option.id" class="option-selected">✓</text>
+					</view>
+				</view>
+			</view>
+
+			<!-- 优惠券 -->
+			<view class="coupon-section" @click="selectCoupon">
+				<text class="section-title">优惠券</text>
+				<view class="coupon-info">
+					<text v-if="selectedCoupon" class="coupon-selected">{{ selectedCoupon.template?.name || '优惠券' }}</text>
+					<text v-else class="coupon-placeholder">选择优惠券</text>
+					<text class="coupon-arrow">›</text>
+				</view>
+			</view>
+
+			<!-- 买家留言 -->
+			<view class="remark-section">
+				<text class="section-title">买家留言</text>
+				<textarea class="remark-input" 
+									v-model="remark" 
+									placeholder="选填，请先和商家协商一致"
+									maxlength="100" />
+			</view>
+
+			<!-- 价格明细 -->
+			<view class="price-section">
+				<text class="section-title">价格明细</text>
+				<view class="price-detail">
+					<view class="price-row">
+						<text class="price-label">商品总价</text>
+						<text class="price-value">¥{{ totalAmount.toFixed(2) }}</text>
+					</view>
+					<view class="price-row">
+						<text class="price-label">运费</text>
+						<text class="price-value">+¥{{ deliveryFee.toFixed(2) }}</text>
+					</view>
+					<view v-if="discountAmount > 0" class="price-row">
+						<text class="price-label">优惠减免</text>
+						<text class="price-value discount">-¥{{ discountAmount.toFixed(2) }}</text>
+					</view>
+					<view class="price-row total">
+						<text class="price-label">应付金额</text>
+						<text class="price-value total-price">¥{{ actualAmount.toFixed(2) }}</text>
+					</view>
+				</view>
+			</view>
+		</scroll-view>
+
+		<!-- 底部结算栏 -->
+		<view class="bottom-bar">
+			<view class="price-summary">
+				<text class="summary-label">合计:</text>
+				<text class="summary-price">¥{{ actualAmount.toFixed(2) }}</text>
+			</view>
+			<button class="submit-btn" @click="submitOrder">提交订单</button>
+		</view>
+
+		<!-- 地址选择弹窗 -->
+		<view v-if="showAddressPopup" class="address-popup-mask" @click="showAddressPopup = false">
+			<view class="address-popup" @click.stop>
+				<view class="popup-header">
+					<text class="popup-title">选择收货地址</text>
+					<text class="popup-close" @click="showAddressPopup = false">×</text>
+				</view>
+				
+				<scroll-view class="address-list-container" scroll-y>
+					<!-- 地址列表 -->
+					<view v-if="addressList.length > 0">
+						<view v-for="address in addressList" :key="address.id" 
+									class="popup-address-item" @click="handleSelectAddress(address)">
+							<view class="popup-address-header">
+								<text class="popup-address-name">{{ address.recipient_name }}</text>
+								<text class="popup-address-phone">{{ address.phone }}</text>
+								<view v-if="address.is_default" class="popup-default-tag">
+									<text class="popup-tag-text">默认</text>
+								</view>
+							</view>
+							<text class="popup-address-detail">{{ getFullAddress(address) }}</text>
+							<view v-if="selectedAddress && selectedAddress.id === address.id" class="popup-selected-indicator">
+								<text>✓</text>
+							</view>
+						</view>
+					</view>
+					
+					<!-- 空状态 -->
+					<view v-else class="popup-empty-address">
+						<text class="popup-empty-icon">📍</text>
+						<text class="popup-empty-text">暂无收货地址</text>
+					</view>
+				</scroll-view>
+				
+				<!-- 新建地址按钮 -->
+				<view class="popup-add-address-btn" @click="handleAddNewAddress">
+					<text class="popup-btn-icon">+</text>
+					<text class="popup-btn-text">新建收货地址</text>
+				</view>
+			</view>
+		</view>
+
+		<!-- 新建地址表单弹窗 -->
+		<view v-if="showNewAddressForm" class="address-form-mask" @click="cancelNewAddress">
+			<view class="address-form-popup" @click.stop>
+				<view class="form-header">
+					<text class="form-title">新建收货地址</text>
+					<text class="form-close" @click="cancelNewAddress">×</text>
+				</view>
+				
+				<scroll-view class="form-content" scroll-y>
+					<view class="form-item">
+						<text class="form-label">收货人</text>
+						<input class="form-input" v-model="newAddress.recipient_name" 
+									 placeholder="请输入收货人姓名" />
+					</view>
+					
+					<view class="form-item">
+						<text class="form-label">手机号</text>
+						<input class="form-input" v-model="newAddress.phone" 
+									 placeholder="请输入手机号码" type="number" />
+					</view>
+					
+					<view class="form-item">
+					<text class="form-label">智能填写地址</text>
+					<textarea class="form-textarea smart-address-input" 
+										v-model="smartAddressInput" 
+										placeholder="粘贴如：北京市朝阳区三里屯SOHO A座 张三 13800138000"
+										@input="parseSmartAddress"
+										maxlength="200" />
+					<text class="smart-tip">自动识别：地址+姓名+电话（支持粘贴文本）</text>
+				</view>
+					
+					<view class="form-item">
+						<text class="form-label">所在地区</text>
+						<view class="region-inputs">
+							<input class="form-input region-input" v-model="newAddress.province" 
+										 placeholder="省" readonly />
+							<input class="form-input region-input" v-model="newAddress.city" 
+										 placeholder="市" readonly />
+							<input class="form-input region-input" v-model="newAddress.district" 
+										 placeholder="区/县" readonly />
+						</view>
+					</view>
+					
+					<view class="form-item">
+						<text class="form-label">详细地址</text>
+						<textarea class="form-textarea" v-model="newAddress.detail" 
+											placeholder="街道、小区、楼栋、门牌号等" 
+											maxlength="100" />
+					</view>
+					
+					<view class="form-item checkbox-item">
+						<view class="checkbox-wrapper" @click="newAddress.is_default = !newAddress.is_default">
+							<view :class="['checkbox', { checked: newAddress.is_default }]">
+								<text v-if="newAddress.is_default" class="checkbox-check">✓</text>
+							</view>
+							<text class="checkbox-label">设为默认地址</text>
+						</view>
+					</view>
+				</scroll-view>
+				
+				<view class="form-buttons">
+					<button class="form-cancel-btn" @click="cancelNewAddress">取消</button>
+					<button class="form-submit-btn" @click="saveNewAddress">保存</button>
+				</view>
+			</view>
+		</view>
+		<!-- 确认保存弹窗 -->
+		<view v-if="showSaveConfirm" class="confirm-popup-mask">
+			<view class="confirm-popup">
+				<view class="confirm-header">
+					<text class="confirm-title">保存地址</text>
+				</view>
+				<view class="confirm-content">
+					<text class="confirm-message">是否保存该地址用于下次使用？</text>
+				</view>
+				<view class="confirm-buttons">
+					<button class="confirm-btn cancel" @click="handleSaveConfirm(false)">仅本次</button>
+					<button class="confirm-btn confirm" @click="handleSaveConfirm(true)">保存</button>
+				</view>
+			</view>
+		</view>
+
+	</view>
+</template>
+
+<script setup lang="uts">
+import { ref, onMounted, computed, watch, onUnmounted, getCurrentInstance } from 'vue'
+import { onLoad } from '@dcloudio/uni-app'
+
+type CheckoutItemType = {
+	id: string
+	product_id: string
+	sku_id: string
+	product_name: string
+	product_image: string
+	sku_specifications: any
+	price: number
+	quantity: number
+}
+
+type DeliveryOptionType = {
+	id: string
+	name: string
+	price: number
+	description: string
+}
+
+type UserCouponType = {
+	id: string
+	template: {
+		name: string
+		discount_value: number
+		min_order_amount: number
+	} | null
+}
+
+const checkoutItems = ref<Array<CheckoutItemType>>([])
+const selectedAddress = ref<any>(null)
+const deliveryOptions = ref<Array<DeliveryOptionType>>([
+	{ id: 'standard', name: '快递配送', price: 8.00, description: '1-3天送达' },
+	{ id: 'express', name: '加急配送', price: 15.00, description: '当天送达' }
+])
+const selectedDelivery = ref<string>('standard')
+const selectedCoupon = ref<UserCouponType | null>(null)
+const remark = ref<string>('')
+const showAddressPopup = ref<boolean>(false)
+const addressList = ref<Array<any>>([])
+const newAddress = ref<any>({
+	recipient_name: '',
+	phone: '',
+	province: '',
+	city: '',
+	district: '',
+	detail: '',
+	is_default: false
+})
+const showNewAddressForm = ref<boolean>(false)
+const showSaveConfirm = ref<boolean>(false)
+const smartAddressInput = ref<string>('')
+
+// 计算属性 - 修复价格同步问题
+const totalAmount = computed(() => {
+	console.log('计算商品总价，checkoutItems:', checkoutItems.value)
+	if (!checkoutItems.value || checkoutItems.value.length === 0) {
+		console.log('商品列表为空，返回0')
+		return 0
+	}
+	
+	// 确保每个商品的价格和数量都是数字类型，并计算总和
+	const total = checkoutItems.value.reduce((sum, item) => {
+		// 确保item存在且包含必要的属性
+		if (!item) return sum
+		
+		// 将价格转换为数字（确保是数字类型）
+		let price = 0
+		if (item.price !== undefined && item.price !== null) {
+			price = typeof item.price === 'string' ? parseFloat(item.price) : Number(item.price)
+		}
+		
+		// 将数量转换为数字
+		let quantity = 0
+		if (item.quantity !== undefined && item.quantity !== null) {
+			quantity = typeof item.quantity === 'string' ? parseInt(item.quantity) : Number(item.quantity)
+		}
+		
+		// 验证转换后的数字是否有效
+		if (isNaN(price) || isNaN(quantity) || price <= 0 || quantity <= 0) {
+			console.warn('商品价格或数量无效:', item, 'price:', price, 'quantity:', quantity)
+			return sum
+		}
+		
+		const itemTotal = price * quantity
+		console.log(`商品 ${item.product_name}，单价: ${price}，数量: ${quantity}，小计: ${itemTotal}`)
+		return sum + itemTotal
+	}, 0)
+	
+	console.log('商品总价计算结果:', total)
+	return total
+})
+
+const deliveryFee = computed(() => {
+	const option = deliveryOptions.value.find(opt => opt.id === selectedDelivery.value)
+	return option?.price || 0
+})
+
+const discountAmount = computed(() => {
+	if (!selectedCoupon.value || !selectedCoupon.value.template) return 0
+	
+	const coupon = selectedCoupon.value.template
+	// 确保使用计算后的商品总价进行比较
+	if (totalAmount.value < coupon.min_order_amount) return 0
+	
+	// 简单处理：假设都是满减券
+	return coupon.discount_value
+})
+
+const actualAmount = computed(() => {
+	// 确保所有值都是数字类型
+	const total = typeof totalAmount.value === 'number' ? totalAmount.value : 0
+	const delivery = typeof deliveryFee.value === 'number' ? deliveryFee.value : 0
+	const discount = typeof discountAmount.value === 'number' ? discountAmount.value : 0
+	
+	// 正确计算：商品总价 + 运费 - 优惠减免
+	let amount = total + delivery - discount
+	
+	// 金额必须大于等于0
+	return amount > 0 ? amount : 0
+})
+
+// 监听checkoutItems变化 - 调试用
+watch(checkoutItems, (newItems) => {
+	console.log('checkoutItems变化了:', newItems)
+	console.log('商品总价计算:', totalAmount.value)
+}, { deep: true })
+
+// 页面加载时监听eventChannel
+onLoad(() => {
+	// 优先检查Storage中是否有"立即购买"的数据
+	const checkoutType = uni.getStorageSync('checkout_type')
+	if (checkoutType === 'buy_now') {
+		console.log('检测到立即购买模式，从Storage加载数据')
+		const itemsStr = uni.getStorageSync('checkout_items')
+		if (itemsStr) {
+			try {
+				const items = JSON.parse(itemsStr as string)
+				console.log('从Storage加载的商品数据:', items)
+				processCheckoutItems(items)
+				
+				// 清除Storage，避免污染下次进入（刷新页面时可能需要保留？暂时不清除，或者在离开页面时清除）
+				// uni.removeStorageSync('checkout_type')
+				// uni.removeStorageSync('checkout_items')
+				loadDefaultAddress()
+				return // 成功加载，直接返回
+			} catch (e) {
+				console.error('解析立即购买数据失败', e)
+			}
+		}
+	}
+
+	// 从上一页获取数据
+	const eventChannel = uni.getEventChannel ? uni.getEventChannel() : null
+	
+	// 默认先尝试从本地存储加载（确保有数据）
+	loadFromLocalStorage()
+	
+	if (eventChannel) {
+		eventChannel.on('acceptData', (data: any) => {
+			console.log('接收到商品数据:', data)
+			let items = data.selectedItems || []
+			if (items.length > 0) {
+				processCheckoutItems(items)
+			}
+			loadDefaultAddress()
+		})
+	}
+})
+
+// 处理商品数据清洗
+const processCheckoutItems = (items: any[]) => {
+		// 数据清洗：确保价格和数量是数字类型
+	if (items && items.length > 0) {
+		items = items.map((item: any) => {
+			// 确保价格是数字
+			let price = 0
+			if (item.price !== undefined && item.price !== null) {
+				price = typeof item.price === 'string' ? parseFloat(item.price) : Number(item.price)
+				if (isNaN(price)) price = 0
+			}
+			
+			// 确保数量是数字
+			let quantity = 1
+			if (item.quantity !== undefined && item.quantity !== null) {
+				quantity = typeof item.quantity === 'string' ? parseInt(item.quantity) : Number(item.quantity)
+				if (isNaN(quantity) || quantity < 1) quantity = 1
+			}
+			
+			return {
+				id: item.id,
+				product_id: item.product_id || item.id,
+				sku_id: item.sku_id || item.id,
+				product_name: item.product_name || item.name || '',
+				product_image: item.product_image || item.image || '',
+				sku_specifications: item.sku_specifications || item.spec || {},
+				price: Number(price.toFixed(2)),
+				quantity: quantity
+			}
+		})
+	}
+	checkoutItems.value = items
+	// 调试：打印每个商品的价格
+	if (checkoutItems.value && checkoutItems.value.length > 0) {
+		console.log('清洗后商品价格明细：')
+		checkoutItems.value.forEach((item: any, index: number) => {
+			console.log(`商品${index}:`, item.product_name, '价格:', item.price, '类型:', typeof item.price, '数量:', item.quantity)
+		})
+	}
+}
+
+// 生命周期
+onMounted(() => {
+	// 监听地址更新事件
+	uni.$on('addressUpdated', (updatedAddressList: any) => {
+		addressList.value = updatedAddressList
+		
+		// 如果当前没有选中地址，尝试选择默认地址
+		if (!selectedAddress.value && addressList.value.length > 0) {
+			const defaultAddress = addressList.value.find(addr => addr.is_default)
+			if (defaultAddress) {
+				selectedAddress.value = defaultAddress
+			}
+		}
+	})
+})
+
+// 组件卸载时移除事件监听
+onUnmounted(() => {
+	uni.$off('addressUpdated')
+    // 离开页面时清除结算数据，防止下次进入时显示旧数据
+    uni.removeStorageSync('checkout_type')
+    uni.removeStorageSync('checkout_items')
+})
+
+// 从本地存储加载结算数据（例如从购物车进入）
+const loadFromLocalStorage = () => {
+	// 尝试从本地存储获取购物车选中的商品
+	const cartData = uni.getStorageSync('cart')
+	if (cartData) {
+		try {
+			const cartItems = JSON.parse(cartData as string) as any[]
+			// 筛选选中的商品
+			const selectedCartItems = cartItems.filter(item => item.selected === true)
+			if (selectedCartItems.length > 0) {
+				// 转换为CheckoutItemType格式
+				const convertedItems: CheckoutItemType[] = selectedCartItems.map(item => {
+					// 确保价格和数量是数字
+					let price = typeof item.price === 'string' ? parseFloat(item.price) : Number(item.price)
+					if (isNaN(price)) price = 0
+					
+					let quantity = typeof item.quantity === 'string' ? parseInt(item.quantity) : Number(item.quantity)
+					if (isNaN(quantity) || quantity < 1) quantity = 1
+					
+					return {
+						id: item.id,
+						product_id: item.product_id || item.productId || item.id,
+						sku_id: item.sku_id || item.id,
+						product_name: item.name || '',
+						product_image: item.image || '',
+						sku_specifications: item.spec ? { spec: item.spec } : {},
+						price: price,
+						quantity: quantity
+					}
+				})
+				// 再次经过process处理确保类型正确
+				processCheckoutItems(convertedItems)
+			}
+		} catch (e) {
+			console.error('解析购物车数据失败:', e)
+		}
+	}
+	loadDefaultAddress()
+}
+
+// 加载结算数据（兼容旧版本，现在主要在onLoad中处理）
+const loadCheckoutData = () => {
+	// 为了兼容性保留，但主要逻辑已在onLoad中实现
+	loadFromLocalStorage()
+}
+
+// 加载默认地址
+const loadDefaultAddress = async () => {
+	// 从本地存储加载地址数据
+	const storedAddresses = uni.getStorageSync('addresses')
+	if (storedAddresses) {
+		try {
+			const addresses = JSON.parse(storedAddresses as string) as any[]
+			if (addresses && addresses.length > 0) {
+				// 查找默认地址
+				const defaultAddress = addresses.find((addr: any) => addr.isDefault === true)
+				if (defaultAddress) {
+					// 转换地址格式以匹配selectedAddress的结构
+					selectedAddress.value = {
+						id: defaultAddress.id,
+						recipient_name: defaultAddress.name,
+						phone: defaultAddress.phone,
+						province: defaultAddress.province,
+						city: defaultAddress.city,
+						district: defaultAddress.district,
+						detail: defaultAddress.detail,
+						is_default: defaultAddress.isDefault
+					}
+				} else {
+					// 如果没有默认地址，使用第一个地址
+					const firstAddress = addresses[0]
+					selectedAddress.value = {
+						id: firstAddress.id,
+						recipient_name: firstAddress.name,
+						phone: firstAddress.phone,
+						province: firstAddress.province,
+						city: firstAddress.city,
+						district: firstAddress.district,
+						detail: firstAddress.detail,
+						is_default: firstAddress.isDefault
+					}
+				}
+			}
+		} catch (err) {
+			console.error('解析地址数据失败:', err)
+		}
+	} else {
+        // 如果没有地址数据，尝试使用Mock数据初始化（为了演示效果）
+        const mockAddress = {
+            id: 'addr_mock_default',
+            name: '测试用户',
+            phone: '13800138000',
+            province: '北京市',
+            city: '北京市',
+            district: '朝阳区',
+            detail: '三里屯SOHO A座',
+            isDefault: true
+        }
+        uni.setStorageSync('addresses', JSON.stringify([mockAddress]))
+        selectedAddress.value = {
+            id: mockAddress.id,
+            recipient_name: mockAddress.name,
+            phone: mockAddress.phone,
+            province: mockAddress.province,
+            city: mockAddress.city,
+            district: mockAddress.district,
+            detail: mockAddress.detail,
+            is_default: mockAddress.isDefault
+        }
+    }
+}
+
+// 获取当前用户ID
+const getCurrentUserId = (): string => {
+	const userStore = uni.getStorageSync('userInfo')
+	return userStore?.id || ''
+}
+
+// 获取完整地址
+const getFullAddress = (address: any): string => {
+	return `${address.province}${address.city}${address.district}${address.detail}`
+}
+
+// 加载地址列表
+const loadAddressList = async () => {
+	// 从本地存储加载地址数据
+	const storedAddresses = uni.getStorageSync('addresses')
+	if (storedAddresses) {
+		try {
+			const addresses = JSON.parse(storedAddresses as string) as any[]
+			if (addresses && addresses.length > 0) {
+				// 转换地址格式以匹配addressList的结构
+				addressList.value = addresses.map((addr: any) => ({
+					id: addr.id,
+					recipient_name: addr.name,
+					phone: addr.phone,
+					province: addr.province,
+					city: addr.city,
+					district: addr.district,
+					detail: addr.detail,
+					is_default: addr.isDefault
+				}))
+			} else {
+				addressList.value = []
+			}
+		} catch (err) {
+			console.error('解析地址数据失败:', err)
+			addressList.value = []
+		}
+	} else {
+		addressList.value = []
+	}
+}
+
+// 选择地址
+const handleSelectAddress = (address: any) => {
+	selectedAddress.value = address
+	showAddressPopup.value = false
+}
+
+// 新建地址
+const handleAddNewAddress = () => {
+	showNewAddressForm.value = true
+}
+
+// 保存新地址
+const saveNewAddress = async () => {
+	// 验证表单
+	if (!newAddress.value.recipient_name || !newAddress.value.phone || !newAddress.value.detail) {
+		uni.showToast({
+			title: '请填写完整信息',
+			icon: 'none'
+		})
+		return
+	}
+
+	const userId = getCurrentUserId()
+	// if (!userId) return // 允许未登录用户保存地址用于演示
+
+	// 触发保存确认弹窗
+	showSaveConfirm.value = true
+}
+
+// 处理保存确认
+const handleSaveConfirm = async (save: boolean) => {
+	showSaveConfirm.value = false
+	
+	const newAddressData = {
+		id: `addr_${Date.now()}`,
+		name: newAddress.value.recipient_name,
+		phone: newAddress.value.phone,
+		province: newAddress.value.province,
+		city: newAddress.value.city,
+		district: newAddress.value.district,
+		detail: newAddress.value.detail,
+		isDefault: newAddress.value.is_default,
+		label: '' 
+	}
+		
+		if (save) {
+			// 从本地存储加载现有地址
+			const storedAddresses = uni.getStorageSync('addresses')
+			let addresses: any[] = []
+			if (storedAddresses) {
+				try {
+					addresses = JSON.parse(storedAddresses as string) as any[]
+				} catch (e) {
+					console.error('解析地址数据失败:', e)
+					addresses = []
+				}
+			}
+			
+			// 如果是默认地址，取消其他默认地址
+			if (newAddressData.isDefault) {
+				addresses.forEach(addr => {
+					addr.isDefault = false
+				})
+			}
+			
+			// 如果是第一个地址且未设置默认，则自动设为默认
+			if (addresses.length === 0 && !newAddressData.isDefault) {
+				newAddressData.isDefault = true
+			}
+			
+			// 添加到地址列表
+			addresses.unshift(newAddressData)
+			
+			// 保存到本地存储
+			uni.setStorageSync('addresses', JSON.stringify(addresses))
+			
+			// 发布地址更新事件，让address-list页面也能获取到
+			uni.$emit('addressUpdated', addresses.map((addr) => ({
+				id: addr.id,
+				recipient_name: addr.name,
+				phone: addr.phone,
+				province: addr.province,
+				city: addr.city,
+				district: addr.district,
+				detail: addr.detail,
+				is_default: addr.isDefault
+			})))
+		}
+		
+		// 转换为checkout页面格式并添加到当前地址列表
+		const checkoutFormatAddress = {
+			id: newAddressData.id,
+			recipient_name: newAddressData.name,
+			phone: newAddressData.phone,
+			province: newAddressData.province,
+			city: newAddressData.city,
+			district: newAddressData.district,
+			detail: newAddressData.detail,
+			is_default: newAddressData.isDefault
+		}
+		
+		// 如果是默认地址，取消其他默认地址
+		if (checkoutFormatAddress.is_default) {
+			addressList.value.forEach(addr => {
+				addr.is_default = false
+			})
+		}
+		
+		// 添加到当前地址列表
+		addressList.value.unshift(checkoutFormatAddress)
+		
+		// 如果选择了保存，address-list 已通过事件收到更新；未保存则不影响地址簿
+		
+		// 如果保存的是默认地址，或者当前没有选中地址，则选中这个新地址
+		if (checkoutFormatAddress.is_default || !selectedAddress.value) {
+			selectedAddress.value = checkoutFormatAddress
+		}
+		
+		// 重置表单
+		newAddress.value = {
+			recipient_name: '',
+			phone: '',
+			province: '',
+			city: '',
+			district: '',
+			detail: '',
+			is_default: false
+		}
+		smartAddressInput.value = ''
+		
+		showNewAddressForm.value = false
+		
+		uni.showToast({
+			title: '地址保存成功',
+			icon: 'success'
+		})
+}
+
+// 解析智能地址
+const parseSmartAddress = () => {
+	const input = smartAddressInput.value.trim()
+	if (!input) return
+	
+	// 重置表单
+	newAddress.value.recipient_name = ''
+	newAddress.value.phone = ''
+	newAddress.value.province = ''
+	newAddress.value.city = ''
+	newAddress.value.district = ''
+	newAddress.value.detail = ''
+	
+	// 尝试匹配手机号码（11位数字）
+	const phoneRegex = /(1[3-9]\d{9})/g
+	const phoneMatches = input.match(phoneRegex)
+	if (phoneMatches && phoneMatches.length > 0) {
+		newAddress.value.phone = phoneMatches[0]
+	}
+	
+	// 尝试匹配收件人姓名（中文姓名，2-4个汉字）
+	const nameRegex = /([\u4e00-\u9fa5]{2,4})/g
+	const nameMatches = input.match(nameRegex)
+	if (nameMatches && nameMatches.length > 0) {
+		// 取第一个匹配的中文姓名作为收件人
+		newAddress.value.recipient_name = nameMatches[0]
+	}
+	
+	// 提取地址部分（移除姓名和手机号）
+	let addressText = input
+	if (newAddress.value.recipient_name) {
+		addressText = addressText.replace(newAddress.value.recipient_name, '')
+	}
+	if (newAddress.value.phone) {
+		addressText = addressText.replace(newAddress.value.phone, '')
+	}
+	
+	// 清理地址文本（移除多余的空格和标点）
+	addressText = addressText.replace(/[，,;；\s]+/g, ' ').trim()
+	
+	// 地址解析逻辑
+	const patterns = [
+		// 匹配格式：省市区详细地址
+		/^(.*?省)?(.*?市)?(.*?[区县])?(.*)$/,
+		// 匹配格式：省市详细地址
+		/^(.*?省)?(.*?市)?(.*)$/
+	]
+	
+	for (const pattern of patterns) {
+		const match = addressText.match(pattern)
+		if (match) {
+			const [, province, city, district, detail] = match
+			
+			if (province) newAddress.value.province = province.replace('省', '').trim()
+			if (city) newAddress.value.city = city.replace('市', '').trim()
+			if (district) newAddress.value.district = district.trim()
+			if (detail) newAddress.value.detail = detail.trim()
+			
+			// 如果详细地址为空，但还有剩余内容，则作为详细地址
+			if (!newAddress.value.detail && district && detail) {
+				newAddress.value.detail = detail.trim()
+			}
+			
+			break
+		}
+	}
+	
+	// 如果没有匹配到模式，尝试简单分割
+	if (!newAddress.value.province && !newAddress.value.city && !newAddress.value.district) {
+		// 尝试按常见分隔符分割
+		const parts = addressText.split(/[省市县区]/)
+		if (parts.length >= 2) {
+			newAddress.value.province = parts[0] || ''
+			newAddress.value.city = parts[1] || ''
+			newAddress.value.detail = parts.slice(2).join('').trim() || addressText
+		} else {
+			newAddress.value.detail = addressText
+		}
+	}
+	
+	// 如果地址部分为空，但还有剩余文本，则作为详细地址
+	if (!newAddress.value.detail && addressText.trim()) {
+		newAddress.value.detail = addressText.trim()
+	}
+}
+
+// 取消新建地址
+const cancelNewAddress = () => {
+	showNewAddressForm.value = false
+	newAddress.value = {
+		recipient_name: '',
+		phone: '',
+		province: '',
+		city: '',
+		district: '',
+		detail: '',
+		is_default: false
+	}
+	smartAddressInput.value = ''
+}
+
+// 获取规格文本
+const getSpecText = (specs: any): string => {
+	if (!specs) return ''
+	if (typeof specs === 'object') {
+		return Object.keys(specs)
+			.map(key => `${key}: ${specs[key]}`)
+			.join('; ')
+	}
+	return String(specs)
+}
+
+// 选择地址
+const selectAddress = () => {
+	showAddressPopup.value = true
+	loadAddressList()
+}
+
+// 选择配送方式
+const selectDelivery = (option: DeliveryOptionType) => {
+	selectedDelivery.value = option.id
+}
+
+// 选择优惠券
+const selectCoupon = () => {
+	uni.navigateTo({
+		url: '/pages/mall/consumer/coupons',
+		success: (res) => {
+			res.eventChannel.emit('setSelectMode', { selectMode: true })
+		}
+	})
+	
+	// 监听优惠券选择
+	uni.$on('couponSelected', (coupon: any) => {
+		selectedCoupon.value = coupon
+		uni.$off('couponSelected')
+	})
+}
+
+// 提交订单
+const submitOrder = async () => {
+	if (!selectedAddress.value) {
+		uni.showToast({
+			title: '请选择收货地址',
+			icon: 'none'
+		})
+		return
+	}
+
+    // MOCK ORDER SUBMISSION
+    // 模拟创建成功
+    try {
+        const mockOrderId = `order_${Date.now()}`
+        
+        // 创建订单对象
+        const newOrder = {
+            id: mockOrderId,
+            order_no: generateOrderNo(),
+            user_id: getCurrentUserId() || 'user_001',
+            merchant_id: checkoutItems.value[0]?.product_id || 'merchant_001', // 简化处理，取第一个商品的merchant
+            status: 1, // 待支付
+            total_amount: totalAmount.value,
+            discount_amount: discountAmount.value,
+            delivery_fee: deliveryFee.value,
+            actual_amount: actualAmount.value,
+            payment_method: 0,
+            payment_status: 0,
+            delivery_address: selectedAddress.value,
+            items: checkoutItems.value,
+            created_at: new Date().toISOString()
+        }
+
+        // 保存到本地存储
+        const storedOrders = uni.getStorageSync('orders')
+        let orders: any[] = []
+        if (storedOrders) {
+            try {
+                orders = JSON.parse(storedOrders as string) as any[]
+            } catch (e) {
+                console.error('解析订单数据失败', e)
+            }
+        }
+        orders.unshift(newOrder)
+        uni.setStorageSync('orders', JSON.stringify(orders))
+
+        uni.showLoading({ title: '提交中...' })
+        await new Promise(resolve => setTimeout(resolve, 500))
+        uni.hideLoading()
+        
+        // 携带价格详情跳转
+        uni.navigateTo({
+			url: `/pages/mall/consumer/payment?orderId=${mockOrderId}&amount=${actualAmount.value}&productAmount=${totalAmount.value}&deliveryFee=${deliveryFee.value}&discountAmount=${discountAmount.value}`
+		})
+    } catch (err) {
+		console.error('创建订单失败:', err)
+		uni.showToast({
+			title: '订单创建失败',
+			icon: 'none'
+		})
+	}
+}
+
+// 生成订单号
+const generateOrderNo = (): string => {
+	const date = new Date()
+	const year = date.getFullYear()
+	const month = (date.getMonth() + 1).toString().padStart(2, '0')
+	const day = date.getDate().toString().padStart(2, '0')
+	const random = Math.random().toString().slice(2, 8)
+	return `ORD${year}${month}${day}${random}`
+}
+
+// 清空购物车
+const clearShoppingCart = async () => {
+	const userId = getCurrentUserId()
+	if (!userId) return
+
+	const productIds = checkoutItems.value.map(item => item.product_id)
+	
+	try {
+		/* const { error } = await supa
+			.from('shopping_cart')
+			.delete()
+			.eq('user_id', userId)
+			.in('product_id', productIds)
+
+		if (error !== null) {
+			console.error('清空购物车失败:', error)
+		} */
+	} catch (err) {
+		console.error('清空购物车异常:', err)
+	}
+}
+
+// 返回
+const goBack = () => {
+	uni.navigateBack()
+}
+</script>
+
+<style scoped>
+.checkout-page {
+	display: flex;
+	flex-direction: column;
+	height: 100vh;
+	background-color: #f5f5f5;
+}
+
+/* 删除未使用的顶部栏样式 */
+.checkout-header {
+	background-color: #ffffff;
+	padding: 15px;
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	border-bottom: 1px solid #e5e5e5;
+}
+
+.header-title {
+	font-size: 18px;
+	font-weight: bold;
+	color: #333333;
+}
+
+.checkout-content {
+	flex: 1;
+}
+
+.address-section {
+	background-color: #ffffff;
+	margin-bottom: 10px;
+	padding: 20px 15px;
+	display: flex;
+	align-items: center;
+}
+
+.address-info {
+	flex: 1;
+}
+
+.address-header {
+	display: flex;
+	align-items: center;
+	margin-bottom: 10px;
+}
+
+.recipient {
+	font-size: 16px;
+	font-weight: bold;
+	color: #333333;
+	margin-right: 15px;
+}
+
+.phone {
+	font-size: 14px;
+	color: #666666;
+	margin-right: 10px;
+}
+
+.default-tag {
+	background-color: #ff4757;
+	padding: 2px 8px;
+	border-radius: 10px;
+}
+
+.tag-text {
+	color: #ffffff;
+	font-size: 12px;
+}
+
+.address-detail {
+	font-size: 14px;
+	color: #333333;
+	line-height: 1.4;
+}
+
+.no-address {
+	flex: 1;
+	display: flex;
+	justify-content: space-between;
+	align-items: center;
+}
+
+.no-address-text {
+	font-size: 16px;
+	color: #999999;
+}
+
+.no-address-arrow {
+	color: #999999;
+	font-size: 18px;
+}
+
+.products-section {
+	background-color: #ffffff;
+	margin-bottom: 10px;
+	padding: 0 15px;
+}
+
+.debug-info {
+	background-color: #f8f9fa;
+	padding: 10px 15px;
+	border-bottom: 1px solid #e5e5e5;
+	margin-bottom: 10px;
+}
+
+.debug-text {
+	font-size: 12px;
+	color: #666;
+	display: block;
+	text-align: center;
+}
+
+.product-item {
+	display: flex;
+	padding: 15px 0;
+	border-bottom: 1px solid #f5f5f5;
+}
+
+.product-item:last-child {
+	border-bottom: none;
+}
+
+.product-image {
+	width: 80px;
+	height: 80px;
+	border-radius: 5px;
+	margin-right: 15px;
+}
+
+.product-info {
+	flex: 1;
+	display: flex;
+	flex-direction: column;
+	justify-content: space-between;
+}
+
+.product-name {
+	font-size: 14px;
+	color: #333333;
+	line-height: 1.4;
+	margin-bottom: 5px;
+	display: -webkit-box;
+	-webkit-box-orient: vertical;
+	-webkit-line-clamp: 2;
+	overflow: hidden;
+}
+
+.product-spec {
+	font-size: 12px;
+	color: #999999;
+	margin-bottom: 10px;
+}
+
+.product-bottom {
+	display: flex;
+	justify-content: space-between;
+	align-items: center;
+}
+
+.product-price {
+	font-size: 16px;
+	color: #ff4757;
+	font-weight: bold;
+}
+
+.product-quantity {
+	font-size: 14px;
+	color: #666666;
+}
+
+.delivery-section,
+.coupon-section,
+.remark-section,
+.price-section {
+	background-color: #ffffff;
+	margin-bottom: 10px;
+	padding: 15px;
+}
+
+.section-title {
+	font-size: 16px;
+	font-weight: bold;
+	color: #333333;
+	margin-bottom: 15px;
+}
+
+.delivery-options {
+	display: flex;
+	flex-direction: column;
+	gap: 10px;
+}
+
+.delivery-option {
+	display: flex;
+	align-items: center;
+	justify-content: space-between;
+	padding: 15px;
+	border: 1px solid #e5e5e5;
+	border-radius: 8px;
+}
+
+.delivery-option.selected {
+	border-color: #007aff;
+	background-color: #f0f8ff;
+}
+
+.option-name {
+	font-size: 14px;
+	color: #333333;
+}
+
+.option-price {
+	font-size: 14px;
+	color: #ff4757;
+	font-weight: bold;
+}
+
+.option-selected {
+	color: #007aff;
+	font-size: 16px;
+}
+
+.coupon-info {
+	display: flex;
+	align-items: center;
+	justify-content: space-between;
+	padding: 15px;
+	border: 1px solid #e5e5e5;
+	border-radius: 8px;
+}
+
+.coupon-selected {
+	font-size: 14px;
+	color: #007aff;
+}
+
+.coupon-placeholder {
+	font-size: 14px;
+	color: #999999;
+}
+
+.coupon-arrow {
+	color: #999999;
+	font-size: 16px;
+}
+
+.remark-input {
+	width: 100%;
+	min-height: 40px;
+	padding: 10px;
+	border: 1px solid #e5e5e5;
+	border-radius: 8px;
+	font-size: 14px;
+	color: #333333;
+}
+
+.price-detail {
+	padding: 15px;
+	background-color: #f8f9fa;
+	border-radius: 8px;
+}
+
+.price-row {
+	display: flex;
+	justify-content: space-between;
+	align-items: center;
+	padding: 8px 0;
+}
+
+.price-row.total {
+	border-top: 1px solid #e5e5e5;
+	margin-top: 8px;
+	padding-top: 15px;
+}
+
+.price-label {
+	font-size: 14px;
+	color: #666666;
+}
+
+.price-value {
+	font-size: 14px;
+	color: #333333;
+}
+
+.price-value.discount {
+	color: #4caf50;
+}
+
+.price-value.total-price {
+	font-size: 18px;
+	color: #ff4757;
+	font-weight: bold;
+}
+
+.bottom-bar {
+	background-color: #ffffff;
+	padding: 15px;
+	border-top: 1px solid #e5e5e5;
+	display: flex;
+	align-items: center;
+	justify-content: space-between;
+}
+
+.price-summary {
+	display: flex;
+	align-items: baseline;
+}
+
+.summary-label {
+	font-size: 14px;
+	color: #333333;
+	margin-right: 5px;
+}
+
+.summary-price {
+	font-size: 20px;
+	color: #ff4757;
+	font-weight: bold;
+}
+
+.submit-btn {
+	background-color: #007aff;
+	color: #ffffff;
+	padding: 0 40px;
+	height: 45px;
+	border-radius: 22.5px;
+	font-size: 16px;
+	font-weight: bold;
+	border: none;
+}
+
+/* 地址选择弹窗样式 */
+.address-popup-mask {
+	position: fixed;
+	top: 0;
+	left: 0;
+	right: 0;
+	bottom: 0;
+	background-color: rgba(0, 0, 0, 0.5);
+	display: flex;
+	align-items: flex-end;
+	justify-content: center;
+	z-index: 9998;
+}
+
+.address-popup {
+	background-color: #ffffff;
+	width: 100%;
+	max-height: 70vh;
+	border-radius: 20px 20px 0 0;
+	display: flex;
+	flex-direction: column;
+}
+
+.popup-header {
+	padding: 20px 15px;
+	border-bottom: 1px solid #e5e5e5;
+	display: flex;
+	align-items: center;
+	justify-content: space-between;
+}
+
+.popup-title {
+	font-size: 18px;
+	font-weight: bold;
+	color: #333333;
+}
+
+.popup-close {
+	font-size: 24px;
+	color: #999999;
+	padding: 5px;
+}
+
+.address-list-container {
+	flex: 1;
+	padding: 15px;
+	max-height: 50vh;
+}
+
+.popup-address-item {
+	padding: 15px;
+	margin-bottom: 10px;
+	border: 1px solid #e5e5e5;
+	border-radius: 8px;
+	position: relative;
+}
+
+.popup-address-item:last-child {
+	margin-bottom: 0;
+}
+
+.popup-address-header {
+	display: flex;
+	align-items: center;
+	margin-bottom: 10px;
+}
+
+.popup-address-name {
+	font-size: 16px;
+	font-weight: bold;
+	color: #333333;
+	margin-right: 15px;
+}
+
+.popup-address-phone {
+	font-size: 14px;
+	color: #666666;
+	margin-right: 10px;
+}
+
+.popup-default-tag {
+	background-color: #ff4757;
+	padding: 2px 8px;
+	border-radius: 10px;
+}
+
+.popup-tag-text {
+	color: #ffffff;
+	font-size: 12px;
+}
+
+.popup-address-detail {
+	font-size: 14px;
+	color: #333333;
+	line-height: 1.4;
+	display: block;
+}
+
+.popup-selected-indicator {
+	position: absolute;
+	top: 15px;
+	right: 15px;
+	color: #007aff;
+	font-size: 16px;
+}
+
+.popup-empty-address {
+	display: flex;
+	flex-direction: column;
+	align-items: center;
+	justify-content: center;
+	padding: 40px 20px;
+}
+
+.popup-empty-icon {
+	font-size: 60px;
+	margin-bottom: 15px;
+}
+
+.popup-empty-text {
+	font-size: 16px;
+	color: #999999;
+}
+
+.popup-add-address-btn {
+	background-color: #007aff;
+	margin: 15px;
+	padding: 15px;
+	border-radius: 8px;
+	display: flex;
+	align-items: center;
+	justify-content: center;
+}
+
+.popup-btn-icon {
+	color: #ffffff;
+	font-size: 20px;
+	margin-right: 10px;
+}
+
+.popup-btn-text {
+	color: #ffffff;
+	font-size: 16px;
+	font-weight: bold;
+}
+
+/* 新建地址表单弹窗样式 */
+.address-form-mask {
+	position: fixed;
+	top: 0;
+	left: 0;
+	right: 0;
+	bottom: 0;
+	background-color: rgba(0, 0, 0, 0.5);
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	z-index: 9999;
+}
+
+.address-form-popup {
+	background-color: #ffffff;
+	width: 90%;
+	max-width: 500px;
+	max-height: 80vh;
+	border-radius: 12px;
+	display: flex;
+	flex-direction: column;
+}
+
+.form-header {
+	padding: 20px 15px;
+	border-bottom: 1px solid #e5e5e5;
+	display: flex;
+	align-items: center;
+	justify-content: space-between;
+}
+
+.form-title {
+	font-size: 18px;
+	font-weight: bold;
+	color: #333333;
+}
+
+.form-close {
+	font-size: 24px;
+	color: #999999;
+	padding: 5px;
+}
+
+.form-content {
+	flex: 1;
+	padding: 15px;
+	max-height: 50vh;
+}
+
+.form-item {
+	margin-bottom: 20px;
+}
+
+.form-item:last-child {
+	margin-bottom: 0;
+}
+
+.form-label {
+	font-size: 14px;
+	color: #333333;
+	margin-bottom: 8px;
+	display: block;
+}
+
+.form-input {
+	width: 100%;
+	padding: 12px;
+	border: 1px solid #e5e5e5;
+	border-radius: 8px;
+	font-size: 14px;
+	color: #333333;
+	box-sizing: border-box;
+}
+
+.form-input[readonly] {
+	background-color: #f9f9f9;
+	color: #666666;
+}
+
+.region-inputs {
+	display: flex;
+	gap: 10px;
+}
+
+.region-input {
+	flex: 1;
+}
+
+.form-textarea {
+	width: 100%;
+	min-height: 80px;
+	padding: 12px;
+	border: 1px solid #e5e5e5;
+	border-radius: 8px;
+	font-size: 14px;
+	color: #333333;
+	box-sizing: border-box;
+}
+
+.smart-address-input {
+	min-height: 60px;
+}
+
+.smart-tip {
+	font-size: 12px;
+	color: #999999;
+	margin-top: 5px;
+	display: block;
+}
+
+.checkbox-item {
+	margin-top: 20px;
+}
+
+.checkbox-wrapper {
+	display: flex;
+	align-items: center;
+}
+
+.checkbox {
+	width: 20px;
+	height: 20px;
+	border: 1px solid #e5e5e5;
+	border-radius: 4px;
+	margin-right: 10px;
+	display: flex;
+	align-items: center;
+	justify-content: center;
+}
+
+.checkbox.checked {
+	background-color: #007aff;
+	border-color: #007aff;
+}
+
+.checkbox-check {
+	color: #ffffff;
+	font-size: 14px;
+}
+
+.checkbox-label {
+	font-size: 14px;
+	color: #333333;
+}
+
+.form-buttons {
+	display: flex;
+	padding: 15px;
+	border-top: 1px solid #e5e5e5;
+	gap: 10px;
+}
+
+.form-cancel-btn {
+	flex: 1;
+	background-color: #f5f5f5;
+	color: #333333;
+	padding: 12px;
+	border-radius: 8px;
+	font-size: 16px;
+	border: none;
+}
+
+.form-submit-btn {
+	flex: 1;
+	background-color: #007aff;
+	color: #ffffff;
+	padding: 12px;
+	border-radius: 8px;
+	font-size: 16px;
+	border: none;
+}
+/* 确认弹窗样式 */
+.confirm-popup-mask {
+	position: fixed;
+	top: 0;
+	left: 0;
+	right: 0;
+	bottom: 0;
+	background-color: rgba(0, 0, 0, 0.5);
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	z-index: 10002;
+}
+
+.confirm-popup {
+	background-color: #ffffff;
+	width: 80%;
+	max-width: 320px;
+	border-radius: 12px;
+	overflow: hidden;
+}
+
+.confirm-header {
+	padding: 20px 0 10px;
+	text-align: center;
+}
+
+.confirm-title {
+	font-size: 18px;
+	font-weight: bold;
+	color: #333333;
+}
+
+.confirm-content {
+	padding: 0 20px 20px;
+	text-align: center;
+}
+
+.confirm-message {
+	font-size: 16px;
+	color: #666666;
+}
+
+.confirm-buttons {
+	display: flex;
+	border-top: 1px solid #e5e5e5;
+}
+
+.confirm-btn {
+	flex: 1;
+	height: 50px;
+	line-height: 50px;
+	text-align: center;
+	font-size: 16px;
+	background-color: #ffffff;
+	border: none;
+	border-radius: 0;
+}
+
+.confirm-btn::after {
+	border: none;
+}
+
+.confirm-btn.cancel {
+	color: #666666;
+	border-right: 1px solid #e5e5e5;
+}
+
+.confirm-btn.confirm {
+	color: #007aff;
+	font-weight: bold;
+}
+</style>
diff --git a/pages/mall/consumer/checkout.uvue b/pages/mall/consumer/checkout.uvue
index 3c744516..d96e6e2a 100644
--- a/pages/mall/consumer/checkout.uvue
+++ b/pages/mall/consumer/checkout.uvue
@@ -120,8 +120,42 @@
 				</view>
 				
 				<scroll-view class="address-list-container" scroll-y>
+					<!-- 登录提示 -->
+					<view v-if="!isLoggedIn" class="login-prompt" @click="goToLogin">
+						<text class="login-prompt-icon">🔒</text>
+						<text class="login-prompt-text">您尚未登录，点击登录以同步服务器地址</text>
+						<text class="login-prompt-arrow">›</text>
+					</view>
+					
 					<!-- 地址列表 -->
-					<view v-if="addressList.length > 0">
+					<view v-if="isLoggedIn">
+						<view v-if="addressList.length > 0">
+							<view v-for="address in addressList" :key="address.id" 
+										class="popup-address-item" @click="handleSelectAddress(address)">
+								<view class="popup-address-header">
+									<text class="popup-address-name">{{ address.recipient_name }}</text>
+									<text class="popup-address-phone">{{ address.phone }}</text>
+									<view v-if="address.is_default" class="popup-default-tag">
+										<text class="popup-tag-text">默认</text>
+									</view>
+								</view>
+								<text class="popup-address-detail">{{ getFullAddress(address) }}</text>
+								<view v-if="selectedAddress && selectedAddress.id === address.id" class="popup-selected-indicator">
+									<text>✓</text>
+								</view>
+							</view>
+						</view>
+						
+						<!-- 空状态 -->
+						<view v-else class="popup-empty-address">
+							<text class="popup-empty-icon">📍</text>
+							<text class="popup-empty-text">暂无收货地址</text>
+						</view>
+					</view>
+					
+					<!-- 未登录时的本地地址展示 -->
+					<view v-if="!isLoggedIn && addressList.length > 0">
+						<text class="local-address-title">本地地址（未同步）</text>
 						<view v-for="address in addressList" :key="address.id" 
 									class="popup-address-item" @click="handleSelectAddress(address)">
 							<view class="popup-address-header">
@@ -138,8 +172,8 @@
 						</view>
 					</view>
 					
-					<!-- 空状态 -->
-					<view v-else class="popup-empty-address">
+					<!-- 完全无地址状态 -->
+					<view v-if="isLoggedIn && addressList.length === 0" class="popup-empty-address">
 						<text class="popup-empty-icon">📍</text>
 						<text class="popup-empty-text">暂无收货地址</text>
 					</view>
@@ -241,6 +275,7 @@
 <script setup lang="uts">
 import { ref, onMounted, computed, watch, onUnmounted, getCurrentInstance } from 'vue'
 import { onLoad } from '@dcloudio/uni-app'
+import { supabaseService, type UserAddress as SupabaseUserAddress } from '@/utils/supabaseService.uts'
 
 type CheckoutItemType = {
 	id: string
@@ -467,9 +502,26 @@ onMounted(() => {
 	})
 })
 
+// 页面显示时触发
+const onShow = () => {
+	console.log('checkout页面显示，检查登录状态并重新加载地址')
+	// 检查用户登录状态
+	const userId = getCurrentUserId()
+	if (userId) {
+		console.log('用户已登录，重新加载地址数据')
+		// 重新加载默认地址和地址列表
+		loadDefaultAddress()
+		loadAddressList()
+	}
+}
+
+// 注册页面显示事件
+uni.$on('checkoutPageShow', onShow)
+
 // 组件卸载时移除事件监听
 onUnmounted(() => {
 	uni.$off('addressUpdated')
+	uni.$off('checkoutPageShow')
     // 离开页面时清除结算数据，防止下次进入时显示旧数据
     uni.removeStorageSync('checkout_type')
     uni.removeStorageSync('checkout_items')
@@ -523,76 +575,269 @@ const loadCheckoutData = () => {
 
 // 加载默认地址
 const loadDefaultAddress = async () => {
-	// 从本地存储加载地址数据
-	const storedAddresses = uni.getStorageSync('addresses')
-	if (storedAddresses) {
-		try {
-			const addresses = JSON.parse(storedAddresses as string) as any[]
-			if (addresses && addresses.length > 0) {
+	try {
+		// 首先检查用户是否登录
+		const currentUserId = getCurrentUserId()
+		console.log('loadDefaultAddress: 当前用户ID:', currentUserId)
+		
+		// 如果用户已登录，尝试从Supabase加载地址数据
+		if (currentUserId) {
+			console.log('loadDefaultAddress: 用户已登录，从Supabase加载地址')
+			const supabaseAddresses = await supabaseService.getAddresses()
+			console.log('loadDefaultAddress: Supabase返回地址:', supabaseAddresses)
+			
+			if (supabaseAddresses && supabaseAddresses.length > 0) {
 				// 查找默认地址
-				const defaultAddress = addresses.find((addr: any) => addr.isDefault === true)
+				const defaultAddress = supabaseAddresses.find((addr: SupabaseUserAddress) => addr.is_default === true)
 				if (defaultAddress) {
 					// 转换地址格式以匹配selectedAddress的结构
 					selectedAddress.value = {
 						id: defaultAddress.id,
-						recipient_name: defaultAddress.name,
+						recipient_name: defaultAddress.recipient_name,
 						phone: defaultAddress.phone,
 						province: defaultAddress.province,
 						city: defaultAddress.city,
 						district: defaultAddress.district,
-						detail: defaultAddress.detail,
-						is_default: defaultAddress.isDefault
+						detail: defaultAddress.detail_address,
+						is_default: defaultAddress.is_default
 					}
+					console.log('loadDefaultAddress: 找到默认地址:', selectedAddress.value)
 				} else {
 					// 如果没有默认地址，使用第一个地址
-					const firstAddress = addresses[0]
+					const firstAddress = supabaseAddresses[0]
 					selectedAddress.value = {
 						id: firstAddress.id,
-						recipient_name: firstAddress.name,
+						recipient_name: firstAddress.recipient_name,
 						phone: firstAddress.phone,
 						province: firstAddress.province,
 						city: firstAddress.city,
 						district: firstAddress.district,
-						detail: firstAddress.detail,
-						is_default: firstAddress.isDefault
+						detail: firstAddress.detail_address,
+						is_default: firstAddress.is_default
 					}
+					console.log('loadDefaultAddress: 使用第一个地址:', selectedAddress.value)
+				}
+				
+				// 同时更新本地存储缓存
+				const localAddresses = supabaseAddresses.map((addr: SupabaseUserAddress) => ({
+					id: addr.id,
+					name: addr.recipient_name,
+					phone: addr.phone,
+					province: addr.province,
+					city: addr.city,
+					district: addr.district,
+					detail: addr.detail_address,
+					isDefault: addr.is_default
+				}))
+				uni.setStorageSync('addresses', JSON.stringify(localAddresses))
+				console.log('loadDefaultAddress: 地址已保存到本地存储')
+			} else {
+				console.log('loadDefaultAddress: Supabase未返回地址数据')
+			}
+		}
+		
+		// 如果Supabase没有地址数据或用户未登录，尝试从本地存储加载
+		if (!selectedAddress.value) {
+			console.log('loadDefaultAddress: 尝试从本地存储加载地址')
+			const storedAddresses = uni.getStorageSync('addresses')
+			console.log('loadDefaultAddress: 本地存储地址数据:', storedAddresses)
+			if (storedAddresses) {
+				try {
+					const addresses = JSON.parse(storedAddresses as string) as any[]
+					if (addresses && addresses.length > 0) {
+						// 查找默认地址
+						const defaultAddress = addresses.find((addr: any) => addr.isDefault === true)
+						if (defaultAddress) {
+							selectedAddress.value = {
+								id: defaultAddress.id,
+								recipient_name: defaultAddress.name,
+								phone: defaultAddress.phone,
+								province: defaultAddress.province,
+								city: defaultAddress.city,
+								district: defaultAddress.district,
+								detail: defaultAddress.detail,
+								is_default: defaultAddress.isDefault
+							}
+							console.log('loadDefaultAddress: 从本地存储找到默认地址:', selectedAddress.value)
+						} else {
+							// 如果没有默认地址，使用第一个地址
+							const firstAddress = addresses[0]
+							selectedAddress.value = {
+								id: firstAddress.id,
+								recipient_name: firstAddress.name,
+								phone: firstAddress.phone,
+								province: firstAddress.province,
+								city: firstAddress.city,
+								district: firstAddress.district,
+								detail: firstAddress.detail,
+								is_default: firstAddress.isDefault
+							}
+							console.log('loadDefaultAddress: 从本地存储使用第一个地址:', selectedAddress.value)
+						}
+					}
+				} catch (err) {
+					console.error('解析本地地址数据失败:', err)
 				}
 			}
-		} catch (err) {
-			console.error('解析地址数据失败:', err)
 		}
-	} else {
-        // 如果没有地址数据，尝试使用Mock数据初始化（为了演示效果）
-        const mockAddress = {
-            id: 'addr_mock_default',
-            name: '测试用户',
-            phone: '13800138000',
-            province: '北京市',
-            city: '北京市',
-            district: '朝阳区',
-            detail: '三里屯SOHO A座',
-            isDefault: true
-        }
-        uni.setStorageSync('addresses', JSON.stringify([mockAddress]))
-        selectedAddress.value = {
-            id: mockAddress.id,
-            recipient_name: mockAddress.name,
-            phone: mockAddress.phone,
-            province: mockAddress.province,
-            city: mockAddress.city,
-            district: mockAddress.district,
-            detail: mockAddress.detail,
-            is_default: mockAddress.isDefault
-        }
-    }
+		
+		// 如果仍然没有地址，使用模拟地址数据
+		if (!selectedAddress.value) {
+			console.log('loadDefaultAddress: 使用模拟地址数据')
+			// 模拟地址数据
+			const mockAddresses = [
+				{
+					id: 'addr_001',
+					name: '张三',
+					phone: '13800138001',
+					province: '北京市',
+					city: '北京市',
+					district: '朝阳区',
+					detail: '建国路88号SOHO现代城A座1001',
+					isDefault: true
+				},
+				{
+					id: 'addr_002',
+					name: '李四',
+					phone: '13900139001',
+					province: '上海市',
+					city: '上海市',
+					district: '浦东新区',
+					detail: '陆家嘴环路1000号汇亚大厦20层',
+					isDefault: false
+				}
+			]
+			
+			// 保存模拟地址到本地存储
+			uni.setStorageSync('addresses', JSON.stringify(mockAddresses))
+			console.log('loadDefaultAddress: 模拟地址已保存到本地存储')
+			
+			// 使用第一个地址作为默认地址
+			selectedAddress.value = {
+				id: mockAddresses[0].id,
+				recipient_name: mockAddresses[0].name,
+				phone: mockAddresses[0].phone,
+				province: mockAddresses[0].province,
+				city: mockAddresses[0].city,
+				district: mockAddresses[0].district,
+				detail: mockAddresses[0].detail,
+				is_default: mockAddresses[0].isDefault
+			}
+			console.log('loadDefaultAddress: 使用模拟地址:', selectedAddress.value)
+		}
+		
+		// 如果仍然没有地址，selectedAddress.value将保持为null
+		// 用户可以在结算页面点击地址区域添加新地址
+		
+	} catch (error) {
+		console.error('从Supabase加载默认地址失败:', error)
+		// 失败时从本地存储加载
+		const storedAddresses = uni.getStorageSync('addresses')
+		if (storedAddresses) {
+			try {
+				const addresses = JSON.parse(storedAddresses as string) as any[]
+				if (addresses && addresses.length > 0) {
+					const defaultAddress = addresses.find((addr: any) => addr.isDefault === true)
+					if (defaultAddress) {
+						selectedAddress.value = {
+							id: defaultAddress.id,
+							recipient_name: defaultAddress.name,
+							phone: defaultAddress.phone,
+							province: defaultAddress.province,
+							city: defaultAddress.city,
+							district: defaultAddress.district,
+							detail: defaultAddress.detail,
+							is_default: defaultAddress.isDefault
+						}
+					} else {
+						const firstAddress = addresses[0]
+						selectedAddress.value = {
+							id: firstAddress.id,
+							recipient_name: firstAddress.name,
+							phone: firstAddress.phone,
+							province: firstAddress.province,
+							city: firstAddress.city,
+							district: firstAddress.district,
+							detail: firstAddress.detail,
+							is_default: firstAddress.isDefault
+						}
+					}
+				}
+			} catch (err) {
+				console.error('解析本地地址数据失败:', err)
+			}
+		}
+	}
 }
 
 // 获取当前用户ID
 const getCurrentUserId = (): string => {
-	const userStore = uni.getStorageSync('userInfo')
-	return userStore?.id || ''
+	// 尝试从多个可能的键名获取用户ID
+	const possibleKeys = ['user_id', 'userId', 'uid', 'user_uuid', 'userID', 'user.id']
+	
+	for (const key of possibleKeys) {
+		const value = uni.getStorageSync(key)
+		console.log(`getCurrentUserId: 尝试键名 ${key}:`, value)
+		if (value) {
+			console.log(`getCurrentUserId: 从 ${key} 获取到用户ID:`, value)
+			return value as string
+		}
+	}
+	
+	// 尝试从userInfo对象获取
+	const userInfo = uni.getStorageSync('userInfo')
+	console.log('getCurrentUserId: 从userInfo获取:', userInfo)
+	if (userInfo) {
+		// userInfo可能是字符串（需要解析）或对象
+		let userInfoObj: any = userInfo
+		if (typeof userInfo === 'string') {
+			try {
+				userInfoObj = JSON.parse(userInfo)
+			} catch (e) {
+				console.error('解析userInfo失败:', e)
+			}
+		}
+		
+		// 尝试多个可能的属性名
+		const possibleProps = ['id', 'userId', 'uid', 'user_id', 'uuid', 'user_uuid']
+		for (const prop of possibleProps) {
+			if (userInfoObj && userInfoObj[prop]) {
+				console.log(`getCurrentUserId: 从userInfo.${prop} 获取到用户ID:`, userInfoObj[prop])
+				return userInfoObj[prop] as string
+			}
+		}
+	}
+	
+	// 尝试从auth获取（如果使用Supabase Auth）
+	const authData = uni.getStorageSync('supabase.auth.token')
+	if (authData) {
+		console.log('getCurrentUserId: 从supabase.auth.token获取:', authData)
+		try {
+			const authObj = typeof authData === 'string' ? JSON.parse(authData) : authData
+			if (authObj.currentSession && authObj.currentSession.user && authObj.currentSession.user.id) {
+				console.log('getCurrentUserId: 从auth session获取用户ID:', authObj.currentSession.user.id)
+				return authObj.currentSession.user.id as string
+			}
+		} catch (e) {
+			console.error('解析auth数据失败:', e)
+		}
+	}
+	
+	// 打印所有存储键，用于调试
+	console.log('getCurrentUserId: 所有Storage键:')
+	const allKeys = uni.getStorageInfoSync().keys
+	console.log('Storage keys:', allKeys)
+	
+	console.log('getCurrentUserId: 未找到用户ID')
+	return ''
 }
 
+// 用户登录状态
+const isLoggedIn = computed(() => {
+	const userId = getCurrentUserId()
+	return !!userId
+})
+
 // 获取完整地址
 const getFullAddress = (address: any): string => {
 	return `${address.province}${address.city}${address.district}${address.detail}`
@@ -600,32 +845,159 @@ const getFullAddress = (address: any): string => {
 
 // 加载地址列表
 const loadAddressList = async () => {
-	// 从本地存储加载地址数据
-	const storedAddresses = uni.getStorageSync('addresses')
-	if (storedAddresses) {
-		try {
-			const addresses = JSON.parse(storedAddresses as string) as any[]
-			if (addresses && addresses.length > 0) {
+	try {
+		// 首先检查用户是否登录
+		const currentUserId = getCurrentUserId()
+		console.log('loadAddressList: 当前用户ID:', currentUserId)
+		
+		// 如果用户已登录，尝试从Supabase加载地址数据
+		if (currentUserId) {
+			console.log('loadAddressList: 用户已登录，从Supabase加载地址')
+			const supabaseAddresses = await supabaseService.getAddresses()
+			console.log('loadAddressList: Supabase返回地址:', supabaseAddresses)
+			
+			if (supabaseAddresses && supabaseAddresses.length > 0) {
 				// 转换地址格式以匹配addressList的结构
-				addressList.value = addresses.map((addr: any) => ({
+				addressList.value = supabaseAddresses.map((addr: SupabaseUserAddress) => ({
 					id: addr.id,
-					recipient_name: addr.name,
+					recipient_name: addr.recipient_name,
 					phone: addr.phone,
 					province: addr.province,
 					city: addr.city,
 					district: addr.district,
-					detail: addr.detail,
-					is_default: addr.isDefault
+					detail: addr.detail_address,
+					is_default: addr.is_default
 				}))
+				console.log('loadAddressList: 从Supabase加载地址成功，数量:', addressList.value.length)
+				
+				// 同时更新本地存储缓存
+				const localAddresses = supabaseAddresses.map((addr: SupabaseUserAddress) => ({
+					id: addr.id,
+					name: addr.recipient_name,
+					phone: addr.phone,
+					province: addr.province,
+					city: addr.city,
+					district: addr.district,
+					detail: addr.detail_address,
+					isDefault: addr.is_default
+				}))
+				uni.setStorageSync('addresses', JSON.stringify(localAddresses))
+				console.log('loadAddressList: 地址已保存到本地存储')
+			} else {
+				console.log('loadAddressList: Supabase未返回地址数据')
+			}
+		}
+		
+		// 如果Supabase没有地址数据或用户未登录，尝试从本地存储加载
+		if (!addressList.value || addressList.value.length === 0) {
+			console.log('loadAddressList: 尝试从本地存储加载地址')
+			const storedAddresses = uni.getStorageSync('addresses')
+			console.log('loadAddressList: 本地存储地址数据:', storedAddresses)
+			if (storedAddresses) {
+				try {
+					const addresses = JSON.parse(storedAddresses as string) as any[]
+					if (addresses && addresses.length > 0) {
+						// 转换地址格式以匹配addressList的结构
+						addressList.value = addresses.map((addr: any) => ({
+							id: addr.id,
+							recipient_name: addr.name,
+							phone: addr.phone,
+							province: addr.province,
+							city: addr.city,
+							district: addr.district,
+							detail: addr.detail,
+							is_default: addr.isDefault
+						}))
+						console.log('loadAddressList: 从本地存储加载地址成功，数量:', addressList.value.length)
+					} else {
+						addressList.value = []
+						console.log('loadAddressList: 本地存储地址为空数组')
+					}
+				} catch (err) {
+					console.error('解析本地地址数据失败:', err)
+					addressList.value = []
+				}
 			} else {
 				addressList.value = []
+				console.log('loadAddressList: 本地存储没有地址数据')
 			}
-		} catch (err) {
-			console.error('解析地址数据失败:', err)
+		}
+		
+		// 如果仍然没有地址，使用模拟地址数据（与loadDefaultAddress保持一致）
+		if (!addressList.value || addressList.value.length === 0) {
+			console.log('loadAddressList: 使用模拟地址数据')
+			// 模拟地址数据（与loadDefaultAddress中保持一致）
+			const mockAddresses = [
+				{
+					id: 'addr_001',
+					name: '张三',
+					phone: '13800138001',
+					province: '北京市',
+					city: '北京市',
+					district: '朝阳区',
+					detail: '建国路88号SOHO现代城A座1001',
+					isDefault: true
+				},
+				{
+					id: 'addr_002',
+					name: '李四',
+					phone: '13900139001',
+					province: '上海市',
+					city: '上海市',
+					district: '浦东新区',
+					detail: '陆家嘴环路1000号汇亚大厦20层',
+					isDefault: false
+				}
+			]
+			
+			// 保存模拟地址到本地存储
+			uni.setStorageSync('addresses', JSON.stringify(mockAddresses))
+			console.log('loadAddressList: 模拟地址已保存到本地存储')
+			
+			// 转换为checkout页面格式
+			addressList.value = mockAddresses.map((addr: any) => ({
+				id: addr.id,
+				recipient_name: addr.name,
+				phone: addr.phone,
+				province: addr.province,
+				city: addr.city,
+				district: addr.district,
+				detail: addr.detail,
+				is_default: addr.isDefault
+			}))
+			console.log('loadAddressList: 模拟地址已加载到地址列表，数量:', addressList.value.length)
+		}
+		
+		console.log('loadAddressList: 最终地址列表:', addressList.value)
+	} catch (error) {
+		console.error('从Supabase加载地址列表失败:', error)
+		// 失败时从本地存储加载
+		const storedAddresses = uni.getStorageSync('addresses')
+		if (storedAddresses) {
+			try {
+				const addresses = JSON.parse(storedAddresses as string) as any[]
+				if (addresses && addresses.length > 0) {
+					// 转换地址格式以匹配addressList的结构
+					addressList.value = addresses.map((addr: any) => ({
+						id: addr.id,
+						recipient_name: addr.name,
+						phone: addr.phone,
+						province: addr.province,
+						city: addr.city,
+						district: addr.district,
+						detail: addr.detail,
+						is_default: addr.isDefault
+					}))
+				} else {
+					addressList.value = []
+				}
+			} catch (err) {
+				console.error('解析本地地址数据失败:', err)
+				addressList.value = []
+			}
+		} else {
 			addressList.value = []
 		}
-	} else {
-		addressList.value = []
 	}
 }
 
@@ -1001,6 +1373,7 @@ const clearShoppingCart = async () => {
 	}
 }
 
+
 // 返回
 const goBack = () => {
 	uni.navigateBack()
diff --git a/pages/mall/consumer/product-detail copy 2.uvue b/pages/mall/consumer/product-detail copy 2.uvue
new file mode 100644
index 00000000..a1da08fa
--- /dev/null
+++ b/pages/mall/consumer/product-detail copy 2.uvue	
@@ -0,0 +1,1392 @@
+<!-- 消费者端 - 商品详情页 -->
+<template>
+  <view class="product-detail-page">
+    <!-- 商品图片轮播 -->
+    <view class="product-images">
+      <swiper class="image-swiper" :indicator-dots="true" :autoplay="false" @change="onSwiperChange">
+        <swiper-item v-for="(image, index) in product.images" :key="index">
+          <image :src="image" class="product-image" mode="aspectFit" />
+        </swiper-item>
+      </swiper>
+      <view class="image-indicator">{{ currentImageIndex + 1 }} / {{ product.images.length }}</view>
+    </view>
+
+    <!-- 商品基本信息 -->
+    <view class="product-info">
+      <view class="price-section">
+        <text class="current-price">¥{{ product.price }}</text>
+        <text v-if="product.original_price" class="original-price">¥{{ product.original_price }}</text>
+      </view>
+      <text class="product-name">{{ product.name }}</text>
+      <text class="sales-info">已售{{ product.sales }}件 · 库存{{ product.stock }}件</text>
+    </view>
+
+    <!-- 店铺信息 -->
+    <view class="shop-info" @click="goToShop">
+      <image :src="merchant.shop_logo || '/static/default-shop.png'" class="shop-logo" />
+      <view class="shop-details">
+        <text class="shop-name" @click.stop="goToShop">{{ merchant.shop_name }}</text>
+        <view class="shop-stats-row">
+           <text class="rating-text">评分: {{ merchant.rating.toFixed(1) }}</text>
+           <text class="sales-text">销量: {{ merchant.total_sales }}</text>
+        </view>
+      </view>
+      <text class="enter-shop" @click.stop="goToShop">进店 ></text>
+    </view>
+
+    <!-- 功能主治（药品功能） -->
+    <view class="function-section" v-if="product.usage">
+      <text class="function-title">功能主治</text>
+      <text class="function-content">{{ product.usage }}</text>
+    </view>
+
+    <!-- 商品参数 -->
+    <view class="params-section" @click="showParamsModal">
+      <text class="params-title">商品参数</text>
+      <view class="params-summary">
+        <text class="params-item" v-if="product.specification">规格: {{ product.specification }}</text>
+        <text class="params-item" v-if="product.expiry_date">有效期: {{ product.expiry_date }}</text>
+        <text class="params-item" v-if="product.approval_number">批准文号: {{ product.approval_number }}</text>
+      </view>
+      <text class="params-arrow">></text>
+    </view>
+
+    <!-- 规格选择 -->
+    <view class="spec-section" @click="showSpecModal">
+      <text class="spec-title">规格</text>
+      <text class="spec-selected">{{ selectedSpec || '请选择规格' }}</text>
+      <text class="spec-arrow">></text>
+    </view>
+
+    <!-- 数量选择 -->
+    <view class="quantity-section">
+      <text class="quantity-title">数量</text>
+      <view class="quantity-selector">
+        <view class="quantity-btn minus" @click="decreaseQuantity">
+          <text class="quantity-btn-text">-</text>
+        </view>
+        <input class="quantity-input" 
+               type="number" 
+               v-model="quantity" 
+               :min="1" 
+               :max="getMaxQuantity()"
+               @input="validateQuantity" />
+        <view class="quantity-btn plus" @click="increaseQuantity">
+          <text class="quantity-btn-text">+</text>
+        </view>
+      </view>
+      <text class="quantity-stock">库存{{ getAvailableStock() }}件</text>
+    </view>
+
+    <!-- 商品详情 -->
+    <view class="product-description">
+      <view class="section-title">商品详情</view>
+      <text class="description-text">{{ product.description || '暂无详细描述' }}</text>
+      <!-- 商品详情图片 -->
+      <view class="detail-images" v-if="product.images && product.images.length > 0">
+        <image v-for="(img, index) in product.images" 
+               :key="index" 
+               :src="img" 
+               class="detail-image" 
+               mode="widthFix" 
+               @click="previewImage(index)" />
+      </view>
+    </view>
+
+    <!-- 底部操作栏 -->
+    <view class="bottom-actions">
+      <view class="action-buttons">
+        <view class="action-btn" @click="goToCart">
+          <text class="action-icon">🛒</text>
+          <text class="action-text">购物车</text>
+        </view>
+        <view class="action-btn" @click="toggleFavorite">
+          <text class="action-icon">{{ isFavorite ? '❤️' : '🤍' }}</text>
+          <text class="action-text">{{ isFavorite ? '已收藏' : '收藏' }}</text>
+        </view>
+      </view>
+      <view class="btn-group">
+        <button class="cart-btn" @click="addToCart">加入购物车</button>
+        <button class="buy-btn" @click="buyNow">立即购买</button>
+      </view>
+    </view>
+
+    <!-- 规格选择弹窗 -->
+    <view v-if="showSpec" class="spec-modal" @click="hideSpecModal">
+      <view class="spec-content" @click.stop>
+        <view class="spec-header">
+          <text class="spec-title">选择规格</text>
+          <text class="close-btn" @click="hideSpecModal">×</text>
+        </view>
+        <view class="spec-list">
+          <view v-for="sku in productSkus" :key="sku.id" 
+                class="spec-item" 
+                :class="{ active: selectedSkuId === sku.id }"
+                @click="selectSku(sku)">
+            <text class="spec-name">{{ getSkuSpecText(sku) }}</text>
+            <text class="spec-price">¥{{ sku.price }}</text>
+            <text class="spec-stock">库存{{ sku.stock }}</text>
+          </view>
+        </view>
+      </view>
+    </view>
+
+    <!-- 商品参数弹窗 -->
+    <view v-if="showParams" class="params-modal" @click="hideParamsModal">
+      <view class="params-content" @click.stop>
+        <view class="params-header">
+          <text class="params-title">商品参数</text>
+          <text class="close-btn" @click="hideParamsModal">×</text>
+        </view>
+        <view class="params-list">
+          <view class="params-item" v-if="product.specification">
+            <text class="params-label">规格</text>
+            <text class="params-value">{{ product.specification }}</text>
+          </view>
+          <view class="params-item" v-if="product.usage">
+            <text class="params-label">功能主治</text>
+            <text class="params-value">{{ product.usage }}</text>
+          </view>
+          <view class="params-item" v-if="product.side_effects">
+            <text class="params-label">副作用</text>
+            <text class="params-value">{{ product.side_effects }}</text>
+          </view>
+          <view class="params-item" v-if="product.precautions">
+            <text class="params-label">注意事项</text>
+            <text class="params-value">{{ product.precautions }}</text>
+          </view>
+          <view class="params-item" v-if="product.expiry_date">
+            <text class="params-label">有效期</text>
+            <text class="params-value">{{ product.expiry_date }}</text>
+          </view>
+          <view class="params-item" v-if="product.storage_conditions">
+            <text class="params-label">储存条件</text>
+            <text class="params-value">{{ product.storage_conditions }}</text>
+          </view>
+          <view class="params-item" v-if="product.approval_number">
+            <text class="params-label">批准文号</text>
+            <text class="params-value">{{ product.approval_number }}</text>
+          </view>
+          <view class="params-item" v-if="product.tags && product.tags.length > 0">
+            <text class="params-label">标签</text>
+            <text class="params-value">{{ product.tags.join(', ') }}</text>
+          </view>
+        </view>
+      </view>
+    </view>
+  </view>
+</template>
+
+<script>
+import { ProductType, MerchantType, ProductSkuType } from '@/types/mall-types.uts'
+import { supabaseService } from '@/utils/supabaseService.uts'
+
+export default {
+  data() {
+    return {
+      product: {
+        id: '',
+        merchant_id: '',
+        category_id: '',
+        name: '',
+        description: '',
+        images: [] as Array<string>,
+        price: 0,
+        original_price: 0,
+        stock: 0,
+        sales: 0,
+        status: 0,
+        created_at: ''
+      } as ProductType,
+      merchant: {
+        id: '',
+        user_id: '',
+        shop_name: '',
+        shop_logo: '',
+        shop_banner: '',
+        shop_description: '',
+        contact_name: '',
+        contact_phone: '',
+        shop_status: 0,
+        rating: 0,
+        total_sales: 0,
+        created_at: ''
+      } as MerchantType,
+      productSkus: [] as Array<ProductSkuType>,
+      currentImageIndex: 0,
+      showSpec: false,
+      selectedSkuId: '',
+      selectedSpec: '',
+      quantity: 1,
+      isFavorite: false,
+      showParams: false
+    }
+  },
+  onLoad(options: any) {
+    const productId = options.productId as string || options.id as string
+    const productPrice = options.price ? parseFloat(options.price) : null
+    const productOriginalPrice = options.originalPrice ? parseFloat(options.originalPrice) : null
+    
+    // 处理商品名称：如果是编码的则解码，否则直接使用
+    let productName = options.name as string
+    if (productName) {
+        try {
+            // 尝试解码，如果失败（不是有效的URI组件）则使用原值
+            productName = decodeURIComponent(productName)
+        } catch (e) {
+            console.warn('ProductName decode failed, using original:', productName)
+        }
+    }
+    
+    let productImage = options.image as string
+    if (productImage) {
+        try {
+            productImage = decodeURIComponent(productImage)
+        } catch (e) {
+            console.warn('ProductImage decode failed, using original:', productImage)
+        }
+    }
+    
+    if (productId) {
+      this.loadProductDetail(productId, {
+        price: productPrice,
+        originalPrice: productOriginalPrice,
+        name: productName,
+        image: productImage
+      })
+      this.checkFavoriteStatus(productId)
+      this.saveFootprint(productId)
+      
+      // 设置导航栏标题为商品名称
+      if (productName) {
+          uni.setNavigationBarTitle({
+              title: productName
+          })
+      }
+    }
+  },
+  computed: {
+    displayPrice(): number {
+      if (this.selectedSkuId) {
+        const sku = this.productSkus.find(s => s.id === this.selectedSkuId)
+        if (sku) return sku.price
+      }
+      return this.product.price
+    }
+  },
+  methods: {
+    saveFootprint(productId: string) {
+      const footprintData = uni.getStorageSync('footprints')
+      let footprints: any[] = []
+      
+      if (footprintData) {
+        try {
+          footprints = JSON.parse(footprintData as string) as any[]
+        } catch (e) {
+          console.error('Failed to parse footprints', e)
+        }
+      }
+      
+      // 移除已存在的相同商品（为了将其移到最新位置）
+      footprints = footprints.filter(item => item.id !== productId)
+      
+      // 添加到头部
+      footprints.unshift({
+        id: this.product.id,
+        name: this.product.name,
+        price: this.product.price,
+        original_price: this.product.original_price, // 添加原价
+        image: this.product.images[0],
+        sales: this.product.sales,
+        shopId: this.merchant.id,
+        shopName: this.merchant.shop_name,
+        viewTime: Date.now()
+      })
+      
+      // 限制数量，例如最近50条
+      if (footprints.length > 50) {
+        footprints = footprints.slice(0, 50)
+      }
+      uni.setStorageSync('footprints', JSON.stringify(footprints))
+    },
+    
+    async loadProductDetail(productId: string, options: any = {}) {
+      // 尝试从数据库加载
+      let dbProductRaw = null
+      try {
+        console.log('正在尝试从数据库加载商品详情:', productId)
+        dbProductRaw = await supabaseService.getProductById(productId)
+        console.log('数据库返回的商品详情 (原始数据):', dbProductRaw)
+        
+        // 调试：打印数据库返回的所有字段
+        if (dbProductRaw) {
+          console.log('数据库返回字段详情:')
+          if (Array.isArray(dbProductRaw)) {
+            console.log('返回数据是数组，长度:', dbProductRaw.length)
+            if (dbProductRaw.length > 0) {
+              const firstItem = dbProductRaw[0]
+              console.log('数组第一个元素:', firstItem)
+              for (const key in firstItem) {
+                console.log(`  ${key}:`, firstItem[key], typeof firstItem[key])
+              }
+            }
+          } else {
+            console.log('返回数据是对象')
+            for (const key in dbProductRaw) {
+              console.log(`  ${key}:`, dbProductRaw[key], typeof dbProductRaw[key])
+            }
+          }
+        }
+      } catch (e) {
+        console.error('Failed to load product from DB', e)
+      }
+
+      // 处理数据库返回数据：可能是数组或对象
+      let dbProduct = null
+      if (dbProductRaw) {
+        if (Array.isArray(dbProductRaw)) {
+          if (dbProductRaw.length > 0) {
+            dbProduct = dbProductRaw[0] // 取数组第一个元素
+          } else {
+            console.warn('数据库返回空数组')
+          }
+        } else {
+          dbProduct = dbProductRaw // 已经是对象
+        }
+      }
+
+      if (dbProduct) {
+        console.log('使用数据库数据渲染页面')
+        
+        // 调试：打印dbProduct的详细结构和类型
+        console.log('dbProduct类型:', typeof dbProduct)
+        console.log('dbProduct原型:', Object.getPrototypeOf(dbProduct))
+        console.log('dbProduct的键:')
+        for (let key in dbProduct) {
+          console.log('  ', key, ':', dbProduct[key], '类型:', typeof dbProduct[key])
+        }
+        
+        // 验证必要字段，如果关键字段缺失则使用模拟数据
+        // 注意：数据库返回的字段可能与本地ProductType不完全匹配
+        console.log('验证必要字段，dbProduct:', dbProduct)
+        
+        // 尝试多种方式访问属性
+        const idValue = dbProduct.id !== undefined ? dbProduct.id : (dbProduct['id'] !== undefined ? dbProduct['id'] : undefined)
+        const nameValue = dbProduct.name !== undefined ? dbProduct.name : (dbProduct['name'] !== undefined ? dbProduct['name'] : undefined)
+        const priceValue = dbProduct.price !== undefined ? dbProduct.price : (dbProduct['price'] !== undefined ? dbProduct['price'] : undefined)
+        
+        const hasId = idValue !== undefined && idValue !== null
+        const hasName = nameValue !== undefined && nameValue !== null
+        const hasPrice = priceValue !== undefined && priceValue !== null
+        
+        const hasRequiredFields = dbProduct && hasId && hasName && hasPrice
+        console.log('字段检查 - id:', idValue, 'hasId:', hasId, 'name:', nameValue, 'hasName:', hasName, 'price:', priceValue, 'hasPrice:', hasPrice)
+        console.log('hasRequiredFields:', hasRequiredFields)
+        
+        if (!hasRequiredFields) {
+          console.warn('数据库返回数据缺少必要字段，使用模拟数据')
+          // 继续执行，会进入下面的else分支
+          dbProduct = null
+        } else {
+          // 更新dbProduct的字段为实际值，确保后续使用正确的属性访问
+          if (dbProduct.id === undefined && idValue !== undefined) dbProduct.id = idValue
+          if (dbProduct.name === undefined && nameValue !== undefined) dbProduct.name = nameValue
+          if (dbProduct.price === undefined && priceValue !== undefined) dbProduct.price = priceValue
+          // 使用数据库数据 - 处理字段映射
+          // 数据库Product接口和本地ProductType接口字段可能不同
+          const images = [] as Array<string>
+          
+          // 处理图片字段：优先使用images字段，其次使用image字段
+          console.log('处理数据库图片字段:')
+          console.log('dbProduct.images:', dbProduct.images, '类型:', typeof dbProduct.images)
+          console.log('dbProduct.image:', dbProduct.image, '类型:', typeof dbProduct.image)
+          
+          // 尝试从数据库的images字段获取图片（可能是字符串或数组）
+          if (dbProduct.images) {
+            let imagesArray: any[] = []
+            if (typeof dbProduct.images === 'string') {
+              try {
+                imagesArray = JSON.parse(dbProduct.images)
+                console.log('解析images字符串成功:', imagesArray)
+              } catch (e) {
+                console.error('解析images字段失败:', e, dbProduct.images)
+                // 如果不是JSON，尝试按逗号分割
+                if (dbProduct.images.includes(',')) {
+                  imagesArray = dbProduct.images.split(',').map((img: string) => img.trim())
+                } else if (dbProduct.images) {
+                  imagesArray = [dbProduct.images]
+                }
+              }
+            } else if (Array.isArray(dbProduct.images)) {
+              imagesArray = dbProduct.images
+            }
+            
+            if (imagesArray.length > 0) {
+              console.log('从数据库images字段获取图片数组:', imagesArray)
+              for (const img of imagesArray) {
+                if (typeof img === 'string' && img) {
+                  images.push(img)
+                }
+              }
+            }
+          }
+          
+          // 如果没有从images字段获取到图片，尝试使用image字段
+          if (images.length === 0 && dbProduct.image) {
+            console.log('使用单张图片字段:', dbProduct.image)
+            images.push(dbProduct.image)
+          }
+          
+          // 如果仍然没有图片，使用传入的图片或默认图片
+          if (images.length === 0) {
+            if (options.image) {
+              images.push(decodeURIComponent(options.image as string))
+            } else {
+              images.push('/static/product1.jpg')
+            }
+          }
+          
+          // 补充模拟图片（如果图片数量不足3张）
+          const needSupplementCount = 3 - images.length
+          if (needSupplementCount > 0) {
+            const supplementalImages = ['/static/product2.jpg', '/static/product3.jpg']
+            for (let i = 0; i < needSupplementCount && i < supplementalImages.length; i++) {
+              images.push(supplementalImages[i])
+            }
+          }
+          
+          console.log('最终图片数组:', images)
+          
+          // 映射字段：数据库shop_id对应本地merchant_id
+          const merchantId = dbProduct.shop_id || dbProduct.merchant_id || 'merchant_001'
+          
+          // 确保数值字段有效
+          const price = typeof dbProduct.price === 'number' ? dbProduct.price : 0
+          const stock = (dbProduct.stock != null && !isNaN(Number(dbProduct.stock))) ? Math.floor(Number(dbProduct.stock)) : 100
+          const sales = (dbProduct.sales != null && !isNaN(Number(dbProduct.sales))) ? Math.floor(Number(dbProduct.sales)) : 50
+
+          this.product = {
+              id: dbProduct.id || productId,
+              merchant_id: merchantId,
+              category_id: dbProduct.category_id || 'cat_001',
+              name: dbProduct.name || '商品名称',
+              description: dbProduct.description || '这是一个高品质的商品，具有优秀的性能和优美的外观设计。采用环保材料，经过严格质检，保证用户的使用体验。',
+              images: images,
+              price: price,
+              original_price: (dbProduct.original_price != null && !isNaN(Number(dbProduct.original_price))) ? Number(dbProduct.original_price) : null,
+              stock: stock,
+              sales: sales,
+              status: 1,
+              created_at: dbProduct.created_at || '2024-01-01',
+              // 药品相关字段
+              specification: dbProduct.specification || null,
+              usage: dbProduct.usage || null,
+              side_effects: dbProduct.side_effects || null,
+              precautions: dbProduct.precautions || null,
+              expiry_date: dbProduct.expiry_date || null,
+              storage_conditions: dbProduct.storage_conditions || null,
+              approval_number: dbProduct.approval_number || null,
+              tags: dbProduct.tags ? (typeof dbProduct.tags === 'string' ? JSON.parse(dbProduct.tags) : dbProduct.tags) : []
+          } as ProductType
+          console.log('页面 product 对象已更新:', this.product)
+          console.log('商品图片数组:', this.product.images)
+          console.log('商品价格:', this.product.price, '库存:', this.product.stock, '销量:', this.product.sales)
+        }
+      } else {
+        console.log('数据库无数据或加载失败，使用模拟数据')
+        // 数据库无数据时，使用原有模拟逻辑
+        const generatePriceFromId = (id: string): number => {
+            let hash = 0
+            for (let i = 0; i < id.length; i++) {
+            hash = (hash << 5) - hash + id.charCodeAt(i)
+            hash |= 0
+            }
+            const price = 50 + Math.abs(hash % 450)
+            return parseFloat(price.toFixed(2))
+        }
+
+        const basePrice = options.price ? parseFloat(options.price) : generatePriceFromId(productId)
+        const originalPrice = options.originalPrice ? parseFloat(options.originalPrice) : parseFloat((basePrice * 1.2).toFixed(2))
+        
+        const productName = options.name ? decodeURIComponent(options.name) : (() => {
+            const productNames = ['高品质运动休闲鞋', '时尚简约双肩背包', '多功能智能手环', '便携式蓝牙音箱', '全自动雨伞', '抗菌防螨床上四件套', '不锈钢保温杯', '无线充电器', '高清行车记录仪', '智能体脂秤']
+            const nameIndex = Math.abs(productId.split('').reduce((acc, char) => acc + char.charCodeAt(0), 0)) % productNames.length
+            return productNames[nameIndex]
+        })()
+        
+        const productImage = options.image ? decodeURIComponent(options.image) : '/static/product1.jpg'
+        
+        const sales = 1000 + Math.abs(productId.split('').reduce((acc, char) => acc + char.charCodeAt(0), 0)) % 5000
+        const stock = 50 + Math.abs(productId.split('').reduce((acc, char) => acc + char.charCodeAt(0), 0)) % 200
+        
+        this.product = {
+            id: productId,
+            merchant_id: 'merchant_' + (Math.abs(productId.split('').reduce((acc, char) => acc + char.charCodeAt(0), 0)) % 5 + 1).toString().padStart(3, '0'),
+            category_id: 'cat_' + (Math.abs(productId.split('').reduce((acc, char) => acc + char.charCodeAt(0), 0)) % 10 + 1).toString().padStart(3, '0'),
+            name: productName,
+            description: '这是一个高品质的商品，具有优秀的性能和优美的外观设计。采用环保材料，经过严格质检，保证用户的使用体验。',
+            images: [productImage, '/static/product2.jpg', '/static/product3.jpg'],
+            price: basePrice,
+            original_price: originalPrice,
+            stock: stock,
+            sales: sales,
+            status: 1,
+            created_at: '2024-01-15'
+        }
+      }
+      
+      // 根据商家ID生成不同的商家信息
+      const merchantIndex = Math.abs(this.product.merchant_id.split('').reduce((acc, char) => acc + char.charCodeAt(0), 0)) % 5
+      const shopNames = ['优质好店', '品牌直营店', '官方旗舰店', '专卖店', '精品小店']
+      const shopDescriptions = [
+        '专注品质生活',
+        '品牌官方直营，正品保障',
+        '厂家直销，价格优惠',
+        '专注本领域十年老店',
+        '用心服务每一位顾客'
+      ]
+      const contactNames = ['店主小王', '店长小李', '经理小张', '客服小赵', '老板小钱']
+      
+      this.merchant = {
+        id: this.product.merchant_id,
+        user_id: 'user_' + (merchantIndex + 1).toString().padStart(3, '0'),
+        shop_name: shopNames[merchantIndex],
+        shop_logo: '/static/shop-logo.png',
+        shop_banner: '/static/shop-banner.png',
+        shop_description: shopDescriptions[merchantIndex],
+        contact_name: contactNames[merchantIndex],
+        contact_phone: '138' + (10000000 + merchantIndex * 1111111).toString().substring(0, 8),
+        shop_status: 1,
+        rating: 4.5 + (merchantIndex * 0.1),
+        total_sales: 10000 + merchantIndex * 5000,
+        created_at: '2023-06-01'
+      }
+      
+      this.loadProductSkus(productId)
+    },
+    
+    loadProductSkus(productId: string) {
+      // 模拟加载商品SKU数据
+      const basePrice = this.product.price
+      
+      // 使用 productId 作为前缀生成唯一的 SKU ID，防止不同商品的 SKU ID 冲突
+      this.productSkus = [
+        {
+          id: `${productId}_sku_001`,
+          product_id: productId,
+          sku_code: 'SKU001',
+          specifications: { color: '红色', size: 'M' },
+          price: basePrice,
+          stock: 50,
+          image_url: '/static/sku1.jpg',
+          status: 1
+        },
+        {
+          id: `${productId}_sku_002`,
+          product_id: productId,
+          sku_code: 'SKU002',
+          specifications: { color: '蓝色', size: 'L' },
+          price: parseFloat((basePrice * 1.1).toFixed(2)),
+          stock: 30,
+          image_url: '/static/sku2.jpg',
+          status: 1
+        }
+      ]
+    },
+
+    onSwiperChange(e: any) {
+      this.currentImageIndex = e.detail.current
+    },
+    
+    showSpecModal() {
+      this.showSpec = true
+    },
+    
+    hideSpecModal() {
+      this.showSpec = false
+    },
+    
+    selectSku(sku: ProductSkuType) {
+      this.selectedSkuId = sku.id
+      this.selectedSpec = this.getSkuSpecText(sku)
+      this.hideSpecModal()
+    },
+    
+    getSkuSpecText(sku: ProductSkuType): string {
+      if (sku.specifications) {
+        const specs: any = sku.specifications
+        return Object.keys(specs).map(key => `${key}: ${specs[key]}`).join(', ')
+      }
+      return sku.sku_code
+    },
+    
+    addToCart() {
+      if (!this.selectedSkuId) {
+        uni.showToast({
+          title: '请选择规格',
+          icon: 'none'
+        })
+        return
+      }
+      
+      // 获取现有购物车数据
+      const cartData = uni.getStorageSync('cart')
+      let cartItems: any[] = []
+      
+      if (cartData) {
+        try {
+          cartItems = JSON.parse(cartData as string) as any[]
+        } catch (e) {
+          console.error('解析购物车数据失败', e)
+        }
+      }
+      
+      // 检查商品是否已存在 (同一SKU)
+      const existingItem = cartItems.find((item: any) => item.id === this.selectedSkuId)
+      
+      if (existingItem) {
+        existingItem.quantity += this.quantity
+      } else {
+        // 查找SKU信息
+        const sku = this.productSkus.find(s => s.id === this.selectedSkuId)
+        
+        // 添加新商品
+        cartItems.push({
+          id: this.selectedSkuId, // 使用SKU ID作为购物车条目ID
+          productId: this.product.id,
+          shopId: this.merchant.id,
+          shopName: this.merchant.shop_name,
+          name: this.product.name,
+          price: sku ? sku.price : this.product.price,
+          image: (sku && sku.image_url) ? sku.image_url : this.product.images[0],
+          spec: this.selectedSpec,
+          quantity: this.quantity,
+          selected: true
+        })
+      }
+      
+      // 保存回存储
+      uni.setStorageSync('cart', JSON.stringify(cartItems))
+      
+      // 模拟添加到购物车
+      uni.showToast({
+        title: '已添加到购物车',
+        icon: 'success'
+      })
+    },
+    
+    buyNow() {
+      if (!this.selectedSkuId) {
+        uni.showToast({
+          title: '请选择规格',
+          icon: 'none'
+        })
+        return
+      }
+      
+      const sku = this.productSkus.find(s => s.id === this.selectedSkuId)
+      
+	// 调试：打印价格信息
+	console.log('立即购买 - 商品价格信息:')
+	console.log('SKU价格:', sku ? sku.price : '无SKU')
+	console.log('商品价格:', this.product.price)
+	console.log('选择的价格:', (sku ? sku.price : this.product.price))
+	console.log('数量:', this.quantity)
+	
+	const selectedItem = {
+		id: this.selectedSkuId,
+		product_id: this.product.id,
+		sku_id: this.selectedSkuId,
+		product_name: this.product.name,
+		product_image: (sku && sku.image_url) ? sku.image_url : this.product.images[0],
+		sku_specifications: sku ? sku.specifications : {},
+		price: Number(parseFloat((sku ? sku.price : this.product.price).toString()).toFixed(2)),
+		quantity: Number(this.quantity)
+	}
+	
+	// 调试：打印最终传递的数据
+	console.log('立即购买 - 传递的商品数据:', selectedItem)
+
+      // 使用Storage传递数据，避免EventChannel可能的问题
+      uni.setStorageSync('checkout_type', 'buy_now')
+      uni.setStorageSync('checkout_items', JSON.stringify([selectedItem]))
+
+      // 跳转到订单确认页
+      uni.navigateTo({
+        url: '/pages/mall/consumer/checkout',
+        success: (res) => {
+            res.eventChannel.emit('acceptData', {
+                selectedItems: [selectedItem]
+            })
+        }
+      })
+    },
+    
+    goToShop() {
+      uni.navigateTo({
+        url: `/pages/mall/consumer/shop-detail?merchantId=${this.merchant.id}`
+      })
+    },
+
+    checkFavoriteStatus(id: string) {
+      const storedFavorites = uni.getStorageSync('favorites')
+      if (storedFavorites) {
+        try {
+          const favorites = JSON.parse(storedFavorites as string) as any[]
+          this.isFavorite = favorites.some(item => item.id === id)
+        } catch (e) {
+          console.error('Failed to parse favorites', e)
+        }
+      }
+    },
+
+    toggleFavorite() {
+      const storedFavorites = uni.getStorageSync('favorites')
+      let favorites: any[] = []
+      
+      if (storedFavorites) {
+        try {
+          favorites = JSON.parse(storedFavorites as string) as any[]
+        } catch (e) {
+          console.error('Failed to parse favorites', e)
+        }
+      }
+      
+      if (this.isFavorite) {
+        // 取消收藏
+        favorites = favorites.filter(item => item.id !== this.product.id)
+        uni.showToast({
+          title: '已取消收藏',
+          icon: 'none'
+        })
+      } else {
+        // 添加收藏
+        favorites.push({
+          id: this.product.id,
+          name: this.product.name,
+          price: this.product.price,
+          original_price: this.product.original_price, // 保存原价
+          image: this.product.images[0],
+          sales: this.product.sales,
+          shopId: this.merchant.id,
+          shopName: this.merchant.shop_name
+        })
+        uni.showToast({
+          title: '收藏成功',
+          icon: 'success'
+        })
+      }
+      
+      uni.setStorageSync('favorites', JSON.stringify(favorites))
+      this.isFavorite = !this.isFavorite
+    },
+
+    goToHome() {
+      uni.switchTab({
+        url: '/pages/mall/consumer/home'
+      })
+    },
+
+    goToCart() {
+      uni.switchTab({
+        url: '/pages/mall/consumer/cart'
+      })
+    },
+
+    // 数量选择相关方法
+    decreaseQuantity() {
+      if (this.quantity > 1) {
+        this.quantity--
+      }
+    },
+    
+    increaseQuantity() {
+      const maxQuantity = this.getMaxQuantity()
+      if (this.quantity < maxQuantity) {
+        this.quantity++
+      } else {
+        uni.showToast({
+          title: `最多只能购买${maxQuantity}件`,
+          icon: 'none'
+        })
+      }
+    },
+    
+    validateQuantity() {
+      // 确保数量是数字
+      let num = parseInt(this.quantity)
+      if (isNaN(num)) {
+        num = 1
+      }
+      
+      // 限制在1和最大库存之间
+      const maxQuantity = this.getMaxQuantity()
+      if (num < 1) {
+        num = 1
+      } else if (num > maxQuantity) {
+        num = maxQuantity
+        uni.showToast({
+          title: `最多只能购买${maxQuantity}件`,
+          icon: 'none'
+        })
+      }
+      
+      this.quantity = num
+    },
+    
+    getMaxQuantity() {
+      // 如果有选择SKU，使用SKU的库存，否则使用商品总库存
+      if (this.selectedSkuId) {
+        const sku = this.productSkus.find(s => s.id === this.selectedSkuId)
+        if (sku) return sku.stock
+      }
+      return this.product.stock
+    },
+    
+    getAvailableStock() {
+      return this.getMaxQuantity()
+    },
+    
+    previewImage(index: number) {
+      uni.previewImage({
+        current: index,
+        urls: this.product.images
+      })
+    },
+    
+    showParamsModal() {
+      this.showParams = true
+    },
+    
+    hideParamsModal() {
+      this.showParams = false
+    }
+  }
+}
+</script>
+
+<style>
+.product-detail-page {
+  background-color: #f5f5f5;
+  min-height: 100vh;
+  padding-bottom: 120rpx;
+}
+
+.product-images {
+  position: relative;
+  height: 750rpx;
+  background-color: #fff;
+}
+
+.image-swiper {
+  width: 100%;
+  height: 100%;
+}
+
+.product-image {
+  width: 100%;
+  height: 100%;
+}
+
+.image-indicator {
+  position: absolute;
+  bottom: 20rpx;
+  right: 20rpx;
+  background-color: rgba(0, 0, 0, 0.5);
+  color: #fff;
+  padding: 10rpx 20rpx;
+  border-radius: 20rpx;
+  font-size: 24rpx;
+}
+
+.product-info {
+  background-color: #fff;
+  padding: 30rpx;
+  margin-bottom: 20rpx;
+}
+
+.price-section {
+  margin-bottom: 20rpx;
+}
+
+.current-price {
+  font-size: 48rpx;
+  font-weight: bold;
+  color: #ff4444;
+  margin-right: 20rpx;
+}
+
+.original-price {
+  font-size: 28rpx;
+  color: #999;
+  text-decoration: line-through;
+}
+
+.product-name {
+  font-size: 32rpx;
+  font-weight: bold;
+  color: #333;
+  line-height: 1.4;
+  margin-bottom: 15rpx;
+}
+
+.sales-info {
+  font-size: 26rpx;
+  color: #666;
+}
+
+.shop-info {
+  background-color: #fff;
+  padding: 30rpx;
+  margin-bottom: 20rpx;
+  display: flex;
+  flex-direction: row; /* 显式横向排列 */
+  align-items: center;
+}
+
+.shop-logo {
+  width: 80rpx;
+  height: 80rpx;
+  border-radius: 10rpx;
+  margin-right: 20rpx;
+}
+
+.shop-details {
+  flex: 1;
+  display: flex;
+  flex-direction: column; /* 内部信息保持纵向，或者根据需要改为横向 */
+  justify-content: center;
+}
+
+.shop-name {
+  font-size: 30rpx;
+  font-weight: bold;
+  color: #333;
+  margin-bottom: 10rpx;
+}
+
+.shop-stats-row {
+  display: flex;
+  flex-direction: row; /* 显式横向排列 */
+  align-items: center;
+}
+
+.rating-text, .sales-text {
+  font-size: 24rpx;
+  color: #666;
+  margin-right: 30rpx;
+}
+
+.enter-shop {
+  font-size: 26rpx;
+  color: #666;
+}
+
+.spec-section {
+  background-color: #fff;
+  padding: 30rpx;
+  margin-bottom: 20rpx;
+  display: flex;
+  align-items: center;
+}
+
+.spec-title {
+  font-size: 30rpx;
+  color: #333;
+  width: 120rpx;
+}
+
+.spec-selected {
+  flex: 1;
+  font-size: 28rpx;
+  color: #666;
+}
+
+.spec-arrow {
+  font-size: 28rpx;
+  color: #999;
+}
+
+.quantity-section {
+  background-color: #fff;
+  padding: 30rpx;
+  margin-bottom: 20rpx;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+}
+
+.quantity-title {
+  font-size: 30rpx;
+  color: #333;
+  width: 120rpx;
+}
+
+.quantity-selector {
+  display: flex;
+  align-items: center;
+  border: 1rpx solid #e5e5e5;
+  border-radius: 8rpx;
+  overflow: hidden;
+}
+
+.quantity-btn {
+  width: 60rpx;
+  height: 60rpx;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background-color: #f5f5f5;
+}
+
+.quantity-btn.minus {
+  border-right: 1rpx solid #e5e5e5;
+}
+
+.quantity-btn.plus {
+  border-left: 1rpx solid #e5e5e5;
+}
+
+.quantity-btn-text {
+  font-size: 28rpx;
+  color: #333;
+}
+
+.quantity-input {
+  width: 80rpx;
+  height: 60rpx;
+  text-align: center;
+  font-size: 28rpx;
+  color: #333;
+  border: none;
+  background-color: #fff;
+}
+
+.quantity-stock {
+  font-size: 24rpx;
+  color: #666;
+}
+
+.product-description {
+  background-color: #fff;
+  padding: 30rpx;
+  margin-bottom: 20rpx;
+}
+
+.section-title {
+  font-size: 32rpx;
+  font-weight: bold;
+  color: #333;
+  margin-bottom: 20rpx;
+}
+
+.description-text {
+  font-size: 28rpx;
+  color: #666;
+  line-height: 1.6;
+}
+
+.bottom-actions {
+  position: fixed;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  background-color: #fff;
+  padding: 10rpx 20rpx;
+  box-shadow: 0 -2rpx 10rpx rgba(0, 0, 0, 0.1);
+  display: flex;
+  flex-direction: row; /* 显式设置横向排列 */
+  align-items: center;
+  justify-content: space-between;
+}
+
+.action-buttons {
+  display: flex;
+  flex-direction: row; /* 显式设置横向排列 */
+  align-items: center;
+  margin-right: 20rpx;
+}
+
+.action-btn {
+  display: flex;
+  flex-direction: column; /* 图标文字保持纵向 */
+  align-items: center;
+  justify-content: center;
+  margin-right: 20rpx;
+  min-width: 80rpx;
+}
+
+.action-icon {
+  font-size: 40rpx;
+  margin-bottom: 4rpx;
+}
+
+.action-text {
+  font-size: 20rpx;
+  color: #666;
+}
+
+.btn-group {
+  flex: 1;
+  display: flex;
+  flex-direction: row; /* 显式设置横向排列 */
+  align-items: center;
+}
+
+.cart-btn, .buy-btn {
+  flex: 1;
+  height: 72rpx;
+  line-height: 72rpx;
+  border-radius: 36rpx;
+  font-size: 26rpx;
+  border: none;
+  margin: 0 10rpx;
+}
+
+.cart-btn {
+  background-color: #ffa726;
+  color: #fff;
+}
+
+.buy-btn {
+  background-color: #ff4444;
+  color: #fff;
+}
+
+.spec-modal {
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background-color: rgba(0, 0, 0, 0.5);
+  display: flex;
+  align-items: flex-end;
+  z-index: 999;
+}
+
+.spec-content {
+  background-color: #fff;
+  width: 100%;
+  max-height: 80vh;
+  border-radius: 20rpx 20rpx 0 0;
+  padding: 30rpx;
+}
+
+.spec-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin-bottom: 30rpx;
+  padding-bottom: 20rpx;
+  border-bottom: 1rpx solid #eee;
+}
+
+.spec-title {
+  font-size: 32rpx;
+  font-weight: bold;
+  color: #333;
+}
+
+.close-btn {
+  font-size: 48rpx;
+  color: #999;
+}
+
+.spec-list {
+  max-height: 60vh;
+  overflow-y: auto;
+}
+
+.spec-item {
+  display: flex;
+  align-items: center;
+  padding: 25rpx 0;
+  border-bottom: 1rpx solid #f5f5f5;
+}
+
+.spec-item.active {
+  background-color: #fff3e0;
+}
+
+.spec-name {
+  flex: 1;
+  font-size: 28rpx;
+  color: #333;
+}
+
+.spec-price {
+  font-size: 26rpx;
+  color: #ff4444;
+  margin-right: 20rpx;
+}
+
+.spec-stock {
+  font-size: 24rpx;
+  color: #666;
+  width: 100rpx;
+  text-align: right;
+}
+
+/* 功能主治样式 */
+.function-section {
+  background-color: #fff;
+  padding: 30rpx;
+  margin-bottom: 20rpx;
+}
+
+.function-title {
+  font-size: 30rpx;
+  color: #333;
+  font-weight: bold;
+  margin-bottom: 15rpx;
+  display: block;
+}
+
+.function-content {
+  font-size: 28rpx;
+  color: #666;
+  line-height: 1.5;
+}
+
+/* 商品参数样式 */
+.params-section {
+  background-color: #fff;
+  padding: 30rpx;
+  margin-bottom: 20rpx;
+  display: flex;
+  align-items: center;
+}
+
+.params-title {
+  font-size: 30rpx;
+  color: #333;
+  width: 120rpx;
+  flex-shrink: 0;
+}
+
+.params-summary {
+  flex: 1;
+  display: flex;
+  flex-direction: row;
+  flex-wrap: wrap;
+  align-items: center;
+}
+
+.params-item {
+  font-size: 26rpx;
+  color: #666;
+  line-height: 1.5;
+  margin-right: 20rpx;
+  margin-bottom: 5rpx;
+  white-space: nowrap;
+}
+
+.params-arrow {
+  font-size: 28rpx;
+  color: #999;
+  flex-shrink: 0;
+  margin-left: 10rpx;
+}
+
+/* 商品参数弹窗样式 */
+.params-modal {
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background-color: rgba(0, 0, 0, 0.5);
+  display: flex;
+  align-items: flex-end;
+  z-index: 1000;
+}
+
+.params-content {
+  background-color: #fff;
+  width: 100%;
+  max-height: 80vh;
+  border-radius: 20rpx 20rpx 0 0;
+  padding: 30rpx;
+}
+
+.params-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin-bottom: 30rpx;
+  padding-bottom: 20rpx;
+  border-bottom: 1rpx solid #eee;
+}
+
+.params-title {
+  font-size: 32rpx;
+  font-weight: bold;
+  color: #333;
+  width: auto;
+}
+
+.params-list {
+  max-height: 60vh;
+  overflow-y: auto;
+}
+
+.params-item {
+  display: flex;
+  align-items: flex-start;
+  padding: 20rpx 0;
+  border-bottom: 1rpx solid #f5f5f5;
+}
+
+.params-label {
+  font-size: 28rpx;
+  color: #333;
+  font-weight: bold;
+  width: 150rpx;
+  flex-shrink: 0;
+}
+
+.params-value {
+  flex: 1;
+  font-size: 28rpx;
+  color: #666;
+  line-height: 1.5;
+}
+
+/* 商品详情图片样式 */
+.detail-images {
+  margin-top: 30rpx;
+}
+
+.detail-image {
+  width: 100%;
+  margin-bottom: 20rpx;
+  border-radius: 10rpx;
+  box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.1);
+}
+
+/* 电脑端适配 */
+@media (min-width: 768px) {
+  .params-section {
+    padding: 20rpx 30rpx;
+  }
+  
+  .params-summary {
+    flex-wrap: nowrap;
+    justify-content: space-between;
+  }
+  
+  .params-item {
+    flex: 1;
+    margin-right: 0;
+    text-align: center;
+    white-space: normal;
+    word-break: break-word;
+    padding: 0 10rpx;
+  }
+  
+  .params-arrow {
+    margin-left: 20rpx;
+  }
+}
+</style>
diff --git a/pages/mall/consumer/product-detail copy.uvue b/pages/mall/consumer/product-detail copy.uvue
new file mode 100644
index 00000000..5e7fae15
--- /dev/null
+++ b/pages/mall/consumer/product-detail copy.uvue	
@@ -0,0 +1,1163 @@
+<!-- 消费者端 - 商品详情页 -->
+<template>
+  <view class="product-detail-page">
+    <!-- 商品图片轮播 -->
+    <view class="product-images">
+      <swiper class="image-swiper" :indicator-dots="true" :autoplay="false" @change="onSwiperChange">
+        <swiper-item v-for="(image, index) in product.images" :key="index">
+          <image :src="image" class="product-image" mode="aspectFit" />
+        </swiper-item>
+      </swiper>
+      <view class="image-indicator">{{ currentImageIndex + 1 }} / {{ product.images.length }}</view>
+    </view>
+
+    <!-- 商品基本信息 -->
+    <view class="product-info">
+      <view class="price-section">
+        <text class="current-price">¥{{ product.price }}</text>
+        <text v-if="product.original_price" class="original-price">¥{{ product.original_price }}</text>
+      </view>
+      <text class="product-name">{{ product.name }}</text>
+      <text class="sales-info">已售{{ product.sales }}件 · 库存{{ product.stock }}件</text>
+    </view>
+
+    <!-- 店铺信息 -->
+    <view class="shop-info" @click="goToShop">
+      <image :src="merchant.shop_logo || '/static/default-shop.png'" class="shop-logo" />
+      <view class="shop-details">
+        <text class="shop-name" @click.stop="goToShop">{{ merchant.shop_name }}</text>
+        <view class="shop-stats-row">
+           <text class="rating-text">评分: {{ merchant.rating.toFixed(1) }}</text>
+           <text class="sales-text">销量: {{ merchant.total_sales }}</text>
+        </view>
+      </view>
+      <text class="enter-shop" @click.stop="goToShop">进店 ></text>
+    </view>
+
+    <!-- 规格选择 -->
+    <view class="spec-section" @click="showSpecModal">
+      <text class="spec-title">规格</text>
+      <text class="spec-selected">{{ selectedSpec || '请选择规格' }}</text>
+      <text class="spec-arrow">></text>
+    </view>
+
+    <!-- 数量选择 -->
+    <view class="quantity-section">
+      <text class="quantity-title">数量</text>
+      <view class="quantity-selector">
+        <view class="quantity-btn minus" @click="decreaseQuantity">
+          <text class="quantity-btn-text">-</text>
+        </view>
+        <input class="quantity-input" 
+               type="number" 
+               v-model="quantity" 
+               :min="1" 
+               :max="getMaxQuantity()"
+               @input="validateQuantity" />
+        <view class="quantity-btn plus" @click="increaseQuantity">
+          <text class="quantity-btn-text">+</text>
+        </view>
+      </view>
+      <text class="quantity-stock">库存{{ getAvailableStock() }}件</text>
+    </view>
+
+    <!-- 商品详情 -->
+    <view class="product-description">
+      <view class="section-title">商品详情</view>
+      <text class="description-text">{{ product.description || '暂无详细描述' }}</text>
+      <!-- 商品详情图片 -->
+      <view class="detail-images" v-if="product.images && product.images.length > 0">
+        <image v-for="(img, index) in product.images" 
+               :key="index" 
+               :src="img" 
+               class="detail-image" 
+               mode="widthFix" 
+               @click="previewImage(index)" />
+      </view>
+    </view>
+
+    <!-- 底部操作栏 -->
+    <view class="bottom-actions">
+      <view class="action-buttons">
+        <view class="action-btn" @click="goToCart">
+          <text class="action-icon">🛒</text>
+          <text class="action-text">购物车</text>
+        </view>
+        <view class="action-btn" @click="toggleFavorite">
+          <text class="action-icon">{{ isFavorite ? '❤️' : '🤍' }}</text>
+          <text class="action-text">{{ isFavorite ? '已收藏' : '收藏' }}</text>
+        </view>
+      </view>
+      <view class="btn-group">
+        <button class="cart-btn" @click="addToCart">加入购物车</button>
+        <button class="buy-btn" @click="buyNow">立即购买</button>
+      </view>
+    </view>
+
+    <!-- 规格选择弹窗 -->
+    <view v-if="showSpec" class="spec-modal" @click="hideSpecModal">
+      <view class="spec-content" @click.stop>
+        <view class="spec-header">
+          <text class="spec-title">选择规格</text>
+          <text class="close-btn" @click="hideSpecModal">×</text>
+        </view>
+        <view class="spec-list">
+          <view v-for="sku in productSkus" :key="sku.id" 
+                class="spec-item" 
+                :class="{ active: selectedSkuId === sku.id }"
+                @click="selectSku(sku)">
+            <text class="spec-name">{{ getSkuSpecText(sku) }}</text>
+            <text class="spec-price">¥{{ sku.price }}</text>
+            <text class="spec-stock">库存{{ sku.stock }}</text>
+          </view>
+        </view>
+      </view>
+    </view>
+  </view>
+</template>
+
+<script>
+import { ProductType, MerchantType, ProductSkuType } from '@/types/mall-types.uts'
+import { supabaseService } from '@/utils/supabaseService.uts'
+
+export default {
+  data() {
+    return {
+      product: {
+        id: '',
+        merchant_id: '',
+        category_id: '',
+        name: '',
+        description: '',
+        images: [] as Array<string>,
+        price: 0,
+        original_price: 0,
+        stock: 0,
+        sales: 0,
+        status: 0,
+        created_at: ''
+      } as ProductType,
+      merchant: {
+        id: '',
+        user_id: '',
+        shop_name: '',
+        shop_logo: '',
+        shop_banner: '',
+        shop_description: '',
+        contact_name: '',
+        contact_phone: '',
+        shop_status: 0,
+        rating: 0,
+        total_sales: 0,
+        created_at: ''
+      } as MerchantType,
+      productSkus: [] as Array<ProductSkuType>,
+      currentImageIndex: 0,
+      showSpec: false,
+      selectedSkuId: '',
+      selectedSpec: '',
+      quantity: 1,
+      isFavorite: false
+    }
+  },
+  onLoad(options: any) {
+    const productId = options.productId as string || options.id as string
+    const productPrice = options.price ? parseFloat(options.price) : null
+    const productOriginalPrice = options.originalPrice ? parseFloat(options.originalPrice) : null
+    
+    // 处理商品名称：如果是编码的则解码，否则直接使用
+    let productName = options.name as string
+    if (productName) {
+        try {
+            // 尝试解码，如果失败（不是有效的URI组件）则使用原值
+            productName = decodeURIComponent(productName)
+        } catch (e) {
+            console.warn('ProductName decode failed, using original:', productName)
+        }
+    }
+    
+    let productImage = options.image as string
+    if (productImage) {
+        try {
+            productImage = decodeURIComponent(productImage)
+        } catch (e) {
+            console.warn('ProductImage decode failed, using original:', productImage)
+        }
+    }
+    
+    if (productId) {
+      this.loadProductDetail(productId, {
+        price: productPrice,
+        originalPrice: productOriginalPrice,
+        name: productName,
+        image: productImage
+      })
+      this.checkFavoriteStatus(productId)
+      this.saveFootprint(productId)
+      
+      // 设置导航栏标题为商品名称
+      if (productName) {
+          uni.setNavigationBarTitle({
+              title: productName
+          })
+      }
+    }
+  },
+  computed: {
+    displayPrice(): number {
+      if (this.selectedSkuId) {
+        const sku = this.productSkus.find(s => s.id === this.selectedSkuId)
+        if (sku) return sku.price
+      }
+      return this.product.price
+    }
+  },
+  methods: {
+    saveFootprint(productId: string) {
+      const footprintData = uni.getStorageSync('footprints')
+      let footprints: any[] = []
+      
+      if (footprintData) {
+        try {
+          footprints = JSON.parse(footprintData as string) as any[]
+        } catch (e) {
+          console.error('Failed to parse footprints', e)
+        }
+      }
+      
+      // 移除已存在的相同商品（为了将其移到最新位置）
+      footprints = footprints.filter(item => item.id !== productId)
+      
+      // 添加到头部
+      footprints.unshift({
+        id: this.product.id,
+        name: this.product.name,
+        price: this.product.price,
+        original_price: this.product.original_price, // 添加原价
+        image: this.product.images[0],
+        sales: this.product.sales,
+        shopId: this.merchant.id,
+        shopName: this.merchant.shop_name,
+        viewTime: Date.now()
+      })
+      
+      // 限制数量，例如最近50条
+      if (footprints.length > 50) {
+        footprints = footprints.slice(0, 50)
+      }
+      uni.setStorageSync('footprints', JSON.stringify(footprints))
+    },
+    
+    async loadProductDetail(productId: string, options: any = {}) {
+      // 尝试从数据库加载
+      let dbProductRaw = null
+      try {
+        console.log('正在尝试从数据库加载商品详情:', productId)
+        dbProductRaw = await supabaseService.getProductById(productId)
+        console.log('数据库返回的商品详情 (原始数据):', dbProductRaw)
+        
+        // 调试：打印数据库返回的所有字段
+        if (dbProductRaw) {
+          console.log('数据库返回字段详情:')
+          if (Array.isArray(dbProductRaw)) {
+            console.log('返回数据是数组，长度:', dbProductRaw.length)
+            if (dbProductRaw.length > 0) {
+              const firstItem = dbProductRaw[0]
+              console.log('数组第一个元素:', firstItem)
+              for (const key in firstItem) {
+                console.log(`  ${key}:`, firstItem[key], typeof firstItem[key])
+              }
+            }
+          } else {
+            console.log('返回数据是对象')
+            for (const key in dbProductRaw) {
+              console.log(`  ${key}:`, dbProductRaw[key], typeof dbProductRaw[key])
+            }
+          }
+        }
+      } catch (e) {
+        console.error('Failed to load product from DB', e)
+      }
+
+      // 处理数据库返回数据：可能是数组或对象
+      let dbProduct = null
+      if (dbProductRaw) {
+        if (Array.isArray(dbProductRaw)) {
+          if (dbProductRaw.length > 0) {
+            dbProduct = dbProductRaw[0] // 取数组第一个元素
+          } else {
+            console.warn('数据库返回空数组')
+          }
+        } else {
+          dbProduct = dbProductRaw // 已经是对象
+        }
+      }
+
+      if (dbProduct) {
+        console.log('使用数据库数据渲染页面')
+        
+        // 调试：打印dbProduct的详细结构和类型
+        console.log('dbProduct类型:', typeof dbProduct)
+        console.log('dbProduct原型:', Object.getPrototypeOf(dbProduct))
+        console.log('dbProduct的键:')
+        for (let key in dbProduct) {
+          console.log('  ', key, ':', dbProduct[key], '类型:', typeof dbProduct[key])
+        }
+        
+        // 验证必要字段，如果关键字段缺失则使用模拟数据
+        // 注意：数据库返回的字段可能与本地ProductType不完全匹配
+        console.log('验证必要字段，dbProduct:', dbProduct)
+        
+        // 尝试多种方式访问属性
+        const idValue = dbProduct.id !== undefined ? dbProduct.id : (dbProduct['id'] !== undefined ? dbProduct['id'] : undefined)
+        const nameValue = dbProduct.name !== undefined ? dbProduct.name : (dbProduct['name'] !== undefined ? dbProduct['name'] : undefined)
+        const priceValue = dbProduct.price !== undefined ? dbProduct.price : (dbProduct['price'] !== undefined ? dbProduct['price'] : undefined)
+        
+        const hasId = idValue !== undefined && idValue !== null
+        const hasName = nameValue !== undefined && nameValue !== null
+        const hasPrice = priceValue !== undefined && priceValue !== null
+        
+        const hasRequiredFields = dbProduct && hasId && hasName && hasPrice
+        console.log('字段检查 - id:', idValue, 'hasId:', hasId, 'name:', nameValue, 'hasName:', hasName, 'price:', priceValue, 'hasPrice:', hasPrice)
+        console.log('hasRequiredFields:', hasRequiredFields)
+        
+        if (!hasRequiredFields) {
+          console.warn('数据库返回数据缺少必要字段，使用模拟数据')
+          // 继续执行，会进入下面的else分支
+          dbProduct = null
+        } else {
+          // 更新dbProduct的字段为实际值，确保后续使用正确的属性访问
+          if (dbProduct.id === undefined && idValue !== undefined) dbProduct.id = idValue
+          if (dbProduct.name === undefined && nameValue !== undefined) dbProduct.name = nameValue
+          if (dbProduct.price === undefined && priceValue !== undefined) dbProduct.price = priceValue
+          // 使用数据库数据 - 处理字段映射
+          // 数据库Product接口和本地ProductType接口字段可能不同
+          const images = [] as Array<string>
+          
+          // 处理图片字段：优先使用images字段，其次使用image字段
+          console.log('处理数据库图片字段:')
+          console.log('dbProduct.images:', dbProduct.images, '类型:', typeof dbProduct.images)
+          console.log('dbProduct.image:', dbProduct.image, '类型:', typeof dbProduct.image)
+          
+          // 尝试从数据库的images字段获取图片（可能是字符串或数组）
+          if (dbProduct.images) {
+            let imagesArray: any[] = []
+            if (typeof dbProduct.images === 'string') {
+              try {
+                imagesArray = JSON.parse(dbProduct.images)
+                console.log('解析images字符串成功:', imagesArray)
+              } catch (e) {
+                console.error('解析images字段失败:', e, dbProduct.images)
+                // 如果不是JSON，尝试按逗号分割
+                if (dbProduct.images.includes(',')) {
+                  imagesArray = dbProduct.images.split(',').map((img: string) => img.trim())
+                } else if (dbProduct.images) {
+                  imagesArray = [dbProduct.images]
+                }
+              }
+            } else if (Array.isArray(dbProduct.images)) {
+              imagesArray = dbProduct.images
+            }
+            
+            if (imagesArray.length > 0) {
+              console.log('从数据库images字段获取图片数组:', imagesArray)
+              for (const img of imagesArray) {
+                if (typeof img === 'string' && img) {
+                  images.push(img)
+                }
+              }
+            }
+          }
+          
+          // 如果没有从images字段获取到图片，尝试使用image字段
+          if (images.length === 0 && dbProduct.image) {
+            console.log('使用单张图片字段:', dbProduct.image)
+            images.push(dbProduct.image)
+          }
+          
+          // 如果仍然没有图片，使用传入的图片或默认图片
+          if (images.length === 0) {
+            if (options.image) {
+              images.push(decodeURIComponent(options.image as string))
+            } else {
+              images.push('/static/product1.jpg')
+            }
+          }
+          
+          // 补充模拟图片（如果图片数量不足3张）
+          const needSupplementCount = 3 - images.length
+          if (needSupplementCount > 0) {
+            const supplementalImages = ['/static/product2.jpg', '/static/product3.jpg']
+            for (let i = 0; i < needSupplementCount && i < supplementalImages.length; i++) {
+              images.push(supplementalImages[i])
+            }
+          }
+          
+          console.log('最终图片数组:', images)
+          
+          // 映射字段：数据库shop_id对应本地merchant_id
+          const merchantId = dbProduct.shop_id || dbProduct.merchant_id || 'merchant_001'
+          
+          // 确保数值字段有效
+          const price = typeof dbProduct.price === 'number' ? dbProduct.price : 0
+          const stock = (dbProduct.stock != null && !isNaN(Number(dbProduct.stock))) ? Math.floor(Number(dbProduct.stock)) : 100
+          const sales = (dbProduct.sales != null && !isNaN(Number(dbProduct.sales))) ? Math.floor(Number(dbProduct.sales)) : 50
+
+          this.product = {
+              id: dbProduct.id || productId,
+              merchant_id: merchantId,
+              category_id: dbProduct.category_id || 'cat_001',
+              name: dbProduct.name || '商品名称',
+              description: dbProduct.description || '这是一个高品质的商品，具有优秀的性能和优美的外观设计。采用环保材料，经过严格质检，保证用户的使用体验。',
+              images: images,
+              price: price,
+              original_price: (dbProduct.original_price != null && !isNaN(Number(dbProduct.original_price))) ? Number(dbProduct.original_price) : null,
+              stock: stock,
+              sales: sales,
+              status: 1,
+              created_at: dbProduct.created_at || '2024-01-01'
+          } as ProductType
+          console.log('页面 product 对象已更新:', this.product)
+          console.log('商品图片数组:', this.product.images)
+          console.log('商品价格:', this.product.price, '库存:', this.product.stock, '销量:', this.product.sales)
+        }
+      } else {
+        console.log('数据库无数据或加载失败，使用模拟数据')
+        // 数据库无数据时，使用原有模拟逻辑
+        const generatePriceFromId = (id: string): number => {
+            let hash = 0
+            for (let i = 0; i < id.length; i++) {
+            hash = (hash << 5) - hash + id.charCodeAt(i)
+            hash |= 0
+            }
+            const price = 50 + Math.abs(hash % 450)
+            return parseFloat(price.toFixed(2))
+        }
+
+        const basePrice = options.price ? parseFloat(options.price) : generatePriceFromId(productId)
+        const originalPrice = options.originalPrice ? parseFloat(options.originalPrice) : parseFloat((basePrice * 1.2).toFixed(2))
+        
+        const productName = options.name ? decodeURIComponent(options.name) : (() => {
+            const productNames = ['高品质运动休闲鞋', '时尚简约双肩背包', '多功能智能手环', '便携式蓝牙音箱', '全自动雨伞', '抗菌防螨床上四件套', '不锈钢保温杯', '无线充电器', '高清行车记录仪', '智能体脂秤']
+            const nameIndex = Math.abs(productId.split('').reduce((acc, char) => acc + char.charCodeAt(0), 0)) % productNames.length
+            return productNames[nameIndex]
+        })()
+        
+        const productImage = options.image ? decodeURIComponent(options.image) : '/static/product1.jpg'
+        
+        const sales = 1000 + Math.abs(productId.split('').reduce((acc, char) => acc + char.charCodeAt(0), 0)) % 5000
+        const stock = 50 + Math.abs(productId.split('').reduce((acc, char) => acc + char.charCodeAt(0), 0)) % 200
+        
+        this.product = {
+            id: productId,
+            merchant_id: 'merchant_' + (Math.abs(productId.split('').reduce((acc, char) => acc + char.charCodeAt(0), 0)) % 5 + 1).toString().padStart(3, '0'),
+            category_id: 'cat_' + (Math.abs(productId.split('').reduce((acc, char) => acc + char.charCodeAt(0), 0)) % 10 + 1).toString().padStart(3, '0'),
+            name: productName,
+            description: '这是一个高品质的商品，具有优秀的性能和优美的外观设计。采用环保材料，经过严格质检，保证用户的使用体验。',
+            images: [productImage, '/static/product2.jpg', '/static/product3.jpg'],
+            price: basePrice,
+            original_price: originalPrice,
+            stock: stock,
+            sales: sales,
+            status: 1,
+            created_at: '2024-01-15'
+        }
+      }
+      
+      // 根据商家ID生成不同的商家信息
+      const merchantIndex = Math.abs(this.product.merchant_id.split('').reduce((acc, char) => acc + char.charCodeAt(0), 0)) % 5
+      const shopNames = ['优质好店', '品牌直营店', '官方旗舰店', '专卖店', '精品小店']
+      const shopDescriptions = [
+        '专注品质生活',
+        '品牌官方直营，正品保障',
+        '厂家直销，价格优惠',
+        '专注本领域十年老店',
+        '用心服务每一位顾客'
+      ]
+      const contactNames = ['店主小王', '店长小李', '经理小张', '客服小赵', '老板小钱']
+      
+      this.merchant = {
+        id: this.product.merchant_id,
+        user_id: 'user_' + (merchantIndex + 1).toString().padStart(3, '0'),
+        shop_name: shopNames[merchantIndex],
+        shop_logo: '/static/shop-logo.png',
+        shop_banner: '/static/shop-banner.png',
+        shop_description: shopDescriptions[merchantIndex],
+        contact_name: contactNames[merchantIndex],
+        contact_phone: '138' + (10000000 + merchantIndex * 1111111).toString().substring(0, 8),
+        shop_status: 1,
+        rating: 4.5 + (merchantIndex * 0.1),
+        total_sales: 10000 + merchantIndex * 5000,
+        created_at: '2023-06-01'
+      }
+      
+      this.loadProductSkus(productId)
+    },
+    
+    loadProductSkus(productId: string) {
+      // 模拟加载商品SKU数据
+      const basePrice = this.product.price
+      
+      // 使用 productId 作为前缀生成唯一的 SKU ID，防止不同商品的 SKU ID 冲突
+      this.productSkus = [
+        {
+          id: `${productId}_sku_001`,
+          product_id: productId,
+          sku_code: 'SKU001',
+          specifications: { color: '红色', size: 'M' },
+          price: basePrice,
+          stock: 50,
+          image_url: '/static/sku1.jpg',
+          status: 1
+        },
+        {
+          id: `${productId}_sku_002`,
+          product_id: productId,
+          sku_code: 'SKU002',
+          specifications: { color: '蓝色', size: 'L' },
+          price: parseFloat((basePrice * 1.1).toFixed(2)),
+          stock: 30,
+          image_url: '/static/sku2.jpg',
+          status: 1
+        }
+      ]
+    },
+
+    onSwiperChange(e: any) {
+      this.currentImageIndex = e.detail.current
+    },
+    
+    showSpecModal() {
+      this.showSpec = true
+    },
+    
+    hideSpecModal() {
+      this.showSpec = false
+    },
+    
+    selectSku(sku: ProductSkuType) {
+      this.selectedSkuId = sku.id
+      this.selectedSpec = this.getSkuSpecText(sku)
+      this.hideSpecModal()
+    },
+    
+    getSkuSpecText(sku: ProductSkuType): string {
+      if (sku.specifications) {
+        const specs: any = sku.specifications
+        return Object.keys(specs).map(key => `${key}: ${specs[key]}`).join(', ')
+      }
+      return sku.sku_code
+    },
+    
+    addToCart() {
+      if (!this.selectedSkuId) {
+        uni.showToast({
+          title: '请选择规格',
+          icon: 'none'
+        })
+        return
+      }
+      
+      // 获取现有购物车数据
+      const cartData = uni.getStorageSync('cart')
+      let cartItems: any[] = []
+      
+      if (cartData) {
+        try {
+          cartItems = JSON.parse(cartData as string) as any[]
+        } catch (e) {
+          console.error('解析购物车数据失败', e)
+        }
+      }
+      
+      // 检查商品是否已存在 (同一SKU)
+      const existingItem = cartItems.find((item: any) => item.id === this.selectedSkuId)
+      
+      if (existingItem) {
+        existingItem.quantity += this.quantity
+      } else {
+        // 查找SKU信息
+        const sku = this.productSkus.find(s => s.id === this.selectedSkuId)
+        
+        // 添加新商品
+        cartItems.push({
+          id: this.selectedSkuId, // 使用SKU ID作为购物车条目ID
+          productId: this.product.id,
+          shopId: this.merchant.id,
+          shopName: this.merchant.shop_name,
+          name: this.product.name,
+          price: sku ? sku.price : this.product.price,
+          image: (sku && sku.image_url) ? sku.image_url : this.product.images[0],
+          spec: this.selectedSpec,
+          quantity: this.quantity,
+          selected: true
+        })
+      }
+      
+      // 保存回存储
+      uni.setStorageSync('cart', JSON.stringify(cartItems))
+      
+      // 模拟添加到购物车
+      uni.showToast({
+        title: '已添加到购物车',
+        icon: 'success'
+      })
+    },
+    
+    buyNow() {
+      if (!this.selectedSkuId) {
+        uni.showToast({
+          title: '请选择规格',
+          icon: 'none'
+        })
+        return
+      }
+      
+      const sku = this.productSkus.find(s => s.id === this.selectedSkuId)
+      
+	// 调试：打印价格信息
+	console.log('立即购买 - 商品价格信息:')
+	console.log('SKU价格:', sku ? sku.price : '无SKU')
+	console.log('商品价格:', this.product.price)
+	console.log('选择的价格:', (sku ? sku.price : this.product.price))
+	console.log('数量:', this.quantity)
+	
+	const selectedItem = {
+		id: this.selectedSkuId,
+		product_id: this.product.id,
+		sku_id: this.selectedSkuId,
+		product_name: this.product.name,
+		product_image: (sku && sku.image_url) ? sku.image_url : this.product.images[0],
+		sku_specifications: sku ? sku.specifications : {},
+		price: Number(parseFloat((sku ? sku.price : this.product.price).toString()).toFixed(2)),
+		quantity: Number(this.quantity)
+	}
+	
+	// 调试：打印最终传递的数据
+	console.log('立即购买 - 传递的商品数据:', selectedItem)
+
+      // 使用Storage传递数据，避免EventChannel可能的问题
+      uni.setStorageSync('checkout_type', 'buy_now')
+      uni.setStorageSync('checkout_items', JSON.stringify([selectedItem]))
+
+      // 跳转到订单确认页
+      uni.navigateTo({
+        url: '/pages/mall/consumer/checkout',
+        success: (res) => {
+            res.eventChannel.emit('acceptData', {
+                selectedItems: [selectedItem]
+            })
+        }
+      })
+    },
+    
+    goToShop() {
+      uni.navigateTo({
+        url: `/pages/mall/consumer/shop-detail?merchantId=${this.merchant.id}`
+      })
+    },
+
+    checkFavoriteStatus(id: string) {
+      const storedFavorites = uni.getStorageSync('favorites')
+      if (storedFavorites) {
+        try {
+          const favorites = JSON.parse(storedFavorites as string) as any[]
+          this.isFavorite = favorites.some(item => item.id === id)
+        } catch (e) {
+          console.error('Failed to parse favorites', e)
+        }
+      }
+    },
+
+    toggleFavorite() {
+      const storedFavorites = uni.getStorageSync('favorites')
+      let favorites: any[] = []
+      
+      if (storedFavorites) {
+        try {
+          favorites = JSON.parse(storedFavorites as string) as any[]
+        } catch (e) {
+          console.error('Failed to parse favorites', e)
+        }
+      }
+      
+      if (this.isFavorite) {
+        // 取消收藏
+        favorites = favorites.filter(item => item.id !== this.product.id)
+        uni.showToast({
+          title: '已取消收藏',
+          icon: 'none'
+        })
+      } else {
+        // 添加收藏
+        favorites.push({
+          id: this.product.id,
+          name: this.product.name,
+          price: this.product.price,
+          original_price: this.product.original_price, // 保存原价
+          image: this.product.images[0],
+          sales: this.product.sales,
+          shopId: this.merchant.id,
+          shopName: this.merchant.shop_name
+        })
+        uni.showToast({
+          title: '收藏成功',
+          icon: 'success'
+        })
+      }
+      
+      uni.setStorageSync('favorites', JSON.stringify(favorites))
+      this.isFavorite = !this.isFavorite
+    },
+
+    goToHome() {
+      uni.switchTab({
+        url: '/pages/mall/consumer/home'
+      })
+    },
+
+    goToCart() {
+      uni.switchTab({
+        url: '/pages/mall/consumer/cart'
+      })
+    },
+
+    // 数量选择相关方法
+    decreaseQuantity() {
+      if (this.quantity > 1) {
+        this.quantity--
+      }
+    },
+    
+    increaseQuantity() {
+      const maxQuantity = this.getMaxQuantity()
+      if (this.quantity < maxQuantity) {
+        this.quantity++
+      } else {
+        uni.showToast({
+          title: `最多只能购买${maxQuantity}件`,
+          icon: 'none'
+        })
+      }
+    },
+    
+    validateQuantity() {
+      // 确保数量是数字
+      let num = parseInt(this.quantity)
+      if (isNaN(num)) {
+        num = 1
+      }
+      
+      // 限制在1和最大库存之间
+      const maxQuantity = this.getMaxQuantity()
+      if (num < 1) {
+        num = 1
+      } else if (num > maxQuantity) {
+        num = maxQuantity
+        uni.showToast({
+          title: `最多只能购买${maxQuantity}件`,
+          icon: 'none'
+        })
+      }
+      
+      this.quantity = num
+    },
+    
+    getMaxQuantity() {
+      // 如果有选择SKU，使用SKU的库存，否则使用商品总库存
+      if (this.selectedSkuId) {
+        const sku = this.productSkus.find(s => s.id === this.selectedSkuId)
+        if (sku) return sku.stock
+      }
+      return this.product.stock
+    },
+    
+    getAvailableStock() {
+      return this.getMaxQuantity()
+    },
+    
+    previewImage(index: number) {
+      uni.previewImage({
+        current: index,
+        urls: this.product.images
+      })
+    }
+  }
+}
+</script>
+
+<style>
+.product-detail-page {
+  background-color: #f5f5f5;
+  min-height: 100vh;
+  padding-bottom: 120rpx;
+}
+
+.product-images {
+  position: relative;
+  height: 750rpx;
+  background-color: #fff;
+}
+
+.image-swiper {
+  width: 100%;
+  height: 100%;
+}
+
+.product-image {
+  width: 100%;
+  height: 100%;
+}
+
+.image-indicator {
+  position: absolute;
+  bottom: 20rpx;
+  right: 20rpx;
+  background-color: rgba(0, 0, 0, 0.5);
+  color: #fff;
+  padding: 10rpx 20rpx;
+  border-radius: 20rpx;
+  font-size: 24rpx;
+}
+
+.product-info {
+  background-color: #fff;
+  padding: 30rpx;
+  margin-bottom: 20rpx;
+}
+
+.price-section {
+  margin-bottom: 20rpx;
+}
+
+.current-price {
+  font-size: 48rpx;
+  font-weight: bold;
+  color: #ff4444;
+  margin-right: 20rpx;
+}
+
+.original-price {
+  font-size: 28rpx;
+  color: #999;
+  text-decoration: line-through;
+}
+
+.product-name {
+  font-size: 32rpx;
+  font-weight: bold;
+  color: #333;
+  line-height: 1.4;
+  margin-bottom: 15rpx;
+}
+
+.sales-info {
+  font-size: 26rpx;
+  color: #666;
+}
+
+.shop-info {
+  background-color: #fff;
+  padding: 30rpx;
+  margin-bottom: 20rpx;
+  display: flex;
+  flex-direction: row; /* 显式横向排列 */
+  align-items: center;
+}
+
+.shop-logo {
+  width: 80rpx;
+  height: 80rpx;
+  border-radius: 10rpx;
+  margin-right: 20rpx;
+}
+
+.shop-details {
+  flex: 1;
+  display: flex;
+  flex-direction: column; /* 内部信息保持纵向，或者根据需要改为横向 */
+  justify-content: center;
+}
+
+.shop-name {
+  font-size: 30rpx;
+  font-weight: bold;
+  color: #333;
+  margin-bottom: 10rpx;
+}
+
+.shop-stats-row {
+  display: flex;
+  flex-direction: row; /* 显式横向排列 */
+  align-items: center;
+}
+
+.rating-text, .sales-text {
+  font-size: 24rpx;
+  color: #666;
+  margin-right: 30rpx;
+}
+
+.enter-shop {
+  font-size: 26rpx;
+  color: #666;
+}
+
+.spec-section {
+  background-color: #fff;
+  padding: 30rpx;
+  margin-bottom: 20rpx;
+  display: flex;
+  align-items: center;
+}
+
+.spec-title {
+  font-size: 30rpx;
+  color: #333;
+  width: 120rpx;
+}
+
+.spec-selected {
+  flex: 1;
+  font-size: 28rpx;
+  color: #666;
+}
+
+.spec-arrow {
+  font-size: 28rpx;
+  color: #999;
+}
+
+.quantity-section {
+  background-color: #fff;
+  padding: 30rpx;
+  margin-bottom: 20rpx;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+}
+
+.quantity-title {
+  font-size: 30rpx;
+  color: #333;
+  width: 120rpx;
+}
+
+.quantity-selector {
+  display: flex;
+  align-items: center;
+  border: 1rpx solid #e5e5e5;
+  border-radius: 8rpx;
+  overflow: hidden;
+}
+
+.quantity-btn {
+  width: 60rpx;
+  height: 60rpx;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background-color: #f5f5f5;
+}
+
+.quantity-btn.minus {
+  border-right: 1rpx solid #e5e5e5;
+}
+
+.quantity-btn.plus {
+  border-left: 1rpx solid #e5e5e5;
+}
+
+.quantity-btn-text {
+  font-size: 28rpx;
+  color: #333;
+}
+
+.quantity-input {
+  width: 80rpx;
+  height: 60rpx;
+  text-align: center;
+  font-size: 28rpx;
+  color: #333;
+  border: none;
+  background-color: #fff;
+}
+
+.quantity-stock {
+  font-size: 24rpx;
+  color: #666;
+}
+
+.product-description {
+  background-color: #fff;
+  padding: 30rpx;
+  margin-bottom: 20rpx;
+}
+
+.section-title {
+  font-size: 32rpx;
+  font-weight: bold;
+  color: #333;
+  margin-bottom: 20rpx;
+}
+
+.description-text {
+  font-size: 28rpx;
+  color: #666;
+  line-height: 1.6;
+}
+
+.bottom-actions {
+  position: fixed;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  background-color: #fff;
+  padding: 10rpx 20rpx;
+  box-shadow: 0 -2rpx 10rpx rgba(0, 0, 0, 0.1);
+  display: flex;
+  flex-direction: row; /* 显式设置横向排列 */
+  align-items: center;
+  justify-content: space-between;
+}
+
+.action-buttons {
+  display: flex;
+  flex-direction: row; /* 显式设置横向排列 */
+  align-items: center;
+  margin-right: 20rpx;
+}
+
+.action-btn {
+  display: flex;
+  flex-direction: column; /* 图标文字保持纵向 */
+  align-items: center;
+  justify-content: center;
+  margin-right: 20rpx;
+  min-width: 80rpx;
+}
+
+.action-icon {
+  font-size: 40rpx;
+  margin-bottom: 4rpx;
+}
+
+.action-text {
+  font-size: 20rpx;
+  color: #666;
+}
+
+.btn-group {
+  flex: 1;
+  display: flex;
+  flex-direction: row; /* 显式设置横向排列 */
+  align-items: center;
+}
+
+.cart-btn, .buy-btn {
+  flex: 1;
+  height: 72rpx;
+  line-height: 72rpx;
+  border-radius: 36rpx;
+  font-size: 26rpx;
+  border: none;
+  margin: 0 10rpx;
+}
+
+.cart-btn {
+  background-color: #ffa726;
+  color: #fff;
+}
+
+.buy-btn {
+  background-color: #ff4444;
+  color: #fff;
+}
+
+.spec-modal {
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background-color: rgba(0, 0, 0, 0.5);
+  display: flex;
+  align-items: flex-end;
+  z-index: 999;
+}
+
+.spec-content {
+  background-color: #fff;
+  width: 100%;
+  max-height: 80vh;
+  border-radius: 20rpx 20rpx 0 0;
+  padding: 30rpx;
+}
+
+.spec-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin-bottom: 30rpx;
+  padding-bottom: 20rpx;
+  border-bottom: 1rpx solid #eee;
+}
+
+.spec-title {
+  font-size: 32rpx;
+  font-weight: bold;
+  color: #333;
+}
+
+.close-btn {
+  font-size: 48rpx;
+  color: #999;
+}
+
+.spec-list {
+  max-height: 60vh;
+  overflow-y: auto;
+}
+
+.spec-item {
+  display: flex;
+  align-items: center;
+  padding: 25rpx 0;
+  border-bottom: 1rpx solid #f5f5f5;
+}
+
+.spec-item.active {
+  background-color: #fff3e0;
+}
+
+.spec-name {
+  flex: 1;
+  font-size: 28rpx;
+  color: #333;
+}
+
+.spec-price {
+  font-size: 26rpx;
+  color: #ff4444;
+  margin-right: 20rpx;
+}
+
+.spec-stock {
+  font-size: 24rpx;
+  color: #666;
+  width: 100rpx;
+  text-align: right;
+}
+
+/* 商品详情图片样式 */
+.detail-images {
+  margin-top: 30rpx;
+}
+
+.detail-image {
+  width: 100%;
+  margin-bottom: 20rpx;
+  border-radius: 10rpx;
+  box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.1);
+}
+</style>
diff --git a/pages/mall/consumer/product-detail - 副本.uvue b/pages/mall/consumer/product-detail copy完成商品详情数据获取.uvue
similarity index 72%
rename from pages/mall/consumer/product-detail - 副本.uvue
rename to pages/mall/consumer/product-detail copy完成商品详情数据获取.uvue
index 500dd3ed..63b4a9ad 100644
--- a/pages/mall/consumer/product-detail - 副本.uvue	
+++ b/pages/mall/consumer/product-detail copy完成商品详情数据获取.uvue	
@@ -109,6 +109,7 @@
 
 <script>
 import { ProductType, MerchantType, ProductSkuType } from '@/types/mall-types.uts'
+import { supabaseService } from '@/utils/supabaseService.uts'
 
 export default {
   data() {
@@ -238,69 +239,171 @@ export default {
       uni.setStorageSync('footprints', JSON.stringify(footprints))
     },
     
-    loadProductDetail(productId: string, options: any = {}) {
-      // 根据商品ID生成一个基础价格（如果没有传入价格）
-      const generatePriceFromId = (id: string): number => {
-        // 简单哈希函数，将字符串转换为一个在50-500之间的价格
-        let hash = 0
-        for (let i = 0; i < id.length; i++) {
-          hash = (hash << 5) - hash + id.charCodeAt(i)
-          hash |= 0 // 转换为32位整数
+    async loadProductDetail(productId: string, options: any = {}) {
+      // 尝试从数据库加载
+      let dbProductRaw = null
+      try {
+        console.log('正在尝试从数据库加载商品详情:', productId)
+        dbProductRaw = await supabaseService.getProductById(productId)
+        console.log('数据库返回的商品详情 (原始数据):', dbProductRaw)
+        
+        // 调试：打印数据库返回的所有字段
+        if (dbProductRaw) {
+          console.log('数据库返回字段详情:')
+          if (Array.isArray(dbProductRaw)) {
+            console.log('返回数据是数组，长度:', dbProductRaw.length)
+            if (dbProductRaw.length > 0) {
+              const firstItem = dbProductRaw[0]
+              console.log('数组第一个元素:', firstItem)
+              for (const key in firstItem) {
+                console.log(`  ${key}:`, firstItem[key], typeof firstItem[key])
+              }
+            }
+          } else {
+            console.log('返回数据是对象')
+            for (const key in dbProductRaw) {
+              console.log(`  ${key}:`, dbProductRaw[key], typeof dbProductRaw[key])
+            }
+          }
         }
-        // 将哈希值映射到50-500之间
-        const price = 50 + Math.abs(hash % 450)
-        // 保留两位小数
-        return parseFloat(price.toFixed(2))
+      } catch (e) {
+        console.error('Failed to load product from DB', e)
       }
 
-      // 优先使用传入的参数，否则根据商品ID生成价格
-      const basePrice = options.price ? parseFloat(options.price) : generatePriceFromId(productId)
-      // 原价比现价高20%左右
-      const originalPrice = options.originalPrice ? parseFloat(options.originalPrice) : parseFloat((basePrice * 1.2).toFixed(2))
-      
-      // 优先使用传入的商品名称，否则根据商品ID生成名称
-      const productName = options.name ? decodeURIComponent(options.name) : (() => {
-        // 如果options.name未传入，使用默认的商品名称生成逻辑
-        const productNames = [
-          '高品质运动休闲鞋',
-          '时尚简约双肩背包',
-          '多功能智能手环',
-          '便携式蓝牙音箱',
-          '全自动雨伞',
-          '抗菌防螨床上四件套',
-          '不锈钢保温杯',
-          '无线充电器',
-          '高清行车记录仪',
-          '智能体脂秤'
-        ]
-        const nameIndex = Math.abs(productId.split('').reduce((acc, char) => acc + char.charCodeAt(0), 0)) % productNames.length
-        return productNames[nameIndex]
-      })()
-      
-      // 优先使用传入的图片，否则使用默认图片
-      const productImage = options.image ? decodeURIComponent(options.image) : '/static/product1.jpg'
-      
-      // 模拟销量和库存，使其更真实
-      const sales = 1000 + Math.abs(productId.split('').reduce((acc, char) => acc + char.charCodeAt(0), 0)) % 5000
-      const stock = 50 + Math.abs(productId.split('').reduce((acc, char) => acc + char.charCodeAt(0), 0)) % 200
-      
-      this.product = {
-        id: productId,
-        merchant_id: 'merchant_' + (Math.abs(productId.split('').reduce((acc, char) => acc + char.charCodeAt(0), 0)) % 5 + 1).toString().padStart(3, '0'),
-        category_id: 'cat_' + (Math.abs(productId.split('').reduce((acc, char) => acc + char.charCodeAt(0), 0)) % 10 + 1).toString().padStart(3, '0'),
-        name: productName,
-        description: '这是一个高品质的商品，具有优秀的性能和优美的外观设计。采用环保材料，经过严格质检，保证用户的使用体验。',
-        images: [
-          productImage,
-          '/static/product2.jpg',
-          '/static/product3.jpg'
-        ],
-        price: basePrice,
-        original_price: originalPrice,
-        stock: stock,
-        sales: sales,
-        status: 1,
-        created_at: '2024-01-15'
+      // 处理数据库返回数据：可能是数组或对象
+      let dbProduct = null
+      if (dbProductRaw) {
+        if (Array.isArray(dbProductRaw)) {
+          if (dbProductRaw.length > 0) {
+            dbProduct = dbProductRaw[0] // 取数组第一个元素
+          } else {
+            console.warn('数据库返回空数组')
+          }
+        } else {
+          dbProduct = dbProductRaw // 已经是对象
+        }
+      }
+
+      if (dbProduct) {
+        console.log('使用数据库数据渲染页面')
+        
+        // 调试：打印dbProduct的详细结构和类型
+        console.log('dbProduct类型:', typeof dbProduct)
+        console.log('dbProduct原型:', Object.getPrototypeOf(dbProduct))
+        console.log('dbProduct的键:')
+        for (let key in dbProduct) {
+          console.log('  ', key, ':', dbProduct[key], '类型:', typeof dbProduct[key])
+        }
+        
+        // 验证必要字段，如果关键字段缺失则使用模拟数据
+        // 注意：数据库返回的字段可能与本地ProductType不完全匹配
+        console.log('验证必要字段，dbProduct:', dbProduct)
+        
+        // 尝试多种方式访问属性
+        const idValue = dbProduct.id !== undefined ? dbProduct.id : (dbProduct['id'] !== undefined ? dbProduct['id'] : undefined)
+        const nameValue = dbProduct.name !== undefined ? dbProduct.name : (dbProduct['name'] !== undefined ? dbProduct['name'] : undefined)
+        const priceValue = dbProduct.price !== undefined ? dbProduct.price : (dbProduct['price'] !== undefined ? dbProduct['price'] : undefined)
+        
+        const hasId = idValue !== undefined && idValue !== null
+        const hasName = nameValue !== undefined && nameValue !== null
+        const hasPrice = priceValue !== undefined && priceValue !== null
+        
+        const hasRequiredFields = dbProduct && hasId && hasName && hasPrice
+        console.log('字段检查 - id:', idValue, 'hasId:', hasId, 'name:', nameValue, 'hasName:', hasName, 'price:', priceValue, 'hasPrice:', hasPrice)
+        console.log('hasRequiredFields:', hasRequiredFields)
+        
+        if (!hasRequiredFields) {
+          console.warn('数据库返回数据缺少必要字段，使用模拟数据')
+          // 继续执行，会进入下面的else分支
+          dbProduct = null
+        } else {
+          // 更新dbProduct的字段为实际值，确保后续使用正确的属性访问
+          if (dbProduct.id === undefined && idValue !== undefined) dbProduct.id = idValue
+          if (dbProduct.name === undefined && nameValue !== undefined) dbProduct.name = nameValue
+          if (dbProduct.price === undefined && priceValue !== undefined) dbProduct.price = priceValue
+          // 使用数据库数据 - 处理字段映射
+          // 数据库Product接口和本地ProductType接口字段可能不同
+          const images = [] as Array<string>
+          
+          // 处理图片字段：数据库可能是image，本地需要images数组
+          if (dbProduct.image) {
+            images.push(dbProduct.image)
+          } else if (options.image) {
+            images.push(decodeURIComponent(options.image as string))
+          } else {
+            images.push('/static/product1.jpg')
+          }
+          
+          // 补充模拟图片
+          images.push('/static/product2.jpg')
+          images.push('/static/product3.jpg')
+          
+          // 映射字段：数据库shop_id对应本地merchant_id
+          const merchantId = dbProduct.shop_id || dbProduct.merchant_id || 'merchant_001'
+          
+          // 确保数值字段有效
+          const price = typeof dbProduct.price === 'number' ? dbProduct.price : 0
+          const stock = (dbProduct.stock != null && !isNaN(Number(dbProduct.stock))) ? Math.floor(Number(dbProduct.stock)) : 100
+          const sales = (dbProduct.sales != null && !isNaN(Number(dbProduct.sales))) ? Math.floor(Number(dbProduct.sales)) : 50
+
+          this.product = {
+              id: dbProduct.id || productId,
+              merchant_id: merchantId,
+              category_id: dbProduct.category_id || 'cat_001',
+              name: dbProduct.name || '商品名称',
+              description: dbProduct.description || '这是一个高品质的商品，具有优秀的性能和优美的外观设计。采用环保材料，经过严格质检，保证用户的使用体验。',
+              images: images,
+              price: price,
+              original_price: (dbProduct.original_price != null && !isNaN(Number(dbProduct.original_price))) ? Number(dbProduct.original_price) : null,
+              stock: stock,
+              sales: sales,
+              status: 1,
+              created_at: dbProduct.created_at || '2024-01-01'
+          } as ProductType
+          console.log('页面 product 对象已更新:', this.product)
+          console.log('商品价格:', this.product.price, '库存:', this.product.stock, '销量:', this.product.sales)
+        }
+      } else {
+        console.log('数据库无数据或加载失败，使用模拟数据')
+        // 数据库无数据时，使用原有模拟逻辑
+        const generatePriceFromId = (id: string): number => {
+            let hash = 0
+            for (let i = 0; i < id.length; i++) {
+            hash = (hash << 5) - hash + id.charCodeAt(i)
+            hash |= 0
+            }
+            const price = 50 + Math.abs(hash % 450)
+            return parseFloat(price.toFixed(2))
+        }
+
+        const basePrice = options.price ? parseFloat(options.price) : generatePriceFromId(productId)
+        const originalPrice = options.originalPrice ? parseFloat(options.originalPrice) : parseFloat((basePrice * 1.2).toFixed(2))
+        
+        const productName = options.name ? decodeURIComponent(options.name) : (() => {
+            const productNames = ['高品质运动休闲鞋', '时尚简约双肩背包', '多功能智能手环', '便携式蓝牙音箱', '全自动雨伞', '抗菌防螨床上四件套', '不锈钢保温杯', '无线充电器', '高清行车记录仪', '智能体脂秤']
+            const nameIndex = Math.abs(productId.split('').reduce((acc, char) => acc + char.charCodeAt(0), 0)) % productNames.length
+            return productNames[nameIndex]
+        })()
+        
+        const productImage = options.image ? decodeURIComponent(options.image) : '/static/product1.jpg'
+        
+        const sales = 1000 + Math.abs(productId.split('').reduce((acc, char) => acc + char.charCodeAt(0), 0)) % 5000
+        const stock = 50 + Math.abs(productId.split('').reduce((acc, char) => acc + char.charCodeAt(0), 0)) % 200
+        
+        this.product = {
+            id: productId,
+            merchant_id: 'merchant_' + (Math.abs(productId.split('').reduce((acc, char) => acc + char.charCodeAt(0), 0)) % 5 + 1).toString().padStart(3, '0'),
+            category_id: 'cat_' + (Math.abs(productId.split('').reduce((acc, char) => acc + char.charCodeAt(0), 0)) % 10 + 1).toString().padStart(3, '0'),
+            name: productName,
+            description: '这是一个高品质的商品，具有优秀的性能和优美的外观设计。采用环保材料，经过严格质检，保证用户的使用体验。',
+            images: [productImage, '/static/product2.jpg', '/static/product3.jpg'],
+            price: basePrice,
+            original_price: originalPrice,
+            stock: stock,
+            sales: sales,
+            status: 1,
+            created_at: '2024-01-15'
+        }
       }
       
       // 根据商家ID生成不同的商家信息
diff --git a/pages/mall/consumer/product-detail copy完成图片数量数据获取.uvue b/pages/mall/consumer/product-detail copy完成图片数量数据获取.uvue
new file mode 100644
index 00000000..1049c5b2
--- /dev/null
+++ b/pages/mall/consumer/product-detail copy完成图片数量数据获取.uvue	
@@ -0,0 +1,1359 @@
+<!-- 消费者端 - 商品详情页 -->
+<template>
+  <view class="product-detail-page">
+    <!-- 商品图片轮播 -->
+    <view class="product-images">
+      <swiper class="image-swiper" :indicator-dots="true" :autoplay="false" @change="onSwiperChange">
+        <swiper-item v-for="(image, index) in product.images" :key="index">
+          <image :src="image" class="product-image" mode="aspectFit" />
+        </swiper-item>
+      </swiper>
+      <view class="image-indicator">{{ currentImageIndex + 1 }} / {{ product.images.length }}</view>
+    </view>
+
+    <!-- 商品基本信息 -->
+    <view class="product-info">
+      <view class="price-section">
+        <text class="current-price">¥{{ product.price }}</text>
+        <text v-if="product.original_price" class="original-price">¥{{ product.original_price }}</text>
+      </view>
+      <text class="product-name">{{ product.name }}</text>
+      <text class="sales-info">已售{{ product.sales }}件 · 库存{{ product.stock }}件</text>
+    </view>
+
+    <!-- 店铺信息 -->
+    <view class="shop-info" @click="goToShop">
+      <image :src="merchant.shop_logo || '/static/default-shop.png'" class="shop-logo" />
+      <view class="shop-details">
+        <text class="shop-name" @click.stop="goToShop">{{ merchant.shop_name }}</text>
+        <view class="shop-stats-row">
+           <text class="rating-text">评分: {{ merchant.rating.toFixed(1) }}</text>
+           <text class="sales-text">销量: {{ merchant.total_sales }}</text>
+        </view>
+      </view>
+      <text class="enter-shop" @click.stop="goToShop">进店 ></text>
+    </view>
+
+    <!-- 功能主治（药品功能） -->
+    <view class="function-section" v-if="product.usage">
+      <text class="function-title">功能主治</text>
+      <text class="function-content">{{ product.usage }}</text>
+    </view>
+
+    <!-- 商品参数 -->
+    <view class="params-section" @click="showParamsModal">
+      <text class="params-title">商品参数</text>
+      <view class="params-summary">
+        <text class="params-item" v-if="product.specification">规格: {{ product.specification }}</text>
+        <text class="params-item" v-if="product.expiry_date">有效期: {{ product.expiry_date }}</text>
+        <text class="params-item" v-if="product.approval_number">批准文号: {{ product.approval_number }}</text>
+      </view>
+      <text class="params-arrow">></text>
+    </view>
+
+    <!-- 规格选择 -->
+    <view class="spec-section" @click="showSpecModal">
+      <text class="spec-title">规格</text>
+      <text class="spec-selected">{{ selectedSpec || '请选择规格' }}</text>
+      <text class="spec-arrow">></text>
+    </view>
+
+    <!-- 数量选择 -->
+    <view class="quantity-section">
+      <text class="quantity-title">数量</text>
+      <view class="quantity-selector">
+        <view class="quantity-btn minus" @click="decreaseQuantity">
+          <text class="quantity-btn-text">-</text>
+        </view>
+        <input class="quantity-input" 
+               type="number" 
+               v-model="quantity" 
+               :min="1" 
+               :max="getMaxQuantity()"
+               @input="validateQuantity" />
+        <view class="quantity-btn plus" @click="increaseQuantity">
+          <text class="quantity-btn-text">+</text>
+        </view>
+      </view>
+      <text class="quantity-stock">库存{{ getAvailableStock() }}件</text>
+    </view>
+
+    <!-- 商品详情 -->
+    <view class="product-description">
+      <view class="section-title">商品详情</view>
+      <text class="description-text">{{ product.description || '暂无详细描述' }}</text>
+      <!-- 商品详情图片 -->
+      <view class="detail-images" v-if="product.images && product.images.length > 0">
+        <image v-for="(img, index) in product.images" 
+               :key="index" 
+               :src="img" 
+               class="detail-image" 
+               mode="widthFix" 
+               @click="previewImage(index)" />
+      </view>
+    </view>
+
+    <!-- 底部操作栏 -->
+    <view class="bottom-actions">
+      <view class="action-buttons">
+        <view class="action-btn" @click="goToCart">
+          <text class="action-icon">🛒</text>
+          <text class="action-text">购物车</text>
+        </view>
+        <view class="action-btn" @click="toggleFavorite">
+          <text class="action-icon">{{ isFavorite ? '❤️' : '🤍' }}</text>
+          <text class="action-text">{{ isFavorite ? '已收藏' : '收藏' }}</text>
+        </view>
+      </view>
+      <view class="btn-group">
+        <button class="cart-btn" @click="addToCart">加入购物车</button>
+        <button class="buy-btn" @click="buyNow">立即购买</button>
+      </view>
+    </view>
+
+    <!-- 规格选择弹窗 -->
+    <view v-if="showSpec" class="spec-modal" @click="hideSpecModal">
+      <view class="spec-content" @click.stop>
+        <view class="spec-header">
+          <text class="spec-title">选择规格</text>
+          <text class="close-btn" @click="hideSpecModal">×</text>
+        </view>
+        <view class="spec-list">
+          <view v-for="sku in productSkus" :key="sku.id" 
+                class="spec-item" 
+                :class="{ active: selectedSkuId === sku.id }"
+                @click="selectSku(sku)">
+            <text class="spec-name">{{ getSkuSpecText(sku) }}</text>
+            <text class="spec-price">¥{{ sku.price }}</text>
+            <text class="spec-stock">库存{{ sku.stock }}</text>
+          </view>
+        </view>
+      </view>
+    </view>
+
+    <!-- 商品参数弹窗 -->
+    <view v-if="showParams" class="params-modal" @click="hideParamsModal">
+      <view class="params-content" @click.stop>
+        <view class="params-header">
+          <text class="params-title">商品参数</text>
+          <text class="close-btn" @click="hideParamsModal">×</text>
+        </view>
+        <view class="params-list">
+          <view class="params-item" v-if="product.specification">
+            <text class="params-label">规格</text>
+            <text class="params-value">{{ product.specification }}</text>
+          </view>
+          <view class="params-item" v-if="product.usage">
+            <text class="params-label">功能主治</text>
+            <text class="params-value">{{ product.usage }}</text>
+          </view>
+          <view class="params-item" v-if="product.side_effects">
+            <text class="params-label">副作用</text>
+            <text class="params-value">{{ product.side_effects }}</text>
+          </view>
+          <view class="params-item" v-if="product.precautions">
+            <text class="params-label">注意事项</text>
+            <text class="params-value">{{ product.precautions }}</text>
+          </view>
+          <view class="params-item" v-if="product.expiry_date">
+            <text class="params-label">有效期</text>
+            <text class="params-value">{{ product.expiry_date }}</text>
+          </view>
+          <view class="params-item" v-if="product.storage_conditions">
+            <text class="params-label">储存条件</text>
+            <text class="params-value">{{ product.storage_conditions }}</text>
+          </view>
+          <view class="params-item" v-if="product.approval_number">
+            <text class="params-label">批准文号</text>
+            <text class="params-value">{{ product.approval_number }}</text>
+          </view>
+          <view class="params-item" v-if="product.tags && product.tags.length > 0">
+            <text class="params-label">标签</text>
+            <text class="params-value">{{ product.tags.join(', ') }}</text>
+          </view>
+        </view>
+      </view>
+    </view>
+  </view>
+</template>
+
+<script>
+import { ProductType, MerchantType, ProductSkuType } from '@/types/mall-types.uts'
+import { supabaseService } from '@/utils/supabaseService.uts'
+
+export default {
+  data() {
+    return {
+      product: {
+        id: '',
+        merchant_id: '',
+        category_id: '',
+        name: '',
+        description: '',
+        images: [] as Array<string>,
+        price: 0,
+        original_price: 0,
+        stock: 0,
+        sales: 0,
+        status: 0,
+        created_at: ''
+      } as ProductType,
+      merchant: {
+        id: '',
+        user_id: '',
+        shop_name: '',
+        shop_logo: '',
+        shop_banner: '',
+        shop_description: '',
+        contact_name: '',
+        contact_phone: '',
+        shop_status: 0,
+        rating: 0,
+        total_sales: 0,
+        created_at: ''
+      } as MerchantType,
+      productSkus: [] as Array<ProductSkuType>,
+      currentImageIndex: 0,
+      showSpec: false,
+      selectedSkuId: '',
+      selectedSpec: '',
+      quantity: 1,
+      isFavorite: false,
+      showParams: false
+    }
+  },
+  onLoad(options: any) {
+    const productId = options.productId as string || options.id as string
+    const productPrice = options.price ? parseFloat(options.price) : null
+    const productOriginalPrice = options.originalPrice ? parseFloat(options.originalPrice) : null
+    
+    // 处理商品名称：如果是编码的则解码，否则直接使用
+    let productName = options.name as string
+    if (productName) {
+        try {
+            // 尝试解码，如果失败（不是有效的URI组件）则使用原值
+            productName = decodeURIComponent(productName)
+        } catch (e) {
+            console.warn('ProductName decode failed, using original:', productName)
+        }
+    }
+    
+    let productImage = options.image as string
+    if (productImage) {
+        try {
+            productImage = decodeURIComponent(productImage)
+        } catch (e) {
+            console.warn('ProductImage decode failed, using original:', productImage)
+        }
+    }
+    
+    if (productId) {
+      this.loadProductDetail(productId, {
+        price: productPrice,
+        originalPrice: productOriginalPrice,
+        name: productName,
+        image: productImage
+      })
+      this.checkFavoriteStatus(productId)
+      this.saveFootprint(productId)
+      
+      // 设置导航栏标题为商品名称
+      if (productName) {
+          uni.setNavigationBarTitle({
+              title: productName
+          })
+      }
+    }
+  },
+  computed: {
+    displayPrice(): number {
+      if (this.selectedSkuId) {
+        const sku = this.productSkus.find(s => s.id === this.selectedSkuId)
+        if (sku) return sku.price
+      }
+      return this.product.price
+    }
+  },
+  methods: {
+    saveFootprint(productId: string) {
+      const footprintData = uni.getStorageSync('footprints')
+      let footprints: any[] = []
+      
+      if (footprintData) {
+        try {
+          footprints = JSON.parse(footprintData as string) as any[]
+        } catch (e) {
+          console.error('Failed to parse footprints', e)
+        }
+      }
+      
+      // 移除已存在的相同商品（为了将其移到最新位置）
+      footprints = footprints.filter(item => item.id !== productId)
+      
+      // 添加到头部
+      footprints.unshift({
+        id: this.product.id,
+        name: this.product.name,
+        price: this.product.price,
+        original_price: this.product.original_price, // 添加原价
+        image: this.product.images[0],
+        sales: this.product.sales,
+        shopId: this.merchant.id,
+        shopName: this.merchant.shop_name,
+        viewTime: Date.now()
+      })
+      
+      // 限制数量，例如最近50条
+      if (footprints.length > 50) {
+        footprints = footprints.slice(0, 50)
+      }
+      uni.setStorageSync('footprints', JSON.stringify(footprints))
+    },
+    
+    async loadProductDetail(productId: string, options: any = {}) {
+      // 尝试从数据库加载
+      let dbProductRaw = null
+      try {
+        console.log('正在尝试从数据库加载商品详情:', productId)
+        dbProductRaw = await supabaseService.getProductById(productId)
+        console.log('数据库返回的商品详情 (原始数据):', dbProductRaw)
+        
+        // 调试：打印数据库返回的所有字段
+        if (dbProductRaw) {
+          console.log('数据库返回字段详情:')
+          if (Array.isArray(dbProductRaw)) {
+            console.log('返回数据是数组，长度:', dbProductRaw.length)
+            if (dbProductRaw.length > 0) {
+              const firstItem = dbProductRaw[0]
+              console.log('数组第一个元素:', firstItem)
+              for (const key in firstItem) {
+                console.log(`  ${key}:`, firstItem[key], typeof firstItem[key])
+              }
+            }
+          } else {
+            console.log('返回数据是对象')
+            for (const key in dbProductRaw) {
+              console.log(`  ${key}:`, dbProductRaw[key], typeof dbProductRaw[key])
+            }
+          }
+        }
+      } catch (e) {
+        console.error('Failed to load product from DB', e)
+      }
+
+      // 处理数据库返回数据：可能是数组或对象
+      let dbProduct = null
+      if (dbProductRaw) {
+        if (Array.isArray(dbProductRaw)) {
+          if (dbProductRaw.length > 0) {
+            dbProduct = dbProductRaw[0] // 取数组第一个元素
+          } else {
+            console.warn('数据库返回空数组')
+          }
+        } else {
+          dbProduct = dbProductRaw // 已经是对象
+        }
+      }
+
+      if (dbProduct) {
+        console.log('使用数据库数据渲染页面')
+        
+        // 调试：打印dbProduct的详细结构和类型
+        console.log('dbProduct类型:', typeof dbProduct)
+        console.log('dbProduct原型:', Object.getPrototypeOf(dbProduct))
+        console.log('dbProduct的键:')
+        for (let key in dbProduct) {
+          console.log('  ', key, ':', dbProduct[key], '类型:', typeof dbProduct[key])
+        }
+        
+        // 验证必要字段，如果关键字段缺失则使用模拟数据
+        // 注意：数据库返回的字段可能与本地ProductType不完全匹配
+        console.log('验证必要字段，dbProduct:', dbProduct)
+        
+        // 尝试多种方式访问属性
+        const idValue = dbProduct.id !== undefined ? dbProduct.id : (dbProduct['id'] !== undefined ? dbProduct['id'] : undefined)
+        const nameValue = dbProduct.name !== undefined ? dbProduct.name : (dbProduct['name'] !== undefined ? dbProduct['name'] : undefined)
+        const priceValue = dbProduct.price !== undefined ? dbProduct.price : (dbProduct['price'] !== undefined ? dbProduct['price'] : undefined)
+        
+        const hasId = idValue !== undefined && idValue !== null
+        const hasName = nameValue !== undefined && nameValue !== null
+        const hasPrice = priceValue !== undefined && priceValue !== null
+        
+        const hasRequiredFields = dbProduct && hasId && hasName && hasPrice
+        console.log('字段检查 - id:', idValue, 'hasId:', hasId, 'name:', nameValue, 'hasName:', hasName, 'price:', priceValue, 'hasPrice:', hasPrice)
+        console.log('hasRequiredFields:', hasRequiredFields)
+        
+        if (!hasRequiredFields) {
+          console.warn('数据库返回数据缺少必要字段，使用模拟数据')
+          // 继续执行，会进入下面的else分支
+          dbProduct = null
+        } else {
+          // 更新dbProduct的字段为实际值，确保后续使用正确的属性访问
+          if (dbProduct.id === undefined && idValue !== undefined) dbProduct.id = idValue
+          if (dbProduct.name === undefined && nameValue !== undefined) dbProduct.name = nameValue
+          if (dbProduct.price === undefined && priceValue !== undefined) dbProduct.price = priceValue
+          // 使用数据库数据 - 处理字段映射
+          // 数据库Product接口和本地ProductType接口字段可能不同
+          const images = [] as Array<string>
+          
+          // 处理图片字段：优先使用images字段，其次使用image字段
+          console.log('处理数据库图片字段:')
+          console.log('dbProduct.images:', dbProduct.images, '类型:', typeof dbProduct.images)
+          console.log('dbProduct.image:', dbProduct.image, '类型:', typeof dbProduct.image)
+          
+          // 尝试从数据库的images字段获取图片（可能是字符串或数组）
+          if (dbProduct.images) {
+            let imagesArray: any[] = []
+            if (typeof dbProduct.images === 'string') {
+              try {
+                imagesArray = JSON.parse(dbProduct.images)
+                console.log('解析images字符串成功:', imagesArray)
+              } catch (e) {
+                console.error('解析images字段失败:', e, dbProduct.images)
+                // 如果不是JSON，尝试按逗号分割
+                if (dbProduct.images.includes(',')) {
+                  imagesArray = dbProduct.images.split(',').map((img: string) => img.trim())
+                } else if (dbProduct.images) {
+                  imagesArray = [dbProduct.images]
+                }
+              }
+            } else if (Array.isArray(dbProduct.images)) {
+              imagesArray = dbProduct.images
+            }
+            
+            if (imagesArray.length > 0) {
+              console.log('从数据库images字段获取图片数组:', imagesArray)
+              for (const img of imagesArray) {
+                if (typeof img === 'string' && img) {
+                  images.push(img)
+                }
+              }
+            }
+          }
+          
+          // 如果没有从images字段获取到图片，尝试使用image字段
+          if (images.length === 0 && dbProduct.image) {
+            console.log('使用单张图片字段:', dbProduct.image)
+            images.push(dbProduct.image)
+          }
+          
+          // 如果仍然没有图片，使用传入的图片或默认图片
+          if (images.length === 0) {
+            if (options.image) {
+              images.push(decodeURIComponent(options.image as string))
+            } else {
+              images.push('/static/product1.jpg')
+            }
+          }
+          
+          // 补充模拟图片（如果图片数量不足3张）
+          const needSupplementCount = 3 - images.length
+          if (needSupplementCount > 0) {
+            const supplementalImages = ['/static/product2.jpg', '/static/product3.jpg']
+            for (let i = 0; i < needSupplementCount && i < supplementalImages.length; i++) {
+              images.push(supplementalImages[i])
+            }
+          }
+          
+          console.log('最终图片数组:', images)
+          
+          // 映射字段：数据库shop_id对应本地merchant_id
+          const merchantId = dbProduct.shop_id || dbProduct.merchant_id || 'merchant_001'
+          
+          // 确保数值字段有效
+          const price = typeof dbProduct.price === 'number' ? dbProduct.price : 0
+          const stock = (dbProduct.stock != null && !isNaN(Number(dbProduct.stock))) ? Math.floor(Number(dbProduct.stock)) : 100
+          const sales = (dbProduct.sales != null && !isNaN(Number(dbProduct.sales))) ? Math.floor(Number(dbProduct.sales)) : 50
+
+          this.product = {
+              id: dbProduct.id || productId,
+              merchant_id: merchantId,
+              category_id: dbProduct.category_id || 'cat_001',
+              name: dbProduct.name || '商品名称',
+              description: dbProduct.description || '这是一个高品质的商品，具有优秀的性能和优美的外观设计。采用环保材料，经过严格质检，保证用户的使用体验。',
+              images: images,
+              price: price,
+              original_price: (dbProduct.original_price != null && !isNaN(Number(dbProduct.original_price))) ? Number(dbProduct.original_price) : null,
+              stock: stock,
+              sales: sales,
+              status: 1,
+              created_at: dbProduct.created_at || '2024-01-01',
+              // 药品相关字段
+              specification: dbProduct.specification || null,
+              usage: dbProduct.usage || null,
+              side_effects: dbProduct.side_effects || null,
+              precautions: dbProduct.precautions || null,
+              expiry_date: dbProduct.expiry_date || null,
+              storage_conditions: dbProduct.storage_conditions || null,
+              approval_number: dbProduct.approval_number || null,
+              tags: dbProduct.tags ? (typeof dbProduct.tags === 'string' ? JSON.parse(dbProduct.tags) : dbProduct.tags) : []
+          } as ProductType
+          console.log('页面 product 对象已更新:', this.product)
+          console.log('商品图片数组:', this.product.images)
+          console.log('商品价格:', this.product.price, '库存:', this.product.stock, '销量:', this.product.sales)
+        }
+      } else {
+        console.log('数据库无数据或加载失败，使用模拟数据')
+        // 数据库无数据时，使用原有模拟逻辑
+        const generatePriceFromId = (id: string): number => {
+            let hash = 0
+            for (let i = 0; i < id.length; i++) {
+            hash = (hash << 5) - hash + id.charCodeAt(i)
+            hash |= 0
+            }
+            const price = 50 + Math.abs(hash % 450)
+            return parseFloat(price.toFixed(2))
+        }
+
+        const basePrice = options.price ? parseFloat(options.price) : generatePriceFromId(productId)
+        const originalPrice = options.originalPrice ? parseFloat(options.originalPrice) : parseFloat((basePrice * 1.2).toFixed(2))
+        
+        const productName = options.name ? decodeURIComponent(options.name) : (() => {
+            const productNames = ['高品质运动休闲鞋', '时尚简约双肩背包', '多功能智能手环', '便携式蓝牙音箱', '全自动雨伞', '抗菌防螨床上四件套', '不锈钢保温杯', '无线充电器', '高清行车记录仪', '智能体脂秤']
+            const nameIndex = Math.abs(productId.split('').reduce((acc, char) => acc + char.charCodeAt(0), 0)) % productNames.length
+            return productNames[nameIndex]
+        })()
+        
+        const productImage = options.image ? decodeURIComponent(options.image) : '/static/product1.jpg'
+        
+        const sales = 1000 + Math.abs(productId.split('').reduce((acc, char) => acc + char.charCodeAt(0), 0)) % 5000
+        const stock = 50 + Math.abs(productId.split('').reduce((acc, char) => acc + char.charCodeAt(0), 0)) % 200
+        
+        this.product = {
+            id: productId,
+            merchant_id: 'merchant_' + (Math.abs(productId.split('').reduce((acc, char) => acc + char.charCodeAt(0), 0)) % 5 + 1).toString().padStart(3, '0'),
+            category_id: 'cat_' + (Math.abs(productId.split('').reduce((acc, char) => acc + char.charCodeAt(0), 0)) % 10 + 1).toString().padStart(3, '0'),
+            name: productName,
+            description: '这是一个高品质的商品，具有优秀的性能和优美的外观设计。采用环保材料，经过严格质检，保证用户的使用体验。',
+            images: [productImage, '/static/product2.jpg', '/static/product3.jpg'],
+            price: basePrice,
+            original_price: originalPrice,
+            stock: stock,
+            sales: sales,
+            status: 1,
+            created_at: '2024-01-15'
+        }
+      }
+      
+      // 根据商家ID生成不同的商家信息
+      const merchantIndex = Math.abs(this.product.merchant_id.split('').reduce((acc, char) => acc + char.charCodeAt(0), 0)) % 5
+      const shopNames = ['优质好店', '品牌直营店', '官方旗舰店', '专卖店', '精品小店']
+      const shopDescriptions = [
+        '专注品质生活',
+        '品牌官方直营，正品保障',
+        '厂家直销，价格优惠',
+        '专注本领域十年老店',
+        '用心服务每一位顾客'
+      ]
+      const contactNames = ['店主小王', '店长小李', '经理小张', '客服小赵', '老板小钱']
+      
+      this.merchant = {
+        id: this.product.merchant_id,
+        user_id: 'user_' + (merchantIndex + 1).toString().padStart(3, '0'),
+        shop_name: shopNames[merchantIndex],
+        shop_logo: '/static/shop-logo.png',
+        shop_banner: '/static/shop-banner.png',
+        shop_description: shopDescriptions[merchantIndex],
+        contact_name: contactNames[merchantIndex],
+        contact_phone: '138' + (10000000 + merchantIndex * 1111111).toString().substring(0, 8),
+        shop_status: 1,
+        rating: 4.5 + (merchantIndex * 0.1),
+        total_sales: 10000 + merchantIndex * 5000,
+        created_at: '2023-06-01'
+      }
+      
+      this.loadProductSkus(productId)
+    },
+    
+    loadProductSkus(productId: string) {
+      // 模拟加载商品SKU数据
+      const basePrice = this.product.price
+      
+      // 使用 productId 作为前缀生成唯一的 SKU ID，防止不同商品的 SKU ID 冲突
+      this.productSkus = [
+        {
+          id: `${productId}_sku_001`,
+          product_id: productId,
+          sku_code: 'SKU001',
+          specifications: { color: '红色', size: 'M' },
+          price: basePrice,
+          stock: 50,
+          image_url: '/static/sku1.jpg',
+          status: 1
+        },
+        {
+          id: `${productId}_sku_002`,
+          product_id: productId,
+          sku_code: 'SKU002',
+          specifications: { color: '蓝色', size: 'L' },
+          price: parseFloat((basePrice * 1.1).toFixed(2)),
+          stock: 30,
+          image_url: '/static/sku2.jpg',
+          status: 1
+        }
+      ]
+    },
+
+    onSwiperChange(e: any) {
+      this.currentImageIndex = e.detail.current
+    },
+    
+    showSpecModal() {
+      this.showSpec = true
+    },
+    
+    hideSpecModal() {
+      this.showSpec = false
+    },
+    
+    selectSku(sku: ProductSkuType) {
+      this.selectedSkuId = sku.id
+      this.selectedSpec = this.getSkuSpecText(sku)
+      this.hideSpecModal()
+    },
+    
+    getSkuSpecText(sku: ProductSkuType): string {
+      if (sku.specifications) {
+        const specs: any = sku.specifications
+        return Object.keys(specs).map(key => `${key}: ${specs[key]}`).join(', ')
+      }
+      return sku.sku_code
+    },
+    
+    addToCart() {
+      if (!this.selectedSkuId) {
+        uni.showToast({
+          title: '请选择规格',
+          icon: 'none'
+        })
+        return
+      }
+      
+      // 获取现有购物车数据
+      const cartData = uni.getStorageSync('cart')
+      let cartItems: any[] = []
+      
+      if (cartData) {
+        try {
+          cartItems = JSON.parse(cartData as string) as any[]
+        } catch (e) {
+          console.error('解析购物车数据失败', e)
+        }
+      }
+      
+      // 检查商品是否已存在 (同一SKU)
+      const existingItem = cartItems.find((item: any) => item.id === this.selectedSkuId)
+      
+      if (existingItem) {
+        existingItem.quantity += this.quantity
+      } else {
+        // 查找SKU信息
+        const sku = this.productSkus.find(s => s.id === this.selectedSkuId)
+        
+        // 添加新商品
+        cartItems.push({
+          id: this.selectedSkuId, // 使用SKU ID作为购物车条目ID
+          productId: this.product.id,
+          shopId: this.merchant.id,
+          shopName: this.merchant.shop_name,
+          name: this.product.name,
+          price: sku ? sku.price : this.product.price,
+          image: (sku && sku.image_url) ? sku.image_url : this.product.images[0],
+          spec: this.selectedSpec,
+          quantity: this.quantity,
+          selected: true
+        })
+      }
+      
+      // 保存回存储
+      uni.setStorageSync('cart', JSON.stringify(cartItems))
+      
+      // 模拟添加到购物车
+      uni.showToast({
+        title: '已添加到购物车',
+        icon: 'success'
+      })
+    },
+    
+    buyNow() {
+      if (!this.selectedSkuId) {
+        uni.showToast({
+          title: '请选择规格',
+          icon: 'none'
+        })
+        return
+      }
+      
+      const sku = this.productSkus.find(s => s.id === this.selectedSkuId)
+      
+	// 调试：打印价格信息
+	console.log('立即购买 - 商品价格信息:')
+	console.log('SKU价格:', sku ? sku.price : '无SKU')
+	console.log('商品价格:', this.product.price)
+	console.log('选择的价格:', (sku ? sku.price : this.product.price))
+	console.log('数量:', this.quantity)
+	
+	const selectedItem = {
+		id: this.selectedSkuId,
+		product_id: this.product.id,
+		sku_id: this.selectedSkuId,
+		product_name: this.product.name,
+		product_image: (sku && sku.image_url) ? sku.image_url : this.product.images[0],
+		sku_specifications: sku ? sku.specifications : {},
+		price: Number(parseFloat((sku ? sku.price : this.product.price).toString()).toFixed(2)),
+		quantity: Number(this.quantity)
+	}
+	
+	// 调试：打印最终传递的数据
+	console.log('立即购买 - 传递的商品数据:', selectedItem)
+
+      // 使用Storage传递数据，避免EventChannel可能的问题
+      uni.setStorageSync('checkout_type', 'buy_now')
+      uni.setStorageSync('checkout_items', JSON.stringify([selectedItem]))
+
+      // 跳转到订单确认页
+      uni.navigateTo({
+        url: '/pages/mall/consumer/checkout',
+        success: (res) => {
+            res.eventChannel.emit('acceptData', {
+                selectedItems: [selectedItem]
+            })
+        }
+      })
+    },
+    
+    goToShop() {
+      uni.navigateTo({
+        url: `/pages/mall/consumer/shop-detail?merchantId=${this.merchant.id}`
+      })
+    },
+
+    checkFavoriteStatus(id: string) {
+      const storedFavorites = uni.getStorageSync('favorites')
+      if (storedFavorites) {
+        try {
+          const favorites = JSON.parse(storedFavorites as string) as any[]
+          this.isFavorite = favorites.some(item => item.id === id)
+        } catch (e) {
+          console.error('Failed to parse favorites', e)
+        }
+      }
+    },
+
+    toggleFavorite() {
+      const storedFavorites = uni.getStorageSync('favorites')
+      let favorites: any[] = []
+      
+      if (storedFavorites) {
+        try {
+          favorites = JSON.parse(storedFavorites as string) as any[]
+        } catch (e) {
+          console.error('Failed to parse favorites', e)
+        }
+      }
+      
+      if (this.isFavorite) {
+        // 取消收藏
+        favorites = favorites.filter(item => item.id !== this.product.id)
+        uni.showToast({
+          title: '已取消收藏',
+          icon: 'none'
+        })
+      } else {
+        // 添加收藏
+        favorites.push({
+          id: this.product.id,
+          name: this.product.name,
+          price: this.product.price,
+          original_price: this.product.original_price, // 保存原价
+          image: this.product.images[0],
+          sales: this.product.sales,
+          shopId: this.merchant.id,
+          shopName: this.merchant.shop_name
+        })
+        uni.showToast({
+          title: '收藏成功',
+          icon: 'success'
+        })
+      }
+      
+      uni.setStorageSync('favorites', JSON.stringify(favorites))
+      this.isFavorite = !this.isFavorite
+    },
+
+    goToHome() {
+      uni.switchTab({
+        url: '/pages/mall/consumer/home'
+      })
+    },
+
+    goToCart() {
+      uni.switchTab({
+        url: '/pages/mall/consumer/cart'
+      })
+    },
+
+    // 数量选择相关方法
+    decreaseQuantity() {
+      if (this.quantity > 1) {
+        this.quantity--
+      }
+    },
+    
+    increaseQuantity() {
+      const maxQuantity = this.getMaxQuantity()
+      if (this.quantity < maxQuantity) {
+        this.quantity++
+      } else {
+        uni.showToast({
+          title: `最多只能购买${maxQuantity}件`,
+          icon: 'none'
+        })
+      }
+    },
+    
+    validateQuantity() {
+      // 确保数量是数字
+      let num = parseInt(this.quantity)
+      if (isNaN(num)) {
+        num = 1
+      }
+      
+      // 限制在1和最大库存之间
+      const maxQuantity = this.getMaxQuantity()
+      if (num < 1) {
+        num = 1
+      } else if (num > maxQuantity) {
+        num = maxQuantity
+        uni.showToast({
+          title: `最多只能购买${maxQuantity}件`,
+          icon: 'none'
+        })
+      }
+      
+      this.quantity = num
+    },
+    
+    getMaxQuantity() {
+      // 如果有选择SKU，使用SKU的库存，否则使用商品总库存
+      if (this.selectedSkuId) {
+        const sku = this.productSkus.find(s => s.id === this.selectedSkuId)
+        if (sku) return sku.stock
+      }
+      return this.product.stock
+    },
+    
+    getAvailableStock() {
+      return this.getMaxQuantity()
+    },
+    
+    previewImage(index: number) {
+      uni.previewImage({
+        current: index,
+        urls: this.product.images
+      })
+    },
+    
+    showParamsModal() {
+      this.showParams = true
+    },
+    
+    hideParamsModal() {
+      this.showParams = false
+    }
+  }
+}
+</script>
+
+<style>
+.product-detail-page {
+  background-color: #f5f5f5;
+  min-height: 100vh;
+  padding-bottom: 120rpx;
+}
+
+.product-images {
+  position: relative;
+  height: 750rpx;
+  background-color: #fff;
+}
+
+.image-swiper {
+  width: 100%;
+  height: 100%;
+}
+
+.product-image {
+  width: 100%;
+  height: 100%;
+}
+
+.image-indicator {
+  position: absolute;
+  bottom: 20rpx;
+  right: 20rpx;
+  background-color: rgba(0, 0, 0, 0.5);
+  color: #fff;
+  padding: 10rpx 20rpx;
+  border-radius: 20rpx;
+  font-size: 24rpx;
+}
+
+.product-info {
+  background-color: #fff;
+  padding: 30rpx;
+  margin-bottom: 20rpx;
+}
+
+.price-section {
+  margin-bottom: 20rpx;
+}
+
+.current-price {
+  font-size: 48rpx;
+  font-weight: bold;
+  color: #ff4444;
+  margin-right: 20rpx;
+}
+
+.original-price {
+  font-size: 28rpx;
+  color: #999;
+  text-decoration: line-through;
+}
+
+.product-name {
+  font-size: 32rpx;
+  font-weight: bold;
+  color: #333;
+  line-height: 1.4;
+  margin-bottom: 15rpx;
+}
+
+.sales-info {
+  font-size: 26rpx;
+  color: #666;
+}
+
+.shop-info {
+  background-color: #fff;
+  padding: 30rpx;
+  margin-bottom: 20rpx;
+  display: flex;
+  flex-direction: row; /* 显式横向排列 */
+  align-items: center;
+}
+
+.shop-logo {
+  width: 80rpx;
+  height: 80rpx;
+  border-radius: 10rpx;
+  margin-right: 20rpx;
+}
+
+.shop-details {
+  flex: 1;
+  display: flex;
+  flex-direction: column; /* 内部信息保持纵向，或者根据需要改为横向 */
+  justify-content: center;
+}
+
+.shop-name {
+  font-size: 30rpx;
+  font-weight: bold;
+  color: #333;
+  margin-bottom: 10rpx;
+}
+
+.shop-stats-row {
+  display: flex;
+  flex-direction: row; /* 显式横向排列 */
+  align-items: center;
+}
+
+.rating-text, .sales-text {
+  font-size: 24rpx;
+  color: #666;
+  margin-right: 30rpx;
+}
+
+.enter-shop {
+  font-size: 26rpx;
+  color: #666;
+}
+
+.spec-section {
+  background-color: #fff;
+  padding: 30rpx;
+  margin-bottom: 20rpx;
+  display: flex;
+  align-items: center;
+}
+
+.spec-title {
+  font-size: 30rpx;
+  color: #333;
+  width: 120rpx;
+}
+
+.spec-selected {
+  flex: 1;
+  font-size: 28rpx;
+  color: #666;
+}
+
+.spec-arrow {
+  font-size: 28rpx;
+  color: #999;
+}
+
+.quantity-section {
+  background-color: #fff;
+  padding: 30rpx;
+  margin-bottom: 20rpx;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+}
+
+.quantity-title {
+  font-size: 30rpx;
+  color: #333;
+  width: 120rpx;
+}
+
+.quantity-selector {
+  display: flex;
+  align-items: center;
+  border: 1rpx solid #e5e5e5;
+  border-radius: 8rpx;
+  overflow: hidden;
+}
+
+.quantity-btn {
+  width: 60rpx;
+  height: 60rpx;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background-color: #f5f5f5;
+}
+
+.quantity-btn.minus {
+  border-right: 1rpx solid #e5e5e5;
+}
+
+.quantity-btn.plus {
+  border-left: 1rpx solid #e5e5e5;
+}
+
+.quantity-btn-text {
+  font-size: 28rpx;
+  color: #333;
+}
+
+.quantity-input {
+  width: 80rpx;
+  height: 60rpx;
+  text-align: center;
+  font-size: 28rpx;
+  color: #333;
+  border: none;
+  background-color: #fff;
+}
+
+.quantity-stock {
+  font-size: 24rpx;
+  color: #666;
+}
+
+.product-description {
+  background-color: #fff;
+  padding: 30rpx;
+  margin-bottom: 20rpx;
+}
+
+.section-title {
+  font-size: 32rpx;
+  font-weight: bold;
+  color: #333;
+  margin-bottom: 20rpx;
+}
+
+.description-text {
+  font-size: 28rpx;
+  color: #666;
+  line-height: 1.6;
+}
+
+.bottom-actions {
+  position: fixed;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  background-color: #fff;
+  padding: 10rpx 20rpx;
+  box-shadow: 0 -2rpx 10rpx rgba(0, 0, 0, 0.1);
+  display: flex;
+  flex-direction: row; /* 显式设置横向排列 */
+  align-items: center;
+  justify-content: space-between;
+}
+
+.action-buttons {
+  display: flex;
+  flex-direction: row; /* 显式设置横向排列 */
+  align-items: center;
+  margin-right: 20rpx;
+}
+
+.action-btn {
+  display: flex;
+  flex-direction: column; /* 图标文字保持纵向 */
+  align-items: center;
+  justify-content: center;
+  margin-right: 20rpx;
+  min-width: 80rpx;
+}
+
+.action-icon {
+  font-size: 40rpx;
+  margin-bottom: 4rpx;
+}
+
+.action-text {
+  font-size: 20rpx;
+  color: #666;
+}
+
+.btn-group {
+  flex: 1;
+  display: flex;
+  flex-direction: row; /* 显式设置横向排列 */
+  align-items: center;
+}
+
+.cart-btn, .buy-btn {
+  flex: 1;
+  height: 72rpx;
+  line-height: 72rpx;
+  border-radius: 36rpx;
+  font-size: 26rpx;
+  border: none;
+  margin: 0 10rpx;
+}
+
+.cart-btn {
+  background-color: #ffa726;
+  color: #fff;
+}
+
+.buy-btn {
+  background-color: #ff4444;
+  color: #fff;
+}
+
+.spec-modal {
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background-color: rgba(0, 0, 0, 0.5);
+  display: flex;
+  align-items: flex-end;
+  z-index: 999;
+}
+
+.spec-content {
+  background-color: #fff;
+  width: 100%;
+  max-height: 80vh;
+  border-radius: 20rpx 20rpx 0 0;
+  padding: 30rpx;
+}
+
+.spec-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin-bottom: 30rpx;
+  padding-bottom: 20rpx;
+  border-bottom: 1rpx solid #eee;
+}
+
+.spec-title {
+  font-size: 32rpx;
+  font-weight: bold;
+  color: #333;
+}
+
+.close-btn {
+  font-size: 48rpx;
+  color: #999;
+}
+
+.spec-list {
+  max-height: 60vh;
+  overflow-y: auto;
+}
+
+.spec-item {
+  display: flex;
+  align-items: center;
+  padding: 25rpx 0;
+  border-bottom: 1rpx solid #f5f5f5;
+}
+
+.spec-item.active {
+  background-color: #fff3e0;
+}
+
+.spec-name {
+  flex: 1;
+  font-size: 28rpx;
+  color: #333;
+}
+
+.spec-price {
+  font-size: 26rpx;
+  color: #ff4444;
+  margin-right: 20rpx;
+}
+
+.spec-stock {
+  font-size: 24rpx;
+  color: #666;
+  width: 100rpx;
+  text-align: right;
+}
+
+/* 功能主治样式 */
+.function-section {
+  background-color: #fff;
+  padding: 30rpx;
+  margin-bottom: 20rpx;
+}
+
+.function-title {
+  font-size: 30rpx;
+  color: #333;
+  font-weight: bold;
+  margin-bottom: 15rpx;
+  display: block;
+}
+
+.function-content {
+  font-size: 28rpx;
+  color: #666;
+  line-height: 1.5;
+}
+
+/* 商品参数样式 */
+.params-section {
+  background-color: #fff;
+  padding: 30rpx;
+  margin-bottom: 20rpx;
+  display: flex;
+  align-items: center;
+}
+
+.params-title {
+  font-size: 30rpx;
+  color: #333;
+  width: 120rpx;
+}
+
+.params-summary {
+  flex: 1;
+}
+
+.params-item {
+  display: block;
+  font-size: 26rpx;
+  color: #666;
+  line-height: 1.5;
+  margin-bottom: 5rpx;
+}
+
+.params-arrow {
+  font-size: 28rpx;
+  color: #999;
+}
+
+/* 商品参数弹窗样式 */
+.params-modal {
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background-color: rgba(0, 0, 0, 0.5);
+  display: flex;
+  align-items: flex-end;
+  z-index: 1000;
+}
+
+.params-content {
+  background-color: #fff;
+  width: 100%;
+  max-height: 80vh;
+  border-radius: 20rpx 20rpx 0 0;
+  padding: 30rpx;
+}
+
+.params-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin-bottom: 30rpx;
+  padding-bottom: 20rpx;
+  border-bottom: 1rpx solid #eee;
+}
+
+.params-title {
+  font-size: 32rpx;
+  font-weight: bold;
+  color: #333;
+  width: auto;
+}
+
+.params-list {
+  max-height: 60vh;
+  overflow-y: auto;
+}
+
+.params-item {
+  display: flex;
+  align-items: flex-start;
+  padding: 20rpx 0;
+  border-bottom: 1rpx solid #f5f5f5;
+}
+
+.params-label {
+  font-size: 28rpx;
+  color: #333;
+  font-weight: bold;
+  width: 150rpx;
+  flex-shrink: 0;
+}
+
+.params-value {
+  flex: 1;
+  font-size: 28rpx;
+  color: #666;
+  line-height: 1.5;
+}
+
+/* 商品详情图片样式 */
+.detail-images {
+  margin-top: 30rpx;
+}
+
+.detail-image {
+  width: 100%;
+  margin-bottom: 20rpx;
+  border-radius: 10rpx;
+  box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.1);
+}
+</style>
diff --git a/pages/mall/consumer/product-detail.uvue b/pages/mall/consumer/product-detail.uvue
index 27e3757e..a1da08fa 100644
--- a/pages/mall/consumer/product-detail.uvue
+++ b/pages/mall/consumer/product-detail.uvue
@@ -3,7 +3,7 @@
   <view class="product-detail-page">
     <!-- 商品图片轮播 -->
     <view class="product-images">
-      <swiper class="image-swiper" :indicator-dots="true" :autoplay="false">
+      <swiper class="image-swiper" :indicator-dots="true" :autoplay="false" @change="onSwiperChange">
         <swiper-item v-for="(image, index) in product.images" :key="index">
           <image :src="image" class="product-image" mode="aspectFit" />
         </swiper-item>
@@ -34,6 +34,23 @@
       <text class="enter-shop" @click.stop="goToShop">进店 ></text>
     </view>
 
+    <!-- 功能主治（药品功能） -->
+    <view class="function-section" v-if="product.usage">
+      <text class="function-title">功能主治</text>
+      <text class="function-content">{{ product.usage }}</text>
+    </view>
+
+    <!-- 商品参数 -->
+    <view class="params-section" @click="showParamsModal">
+      <text class="params-title">商品参数</text>
+      <view class="params-summary">
+        <text class="params-item" v-if="product.specification">规格: {{ product.specification }}</text>
+        <text class="params-item" v-if="product.expiry_date">有效期: {{ product.expiry_date }}</text>
+        <text class="params-item" v-if="product.approval_number">批准文号: {{ product.approval_number }}</text>
+      </view>
+      <text class="params-arrow">></text>
+    </view>
+
     <!-- 规格选择 -->
     <view class="spec-section" @click="showSpecModal">
       <text class="spec-title">规格</text>
@@ -65,6 +82,15 @@
     <view class="product-description">
       <view class="section-title">商品详情</view>
       <text class="description-text">{{ product.description || '暂无详细描述' }}</text>
+      <!-- 商品详情图片 -->
+      <view class="detail-images" v-if="product.images && product.images.length > 0">
+        <image v-for="(img, index) in product.images" 
+               :key="index" 
+               :src="img" 
+               class="detail-image" 
+               mode="widthFix" 
+               @click="previewImage(index)" />
+      </view>
     </view>
 
     <!-- 底部操作栏 -->
@@ -104,6 +130,50 @@
         </view>
       </view>
     </view>
+
+    <!-- 商品参数弹窗 -->
+    <view v-if="showParams" class="params-modal" @click="hideParamsModal">
+      <view class="params-content" @click.stop>
+        <view class="params-header">
+          <text class="params-title">商品参数</text>
+          <text class="close-btn" @click="hideParamsModal">×</text>
+        </view>
+        <view class="params-list">
+          <view class="params-item" v-if="product.specification">
+            <text class="params-label">规格</text>
+            <text class="params-value">{{ product.specification }}</text>
+          </view>
+          <view class="params-item" v-if="product.usage">
+            <text class="params-label">功能主治</text>
+            <text class="params-value">{{ product.usage }}</text>
+          </view>
+          <view class="params-item" v-if="product.side_effects">
+            <text class="params-label">副作用</text>
+            <text class="params-value">{{ product.side_effects }}</text>
+          </view>
+          <view class="params-item" v-if="product.precautions">
+            <text class="params-label">注意事项</text>
+            <text class="params-value">{{ product.precautions }}</text>
+          </view>
+          <view class="params-item" v-if="product.expiry_date">
+            <text class="params-label">有效期</text>
+            <text class="params-value">{{ product.expiry_date }}</text>
+          </view>
+          <view class="params-item" v-if="product.storage_conditions">
+            <text class="params-label">储存条件</text>
+            <text class="params-value">{{ product.storage_conditions }}</text>
+          </view>
+          <view class="params-item" v-if="product.approval_number">
+            <text class="params-label">批准文号</text>
+            <text class="params-value">{{ product.approval_number }}</text>
+          </view>
+          <view class="params-item" v-if="product.tags && product.tags.length > 0">
+            <text class="params-label">标签</text>
+            <text class="params-value">{{ product.tags.join(', ') }}</text>
+          </view>
+        </view>
+      </view>
+    </view>
   </view>
 </template>
 
@@ -148,7 +218,8 @@ export default {
       selectedSkuId: '',
       selectedSpec: '',
       quantity: 1,
-      isFavorite: false
+      isFavorite: false,
+      showParams: false
     }
   },
   onLoad(options: any) {
@@ -241,42 +312,186 @@ export default {
     
     async loadProductDetail(productId: string, options: any = {}) {
       // 尝试从数据库加载
-      let dbProduct = null
+      let dbProductRaw = null
       try {
         console.log('正在尝试从数据库加载商品详情:', productId)
-        dbProduct = await supabaseService.getProductById(productId)
-        console.log('数据库返回的商品详情:', dbProduct)
+        dbProductRaw = await supabaseService.getProductById(productId)
+        console.log('数据库返回的商品详情 (原始数据):', dbProductRaw)
+        
+        // 调试：打印数据库返回的所有字段
+        if (dbProductRaw) {
+          console.log('数据库返回字段详情:')
+          if (Array.isArray(dbProductRaw)) {
+            console.log('返回数据是数组，长度:', dbProductRaw.length)
+            if (dbProductRaw.length > 0) {
+              const firstItem = dbProductRaw[0]
+              console.log('数组第一个元素:', firstItem)
+              for (const key in firstItem) {
+                console.log(`  ${key}:`, firstItem[key], typeof firstItem[key])
+              }
+            }
+          } else {
+            console.log('返回数据是对象')
+            for (const key in dbProductRaw) {
+              console.log(`  ${key}:`, dbProductRaw[key], typeof dbProductRaw[key])
+            }
+          }
+        }
       } catch (e) {
         console.error('Failed to load product from DB', e)
       }
 
+      // 处理数据库返回数据：可能是数组或对象
+      let dbProduct = null
+      if (dbProductRaw) {
+        if (Array.isArray(dbProductRaw)) {
+          if (dbProductRaw.length > 0) {
+            dbProduct = dbProductRaw[0] // 取数组第一个元素
+          } else {
+            console.warn('数据库返回空数组')
+          }
+        } else {
+          dbProduct = dbProductRaw // 已经是对象
+        }
+      }
+
       if (dbProduct) {
         console.log('使用数据库数据渲染页面')
-        // 使用数据库数据
-        const images = [] as Array<string>
-        if (dbProduct.image) images.push(dbProduct.image)
-        else if (options.image) images.push(decodeURIComponent(options.image as string))
-        else images.push('/static/product1.jpg')
         
-        // 补充模拟图片
-        images.push('/static/product2.jpg')
-        images.push('/static/product3.jpg')
+        // 调试：打印dbProduct的详细结构和类型
+        console.log('dbProduct类型:', typeof dbProduct)
+        console.log('dbProduct原型:', Object.getPrototypeOf(dbProduct))
+        console.log('dbProduct的键:')
+        for (let key in dbProduct) {
+          console.log('  ', key, ':', dbProduct[key], '类型:', typeof dbProduct[key])
+        }
+        
+        // 验证必要字段，如果关键字段缺失则使用模拟数据
+        // 注意：数据库返回的字段可能与本地ProductType不完全匹配
+        console.log('验证必要字段，dbProduct:', dbProduct)
+        
+        // 尝试多种方式访问属性
+        const idValue = dbProduct.id !== undefined ? dbProduct.id : (dbProduct['id'] !== undefined ? dbProduct['id'] : undefined)
+        const nameValue = dbProduct.name !== undefined ? dbProduct.name : (dbProduct['name'] !== undefined ? dbProduct['name'] : undefined)
+        const priceValue = dbProduct.price !== undefined ? dbProduct.price : (dbProduct['price'] !== undefined ? dbProduct['price'] : undefined)
+        
+        const hasId = idValue !== undefined && idValue !== null
+        const hasName = nameValue !== undefined && nameValue !== null
+        const hasPrice = priceValue !== undefined && priceValue !== null
+        
+        const hasRequiredFields = dbProduct && hasId && hasName && hasPrice
+        console.log('字段检查 - id:', idValue, 'hasId:', hasId, 'name:', nameValue, 'hasName:', hasName, 'price:', priceValue, 'hasPrice:', hasPrice)
+        console.log('hasRequiredFields:', hasRequiredFields)
+        
+        if (!hasRequiredFields) {
+          console.warn('数据库返回数据缺少必要字段，使用模拟数据')
+          // 继续执行，会进入下面的else分支
+          dbProduct = null
+        } else {
+          // 更新dbProduct的字段为实际值，确保后续使用正确的属性访问
+          if (dbProduct.id === undefined && idValue !== undefined) dbProduct.id = idValue
+          if (dbProduct.name === undefined && nameValue !== undefined) dbProduct.name = nameValue
+          if (dbProduct.price === undefined && priceValue !== undefined) dbProduct.price = priceValue
+          // 使用数据库数据 - 处理字段映射
+          // 数据库Product接口和本地ProductType接口字段可能不同
+          const images = [] as Array<string>
+          
+          // 处理图片字段：优先使用images字段，其次使用image字段
+          console.log('处理数据库图片字段:')
+          console.log('dbProduct.images:', dbProduct.images, '类型:', typeof dbProduct.images)
+          console.log('dbProduct.image:', dbProduct.image, '类型:', typeof dbProduct.image)
+          
+          // 尝试从数据库的images字段获取图片（可能是字符串或数组）
+          if (dbProduct.images) {
+            let imagesArray: any[] = []
+            if (typeof dbProduct.images === 'string') {
+              try {
+                imagesArray = JSON.parse(dbProduct.images)
+                console.log('解析images字符串成功:', imagesArray)
+              } catch (e) {
+                console.error('解析images字段失败:', e, dbProduct.images)
+                // 如果不是JSON，尝试按逗号分割
+                if (dbProduct.images.includes(',')) {
+                  imagesArray = dbProduct.images.split(',').map((img: string) => img.trim())
+                } else if (dbProduct.images) {
+                  imagesArray = [dbProduct.images]
+                }
+              }
+            } else if (Array.isArray(dbProduct.images)) {
+              imagesArray = dbProduct.images
+            }
+            
+            if (imagesArray.length > 0) {
+              console.log('从数据库images字段获取图片数组:', imagesArray)
+              for (const img of imagesArray) {
+                if (typeof img === 'string' && img) {
+                  images.push(img)
+                }
+              }
+            }
+          }
+          
+          // 如果没有从images字段获取到图片，尝试使用image字段
+          if (images.length === 0 && dbProduct.image) {
+            console.log('使用单张图片字段:', dbProduct.image)
+            images.push(dbProduct.image)
+          }
+          
+          // 如果仍然没有图片，使用传入的图片或默认图片
+          if (images.length === 0) {
+            if (options.image) {
+              images.push(decodeURIComponent(options.image as string))
+            } else {
+              images.push('/static/product1.jpg')
+            }
+          }
+          
+          // 补充模拟图片（如果图片数量不足3张）
+          const needSupplementCount = 3 - images.length
+          if (needSupplementCount > 0) {
+            const supplementalImages = ['/static/product2.jpg', '/static/product3.jpg']
+            for (let i = 0; i < needSupplementCount && i < supplementalImages.length; i++) {
+              images.push(supplementalImages[i])
+            }
+          }
+          
+          console.log('最终图片数组:', images)
+          
+          // 映射字段：数据库shop_id对应本地merchant_id
+          const merchantId = dbProduct.shop_id || dbProduct.merchant_id || 'merchant_001'
+          
+          // 确保数值字段有效
+          const price = typeof dbProduct.price === 'number' ? dbProduct.price : 0
+          const stock = (dbProduct.stock != null && !isNaN(Number(dbProduct.stock))) ? Math.floor(Number(dbProduct.stock)) : 100
+          const sales = (dbProduct.sales != null && !isNaN(Number(dbProduct.sales))) ? Math.floor(Number(dbProduct.sales)) : 50
 
-        this.product = {
-            id: dbProduct.id,
-            merchant_id: dbProduct.shop_id || 'merchant_001',
-            category_id: dbProduct.category_id,
-            name: dbProduct.name,
-            description: dbProduct.description || '这是一个高品质的商品，具有优秀的性能和优美的外观设计。采用环保材料，经过严格质检，保证用户的使用体验。',
-            images: images,
-            price: dbProduct.price,
-            original_price: dbProduct.original_price || null,
-            stock: dbProduct.stock !== undefined ? dbProduct.stock : 0, // 确保使用数据库中的库存
-            sales: dbProduct.sales !== undefined ? dbProduct.sales : 0, // 确保使用数据库中的销量
-            status: 1,
-            created_at: dbProduct.created_at || '2024-01-01'
-        } as ProductType
-        console.log('页面 product 对象已更新:', this.product)
+          this.product = {
+              id: dbProduct.id || productId,
+              merchant_id: merchantId,
+              category_id: dbProduct.category_id || 'cat_001',
+              name: dbProduct.name || '商品名称',
+              description: dbProduct.description || '这是一个高品质的商品，具有优秀的性能和优美的外观设计。采用环保材料，经过严格质检，保证用户的使用体验。',
+              images: images,
+              price: price,
+              original_price: (dbProduct.original_price != null && !isNaN(Number(dbProduct.original_price))) ? Number(dbProduct.original_price) : null,
+              stock: stock,
+              sales: sales,
+              status: 1,
+              created_at: dbProduct.created_at || '2024-01-01',
+              // 药品相关字段
+              specification: dbProduct.specification || null,
+              usage: dbProduct.usage || null,
+              side_effects: dbProduct.side_effects || null,
+              precautions: dbProduct.precautions || null,
+              expiry_date: dbProduct.expiry_date || null,
+              storage_conditions: dbProduct.storage_conditions || null,
+              approval_number: dbProduct.approval_number || null,
+              tags: dbProduct.tags ? (typeof dbProduct.tags === 'string' ? JSON.parse(dbProduct.tags) : dbProduct.tags) : []
+          } as ProductType
+          console.log('页面 product 对象已更新:', this.product)
+          console.log('商品图片数组:', this.product.images)
+          console.log('商品价格:', this.product.price, '库存:', this.product.stock, '销量:', this.product.sales)
+        }
       } else {
         console.log('数据库无数据或加载失败，使用模拟数据')
         // 数据库无数据时，使用原有模拟逻辑
@@ -378,6 +593,10 @@ export default {
         }
       ]
     },
+
+    onSwiperChange(e: any) {
+      this.currentImageIndex = e.detail.current
+    },
     
     showSpecModal() {
       this.showSpec = true
@@ -626,6 +845,21 @@ export default {
     
     getAvailableStock() {
       return this.getMaxQuantity()
+    },
+    
+    previewImage(index: number) {
+      uni.previewImage({
+        current: index,
+        urls: this.product.images
+      })
+    },
+    
+    showParamsModal() {
+      this.showParams = true
+    },
+    
+    hideParamsModal() {
+      this.showParams = false
     }
   }
 }
@@ -993,4 +1227,166 @@ export default {
   width: 100rpx;
   text-align: right;
 }
+
+/* 功能主治样式 */
+.function-section {
+  background-color: #fff;
+  padding: 30rpx;
+  margin-bottom: 20rpx;
+}
+
+.function-title {
+  font-size: 30rpx;
+  color: #333;
+  font-weight: bold;
+  margin-bottom: 15rpx;
+  display: block;
+}
+
+.function-content {
+  font-size: 28rpx;
+  color: #666;
+  line-height: 1.5;
+}
+
+/* 商品参数样式 */
+.params-section {
+  background-color: #fff;
+  padding: 30rpx;
+  margin-bottom: 20rpx;
+  display: flex;
+  align-items: center;
+}
+
+.params-title {
+  font-size: 30rpx;
+  color: #333;
+  width: 120rpx;
+  flex-shrink: 0;
+}
+
+.params-summary {
+  flex: 1;
+  display: flex;
+  flex-direction: row;
+  flex-wrap: wrap;
+  align-items: center;
+}
+
+.params-item {
+  font-size: 26rpx;
+  color: #666;
+  line-height: 1.5;
+  margin-right: 20rpx;
+  margin-bottom: 5rpx;
+  white-space: nowrap;
+}
+
+.params-arrow {
+  font-size: 28rpx;
+  color: #999;
+  flex-shrink: 0;
+  margin-left: 10rpx;
+}
+
+/* 商品参数弹窗样式 */
+.params-modal {
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background-color: rgba(0, 0, 0, 0.5);
+  display: flex;
+  align-items: flex-end;
+  z-index: 1000;
+}
+
+.params-content {
+  background-color: #fff;
+  width: 100%;
+  max-height: 80vh;
+  border-radius: 20rpx 20rpx 0 0;
+  padding: 30rpx;
+}
+
+.params-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin-bottom: 30rpx;
+  padding-bottom: 20rpx;
+  border-bottom: 1rpx solid #eee;
+}
+
+.params-title {
+  font-size: 32rpx;
+  font-weight: bold;
+  color: #333;
+  width: auto;
+}
+
+.params-list {
+  max-height: 60vh;
+  overflow-y: auto;
+}
+
+.params-item {
+  display: flex;
+  align-items: flex-start;
+  padding: 20rpx 0;
+  border-bottom: 1rpx solid #f5f5f5;
+}
+
+.params-label {
+  font-size: 28rpx;
+  color: #333;
+  font-weight: bold;
+  width: 150rpx;
+  flex-shrink: 0;
+}
+
+.params-value {
+  flex: 1;
+  font-size: 28rpx;
+  color: #666;
+  line-height: 1.5;
+}
+
+/* 商品详情图片样式 */
+.detail-images {
+  margin-top: 30rpx;
+}
+
+.detail-image {
+  width: 100%;
+  margin-bottom: 20rpx;
+  border-radius: 10rpx;
+  box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.1);
+}
+
+/* 电脑端适配 */
+@media (min-width: 768px) {
+  .params-section {
+    padding: 20rpx 30rpx;
+  }
+  
+  .params-summary {
+    flex-wrap: nowrap;
+    justify-content: space-between;
+  }
+  
+  .params-item {
+    flex: 1;
+    margin-right: 0;
+    text-align: center;
+    white-space: normal;
+    word-break: break-word;
+    padding: 0 10rpx;
+  }
+  
+  .params-arrow {
+    margin-left: 20rpx;
+  }
+}
 </style>
diff --git a/types/mall-types.uts b/types/mall-types.uts
index 6a54f7ee..de9460f9 100644
--- a/types/mall-types.uts
+++ b/types/mall-types.uts
@@ -85,6 +85,15 @@ export type ProductType = {
 	sales: number
 	status: number
 	created_at: string
+	// 药品相关字段
+	specification?: string | null  // 规格说明
+	usage?: string | null          // 用法用量
+	side_effects?: string | null   // 副作用
+	precautions?: string | null    // 注意事项
+	expiry_date?: string | null    // 有效期
+	storage_conditions?: string | null // 储存条件
+	approval_number?: string | null // 批准文号
+	tags?: Array<string> | null    // 商品标签
 }
 
 // 商品SKU类型
diff --git a/utils/supabaseService.uts b/utils/supabaseService.uts
index bac53939..3ee23527 100644
--- a/utils/supabaseService.uts
+++ b/utils/supabaseService.uts
@@ -25,14 +25,46 @@ export interface Product {
   original_price?: number
   image?: string
   manufacturer: string
-  sales: number
-  stock: number
+  sales?: number
+  stock?: number
   badge?: string
   shop_id?: string
   shop_name?: string
   created_at?: string
 }
 
+export interface CartItem {
+  id: string
+  user_id: string
+  product_id: string
+  sku_id?: string
+  quantity: number
+  selected: boolean
+  product_name?: string
+  product_image?: string
+  product_price?: number
+  product_specification?: string
+  shop_id?: string
+  shop_name?: string
+  created_at?: string
+  updated_at?: string
+}
+
+export interface UserAddress {
+  id: string
+  user_id: string
+  recipient_name: string
+  phone: string
+  province: string
+  city: string
+  district: string
+  detail_address: string
+  postal_code?: string
+  is_default: boolean
+  created_at?: string
+  updated_at?: string
+}
+
 export interface PaginatedResponse<T> {
   data: T[]
   total: number
@@ -42,6 +74,17 @@ export interface PaginatedResponse<T> {
 }
 
 class SupabaseService {
+  // 获取当前用户ID
+  private getCurrentUserId(): string | null {
+    try {
+      const userId = uni.getStorageSync('user_id')
+      return userId ? userId as string : null
+    } catch (e) {
+      console.error('获取用户ID失败:', e)
+      return null
+    }
+  }
+
   // 获取所有分类
   async getCategories(): Promise<Category[]> {
     try {
@@ -176,7 +219,7 @@ class SupabaseService {
         .select('*')
         .eq('id', productId)
         .single()
-        .execute()
+        .executeAs<Product>()
       
       if (response.error) {
         console.error('获取商品详情失败:', response.error)
@@ -304,6 +347,561 @@ class SupabaseService {
       return []
     }
   }
+
+  // 获取当前用户的购物车商品（关联商品和店铺信息）
+  async getCartItems(): Promise<CartItem[]> {
+    try {
+      const userId = this.getCurrentUserId()
+      if (!userId) {
+        console.warn('用户未登录，无法获取购物车')
+        return []
+      }
+
+      // 查询购物车表，并关联商品表（使用内联关联）
+      const response = await supa
+        .from('ml_shopping_cart')
+        .select(`
+          id,
+          user_id,
+          product_id,
+          sku_id,
+          quantity,
+          selected,
+          created_at,
+          updated_at,
+          products!inner (
+            id,
+            name,
+            image,
+            price,
+            specification,
+            shop_id,
+            shop_name
+          )
+        `)
+        .eq('user_id', userId)
+        .order('created_at', { ascending: false })
+        .execute()
+      
+      if (response.error) {
+        console.error('获取购物车失败:', response.error)
+        return []
+      }
+
+      // 处理返回数据，构建CartItem数组
+      const cartItems: CartItem[] = []
+      if (response.data && Array.isArray(response.data)) {
+        for (const item of response.data) {
+          const product = item.products as any
+          
+          cartItems.push({
+            id: item.id as string,
+            user_id: item.user_id as string,
+            product_id: item.product_id as string,
+            sku_id: item.sku_id as string,
+            quantity: item.quantity as number,
+            selected: item.selected as boolean,
+            product_name: product?.name as string,
+            product_image: product?.image as string,
+            product_price: product?.price as number,
+            product_specification: product?.specification as string,
+            shop_id: product?.shop_id as string,
+            shop_name: product?.shop_name as string,
+            created_at: item.created_at as string,
+            updated_at: item.updated_at as string
+          })
+        }
+      }
+      
+      return cartItems
+    } catch (error) {
+      console.error('获取购物车异常:', error)
+      return []
+    }
+  }
+
+  // 添加商品到购物车
+  async addToCart(productId: string, quantity: number = 1, skuId?: string): Promise<boolean> {
+    try {
+      const userId = this.getCurrentUserId()
+      if (!userId) {
+        console.error('用户未登录，无法添加商品到购物车')
+        return false
+      }
+
+      // 检查商品是否已在购物车中
+      const existingResponse = await supa
+        .from('ml_shopping_cart')
+        .select('*')
+        .eq('user_id', userId)
+        .eq('product_id', productId)
+        .eq('sku_id', skuId || '')
+        .single()
+        .execute()
+
+      let response
+      if (existingResponse.data) {
+        // 商品已存在，更新数量
+        const existingItem = existingResponse.data as any
+        response = await supa
+          .from('ml_shopping_cart')
+          .update({
+            quantity: (existingItem.quantity || 0) + quantity,
+            updated_at: new Date().toISOString()
+          })
+          .eq('id', existingItem.id)
+          .execute()
+      } else {
+        // 商品不存在，添加新记录
+        response = await supa
+          .from('ml_shopping_cart')
+          .insert({
+            user_id: userId,
+            product_id: productId,
+            sku_id: skuId || null,
+            quantity: quantity,
+            selected: true,
+            created_at: new Date().toISOString(),
+            updated_at: new Date().toISOString()
+          })
+          .execute()
+      }
+
+      if (response.error) {
+        console.error('添加商品到购物车失败:', response.error)
+        return false
+      }
+
+      return true
+    } catch (error) {
+      console.error('添加商品到购物车异常:', error)
+      return false
+    }
+  }
+
+  // 更新购物车商品数量
+  async updateCartItemQuantity(cartItemId: string, quantity: number): Promise<boolean> {
+    try {
+      const userId = this.getCurrentUserId()
+      if (!userId) {
+        console.error('用户未登录，无法更新购物车')
+        return false
+      }
+
+      if (quantity < 1) {
+        // 数量小于1时删除商品
+        return await this.deleteCartItem(cartItemId)
+      }
+
+      const response = await supa
+        .from('ml_shopping_cart')
+        .update({
+          quantity: quantity,
+          updated_at: new Date().toISOString()
+        })
+        .eq('id', cartItemId)
+        .eq('user_id', userId)
+        .execute()
+
+      if (response.error) {
+        console.error('更新购物车商品数量失败:', response.error)
+        return false
+      }
+
+      return true
+    } catch (error) {
+      console.error('更新购物车商品数量异常:', error)
+      return false
+    }
+  }
+
+  // 更新购物车商品选中状态
+  async updateCartItemSelection(cartItemId: string, selected: boolean): Promise<boolean> {
+    try {
+      const userId = this.getCurrentUserId()
+      if (!userId) {
+        console.error('用户未登录，无法更新购物车')
+        return false
+      }
+
+      const response = await supa
+        .from('ml_shopping_cart')
+        .update({
+          selected: selected,
+          updated_at: new Date().toISOString()
+        })
+        .eq('id', cartItemId)
+        .eq('user_id', userId)
+        .execute()
+
+      if (response.error) {
+        console.error('更新购物车商品选中状态失败:', response.error)
+        return false
+      }
+
+      return true
+    } catch (error) {
+      console.error('更新购物车商品选中状态异常:', error)
+      return false
+    }
+  }
+
+  // 批量更新购物车商品选中状态
+  async batchUpdateCartItemSelection(cartItemIds: string[], selected: boolean): Promise<boolean> {
+    try {
+      const userId = this.getCurrentUserId()
+      if (!userId) {
+        console.error('用户未登录，无法更新购物车')
+        return false
+      }
+
+      const response = await supa
+        .from('ml_shopping_cart')
+        .update({
+          selected: selected,
+          updated_at: new Date().toISOString()
+        })
+        .eq('user_id', userId)
+        .in('id', cartItemIds)
+        .execute()
+
+      if (response.error) {
+        console.error('批量更新购物车商品选中状态失败:', response.error)
+        return false
+      }
+
+      return true
+    } catch (error) {
+      console.error('批量更新购物车商品选中状态异常:', error)
+      return false
+    }
+  }
+
+  // 删除购物车商品
+  async deleteCartItem(cartItemId: string): Promise<boolean> {
+    try {
+      const userId = this.getCurrentUserId()
+      if (!userId) {
+        console.error('用户未登录，无法删除购物车商品')
+        return false
+      }
+
+      const response = await supa
+        .from('ml_shopping_cart')
+        .delete()
+        .eq('id', cartItemId)
+        .eq('user_id', userId)
+        .execute()
+
+      if (response.error) {
+        console.error('删除购物车商品失败:', response.error)
+        return false
+      }
+
+      return true
+    } catch (error) {
+      console.error('删除购物车商品异常:', error)
+      return false
+    }
+  }
+
+  // 批量删除购物车商品
+  async batchDeleteCartItems(cartItemIds: string[]): Promise<boolean> {
+    try {
+      const userId = this.getCurrentUserId()
+      if (!userId) {
+        console.error('用户未登录，无法删除购物车商品')
+        return false
+      }
+
+      const response = await supa
+        .from('ml_shopping_cart')
+        .delete()
+        .eq('user_id', userId)
+        .in('id', cartItemIds)
+        .execute()
+
+      if (response.error) {
+        console.error('批量删除购物车商品失败:', response.error)
+        return false
+      }
+
+      return true
+    } catch (error) {
+      console.error('批量删除购物车商品异常:', error)
+      return false
+    }
+  }
+
+  // 清空购物车
+  async clearCart(): Promise<boolean> {
+    try {
+      const userId = this.getCurrentUserId()
+      if (!userId) {
+        console.error('用户未登录，无法清空购物车')
+        return false
+      }
+
+      const response = await supa
+        .from('ml_shopping_cart')
+        .delete()
+        .eq('user_id', userId)
+        .execute()
+
+      if (response.error) {
+        console.error('清空购物车失败:', response.error)
+        return false
+      }
+
+      return true
+    } catch (error) {
+      console.error('清空购物车异常:', error)
+      return false
+    }
+  }
+
+  // 获取当前用户的所有地址
+  async getAddresses(): Promise<UserAddress[]> {
+    try {
+      const userId = this.getCurrentUserId()
+      if (!userId) {
+        console.warn('用户未登录，无法获取地址')
+        return []
+      }
+
+      const response = await supa
+        .from('ml_user_addresses')
+        .select('*')
+        .eq('user_id', userId)
+        .order('is_default', { ascending: false })
+        .order('created_at', { ascending: false })
+        .execute()
+      
+      if (response.error) {
+        console.error('获取地址失败:', response.error)
+        return []
+      }
+      
+      return response.data as UserAddress[]
+    } catch (error) {
+      console.error('获取地址异常:', error)
+      return []
+    }
+  }
+
+  // 根据ID获取地址详情
+  async getAddressById(addressId: string): Promise<UserAddress | null> {
+    try {
+      const userId = this.getCurrentUserId()
+      if (!userId) {
+        console.warn('用户未登录，无法获取地址')
+        return null
+      }
+
+      const response = await supa
+        .from('ml_user_addresses')
+        .select('*')
+        .eq('id', addressId)
+        .eq('user_id', userId)
+        .single()
+        .execute()
+      
+      if (response.error) {
+        console.error('获取地址详情失败:', response.error)
+        return null
+      }
+      
+      return response.data as UserAddress
+    } catch (error) {
+      console.error('获取地址详情异常:', error)
+      return null
+    }
+  }
+
+  // 添加新地址
+  async addAddress(address: {
+    recipient_name: string
+    phone: string
+    province: string
+    city: string
+    district: string
+    detail_address: string
+    postal_code?: string
+    is_default?: boolean
+  }): Promise<boolean> {
+    try {
+      const userId = this.getCurrentUserId()
+      if (!userId) {
+        console.error('用户未登录，无法添加地址')
+        return false
+      }
+
+      // 如果设置为默认地址，需要先取消其他默认地址
+      if (address.is_default) {
+        await this.clearDefaultAddress(userId)
+      }
+
+      const response = await supa
+        .from('ml_user_addresses')
+        .insert({
+          user_id: userId,
+          recipient_name: address.recipient_name,
+          phone: address.phone,
+          province: address.province,
+          city: address.city,
+          district: address.district,
+          detail_address: address.detail_address,
+          postal_code: address.postal_code || null,
+          is_default: address.is_default || false,
+          created_at: new Date().toISOString(),
+          updated_at: new Date().toISOString()
+        })
+        .execute()
+
+      if (response.error) {
+        console.error('添加地址失败:', response.error)
+        return false
+      }
+
+      return true
+    } catch (error) {
+      console.error('添加地址异常:', error)
+      return false
+    }
+  }
+
+  // 更新地址
+  async updateAddress(addressId: string, address: {
+    recipient_name?: string
+    phone?: string
+    province?: string
+    city?: string
+    district?: string
+    detail_address?: string
+    postal_code?: string
+    is_default?: boolean
+  }): Promise<boolean> {
+    try {
+      const userId = this.getCurrentUserId()
+      if (!userId) {
+        console.error('用户未登录，无法更新地址')
+        return false
+      }
+
+      // 如果设置为默认地址，需要先取消其他默认地址
+      if (address.is_default) {
+        await this.clearDefaultAddress(userId)
+      }
+
+      const response = await supa
+        .from('ml_user_addresses')
+        .update({
+          ...address,
+          updated_at: new Date().toISOString()
+        })
+        .eq('id', addressId)
+        .eq('user_id', userId)
+        .execute()
+
+      if (response.error) {
+        console.error('更新地址失败:', response.error)
+        return false
+      }
+
+      return true
+    } catch (error) {
+      console.error('更新地址异常:', error)
+      return false
+    }
+  }
+
+  // 删除地址
+  async deleteAddress(addressId: string): Promise<boolean> {
+    try {
+      const userId = this.getCurrentUserId()
+      if (!userId) {
+        console.error('用户未登录，无法删除地址')
+        return false
+      }
+
+      const response = await supa
+        .from('ml_user_addresses')
+        .delete()
+        .eq('id', addressId)
+        .eq('user_id', userId)
+        .execute()
+
+      if (response.error) {
+        console.error('删除地址失败:', response.error)
+        return false
+      }
+
+      return true
+    } catch (error) {
+      console.error('删除地址异常:', error)
+      return false
+    }
+  }
+
+  // 设置默认地址
+  async setDefaultAddress(addressId: string): Promise<boolean> {
+    try {
+      const userId = this.getCurrentUserId()
+      if (!userId) {
+        console.error('用户未登录，无法设置默认地址')
+        return false
+      }
+
+      // 先取消所有默认地址
+      await this.clearDefaultAddress(userId)
+
+      // 设置新的默认地址
+      const response = await supa
+        .from('ml_user_addresses')
+        .update({
+          is_default: true,
+          updated_at: new Date().toISOString()
+        })
+        .eq('id', addressId)
+        .eq('user_id', userId)
+        .execute()
+
+      if (response.error) {
+        console.error('设置默认地址失败:', response.error)
+        return false
+      }
+
+      return true
+    } catch (error) {
+      console.error('设置默认地址异常:', error)
+      return false
+    }
+  }
+
+  // 清除用户的默认地址（内部方法）
+  private async clearDefaultAddress(userId: string): Promise<boolean> {
+    try {
+      const response = await supa
+        .from('ml_user_addresses')
+        .update({
+          is_default: false,
+          updated_at: new Date().toISOString()
+        })
+        .eq('user_id', userId)
+        .eq('is_default', true)
+        .execute()
+
+      if (response.error) {
+        console.error('清除默认地址失败:', response.error)
+        return false
+      }
+
+      return true
+    } catch (error) {
+      console.error('清除默认地址异常:', error)
+      return false
+    }
+  }
 }
 
 // 导出单例实例