This commit is contained in:
Ling53666
2025-08-18 09:11:51 +08:00
commit 02554225da
2516 changed files with 133155 additions and 0 deletions

View File

@ -0,0 +1,245 @@
.cebian {
width: 20%;
height: 100%;
}
.text {
width: 100%;
height: 50px;
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
cursor: pointer;
}
.color {
font-size: 14px;
color: rgb(0, 0, 0); /* 默认文字颜色 */
}
.xian{
width: 60px;
height: 3px;
background-color: #f2819f;
margin-top: 5rpx;
}
.xinxi{
width: 80%;
height: 100%;
display: flex;
align-items: center;
flex-direction: column;
overflow-y: scroll;
overflow-x: hidden;
}
.pages{
width: 100%;
height: 100%;
display: flex;
margin-top: 30rpx;
}
.shop{
width: 90%;
height:130px;
border: 1px solid #f2819f;
border-radius: 20px;
margin-top: 10rpx;
display: flex;
margin-bottom: 10rpx;
}
.boxmessage{
width: 60%;
height: 100%;
display: flex;
justify-content: center;
flex-direction: column;
}
.image{
width: 100px;
height: 100px;
border-radius: 20px;
}
.imagebox{
width: 40%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
margin-left: 10rpx;
}
.dingwei{
width: 100%;
height: 50%;
}
.dingweia{
width: 100%;
height: 30%;
display: flex;
justify-content: space-between;
align-items: center;
}
.yuyue{
display: flex;
justify-content: center;
align-items: center;
width: 50px;
height: 20px;
border-radius: 20px;
border: 1px solid #fb96b1;
background-color: #fb96b1;
margin-right: 10rpx;
}
.yuyuekuang{
width: 100%;
height: 20%;
display: flex;
justify-content: space-between;
}
.gouimage{
width: 20px;
height: 20px;
margin-right: 10rpx;
}
/* 店铺名框 */
.Box2
{
width: 100%;
height: 130px;
background-color: white;
margin-top: 50rpx;
border-radius: 15px;
}
/* 店铺名 */
.z2{
font-size: 25px;
font-weight: bolder;
position: relative;
}
.image1{
width: 80px;
height: 20px;
margin-left: 10rpx;
margin-top: 20rpx;
}
.z3{
position: relative;
left: 20rpx;
color: rgb(194, 53, 53);
}
.z4{
position: relative;
left: 50rpx;
}
/* 营业时间 */
.z6{
color: #4095E5;
font-weight: bolder;
margin-left: 20rpx;
}
.z7{
display: flex;
width: 300px;
margin-left: 10rpx;
font-size: 13px;
margin-top: 3rpx;
}
.box3{
width: 100%;
height: 1px;
background-color: darkgrey;
margin-top: 10rpx;
}
/* 地址 */
.z8{
font-size: 12px;
margin-left: 10rpx;
}
.image3{
width: 10px;
height: 12px;
margin-left: 5rpx;
}
.box4{
width: 100%;
height: 1px;
background-color: darkgrey;
margin-top: 10rpx;
}
.shangimage{
width: 200rpx;
height: 200rpx;
border-radius: 10%;
margin-left: 20rpx;
}
.box8{
width: 500rpx;
height: 200rpx;
position: relative;
left: 230rpx;
bottom: 200rpx;
}
.tiao{
width: 100px;
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
}
.tiaobox{
width: 100%;
height: 30px;
display: flex;
}
.pingjia{
width: 100%;
display: flex;
flex-direction: column;
align-items: center;
margin-top: 10rpx;
}
.pingjiakuang{
width: 90%;
border-top: #6e7071 1px solid;
height: auto;
margin-top: 20rpx;
}
.pingjiaimage{
width: 40px;
height: 40px;
border-radius: 50px;
}
.touxiang{
width: 100%;
height: 40px;
display: flex;
align-items: center;
margin-top: 10rpx;
}
.kuangimage{
width: 100px;
height: 100px;
margin:10rpx 10rpx 10rpx 10rpx;
border-radius: 10px;
}
.tupianbox{
width: 100%;
justify-content: center;
}
.soucangimage{
width: 30px;
height: 30px;
position: absolute;
right: 80rpx;
top: -40rpx;
}
.zixunimage{
width: 30px;
height: 30px;
position: absolute;
right: 0rpx;
top: -40rpx;
}
.time{
width: 100%;
display: flex;
}

