bbnv1
/
test
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

美食产品改版

master
jiazhipeng 7 months ago
parent
9a85f4f88b
commit
dcdf5cb253
7 changed files with 2263 additions and 388 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 1008
      pages/info/foodProductInfo/index.js
  2. 3
      pages/info/foodProductInfo/index.json
  3. 313
      pages/info/foodProductInfo/index.wxml
  4. 1245
      pages/info/foodProductInfo/index.wxss
  5. 4
      pages/order/food/index.js
  6. 24
      pages/order/food/index.wxml
  7. 52
      pages/order/food/index.wxss

1008
pages/info/foodProductInfo/index.js
View File

File diff suppressed because it is too large

3
pages/info/foodProductInfo/index.json
View File

@ -1,6 +1,7 @@
{
"usingComponents": {
"title":"/pages/component/TitleHeader",
"notice":"/pages/component/notice/notice"
"code":"../../order/components/wxqrCode/index"
}
}

313
pages/info/foodProductInfo/index.wxml
View File

@ -1,79 +1,264 @@
<!--pages/info/sceneProductInfo/index.wxml-->
<!--pages/info/hotelProductInfo/index.wxml-->
<wxs src="../../../utils/filter.wxs" module="tool" />
<title title="产品详情"></title>
<view class="iconfont icon-xin"></view>
<swiper class="swiper" indicator-dots="{{true}}"
autoplay="{{true}}" interval="{{2000}}" duration="{{300}}" wx:if="{{info.listimg}}">
<block wx:for="{{info.listimg}}" wx:key="*this">
<swiper-item>
<image lazy-load src="{{item}}" mode="aspectFill"></image>
</swiper-item>
</block>
</swiper>
<view class="top-info">
<view class="title">{{info.title}}</view>
<view class="tags-box textOver" style="height:auto">
<view class="tag textOver" wx:for="{{info.tags}}">{{item}}<view class="line"></view></view>
<view class="tags-price"><text>￥</text><text>{{info.price/100}}</text><text>起</text></view>
<!-- <view class="tags-text">详情 <text class="iconfont icon-you"></text></view> -->
<view class="share-icon" bindtap="share"></view>
<image lazy-load wx:for="{{info.sku}}" style="{{aniSkuIndex==index?('top:'+cartTop+'px;'):('top:'+top+'px;'+cartImgInfo)}}" class="headimg{{aniSkuIndex==index?' active':''}}" src="{{info.headimg}}" mode="aspectFill"></image>
<view style="position: relative;">
<swiper class="swiper" wx:if="{{info}}" autoplay="{{autoPlay}}" current="{{swiperCurrent}}"
interval="{{2000}}" duration="{{300}}" bindchange="swiperChange">
<block wx:if="{{info.videourl}}" wx:key="*this">
<swiper-item>
<video bindplay="playVideo" src="{{info.videourl}}" autoplay="{{true}}" muted="{{true}}"
show-mute-btn="{{true}}" show-background-playback-button="{{false}}"
show-progress="{{false}}" enable-progress-gesture="{{false}}"></video>
<!-- <image lazy-load src="{{info.headimg}}" mode="aspectFill"></image> -->
</swiper-item>
</block>
<block wx:for="{{info.listimg}}" wx:key="*this">
<swiper-item>
<image lazy-load src="{{item}}" mode="aspectFill"></image>
</swiper-item>
</block>
<block wx:for="{{info.sku}}" wx:key="*this">
<swiper-item style="position: relative;">
<image lazy-load src="{{item.headimg}}" mode="aspectFill"></image>
<view class="sku-tips ">
<view class="textOver">{{item.sku_name}}</view>
</view>
</swiper-item>
</block>
</swiper>
<view class="swiper-bottom" wx:if="{{info}}">
<!-- <view class="swuper-bottom-bg">
<view class="swiper-bottom-item {{(swiperCurrent>=swiperRange.video.min&&swiperCurrent<=swiperRange.video.max)?'active':''}}"
wx:if="{{info.videourl}}" bind:tap="changeSwiperCurrent" data-index="{{0}}">视频</view>
<view class="swiper-bottom-item {{(swiperCurrent>=swiperRange.picture.min&&swiperCurrent<=swiperRange.picture.max)?'active':''}}"
bind:tap="changeSwiperCurrent" data-index="{{swiperRange.picture.min}}">图片</view>
<view class="swiper-bottom-item {{(swiperCurrent>=swiperRange.sku.min&&swiperCurrent<=swiperRange.sku.max)?'active':''}}"
bind:tap="changeSwiperCurrent" data-index="{{swiperRange.sku.min}}">款式</view>
</view> -->
<view class="swiper-bottom-item bottom-number active">{{swiperCurrent+1}}/{{swiperRange.sku.max+1}}</view>
</view>
</view>
<view class="allowance-box" wx:if="{{allowance_data}}" bindtap="changeAllowance">
补贴价
<view class="com-price two">￥{{ allowance_data.mini_price / 100 }}起</view>
<view class="yellow">单品最高补贴{{ allowance_data.max_price / 100 }}元</view>
</view>
<view wx:if="{{info}}">
<view class="top-info" style="padding: 0;" >
<view class="wineScene-price-container" >
<view class="wineSecne-price">{{info.price/100}}<text class="wineSecne-money">优惠前￥{{info.market_price/100}}</text></view>
<view>已售{{info.sales_number>1000?"1000+":(info.sales_number||0)}}</view>
</view>
<view style="padding: 20rpx 20rpx 20rpx 26rpx;">
<view class="title textOver2">{{info.title}}</view>
<view class="tags-box textOver">
<view class="tag textOver" wx:for="{{info.display_tags}}">{{item}}</view>
</view>
<view class="other-info-box" >
<view class="other-info-item" style="align-items: flex-start;"bindtap="changeSimpleVal"
data-keyname="otherInfoShow" data-val="{{1}}" wx:if="{{info.shipment_tag}}">
<image lazy-load src="https://static.ticket.sz-trip.com/uploads/20250925/50f3e2316c3f3cc906fe4c78f127e960.png"></image>
<view class="other-content textOver" >{{info.shipment_tag_str}}</view>
<!-- <view style="margin-top: 6rpx;" class="view-arrow">></view> -->
</view>
<view class="other-info-item" bindtap="changeSimpleVal" data-keyname="otherInfoShow" data-val="{{2}}"
wx:if="{{info.service_tag_str}}">
<image lazy-load src="https://static.ticket.sz-trip.com/uploads/20250925/ce4323d9bcdf2ff03a0985ae4cbdabbe.png"></image>
<view class="other-content textOver">{{info.service_tag_str}}</view>
<!-- <view class="view-arrow">></view> -->
</view>
<view class="other-info-item" bindtap="changeSimpleVal" data-keyname="otherInfoShow" data-val="{{3}}"
wx:if="{{info.parameter_tag_str}}">
<image lazy-load src="https://static.ticket.sz-trip.com/uploads/20250925/958d9a3ed9404790ba5d17548e20fee8.png"></image>
<view class="other-content textOver">{{info.parameter_tag_str}}</view>
<!-- <view class="view-arrow">></view> -->
</view>
</view>
</view>
</view>
</view>
<view class="scroll-all-box" id="menus" wx:if="{{info}}">
<view style="height:85rpx" wx:if="{{fixed}}"></view>
<view class="info-box" id="box1">
<view class="info-title">套餐详情</view>
<rich-text class="details" nodes="{{tool.formateRichText(info.content)}}"></rich-text>
</view>
<!-- <view class="info-box" id="box2">
<view class="info-title">费用说明</view>
<rich-text class="details" nodes="{{tool.formateRichText(info.expense_info)}}"></rich-text>
</view> -->
<view class="info-box" id="box3">
<view class="info-title">购买须知</view>
<rich-text class="details" nodes="{{tool.formateRichText(info.book_info)}}"></rich-text>
</view>
<view style="height: 20rpx;width: 100%;background: #F7F7F7;"></view>
<!-- <view class="info-box" id="box4" style="padding: 20rpx 26rpx;">
<view class="info-title">产品推荐</view>
<view class="pro-list">
<view class="proitem" wx:for="{{tjList}}" bindtap="gotoDetail" data-item="{{item}}">
<view class="item-hd">
<image lazy-load src="{{item.headimg}}"></image>
</view>
<view class="item-bm" style="height: 120rpx;display: flex;flex-direction: column;justify-content: space-between;">
<view class="protitle textOver2">{{item.title}}</view>
<view class="pro-price">{{item.price/100}}</view>
</view>
</view>
</view>
</view> -->
</view>
<view style="height:140rpx"></view>
<view class="fixed-bottom">
<view class="['left-img',{{!iShop?'no-shop':''}}]">
<navigator wx:if="{{iShop}}" url="/pages/list/store/index?id={{supplierId}}" catchtap="pagePoint" data-event='product_customservice' class="shop-box">
<view class="shop-box">
<image lazy-load class="icon-shop" src="https://static.ticket.sz-trip.com/uploads/20230220/cc7bfaf50dccd354c56a1ad40d730b2e.png" mode="aspectFill"/>
<view>店铺</view>
</view>
</navigator>
<navigator url="/pages/user/service/index" catchtap="pagePoint" data-event='product_customservice' class="kefu-box">
<view class="iconfont icon-kefu"></view>
<view>客服</view>
</navigator>
<!-- <view bindtap="like" class="kefu-box">
<view class="iconfont {{isLike==1?'icon-shoucang':'icon-xin'}}"></view>
<view>收藏</view>
</view> -->
<view class="kefu-box"></view>
</view>
<view class="box">
<view class="box-top" style="border-top:none;border-bottom:1rpx solid #d9d9d9">
<text>{{info.title}}</text>
<view class="btns">
<!-- <view class="btn" bindtap="showCart">加入购物车</view> -->
<view class="btn" bindtap="showOrder" wx:if="{{info && info.flag==1}}" style="background:#D62828;border-radius: 39rpx;" >立即购买</view>
<view class="btn disable" wx:elif="{{info}}" style="border-radius: 39rpx;">该商品已下架</view>
</view>
<view class="product-item" wx:for="{{info.sku}}">
<view class="skutitle">{{item.sku_name}}</view>
<view class="product-box">
<view class="product-left textOver">
<view class="product-tags">
<view class="product-tag textOver" wx:for="{{item.display_tags}}">{{item}}</view>
</view>
<!-- 购物车悬浮框 -->
<navigator url="/pages/user/cartlist/list" catchtap="pagePoint" data-event='product_cart_click' class="cart-box" id="cart">
<image lazy-load src="https://static.ticket.sz-trip.com/xcxImages/info/cart.png" mode="widthFix"></image>
<view class="cart-num">{{cartCount}}</view>
</navigator>
<view class="mask" wx:if="{{skuFlag}}">
<view class="mask-bg" bindtap="hideSku"></view>
<view class="mask-content">
<view class="iconfont icon-close" bindtap="hideSku"></view>
<view class="sku-info-box">
<image lazy-load id="skuImg" src="{{info.sku[skuIndex].headimg}}" mode="aspectFill"></image>
<view class="sku-info">
<view>
<view class="sku-price">{{info.sku[skuIndex].price/100}}
<!-- <view class="allowance" wx:if="{{allowance_data}}">
补贴价：￥{{ (1 - allowance_data.discount_rate / 100) * info.sku[skuIndex].price / 100 }}</view> -->
</view>
<view class="sku-name">已选择：{{info.sku[skuIndex].sku_name}}</view>
</view>
<view class="order-tip-text" bindtap="showNotice" data-sku="{{item}}">预订须知>></view>
<view style="display: flex;align-items: center;">
<view class="number-box">
<view class="iconfont icon-sami-select" bindtap="minus"></view>
<view class="number">{{producNum}}</view>
<view class="iconfont icon-add-select" bindtap="add"></view>
</view>
<view class="limit-number" wx:if="{{info.sku[skuIndex].sku_model.traveller_limit_num>0}}">限购{{info.sku[skuIndex].sku_model.traveller_limit_num}}件</view>
</view>
</view>
</view>
<view style="font-weight: bold;font-size: 33rpx;color: #060001;margin:0rpx 25rpx 27rpx">产品分类（{{info.sku.length}}）</view>
<view class="sku-names">
<view bindtap="selectSku" data-index="{{index}}" class="sku-name-item {{index==skuIndex?' active':''}}"
wx:for="{{info.sku}}">
<image lazy-load src="{{item.headimg}}"></image>
<view class="sku-name textOver2">{{item.sku_name}}</view>
</view>
<view class="product-right">
<view class="price"><text>￥</text><text>{{item.price/100}}</text><text>起</text></view>
<view wx:if="{{item.flag=='on'}}" class="btn" data-product="{{info}}" data-sku="{{item}}" bindtap="order">立即预订</view>
<view wx:else class="btn disable" >立即预订</view>
</view>
<view style="height:138rpx"></view>
<view class="btn-box">
<view class="mask-btn" bindtap="order" wx:if="{{info.sku[skuIndex].flag=='on'}}">{{skuFlag=='cart'?'确认':'立即购买'}}
</view>
<view class="mask-btn disable" wx:else>该商品已下架</view>
</view>
</view>
<!-- <view class="empty-box">
<view>这里空空如也，快去向大家提问吧!</view>
<view class="empty-btn">去提问</view>
</view> -->
</view>
<view class="box" wx:if="{{info}}">
<view class="box-top" style="border-top:none">
<text>商家信息</text>
</view>
<view class="info-address">
<text>商家电话：{{info.supplier_tel}}</text>
<view class="iconfont icon-dianhua"></view>
</view>
<view class="info-address">
<text>商家地址：{{info.supplier_address}}</text>
<view class="iconfont icon-daohang" bindtap="gotoLocation"></view>
</view>
<view class="box-top">
<text>购买须知</text>
</view>
<view class="sku-items">
<view class="sku-item{{skuIndex==index?' active':''}}" bindtap="changeSku" data-index="{{index}}" wx:for="{{info.sku}}">套餐{{number[index]}}</view>
<!-- <view class="sku-item">套餐一</view> -->
<!-- <view class="sku-item">套餐一</view> -->
</view>
<view class="details">
<rich-text nodes="{{tool.formateRichText(info.sku[skuIndex].sku_model.bookinfo)}}"></rich-text>
<!-- <rich-text nodes="{{tool.formateRichText(info.sku[skuIndex].sku_model.detailinfo)}}"></rich-text> -->
<!-- <rich-text nodes="{{tool.formateRichText(info.sku[skuIndex].sku_model.expenseinfo)}}"></rich-text> -->
<!-- <rich-text nodes="{{tool.formateRichText(info.sku[skuIndex].sku_model.extrainfo)}}"></rich-text> -->
<view style="position:absolute;right:0;left:-10000rpx;top:-20000rpx;z-index:-1">
<canvas canvas-id='imageCanvas' class='imageCanvas' style="width:551rpx;height:643rpx;" disable-scroll='true'>
</canvas>
<canvas class="canvasCode" style="opacity:0;width:500px;height:500px" canvas-id="myQrcode"></canvas>
</view>
<view class="mask" wx:if="{{showShareFlag}}" style="align-items: center;">
<view class="mask-bg" bindtap="share"></view>
<view class="mask-content share-img-box">
<image lazy-load class="share-img" src="{{shareImg}}" mode="widthFix"></image>
<view class="share-tips">
<view style="position:relative">
<image lazy-load class="img" src="https://static.ticket.sz-trip.com/xcxImages/info/img.png" mode="widthFix">
</image>
<view>保存图片到相册</view>
<view class="tipimg">
<image lazy-load src="https://static.ticket.sz-trip.com/xcxImages/info/ok.png" mode="widthFix"></image>
</view>
</view>
<image lazy-load style="width:36rpx" src="https://static.ticket.sz-trip.com/xcxImages/info/arrow2.png" mode="widthFix"></image>
<view style="position:relative">
<image lazy-load class="img" src="https://static.ticket.sz-trip.com/xcxImages/info/code.png" mode="widthFix">
</image>
<view>微信识别二维码</view>
<view class="tipimg">
<image lazy-load src="https://static.ticket.sz-trip.com/xcxImages/info/ok1.png" mode="widthFix"></image>
</view>
</view>
</view>
<view class="save-btn" bindtap="save">保存到相册</view>
</view>
<view class="box-top">
<text>产品详情</text>
</view>
<view class="mask mask-allowance" wx:if="{{showAllowance}}">
<view bindtap="changeAllowance" class="mask-bg"></view>
<view class="mask-content rule-box">
<view class="rule-title">{{allowance_data.title}}</view>
<rich-text nodes="{{allowance_data.content}}"></rich-text>
</view>
<view class="details">
<rich-text nodes="{{tool.formateRichText(info.content)}}"></rich-text>
</view>
<code showModel="{{showQrCode}}" qrcode = "{{wxqrcode}}">
</code>
<!-- <view class="mask" wx:if="{{otherInfoShow>0}}"> -->
<view class="mask" wx:if="{{false}}">
<view class="mask-bg" bindtap="changeSimpleVal" data-keyname="otherInfoShow" data-val="{{0}}"></view>
<view class="mask-content">
<view class="iconfont icon-close" bindtap="changeSimpleVal" data-keyname="otherInfoShow" data-val="{{0}}"></view>
<view class="other-info-content">
<view class="title">{{otherInfoShow==3?"产品参数":otherInfoShow==2?"服务说明":"发货说明"}}</view>
<view wx:if="{{otherInfoShow==1}}">
<rich-text class="details" nodes="{{tool.formateRichText(info.shipment_info)}}"></rich-text>
</view>
<view wx:if="{{otherInfoShow==2}}">
<rich-text class="details" nodes="{{tool.formateRichText(info.service_info)}}"></rich-text>
</view>
<view wx:if="{{otherInfoShow==3}}">
<rich-text class="details" nodes="{{tool.formateRichText(info.parameter_info)}}"></rich-text>
</view>
</view>
<view style="height:138rpx"></view>
<view class="btn-box">
<view class="mask-btn" bindtap="changeSimpleVal" data-keyname="otherInfoShow" data-val="{{0}}">确定</view>
</view>
</view>
</view>
<notice wx:if="{{bookingInfo}}" bind:close="closeMask" bookingInfo="{{bookingInfo}}" skuName="{{skuName}}"></notice>

