提交昨晚至今早的修改

This commit is contained in:
2026-01-28 10:46:54 +08:00
parent 4ab722a118
commit af316e6d94
13 changed files with 6635 additions and 196 deletions

File diff suppressed because it is too large Load Diff

View File

@@ -82,6 +82,32 @@
</view>
</view>
<!-- 购物车操作栏 (移至推荐商品上方) -->
<view v-if="cartItems.length > 0" class="cart-action-bar">
<view class="action-bar-content">
<view class="action-left">
<view class="select-all" @click="toggleSelectAll">
<text v-if="allSelected" class="selected-icon">✓</text>
<text v-else class="unselected-icon"></text>
<text class="select-all-text">全选</text>
</view>
</view>
<view class="action-right">
<view v-if="!isManageMode" class="total-info">
<text class="total-text">合计:</text>
<text class="total-price">¥{{ totalPrice }}</text>
</view>
<button v-if="!isManageMode" class="checkout-btn" @click="goToCheckout">
去结算({{ selectedCount }})
</button>
<button v-else class="delete-btn" @click="deleteSelectedItems">
删除({{ selectedCount }})
</button>
</view>
</view>
</view>
<!-- 推荐商品 -->
<view v-if="recommendProducts.length > 0" class="recommend-section">
<view class="section-header">
@@ -111,8 +137,8 @@
</view>
</scroll-view>
<!-- 底部结算栏 -->
<view v-if="cartItems.length > 0" class="cart-footer">
<!-- 底部结算栏 - 已移除,移动到内容区域 -->
<!-- <view v-if="cartItems.length > 0" class="cart-footer">
<view class="footer-content">
<view class="footer-left">
<view class="select-all" @click="toggleSelectAll">
@@ -127,8 +153,6 @@
<text class="total-text">合计:</text>
<text class="total-price">¥{{ totalPrice }}</text>
</view>
<!-- 结算按钮:即使在管理模式下,如果用户想结算也可以(或者在管理模式下隐藏结算,只显示删除) -->
<!-- 需求加购商品前面的按钮时cart购物车页面顶部的管理点击能对加购商品进行批量删除 -->
<button v-if="!isManageMode" class="checkout-btn" @click="goToCheckout">
去结算({{ selectedCount }})
</button>
@@ -137,7 +161,7 @@
</button>
</view>
</view>
</view>
</view> -->
</view>
</template>
@@ -415,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,
@@ -453,7 +480,11 @@ 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
uni.navigateTo({
url: `/pages/mall/consumer/product-detail?id=${productId}&name=${encodeURIComponent(product.name)}&price=${product.price}&image=${encodeURIComponent(product.image)}`
})
}
const goToCheckout = () => {
@@ -465,7 +496,10 @@ const goToCheckout = () => {
return
}
// 获取选中的商品
// 确保最新状态已保存到本地存储
saveCartData()
// 获取选中的商品 (直接过滤cartItems不依赖cartGroups)
const selectedItems = cartItems.value
.filter(item => item.selected)
.map(item => ({
@@ -475,10 +509,14 @@ const goToCheckout = () => {
product_name: item.name,
product_image: item.image,
sku_specifications: item.spec,
price: item.price,
quantity: item.quantity
price: Number(item.price), // 确保是数字
quantity: Number(item.quantity) // 确保是数字
}))
// 关键修复:将结算数据写入 Storage确保 checkout 页面能稳定获取
uni.setStorageSync('checkout_type', 'cart')
uni.setStorageSync('checkout_items', JSON.stringify(selectedItems))
// 跳转到结算页面并传递数据
uni.navigateTo({
url: '/pages/mall/consumer/checkout',
@@ -1059,83 +1097,171 @@ const goToCheckout = () => {
}
}
/* 底部结算栏 */
.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);
}
/* 购物车操作栏样式 - 自适应横向排列 */
.cart-action-bar {
background-color: white;
margin: 10px;
border-radius: 12px;
padding: 15px;
box-shadow: 0 2px 8px rgba(0,0,0,0.05);
}
.footer-content {
width: 100%;
display: flex;
align-items: center;
justify-content: space-between;
}
.action-bar-content {
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
gap: 10px;
}
.footer-left {
display: flex;
align-items: center;
}
.action-left, .action-right {
display: flex;
align-items: center;
flex-wrap: nowrap;
}
.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;
}
.total-text {
font-size: 14px;
color: #333;
margin-right: 5px;
}
.total-price {
font-size: 18px;
color: #ff5000;
font-weight: bold;
}
.checkout-btn {
background-color: #ff5000;
color: white;
border: none;
border-radius: 25px;
padding: 8px 20px;
font-size: 14px;
}
.delete-btn {
background-color: #ff3b30; /* 红色删除按钮 */
color: white;
border: none;
border-radius: 25px;
padding: 8px 25px;
font-size: 14px;
}
.action-right {
justify-content: flex-end;
flex: 1;
min-width: 0; /* 防止溢出 */
}
/* 合计信息区域 - 自适应横向排列 */
.total-info {
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, .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; /* 红色删除按钮 */
padding: 8px 25px;
}
/* 全选区域 */
.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>

