const WXAPI = require('apifm-wxapi') const AUTH = require('../../../utils/auth') import Poster from 'wxa-plugin-canvas/poster/poster' Page({ data: { wxlogin: true, createTabs: false, //绘制tabs tabs: [{ tabs_name: '商品简介', view_id: 'swiper-container', topHeight: 0 }, { tabs_name: '商品详情', view_id: 'goods-des-info', topHeight: 0, }], goodsDetail: {}, hasMoreSelect: false, selectSizePrice: 0, selectSizeOPrice: 0, totalScoreToPay: 0, shopNum: 0, hideShopPopup: true, buyNumber: 1, buyNumMin: 1, buyNumMax: 0, propertyChildIds: "", propertyChildNames: "", canSubmit: false, // 选中规格尺寸时候是否允许加入购物车 shopType: "addShopCar", //购物类型,加入购物车或立即购买,默认为加入购物车 }, bindscroll(e) { if (this.data.tabclicked) { return } //计算页面 轮播图、详情、评价(砍价)view 高度 this.getTopHeightFunction() var tabsHeight = this.data.tabsHeight //顶部距离(tabs高度) if (this.data.tabs[0].topHeight-tabsHeight<=0 && 0 < this.data.tabs[1].topHeight-tabsHeight) { //临界值,根据自己的需求来调整 this.setData({ active: this.data.tabs[0].tabs_name //设置当前标签栏 }) } else if (this.data.tabs[1].topHeight-tabsHeight<=0) { this.setData({ active: this.data.tabs[1].tabs_name }) } }, onLoad(e) { // e.id = 802819 // 读取分享链接中的邀请人编号 if (e && e.inviter_id) { wx.setStorageSync('referrer', e.inviter_id) } // 读取小程序码中的邀请人编号 if (e && e.scene) { const scene = decodeURIComponent(e.scene) // 处理扫码进商品详情页面的逻辑 if (scene && scene.split(',').length >= 2) { e.id = scene.split(',')[0] wx.setStorageSync('referrer', scene.split(',')[1]) } } // 静默式授权注册/登陆 AUTH.checkHasLogined().then(isLogined => { if (!isLogined) { AUTH.authorize().then( aaa => { AUTH.bindSeller() }) } else { AUTH.bindSeller() } }) this.data.goodsId = e.id this.goodsDetail() }, async goodsDetail() { const token = wx.getStorageSync('token') const res = await WXAPI.goodsDetail(this.data.goodsId, token ? token : '') if (res.code == 0) { this.setData({ goodsDetail: res.data, }) this.cpsJdGoodsDetail(res.data.basicInfo.yyId) } }, async cpsJdGoodsDetail(skuId) { const res = await WXAPI.cpsJdGoodsDetail({ skuIds: skuId }) if (res.code == 0) { const _data = res.data[0] if (_data.detailImages) { _data.detailImagesArray = _data.detailImages.split(',') } this.setData({ cpsJdGoodsDetail: _data }) } }, selectAddress: function () { wx.navigateTo({ url: "/pages/select-address/index" }) }, onShow (){ this.setData({ createTabs: true //绘制tabs }) //计算tabs高度 var query = wx.createSelectorQuery(); query.select('#tabs').boundingClientRect((rect) => { var tabsHeight = rect.height this.setData({ tabsHeight:tabsHeight }) }).exec() AUTH.checkHasLogined().then(isLogined => { if (isLogined) { this.setData({ wxlogin: isLogined }) this.goodsFavCheck() } }) }, getTopHeightFunction() { var that = this var tabs = that.data.tabs tabs.forEach((element, index) => { var viewId = "#" + element.view_id that.getTopHeight(viewId, index) }); }, getTopHeight(viewId, index) { var query = wx.createSelectorQuery(); query.select(viewId).boundingClientRect((rect) => { if (!rect) { return } let top = rect.top var tabs = this.data.tabs tabs[index].topHeight = top this.setData({ tabs: tabs }) }).exec() }, async goodsFavCheck() { const res = await WXAPI.goodsFavCheck(wx.getStorageSync('token'), this.data.goodsId) if (res.code == 0) { this.setData({ faved: true }) } else { this.setData({ faved: false }) } }, async addFav(){ AUTH.checkHasLogined().then(isLogined => { this.setData({ wxlogin: isLogined }) if (isLogined) { if (this.data.faved) { // 取消收藏 WXAPI.goodsFavDeleteV2({ token: wx.getStorageSync('token'), goodsId: this.data.goodsId, type: 1 }).then(res => { this.goodsFavCheck() }) } else { const extJsonStr = { wxaurl: `/packageCps/pages/goods-details/cps-jd?id=${this.data.goodsId}`, skuId: this.data.goodsId, pic: this.data.goodsDetail.basicInfo.pic, name: this.data.goodsDetail.basicInfo.name } // 加入收藏 WXAPI.goodsFavAdd({ token: wx.getStorageSync('token'), goodsId: this.data.goodsId, type: 1, extJsonStr: JSON.stringify(extJsonStr) }).then(res => { this.goodsFavCheck() }) } } }) }, goShopCar: function() { wx.reLaunch({ url: "/pages/shop-cart/index" }); }, toAddShopCar: function() { this.setData({ shopType: "addShopCar" }) this.bindGuiGeTap(); }, async tobuy() { const token = wx.getStorageSync('token') if (!token) { wx.showToast({ title: '请先登陆', icon: 'none' }) return } const res = await WXAPI.cpsJdGoodsShotUrl(token, this.data.goodsDetail.basicInfo.yyId) if (res.code != 0) { wx.showToast({ title: res.msg, icon: 'none' }) return } // res.data.shortURL const url = encodeURIComponent(res.data.shortURL) wx.navigateToMiniProgram({ appId: 'wx91d27dbf599dff74', path: `/pages/union/proxy/proxy?spreadUrl=${url}` }) }, toPingtuan: function(e) { let pingtuanopenid = 0 if (e.currentTarget.dataset.pingtuanopenid) { pingtuanopenid = e.currentTarget.dataset.pingtuanopenid } this.setData({ shopType: "toPingtuan", selectSizePrice: this.data.goodsDetail.basicInfo.pingtuanPrice, selectSizeOPrice: this.data.goodsDetail.basicInfo.originalPrice, pingtuanopenid: pingtuanopenid, hideShopPopup: false, skuGoodsPic: this.data.goodsDetail.basicInfo.pic }); }, /** * 规格选择弹出框 */ bindGuiGeTap: function() { this.setData({ hideShopPopup: false }) }, /** * 规格选择弹出框隐藏 */ closePopupTap: function() { this.setData({ hideShopPopup: true }) }, stepChange(event) { this.setData({ buyNumber: event.detail }) }, /** * 选择商品规格 */ async labelItemTap(e) { const propertyindex = e.currentTarget.dataset.propertyindex const propertychildindex = e.currentTarget.dataset.propertychildindex const property = this.data.goodsDetail.properties[propertyindex] const child = property.childsCurGoods[propertychildindex] // 取消该分类下的子栏目所有的选中状态 property.childsCurGoods.forEach(child => { child.active = false }) // 设置当前选中状态 property.optionValueId = child.id child.active = true // 获取所有的选中规格尺寸数据 const needSelectNum = this.data.goodsDetail.properties.length let curSelectNum = 0; let propertyChildIds = ""; let propertyChildNames = ""; this.data.goodsDetail.properties.forEach(p => { p.childsCurGoods.forEach(c => { if (c.active) { curSelectNum++; propertyChildIds = propertyChildIds + p.id + ":" + c.id + ","; propertyChildNames = propertyChildNames + p.name + ":" + c.name + " "; } }) }) let canSubmit = false; if (needSelectNum == curSelectNum) { canSubmit = true; } let skuGoodsPic = this.data.skuGoodsPic if (this.data.goodsDetail.subPics && this.data.goodsDetail.subPics.length > 0) { const _subPic = this.data.goodsDetail.subPics.find(ele => { return ele.optionValueId == child.id }) if (_subPic) { skuGoodsPic = _subPic.pic } } this.setData({ goodsDetail: this.data.goodsDetail, canSubmit, skuGoodsPic, propertyChildIds, propertyChildNames, }) this.calculateGoodsPrice() }, async calculateGoodsPrice() { // 计算最终的商品价格 let price = this.data.goodsDetail.basicInfo.minPrice let originalPrice = this.data.goodsDetail.basicInfo.originalPrice let totalScoreToPay = this.data.goodsDetail.basicInfo.minScore let buyNumMax = this.data.goodsDetail.basicInfo.stores let buyNumber = this.data.goodsDetail.basicInfo.minBuyNumber if (this.data.shopType == 'toPingtuan') { price = this.data.goodsDetail.basicInfo.pingtuanPrice } // 计算 sku 价格 if (this.data.canSubmit) { const token = wx.getStorageSync('token') const res = await WXAPI.goodsPriceV2({ token: token ? token : '', goodsId: this.data.goodsDetail.basicInfo.id, propertyChildIds: this.data.propertyChildIds }) if (res.code == 0) { price = res.data.price if (this.data.shopType == 'toPingtuan') { price = res.data.pingtuanPrice } originalPrice = res.data.originalPrice totalScoreToPay = res.data.score buyNumMax = res.data.stores } } // 计算配件价格 if (this.data.goodsAddition) { this.data.goodsAddition.forEach(big => { big.items.forEach(small => { if (small.active) { price = (price*100 + small.price*100) / 100 } }) }) } this.setData({ selectSizePrice: price, selectSizeOPrice: originalPrice, totalScoreToPay: totalScoreToPay, buyNumMax, buyNumber: (buyNumMax >= buyNumber) ? buyNumber : 0 }); }, /** * 选择可选配件 */ async labelItemTap2(e) { const propertyindex = e.currentTarget.dataset.propertyindex const propertychildindex = e.currentTarget.dataset.propertychildindex const goodsAddition = this.data.goodsAddition const property = goodsAddition[propertyindex] const child = property.items[propertychildindex] if (child.active) { // 该操作为取消选择 child.active = false this.setData({ goodsAddition }) this.calculateGoodsPrice() return } // 单选配件取消所有子栏目选中状态 if (property.type == 0) { property.items.forEach(child => { child.active = false }) } // 设置当前选中状态 child.active = true this.setData({ goodsAddition }) this.calculateGoodsPrice() }, /** * 组建立即购买信息 */ buliduBuyNowInfo: function(shoptype) { var shopCarMap = {}; shopCarMap.goodsId = this.data.goodsId; shopCarMap.pic = this.data.imageDomain + this.data.price.pic; shopCarMap.name = this.data.price.skuName; shopCarMap.price = this.data.price.priceSale; shopCarMap.left = ""; shopCarMap.active = true; shopCarMap.number = this.data.buyNumber; var buyNowInfo = {}; buyNowInfo.shopNum = 0; buyNowInfo.shopList = [shopCarMap]; return buyNowInfo; }, onShareAppMessage() { let _data = { title: this.data.goodsDetail.basicInfo.name, path: '/packageCps/pages/goods-details/cps-jd?id=' + this.data.goodsId + '&inviter_id=' + wx.getStorageSync('uid'), success: function(res) { // 转发成功 }, fail: function(res) { // 转发失败 } } if (this.data.kjJoinUid) { _data.title = this.data.curKanjiaprogress.joiner.nick + '邀请您帮TA砍价' _data.path += '&kjJoinUid=' + this.data.kjJoinUid } return _data }, reputation: function(goodsId) { var that = this; WXAPI.goodsReputation({ goodsId: goodsId }).then(function(res) { if (res.code == 0) { res.data.forEach(ele => { if (ele.goods.goodReputation == 0) { ele.goods.goodReputation = 1 } else if (ele.goods.goodReputation == 1) { ele.goods.goodReputation = 3 } else if (ele.goods.goodReputation == 2) { ele.goods.goodReputation = 5 } }) that.setData({ reputation: res.data }); } }) }, pingtuanList: function(goodsId) { var that = this; WXAPI.pingtuanList({ goodsId: goodsId, status: 0 }).then(function(res) { if (res.code == 0) { that.setData({ pingtuanList: res.data.result }); } }) }, getVideoSrc: function(videoId) { var that = this; WXAPI.videoDetail(videoId).then(function(res) { if (res.code == 0) { that.setData({ videoMp4Src: res.data.fdMp4 }); } }) }, joinKanjia(){ AUTH.checkHasLogined().then(isLogined => { if (isLogined) { this.doneJoinKanjia(); } else { this.setData({ wxlogin: false }) } }) }, doneJoinKanjia: function() { // 报名参加砍价活动 const _this = this; if (!_this.data.curGoodsKanjia) { return; } wx.showLoading({ title: '加载中', mask: true }) WXAPI.kanjiaJoin(wx.getStorageSync('token'), _this.data.curGoodsKanjia.id).then(function(res) { wx.hideLoading() if (res.code == 0) { _this.setData({ kjJoinUid: wx.getStorageSync('uid'), myHelpDetail: null }) _this.getGoodsDetailAndKanjieInfo(_this.data.goodsDetail.basicInfo.id) } else { wx.showToast({ title: res.msg, icon: 'none' }) } }) }, joinPingtuan: function(e) { let pingtuanopenid = e.currentTarget.dataset.pingtuanopenid wx.navigateTo({ url: "/pages/to-pay-order/index?orderType=buyNow&pingtuanOpenId=" + pingtuanopenid }) }, goIndex() { wx.switchTab({ url: '/pages/index/index', }); }, helpKanjia() { const _this = this; AUTH.checkHasLogined().then(isLogined => { _this.setData({ wxlogin: isLogined }) if (isLogined) { _this.helpKanjiaDone() } }) }, helpKanjiaDone(){ const _this = this; WXAPI.kanjiaHelp(wx.getStorageSync('token'), _this.data.kjId, _this.data.kjJoinUid, '').then(function (res) { if (res.code != 0) { wx.showToast({ title: res.msg, icon: 'none' }) return; } _this.setData({ myHelpDetail: res.data }); wx.showModal({ title: '成功', content: '成功帮TA砍掉 ' + res.data.cutPrice + ' 元', showCancel: false }) _this.getGoodsDetailAndKanjieInfo(_this.data.goodsDetail.basicInfo.id) }) }, cancelLogin() { this.setData({ wxlogin: true }) }, closePop(){ this.setData({ posterShow: false }) }, async drawSharePic() { const _this = this const qrcodeRes = await WXAPI.wxaQrcode({ scene: _this.data.goodsId + ',' + wx.getStorageSync('uid'), page: '/packageCps/pages/goods-details/cps-jd', is_hyaline: true, autoColor: true, expireHours: 1 }) if (qrcodeRes.code != 0) { wx.showToast({ title: qrcodeRes.msg, icon: 'none' }) return } const qrcode = qrcodeRes.data const pic = _this.data.goodsDetail.basicInfo.pic wx.getImageInfo({ src: pic, success(res) { const height = 490 * res.height / res.width _this.drawSharePicDone(height, qrcode) }, fail(e) { console.error(e) } }) }, drawSharePicDone(picHeight, qrcode) { const _this = this const _baseHeight = 74 + (picHeight + 120) this.setData({ posterConfig: { width: 750, height: picHeight + 660, backgroundColor: '#fff', debug: false, blocks: [ { x: 76, y: 74, width: 604, height: picHeight + 120, borderWidth: 2, borderColor: '#c2aa85', borderRadius: 8 } ], images: [ { x: 133, y: 133, url: _this.data.goodsDetail.basicInfo.pic, // 商品图片 width: 490, height: picHeight }, { x: 76, y: _baseHeight + 199, url: qrcode, // 二维码 width: 222, height: 222 } ], texts: [ { x: 375, y: _baseHeight + 80, width: 650, lineNum:2, text: _this.data.goodsDetail.basicInfo.name, textAlign: 'center', fontSize: 40, color: '#333' }, { x: 375, y: _baseHeight + 180, text: '¥' + _this.data.goodsDetail.basicInfo.minPrice, textAlign: 'center', fontSize: 50, color: '#e64340' }, { x: 352, y: _baseHeight + 320, text: '长按识别小程序码', fontSize: 28, color: '#999' } ], } }, () => { Poster.create(); }); }, onPosterSuccess(e) { console.log('success:', e) this.setData({ posterImg: e.detail, showposterImg: true }) }, onPosterFail(e) { console.error('fail:', e) }, savePosterPic() { const _this = this wx.saveImageToPhotosAlbum({ filePath: this.data.posterImg, success: (res) => { wx.showModal({ content: '已保存到手机相册', showCancel: false, confirmText: '知道了', confirmColor: '#333' }) }, complete: () => { _this.setData({ showposterImg: false }) }, fail: (res) => { wx.showToast({ title: res.errMsg, icon: 'none', duration: 2000 }) } }) }, previewImage(e) { const url = e.currentTarget.dataset.url wx.previewImage({ current: url, // 当前显示图片的http链接 urls: [url] // 需要预览的图片http链接列表 }) }, onTabsChange(e) { var index = e.detail.index this.setData({ toView: this.data.tabs[index].view_id, tabclicked: true }) setTimeout(() => { this.setData({ tabclicked: false }) }, 1000); }, backToHome() { wx.switchTab({ url: '/pages/index/index', }) } })