1245
pages/info/foodProductInfo/index.wxss
View File

File diff suppressed because it is too large

4
pages/order/food/index.js
View File

@ -85,14 +85,14 @@ Page({
order:function(){
if(!this.data.user){
wx.showToast({
title: '请输入预订人',
title: '请输入联系人',
icon: 'none'
})
return;
}
if(!this.data.tel){
wx.showToast({
title: '请输入手机号码',
title: '请输入手机号',
icon: 'none'
})
return;

24
pages/order/food/index.wxml
View File

@ -4,32 +4,34 @@
<view class="skuinfo">
<image lazy-load src="{{product.sku.headimg}}" mode="aspectFill"></image>
<view class="right-info">
<view class="sku-name textOver2">{{product.product.title+product.sku.sku_name}}</view>
<view class="info-tips">
<view class="sku-name textOver2">{{product.product.title}}</view>
<view class="sku-name2 textOver2">{{product.sku.sku_name}}</view>
<!-- <view class="info-tips">
<view class="price"><text>￥</text>{{product.sku.price/100}}</view>
<view bindtap="showNotice">购买须知 <text class="iconfont icon-you"></text> </view>
</view>
</view> -->
</view>
<view class="info-tips"><text>￥</text>{{product.sku.price/100}}</view>
</view>
<view class="box-title">
<view style="flex:1">购票数量</view>
<view class="box-title" style="border-top: none;">
<view style="flex:1">购买数量</view>
<view class="iconfont icon-sami-select" bindtap="minus"></view>
<view class="number-box">{{productNum}}</view>
<view class="iconfont icon-add-select" bindtap="add"></view>
</view>
<view class="box-title">
<view style="flex-shrink:0">预订人：</view>
<input type="text" value="{{user}}" bindinput="userInput" placeholder="请输入预订人真实姓名"></input>
<view style="flex-shrink:0">联系人：</view>
<input type="text" value="{{user}}" bindinput="userInput" placeholder="输入您的名字"></input>
</view>
<view class="box-title">
<view style="flex-shrink:0">手机号码：</view>
<input type="number" value="{{tel}}" bindinput="telInput" placeholder="请输入手机号码"></input>
<view style="flex-shrink:0">手机号：</view>
<input type="number" value="{{tel}}" bindinput="telInput" placeholder="请输入手机号"></input>
</view>
</view>
<coupon id="coupon" money="{{product.sku.price * productNum}}" sku="{{product.sku.id}}"></coupon>
<view style="height:113rpx"></view>
<view class="fixed-bottom" wx:if="{{product}}">
<view class="fixed-price-box"><text>合计：</text><text class="price">¥{{((product.sku.price * productNum - (coupon?coupon.activity.money:0))>0?(product.sku.price * productNum - (coupon?coupon.activity.money:0)):0) / 100}}</text></view>
<view class="fixed-btn" bindtap="order">立即预约</view>
<view class="fixed-price-box"><text>订单金额：</text><text class="price">¥{{((product.sku.price * productNum - (coupon?coupon.activity.money:0))>0?(product.sku.price * productNum - (coupon?coupon.activity.money:0)):0) / 100}}</text></view>
<view class="fixed-btn" bindtap="order">提交订单</view>
</view>
<notice bind:close="closeNotice" wx:if="{{showNoticeFlag}}" bookingInfo="{{product.sku.sku_model}}" skuName="{{product.sku.sku_name}}"></notice>

52
pages/order/food/index.wxss
View File

@ -12,10 +12,11 @@ page {
margin: 0 20rpx;
font-size: 31rpx;
color: #000;
font-weight: 500;
font-weight: 600;
display: flex;
align-items: center;
}
.coupon-btn {
width: 138rpx;
line-height: 56rpx;
@ -29,48 +30,47 @@ page {
display: flex;
justify-content: space-between;
padding: 30rpx 20rpx;
margin-bottom: 30rpx;
align-items: flex-start;
}
.skuinfo image {
flex-shrink: 0;
width: 174rpx;
height: 143rpx;
border-radius: 7rpx;
margin-right: 23rpx;
background: red;
width: 147rpx;
height: 147rpx;
border-radius: 13rpx;
margin-right: 12rpx;
}
.right-info {
flex: 1;
width: 100%;
padding-right: 30rpx;
}
.sku-name {
font-size: 32rpx;
line-height: 47rpx;
height: 94rpx;
color: #333;
margin-bottom: 10rpx;
font-weight: bold;
font-size: 31rpx;
color: #333333;
}
.info-tips {
display: flex;
justify-content: space-between;
align-items: center;
font-size: 27rpx;
color: #666;
.sku-name2{
font-weight: 500;
font-size: 27rpx;
color: #999999;
margin-top: 30rpx;
}
.info-tips .price {
font-size: 33rpx;
color: #000;
.info-tips {
font-weight: bold;
font-size: 33rpx;
color: #000000;
flex-shrink: 0;
}
.info-tips .price text {
.info-tips text {
font-size: 24rpx;
font-weight: 400;
}
.info-tips .iconfont {
font-size: 26rpx;
}
.box-title .iconfont {
font-size: 28rpx;
flex-shrink: 0;
}
.number-box {
font-size: 29rpx;
font-weight: 500;
@ -95,7 +95,7 @@ page {
flex: 1;
display: block;
font-size: 31rpx;
color: #666;
color: #000000;
margin-left: 15rpx;
font-weight: 400;
}

Write Preview
Loading…
Cancel
Save