File diff suppressed because it is too large Load Diff

View File

@@ -394,45 +394,49 @@ onLoad(() => {
// 从上一页获取数据
const eventChannel = uni.getEventChannel ? uni.getEventChannel() : null
// 默认先尝试从本地存储加载(确保有数据)
loadFromLocalStorage()
if (eventChannel) {
eventChannel.on('acceptData', (data: any) => {
console.log('接收到商品数据:', data)
let items = data.selectedItems || []
processCheckoutItems(items)
if (items.length > 0) {
processCheckoutItems(items)
}
loadDefaultAddress()
})
} else {
// 如果没有eventChannel尝试从本地存储加载例如从购物车进入
loadFromLocalStorage()
}
})
// 处理商品数据清洗
const processCheckoutItems = (items: any[]) => {
// 数据清洗:确保价格和数量是数字类型
// 数据清洗:确保价格和数量是数字类型
if (items && items.length > 0) {
items = items.map((item: any) => {
// 确保价格是数字
let price = item.price
if (price !== undefined && price !== null) {
price = typeof price === 'string' ? parseFloat(price) : Number(item.price)
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
} else {
price = 0
}
// 确保数量是数字
let quantity = item.quantity
if (quantity !== undefined && quantity !== null) {
quantity = typeof quantity === 'string' ? parseInt(quantity) : Number(item.quantity)
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
} else {
quantity = 1
}
return {
...item,
price: Number(price.toFixed(2)), // 保留两位小数
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
}
})
@@ -466,6 +470,9 @@ onMounted(() => {
// 组件卸载时移除事件监听
onUnmounted(() => {
uni.$off('addressUpdated')
// 离开页面时清除结算数据,防止下次进入时显示旧数据
uni.removeStorageSync('checkout_type')
uni.removeStorageSync('checkout_items')
})
// 从本地存储加载结算数据(例如从购物车进入)
@@ -479,17 +486,27 @@ const loadFromLocalStorage = () => {
const selectedCartItems = cartItems.filter(item => item.selected === true)
if (selectedCartItems.length > 0) {
// 转换为CheckoutItemType格式
const convertedItems: CheckoutItemType[] = selectedCartItems.map(item => ({
id: item.id,
product_id: item.productId,
sku_id: item.id, // 购物车中item.id就是SKU ID
product_name: item.name,
product_image: item.image,
sku_specifications: item.spec ? { spec: item.spec } : {},
price: item.price,
quantity: item.quantity
}))
checkoutItems.value = convertedItems
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)

File diff suppressed because it is too large Load Diff

View File

@@ -234,21 +234,27 @@ export default {
// 原价比现价高20%左右
const originalPrice = options.originalPrice ? parseFloat(options.originalPrice) : parseFloat((basePrice * 1.2).toFixed(2))
// 根据商品ID生成不同的商品名称使其更真实
const productNames = [
'高品质运动休闲鞋',
'时尚简约双肩背包',
'多功能智能手环',
'便携式蓝牙音箱',
'全自动雨伞',
'抗菌防螨床上四件套',
'不锈钢保温杯',
'无线充电器',
'高清行车记录仪',
'智能体脂秤'
]
const nameIndex = Math.abs(productId.split('').reduce((acc, char) => acc + char.charCodeAt(0), 0)) % productNames.length
const productName = options.name ? options.name : productNames[nameIndex]
// 优先使用传入的商品名称否则根据商品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
@@ -261,7 +267,7 @@ export default {
name: productName,
description: '这是一个高品质的商品,具有优秀的性能和优美的外观设计。采用环保材料,经过严格质检,保证用户的使用体验。',
images: [
'/static/product1.jpg',
productImage,
'/static/product2.jpg',
'/static/product3.jpg'
],
@@ -307,9 +313,10 @@ export default {
// 模拟加载商品SKU数据
const basePrice = this.product.price
// 使用 productId 作为前缀生成唯一的 SKU ID防止不同商品的 SKU ID 冲突
this.productSkus = [
{
id: 'sku_001',
id: `${productId}_sku_001`,
product_id: productId,
sku_code: 'SKU001',
specifications: { color: '红色', size: 'M' },
@@ -319,7 +326,7 @@ export default {
status: 1
},
{
id: 'sku_002',
id: `${productId}_sku_002`,
product_id: productId,
sku_code: 'SKU002',
specifications: { color: '蓝色', size: 'L' },

View File

@@ -2,10 +2,10 @@
<template>
<view class="settings-page">
<!-- 顶部栏 -->
<view class="settings-header">
<!--<view class="settings-header">
<text class="back-btn" @click="goBack"></text>
<text class="header-title">设置</text>
</view>
</view>-->
<scroll-view class="settings-content" scroll-y>
<!-- 账户设置 -->
@@ -17,11 +17,11 @@
<text class="item-text">个人资料</text>
<text class="item-arrow"></text>
</view>
<view class="list-item" @click="goToAddressList">
<!--<view class="list-item" @click="goToAddressList">
<text class="item-icon">📍</text>
<text class="item-text">收货地址</text>
<text class="item-arrow"></text>
</view>
</view>-->
<view class="list-item" @click="changePassword">
<text class="item-icon">🔒</text>
<text class="item-text">修改密码</text>
@@ -283,7 +283,7 @@ const calculateCacheSize = () => {
// 跳转到个人资料
const goToProfile = () => {
uni.navigateTo({
url: '/pages/mall/consumer/profile'
url: '/pages/user/profile'
})
}
@@ -573,47 +573,126 @@ const goBack = () => {
<style scoped>
/* 响应式布局优化 */
@media screen and (min-width: 768px) {
.settings-content {
padding: 20px;
background-color: #f5f5f5;
}
.section-list {
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: flex-start;
}
.settings-section {
.list-item {
display: flex;
align-items: center;
padding: 15px;
border-bottom: 1px solid #f5f5f5;
background-color: #ffffff;
/* 手机端每行显示4个自适应排到下一行 */
width: 25%;
flex-direction: column; /* 内容改为垂直排列,图标在上文字在下 */
justify-content: center;
text-align: center;
box-sizing: border-box;
border-right: 1px solid #f5f5f5; /* 添加右边框分隔 */
}
.item-icon {
font-size: 24px;
margin-right: 0; /* 移除右侧间距 */
margin-bottom: 5px; /* 添加底部间距 */
}
.item-text {
font-size: 12px;
color: #333333;
/* 文字太长可能需要处理,这里暂时不做截断 */
}
.item-arrow {
display: none; /* 网格模式下通常不需要箭头 */
}
.item-right {
display: none; /* 简化显示,隐藏右侧状态/箭头等复杂内容 */
}
/* 针对 switch 组件的特殊处理,如果需要显示开关,可能需要调整布局 */
.list-item switch {
transform: scale(0.7);
margin-top: 5px;
}
/* 屏幕宽度大于 480px (大屏手机/平板/PC) 时,启用更宽的网格布局或列表布局 */
@media screen and (min-width: 480px) {
.list-item {
width: calc(50% - 10px); /* 每行两个,留出间隙 */
margin: 5px;
border: 1px solid #f0f0f0;
border-radius: 8px;
margin-bottom: 20px;
max-width: 800px;
margin-left: auto;
margin-right: auto;
border-bottom: 1px solid #f0f0f0;
flex-direction: row; /* 恢复水平排列 */
text-align: left;
justify-content: flex-start;
}
/* 电脑端横向排列部分内容 */
.section-list {
display: flex;
flex-direction: column;
.item-icon {
margin-right: 15px;
margin-bottom: 0;
}
.logout-section, .delete-account-section {
max-width: 800px;
margin-left: auto;
margin-right: auto;
.item-text {
font-size: 14px;
}
.item-arrow, .item-right {
display: flex; /* 恢复显示 */
margin-left: auto; /* 推到右侧 */
}
}
/* 增加针对手机横屏的媒体查询 */
@media screen and (orientation: landscape) and (max-height: 500px) {
.list-item {
width: calc(25% - 10px); /* 横屏也保持4个一行或者根据需要调整 */
margin: 5px;
border: 1px solid #f0f0f0;
border-radius: 8px;
flex-direction: column;
}
}
/* 屏幕宽度大于 1024px (大屏PC) 时 */
@media screen and (min-width: 1024px) {
.settings-page {
flex-direction: row; /* 大屏下改为横向布局,左侧导航,右侧内容 */
flex-direction: row; /* 整体左右布局 */
}
.settings-header {
display: none; /* 大屏下隐藏顶部栏,可能使用侧边栏或其他导航 */
display: none;
}
/* 这里只是简单示例,实际可能需要更复杂的布局调整 */
.settings-content {
width: 100%;
max-width: 1000px;
max-width: 1200px;
margin: 0 auto;
padding: 20px;
}
.list-item {
width: calc(33.33% - 10px); /* 每行三个 */
flex-direction: row; /* PC端保持水平排列 */
justify-content: flex-start;
text-align: left;
}
.item-icon {
margin-right: 15px;
margin-bottom: 0;
}
.item-arrow, .item-right {
display: flex;
margin-left: auto;
}
}
@@ -663,21 +742,9 @@ const goBack = () => {
margin-bottom: 15px;
}
.section-list {
display: flex;
flex-direction: column;
}
.list-item {
display: flex;
align-items: center;
padding: 15px 0;
border-bottom: 1px solid #f5f5f5;
}
.list-item:last-child {
border-bottom: none;
}
/* 删除多余的 .section-list 定义 */
/* 删除多余的 .list-item 定义 */
/* 删除多余的 .list-item:last-child 定义 */
.item-icon {
font-size: 20px;
@@ -744,4 +811,4 @@ const goBack = () => {
font-size: 14px;
text-decoration: underline;
}
</style>
</style>

View File

@@ -2,11 +2,9 @@
<template>
<view class="wallet-page">
<!-- 顶部栏 -->
<view class="wallet-header">
<!--<view class="wallet-header">
<text class="back-btn" @click="goBack"></text>
<text class="header-title">我的钱包</text>
<text class="more-btn" @click="showMoreActions">···</text>
</view>
</view>-->
<scroll-view class="wallet-content" scroll-y>
<!-- 余额概览 -->
@@ -162,7 +160,7 @@
<script setup lang="uts">
import { ref, onMounted, computed, watch } from 'vue'
import supa from '@/components/supadb/aksupainstance.uts'
//import supa from '@/components/supadb/aksupainstance.uts'
type WalletType = {
id: string
@@ -556,18 +554,6 @@ const goBack = () => {
padding: 5px;
}
.header-title {
font-size: 18px;
font-weight: bold;
color: #333333;
}
.more-btn {
color: #333333;
font-size: 20px;
padding: 5px;
}
.wallet-content {
flex: 1;
}