initial commit

This commit is contained in:
Ling53666
2025-04-28 15:59:21 +08:00
commit 36cc2fe7ba
55 changed files with 2627 additions and 0 deletions

73
pages/shop/shop.js Normal file
View File

@ -0,0 +1,73 @@
// pages/shop/shop.js
Page({
/**
* 页面的初始数据
*/
data: {
messageshop: [
{ name: '红枣夹核桃 500g 坚果大礼包', image: '/image/logo.png', price: 65, oldPrice: 99 },
{ name: '新疆大枣 1000g 优选原产地', image: '/image/logo.png', price: 48, oldPrice: 78 },
{ name: '每日坚果混合果仁干果套餐', image: '/image/logo.png', price: 88, oldPrice: 129 },
{ name: '每日坚果混合果仁干果套餐', image: '/image/logo.png', price: 88, oldPrice: 129 },
{ name: '每日坚果混合果仁干果套餐', image: '/image/logo.png', price: 88, oldPrice: 129 },
// 继续添加...
]
},
/**
* 生命周期函数--监听页面加载
*/
onLoad(options) {
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady() {
},
/**
* 生命周期函数--监听页面显示
*/
onShow() {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide() {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload() {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh() {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom() {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage() {
}
})

4
pages/shop/shop.json Normal file
View File

@ -0,0 +1,4 @@
{
"navigationBarTitleText": "商城",
"usingComponents": {}
}

56
pages/shop/shop.wxml Normal file
View File

@ -0,0 +1,56 @@
<!--pages/shop/shop.wxml-->
<!-- 导航栏部分 -->
<view class="shopbox">
<view class="kuai">
<view class="xiaohe">
<image class="logosize" src="/image/logo.png" mode="aspectFill"/>
<text>秒杀</text>
</view>
<view class="xiaohe">
<image class="logosize" src="/image/logo.png" mode="aspectFill"/>
<text>秒杀</text>
</view>
<view class="xiaohe">
<image class="logosize" src="/image/logo.png" mode="aspectFill"/>
<text>秒杀</text>
</view>
<view class="xiaohe">
<image class="logosize" src="/image/logo.png" mode="aspectFill"/>
<text>秒杀</text>
</view>
<view class="xiaohe">
<image class="logosize" src="/image/logo.png" mode="aspectFill"/>
<text>秒杀</text>
</view>
<view class="xiaohe">
<image class="logosize" src="/image/logo.png" mode="aspectFill"/>
<text>秒杀</text>
</view>
<view class="xiaohe">
<image class="logosize" src="/image/logo.png" mode="aspectFill"/>
<text>秒杀</text>
</view>
<view class="xiaohe">
<image class="logosize" src="/image/logo.png" mode="aspectFill"/>
<text>秒杀</text>
</view>
</view>
</view>
<!-- 具体商品界面 -->
<view class="box">
<view class="show">
<view class="shopping" wx:for="{{messageshop}}" wx:key="index">
<view class="imagebox">
<image class="imagesize" src="{{item.image}}" mode="aspectFill" />
</view>
<view class="tetxt">
<text class="wraptext">{{item.name}}</text>
<view class="price-row">
<text class="price-now">¥{{item.price}}</text>
<text class="price-old">¥{{item.oldPrice}}</text>
</view>
</view>
</view>
</view>
</view>

110
pages/shop/shop.wxss Normal file
View File

@ -0,0 +1,110 @@
/* pages/shop/shop.wxss */
.shopbox{
width: 100%;
height: auto;
display: flex;
justify-content: center;
align-items: center;
margin-top: 20rpx;
}
.kuai{
width: 95%;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
gap: 10rpx;
box-shadow: 0 6rpx 20rpx rgba(0, 0, 0, 0.08);
border-radius: 20px;
}
.logosize{
width: 50px;
height: 50px;
}
.xiaohe{
width: 23%;
aspect-ratio: 1 / 1;
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
}
.show {
width: 100%;
display: flex;
flex-wrap: wrap;
justify-content: flex-start;
padding: 20rpx;
box-sizing: border-box;
}
.shopping {
width: 45%;
margin: 19rpx;
background-color: #ffffff;
border-radius: 20rpx;
box-shadow: 0 6rpx 20rpx rgba(0, 0, 0, 0.08);
overflow: hidden;
display: flex;
flex-direction: column;
transition: transform 0.2s ease;
}
.shopping:active {
transform: scale(0.97);
}
.imagebox {
width: 100%;
aspect-ratio: 1;
background-color: #f6f6f6;
overflow: hidden;
}
.imagesize {
width: 100%;
height: 100%;
object-fit: cover;
display: block;
}
.tetxt {
padding: 16rpx;
display: flex;
flex-direction: column;
gap: 10rpx;
}
.wraptext {
font-size: 26rpx;
color: #333;
line-height: 1.4;
overflow: hidden;
display: -webkit-box;
-webkit-line-clamp: 2; /* 最多显示2行 */
-webkit-box-orient: vertical;
text-overflow: ellipsis;
}
.price-row {
display: flex;
justify-content: space-between;
align-items: center;
}
.price-now {
color: #fc7e09;
font-size: 28rpx;
font-weight: bold;
}
.price-old {
color: #aaa;
font-size: 24rpx;
text-decoration: line-through;
}
.box{
width: 100%;
display: flex;
justify-content: center;
align-items: center;
}