View File

@ -0,0 +1,125 @@
<!-- 店铺名框 -->
<view class="Box2" >
<image class="shangimage" mode="scaleToFill" src="{{businessAvatar}}" />
<view class="box8">
<text class="z2">{{businessName}}</text>
<view style="margin-top:10rpx">
<ant-rate
defaultValue="{{level}}"
readonly
></ant-rate>
<text class="z3">{{level}}.0</text>
<text class="z4">500条</text>
</view>
<view onTap="soucang">
<image class="soucangimage" mode="scaleToFill" src="../image/shoucang.png" />
</view>
<view onTap="zixun">
<image class="zixunimage" mode="scaleToFill" src="../image/zixun.png" />
</view>
</view>
</view>
<!-- 营业时间 -->
<view style="margin-bottom:20rpx">
<view class="time">
<text class="z6" a:if="{{storeStatus == 0}}">已休息</text>
<text class="z6" a:if="{{storeStatus == 1}}">营业中</text>
<view>
<text class="z7">营业时间:{{startBusiness}}-{{endBusiness}}</text>
</view>
</view>
<view class="box3"></view>
<!-- 地址 -->
<view>
<image class="image3" mode="scaleToFill" src="../image/didian.png" />
<text class="z8">{{address}}</text>
</view>
<view class="box4"></view>
</view>
<view class="tiaobox">
<view class="tiao" a:for="{{ names }}" onTap="chaxunzhuangtai" data-id={{item.id}}>
<text>{{item.hengname}}</text>
<view class="xian" a:if="{{item.line}}" ></view>
</view>
</view>
<!-- 购物车 -->
<view class="pages" a:if="{{ showShoppingCart }}">
<!-- 侧边栏 -->
<view class="cebian">
<view class="text"
a:for="{{ lie }}"
onTap="selectItem"
data-id="{{item.id}}">
<text class="color">{{item.name}}</text>
<view>
<!-- 动态绑定 xian 是否显示 -->
<view class="xian" a:if="{{item.showLine}}"></view>
</view>
</view>
</view>
<view class="xinxi">
<view class="shop" a:for="{{ filteredShopping }}">
<view class="imagebox">
<image class="image" mode="scaleToFill" src="{{item.commoditiesImage}}" />
</view>
<view class="boxmessage" >
<view class="dingweia">
<view>
<text>{{item.commoditiesName}}</text>
</view>
<view onTap="jiaru" data-num="{{item}}">
<image class="gouimage" mode="scaleToFill" src="../image/tijiagouwuche.png" />
</view>
</view>
<view class="dingwei">
<text style="font-size:12px;color:#9c9a9a">款式随便做,饰品不限量,含甲片,含卸甲</text>
</view>
<view class="yuyuekuang" >
<text>¥{{item.commoditiesPrice}}</text>
<view class="yuyue" data-num="{{item}}" onTap="shangpinjiemian">
<text>预约</text>
</view>
</view>
</view>
</view>
</view>
</view>
<!-- 评价 -->
<view class="pingjia" a:if="{{ showComments }}">
<view class="pingjiakuang" a:for="{{ pingjia }}">
<view class="touxiang">
<image class="pingjiaimage" mode="scaleToFill" src="{{item.user.avatarUrl}}" />
<text style="margin-left:10rpx">{{item.user.username}}</text>
</view>
<view style="width:100%">
<text style="color:#8a8f93;font-size:13px">颜色冰透系列裸色01色+烤灯-简约</text>
<view style="width:100%;word-wrap: break-word;">
<text>{{item.userRating.review}}</text>
</view>
</view>
<view class="tupianbox" a:if="{{ item.userRating.picture }}">
<image class="kuangimage" mode="scaleToFill" src="{{item.userRating.picture}}" />
</view>
</view>
</view>
<!-- 商家 -->
<view style="width:100%;margin-top:20rpx" a:if="{{ showBusinessInfo }}">
<view style="margin-top:10rpx">
<view class="box3" style="margin-top:10rpx;"></view>
<text>店铺名称:{{businessName}}</text>
</view>
<view style="margin-top: 10rpx;">
<view class="box3" style="margin-top:10rpx"></view>
<text onTap="callPhone">联系电话:{{businessPhone}}</text>
</view>
<view style="margin-top: 10rpx;">
<view class="box3" style="margin-top:10rpx"></view>
<text>营业时间:{{startBusiness}}-{{endBusiness}}</text>
</view>
<view style="margin-top: 10rpx;">
<view class="box3" style="margin-top:10rpx"></view>
<text>店铺地址:{{address}}</text>
</view>
<view class="box3" style="margin-top:10rpx"></view>
</view>

