Skip to content

7
7-Eleven
Commit c8b69f09 by 赵雅纹
Options

sku

parent 55e30a3a
Showing with 231 additions and 183 deletions
src/component/productListStyleOne/productListStyleOne.wxml
......@@ -11,7 +11,8 @@
</block>
</view>
</view>
<template name="water-list">
<template name="water-list">
<navigator hover-class="none" url="/pages/productDetail/productDetail?productId={{productId}}">
<view class="item">
<image class="item-img" src="{{indexUrl}}" mode="widthFix"></image>
<view class="item-title-box">
......@@ -30,4 +31,5 @@
</view>
</view>
</view>
</navigator>
</template>
src/component/productListStyleTwo/productListStyleTwo.wxml
<!--component/productListStyleTwo/productListStyleTwo.wxml-->
<view class="hot-item border_box" wx:for="{{imageData}}" wx:key="{{index}}">
<block wx:for="{{imageData}}" wx:key="{{index}}">
<navigator hover-class="none" url="/pages/productDetail/productDetail?productId={{menuSec.productId}}">
<view class="hot-item border_box" >
<view class="hot-img-box">
<image class="hot-img" src="{{item.indexUrl}}" mode="widthFix" lazy-load="false" binderror="" bindload="" />
</view>
......@@ -36,6 +38,8 @@
<view/>
</view>
</view>
</view>
</navigator>
</block>
src/component/skuPopup/skuPopup.js
......@@ -52,14 +52,14 @@ Component({
type: String,
value: ''
},
specNames: { // 所有规格名
type: Object,
value: []
},
specValues: { // 所有规格值
specItem: { // 所有规格
type: Object,
value: []
},
// specValues: { // 所有规格值
// type: Object,
// value: []
// },
proNum: { // 初始化的数量
type: Number,
value: 1
......@@ -84,35 +84,40 @@ Component({
show: { // 显示标识
type: Boolean,
value: false
},
productStock:{
type: Number,
value: 0
}
},
attached () {
let price = this.data.showPrice
if (!price) {
if (this.data.curSku.promotion_price) {
price = this._setExchangePrice(this.data.curSku.promotion_price)
}
}
console.log(this.data)
this.setData({
price
})
// let price = this.data.showPrice
// if (!price) {
// if (this.data.curSku.promotion_price) {
// price = this._setExchangePrice(this.data.curSku.promotion_price)
// }
// }
// console.log(this.data)
// this.setData({
// price
// })
},
/**
* 组件的初始数据
*/
data: {
skuInfoDatas: [], // 重新组装的规格json数据
curSpec: [], // 当前选中的规格值
curSku: {}, // 当前选中的sku信息
price: 0, // 页面上展示的价格
// price: 0, // 页面上展示的价格
skuText: '',
skuStock: 0,
skuId:'',
btnText: '确定', // 确定 缺货 缺货订阅
isOutStock: false, // 背景色
clickDataStock: 0
clickDataStock: 0,
salePrice:0,
},
detached: function () {
......@@ -125,30 +130,36 @@ Component({
* 组件的方法列表
*/
methods: {
_skuInfosChange () {
var curSpec = []
if (this.data.initSku) {
console.log(this.data.initSku)
curSpec = this.data.initSku.spec.split('###')
}
this.setData({
skuInfoDatas: [], // 重新组装的规格json数据
curSpec: curSpec, // 当前选中的规格值
curSku: {}, // 当前选中的sku信息
skuText: '',
skuStock: 0
})
this._setCurSku()
},
_showPriceChange (newV, oldV) {
if (newV !== oldV) {
this.setData({
showPrice: newV,
price: newV
// _skuInfosChange () {
// var curSpec = []
// if (this.data.initSku) {
// console.log(this.data.initSku)
// curSpec = this.data.initSku.spec.split('###')
// }
// this.setData({
// curSpec: curSpec, // 当前选中的规格值
// curSku: {}, // 当前选中的sku信息
// skuText: '',
// skuStock: 0,
// salePrice:0
// })
// this._setCurSku()
// },
// _showPriceChange (newV, oldV) {
// if (newV !== oldV) {
// this.setData({
// showPrice: newV,
// price: newV
// })
// }
// },
confirm() {
if (this.data.curSpec.length < 1){
wx.showToast({
title: '请选择规格',
icon: 'none'
})
}
},
confirm: function () {
}else{
for (var i = 0; i < this.data.curSpec.length; i++) {
if (!this.data.curSpec[i]) {
wx.showToast({
......@@ -158,12 +169,35 @@ Component({
return false
}
}
}
const trolleySku = {
count: this.data.proNum,
skuId: this.data.skuId
}
// 加入购物车
wxService.post('/sale/trolley/put', trolleySku).then(res => {
if (res) {
const { result } = res.data
if (result == 0) {
wx.showToast({
title: '添加成功，在购物车等亲~',
icon: 'none'
})
this.setData({
show: false
})
this.triggerEvent('skuselect', {
selectSku: this.data.curSku,
selectSku: this.data.curSpec,
counts: this.data.proNum,
isAllowArrive: this.data.isAllowArrive,
clickDataStock: this.data.clickDataStock
// isAllowArrive: this.data.isAllowArrive,
// clickDataStock: this.data.clickDataStock
})
}
}
})
},
inputNum: function (e) { // 输入数量
var newNum = e.detail.value
......@@ -210,41 +244,12 @@ Component({
addNum: function () { // 增加数量
let proNum = this.data.proNum
const curSku = this.data.curSku
if (this.data.quantityAverage == '0') {
if (proNum < this.data.curSku.inventory_num) {
proNum++
} else {
wx.showToast({
title: '不能超过库存',
icon: 'none'
})
}
} else {
if (proNum < this.data.quantityAverage) {
proNum++
} else {
wx.showToast({
title: '每人限购' + this.data.quantityAverage + '件',
icon: 'none'
})
}
}
console.log(this.data)
let reportModel = new ReportModel('add_to_cart')
reportModel.setProps({
sku: {
sku_id: curSku.sku_code,
sku_name: this.data.productName,
original_price: parseFloat(curSku.price / 100).toFixed(2)
},
sku_price: parseFloat(curSku.price / 100).toFixed(2),
action_type: proNum ? 'append_to_cart' : 'first_add_to_cart'
})
wxService.report(reportModel)
console.log(curSku)
proNum ++
this.setData({
proNum: proNum
proNum
})
},
hidePopup: function () { // 隐藏弹出框
this.setData({
......@@ -255,7 +260,15 @@ Component({
var clickData = event.target.dataset
var curSpec = this.data.curSpec
if (!clickData.disable) {
curSpec[clickData.index] = clickData.name
curSpec[clickData.index] = {
id: clickData.id,
name: clickData.name
}
console.log(event)
// curSpec.push({
// id: clickData.id,
// name: clickData.name
// })
this.setData({
curSpec: curSpec
}, this._setCurSku())
......@@ -268,7 +281,7 @@ Component({
// 没库存
if (!clickData.stock) {
isOutStock = true
btnText = this.data.isNoticeStatus ? '您已订阅成功' : '商品暂时缺货,订阅到货通知'
btnText = "商品暂无库存"
}
this.setData({
btnText, isOutStock, clickDataStock: clickData.stock
......@@ -283,57 +296,41 @@ Component({
}
},
_setExchangePrice (price) {
let exprice = price
if (this.data.exchangePrice > 0) {
let exchangePrice = this.data.exchangePrice// 积分数
let bwtPrice = ((exchangePrice * this.data.integralRole - price) / 100)// 差额
exprice = bwtPrice < 0 ? ((exchangePrice) + '积分+￥' + Math.abs(bwtPrice)) : (exchangePrice + '积分')
}
return exprice
},
// _setExchangePrice (price) {
// let exprice = price
// if (this.data.exchangePrice > 0) {
// let exchangePrice = this.data.exchangePrice// 积分数
// let bwtPrice = ((exchangePrice * this.data.integralRole - price) / 100)// 差额
// exprice = bwtPrice < 0 ? ((exchangePrice) + '积分+￥' + Math.abs(bwtPrice)) : (exchangePrice + '积分')
// }
// return exprice
// },
_setCurSku: function () { // 显示选中的sku信息
if (!this.data.skuInfos) {
return false
}
var proNum = this.data.proNum
var curSpec = this.data.curSpec
var skuInfoDatas = []
if (curSpec.length === 0) {
curSpec.length = this.data.specNames.length
}
// 根据当前选中的规格，设置其他每一个规格项的库存数
for (var i = 0; i < this.properties.specNames.length; i++) {
var specJson = {
specName: this.properties.specNames[i],
specValue: []
}
for (var j = 0; j < this.properties.specValues[i].length; j++) {
var tempStock = 0
for (var k = 0; k < this.properties.skuInfos.length; k++) {
var skuNameArray = this.properties.skuInfos[k].spec.split('###')
if (skuNameArray[i] === this.properties.specValues[i][j]) {
for (var i = 0; i < this.data.skuInfos.length; i++){
var skuNameArray = this.data.skuInfos[i].specValue.split('###')
// console.log(skuNameArray)
var flag = true
for (var z = 0; z < skuNameArray.length; z++) {
if (curSpec[z] && i !== z && curSpec[z] !== skuNameArray[z]) {
for (var j = 0; j < skuNameArray.length; j++){
if (curSpec[j] && i !== j && curSpec[j] !== skuNameArray[j]) {
flag = false
}
}
if (flag) {
tempStock += this.properties.skuInfos[k].inventory_num
}
}
}
specJson.specValue.push({
skuName: this.properties.specValues[i][j],
skuStock: tempStock
this.setData({
skuStock: this.data.skuInfos[i].stock,
salePrice: this.data.skuInfos[i].salePrice,
skuId: this.data.skuInfos[i].skuId
})
}
skuInfoDatas.push(specJson)
}
console.log('00000',this.data.skuStock)
// 根据当前选中的规格，设置头部的规格信息
var skuText = []
if (curSpec.join('') === '') {
......@@ -341,48 +338,61 @@ Component({
} else {
for (let i = 0; i < curSpec.length; i++) {
if (!curSpec[i]) {
skuText.push('请选择' + this.data.specNames[i])
} else {
skuText.push(curSpec[i])
skuText.push('请选择' + this.data.specItem[i].name)
}else{
skuText.push(curSpec[i].name)
}
}
}
var skuStock = 0
var skuId = ''
var salePrice = 0
var curSku = 0
var curSkus = this.data.skuInfos.filter(function (item) {
curSku = item
var flag = true
for (let i = 0; i < curSpec.length; i++) {
if (curSpec[i] && curSpec[i] !== item.spec.split('###')[i]) {
if (curSpec[i] && curSpec[i].id !== item.specValue.split('###')[i]) {
console.log('11111',curSpec[i])
console.log('22222', item.specValue.split('###')[i])
flag = false
}
}
if (flag) {
skuStock += item.inventory_num
skuStock = item.stock
skuId = item.skuId
salePrice = item.salePrice
}
console.log(flag)
return flag
})
var curSku = curSkus[0]
if (proNum > curSku.inventory_num) { // 选择数量超过库存时将数量修改为库存数
proNum = curSku.inventory_num
if (proNum > curSku.stock) { // 选择数量超过库存时将数量修改为库存数
proNum = curSku.stock
}
if (proNum == 0) {
proNum = 1
}
let price = curSku.promotion_price
// let price = curSku.promotion_price
price = this._setExchangePrice(price)
// price = this._setExchangePrice(price)
let updateData = {
curSpec: curSpec,
curSku: curSku,
skuStock: skuStock,
skuText: skuText,
skuInfoDatas: skuInfoDatas,
proNum: proNum
}
if (!this.data.priceNoChange) {
updateData.price = price// 拼团规格没有价格信息
proNum: proNum,
skuId: skuId,
salePrice: salePrice
}
// if (!this.data.priceNoChange) {
// updateData.price = price// 拼团规格没有价格信息
// }
this.setData(updateData)
console.log('666', updateData.skuStock)
}
}
})
src/component/skuPopup/skuPopup.wxml
......@@ -6,20 +6,18 @@
<view class="top-info clearfix">
<image mode="widthFix" src="{{curSku.sku_pic_url && curSku.sku_pic_url != 'undefined' ? (imageDomain + curSku.sku_pic_url) : indexImg}}"></image>
<view class="top-text">
<view class="price-text" wx:if="{{exchangePrice <= 0}}">￥{{price / 100}}</view>
<view class="price-text" wx:else>{{price}}</view>
<!-- <view class="price-text" wx:if="{{exchangePrice <= 0}}">￥{{price / 100}}</view> -->
<view class="price-text">￥{{salePrice}}</view>
<view class="stock-text">库存：{{skuStock}}</view>
<view class="sku-text">规格：<block wx:for="{{skuText}}" wx:key="{{index}}">{{item}} </block></view>
</view>
</view>
<!-- isAllowArrive 0 开启/放开 1 关闭/禁用 -->
<scroll-view class="mid-info" scroll-y="true">
<view class="sku-info" >
<view class="spec-name">默认</view>
<view class="spec-values">
<view class="spec-value active">默认选项</view>
<view class="spec-value">默认选项</view>
<view class="spec-value">默认选项</view>
<view class="sku-info" wx:for="{{specItem}}" wx:for-index="i" wx:key="{{i}}">
<view class="spec-name">{{item.name}}</view>
<view class="spec-values" wx:for="{{item.sonList}}" wx:for-index="j" wx:key="{{j}}" wx:for-item="specValue">
<view class="spec-value {{specValue.stock == 0 ? ' disabled' : ''}}{{curSpec[i].name == specValue.name ? ' active' : ''}}" bindtap="selectSku" data-id="{{specValue.id}}" data-index="{{i}}" data-name="{{specValue.name}}" data-type="{{goodType}}" data-disable="{{specValue.skuStock == 0 ? true : false}}" data-stock="{{skuStock}}">{{specValue.name}}</view>
<!-- <view wx:if="{{isAllowArrive}}" class="spec-value{{specValue.skuStock == 0 ? ' disabled' : ''}}{{curSpec[i] == specValue.skuName ? ' active' : ''}}" wx:for="{{specInfo.specValue}}" wx:for-index="j" wx:key="{{j}}" wx:for-item="specValue" data-stock="{{specValue.skuStock}}" data-name="{{specValue.skuName}}" data-index="{{i}}" data-type="{{goodType}}" data-disable="{{specValue.skuStock == 0 ? true : false}}" bindtap="selectSku">{{specValue.skuName}}</view> -->
<!-- <view wx:if="{{!isAllowArrive}}" class="spec-value{{specValue.skuStock == 0 ? ' disabled' : ''}}{{curSpec[i] == specValue.skuName ? ' active' : ''}}" wx:for="{{specInfo.specValue}}" wx:for-index="j" wx:key="{{j}}" wx:for-item="specValue" data-stock="{{specValue.skuStock}}" data-name="{{specValue.skuName}}" data-index="{{i}}" data-type="{{goodType}}" data-disable="{{specValue.skuStock == 0 && goodType == 2 ? true : false}}" bindtap="selectSku">{{specValue.skuName}}</view> -->
......
src/component/skuPopup/skuPopup.wxss
......@@ -19,7 +19,7 @@
transform: translateY(0); }
.out-stock {
background: #FFB400!important;
background: #aaaaaa!important;
}
.popup-content {
position: fixed;
......@@ -97,6 +97,9 @@
display: inline-block;
vertical-align: middle;
}
.spec-values{
display: inline-block;
}
.mid-info .sku-info .spec-value {
color: #808080;
font-size: 26rpx;
......
src/pages/productDetail/productDetail.js
// pages/productDetail/productDetail.js
var app = getApp()
const wxService = require('../../utils/wxService')
Page({
wxService.page({
/**
* 页面的初始数据
*/
data: {
productId:'',
productInfo:'',
showHtml: false,
reachBottom: false, // 标识是否触底
showSkuPopup: false,
btnText: '立即购买',
btnText: '确定',
baseImgUrl: app.globalData.imageUrl,
swiperCurrent: 0,
selectSkuName:'',
imageData: [{
desc: "string",
......@@ -52,7 +57,11 @@ Page({
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
if (options && options.productId){
this.setData({
productId: options.productId
})
}
},
swiperChange(e) {
......@@ -72,24 +81,28 @@ Page({
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function () {
},
/**
* 生命周期函数--监听页面显示
*/
onShow: function () {
this.getProInfo()
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide: function () {
//获取商品详情
getProInfo(){
wx.showLoading({
title: '加载中'
})
wxService.get(`/sale/product/buyer/findByProductId?productId=${this.data.productId}`).then(res => {
const { result, data } = res.data
if (result == 0) {
wx.hideLoading()
this.setData({
productInfo: data
})
}
}).finally(() => {
wx.hideLoading()
})
},
/**
......@@ -173,6 +186,18 @@ Page({
}).exec()
},
confirmClick(event){
console.log(event)
var selectSkuName = []
for (let i in event.detail.selectSku){
selectSkuName.push(event.detail.selectSku[i].name)
}
var selectSkuStr = selectSkuName.join(',')
this.setData({
selectSkuName: selectSkuStr
})
}
})
\ No newline at end of file
src/pages/productDetail/productDetail.wxml
......@@ -9,14 +9,14 @@
-->
<swiper
autoplay="true" style="height: 750rpx;line-height: 100rpx;" bindchange="swiperChange">
<block wx:for="{{imageData}}" wx:key="index">
<block wx:for="{{productInfo.listUrl}}" wx:key="index">
<swiper-item>
<image class="swiper-image" mode="widthFix" src="{{baseImgUrl}}{{item.imageUrl}}"></image>
</swiper-item>
</block>
</swiper>
<view class="dots">
<block wx:for="{{imageData}}" wx:key="index">
<block wx:for="{{productInfo.listUrl}}" wx:key="index">
<view class="dot{{index == swiperCurrent ? ' active' : ''}}"></view>
</block>
</view>
......@@ -35,10 +35,10 @@
</view>
</view>
<view class="product-name">
名称
{{productInfo.productName}}
</view>
<view class="product-desc">
描述
{{productInfo.productStatusDesc}}
</view>
<view class="member-price">
<view class="member-price-info">
......@@ -51,15 +51,15 @@
<image class="big-arrow" src="/assets/imgs/big-arrow-right.png"></image>
</view>
</view>
<view class="choose-wrap">
请选择规格
<!-- <image class="arrow-right"></image> -->
<view class="choose-wrap" bindtap="addCart">
{{selectSkuName ? '已选：' + selectSkuName : '请选择规格'}}
<image class="arrow-right" src="/assets/imgs/7_1_0/arrow-right-sku.png" mode="widthFix"></image>
</view>
<view class="choose-wrap">
支持快递配送</view>
<!-- <view class="choose-wrap">
支持快递配送</view> -->
<view class="surplus">
剩余：
<text class="surplus-number">300</text>
<text class="surplus-number">{{productInfo.stock}}</text>
件
</view>
......@@ -141,19 +141,18 @@
</view>
<sku-popup
product-name="{{product.name}}"
spec-names="{{product.sku_names}}"
spec-values="{{product.skus}}"
good-type="{{product.goodType}}"
is-allow-arrive="{{product.isAllowArrive}}"
is-notice-status="{{isNoticeStatus}}"
index-img="{{product.index_url[0]}}"
image-domain="{{product.image_domain}}"
sku-infos="{{product.skuStocks}}"
quantity-average="{{product.quantity_average}}"
product-name="{{productInfo.productName}}"
spec-item="{{productInfo.specItemList}}"
good-type="{{productInfo.productType}}"
index-img="{{productInfo.listUrl}}"
sku-infos="{{productInfo.productSku}}"
show="{{showSkuPopup}}"
exchange-price="{{product.exchange_credits}}"
integral-role="{{product.integral_role}}"
bind:skuselect="confirmClick"
btn-text="{{btnText}}"
product-stock="{{productInfo.stock}}"
/>
<!-- <sku-popup
product-sku="{{productInfo.productSku}}"
/> -->
\ No newline at end of file
src/pages/productDetail/productDetail.wxss
......@@ -231,3 +231,8 @@
border: none;
border-radius: 0;
}
.arrow-right{
width: 15rpx;
float:right;
margin-top: 26rpx;
}
src/subPackage/page/pages/fun/fun.js
......@@ -46,7 +46,7 @@ wxService.page({
wx.showLoading({
title: '加载中'
})
wxService.post(`/sale/product/buyer/findProductListPage?pageNo=${this.data.pageNo}&pageSize=${this.data.pageSize}`, this.data.form.queryDto).then(res => {
wxService.post(`/sale/product/buyer/listPageByCategoryId?pageNo=${this.data.pageNo}&pageSize=${this.data.pageSize}`, this.data.form.queryDto).then(res => {
const { result, data } = res.data
if (result == 0 && data.content) {
wx.hideLoading()
......
src/subPackage/page/pages/fun/fun.wxml
......@@ -3,9 +3,9 @@
<view>
<tab-sort/>
<product-list-style-one image-data="{{proData}}" wx:if="{{}}"/>
<product-list-style-one image-data="{{proData}}" />
<product-list-style-two image-data="{{proData}}" />
<product-list-style-two image-data="{{proData}}" wx:if="{{}}" />
<view class="empty" wx:if="{{proData.length < 1}}">
暂无商品哦~
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment