diff --git a/app.json b/app.json
index a966075..4a170e8 100644
--- a/app.json
+++ b/app.json
@@ -14,7 +14,8 @@
"pages/chat/index",
"pages/chat-detail/index",
"pages/message-list/index",
- "pages/customer-service/index"
+ "pages/customer-service/index",
+ "pages/cooperation/index"
],
"subpackages": [
{
diff --git a/pages/buyer/index.wxss b/pages/buyer/index.wxss
index 2d20f4f..a3f846f 100644
--- a/pages/buyer/index.wxss
+++ b/pages/buyer/index.wxss
@@ -1,93 +1,100 @@
/* pages/buyer/index.wxss */
+page {
+ height: 100vh;
+ display: flex;
+ flex-direction: column;
+ background: linear-gradient(180deg, #f8f8f8 0%, #f0f0f0 50%, #e8e8e8 100%);
+ margin: 0;
+ padding: 0;
+}
+
.container {
min-height: 100vh;
- background-color: #f5f5f5;
+ width: 100%;
+ display: flex;
+ flex-direction: column;
+ box-sizing: border-box;
+ background-color: #f8f8f8;
+ padding: 0;
+ margin: 0;
}
/* 搜索框样式 */
.search-bar {
- position: fixed;
- top: 0;
- left: 0;
- right: 0;
- padding: 20rpx;
- background-color: transparent;
- z-index: 100;
+ width: 100%;
+ margin: 20rpx;
+ flex: 0 1 auto;
box-sizing: border-box;
}
.search-container {
display: flex;
align-items: center;
- border: 1rpx solid rgba(0, 0, 0, 0.08);
- border-radius: 40rpx;
- background-color: white;
- padding: 0 30rpx;
- margin: 0 auto;
- width: 90%;
- height: 80rpx;
+ width: 100%;
+ border-radius: 50rpx;
+ background: linear-gradient(135deg, #ffffff 0%, #f5f7fa 100%);
+ padding: 6rpx;
+ box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.12);
box-sizing: border-box;
- transition: all 0.3s ease;
-}
-
-.search-container:focus-within {
- border-color: #07c160;
- background-color: white;
- box-shadow: 0 0 0 4rpx rgba(7, 193, 96, 0.1);
+ border: 1rpx solid rgba(22, 119, 255, 0.2);
}
.search-icon {
- font-size: 30rpx;
+ margin: 0 15rpx;
+ font-size: 28rpx;
color: #999;
- margin-right: 20rpx;
}
.search-input {
flex: 1;
- font-size: 30rpx;
+ height: 70rpx;
+ font-size: 28rpx;
color: #333;
- background-color: transparent;
+ background: transparent;
border: none;
outline: none;
- height: 60rpx;
- line-height: 60rpx;
}
.search-input::placeholder {
color: #999;
- font-size: 30rpx;
+ font-size: 28rpx;
}
.clear-icon {
- font-size: 45rpx;
- color: #26ba20ff;
- padding: 8rpx;
- border-radius: 0;
- background-color: transparent;
- cursor: pointer;
- transition: all 0.2s ease;
-}
-
-.clear-icon:hover {
- background-color: transparent;
- color: #666;
+ font-size: 32rpx;
+ color: #999;
+ padding: 10rpx 20rpx;
}
-.title {
- font-size: 36rpx;
- font-weight: bold;
- color: #333;
- margin-bottom: 20rpx;
- width: 100%;
- text-align: center;
+/* 商品列表样式 */
+.goods-list {
+ flex: 1;
+ padding: 20rpx 32rpx;
+ overflow-y: auto;
+ -webkit-overflow-scrolling: touch;
}
.card {
- background: white;
- border-radius: 12rpx;
- box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.1);
+ background: rgba(255, 255, 255, 0.82);
+ backdrop-filter: blur(10rpx);
+ -webkit-backdrop-filter: blur(10rpx);
+ border-radius: 20rpx;
overflow: hidden;
- margin-bottom: 20rpx;
+ box-shadow:
+ 0 6rpx 24rpx rgba(0, 0, 0, 0.15),
+ 0 0 0 1rpx rgba(0, 0, 0, 0.08),
+ inset 0 0 0 1rpx rgba(255, 255, 255, 0.95);
+ border: 2rpx solid rgba(200, 200, 200, 0.5);
+ margin-bottom: 16rpx;
+ transition: all 0.3s ease;
+}
+
+.card:hover {
+ transform: translateY(-4rpx);
+ box-shadow:
+ 0 12rpx 32rpx rgba(0, 0, 0, 0.2),
+ 0 0 0 2rpx rgba(0, 0, 0, 0.1),
+ inset 0 0 0 1rpx rgba(255, 255, 255, 1);
}
.image-swiper {
@@ -95,6 +102,175 @@
height: 100%;
}
+/* 商品卡片内部布局 */
+.goods-card-content {
+ display: flex;
+ width: 100%;
+ height: 200rpx;
+}
+
+.goods-image-section {
+ width: 40%;
+ position: relative;
+ height: 200rpx;
+}
+
+.goods-image {
+ width: 100%;
+ height: 100%;
+}
+
+.goods-image-placeholder {
+ width: 100%;
+ height: 100%;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ background-color: #f5f5f5;
+ color: #999;
+ font-size: 24rpx;
+}
+
+.image-page-indicator {
+ position: absolute;
+ bottom: 10rpx;
+ right: 10rpx;
+ background-color: rgba(0, 0, 0, 0.5);
+ color: white;
+ padding: 4rpx 12rpx;
+ border-radius: 15rpx;
+ font-size: 20rpx;
+}
+
+.goods-info-section {
+ width: 60%;
+ display: flex;
+ flex-direction: column;
+ background: rgba(255, 255, 255, 0.5);
+ backdrop-filter: blur(5rpx);
+ border-left: 1rpx solid rgba(240, 240, 240, 0.8);
+}
+
+.goods-info-top {
+ flex: 0.6;
+ padding: 16rpx 20rpx;
+ display: flex;
+ flex-direction: column;
+}
+
+.goods-name-row {
+ display: flex;
+ align-items: center;
+ flex-wrap: wrap;
+ gap: 8rpx;
+ margin-bottom: 8rpx;
+}
+
+.supply-tag {
+ font-size: 20rpx;
+ padding: 4rpx 10rpx;
+ border-radius: 8rpx;
+ font-weight: 600;
+ white-space: nowrap;
+}
+
+.supply-tag.spot {
+ background: rgba(82, 196, 26, 0.15);
+ color: #389e0d;
+ border: 1rpx solid rgba(82, 196, 26, 0.5);
+}
+
+.supply-tag.presale {
+ background: rgba(255, 154, 28, 0.15);
+ color: #d46b08;
+ border: 1rpx solid rgba(255, 154, 28, 0.5);
+}
+
+.auth-badge {
+ font-size: 20rpx;
+ padding: 4rpx 10rpx;
+ background: linear-gradient(135deg, #4a90e2 0%, #2b66f0 50%, #1a4bbd 100%);
+ color: white;
+ clip-path: polygon(50% 0%, 70% 10%, 100% 30%, 100% 70%, 70% 90%, 50% 100%, 30% 90%, 0% 70%, 0% 30%, 30% 10%);
+ font-weight: bold;
+}
+
+.goods-name {
+ font-size: 30rpx;
+ font-weight: bold;
+ color: #333;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ display: -webkit-box;
+ -webkit-line-clamp: 1;
+ -webkit-box-orient: vertical;
+}
+
+.goods-spec {
+ font-size: 24rpx;
+ color: #888;
+ margin-top: 8rpx;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+}
+
+.goods-info-bottom {
+ flex: 0.4;
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ padding: 0 20rpx;
+ border-top: 1rpx solid rgba(240, 240, 240, 0.5);
+}
+
+.favorite-count {
+ display: flex;
+ align-items: center;
+ font-size: 24rpx;
+ color: #999;
+}
+
+.favorite-count .count {
+ color: #d865d8;
+ font-weight: bold;
+ margin: 0 6rpx;
+}
+
+.favorite-button {
+ font-size: 22rpx;
+ font-weight: 600;
+ width: 120rpx;
+ height: 50rpx;
+ border-radius: 25rpx;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ padding: 0;
+ border: none;
+ transition: all 0.3s ease;
+}
+
+.favorite-button.add {
+ color: #1677ff;
+ background: rgba(22, 119, 255, 0.15);
+ border: 1rpx solid rgba(22, 119, 255, 0.3);
+}
+
+.favorite-button.add:hover {
+ background: rgba(22, 119, 255, 0.25);
+}
+
+.favorite-button.add:active {
+ transform: scale(0.95);
+}
+
+.favorite-button.canceled {
+ color: #ff6b6b;
+ background: rgba(255, 107, 107, 0.15);
+ border: 1rpx solid rgba(255, 107, 107, 0.3);
+}
+
/* 弹窗样式 */
.modal-overlay {
position: fixed;
@@ -144,15 +320,15 @@
padding: 0;
border-radius: 20rpx 20rpx 0 0;
width: 100%;
- height: 100vh; /* 改为全屏高度 */
- max-height: 100vh; /* 确保不超过屏幕高度 */
+ height: 100vh;
+ max-height: 100vh;
overflow: hidden;
box-shadow: 0 -8rpx 40rpx rgba(0, 0, 0, 0.15);
display: flex;
flex-direction: column;
- margin-bottom: 0; /* 导航栏已隐藏,无需间距 */
+ margin-bottom: 0;
z-index: 9999;
- position: absolute; /* 确保弹窗位于遮罩层内 */
+ position: absolute;
top: 0;
left: 0;
}
@@ -194,13 +370,13 @@
padding: 40rpx;
overflow-y: auto;
flex: 1;
- height: calc(100vh - 120rpx); /* 减去头部高度,实现全屏滚动 */
- -webkit-overflow-scrolling: touch; /* 优化iOS滚动体验 */
- width: 100%; /* 确保宽度100% */
- box-sizing: border-box; /* 确保padding不影响宽度计算 */
+ height: calc(100vh - 120rpx);
+ -webkit-overflow-scrolling: touch;
+ width: 100%;
+ box-sizing: border-box;
}
-.goods-image-section {
+.goods-image-section-detail {
margin-bottom: 40rpx;
border-radius: 12rpx;
overflow: hidden;
@@ -217,17 +393,11 @@
height: 100%;
}
-.goods-image {
- width: 100%;
- height: 100%;
- display: block;
-}
-
-.goods-info-section {
+.goods-info-section-detail {
text-align: left;
}
-.goods-name {
+.goods-name-detail {
font-size: 36rpx;
font-weight: 600;
color: #2c3e50;
@@ -304,28 +474,28 @@
}
.call-phone-button {
- background-color: white;
- color: black;
- font-size: 24rpx;
- width: 120rpx;
- height: 60rpx;
- line-height: 60rpx;
- padding: 0;
- border-radius: 20rpx;
- border: 1rpx solid #d9d9d9;
- transition: all 0.3s;
- white-space: nowrap;
- text-align: center;
+ background-color: white;
+ color: black;
+ font-size: 24rpx;
+ width: 120rpx;
+ height: 60rpx;
+ line-height: 60rpx;
+ padding: 0;
+ border-radius: 20rpx;
+ border: 1rpx solid #d9d9d9;
+ transition: all 0.3s;
+ white-space: nowrap;
+ text-align: center;
}
.call-phone-button:hover {
- background-color: #f5f5f5;
- transform: translateY(-1rpx);
- box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.1);
+ background-color: #f5f5f5;
+ transform: translateY(-1rpx);
+ box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.1);
}
.call-phone-button:active {
- transform: translateY(0);
+ transform: translateY(0);
}
.goods-action-section {
@@ -611,4 +781,17 @@ button:after {
border-radius: 12rpx;
padding: 24rpx 0;
border: 2rpx solid #e5e5e5;
-}
\ No newline at end of file
+}
+
+/* 已加载全部提示 */
+.load-complete {
+ display: flex;
+ justify-content: center;
+ align-items: flex-start;
+ padding-top: 20rpx;
+}
+
+.load-complete text {
+ color: #999;
+ font-size: 26rpx;
+}
diff --git a/pages/cooperation/index.js b/pages/cooperation/index.js
new file mode 100644
index 0000000..cda09b9
--- /dev/null
+++ b/pages/cooperation/index.js
@@ -0,0 +1,110 @@
+// pages/cooperation/index.js
+Page({
+ /**
+ * 页面的初始数据
+ */
+ data: {
+ // 页面数据可以在这里定义
+ },
+
+ /**
+ * 生命周期函数--监听页面加载
+ */
+ onLoad: function (options) {
+ // 页面加载时的初始化操作
+ console.log('招商合作页面加载');
+ },
+
+ /**
+ * 生命周期函数--监听页面初次渲染完成
+ */
+ onReady: function () {
+ // 页面初次渲染完成时的操作
+ },
+
+ /**
+ * 生命周期函数--监听页面显示
+ */
+ onShow: function () {
+ // 页面显示时的操作
+ },
+
+ /**
+ * 生命周期函数--监听页面隐藏
+ */
+ onHide: function () {
+ // 页面隐藏时的操作
+ },
+
+ /**
+ * 生命周期函数--监听页面卸载
+ */
+ onUnload: function () {
+ // 页面卸载时的操作
+ },
+
+ /**
+ * 页面相关事件处理函数--监听用户下拉动作
+ */
+ onPullDownRefresh: function () {
+ // 下拉刷新时的操作
+ wx.stopPullDownRefresh();
+ },
+
+ /**
+ * 页面上拉触底事件的处理函数
+ */
+ onReachBottom: function () {
+ // 上拉触底时的操作
+ },
+
+ /**
+ * 用户点击右上角分享
+ */
+ onShareAppMessage: function () {
+ // 分享时的配置
+ return {
+ title: '招商合作 - 又鸟蛋平台',
+ path: '/pages/cooperation/index',
+ imageUrl: ''
+ };
+ },
+
+ /**
+ * 拨打电话
+ */
+ makePhoneCall: function () {
+ wx.makePhoneCall({
+ phoneNumber: '138XXXXXXXX',
+ success: function () {
+ console.log('拨打电话成功');
+ },
+ fail: function (error) {
+ console.error('拨打电话失败:', error);
+ wx.showToast({
+ title: '拨打电话失败,请稍后重试',
+ icon: 'none'
+ });
+ }
+ });
+ },
+
+ /**
+ * 跳转到立即合作页面
+ */
+ navigateToSettlement: function () {
+ wx.navigateTo({
+ url: '/pages/settlement/index',
+ success: function () {
+ console.log('成功跳转到立即合作页面');
+ },
+ fail: function (error) {
+ console.error('跳转到立即合作页面失败:', error);
+ wx.showToast({
+ title: '跳转失败,请稍后重试',
+ icon: 'none'
+ });
+ }
+ });
+ }
+});
\ No newline at end of file
diff --git a/pages/cooperation/index.json b/pages/cooperation/index.json
new file mode 100644
index 0000000..4180a8f
--- /dev/null
+++ b/pages/cooperation/index.json
@@ -0,0 +1,4 @@
+{
+ "navigationBarTitleText": "招商合作",
+ "usingComponents": {}
+}
\ No newline at end of file
diff --git a/pages/cooperation/index.wxml b/pages/cooperation/index.wxml
new file mode 100644
index 0000000..a329862
--- /dev/null
+++ b/pages/cooperation/index.wxml
@@ -0,0 +1,93 @@
+
+
+
+ 招商合作
+
+
+
+
+
+ 诚邀合作伙伴
+
+
+
+ 🤝
+
+ 成为我们的供应商
+ 加入我们的供应链体系,共享平台资源,实现互利共赢
+
+
+
+ 📈
+
+ 海量订单支持
+ 平台拥有稳定的客户群体,为您提供持续的订单保障
+
+
+
+ 🚚
+
+ 完善的物流体系
+ 专业的物流配送团队,确保货物安全及时送达
+
+
+
+ 📊
+
+ 数据分析支持
+ 提供详细的销售数据和市场分析,助力您的业务决策
+
+
+
+
+
+
+
+ 合作优势
+
+
+ 💪
+ 品牌支持
+
+
+ 💰
+ 灵活结算
+
+
+ 📱
+ 智能管理
+
+
+ 👥
+ 专属客服
+
+
+
+
+
+
+ 联系方式
+
+
+ 联系电话:
+ 138-XXXX-XXXX
+
+
+ 电子邮箱:
+ cooperation@example.com
+
+
+ 联系地址:
+ 上海市浦东新区XX路XX号
+
+
+
+
+
+
+
+
+
+ 如有任何疑问,欢迎随时联系我们
+
+
\ No newline at end of file
diff --git a/pages/cooperation/index.wxss b/pages/cooperation/index.wxss
new file mode 100644
index 0000000..d598363
--- /dev/null
+++ b/pages/cooperation/index.wxss
@@ -0,0 +1,207 @@
+/* 页面容器 */
+.cooperation-container {
+ padding: 20rpx;
+ background-color: #f5f5f5;
+ min-height: 100vh;
+}
+
+/* 页面标题 */
+.page-title {
+ text-align: center;
+ font-size: 36rpx;
+ font-weight: bold;
+ color: #333;
+ margin: 30rpx 0;
+}
+
+/* 广告区域 */
+.ad-section {
+ background-color: #fff;
+ border-radius: 16rpx;
+ padding: 30rpx;
+ margin-bottom: 20rpx;
+ box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.1);
+}
+
+.ad-title {
+ font-size: 32rpx;
+ font-weight: bold;
+ color: #ff6b81;
+ margin-bottom: 20rpx;
+ text-align: center;
+}
+
+.ad-content {
+ display: flex;
+ flex-direction: column;
+ gap: 20rpx;
+}
+
+.ad-item {
+ display: flex;
+ align-items: flex-start;
+ gap: 20rpx;
+ padding: 20rpx;
+ background-color: #f9f9f9;
+ border-radius: 12rpx;
+}
+
+.ad-icon {
+ font-size: 48rpx;
+ margin-top: 8rpx;
+}
+
+.ad-text {
+ flex: 1;
+}
+
+.ad-item-title {
+ font-size: 28rpx;
+ font-weight: bold;
+ color: #333;
+ margin-bottom: 8rpx;
+}
+
+.ad-item-desc {
+ font-size: 24rpx;
+ color: #666;
+ line-height: 1.5;
+}
+
+/* 合作优势区域 */
+.advantage-section {
+ background-color: #fff;
+ border-radius: 16rpx;
+ padding: 30rpx;
+ margin-bottom: 20rpx;
+ box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.1);
+}
+
+.section-title {
+ font-size: 30rpx;
+ font-weight: bold;
+ color: #333;
+ margin-bottom: 20rpx;
+ text-align: center;
+}
+
+.advantage-grid {
+ display: grid;
+ grid-template-columns: repeat(2, 1fr);
+ gap: 20rpx;
+}
+
+.advantage-item {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ gap: 10rpx;
+ padding: 20rpx;
+ background-color: #f9f9f9;
+ border-radius: 12rpx;
+ transition: transform 0.3s ease;
+}
+
+.advantage-item:active {
+ transform: scale(0.98);
+}
+
+.advantage-icon {
+ font-size: 48rpx;
+}
+
+.advantage-text {
+ font-size: 24rpx;
+ color: #333;
+ font-weight: 500;
+}
+
+/* 联系方式区域 */
+.contact-section {
+ background-color: #fff;
+ border-radius: 16rpx;
+ padding: 30rpx;
+ margin-bottom: 20rpx;
+ box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.1);
+}
+
+.contact-info {
+ display: flex;
+ flex-direction: column;
+ gap: 16rpx;
+ margin-bottom: 30rpx;
+}
+
+.contact-item {
+ display: flex;
+ align-items: center;
+ gap: 12rpx;
+ padding: 16rpx;
+ background-color: #f9f9f9;
+ border-radius: 12rpx;
+}
+
+.contact-label {
+ font-size: 26rpx;
+ color: #666;
+ width: 180rpx;
+}
+
+.contact-value {
+ font-size: 26rpx;
+ color: #333;
+ flex: 1;
+}
+
+.contact-value:active {
+ color: #ff6b81;
+}
+
+/* 立即合作按钮 */
+.cooperate-btn {
+ background-color: #ff6b81;
+ color: #fff;
+ font-size: 28rpx;
+ font-weight: bold;
+ border-radius: 50rpx;
+ height: 80rpx;
+ line-height: 80rpx;
+ margin: 0;
+ box-shadow: 0 4rpx 12rpx rgba(255, 107, 129, 0.3);
+}
+
+.cooperate-btn:active {
+ background-color: #ff526c;
+ transform: scale(0.98);
+}
+
+/* 底部提示 */
+.bottom-tip {
+ text-align: center;
+ font-size: 22rpx;
+ color: #999;
+ margin: 30rpx 0;
+}
+
+/* 响应式设计 */
+@media (max-width: 768rpx) {
+ .advantage-grid {
+ grid-template-columns: 1fr;
+ }
+
+ .ad-item {
+ flex-direction: column;
+ align-items: center;
+ text-align: center;
+ }
+
+ .contact-item {
+ flex-direction: column;
+ align-items: flex-start;
+ gap: 8rpx;
+ }
+
+ .contact-label {
+ width: auto;
+ }
+}
\ No newline at end of file
diff --git a/pages/index/index.js b/pages/index/index.js
index dd8c696..76aafa0 100644
--- a/pages/index/index.js
+++ b/pages/index/index.js
@@ -20,6 +20,7 @@ Page({
startY: 0,
currentY: 0,
sidebarBtnTop: 500, // 初始位置,单位rpx
+ sidebarBtnHidden: false, // 按钮是否隐藏到侧边栏
// 搜索相关
searchKeyword: '',
@@ -30,6 +31,9 @@ Page({
// 商品相关
goods: [],
filteredGoods: [],
+ groupedGoods: [],
+ leftColumnGoods: [],
+ rightColumnGoods: [],
selectedCategory: '全部',
loadingMore: false,
hasMoreData: true,
@@ -78,15 +82,15 @@ Page({
});
},
- // 跳转到立即入驻页面
+ // 跳转到我要卖蛋页面
navigateToSettlement() {
wx.navigateTo({
url: '/pages/settlement/index',
success: function() {
- console.log('成功跳转到立即入驻页面');
+ console.log('成功跳转到我要卖蛋页面');
},
fail: function(error) {
- console.error('跳转到立即入驻页面失败:', error);
+ console.error('跳转到我要卖蛋页面失败:', error);
wx.showToast({
title: '跳转失败,请稍后重试',
icon: 'none'
@@ -105,6 +109,13 @@ Page({
});
},
+ // 切换按钮显示/隐藏到侧边栏
+ toggleSidebarBtn() {
+ this.setData({
+ sidebarBtnHidden: !this.data.sidebarBtnHidden
+ });
+ },
+
// 触摸开始事件
handleTouchStart(e) {
this.setData({
@@ -269,13 +280,14 @@ Page({
(reservedCountValue !== undefined && reservedCountValue !== null ? reservedCountValue :
(reservationCountValue || 0));
- // 转换supplyStatus字段值
+ // 货源情况 - 直接显示数据库字段值
let supplyStatusValue = product.supplyStatus || '';
- if (['平台货源', '三方认证'].includes(supplyStatusValue)) {
- supplyStatusValue = '现货';
- } else if (supplyStatusValue === '三方未认证') {
- supplyStatusValue = '预售';
- }
+
+ // 认证状态 - 直接显示数据库的sourceType字段值
+ let sourceTypeValue = product.sourceType || '';
+
+ // 处理议价状态 - 全部显示可议价
+ let negotiateValue = '可议价';
// 处理图片URL,确保imageUrls字段存在且为数组
const imageUrls = product.imageUrls || product.images || [];
@@ -294,7 +306,8 @@ Page({
product_contact: product.product_contact || '',
contact_phone: product.contact_phone || '',
supplyStatus: supplyStatusValue,
- sourceType: product.sourceType || '',
+ sourceType: sourceTypeValue,
+ negotiateStatus: negotiateValue,
isReserved: false,
isFavorite: false,
currentImageIndex: 0,
@@ -321,6 +334,8 @@ Page({
// 应用筛选条件
const filteredGoods = this.applyFilters(updatedGoods)
+ const groupedGoods = this.groupGoodsForStaggeredLayout(filteredGoods)
+ const { leftColumnGoods, rightColumnGoods } = this.distributeToColumns(filteredGoods)
// 计算是否还有更多数据
const totalGoods = res.total || 0;
@@ -330,6 +345,9 @@ Page({
this.setData({
goods: updatedGoods,
filteredGoods: filteredGoods,
+ groupedGoods: groupedGoods,
+ leftColumnGoods: leftColumnGoods,
+ rightColumnGoods: rightColumnGoods,
loadingMore: false,
page: currentPage + 1,
hasMoreData: hasMoreData,
@@ -431,6 +449,75 @@ Page({
return filtered
},
+ // 分组商品用于交错布局(左长右短,左短右长交替)
+ groupGoodsForStaggeredLayout: function(goods) {
+ if (!goods || goods.length === 0) {
+ return []
+ }
+
+ const grouped = []
+ const len = goods.length
+
+ for (let i = 0; i < len; i += 2) {
+ const row = []
+
+ // 第一个商品:如果是偶数行(index为偶数),则是长商品;如果是奇数行,则是短商品
+ if (i < len) {
+ row.push({
+ ...goods[i],
+ isLong: i % 2 === 0 // 偶数索引为长商品
+ })
+ }
+
+ // 第二个商品:与第一个相反
+ if (i + 1 < len) {
+ row.push({
+ ...goods[i + 1],
+ isLong: i % 2 !== 0 // 奇数索引为长商品
+ })
+ }
+
+ grouped.push(row)
+ }
+
+ return grouped
+ },
+
+ // 瀑布流布局:将商品分配到左右两列
+ // 规则:左长右短 -> 左短右长 交替排列
+ // 偶数行(0,2,4...):左长右短
+ // 奇数行(1,3,5...):左短右长
+ distributeToColumns: function(goods) {
+ if (!goods || goods.length === 0) {
+ return { leftColumnGoods: [], rightColumnGoods: [] }
+ }
+
+ const leftColumn = []
+ const rightColumn = []
+ const rowCount = Math.ceil(goods.length / 2)
+
+ for (let i = 0; i < goods.length; i += 2) {
+ const currentRow = Math.floor(i / 2)
+ const isEvenRow = currentRow % 2 === 0
+
+ if (i < goods.length) {
+ leftColumn.push({
+ ...goods[i],
+ isLong: isEvenRow // 偶数行左边为长,奇数行左边为短
+ })
+ }
+
+ if (i + 1 < goods.length) {
+ rightColumn.push({
+ ...goods[i + 1],
+ isLong: !isEvenRow // 偶数行右边为短,奇数行右边为长
+ })
+ }
+ }
+
+ return { leftColumnGoods: leftColumn, rightColumnGoods: rightColumn }
+ },
+
// 搜索输入
onSearchInput: function(e) {
this.setData({
@@ -447,8 +534,13 @@ Page({
}
const filteredGoods = this.applyFilters(this.data.goods)
+ const groupedGoods = this.groupGoodsForStaggeredLayout(filteredGoods)
+ const { leftColumnGoods, rightColumnGoods } = this.distributeToColumns(filteredGoods)
this.setData({
- filteredGoods: filteredGoods
+ filteredGoods: filteredGoods,
+ groupedGoods: groupedGoods,
+ leftColumnGoods: leftColumnGoods,
+ rightColumnGoods: rightColumnGoods
})
},
@@ -476,8 +568,13 @@ Page({
}
const filteredGoods = this.applyFilters(this.data.goods)
+ const groupedGoods = this.groupGoodsForStaggeredLayout(filteredGoods)
+ const { leftColumnGoods, rightColumnGoods } = this.distributeToColumns(filteredGoods)
this.setData({
filteredGoods: filteredGoods,
+ groupedGoods: groupedGoods,
+ leftColumnGoods: leftColumnGoods,
+ rightColumnGoods: rightColumnGoods,
showRegionPicker: false
})
},
@@ -501,8 +598,13 @@ Page({
})
const filteredGoods = this.applyFilters(this.data.goods)
+ const groupedGoods = this.groupGoodsForStaggeredLayout(filteredGoods)
+ const { leftColumnGoods, rightColumnGoods } = this.distributeToColumns(filteredGoods)
this.setData({
- filteredGoods: filteredGoods
+ filteredGoods: filteredGoods,
+ groupedGoods: groupedGoods,
+ leftColumnGoods: leftColumnGoods,
+ rightColumnGoods: rightColumnGoods
})
},
@@ -528,13 +630,20 @@ Page({
})
},
- // 跳转到入驻页面
+ // 跳转到我要卖蛋页面
navigateToSettlement: function() {
wx.navigateTo({
url: '/pages/settlement/index'
})
},
-
+
+ // 跳转到招商合作页面
+ navigateToCooperation: function() {
+ wx.navigateTo({
+ url: '/pages/cooperation/index'
+ })
+ },
+
// 预览图片
previewImage: function(e) {
// 阻止事件冒泡,避免触发商品点击事件
diff --git a/pages/index/index.wxml b/pages/index/index.wxml
index 344cb08..968629d 100644
--- a/pages/index/index.wxml
+++ b/pages/index/index.wxml
@@ -87,15 +87,22 @@
@@ -105,13 +112,9 @@