jiazhipeng 8 months ago
parent
commit
07c94b6884
  1. 27
      pages/info/postProductInfo/index.js
  2. 89
      pages/info/postProductInfo/index.wxml
  3. 103
      pages/info/postProductInfo/index.wxss
  4. 7
      project.private.config.json
  5. 4
      utils/https.js

27
pages/info/postProductInfo/index.js

@ -43,7 +43,8 @@ Page({
video: {min:0,max:0}, video: {min:0,max:0},
picture: {min:0,max:0}, picture: {min:0,max:0},
sku: {min:0,max:0} sku: {min:0,max:0}
} },
otherInfoShow: 0,
}, },
/** /**
@ -115,7 +116,7 @@ Page({
info: resData, info: resData,
supplierId: res.data.supplier_id, supplierId: res.data.supplier_id,
iShop: res.data.supplier_id ? true : false, iShop: res.data.supplier_id ? true : false,
swiperRange: swiperRange swiperRange: swiperRange,
}) })
// 获取补贴 // 获取补贴
@ -319,7 +320,8 @@ Page({
selectSku: function (e) { selectSku: function (e) {
let index = e.currentTarget.dataset.index; let index = e.currentTarget.dataset.index;
this.setData({ this.setData({
skuIndex: index skuIndex: index,
swiperCurrent: index+this.data.swiperRange.picture.max+1
}) })
}, },
showOrder: function () { showOrder: function () {
@ -341,8 +343,14 @@ Page({
}) })
return; return;
} }
let swiperCurrent = this.data.swiperCurrent;
let skuIndex = swiperCurrent - this.data.swiperRange.sku.min
console.log(swiperCurrent, skuIndex)
if (skuIndex<0) {skuIndex=0}
this.setData({ this.setData({
skuFlag: 'order' skuFlag: 'order',
skuIndex: skuIndex,
swiperCurrent: skuIndex+this.data.swiperRange.picture.max+1
}) })
} }
}) })
@ -745,10 +753,12 @@ Page({
}, },
swiperChange (e) { swiperChange (e) {
if(e.detail.source == "touch") {
let index = e.detail.current let index = e.detail.current
this.setData({ this.setData({
swiperCurrent: index swiperCurrent: index
}) })
}
console.log(e, this.data.swiperCurrent) console.log(e, this.data.swiperCurrent)
}, },
changeSwiperCurrent (e) { changeSwiperCurrent (e) {
@ -757,6 +767,15 @@ Page({
swiperCurrent: index swiperCurrent: index
}) })
}, },
changeSimpleVal (e) {
let keyname = e.currentTarget.dataset.keyname;
let val = e.currentTarget.dataset.val;
let param = {}
param[keyname] = val
this.setData(param)
console.log(this.data)
},
/** /**
* 生命周期函数--监听页面初次渲染完成 * 生命周期函数--监听页面初次渲染完成

89
pages/info/postProductInfo/index.wxml

@ -1,12 +1,15 @@
<!--pages/info/hotelProductInfo/index.wxml--> <!--pages/info/hotelProductInfo/index.wxml-->
<wxs src="../../../utils/filter.wxs" module="tool" /> <wxs src="../../../utils/filter.wxs" module="tool" />
<title title="产品详情"></title> <title title="产品详情"></title>
<view class="iconfont icon-fenxiang" bindtap="share"></view> <view class="share-icon" bindtap="share"></view>
<view class="swiper-bottom" wx:if="{{info}}"> <view class="swiper-bottom" wx:if="{{info}}">
<view class="swiper-bottom-item active">{{swiperCurrent+1}}/{{swiperRange.sku.max+1}}</view> <view class="swiper-bottom-item bottom-number active">{{swiperCurrent+1}}/{{swiperRange.sku.max+1}}</view>
<view class="swiper-bottom-item {{(swiperCurrent>=swiperRange.video.min&&swiperCurrent<=swiperRange.video.max)?'active':''}}" wx:if="{{info.videourl}}">视频</view> <view class="swuper-bottom-bg">
<view class="swiper-bottom-item {{(swiperCurrent>=swiperRange.picture.min&&swiperCurrent<=swiperRange.picture.max)?'active':''}}">图片</view> <view class="swiper-bottom-item {{(swiperCurrent>=swiperRange.video.min&&swiperCurrent<=swiperRange.video.max)?'active':''}}" wx:if="{{info.videourl}}">视频</view>
<view class="swiper-bottom-item {{(swiperCurrent>=swiperRange.sku.min&&swiperCurrent<=swiperRange.sku.max)?'active':''}}">款式</view> <view class="swiper-bottom-item {{(swiperCurrent>=swiperRange.picture.min&&swiperCurrent<=swiperRange.picture.max)?'active':''}}">图片</view>
<view class="swiper-bottom-item {{(swiperCurrent>=swiperRange.sku.min&&swiperCurrent<=swiperRange.sku.max)?'active':''}}">款式</view>
</view>
</view> </view>
@ -17,7 +20,7 @@
<swiper-item> <swiper-item>
<video bindplay="playVideo" src="{{info.videourl}}" autoplay="{{true}}" muted="{{true}}" <video bindplay="playVideo" src="{{info.videourl}}" autoplay="{{true}}" muted="{{true}}"
show-mute-btn="{{true}}" show-background-playback-button="{{false}}" show-mute-btn="{{true}}" show-background-playback-button="{{false}}"
show-progress="{{false}}"></video> show-progress="{{true}}" ></video>
<!-- <image src="{{info.headimg}}" mode="aspectFill"></image> --> <!-- <image src="{{info.headimg}}" mode="aspectFill"></image> -->
</swiper-item> </swiper-item>
</block> </block>
@ -51,19 +54,45 @@
<view style="padding: 20rpx 20rpx 20rpx 26rpx;"> <view style="padding: 20rpx 20rpx 20rpx 26rpx;">
<view class="select-img"> <view class="select-img">
<image class="{{(swiperCurrent>=swiperRange.picture.min&&swiperCurrent<=swiperRange.picture.max)?'active':''}}" <image class="{{(swiperCurrent>=swiperRange.picture.min&&swiperCurrent<=swiperRange.picture.max)?'active':''}}"
style="flex-shrink: 0;" src="{{info.headimg}}" bind:tap="changeSwiperCurrent" data-index="{{swiperRange.picture.min}}"></image> style="flex-shrink: 0;" src="{{info.headimg}}" bind:tap="changeSwiperCurrent" data-index="{{0}}"></image>
<text style="flex-shrink: 0;" class="select-img-text">款式选择</text> <text style="flex-shrink: 0;" class="select-img-text">款式选择</text>
<view class="other-imgs no-scrollbar"> <view class="other-imgs no-scrollbar">
<image wx:for="{{info.sku}}" wx:key="index" bind:tap="changeSwiperCurrent" data-index="{{swiperRange.picture.max+1+index}}" <image wx:for="{{info.sku}}" wx:key="index" bind:tap="changeSwiperCurrent" data-index="{{swiperRange.picture.max+1+index}}"
class="{{item.flag!='on'?'no-stock':''}} {{swiperCurrent==swiperRange.picture.max+1+index?'active':''}}" class="{{swiperCurrent==swiperRange.picture.max+1+index?'active':''}}"
src="{{item.headimg}}"></image> src="{{item.headimg}}"></image>
</view> </view>
<view class="select-sku">></view> <view class="select-sku" bind:tap="showOrder">></view>
</view> </view>
<view class="title textOver2">{{info.title}}</view> <view class="title textOver2">{{info.title}}</view>
<!-- <view class="hotel-custom" style="padding:26rpx 0"> <view class="tags-box textOver">
<view class="tag textOver" wx:for="{{info.display_tags}}">{{item}}</view>
</view>
<view class="other-info-box" wx:if="{{info.is_package!=1}}">
<view class="other-info-item" style="align-items: flex-start;"bindtap="changeSimpleVal" data-keyname="otherInfoShow" data-val="{{1}}">
<image style="margin-top: 6rpx;" src="https://static.ticket.sz-trip.com/uploads/20250826/c520e7e453443bfe19e27ea0e44e6b22.png"></image>
<view class="other-content">
<view style="color: #0B898E;">预计48小时内发货</view>
<view style="padding-top: 10rpx;">江苏苏州 | 快递:免运费</view>
</view>
<view style="margin-top: 6rpx;" class="view-arrow">></view>
</view>
<view class="other-info-item" bindtap="changeSimpleVal" data-keyname="otherInfoShow" data-val="{{2}}">
<image src="https://static.ticket.sz-trip.com/uploads/20250826/30fc41c747c0126edd396ef92ff7ef62.png"></image>
<view class="other-content">极速退款 | 未使用可退 | 客服售后</view>
<view class="view-arrow">></view>
</view>
<view class="other-info-item" bindtap="changeSimpleVal" data-keyname="otherInfoShow" data-val="{{3}}">
<image src="https://static.ticket.sz-trip.com/uploads/20250826/049b31024ee73e76f9612e8d8141bd66.png"></image>
<view class="other-content">名称 鸡头米 | 产地 苏州 | 类型 机剥 | 重量 500g</view>
<view class="view-arrow">></view>
</view>
</view>
<view class="hotel-custom" style="padding:26rpx 0" wx:if="{{info.is_package===1}}">
<view class="hotel-custom-detail" wx:for="{{info.product_data}}" wx:key="item"> <view class="hotel-custom-detail" wx:for="{{info.product_data}}" wx:key="item">
<view class="tip-info"> <view class="tip-info">
<view class="tip">{{index}}</view> <view class="tip">{{index}}</view>
@ -79,10 +108,6 @@
</view> </view>
</view> </view>
</view> -->
<view class="tags-box textOver">
<view class="tag textOver" wx:for="{{info.display_tags}}">{{item}}</view>
</view> </view>
</view> </view>
@ -314,4 +339,38 @@
</view> </view>
</view> </view>
<code showModel="{{showQrCode}}" qrcode = "{{wxqrcode}}"> <code showModel="{{showQrCode}}" qrcode = "{{wxqrcode}}">
</code> </code>
<view class="mask" wx:if="{{otherInfoShow>0}}">
<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}}">
<view class="key-title">该商品预计13小时内发货</view>
<view class="key-content">订单支付成功后48小时内发货,若未在48小时内发货消费者 可联系客服咨询催促发货。</view>
</view>
<view wx:if="{{otherInfoShow==3}}">
<view class="prod-param">
<view class="prod-key">名称</view>
<view class="prod-content">鸡头米</view>
</view>
<view class="prod-param">
<view class="prod-key">购买须知</view>
<view class="prod-content">购买须知购买须知购买须知购买须知购买须知购买须知购买须知购买须知购买须知购买须知</view>
</view>
</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>

103
pages/info/postProductInfo/index.wxss

@ -20,22 +20,37 @@ page {
width: fit-content; width: fit-content;
height: 56rpx; height: 56rpx;
line-height: 56rpx; line-height: 56rpx;
background: rgba(1, 0, 0, 0.6); /* background: rgba(1, 0, 0, 0.6);
border-radius: 13rpx 0 0 13rpx; border-radius: 13rpx 0 0 13rpx; */
display: flex; display: flex;
align-items: center;
font-weight: 500; font-weight: 500;
font-size: 24rpx; font-size: 24rpx;
color: rgba(255,255,255,0.5); color: rgba(255,255,255,0.5);
z-index: 10; z-index: 10;
padding: 0 5rpx;
overflow: hidden; overflow: hidden;
} }
.swuper-bottom-bg{
display: flex;
background: rgba(1, 0, 0, 0.6);
border-radius: 13rpx 0 0 0;
padding: 0 5rpx;
}
.swiper-bottom-item{ .swiper-bottom-item{
padding: 0 14rpx; padding: 0 14rpx;
} }
.swiper-bottom-item.active{ .swiper-bottom-item.active{
color: #fff; color: #fff;
} }
.swiper-bottom-item.bottom-number{
background: rgba(1, 0, 0, 0.6);
border-radius: 13rpx;
height: 40rpx;
line-height: 40rpx;
padding: 0 10rpx;
margin-right: 6rpx;
}
.top-info { .top-info {
background: white; background: white;
@ -647,18 +662,15 @@ width: 250rpx;
font-size: 36rpx; font-size: 36rpx;
z-index: 1; z-index: 1;
} */ } */
.icon-fenxiang { .share-icon {
position: absolute; position: absolute;
right: 20rpx; right: 20rpx;
margin-top: 20rpx; margin-top: 20rpx;
width: 60rpx; width: 60rpx;
line-height: 60rpx; height: 60rpx;
background: rgba(0, 0, 0, 0.4);
border-radius: 50%;
text-align: center;
color: #fff;
font-size: 36rpx;
z-index: 1; z-index: 1;
background-image: url("https://static.ticket.sz-trip.com/uploads/20250826/81287df192b80ea03318e06b2b19ebe1.png");
background-size: 100% 100%;
} }
.icon-shoucang { .icon-shoucang {
@ -1176,3 +1188,74 @@ color: #010101;
.other-info-box{
}
.other-info-box .other-info-item{
display: flex;
align-items: center;
font-weight: 500;
font-size: 27rpx;
color: #666666;
margin-top: 30rpx;
}
.other-info-box .other-info-item image{
width: 32rpx;
height: 32rpx;
flex-shrink: 0;
}
.other-info-box .view-arrow{
font-family: fangsong;
color: #999;
width: 25rpx;
flex-shrink: 0;
}
.other-info-box .other-content{
padding: 0 20rpx;
overflow: hidden;
flex: 1;
width: 100rpx;
}
.other-info-content{
min-height: 600rpx;
padding: 32rpx 23rpx;
}
.other-info-content .title{
font-weight: bold;
font-size: 33rpx;
color: #060001;
text-align: center;
margin-bottom: 36rpx;
}
.other-info-content .key-title{
color: #060001;
font-size: 27.67rpx;
line-height: 40rpx;
font-weight: bold;
}
.other-info-content .key-content{
color: #666;
font-size: 27.67rpx;
line-height: 40rpx;
margin-top: 6rpx;
}
.prod-param{
display: flex;
align-items: flex-start;
margin-bottom: 45rpx;
}
.prod-param .prod-key{
flex: 1;
flex-shrink: 0;
font-weight: 500;
font-size: 27rpx;
color: #666666;
}
.prod-param .prod-content{
flex: 1;
flex-shrink: 0;
font-weight: 500;
font-size: 27rpx;
color: #000000;
}

7
project.private.config.json

@ -6,6 +6,13 @@
"condition": { "condition": {
"miniprogram": { "miniprogram": {
"list": [ "list": [
{
"name": "pages/info/postProductInfo/index",
"pathName": "pages/info/postProductInfo/index",
"query": "id=457638",
"launchMode": "default",
"scene": null
},
{ {
"name": "pages/order/pay/index", "name": "pages/order/pay/index",
"pathName": "pages/order/pay/index", "pathName": "pages/order/pay/index",

4
utils/https.js

@ -1,8 +1,8 @@
var app = getApp(); var app = getApp();
import util from "../utils/util" import util from "../utils/util"
// import userApi from "../utils/https/user.js"; // import userApi from "../utils/https/user.js";
// const baseUrl = "https://test.api.cloud.sz-trip.com/api/"; const baseUrl = "https://test.api.cloud.sz-trip.com/api/";
let baseUrl = "https://api.cloud.sz-trip.com/api/"; // let baseUrl = "https://api.cloud.sz-trip.com/api/";
const env = wx.getAccountInfoSync().miniProgram.envVersion const env = wx.getAccountInfoSync().miniProgram.envVersion
if (env == 'develop1') { if (env == 'develop1') {
baseUrl = "https://test.api.cloud.sz-trip.com/api/" baseUrl = "https://test.api.cloud.sz-trip.com/api/"

Loading…
Cancel
Save