Initial Commit
This commit is contained in:
quantulr
441
pages/chuxiao/cartPay/cartPay.js
Normal file
441
pages/chuxiao/cartPay/cartPay.js
Normal file
@ -0,0 +1,441 @@
|
||||
// pages/cartPay/cartPay.js
|
||||
const app = getApp();
|
||||
Page({
|
||||
|
||||
/**
|
||||
* 页面的初始数据
|
||||
*/
|
||||
data: {
|
||||
goods: [],
|
||||
reduceType: false,//优惠方式
|
||||
addressType: false,//收货方式
|
||||
reduceTypeXz: 0,//0不选 1现金券 2折扣券
|
||||
freight: 0,//运费
|
||||
discount: 0,//优惠
|
||||
payActual: 0,//实际支付
|
||||
note: '',
|
||||
addressId: '',//地址ID
|
||||
address: '选择收货方式',//地址
|
||||
province: '',
|
||||
orderPick: 2,//1自提 2物流
|
||||
isCar: 0,//购物车进入
|
||||
|
||||
date: '',
|
||||
time: '',
|
||||
startTime: '',
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面显示
|
||||
*/
|
||||
onShow: function () {
|
||||
if (this.data.orderPick == 2) {
|
||||
//收货地址
|
||||
if (this.data.total && this.data.province != '') {
|
||||
//订单个人信息获取
|
||||
wx.showLoading({
|
||||
title: '加载中',
|
||||
})
|
||||
wx.request({
|
||||
url: app.globalData.ip + '/wisdommining/api/order/getUserInfo',
|
||||
method: 'GET',
|
||||
header: {
|
||||
"content-type": "application/x-www-form-urlencoded",
|
||||
},
|
||||
data: {
|
||||
userId: app.globalData.userId
|
||||
},
|
||||
success: res => {
|
||||
wx.hideLoading();
|
||||
console.log(res)
|
||||
if (res.data.code == 1) {
|
||||
let dataList = res.data.value;
|
||||
this.setData({
|
||||
dataList: dataList,
|
||||
})
|
||||
//运费获取
|
||||
wx.request({
|
||||
url: app.globalData.ip + '/wisdommining/api/order/getFreight',
|
||||
method: 'GET',
|
||||
header: {
|
||||
"content-type": "application/x-www-form-urlencoded",
|
||||
},
|
||||
data: {
|
||||
freightAddress: this.data.province,
|
||||
price: this.data.total,
|
||||
},
|
||||
success: res => {
|
||||
wx.hideLoading();
|
||||
console.log(res)
|
||||
if (res.data.code == 1) {
|
||||
this.setData({
|
||||
freight: res.data.value,
|
||||
payActual: (parseFloat(this.data.total) + parseFloat(res.data.value)).toFixed(2),
|
||||
})
|
||||
} else {
|
||||
wx.showModal({
|
||||
title: '提示!',
|
||||
content: res.data.message,
|
||||
showCancel: false,
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
} else {
|
||||
wx.showModal({
|
||||
title: '提示!',
|
||||
content: res.data.message,
|
||||
showCancel: false,
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
} else {
|
||||
// 自提点
|
||||
this.setData({
|
||||
freight: 0,
|
||||
payActual:parseFloat(this.data.total).toFixed(2),
|
||||
})
|
||||
console.log(this.data.address)
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面加载
|
||||
*/
|
||||
onLoad: function (options) {
|
||||
let myDate = new Date();
|
||||
this.setData({
|
||||
startTime: myDate.getFullYear() + '-' + (parseFloat(myDate.getMonth()) + 1) + '-' + (parseFloat(myDate.getDate()) + 3)
|
||||
})
|
||||
|
||||
//购物车进入
|
||||
if (options.isCar) {
|
||||
console.log(options.isCar)
|
||||
this.setData({
|
||||
isCar: options.isCar
|
||||
})
|
||||
}
|
||||
if (options.goods) {
|
||||
let goods = JSON.parse(options.goods)
|
||||
console.log(goods)
|
||||
let total = 0;
|
||||
let numAll = 0;
|
||||
let specPriceArr = [];
|
||||
for (let i = 0; i < goods.length; i++) {
|
||||
total = total + parseFloat(goods[i].specs.specPromotionPrice) * parseFloat(goods[i].num)
|
||||
numAll = numAll + parseFloat(goods[i].num);
|
||||
specPriceArr.push(parseFloat(goods[i].specs.specPromotionPrice));
|
||||
}
|
||||
this.setData({
|
||||
goods: goods,
|
||||
total: total.toFixed(2),
|
||||
total_int: parseInt(total),
|
||||
specPriceArr: specPriceArr,
|
||||
numAll: numAll,
|
||||
payActual: (parseFloat(total) + parseFloat(this.data.freight)).toFixed(2),
|
||||
})
|
||||
//订单个人信息获取
|
||||
wx.showLoading({
|
||||
title: '加载中',
|
||||
})
|
||||
wx.request({
|
||||
url: app.globalData.ip + '/wisdommining/api/order/getUserInfo',
|
||||
method: 'GET',
|
||||
header: {
|
||||
"content-type": "application/x-www-form-urlencoded",
|
||||
},
|
||||
data: {
|
||||
userId: app.globalData.userId
|
||||
},
|
||||
success: res => {
|
||||
wx.hideLoading();
|
||||
console.log(res)
|
||||
if (res.data.code == 1) {
|
||||
let dataList = res.data.value;
|
||||
this.setData({
|
||||
dataList: dataList,
|
||||
})
|
||||
if (dataList.wisdUserAddress) {
|
||||
//默认地址ID
|
||||
this.setData({
|
||||
province: dataList.wisdUserAddress.addressProvince,
|
||||
addressId: dataList.wisdUserAddress.id,
|
||||
address: dataList.wisdUserAddress.addressProvince + dataList.wisdUserAddress.addressCity + dataList.wisdUserAddress.addressArea + dataList.wisdUserAddress.addressDetailed,
|
||||
})
|
||||
//运费获取
|
||||
wx.request({
|
||||
url: app.globalData.ip + '/wisdommining/api/order/getFreight',
|
||||
method: 'GET',
|
||||
header: {
|
||||
"content-type": "application/x-www-form-urlencoded",
|
||||
},
|
||||
data: {
|
||||
freightAddress: dataList.wisdUserAddress.addressProvince,
|
||||
price: total,
|
||||
},
|
||||
success: res => {
|
||||
wx.hideLoading();
|
||||
console.log(res)
|
||||
if (res.data.code == 1) {
|
||||
this.setData({
|
||||
freight: res.data.value,
|
||||
payActual: (parseFloat(this.data.total) + parseFloat(res.data.value)).toFixed(2),
|
||||
})
|
||||
} else {
|
||||
wx.showModal({
|
||||
title: '提示!',
|
||||
content: res.data.message,
|
||||
showCancel: false,
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
} else {
|
||||
wx.showModal({
|
||||
title: '提示!',
|
||||
content: res.data.message,
|
||||
showCancel: false,
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
//备注
|
||||
note(e) {
|
||||
this.setData({
|
||||
note: e.detail.value
|
||||
})
|
||||
},
|
||||
//选择地址类型
|
||||
addressType() {
|
||||
this.setData({
|
||||
addressType: true,//收货
|
||||
})
|
||||
},
|
||||
|
||||
//选择收货地址
|
||||
address() {
|
||||
wx.navigateTo({
|
||||
url: '/pages/my/my_address/my_address?orderAddress=true&addressId=' + this.data.addressId,
|
||||
})
|
||||
this.setData({
|
||||
addressType: false,//收货
|
||||
})
|
||||
},
|
||||
//选择自提点
|
||||
ztd() {
|
||||
wx.navigateTo({
|
||||
url: '/pages/index/index_address/index_address?pay=true',
|
||||
})
|
||||
this.setData({
|
||||
addressType: false,//收货
|
||||
})
|
||||
},
|
||||
//收获 遮罩层
|
||||
addressZzc() {
|
||||
this.setData({
|
||||
addressType: false,//收货
|
||||
})
|
||||
},
|
||||
|
||||
//选择优惠方式
|
||||
reduceType() {
|
||||
this.setData({
|
||||
reduceType: true,//优惠
|
||||
})
|
||||
},
|
||||
|
||||
//立即支付
|
||||
pay(e) {
|
||||
if (this.data.addressId == '') {
|
||||
wx.showToast({
|
||||
title: '请选择收货方式',
|
||||
icon: 'none'
|
||||
})
|
||||
return
|
||||
}
|
||||
if (this.data.orderPick == 1) {
|
||||
if (this.data.date == '') {
|
||||
wx.showToast({
|
||||
title: '请选择提货日期',
|
||||
icon: 'none'
|
||||
})
|
||||
return
|
||||
}
|
||||
if (this.data.time == '') {
|
||||
wx.showToast({
|
||||
title: '请选择提货时间',
|
||||
icon: 'none'
|
||||
})
|
||||
return
|
||||
}
|
||||
}
|
||||
wx.showModal({
|
||||
title: '提示！',
|
||||
content: '确认要购买吗',
|
||||
success: sss => {
|
||||
if (sss.confirm) {
|
||||
let orderActualPay = '';
|
||||
let orderOtherPay = '';
|
||||
let orderPayWay = '';
|
||||
let orderPick = this.data.orderPick;
|
||||
let wisdOrderDetailList = [];
|
||||
let orderAllPay = +this.data.freight + (+this.data.total) //订单原价
|
||||
let orderVolumePay = this.data.discount //优惠金额
|
||||
console.log(this.data.goods)
|
||||
//商品信息
|
||||
for (let i = 0; i < this.data.goods.length; i++) {
|
||||
wisdOrderDetailList.push({
|
||||
goodsId: this.data.goods[i].goodsId,
|
||||
goodsNum: this.data.goods[i].num,
|
||||
specId: this.data.goods[i].specs.id,
|
||||
specPrice: this.data.specPriceArr[i], //规格价格集合
|
||||
})
|
||||
}
|
||||
console.log(wisdOrderDetailList)
|
||||
//支付方式
|
||||
orderActualPay = parseFloat(this.data.payActual)
|
||||
if (this.data.reduceTypeXz == 0) {
|
||||
//1纯微信支付
|
||||
orderPayWay = 1;
|
||||
orderOtherPay = 0;
|
||||
}
|
||||
wx.showLoading({
|
||||
title: '加载中',
|
||||
mask: true
|
||||
})
|
||||
wx.request({
|
||||
url: app.globalData.ip + '/wisdommining/api/order/addOrder',
|
||||
method: 'POST',
|
||||
data: {
|
||||
userId: app.globalData.userId,
|
||||
addressId: this.data.addressId,
|
||||
orderActualPay: orderActualPay, //微信支付的钱 其余传0
|
||||
orderOtherPay: orderOtherPay, //积分 现金券 折扣券 套餐0
|
||||
orderPayWay: orderPayWay, //1纯微信支付 2积分支付 3套餐券 4现金券（+微信支付） 5折扣券（+微信支付）
|
||||
orderPick: orderPick, //1自提 2物流
|
||||
orderPickTime:orderPick==1?this.data.date+' '+this.data.time:'',
|
||||
orderRemark: this.data.note,
|
||||
orderFreight: this.data.freight,
|
||||
wisdOrderDetailList: wisdOrderDetailList,
|
||||
isCar: parseInt(this.data.isCar), //购物车1 别的0
|
||||
orderAllPay: orderAllPay,
|
||||
orderVolumePay: orderVolumePay,
|
||||
},
|
||||
success: res => {
|
||||
wx.hideLoading();
|
||||
console.log(res)
|
||||
if (res.data.code == 1) {
|
||||
//支付
|
||||
this.payM({
|
||||
orderNumber: res.data.value
|
||||
})
|
||||
} else {
|
||||
wx.showModal({
|
||||
title: '提示!',
|
||||
content: res.data.message,
|
||||
showCancel: false,
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
//支付
|
||||
payM(options) {
|
||||
wx.showLoading({
|
||||
title: '支付中',
|
||||
mask: true
|
||||
})
|
||||
wx.request({
|
||||
url: app.globalData.ip + '/wisdommining/api/pay/payOrder',
|
||||
method: 'PUT',
|
||||
header: {
|
||||
"content-type": "application/x-www-form-urlencoded",
|
||||
},
|
||||
data: {
|
||||
userId: app.globalData.userId,
|
||||
orderNumber: options.orderNumber
|
||||
},
|
||||
success: res => {
|
||||
wx.hideLoading();
|
||||
console.log(res)
|
||||
if (res.data.code == 1) {
|
||||
//调用微信支付API
|
||||
wx.requestPayment({
|
||||
timeStamp: res.data.value.timeStamp,
|
||||
nonceStr: res.data.value.nonceStr,
|
||||
package: res.data.value.package,
|
||||
signType: 'MD5',
|
||||
paySign: res.data.value.paySign,
|
||||
success(res) {
|
||||
console.log(res)
|
||||
//支付成功
|
||||
wx.showToast({
|
||||
title: '支付成功',
|
||||
icon: 'success',
|
||||
duration: 1000,
|
||||
success() {
|
||||
setTimeout(() => {
|
||||
wx.redirectTo({
|
||||
url: '/pages/order_details/order_details?orderNumber=' + options.orderNumber,
|
||||
})
|
||||
}, 1000);
|
||||
}
|
||||
})
|
||||
},
|
||||
fail(res) {
|
||||
console.log(res)
|
||||
wx.showToast({
|
||||
title: '支付失败',
|
||||
icon: 'none',
|
||||
duration: 1000,
|
||||
success() {
|
||||
setTimeout(() => {
|
||||
wx.redirectTo({
|
||||
url: '/pages/order_details/order_details?orderNumber=' + options.orderNumber,
|
||||
})
|
||||
}, 1000);
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
}else {
|
||||
wx.showModal({
|
||||
title: '提示!',
|
||||
content: res.data.message,
|
||||
showCancel: false,
|
||||
success: sss => {
|
||||
if (sss.confirm) {
|
||||
wx.navigateBack()
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
|
||||
bindDateChange: function (e) {
|
||||
console.log('picker发送选择改变，携带值为', e.detail.value)
|
||||
this.setData({
|
||||
date: e.detail.value
|
||||
})
|
||||
},
|
||||
bindTimeChange: function (e) {
|
||||
console.log('picker发送选择改变，携带值为', e.detail.value)
|
||||
this.setData({
|
||||
time: e.detail.value
|
||||
})
|
||||
},
|
||||
|
||||
|
||||
})
|
||||
4
pages/chuxiao/cartPay/cartPay.json
Normal file
4
pages/chuxiao/cartPay/cartPay.json
Normal file
@ -0,0 +1,4 @@
|
||||
{
|
||||
"usingComponents": {},
|
||||
"navigationBarTitleText": "订单支付"
|
||||
}
|
||||
110
pages/chuxiao/cartPay/cartPay.wxml
Normal file
110
pages/chuxiao/cartPay/cartPay.wxml
Normal file
@ -0,0 +1,110 @@
|
||||
<!--pages/cartPay/cartPay.wxml-->
|
||||
|
||||
<!-- 选择收货类型 -->
|
||||
<view class="address display_J_B" catchtap="addressType">
|
||||
<view class="address-l display_J_S display_A_C">
|
||||
<image src="/icon/order-addrass.png"></image>
|
||||
<view class="address-cont GStitleOne">{{address}}</view>
|
||||
</view>
|
||||
<view class="address-r display_A_C">
|
||||
<image src="/icon/right.png"></image>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="goods">
|
||||
<view class="cont display_J_B" wx:for='{{goods}}' wx:key='index'>
|
||||
<view class="cont-l">
|
||||
<image src="{{item.goodsPhoto}}"></image>
|
||||
</view>
|
||||
<view class="cont-m">
|
||||
<view class="name GStitleOne">{{item.goodsName}}</view>
|
||||
<view class="spec">规格：{{item.specs.specName}}</view>
|
||||
<!-- 普通 -->
|
||||
<view class="price">￥{{item.specs.specPromotionPrice}}
|
||||
<text>￥{{item.specs.originalPrice}}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="cont-r">x{{item.num}}</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="data">
|
||||
<view class="data-t display_J_B display_A_C">
|
||||
<view class="t-l">商品合计<text>(预计获得{{total_int}}积分)</text></view>
|
||||
</view>
|
||||
<view class="data-t display_J_B display_A_C">
|
||||
<view class="t-l">运费</view>
|
||||
<view class="t-r t-r__2">{{orderPick==1?'自提':freight==0?'包邮':('￥'+freight)}}</view>
|
||||
</view>
|
||||
|
||||
<view class="data-t display_J_B display_A_C">
|
||||
<view class="t-l">备注</view>
|
||||
<view class="t-r t-r__2">
|
||||
<input type="text" value="{{note}}" bindinput="note" placeholder="请填写备注"></input>
|
||||
</view>
|
||||
</view>
|
||||
<view class="data-t data-t_last display_J_B display_A_C">
|
||||
<view class="t-l">实际支付</view>
|
||||
<view class="t-r t-r__4">{{'￥'+payActual}}</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="pay-type display_J_B">
|
||||
<view class="pay-type__l display_A_C">
|
||||
<image src="/icon/wx.png"></image>微信支付
|
||||
</view>
|
||||
<view class="pay-type__r display_A_C">
|
||||
<image src="/icon/wx-checked.png"></image>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 自提时间 -->
|
||||
<view class="ztTime display_J_B" wx:if="{{orderPick==1}}">
|
||||
<view class="ztt_l">自提时间<text>*</text></view>
|
||||
<view class="ztt_r display_J_E display_A_C">
|
||||
<picker mode="date" value="{{date}}" start="{{startTime}}" bindchange="bindDateChange">
|
||||
<view class="display_A_C display_J_E" style="width:250rpx;">
|
||||
<text class="{{date!=''?'ztt_r_time':''}}">{{date==''?'选择提货日期':date}}</text>
|
||||
<image src="/icon/c-down.png"></image>
|
||||
</view>
|
||||
</picker>
|
||||
<picker mode="time" value="{{time}}" bindchange="bindTimeChange">
|
||||
<view class="display_A_C display_J_E" style="width:250rpx;">
|
||||
<text style="margin-left: 30rpx;" class="{{time!=''?'ztt_r_time':''}}">{{time==''?'选择提货时间':time}}</text>
|
||||
<image src="/icon/c-down.png"></image>
|
||||
</view>
|
||||
</picker>
|
||||
</view>
|
||||
</view>
|
||||
<view class="ztTimeTs" wx:if="{{orderPick==1}}">由于进货和配货需要时间，您的提货时间要3天后开始选择</view>
|
||||
|
||||
<view class="height100"></view>
|
||||
<view class="height100"></view>
|
||||
<view class="pay display_J_B display_A_C">
|
||||
<view class="pay-l"><i>共计{{numAll}}件</i>合计：￥<text>{{payActual}}</text></view>
|
||||
<view class="pay-r" catchtap="pay">立即支付</view>
|
||||
</view>
|
||||
|
||||
<!-- 收货方式 -->
|
||||
<view wx:if='{{addressType}}'>
|
||||
<view class="reduce-zzc" catchtap="addressZzc"></view>
|
||||
<view class="reduce-cont">
|
||||
<view class="reduce-title">选择收货方式</view>
|
||||
<view class="reduce-c display_J_B" catchtap="address">
|
||||
<view class="reduce-c__l display_A_C">
|
||||
<image src="/icon/order-addrass.png"></image>我的收货地址
|
||||
</view>
|
||||
<view class="reduce-c__r display_A_C">
|
||||
<image src="/icon/right.png"></image>
|
||||
</view>
|
||||
</view>
|
||||
<view class="reduce-c display_J_B" catchtap="ztd">
|
||||
<view class="reduce-c__l display_A_C">
|
||||
<image src="/icon/address.png" style="width:30rpx;margin:0 66rpx 0 7rpx;"></image>自提点
|
||||
</view>
|
||||
<view class="reduce-c__r display_A_C">
|
||||
<image src="/icon/right.png"></image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
355
pages/chuxiao/cartPay/cartPay.wxss
Normal file
355
pages/chuxiao/cartPay/cartPay.wxss
Normal file
@ -0,0 +1,355 @@
|
||||
/* pages/cartPay/cartPay.wxss */
|
||||
page{
|
||||
background-color: #f5f5f5;
|
||||
}
|
||||
.djs{
|
||||
font-size: 28rpx;
|
||||
color: #333333;
|
||||
width: 750rpx;
|
||||
height: 80rpx;
|
||||
background-color: #f7e0cd;
|
||||
text-align: center;
|
||||
line-height: 80rpx;
|
||||
}
|
||||
.djs text{
|
||||
color: #ff372d;
|
||||
margin-left: 10rpx;
|
||||
}
|
||||
.address{
|
||||
margin-top: 34rpx;
|
||||
width: 690rpx;
|
||||
padding: 0 30rpx;
|
||||
height: 156rpx;
|
||||
background-color: #ffffff;
|
||||
border-radius: 20rpx;
|
||||
}
|
||||
.address-l{
|
||||
height: 100%;
|
||||
}
|
||||
.address-l image{
|
||||
width: 46rpx;
|
||||
height: 46rpx;
|
||||
margin:0 55rpx 0 15rpx;
|
||||
}
|
||||
.address-cont{
|
||||
font-size: 32rpx;
|
||||
color: #ee7b1e;
|
||||
width: 500rpx;
|
||||
}
|
||||
.address-r{
|
||||
height: 100%;
|
||||
}
|
||||
.address-r image{
|
||||
width:30rpx;
|
||||
height:30rpx;
|
||||
}
|
||||
.goods{
|
||||
width: 690rpx;
|
||||
padding: 0 30rpx;
|
||||
background-color: #ffffff;
|
||||
border-radius: 20rpx;
|
||||
margin: 30rpx 0;
|
||||
}
|
||||
.cont{
|
||||
padding: 30rpx 0;
|
||||
border-bottom: 1rpx #dcdcdc solid;
|
||||
}
|
||||
.cont:last-child{
|
||||
border-bottom: none;
|
||||
}
|
||||
.cont-l image{
|
||||
width: 160rpx;
|
||||
height: 160rpx;
|
||||
}
|
||||
.cont-m{
|
||||
width: 400rpx;
|
||||
padding: 10rpx 0;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
align-content: space-between;
|
||||
}
|
||||
.name{
|
||||
font-size: 28rpx;
|
||||
color: #333333;
|
||||
}
|
||||
.spec{
|
||||
width:100%;
|
||||
font-size: 24rpx;
|
||||
color: #999999;
|
||||
}
|
||||
.price{
|
||||
width:100%;
|
||||
font-size: 36rpx;
|
||||
color: #ee7b1e;
|
||||
}
|
||||
.price text{
|
||||
font-size: 24rpx;
|
||||
color: #999999;
|
||||
text-decoration: line-through;
|
||||
margin-left: 11rpx;
|
||||
}
|
||||
.cont-r{
|
||||
display: flex;
|
||||
align-items : flex-end;
|
||||
font-size: 32rpx;
|
||||
color: #0b0b0b;
|
||||
height: 130rpx;
|
||||
}
|
||||
|
||||
.data{
|
||||
width: 690rpx;
|
||||
padding:10rpx 30rpx 0;
|
||||
background-color: #ffffff;
|
||||
border-radius: 20rpx;
|
||||
}
|
||||
.data-t{
|
||||
height: 70rpx;
|
||||
}
|
||||
.data-t_last{
|
||||
padding-top:20rpx;
|
||||
border-top: 1rpx #d9d9d9 solid;
|
||||
margin-top: 30rpx;
|
||||
}
|
||||
.t-l{
|
||||
font-size: 28rpx;
|
||||
letter-spacing: 1rpx;
|
||||
color: #444444;
|
||||
}
|
||||
.t-l text{
|
||||
color: #ff291e;
|
||||
font-size: 24rpx;
|
||||
}
|
||||
.t-r{
|
||||
font-size: 28rpx;
|
||||
letter-spacing: 1rpx;
|
||||
height: 70rpx;
|
||||
line-height: 70rpx;
|
||||
}
|
||||
.t-r__1{
|
||||
color: #333333;
|
||||
font-weight: bold;
|
||||
}
|
||||
.t-r__2{
|
||||
color: #999999;
|
||||
}
|
||||
.t-r__3{
|
||||
color: #ee7b1e;
|
||||
}
|
||||
.t-r__4{
|
||||
color: #333333;
|
||||
font-weight: bold;
|
||||
font-size: 34rpx;
|
||||
}
|
||||
t-r__5{
|
||||
color: #ee7b1e;
|
||||
font-weight: bold;
|
||||
font-size: 34rpx;
|
||||
}
|
||||
.t-r input{
|
||||
font-size: 28rpx;
|
||||
letter-spacing: 1rpx;
|
||||
color: #999999;
|
||||
width: 500rpx;
|
||||
text-align: right;
|
||||
line-height: 70rpx;
|
||||
height: 70rpx;
|
||||
border: none;
|
||||
}
|
||||
.t-r image{
|
||||
width: 30rpx;
|
||||
height: 30rpx;
|
||||
}
|
||||
|
||||
.pay-type{
|
||||
width: 690rpx;
|
||||
padding: 0 30rpx;
|
||||
height: 100rpx;
|
||||
background-color: #ffffff;
|
||||
border-radius: 20rpx;
|
||||
margin-top:20rpx;
|
||||
}
|
||||
.pay-type__l{
|
||||
height: 100%;
|
||||
font-size: 28rpx;
|
||||
color: #333333;
|
||||
}
|
||||
.pay-type__l image{
|
||||
width: 50rpx;
|
||||
height: 50rpx;
|
||||
margin-right: 20rpx;
|
||||
}
|
||||
.pay-type__r{
|
||||
height: 100%;
|
||||
font-size: 24rpx;
|
||||
letter-spacing: 1rpx;
|
||||
color: #ee7b1e;
|
||||
}
|
||||
.pay-type__r image{
|
||||
width: 30rpx;
|
||||
height: 30rpx;
|
||||
margin-left: 20rpx;
|
||||
}
|
||||
.pay{
|
||||
width: 690rpx;
|
||||
padding: 0 30rpx;
|
||||
height: 100rpx;
|
||||
background-color: #ffffff;
|
||||
line-height: 56rpx;
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
}
|
||||
.pay-l i{
|
||||
padding-right: 32rpx;
|
||||
font-size: 28rpx;
|
||||
color: #333333;
|
||||
}
|
||||
.pay-l{
|
||||
padding-left: 90rpx;
|
||||
font-size: 28rpx;
|
||||
color: #ee7b1e;
|
||||
}
|
||||
.pay-l text{
|
||||
font-size: 40rpx;
|
||||
color: #ee7b1e;
|
||||
}
|
||||
.pay-r{
|
||||
width: 180rpx;
|
||||
height: 56rpx;
|
||||
background-image: linear-gradient(-90deg,
|
||||
#ee7b1e 0%,
|
||||
#fdae03 100%);
|
||||
border-radius: 28rpx;
|
||||
font-size: 28rpx;
|
||||
color: #ffffff;
|
||||
text-align: center;
|
||||
}
|
||||
.pay-r_bz{
|
||||
width: 180rpx;
|
||||
height: 56rpx;
|
||||
background-color: #999999;
|
||||
border-radius: 28rpx;
|
||||
font-size: 28rpx;
|
||||
color: #ffffff;
|
||||
text-align: center;
|
||||
}
|
||||
.reduce-zzc{
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
position: fixed;
|
||||
left: 0;
|
||||
top: 0;
|
||||
z-index: 9;
|
||||
background-color: rgba(0, 0, 0, 0.6);
|
||||
}
|
||||
.reduce-cont{
|
||||
position: fixed;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
z-index: 9;
|
||||
width: 690rpx;
|
||||
padding: 0 30rpx 50rpx;
|
||||
background-color: #ffffff;
|
||||
border-radius: 20rpx 20rpx 0px 0px;
|
||||
}
|
||||
.reduce-title{
|
||||
font-size: 36rpx;
|
||||
color: #333333;
|
||||
border-bottom: 1rpx solid #d2d2d2;
|
||||
height: 106rpx;
|
||||
line-height: 106rpx;
|
||||
text-align: center;
|
||||
margin-bottom: 40rpx;
|
||||
padding-left: 70rpx;
|
||||
}
|
||||
.titlezk{
|
||||
font-size: 28rpx;
|
||||
color: #ff0000;
|
||||
margin-left: 15rpx;
|
||||
}
|
||||
.reduce-c{
|
||||
width: 690rpx;
|
||||
height: 100rpx;
|
||||
background-color: #ffffff;
|
||||
border-radius: 20rpx;
|
||||
margin-bottom: 30rpx;
|
||||
}
|
||||
.reduce-c__l{
|
||||
font-size: 36rpx;
|
||||
color: #333333;
|
||||
}
|
||||
.reduce-c__l text{
|
||||
color: #ee7b1e;
|
||||
}
|
||||
.reduce-c__l text text{
|
||||
font-size: 24rpx;
|
||||
}
|
||||
.reduce-c__l .zk{
|
||||
font-size: 36rpx;
|
||||
color: #ff0000;
|
||||
margin-left: 15rpx;
|
||||
}
|
||||
.reduce-c__l{
|
||||
height: 100%;
|
||||
}
|
||||
.reduce-c__l image{
|
||||
width: 46rpx;
|
||||
height: 46rpx;
|
||||
margin-right: 58rpx;
|
||||
}
|
||||
|
||||
.reduce-c__r{
|
||||
height: 100%;
|
||||
}
|
||||
.reduce-c__r image{
|
||||
width: 42rpx;
|
||||
height: 42rpx;
|
||||
}
|
||||
|
||||
.ztTime{
|
||||
box-sizing: border-box;
|
||||
padding: 0 30rpx;
|
||||
margin-top: 30rpx;
|
||||
width: 750rpx;
|
||||
height: 100rpx;
|
||||
background-color: #ffffff;
|
||||
border-radius: 20rpx;
|
||||
}
|
||||
.ztt_l{
|
||||
font-size: 28rpx;
|
||||
line-height: 100rpx;
|
||||
letter-spacing: 1rpx;
|
||||
color: #333333;
|
||||
}
|
||||
.ztt_l text{
|
||||
color: #ff0000;
|
||||
margin-left: 20rpx;
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
top: 6rpx;
|
||||
}
|
||||
|
||||
.ztt_r{
|
||||
font-size: 28rpx;
|
||||
line-height: 100rpx;
|
||||
letter-spacing: 1rpx;
|
||||
color: #999999;
|
||||
width:500rpx;
|
||||
}
|
||||
.ztt_r_time{
|
||||
color: #333333;
|
||||
}
|
||||
.ztt_r image{
|
||||
width: 14rpx;
|
||||
height: 8rpx;
|
||||
margin-left: 20rpx;
|
||||
}
|
||||
|
||||
.ztTimeTs{
|
||||
font-size: 24rpx;
|
||||
line-height: 35rpx;
|
||||
letter-spacing: 1rpx;
|
||||
color: #ff0000;
|
||||
text-align: center;
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
296
pages/chuxiao/cx_details/goodsDetails.js
Normal file
296
pages/chuxiao/cx_details/goodsDetails.js
Normal file
@ -0,0 +1,296 @@
|
||||
// pages/goodsDetails/goodsDetails.js
|
||||
const app = getApp()
|
||||
const WxParse = require('../../../wxParse/wxParse.js');
|
||||
Page({
|
||||
|
||||
data: {
|
||||
ip: app.globalData.ipUrl,
|
||||
contents: '',//富文本
|
||||
standardNum: 1,//商品数量
|
||||
minusStatus: 'disabled',
|
||||
goodsList: [],
|
||||
bnrUrl: [],//轮播图
|
||||
specsIndex: 0,//选择规格
|
||||
specs: '',//规格
|
||||
integral: 0,//积分商城进入
|
||||
login: true
|
||||
},
|
||||
// 页面加载时
|
||||
onLoad: function (options) {
|
||||
console.log(options.goodsId)
|
||||
//商品ID进入
|
||||
if (options.goodsId) {
|
||||
this.setData({
|
||||
goodsId: options.goodsId
|
||||
})
|
||||
this.goodDtail()
|
||||
}
|
||||
//上级id
|
||||
if (options.pId) {
|
||||
wx.setStorage({
|
||||
data: options.pId,
|
||||
key: 'pId',
|
||||
})
|
||||
}
|
||||
//判断登录
|
||||
wx.getStorage({
|
||||
key: 'user',
|
||||
success: s => {
|
||||
this.setData({
|
||||
login: true
|
||||
})
|
||||
}, fail: f => {
|
||||
this.setData({
|
||||
login: false
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
// 商品详情
|
||||
goodDtail() {
|
||||
wx.showLoading({
|
||||
title: '加载中',
|
||||
mask: true,
|
||||
})
|
||||
wx.request({
|
||||
url: app.globalData.ip + '/wisdommining/api/goods/getGoodsDetail',
|
||||
method: 'GET',
|
||||
header: {
|
||||
"content-type": "application/x-www-form-urlencoded",
|
||||
},
|
||||
data: {
|
||||
goodsId: this.data.goodsId,
|
||||
userId: app.globalData.userId
|
||||
},
|
||||
success: res => {
|
||||
wx.hideLoading();
|
||||
console.log(res)
|
||||
if (res.data.code == 1) {
|
||||
let goods = res.data.value;
|
||||
WxParse.wxParse('contents', 'html', goods.goodsInfo, this, 20);
|
||||
this.setData({
|
||||
goodsList: goods,
|
||||
bnrUrl: goods.goodsBanner.split(',')
|
||||
})
|
||||
} else {
|
||||
wx.showModal({
|
||||
title: '提示!',
|
||||
content: res.data.message,
|
||||
showCancel: false,
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
// 轮播
|
||||
onSlideChange(e) {
|
||||
this.setData({
|
||||
lunboindex: e.detail.current + 1
|
||||
})
|
||||
},
|
||||
//点击显示底部弹窗
|
||||
choose: function (e) {
|
||||
var choose = e.currentTarget.dataset.choose
|
||||
if(choose==1){
|
||||
wx.showToast({
|
||||
title: '促销商品无法加入购物车',
|
||||
icon:'none'
|
||||
})
|
||||
return
|
||||
}
|
||||
this.setData({
|
||||
choose: choose,
|
||||
})
|
||||
this.showModal();
|
||||
},
|
||||
|
||||
//选择规格
|
||||
showModal: function () {
|
||||
// 显示遮罩层
|
||||
var animation = wx.createAnimation({
|
||||
duration: 200,
|
||||
timingFunction: "linear",
|
||||
delay: 0
|
||||
})
|
||||
this.animation = animation
|
||||
animation.translateY(300).step()
|
||||
this.setData({
|
||||
animationData: animation.export(),
|
||||
showModalStatus: true
|
||||
})
|
||||
setTimeout(function () {
|
||||
animation.translateY(0).step()
|
||||
this.setData({
|
||||
animationData: animation.export()
|
||||
})
|
||||
}.bind(this), 200)
|
||||
},
|
||||
//隐藏对话框
|
||||
hideModal(e) {
|
||||
console.log(this.data.goodsList.wisdGoodsSpecList[this.data.specsIndex].specStock)
|
||||
if(this.data.goodsList.wisdGoodsSpecList[this.data.specsIndex].specStock==0){
|
||||
wx.showToast({
|
||||
title: '库存不足!',
|
||||
icon:'none'
|
||||
})
|
||||
return
|
||||
}
|
||||
let hide = e.currentTarget.dataset.hide;
|
||||
let goodsList = this.data.goodsList
|
||||
let goods = [{
|
||||
isDiscount:goodsList.isDiscount,//判断是否为会员折扣
|
||||
goodsPhoto: goodsList.goodsPhoto,
|
||||
goodsName: goodsList.goodsName,
|
||||
goodsId: goodsList.id,
|
||||
num: this.data.standardNum,
|
||||
specs: goodsList.wisdGoodsSpecList[this.data.specsIndex]
|
||||
}]
|
||||
|
||||
if (hide == 1) {
|
||||
// 加入购物车
|
||||
wx.showToast({
|
||||
title: '促销商品无法加入购物车~',
|
||||
icon:'none'
|
||||
})
|
||||
} else if (hide == 2) {
|
||||
//普通商品
|
||||
wx.navigateTo({
|
||||
url: '/pages/chuxiao/cartPay/cartPay?goods=' + JSON.stringify(goods),
|
||||
})
|
||||
}
|
||||
|
||||
// 隐藏遮罩层
|
||||
var animation = wx.createAnimation({
|
||||
duration: 200,
|
||||
timingFunction: "linear",
|
||||
delay: 0
|
||||
})
|
||||
this.animation = animation
|
||||
animation.translateY(300).step()
|
||||
this.setData({
|
||||
animationData: animation.export(),
|
||||
})
|
||||
setTimeout(function () {
|
||||
animation.translateY(0).step()
|
||||
this.setData({
|
||||
animationData: animation.export(),
|
||||
showModalStatus: false
|
||||
})
|
||||
}.bind(this), 200)
|
||||
},
|
||||
|
||||
// 加入购物车
|
||||
carAdd(e) {
|
||||
wx.request({
|
||||
url: app.globalData.ip + '/wisdommining/api/goods/addCart',
|
||||
method: 'POST',
|
||||
header: {
|
||||
"content-type": "application/x-www-form-urlencoded",
|
||||
"token": app.globalData.token
|
||||
},
|
||||
data: {
|
||||
userId: app.globalData.userId,
|
||||
goodsId: this.data.goodsId,
|
||||
goodsNum: this.data.standardNum,
|
||||
specId: this.data.goodsList.wisdGoodsSpecList[this.data.specsIndex].id,
|
||||
},
|
||||
success: res => {
|
||||
wx.hideLoading();
|
||||
console.log(res)
|
||||
if (res.data.code == 1) {
|
||||
wx.showToast({
|
||||
title: '添加成功,快去购物车中查看~',
|
||||
icon: 'none',
|
||||
success: s => {
|
||||
setTimeout(() => {
|
||||
this.goodDtail()
|
||||
}, 1000);
|
||||
}
|
||||
})
|
||||
} else {
|
||||
wx.showModal({
|
||||
title: '提示!',
|
||||
content: res.data.message,
|
||||
showCancel: false,
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
// 输入数量
|
||||
standardNum(e) {
|
||||
console.log('form发生了submit事件，携带数据为：', e.detail.value)
|
||||
var standardNum = e.detail.value;
|
||||
this.setData({
|
||||
standardNum: standardNum,
|
||||
});
|
||||
},
|
||||
//点击数量减少
|
||||
clickReduce: function () {
|
||||
var num = this.data.standardNum;
|
||||
if (num > 1) {
|
||||
num--;
|
||||
}
|
||||
var minusStatus = num <= 1 ? 'disabled' : 'normal';
|
||||
this.setData({
|
||||
standardNum: num,
|
||||
minusStatus: minusStatus
|
||||
});
|
||||
},
|
||||
clickAdd: function () {
|
||||
var num = this.data.standardNum;
|
||||
num++;
|
||||
var minusStatus = num < 1 ? 'disabled' : 'normal';
|
||||
this.setData({
|
||||
standardNum: num,
|
||||
minusStatus: minusStatus
|
||||
})
|
||||
},
|
||||
|
||||
//选择规格
|
||||
specsClick: function (e) {
|
||||
let index = e.target.dataset.index;
|
||||
this.setData({
|
||||
specsIndex: index
|
||||
})
|
||||
},
|
||||
|
||||
// 跳转首页
|
||||
toIndex() {
|
||||
wx.reLaunch({
|
||||
url: '/pages/index/index',
|
||||
})
|
||||
},
|
||||
// 跳转购物车
|
||||
toCar() {
|
||||
wx.reLaunch({
|
||||
url: '/pages/cart/cart',
|
||||
})
|
||||
},
|
||||
//去登录
|
||||
login() {
|
||||
wx.navigateTo({
|
||||
url: '/pages/login/login?goodsId=' + this.data.goodsId,
|
||||
})
|
||||
},
|
||||
/**
|
||||
* 生命周期函数--监听页面卸载
|
||||
*/
|
||||
onUnload: function () {
|
||||
|
||||
},
|
||||
/**
|
||||
* 用户点击右上角分享
|
||||
*/
|
||||
onShareAppMessage: function () {
|
||||
app.share();
|
||||
return {
|
||||
path: '/pages/goodsDetails/goodsDetails?goodsId=' + this.data.goodsId + '&pId=' + app.globalData.userId,
|
||||
title: '三品慧采小程序等你来~'
|
||||
}
|
||||
}
|
||||
|
||||
})
|
||||
|
||||
4
pages/chuxiao/cx_details/goodsDetails.json
Normal file
4
pages/chuxiao/cx_details/goodsDetails.json
Normal file
@ -0,0 +1,4 @@
|
||||
{
|
||||
"usingComponents": {},
|
||||
"navigationBarTitleText": "商品详情"
|
||||
}
|
||||
122
pages/chuxiao/cx_details/goodsDetails.wxml
Normal file
122
pages/chuxiao/cx_details/goodsDetails.wxml
Normal file
@ -0,0 +1,122 @@
|
||||
<import src="../../../wxParse/wxParse.wxml" />
|
||||
<!--轮播图-->
|
||||
<view class="content">
|
||||
<swiper class='u-wrp-bnr' autoplay='true' interval='3000' duration='1000' circular='true' bindchange="onSlideChange">
|
||||
<block wx:for="{{bnrUrl}}" wx:key="index">
|
||||
<swiper-item>
|
||||
<image src='{{item}}' class='u-img-slide'></image>
|
||||
</swiper-item>
|
||||
</block>
|
||||
</swiper>
|
||||
</view>
|
||||
<view class="num display_J_C display_A_C" style="{{flash==1?'top:426rpx':''}}" wx:if="{{lunboindex>1}}">
|
||||
<image src="/icon/goods-xj.png"></image>{{lunboindex}} / {{bnrUrl.length}}张
|
||||
</view>
|
||||
<view class="num display_J_C display_A_C" style="{{flash==1?'top:426rpx':''}}" wx:else>
|
||||
<image src="/icon/goods-xj.png"></image>1 / {{bnrUrl.length}}张
|
||||
</view>
|
||||
|
||||
<view class="detail-block">
|
||||
<!-- 普通 -->
|
||||
<view class="detail-title display_A_C">
|
||||
<view class="detail-text">
|
||||
<text>￥</text>{{goodsList.wisdGoodsSpecList[0].specPromotionPrice}}
|
||||
</view>
|
||||
<view class="exchange-num-two">
|
||||
<text>￥</text>{{goodsList.wisdGoodsSpecList[0].originalPrice}}
|
||||
</view>
|
||||
</view>
|
||||
<view class="detail-price">{{goodsList.goodsName}}</view>
|
||||
<view class="detail-bottom display_J_B">
|
||||
<view class="detail-bottom-l display_J_S">
|
||||
<view class="detail-bottom-l__1">满￥{{goodsList.freightPrice}}包邮</view>
|
||||
<view class="detail-bottom-l__2">分享得积分
|
||||
<button open-type="share"></button>
|
||||
</view>
|
||||
</view>
|
||||
<view class="detail-bottom-r">销量 {{goodsList.goodsSales}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 加入购物车弹窗 -->
|
||||
<view class="commodity_screen" bindtap="hideModal" wx:if="{{showModalStatus}}"></view>
|
||||
<view animation="{{animationData}}" class="commodity_attr_box" wx:if="{{showModalStatus}}">
|
||||
<text class="iconfont icon-icon- hideModal" bindtap="hideModal"></text>
|
||||
<view class="choose-img display_A_C">
|
||||
<image src="{{goodsList.goodsPhoto}}" />
|
||||
<view class="choose-right">
|
||||
<view class="detail-title display_A_C">
|
||||
<!-- 普通商城 -->
|
||||
<view class="exchange-num-one">
|
||||
￥{{goodsList.wisdGoodsSpecList[specsIndex].specPromotionPrice}}
|
||||
</view>
|
||||
</view>
|
||||
<view>库存{{goodsList.wisdGoodsSpecList[specsIndex].specStock}}</view>
|
||||
<view>{{goodsList.goodsName}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<scroll-view scroll-y="true" style="height: 400rpx;">
|
||||
<view class="standard-title ">规格</view>
|
||||
<view class="standard-box display_J_S">
|
||||
<view class="standard-text {{specsIndex==index?'active':''}}" wx:for="{{goodsList.wisdGoodsSpecList}}"
|
||||
wx:key="index" data-index="{{index}}" bindtap='specsClick'>{{item.specName}}</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
<view class="standard-num-box">
|
||||
<view>
|
||||
<text class="num-title">数量</text>
|
||||
</view>
|
||||
<view class="standard-num display_J_A display_A_C">
|
||||
<text class="reduce {{minusStatus}}" bindtap="clickReduce">-</text>
|
||||
<input bindinput="standardNum" type="number" value="{{standardNum}}" disabled></input>
|
||||
<text class="add" bindtap="clickAdd">+</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="cart">
|
||||
<text wx:if="{{choose==1}}" bindtap="hideModal" data-hide="1">加入购物车</text>
|
||||
<text wx:if="{{choose==2}}" bindtap="hideModal" data-hide="2">立即购买</text>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 商品详情 -->
|
||||
<view class="detImg-header">
|
||||
<image src="/icon/goods_1.png" />
|
||||
</view>
|
||||
<view class="detImg-header" style="margin-top:30rpx;">
|
||||
<image src="/icon/goods_2.png" />
|
||||
</view>
|
||||
<view class="detail-img">
|
||||
<template is="wxParse" data="{{wxParseData:contents.nodes}}" />
|
||||
</view>
|
||||
<!-- 立即购买 -->
|
||||
<view wx:if="{{login}}">
|
||||
<view>
|
||||
<view class="cartshop-block display_J_B">
|
||||
<view class="cartshop-img-box" catchtap="toIndex">
|
||||
<view class="display_J_C">
|
||||
<image class="cartshop-img" src="/icon/goods-index.png" />
|
||||
</view>
|
||||
<view class="cartshop-img-name">首页</view>
|
||||
</view>
|
||||
<view class="cartshop-img-box" catchtap="toCar">
|
||||
<view class="display_J_C">
|
||||
<image class="cartshop-img" src="/icon/goods-cart.png" />
|
||||
</view>
|
||||
<view class="cartshop-img-name">购物车</view>
|
||||
<text class="cartshop-img-num">{{goodsList.cartNum}}</text>
|
||||
</view>
|
||||
<view class="cartshop-img-box" catchtap="">
|
||||
<view class="display_J_C">
|
||||
<image class="cartshop-img" src="/icon/goods-fx.png" />
|
||||
</view>
|
||||
<view class="cartshop-img-name">分享</view>
|
||||
<button plain="true" open-type="share"> </button>
|
||||
</view>
|
||||
<view class="cart-add">
|
||||
<text bindtap="choose" data-choose="1">加入购物车</text>
|
||||
<text bindtap="choose" data-choose="2">立即支付</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="wLogin" catchtap="login" wx:if="{{!login}}">授权登录</view>
|
||||
|
||||
<view class="height100"></view>
|
||||
517
pages/chuxiao/cx_details/goodsDetails.wxss
Normal file
517
pages/chuxiao/cx_details/goodsDetails.wxss
Normal file
@ -0,0 +1,517 @@
|
||||
.u-wrp-bnr {
|
||||
width: 100%;
|
||||
height: 750rpx;
|
||||
display: block;
|
||||
position: relative;
|
||||
background: #f0f0f0;
|
||||
z-index: 5
|
||||
}
|
||||
|
||||
.u-img-slide {
|
||||
width: 100%;
|
||||
height: 750rpx;
|
||||
}
|
||||
.content{
|
||||
position: relative
|
||||
}
|
||||
.num {
|
||||
position: absolute;
|
||||
top: 676rpx;
|
||||
right: 30rpx;
|
||||
color: #fff;
|
||||
height: 40rpx;
|
||||
background: #00000080;
|
||||
border-radius: 20rpx;
|
||||
line-height: 40rpx;
|
||||
padding: 0 15rpx;
|
||||
font-size: 22rpx;
|
||||
z-index: 100;
|
||||
}
|
||||
.num image{
|
||||
width: 22rpx;
|
||||
height: 21rpx;
|
||||
margin-right: 10rpx;
|
||||
}
|
||||
.flash-box{
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
height: 100rpx;
|
||||
width: 100%;
|
||||
line-height: 100rpx;
|
||||
}
|
||||
.miao-back{
|
||||
position: absolute;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
height: 100rpx;
|
||||
z-index: 30;
|
||||
}
|
||||
.flash-common{
|
||||
font-size: 32rpx;
|
||||
color: #fefefe;
|
||||
margin-left: 30rpx;
|
||||
}
|
||||
.flash-old{
|
||||
font-size: 24rpx;
|
||||
color: #fefefe;
|
||||
margin-left: 30rpx;
|
||||
text-decoration: line-through;
|
||||
}
|
||||
.flash-text{
|
||||
font-size: 24rpx;
|
||||
color: #fefefe;
|
||||
margin-left: 36rpx;
|
||||
}
|
||||
.flash-right{
|
||||
margin-right: 19rpx;
|
||||
z-index: 50;
|
||||
width: 174rpx;
|
||||
}
|
||||
.flash-top{
|
||||
margin-top: 16rpx;
|
||||
height: 28rpx;
|
||||
}
|
||||
.flash-top image{
|
||||
width: 26rpx;
|
||||
height: 28rpx;
|
||||
}
|
||||
.flash-top view{
|
||||
font-size: 22rpx;
|
||||
color: #212320;
|
||||
}
|
||||
.flash-time{
|
||||
margin-top: 10rpx;
|
||||
color: #fff;
|
||||
font-size: 22rpx;
|
||||
height: 36rpx;
|
||||
margin-left: 10rpx
|
||||
}
|
||||
.flash-time view{
|
||||
width: 36rpx;
|
||||
height: 36rpx;
|
||||
line-height: 36rpx;
|
||||
text-align: center;
|
||||
background-color: #212320;
|
||||
border-radius: 2rpx;
|
||||
}
|
||||
.flash-time text{
|
||||
margin: auto 5rpx;
|
||||
line-height: 36rpx;
|
||||
}
|
||||
.num-title-flash{
|
||||
color: #666;
|
||||
font-size: 22rpx;
|
||||
}
|
||||
/* 商品 */
|
||||
.detail-block {
|
||||
padding: 27rpx 30rpx;
|
||||
background-color: #ffffff;
|
||||
}
|
||||
|
||||
.detail-title {
|
||||
font-size: 30rpx;
|
||||
color: #333333;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.detail-title .exchange-num-one {
|
||||
font-size: 28rpx !important;
|
||||
color: #ee7b1e !important;
|
||||
}
|
||||
.exchange-num-juan {
|
||||
font-size: 34rpx;
|
||||
color: #999999;
|
||||
}
|
||||
|
||||
.exchange-num-two {
|
||||
font-size: 28rpx;
|
||||
color: #999999;
|
||||
text-decoration: line-through;
|
||||
margin-left: 20rpx;
|
||||
}
|
||||
.exchange-num-three{
|
||||
font-size: 30rpx;
|
||||
color: #ff291e;
|
||||
margin-left:40rpx;
|
||||
}
|
||||
.detail-text {
|
||||
font-size: 40rpx;
|
||||
color: #ee7b1e;
|
||||
}
|
||||
|
||||
.detail-price {
|
||||
font-size: 32rpx;
|
||||
color: #333333;
|
||||
margin-top: 29rpx;
|
||||
}
|
||||
|
||||
.detail-bottom {
|
||||
margin-top: 39rpx;
|
||||
font-size: 24rpx;
|
||||
color: #111111;
|
||||
}
|
||||
.detail-bottom-l__1,.detail-bottom-l__2{
|
||||
height: 38rpx;
|
||||
line-height: 38rpx;
|
||||
background-color: #fdf2e8;
|
||||
border-radius: 4rpx;
|
||||
font-size: 24rpx;
|
||||
color: #ee7b1e;
|
||||
padding: 0 10rpx;
|
||||
margin-right: 20rpx;
|
||||
}
|
||||
.detail-bottom-l__2{
|
||||
position: relative;
|
||||
}
|
||||
.detail-bottom-l__2 button{
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
opacity: 0;
|
||||
}
|
||||
.detail-bottom-r{
|
||||
font-size: 24rpx;
|
||||
color: #999999;
|
||||
}
|
||||
.detail-choose {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
height: 100rpx;
|
||||
line-height: 100rpx;
|
||||
background-color: #ffffff;
|
||||
border-radius: 20rpx;
|
||||
margin-top: 14rpx;
|
||||
padding: 0 30rpx;
|
||||
}
|
||||
|
||||
.detail-choose text:first-child {
|
||||
font-size: 28rpx;
|
||||
font-weight: bold;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.detail-choose text:nth-child(2) {
|
||||
flex: 0.9;
|
||||
font-size: 28rpx;
|
||||
color: #999999;
|
||||
margin-left: 47rpx;
|
||||
}
|
||||
|
||||
/* 商品详情 */
|
||||
.detImg-header {
|
||||
width: 100%;
|
||||
height: 100rpx;
|
||||
}
|
||||
.detImg-header image {
|
||||
width: 100%;
|
||||
height: 100rpx;
|
||||
}
|
||||
|
||||
.detail-img {
|
||||
/* padding-bottom: 28rpx; */
|
||||
background-color: #ffffff;
|
||||
/* margin-bottom: 120rpx; */
|
||||
}
|
||||
|
||||
.detail-img image {
|
||||
width: 100% !important;
|
||||
display: block;
|
||||
}
|
||||
/* 加入购物车 */
|
||||
.cartshop-block {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
width: 690rpx;
|
||||
padding:0 30rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 100rpx;
|
||||
background-color: #ffffff;
|
||||
}
|
||||
|
||||
.cartshop-img {
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
}
|
||||
|
||||
.cartshop-img-box {
|
||||
height: 64rpx;
|
||||
margin: 18rpx 0;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.cartshop-img-box button{
|
||||
width: 40rpx !important;
|
||||
opacity: 0;
|
||||
height: 100%;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
position: absolute;
|
||||
left:0;
|
||||
top: 0;
|
||||
z-index: 10;
|
||||
}
|
||||
.cartshop-img-name{
|
||||
font-size: 20rpx;
|
||||
color: #333333;
|
||||
line-height: 24rpx;
|
||||
}
|
||||
|
||||
.cartshop-img-num {
|
||||
position: absolute;
|
||||
top: -8rpx;
|
||||
right: -12rpx;
|
||||
height: 30rpx;
|
||||
line-height: 30rpx;
|
||||
background-color: #ff0000;
|
||||
border-radius: 18rpx;
|
||||
color: #fff;
|
||||
font-size: 20rpx;
|
||||
text-align: center;
|
||||
display: inline-block;
|
||||
padding: 0 10rpx;
|
||||
}
|
||||
|
||||
.cart-add text {
|
||||
display: inline-block;
|
||||
width: 180rpx;
|
||||
height: 65rpx;
|
||||
line-height: 65rpx;
|
||||
font-size: 28rpx;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.cart-add text:first-child {
|
||||
background-color: #ee7b1e;
|
||||
color: #fff;
|
||||
border-radius: 40rpx 0rpx 0rpx 40rpx;
|
||||
}
|
||||
|
||||
.cart-add text:last-child {
|
||||
background-color: #ff291e;
|
||||
border-radius: 0rpx 40rpx 40rpx 0rpx;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.cart-share {
|
||||
width: 180rpx;
|
||||
height: 80rpx;
|
||||
line-height: 80rpx;
|
||||
text-align: center;
|
||||
background-color: #ffb400;
|
||||
border-radius: 40rpx;
|
||||
font-size: 28rpx;
|
||||
color: #ffffff;
|
||||
margin-right: 12rpx;
|
||||
}
|
||||
|
||||
/* 弹窗 */
|
||||
.show {
|
||||
display: block
|
||||
}
|
||||
|
||||
.hide {
|
||||
display: none
|
||||
}
|
||||
|
||||
.commodity_screen {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
background: rgba(0,0,0,0.6);
|
||||
opacity: 1;
|
||||
z-index: 1000;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.commodity_attr_box {
|
||||
width: 100%;
|
||||
background-color: #ffffff;
|
||||
border-radius: 20rpx 20rpx 0rpx 0rpx;
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
z-index: 2000;
|
||||
}
|
||||
|
||||
.hideModal {
|
||||
font-size: 49rpx;
|
||||
color: rgba(183, 183, 183, 0.95);
|
||||
position: absolute;
|
||||
top: 26rpx;
|
||||
right: 30rpx;
|
||||
}
|
||||
|
||||
.choose-img {
|
||||
margin-top: 40rpx;
|
||||
padding: 0 30rpx 25rpx;
|
||||
width: 690rpx;
|
||||
border-bottom:solid 2rpx #c9c9c9;
|
||||
}
|
||||
|
||||
.choose-img image {
|
||||
width: 200rpx;
|
||||
height: 200rpx;
|
||||
}
|
||||
|
||||
.choose-right {
|
||||
margin-left: 50rpx
|
||||
}
|
||||
|
||||
.choose-right view {
|
||||
margin-top: 20rpx
|
||||
}
|
||||
|
||||
.choose-right view:nth-child(2) {
|
||||
font-size: 24rpx;
|
||||
color: #999999;
|
||||
}
|
||||
|
||||
.choose-right view:last-child {
|
||||
font-size: 24rpx;
|
||||
color: #666666;
|
||||
}
|
||||
|
||||
.choose-img text {
|
||||
font-size: 36rpx;
|
||||
color: #da0000;
|
||||
margin-left: 20rpx;
|
||||
margin-top: 120rpx
|
||||
}
|
||||
|
||||
.standard-height {
|
||||
height: 180rpx;
|
||||
}
|
||||
|
||||
.standard-title {
|
||||
font-size: 30rpx;
|
||||
color: #333333;
|
||||
padding: 44rpx 30rpx 0 30rpx;
|
||||
}
|
||||
|
||||
.standard-box {
|
||||
padding: 0 28rpx;
|
||||
}
|
||||
|
||||
.standard-text:first-child {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
.standard-text {
|
||||
font-size: 24rpx;
|
||||
color: #333333;
|
||||
padding: 14rpx 24rpx;
|
||||
background-color: #e5e5e5;
|
||||
border-radius: 10rpx;
|
||||
margin-left: 50rpx;
|
||||
border: solid 1rpx #e5e5e5;
|
||||
margin-top: 38rpx;
|
||||
}
|
||||
|
||||
.active {
|
||||
color: #fff;
|
||||
background-color: #ee7b1e;
|
||||
}
|
||||
|
||||
.standard-num-box {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
padding: 0 32rpx;
|
||||
margin-top: 10rpx;
|
||||
}
|
||||
|
||||
.num-title {
|
||||
font-size: 30rpx;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.standard-num {
|
||||
display: flex;
|
||||
border-radius: 5rpx;
|
||||
height: 50rpx;
|
||||
line-height: 50rpx;
|
||||
font-size: 26rpx;
|
||||
}
|
||||
|
||||
.standard-num text {
|
||||
width: 42rpx;
|
||||
height: 42rpx;
|
||||
line-height: 42rpx;
|
||||
display: lnline-block;
|
||||
text-align: center;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.standard-num .reduce {
|
||||
border: solid 1rpx #ee7b1e;
|
||||
color: #ee7b1e;
|
||||
}
|
||||
|
||||
.standard-num .add {
|
||||
background-color: #ee7b1e;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.standard-num input {
|
||||
text-align: center;
|
||||
margin: 0 10rpx;
|
||||
width: 70rpx;
|
||||
}
|
||||
|
||||
.cart {
|
||||
margin:30rpx auto;
|
||||
width: 690rpx;
|
||||
height: 80rpx;
|
||||
line-height: 80rpx;
|
||||
background-image: linear-gradient(-90deg,
|
||||
#ee7b1e 0%,
|
||||
#fdae03 100%);
|
||||
border-radius: 40rpx;
|
||||
text-align: center;
|
||||
font-size: 32rpx;
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
.cart text {
|
||||
width: 100%;
|
||||
display: block;
|
||||
}
|
||||
.cart .cart_4{
|
||||
background-color: #999999;
|
||||
border-radius: 40rpx;
|
||||
}
|
||||
.wIntegral{
|
||||
width: 750rpx;
|
||||
height: 90rpx;
|
||||
background-color: #fff;
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
}
|
||||
.wIntegral view{
|
||||
background-color: #ee7b1e;
|
||||
color: #fff;
|
||||
font-size: 28rpx;
|
||||
text-align: center;
|
||||
line-height: 64rpx;
|
||||
height: 64rpx;
|
||||
width: 690rpx;
|
||||
border-radius: 32rpx;
|
||||
}
|
||||
|
||||
.wLogin{
|
||||
width: 750rpx;
|
||||
height: 90rpx;
|
||||
text-align: center;
|
||||
line-height: 90rpx;
|
||||
background-color: #ee7b1e;
|
||||
color: #fff;
|
||||
font-size: 28rpx;
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
}
|
||||
42
pages/chuxiao/cx_wxParse/cx_wxParse.js
Normal file
42
pages/chuxiao/cx_wxParse/cx_wxParse.js
Normal file
@ -0,0 +1,42 @@
|
||||
const WxParse = require('../../../wxParse/wxParse.js');
|
||||
const app = getApp();
|
||||
Page({
|
||||
|
||||
/**
|
||||
* 页面的初始数据
|
||||
*/
|
||||
data: {
|
||||
bgImg: app.globalData.bgImg,
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面加载
|
||||
*/
|
||||
onLoad: function (options) {
|
||||
wx.showLoading({
|
||||
title: '加载中',
|
||||
})
|
||||
wx.request({
|
||||
url: app.globalData.ip + '/wisdommining/api/banner/getPromotion',
|
||||
method: 'GET',
|
||||
header: {
|
||||
"content-type": "application/x-www-form-urlencoded",
|
||||
},
|
||||
data: {},
|
||||
success: res => {
|
||||
console.log(res)
|
||||
wx.hideLoading()
|
||||
if (res.data.code == 1) {
|
||||
WxParse.wxParse('article', 'html', res.data.value.welfarePhoto, this, 20);
|
||||
} else {
|
||||
wx.showModal({
|
||||
title: '获取数据失败!',
|
||||
content: res.data.message,
|
||||
showCancel: false,
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
})
|
||||
4
pages/chuxiao/cx_wxParse/cx_wxParse.json
Normal file
4
pages/chuxiao/cx_wxParse/cx_wxParse.json
Normal file
@ -0,0 +1,4 @@
|
||||
{
|
||||
"usingComponents": {},
|
||||
"navigationBarTitleText": "促销专区"
|
||||
}
|
||||
4
pages/chuxiao/cx_wxParse/cx_wxParse.wxml
Normal file
4
pages/chuxiao/cx_wxParse/cx_wxParse.wxml
Normal file
@ -0,0 +1,4 @@
|
||||
<import src="../../../wxParse/wxParse.wxml" />
|
||||
<view class="cont">
|
||||
<template is="wxParse" data="{{wxParseData:article.nodes}}"/>
|
||||
</view>
|
||||
34
pages/chuxiao/cx_wxParse/cx_wxParse.wxss
Normal file
34
pages/chuxiao/cx_wxParse/cx_wxParse.wxss
Normal file
@ -0,0 +1,34 @@
|
||||
@import "../../../wxParse/wxParse.wxss";
|
||||
.cont{
|
||||
width:750rpx;
|
||||
}
|
||||
.cont image{
|
||||
width: 100% !important;
|
||||
}
|
||||
|
||||
.btn{
|
||||
width: 480rpx;
|
||||
height: 80rpx;
|
||||
background-image: linear-gradient(90deg,
|
||||
#fcaa05 0%,
|
||||
#f48e14 100%);
|
||||
border-radius: 40rpx;
|
||||
position: fixed;
|
||||
left:135rpx;
|
||||
bottom: 100rpx;
|
||||
font-size: 36rpx;
|
||||
color: #ffffff;
|
||||
line-height: 80rpx;
|
||||
text-align: center;
|
||||
}
|
||||
.btn button{
|
||||
opacity: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
position: absolute;
|
||||
left:0;
|
||||
top: 0;
|
||||
z-index: 10;
|
||||
}
|
||||
126
pages/chuxiao/integral.js
Normal file
126
pages/chuxiao/integral.js
Normal file
@ -0,0 +1,126 @@
|
||||
// pages/integral/integral.js
|
||||
const app = getApp()
|
||||
Page({
|
||||
|
||||
/**
|
||||
* 页面的初始数据
|
||||
*/
|
||||
data: {
|
||||
bgImg: app.globalData.bgImg,
|
||||
statusBarHeight: app.globalData.statusBarHeight,
|
||||
goods: [],
|
||||
topImg: '', //头部图片
|
||||
page: 1,
|
||||
num: 10,
|
||||
title:'促销专区'
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面加载
|
||||
*/
|
||||
onLoad: function (options) {
|
||||
this.goodsList()
|
||||
this.topImg()
|
||||
},
|
||||
//头部图片
|
||||
topImg(options) {
|
||||
console.log(options)
|
||||
wx.showLoading({
|
||||
title: '加载中',
|
||||
})
|
||||
wx.request({
|
||||
url: app.globalData.ip + '/wisdommining/api/banner/getBanner',
|
||||
method: 'GET',
|
||||
header: {
|
||||
"content-type": "application/x-www-form-urlencoded",
|
||||
},
|
||||
data: {
|
||||
type: 12
|
||||
},
|
||||
success: res => {
|
||||
console.log(res)
|
||||
wx.hideLoading()
|
||||
if (res.data.code == 1) {
|
||||
let topImg = res.data.value;
|
||||
this.setData({
|
||||
topImg: topImg
|
||||
})
|
||||
} else {
|
||||
wx.showModal({
|
||||
title: '获取数据失败!',
|
||||
content: res.data.message,
|
||||
showCancel: false,
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
//商品列表
|
||||
goodsList(options) {
|
||||
wx.showLoading({
|
||||
title: '加载中',
|
||||
})
|
||||
wx.request({
|
||||
url: app.globalData.ip + '/wisdommining/api/goods/gethotGoods',
|
||||
method: 'GET',
|
||||
header: {
|
||||
"content-type": "application/x-www-form-urlencoded",
|
||||
},
|
||||
data: {
|
||||
type: 3,
|
||||
userId: app.globalData.userId,
|
||||
page: this.data.page,
|
||||
num: this.data.num,
|
||||
},
|
||||
success: res => {
|
||||
console.log(res)
|
||||
wx.hideLoading()
|
||||
if (res.data.code == 1) {
|
||||
if (res.data.value.records.length > 0) {
|
||||
let goods = this.data.goods;
|
||||
for (let i = 0; i < res.data.value.records.length; i++) {
|
||||
goods.push(res.data.value.records[i])
|
||||
}
|
||||
this.setData({
|
||||
page: this.data.page + 1,
|
||||
goods: goods
|
||||
})
|
||||
} else {
|
||||
if (this.data.page != 1) {
|
||||
wx.showToast({
|
||||
title: '暂无更多~',
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
}
|
||||
} else {
|
||||
wx.showModal({
|
||||
title: '获取数据失败!',
|
||||
content: res.data.message,
|
||||
showCancel: false,
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
//返回
|
||||
back() {
|
||||
wx.navigateBack()
|
||||
},
|
||||
//商品详情
|
||||
goodsDetails(e) {
|
||||
let id = e.currentTarget.dataset.id;
|
||||
wx.navigateTo({
|
||||
url: '/pages/chuxiao/cx_details/goodsDetails?goodsId=' + id,
|
||||
})
|
||||
},
|
||||
|
||||
/**
|
||||
* 页面上拉触底事件的处理函数
|
||||
*/
|
||||
onReachBottom: function () {
|
||||
this.goodsList()
|
||||
},
|
||||
})
|
||||
4
pages/chuxiao/integral.json
Normal file
4
pages/chuxiao/integral.json
Normal file
@ -0,0 +1,4 @@
|
||||
{
|
||||
"usingComponents": {},
|
||||
"navigationStyle":"custom"
|
||||
}
|
||||
35
pages/chuxiao/integral.wxml
Normal file
35
pages/chuxiao/integral.wxml
Normal file
@ -0,0 +1,35 @@
|
||||
<!--pages/index/index.wxml-->
|
||||
<view class="top-all">
|
||||
<view class="top"
|
||||
style="background: url({{bgImg}}integral-top.png) no-repeat;background-size: 100%;padding-top:{{statusBarHeight}}px;">
|
||||
<view class="back-top">
|
||||
<view class="back display_A_C" catchtap="back">
|
||||
<image src="/icon/back-w.png"></image>
|
||||
</view>
|
||||
<view class="title">{{title}}</view>
|
||||
</view>
|
||||
<view class="bannner">
|
||||
<image src='{{topImg[0].bannerImage}}'></image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="shop">
|
||||
<image src="/icon/goods_2.png"></image>
|
||||
</view>
|
||||
<view class="cont-all">
|
||||
<view class="cont" catchtap="goodsDetails" wx:for='{{goods}}' data-id='{{item.id}}' wx:key='index'>
|
||||
<image class="goods-img" src="{{item.goodsPhoto}}"></image>
|
||||
<view class="goods-name GStitleTwo">{{item.goodsName}}</view>
|
||||
<view class="goods-price">
|
||||
<view class="price">
|
||||
￥{{item.wisdGoodsSpecList[0].specPromotionPrice}}
|
||||
<text class="price-text2">￥{{item.wisdGoodsSpecList[0].originalPrice}}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="goods-sales">
|
||||
已出售{{item.goodsSales}}件
|
||||
</view>
|
||||
</view>
|
||||
<view class="empty" wx:if='{{goods.length==0}}'>暂无商品~</view>
|
||||
</view>
|
||||
153
pages/chuxiao/integral.wxss
Normal file
153
pages/chuxiao/integral.wxss
Normal file
@ -0,0 +1,153 @@
|
||||
/* pages/index/index.wxss */
|
||||
page {
|
||||
background-color: #f5f5f5;
|
||||
}
|
||||
.top-all{
|
||||
border-radius: 0px 0px 40rpx 40rpx;
|
||||
}
|
||||
.top {
|
||||
width: 690rpx;
|
||||
padding: 40rpx 30rpx 0;
|
||||
}
|
||||
.back-top{
|
||||
position: relative;
|
||||
}
|
||||
.back{
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
height: 90rpx;
|
||||
}
|
||||
.back image{
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
margin-right: 50rpx;
|
||||
}
|
||||
.title {
|
||||
font-size: 36rpx;
|
||||
color: #ffffff;
|
||||
line-height: 90rpx;
|
||||
height: 90rpx;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.bannner {
|
||||
width: 690rpx;
|
||||
height: 280rpx;
|
||||
border-radius: 20rpx;
|
||||
margin:30rpx auto;
|
||||
}
|
||||
|
||||
.bannner image {
|
||||
width: 690rpx;
|
||||
height: 280rpx;
|
||||
border-radius: 20rpx;
|
||||
}
|
||||
.shop{
|
||||
width: 750rpx;
|
||||
height: 400rpx;
|
||||
background-image: linear-gradient(180deg,
|
||||
rgba(255,255,255,1) 0%,
|
||||
rgba(255,255,255,0) 100%);
|
||||
border-radius: 20rpx 20rpx 0px 0px;
|
||||
}
|
||||
.shop image{
|
||||
width: 750rpx;
|
||||
height: 100rpx;
|
||||
border-radius: 20rpx 20rpx 0px 0px;
|
||||
}
|
||||
.goods{
|
||||
width: 690rpx;
|
||||
background-image: linear-gradient(180deg,
|
||||
#ffffff 0%,
|
||||
#f5f5f5 44%,
|
||||
#f5f5f5 100%);
|
||||
border-radius: 40rpx 40rpx 0px 0px;
|
||||
margin-top: 30rpx;
|
||||
padding: 30rpx;
|
||||
}
|
||||
|
||||
.cont-all{
|
||||
width: 690rpx;
|
||||
margin:0 auto 30rpx;
|
||||
position: relative;
|
||||
top: -300rpx;
|
||||
z-index: 2;
|
||||
}
|
||||
.cont-all::after{
|
||||
display: block;
|
||||
content: '';
|
||||
clear: both;
|
||||
}
|
||||
.cont{
|
||||
float: left;
|
||||
width: 330rpx;
|
||||
background-color: #ffffff;
|
||||
border-radius: 10rpx;
|
||||
margin:30rpx 30rpx 0 0;
|
||||
}
|
||||
.cont:nth-child(2n){
|
||||
margin-right: 0;
|
||||
}
|
||||
.goods-img{
|
||||
width: 330rpx;
|
||||
height: 330rpx;
|
||||
}
|
||||
.goods-name{
|
||||
width: 280rpx;
|
||||
padding:0 25rpx;
|
||||
font-size: 32rpx;
|
||||
color: #333333;
|
||||
margin-top: 25rpx;
|
||||
}
|
||||
.goods-price{
|
||||
margin:0 20rpx;
|
||||
padding: 18rpx 0;
|
||||
width:290rpx;
|
||||
border-bottom: 1rpx solid #e5e5e5;
|
||||
}
|
||||
.price{
|
||||
font-size: 36rpx;
|
||||
color: #ee7b1e;
|
||||
}
|
||||
.price text{
|
||||
font-size: 28rpx;
|
||||
}
|
||||
.original-price{
|
||||
font-size: 24rpx;
|
||||
color: #999999;
|
||||
text-decoration: line-through;
|
||||
}
|
||||
.goods-sales{
|
||||
font-size: 24rpx;
|
||||
color: #999999;
|
||||
line-height:72rpx;
|
||||
padding:0 25rpx;
|
||||
position: relative;
|
||||
}
|
||||
.exchange{
|
||||
position: absolute;
|
||||
top: 20rpx;
|
||||
right:16rpx;
|
||||
width: 100rpx;
|
||||
height: 36rpx;
|
||||
line-height: 36rpx;
|
||||
background-color: #ee7b1e;
|
||||
border-radius: 18rpx;
|
||||
text-align: center;
|
||||
font-size: 24rpx;
|
||||
color: #ffffff;
|
||||
}
|
||||
.empty{
|
||||
text-align: center;
|
||||
margin: 250rpx auto;
|
||||
font-size: 28rpx;
|
||||
letter-spacing: 3rpx;
|
||||
color: #bababa;
|
||||
}
|
||||
|
||||
.price-text2{
|
||||
font-size: 24rpx;
|
||||
color: #999999;
|
||||
text-decoration: line-through;
|
||||
}
|
||||
Reference in New Issue
Block a user