View File

@ -0,0 +1,435 @@
import{url} from '../request'
Page({
data: {
lie: [
{ id: 1, name: '推荐款式', showLine: true },
{ id: 2, name: '中长款', showLine: false },
{ id: 3, name: '本甲款', showLine: false },
{ id: 4, name: '长款', showLine: false },
{ id: 5, name: '短款', showLine: false },
],
names:[
{ id:1, hengname:'款式分类',line:true},
{id:2,hengname:'评价',line:false},
{id:3,hengname:'商家',line:false},
],
userId: '',
address: '',
businessName:'',
businessAvatar:'',
startBusiness:'',
endBusiness:'',
storeStatus:'',
businessId: '',
commoditiesGroupId: 0,
commoditiesName: "",
current: 0,
pageSize: 0,
sortField: "",
sortOrder: "",
status: "",
tuijian:[],
meijiashi:[],
email: "",
gender: 0,
manicuristAvatar: "",
manicuristName: "",
phone: "",
rating: 0,
specialties: "",
id:'',
filteredShopping: [],
showShoppingCart: true, // 控制购物车部分是否显示
showComments: false, // 控制评论部分是否显示
showBusinessInfo: false, // 控制商家信息是否显示
pingjia:[],
selectedOptions:'0',
level:''
},
callPhone() {
my.makePhoneCall({
number: this.data.businessPhone,
success: function(res) {
console.log(res); //{"success": true}
},
fail: function(err) {
console.log(err);
}
});
},
number(){
const randomLevel = Math.floor(Math.random() * 5) + 1;
this.setData({
level: randomLevel,
});
console.log("随机生成的 level 值是:", randomLevel);
},
onLoad(options) {
this.number();
// Extract userId and address from options
const userId = options.userId;
const address = options.address;
const businessName = options.businessName;
const businessAvatar = options.businessAvatar;
const startBusiness = options.startBusiness;
const endBusiness = options.endBusiness;
const storeStatus = options.storeStatus;
const id = options.id
const businessPhone = options.businessPhone
console.log(storeStatus,id,'这是店铺id吗');
// Set them in data for use in the page
this.setData({
userId: userId,
address: address,
businessName:businessName,
businessAvatar:businessAvatar,
endBusiness:endBusiness,
startBusiness:startBusiness,
storeStatus:storeStatus,
id:id,
businessPhone:businessPhone,
});
my.request({
url: url + '/api/commodities/list/page/commodities',
method: 'POST',
data: {
businessId: id,
commoditiesGroupId: "",
commoditiesName: "",
current: 0,
pageSize: 100,
sortField: "",
sortOrder: "",
status: "",
},
headers: {
'content-type': 'application/json',
},
dataType: 'json',
success: (res) => {
console.log(id,'这是onload');
console.log('Request succeeded:', res);
if (res.data && res.data.data) {
this.setData({
tuijian: res.data.data.records, // 更新 tuijian 列表
});
this.chushihua();
console.log(this.data.tuijian,'这是推荐');
} else {
console.log('shibaile')
}
},
fail: (error) => {
console.error('Request failed', error);
}
});
this.pingjia()
},
soucang() {
my.getStorage({
key: 'userInfo',
success: (res) => {
const userInfo = res.data;
const businessId = this.data.id; // 获取 onLoad 中保存的 id
if (userInfo && userInfo.cookie) {
my.request({
url: url + '/api/collect/add',
method: 'POST',
data: {
businessId: businessId, // 使用 businessId 来请求收藏
userId: userInfo.id
},
headers: {
'content-type': 'application/json',
'Cookie': userInfo.cookie,
},
dataType: 'json',
success: (res) => {
console.log(res);
if(res.data.code===0){
my.alert({
content: '收藏成功'
});
}
else if(res.data.code===40100){
my.alert({
content: '登录信息已过期,请重新登录'
});
my.navigateTo({
url:'/pages/denglu/denglu'
})
}else{
my.alert({
content: '店铺已收藏'
});
}
},
fail: (error) => {
console.error('请求失败: ', JSON.stringify(error));
my.alert({ content: '请求失败,请稍后重试' });
},
});
} else {
my.alert({
content: '您未登录,请先登录。',
success: () => {
my.navigateTo({
url: '/pages/denglu/denglu',
});
},
});
}
},
});
},
pingjia(){
my.request({
url: url + '/api/level/listBusinessRating',
method: 'GET',
data: {
businessId:this.data.id,
},
headers: {
'content-type': 'application/json',
},
dataType: 'json',
success: (res) => {
console.log(res,'评价部分');
if(res.data.code===0){
this.setData({
pingjia:res.data.data,
useridpingjia:res.data.data.userId
})
}
},
fail: (error) => {
console.error('请求失败: ', JSON.stringify(error));
my.alert({ content: '请求失败,请稍后重试' });
},
});
},
zixun(){
my.navigateTo({
url:'/pages/zixunmeijiashi/zixunmeijiashi'
})
},
// 点击事件处理函数
selectItem(e) {
const id = e.currentTarget.dataset.id;
console.log(id);
// 更新对应的 showLine 状态,控制是否显示线条
const updatedLie = this.data.lie.map(item => {
if (item.id === id) {
item.showLine = !item.showLine; // 切换显示状态
} else {
item.showLine = false; // 其他项隐藏
}
return item;
});
// 根据点击的类别 id 筛选对应的商品
const filteredShopping = this.data.tuijian.filter(item => String(item.commoditiesGroupId) === String(id));
// 更新数据
this.setData({
lie: updatedLie,
filteredShopping, // 更新右侧商品列表
showShoppingCart: true, // 显示购物车部分
showComments: false, // 隐藏评论部分
showBusinessInfo: false, // 隐藏商家信息部分
});
console.log(this.data.filteredShopping,'hhhhhhhhhhhhhh');
},
chushihua(){
this.setData({
filteredShopping: this.data.tuijian.filter(item => String(item.commoditiesGroupId) === "1"), // 默认选中类别 1
})
console.log(this.data.filteredShopping,'chushi');
},
chaxunzhuangtai(e) {
const id = e.currentTarget.dataset.id;
console.log(id);
// 更新对应的 line 状态,控制是否显示线条
const updatednames = this.data.names.map(item => {
if (item.id === id) {
item.line = !item.line; // 切换显示状态
} else {
item.line = false; // 其他项隐藏
}
return item;
});
this.setData({
names: updatednames,
});
// 根据点击的分类切换显示内容
if (id === 1) {
this.setData({
showShoppingCart: true, // 显示购物车
showComments: false, // 隐藏评论
showBusinessInfo: false, // 隐藏商家信息
});
} else if (id === 2) {
this.setData({
showShoppingCart: false, // 隐藏购物车
showComments: true, // 显示评论
showBusinessInfo: false, // 隐藏商家信息
});
} else if (id === 3) {
this.setData({
showShoppingCart: false, // 隐藏购物车
showComments: false, // 隐藏评论
showBusinessInfo: true, // 显示商家信息
});
}
},
jiaru(item) {
const id = item.target.dataset.num
console.log('传递的数据:', id);
const ids = id.id
const businessId = id.businessId
const selectedOptions = '到店服务'
my.getStorage({
key: 'userInfo',
success: (res) => {
const userInfo = res.data;
console.log(userInfo);
if (userInfo && userInfo.cookie) {
my.request({
url: url + '/api/cart/add',
method: 'POST',
data: {
businessId: businessId,
commoditiesId: ids,
quantity: 1,
selectedOptions: selectedOptions,
userId: userInfo.id
},
headers: {
'content-type': 'application/json',
'Cookie': userInfo.cookie, // 通过头部传递 cookie
},
dataType: 'json',
success: (res) => {
if(res.data.code===0){
console.log(res);
my.alert({ content: '成功添加到购物车' });
}
else if(res.data.code===40100){
my.alert({
content: '登录信息已过期,请重新登录'
});
my.navigateTo({
url:'/pages/denglu/denglu'
})
}else{
console.log(res,'shibaile');
}
},
fail: (error) => {
console.error('请求失败: ', JSON.stringify(error));
my.alert({ content: '请求失败,请稍后重试' });
},
});
} else {
my.alert({
content: '您未登录,请先登录。',
success: () => {
my.navigateTo({
url: '/pages/denglu/denglu',
});
},
});
}
},
});
},
// jiaru(item) {
// const id = item.target.dataset.num
// console.log('传递的数据:', id);
// const ids = id.id
// const businessId = id.businessId
// my.getStorage({
// key: 'userInfo',
// success: (res) => {
// console.log('jjjjjjj',res);
// const userInfo = res.data;
// if (userInfo && userInfo.cookie) {
// console.log('chenggonmgme');
// my.request({
// url: url + '/api/cart/add',
// method: 'POST',
// data: {
// businessId: businessId,
// commoditiesId: ids,
// quantity: 1,
// selectedOptions: selectedOptions,
// userId: userInfo.id
// },
// headers: {
// 'content-type': 'application/json',
// 'Cookie': userInfo.cookie, // 通过头部传递 cookie
// },
// dataType: 'json',
// success: (res) => {
// console.log('zoule');
// if(res.data.code===0){
// console.log(res);
// my.alert({ content: '成功添加到购物车' });
// }
// else if(res.data.code===40100){
// my.alert({
// content: '登录信息已过期,请重新登录'
// });
// my.navigateTo({
// url:'/pages/denglu/denglu'
// })
// }else{
// console.log(res,'shibaile');
// }
// },
// fail: (error) => {
// console.error('请求失败: ', JSON.stringify(error));
// my.alert({ content: '请求失败,请稍后重试' });
// },
// });
// } else {
// my.alert({
// content: '您未登录,请先登录。',
// success: () => {
// my.navigateTo({
// url: '/pages/denglu/denglu',
// });
// },
// });
// }
// },
// });
// },
shangpinjiemian(item){
const id = item.target.dataset.num
console.log('传递的数据:', id);
const ids = id.id
const commoditiesPrice = id.commoditiesPrice
const commoditiesName = id.commoditiesName
const commoditiesImage = id.commoditiesImage
const businessId = id.businessId
const dianpuid = this.data.id
const businessName =this.data.businessName
console.log('Address being passed: ',id,commoditiesPrice,commoditiesName,commoditiesImage,businessId);
my.navigateTo({
url:`/pages/yuyuejiemian/yuyuejiemian?commoditiesPrice=${commoditiesPrice}&&commoditiesName=${commoditiesName}&&commoditiesImage=${commoditiesImage}&&ids=${ids}&&businessId=${businessId}&&dianpuid=${dianpuid}&&businessName=${businessName}`
})
console.log(ids,businessId,commoditiesImage,commoditiesName,commoditiesPrice+'这是商品的',dianpuid+'这是店铺的')
},
kefu(){
my.navigateTo({
url:'/pages/zixunmeijiashi/zixunmeijiashi'
})
}
});

View File

@ -0,0 +1,7 @@
{
"defaultTitle": "店铺主页",
"usingComponents": {
"ant-rate": "antd-mini/es/Rate/index"
},
"styleIsolation": "apply-shared"
}