From 91c06ed1bd7e8c19cb58863be206d5130bfabcac Mon Sep 17 00:00:00 2001 From: jiazhipeng Date: Thu, 21 Nov 2024 09:22:47 +0800 Subject: [PATCH] =?UTF-8?q?=E5=89=A7=E5=9C=BA=E6=BC=94=E5=87=BA?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- app.wxss | 13 + pages/info/showInfo/index.js | 786 ++++++++++++++++++++++++---- pages/info/showInfo/index.json | 4 +- pages/info/showInfo/index.wxml | 242 +++++++-- pages/info/showInfo/index.wxss | 918 +++++++++++++++++++++++++++++++-- pages/list/theatre/index.js | 53 +- pages/list/theatre/index.wxml | 7 +- pages/order/show/index.js | 158 +++++- pages/order/show/index.wxml | 59 ++- pages/order/show/index.wxss | 241 ++++++--- utils/https.js | 4 +- 11 files changed, 2175 insertions(+), 310 deletions(-) diff --git a/app.wxss b/app.wxss index 779e439..19c1009 100644 --- a/app.wxss +++ b/app.wxss @@ -144,6 +144,19 @@ page{ .no-scrollbar::-webkit-scrollbar{ display: none; } + +.flex-1{ + flex: 1; +} +.w-1rpx{ + width: 1rpx; +} +.h-1rpx{ + height: 1rpx; +} +.flex-shrink-0{ + flex-shrink: 0; +} /* page { filter: grayscale(100%); } */ \ No newline at end of file diff --git a/pages/info/showInfo/index.js b/pages/info/showInfo/index.js index ec51cf5..50f66d4 100644 --- a/pages/info/showInfo/index.js +++ b/pages/info/showInfo/index.js @@ -1,115 +1,709 @@ -// pages/info/showInfo/index.js +// pages/info/roadInfo/index.js +let device = wx.getSystemInfoSync(); +const ratio = device.windowWidth / 750; import commonApi from "../../../utils/https/common" +import QRCode from '../../../utils/weapp-qrcode.js' +import util from '../../../utils/util' let app = getApp() Page({ - /** - * 页面的初始数据 - */ - data: { - info:null, - retailId:'' - }, - - /** - * 生命周期函数--监听页面加载 - */ - onLoad: function (options) { - if(options.retailId){ - this.setData({ - retailId:options.retailId - }) - } - commonApi.user_post('product/get_product_detail',{ - id:options.id - }).then(res=>{ - res.data.display_tags = (res.data.display_tags?res.data.display_tags.split(","):[]).splice(0,2); - this.setData({ - info:res.data - }) - this.BroswerRecord() - }) - }, - BroswerRecord:function(){ - setTimeout(()=>{ - if(app.globalData.uuid){ - commonApi._post('browse/browse_record',{ - type:"goods", - title:this.data.info.title, - drive:"mini", - source_id:this.data.info.id, - url:"/pages/info/showInfo/index?id="+this.data.info.id, - uuid:app.globalData.uuid - }).then(res=>{ - }) - } - else { - this.BroswerRecord(); - } - },500) - }, - order:function(){ - if(this.data.info.sku.length==0){ - wx.showToast({ - title: '该演出暂时无法预约', - icon:'none' - }) - return; - } - app.globalData.retailId = this.data.retailId; - app.globalData.couponInfo = null; - app.globalData.product = this.data.info; - wx.navigateTo({ - url: '/pages/order/show/index?id='+this.data.id, - }) - }, + /** + * 页面的初始数据 + */ + data: { + autoPlay: true, + fixed: false, + type: 1, + top: 0, + isLike: 0, + commentTotal: 0, + comment: [], + info: null, + skuFlag: null, + producNum: 1, + skuIndex: 0, + aniSkuIndex: -1, + retailId: "", + cartTop: 0, + cartImgInfo: null, + cartCount: 0, + shareImg: null, + showShareFlag: false, + allowance_data: null, + showAllowance: false, + tjList: [], //推荐商品列表 + iShop: false, + supplierId: null, + showQrCode: false, + wxqrcode: null, + + showDetail: false + }, + + /** + * 生命周期函数--监听页面加载 + */ + onLoad: function (options) { + //删除临时存储的联系人 + wx.removeStorageSync('linkMan') + let rect = wx.getMenuButtonBoundingClientRect(), + that = this; + let height = (rect.top - device.statusBarHeight) * 2 + rect.height + device.statusBarHeight; + this.setData({ + top: height, + id: options.id + }) + // 获取购物车按钮的位置 + wx.createSelectorQuery().select('#cart').boundingClientRect(function (res) { + console.log(res) + that.setData({ + cartTop: res.top + }) + }).exec() + + if (options.retailId) { + this.setData({ + retailId: options.retailId + }) + } + commonApi._post("product/get_product_detail", { + id: options.id + }).then(res => { + res.data.display_tags = (res.data.display_tags ? res.data.display_tags.split(",") : []).splice(0, 2); + if (options.skuid) { + let sku = res.data.sku.find(item => item.id == options.skuid); + res.data.sku = [sku]; + } + res.data.flag = res.data.sku.find(item => item.flag == 'on') ? res.data.flag : 0 + let resData = res.data + this.setData({ + info: resData, + supplierId: res.data.supplier_id, + iShop: res.data.supplier_id ? true : false + }) + + this.BroswerRecord() + }) + + // 推荐 + commonApi._post("search/product_recommend", { + offset: 0, + limit: 6, + rand: true, + type: 'post', + product_ids:options.id, + }).then(res => { + try { + this.setData({ + tjList: res.data.list + }) + } catch (error) { + console.log(error); + } + }) + }, + changeAllowance: function () { + this.setData({ + showAllowance: !this.data.showAllowance + }) + }, + BroswerRecord: function () { + setTimeout(() => { + if (app.globalData.uuid) { + commonApi._post('browse/browse_record', { + type: "goods", + title: this.data.info.title, + drive: "mini", + source_id: this.data.info.id, + url: "/pages/info/postProductInfo/index?id=" + this.data.info.id, + uuid: app.globalData.uuid + }).then(res => {}) + } else { + this.BroswerRecord(); + } + }, 500) + }, + like: function () { + let id = this.data.id, + isLike = this.data.isLike; + commonApi.user_post("product/" + (isLike == 1 ? "product_cancel_collection" : "product_collection"), { + product_id: id + }).then(res => { + if (res.code == 1) { + this.setData({ + isLike: isLike == 1 ? 0 : 1 + }) + } + }) + }, + changeMenu: function (e) { + let index = e.currentTarget.dataset.index, + that = this; + const query = wx.createSelectorQuery(); //创建节点查询器 + query.select("#box" + index).boundingClientRect() //选择toViewid获取位置信息 + query.selectViewport().scrollOffset() //获取页面查询位置的 + query.exec(function (res) { + let scrollTop = res[0].top + res[1].scrollTop - 110 * ratio - that.data.top; + wx.pageScrollTo({ + scrollTop: scrollTop + 4, + duration: 0 + }) + that.setData({ + type: index + }) + }) + }, + onPageScroll: function (e) { + let that = this, + height = this.data.top; + let topHeight = height; + wx.createSelectorQuery().select('#menus').boundingClientRect(function (rect) { + if (rect.top <= topHeight) { + // 此时应该把menus固定在顶部 + that.setData({ + fixed: true + }) + } else { + that.setData({ + fixed: false + }) + } + // 滚动时判断滚动到哪个部分了 + const query = wx.createSelectorQuery(); //创建节点查询器 + query.select("#box1").boundingClientRect() //选择toViewid获取位置信息 + query.select("#box2").boundingClientRect() //选择toViewid获取位置信息 + query.select("#box3").boundingClientRect() //选择toViewid获取位置信息 + // query.select("#box4").boundingClientRect() //选择toViewid获取位置信息 + let minHeight = that.data.fixed ? (110 * ratio + height) : topHeight; + query.exec(function (res) { + try { + if (res[2].top < minHeight) { + that.setData({ + type: 3 + }) + }else if (res[1].top < minHeight) { + that.setData({ + type: 2 + }) + } else { + that.setData({ + type: 1 + }) + } + } catch(e) {} + + }) + }).exec() + + }, + showCart: function () { + commonApi.user_post('wx/get_user_keep', { + jumpurl: '/pages/info/postProductInfo/index?id=' + this.data.id, + title: this.data.info.title, + type: 'mini' + }).then(res => { + if (res.data.subscribe == 0) { + this.setData({ + wxqrcode: res.data.qrcode, + showQrCode: true + }) + } else { + if (this.data.info.sku.length == 0) { + wx.showToast({ + title: '该产品未设置规格，不能加购', + icon: 'none' + }) + return; + } + this.setData({ + skuFlag: "cart" + }) + let that = this + wx.createSelectorQuery().select('#skuImg').boundingClientRect(function (res) { + console.log(res) + that.setData({ + cartImgInfo: 'top:' + res.top + 'px;left:' + res.left + 'px;' + }) + }).exec() + } + }) + }, + hideSku: function () { + this.setData({ + skuFlag: null, + cartImgInfo: null + }) + }, + minus: function () { + if (this.data.producNum == 1) return; + this.setData({ + producNum: this.data.producNum - 1 + }) + }, + add: function () { + this.setData({ + producNum: this.data.producNum + 1 + }) + }, + selectSku: function (e) { + let index = e.currentTarget.dataset.index; + this.setData({ + skuIndex: index + }) + }, + showOrder: function () { + // if(this.data.info.sku.length==0){ + // wx.showToast({ + // title: '该演出暂时无法预约', + // icon:'none' + // }) + // return; + // } + app.globalData.couponInfo = null; + app.globalData.product = this.data.info; + app.globalData.retailId = this.data.retailId; + + wx.navigateTo({ + url: '/pages/order/show/index?id='+this.data.id, + }) + }, + order: function () { + app.globalData.postProduct = [] + app.globalData.list = [] + commonApi.user_post("/product/checkStock", { + sku_id: this.data.info.sku[this.data.skuIndex].id, + }).then(res => { + if (res && res.code != 1) { + return; + } else { + if (this.data.skuFlag == 'order') { + wx.setStorageSync('login_from', 'product_order_login') + wx.setStorageSync('order_from', 'product_order_submit') + app.globalData.couponInfo = null; + // 购买 + let product = [{ + product: this.data.info, + sku: this.data.info.sku[this.data.skuIndex], + productNum: this.data.producNum + }]; + app.globalData.postProduct = product; + app.globalData.retailId = this.data.retailId; + app.globalData.listName = null + + if (this.data.info.is_package) { + app.globalData.product = product[0]; + wx.navigateTo({ + url: '/pages/order/WineSceneOrder/index', + }) + + } else { + wx.navigateTo({ + url: '/pages/order/postOrder/index', + }) + } - /** - * 生命周期函数--监听页面初次渲染完成 - */ - onReady: function () { - }, + + } else { + let tag_id = this.data.info.tag_id,type = '' + if (tag_id.includes(20) || tag_id.includes(19)) { //文创 + type = '1' + }else if (tag_id.includes(5)) { //非遗 + type = '2' + }else { + type = '' + } + commonApi.user_post("cart/add_sku", { + sku_id: this.data.info.sku[this.data.skuIndex].id, + num: this.data.producNum, + type:type + }).then(res => { + if (res.code == 1) { + commonApi.user_post('cart/get_list', {}).then(res => { + this.setData({ + cartCount: res.data.length + }) + }) + // 加动效 + this.setData({ + skuFlag: null, + aniSkuIndex: this.data.skuIndex, + cartImgInfo: null + }) + setTimeout(() => { + this.setData({ + aniSkuIndex: -1 + }) + wx.showModal({ + title: "提示", + content: "去购物车结算？", + success: function (res) { + if (res.confirm) { + wx.navigateTo({ + url: '/pages/user/cartlist/list', + }) + } + } + }) + }, 650) + } + }) + } + } + }) + + }, + // 分享 + share: function () { + if (!wx.getStorageSync("jstrip_token")) { + commonApi.user_post("user/getMyInfo", {}).then(res => { - /** - * 生命周期函数--监听页面显示 - */ - onShow: function () { + }) + return; + } + if (!this.data.shareImg) { + wx.showToast({ + title: '图片生成中，稍后再试', + icon: 'none' + }) + return; + } + this.setData({ + showShareFlag: !this.data.showShareFlag + }) + }, + // 保存 + save() { + let url = this.data.shareImg, + that = this; + wx.authorize({ + /* 这个就是保存相册的 */ + scope: 'scope.writePhotosAlbum', + success() { + wx.saveImageToPhotosAlbum({ + filePath: url, + success(res) { + wx.showToast({ + title: '保存成功', + icon: "success" + }) + that.setData({ + showShareFlag: !this.data.showShareFlag + }) + }, + fail(res) { + wx.showToast({ + title: '保存失败', + icon: 'none' + }) + } + }) + }, + complete(res) { + console.log(res); + /* 这里判断一下如果没有授权重新打开设置选项 */ + wx.getSetting({ + success(res) { + if (!res.authSetting['scope.writePhotosAlbum']) { + /* 打开设置的方法 */ + // opensit(); + wx.showToast({ + title: '请打开权限后再试', + icon: 'none' + }) + } + } + }); + } + }); - }, + }, - /** - * 生命周期函数--监听页面隐藏 - */ - onHide: function () { + // 绘制海报 + drawImg: function () { + var that = this, + userinfo = wx.getStorageSync('jstrip_userInfo'); + if (!userinfo) { + // 去登录 + return false; + } + const ctx = wx.createCanvasContext('imageCanvas'); + // const device = wx.getSystemInfoSync(); + // const ratio = device.screenWidth / 750; - }, + // 先获取到图片信息 + let promise2 = new Promise(function (resolve, reject) { + wx.getImageInfo({ + src: that.data.info.headimg, + success: function (res) { + resolve(res); + }, + fail: function (res) { + reject(res); + } + }) + }) + let promise3 = new Promise(function (resolve, reject) { + let userid = wx.getStorageSync('jstrip_userid') + new QRCode('myQrcode', { + text: 'https://m.cloud.sz-trip.com/MailMerchandiseDetail?id=' + that.data.info.id + '&sharedUserId=' + userid + '&channel=-1', + width: 500, + height: 500, + padding: 12, // 生成二维码四周自动留边宽度，不传入默认为0 + correctLevel: QRCode.CorrectLevel.H, // 二维码可辨识度 + callback: (res) => { + resolve(res); + } + }) + }) + //成功得到图片信息后，开始绘图 + Promise.all([promise2, promise3]).then(imgs => { + ctx.save(); + ctx.beginPath(); //开始绘制 + that.handleBorderRect(ctx, 0, 0, 551 * ratio, 407 * ratio, 25 * ratio, '#ccc') + ctx.clip(); //画好了圆 剪切 原始画布中剪切任意形状和尺寸。一旦剪切了某个区域，则所有之后的绘图都会被限制在被剪切的区域内 这也是我们要save上下文的原因 + ctx.drawImage(imgs[0].path, 0, 0, 551 * ratio, 407 * ratio); + ctx.restore(); + ctx.save(); + that.handleBorderRect2(ctx, 0, 407 * ratio, 551 * ratio, 236 * ratio, 25 * ratio, '#fff') + ctx.restore(); + // 绘制二维码 + ctx.drawImage(imgs[1].path, 373 * ratio, 495 * ratio, 137 * ratio, 137 * ratio); + // 开始文字绘制 + ctx.setFillStyle("#000"); + ctx.setFontSize(30 * ratio); //字大小 + ctx.setTextAlign('left'); //是否居中显示，参考点画布中线 + that.drawText(ctx, that.data.info.title, 25 * ratio, 450 * ratio, 480 * ratio, ratio); + // 售价 + ctx.setFillStyle("#D62828"); + ctx.setFontSize(40 * ratio); //字大小 + ctx.setTextAlign('left'); //是否居中显示，参考点画布中线 + let price = "￥" + (that.data.info.price / 100); + let width = ctx.measureText(price).width; + ctx.fillText(price, 25 * ratio, 620 * ratio); + // 副标题 + ctx.setFillStyle("#999999"); + ctx.setFontSize(28 * ratio); //字大小 + ctx.setTextAlign('left'); //是否居中显示，参考点画布中线 + let subtitle = that.data.info.subtitle; + if (that.data.info.subtitle.length > 10) { + subtitle = that.data.info.subtitle.substr(0, 10) + '...' + } + ctx.fillText(subtitle, 25 * ratio, 540 * ratio); + // ctx.draw(); + // 划线价 + ctx.setFillStyle("#999999"); + ctx.setFontSize(32 * ratio); //字大小 + ctx.setTextAlign('left'); //是否居中显示，参考点画布中线 + let market_price = "￥" + (that.data.info.market_price / 100) + ctx.fillText(market_price, 40 * ratio + width, 620 * ratio); + let market_price_width = ctx.measureText(market_price).width; + // 划线 + ctx.beginPath() + ctx.setLineWidth(1) + ctx.moveTo(40 * ratio + width, 608 * ratio) + ctx.lineTo(45 * ratio + width + market_price_width, 608 * ratio) + ctx.stroke(); + // 长按识别二维码 + // ctx.setFillStyle("#666"); + // ctx.setFontSize(22 * ratio); //字大小 + // ctx.setTextAlign('left'); //是否居中显示，参考点画布中线 + // ctx.fillText("长按识别二维码", 404*ratio, 710*ratio); + // 长按图片转发或保存 + // ctx.setFillStyle("#000"); + // ctx.setFontSize(24 * ratio); //字大小 + // ctx.setTextAlign('left'); //是否居中显示，参考点画布中线 + // ctx.fillText("长按图片保存到本地",(592*ratio - ctx.measureText("长按图片保存到本地").width)/2, 740*ratio); + ctx.draw(); + // 转为图片 + setTimeout(() => { + wx.canvasToTempFilePath({ + x: 0, + y: 0, + canvasId: 'imageCanvas', + success: function (res) { + that.setData({ + shareImg: res.tempFilePath + }) + }, + fail(err) { + console.log('agdgjgdajhg', err) + } + }) + }, 500) + return false; + }).catch(err => { + console.log("this err", err) + }) + }, + // 圆角矩形 + handleBorderRect(ctx, x, y, w, h, r, color) { + ctx.beginPath(); + ctx.moveTo(x + w, y + h); + ctx.lineTo(x, y + h) + // 左上角 + ctx.arc(x + r, y + r, r, Math.PI, 1.5 * Math.PI); + ctx.moveTo(x + r, y); + ctx.lineTo(x + w - r, y); + ctx.lineTo(x + w, y + r); + // 右上角 + ctx.arc(x + w - r, y + r, r, 1.5 * Math.PI, 2 * Math.PI); + ctx.lineTo(x + w, y + h); + ctx.lineTo(x + w - r, y + h); + ctx.fillStyle = color; + ctx.fill(); + ctx.closePath(); + }, + handleBorderRect2(ctx, x, y, w, h, r, color) { + ctx.beginPath(); + ctx.moveTo(x, y); + ctx.lineTo(x + w, y) + // 右下角 + ctx.arc(x + w - r, y + h - r, r, 0, 0.5 * Math.PI); + ctx.lineTo(x + r, y + h); + ctx.lineTo(x, y + h - r); + // 左下角 + ctx.arc(x + r, y + h - r, r, 0.5 * Math.PI, Math.PI); + ctx.lineTo(x, y); + ctx.lineTo(x, y); + ctx.fillStyle = color; + ctx.fill(); + ctx.closePath(); + }, + // 绘制两行文字 + drawText: function (ctx, str, x, y, canvasWidth, ratio) { + let row = [], + temp = "", + chr = str.split(""); + for (var a = 0; a < chr.length; a++) { + if (ctx.measureText(temp).width < canvasWidth) { + temp += chr[a]; + } else { + a--; //这里添加了a-- 是为了防止字符丢失，效果图中有对比 + row.push(temp); + temp = ""; + } + } + row.push(temp); - /** - * 生命周期函数--监听页面卸载 - */ - onUnload: function () { + //如果数组长度大于2 则截取前两个 + if (row.length > 2) { + var rowCut = row.slice(0, 2); + var rowPart = rowCut[1]; + var test = ""; + var empty = []; + for (var a = 0; a < rowPart.length; a++) { + if (ctx.measureText(test).width < canvasWidth - 30 * ratio) { + test += rowPart[a]; + } else { + break; + } + } + empty.push(test); + var group = empty[0] + "..." //这里只显示两行，超出的用...表示 + rowCut.splice(1, 1, group); + row = rowCut; + } + for (var b = 0; b < row.length; b++) { + ctx.fillText(row[b], x, y + b * 40 * ratio, canvasWidth); + } + }, + gotoDetail: function (e) { + let item = e.currentTarget.dataset.item; + if (item.type == 'travels') { + // 游记做特殊处理 其他都按照原来的来 + wx.navigateTo({ + url: '/pages/info/strategyInfo/index?id=' + item.s_id, + }) + } else { + util.gotoDetail(item); + } + }, - }, + gotolocation: function () { + let info = this.data.info; + wx.openLocation({ + latitude: Number(info.scene_lat), + longitude: Number(info.scene_lon), + name:info.scene_name, + address:info.scene_address + }) + }, - /** - * 页面相关事件处理函数--监听用户下拉动作 - */ - onPullDownRefresh: function () { + // 演出详情展开收起 + changeShowDetail: function (e) { + let showDetail = e.currentTarget.dataset.flag; + this.setData({showDetail: showDetail}) + }, - }, + /** + * 生命周期函数--监听页面初次渲染完成 + */ + onReady: function () { - /** - * 页面上拉触底事件的处理函数 - */ - onReachBottom: function () { + }, - }, + /** + * 生命周期函数--监听页面显示 + */ + onShow: function () { + app.globalData.postProduct = [] + if (!wx.getStorageSync('jstrip_token')) { + return; + } + if (this.data.info && this.data.info.id) { + commonApi.user_post("product/is_product_collection", { + product_id: this.data.info.id + }).then(res => { + this.setData({ + isLike: res.data + }) + this.drawImg() + }) + commonApi.user_post('cart/get_list', {}).then(res => { + this.setData({ + cartCount: res.data.length + }) + }) + } else { + setTimeout(() => { + this.onShow() + }, 200) + } + }, - /** - * 用户点击右上角分享 - */ - onShareAppMessage: function () { + /** + * 生命周期函数--监听页面隐藏 + */ + onHide: function () { - } + }, + + /** + * 生命周期函数--监听页面卸载 + */ + onUnload: function () { + + }, + + /** + * 页面相关事件处理函数--监听用户下拉动作 + */ + onPullDownRefresh: function () { + + }, + + /** + * 页面上拉触底事件的处理函数 + */ + onReachBottom: function () { + + }, + + /** + * 用户点击右上角分享 + */ + onShareAppMessage: function () { + + } }) \ No newline at end of file diff --git a/pages/info/showInfo/index.json b/pages/info/showInfo/index.json index 35cf02f..ab4ec76 100644 --- a/pages/info/showInfo/index.json +++ b/pages/info/showInfo/index.json @@ -1,5 +1,7 @@ { "usingComponents": { - "title":"/pages/component/TitleHeader" + "title":"/pages/component/TitleHeader", + "code":"../../order/components/wxqrCode/index" + } } \ No newline at end of file diff --git a/pages/info/showInfo/index.wxml b/pages/info/showInfo/index.wxml index 28f7ff5..2a0d0f9 100644 --- a/pages/info/showInfo/index.wxml +++ b/pages/info/showInfo/index.wxml @@ -1,32 +1,216 @@ - + - + + + - - - - - - - - - {{info.title}} - - {{item}} - - 演出时间：{{item}} - {{info.scene_name}} - {{info.scene_address}} - - -演出详情 - -预定须知 - - - + + + + + {{info.title}} + + {{item}} + + + 演出时间：{{item}} + + + + ￥{{info.price/100}}起 + + + + + + + + + + + {{info.scene_name}} + {{info.scene_address}} + + + + 25.5km + + + + + + 不支持退款 + 不支持退款 + + 不支持退款 + + + + + + + + + + 详情 + 须知 + 推荐 + + + + + + + 演出详情 + + + 123 + + + 展开全部 + 收起 + + + + 演出须知 + + + + 观看提示 + + + + + 推荐演出 + + + + + + + {{item.title}} + + {{item.price/100}} + + + + + + + + + + + + + + - 立即预约 - 该商品已下架 - \ No newline at end of file + + + + + 首页 + + + + + 客服 + + + + 收藏 + + + + + + + 立即购买 + + + + + + + + {{cartCount}} + + + + + + + + + + + {{info.sku[skuIndex].price/100}} + + 补贴价：￥{{ (1 - allowance_data.discount_rate / 100) * info.sku[skuIndex].price / 100 }} + + 已选择：{{info.sku[skuIndex].sku_name}} + + + + {{item.sku_name}} + + + 数量 + + {{producNum}} + + + + + {{skuFlag=='cart'?'确认':'立即购买'}} + + 该商品已下架 + + + + + + + + + + + + + + + + + + + + {{allowance_data.title}} + + + + + \ No newline at end of file diff --git a/pages/info/showInfo/index.wxss b/pages/info/showInfo/index.wxss index f6bdada..284b0b5 100644 --- a/pages/info/showInfo/index.wxss +++ b/pages/info/showInfo/index.wxss @@ -1,86 +1,898 @@ -/* pages/info/showInfo/index.wxss */ +/* pages/info/hotelProductInfo/index.wxss */ page { - background: #f6f6f6; + background: white; } -.swiper,.swiper image { - display: block; - width: 100%; - height: 330rpx; + + +.top-info { + background: white; + margin-top: -20rpx; + padding: 48rpx 28rpx 28rpx; } -.top-box { - border-bottom: 1rpx solid #ccc; - padding: 22rpx 27rpx; + + +.product-base-info{ + display: flex; } -.top-box .title { - font-size: 32rpx; - color: #000; - font-weight: 500; - margin-bottom: 10rpx; +.product-base-info .headImg{ + width: 187rpx; + height: 240rpx; + background: #D1D7CB; + border-radius: 13rpx; + margin-right: 20rpx; + flex-shrink: 0; +} + +.product-base-info .title { +font-family: PingFang SC; +font-weight: bold; +font-size: 32rpx; +color: #111111; } -.top-box .tags { + +.product-base-info .subtitle { + margin-top: 20rpx; + font-weight: 500; + font-size: 27rpx; + color: #888888; +} +.base-info{ +flex: 1; +width: 1rpx; +display: flex; +flex-direction: column; +justify-content: space-between; +} +.product-base-info .tags-box { + margin-top: 18rpx; display: flex; - color: #0B898E; - font-size: 20rpx; - margin-bottom: 20rpx; + align-items: center; + height: 50rpx; + overflow-y: hidden; + overflow-x: auto; } -.top-box .tag { - margin-right: 20rpx; - padding: 0 15rpx; - line-height: 30rpx; - border-radius: 16rpx; - border: 1rpx solid; + +.tags-box .tag { + font-weight: 500; + font-size: 24rpx; + color: #0B898E; + padding: 7rpx 16rpx; + background: #E6F3F3; + border-radius: 19rpx; + margin-right: 13rpx; } -.top-box .time { - font-size: 27rpx; - color: #333; - padding-bottom: 20rpx; - border-bottom: 1rpx solid #ccc; + +.tags-box .tag .line { + content: "1"; + display: block; + font-size: 0; + position: absolute; + left: 0; + right: 0; + background: #DAF3E9; + height: 8rpx; + top: 30rpx; + z-index: -1; } -.show-location { - margin: 20rpx 0; - font-size: 28rpx; - color: #666; + +.bottom-price { + flex: 1; + height: 1rpx; + color: #E52910; + display: flex; + flex-direction: column; + justify-content: flex-end; +} + +.tags-price text:nth-child(1) { + font-size: 21rpx; } -.show-address { + +.tags-price text:nth-child(2) { + font-size: 37rpx; + font-weight: bold; +} + +.tags-price text:nth-child(3) { + font-size: 21rpx; color: #999999; + margin-left: 4rpx; +} + +.tags-box .iconfont { + margin-left: 4rpx; font-size: 24rpx; - margin-bottom: 10rpx; } -.show-location .iconfont { - font-size: 26rpx; - margin-right: 10rpx; + +.address-info{ + margin-top: 26rpx; + padding-top: 15rpx; + border-top: 1px solid #D8D8D8; } -.all-title { - margin: 27rpx; + +.map-container{ + width: 100%; + display: flex; + justify-content: space-between; + font-family: PingFang SC; + font-weight: 500; + font-size: 24rpx; + color: #888; + box-sizing: border-box; +} +.map-container image{ + width: 53rpx; + height: 53rpx; +} + +.show-tip{ + margin-top: 27rpx; + width: 100%; + box-sizing: border-box; + height: 80rpx; + background: #E6F3F3; + border-radius: 13rpx; + padding: 0 26rpx; + display: flex; + align-items: center; + justify-content: space-between; + + + font-weight: 500; + font-size: 24rpx; + color: #111111; +} + +.show-tip image{ + width: 26rpx; + height: 26rpx; + margin-right: 12rpx; +} + +.scroll-all-box { + margin: 20rpx 0; + background: white; + } + + .scroll-menus { + padding: 0 107rpx; + display: flex; + justify-content: space-between; + align-items: center; + font-size: 29rpx; + color: #333; + height: 84rpx; + } + + .scroll-menu-item { + position: relative; + line-height: 84rpx; + } + .scroll-menu-item.active{ + color: #0B898E; + } + + .scroll-menu-item.active::after { + content: "1"; + font-size: 0; + display: block; + position: absolute; + width: 46rpx; + height: 6rpx; + border-radius: 3rpx; + background: #0B898E; + left: 50%; + margin-left: -23rpx; + bottom: 0rpx; + } + + .fixed-menus { + position: fixed; + left: 0; + right: 0; + background: white; + z-index: 1; + } + + .content-text{ + padding: 0 40rpx; + } + .info-box { + padding: 30rpx 0rpx 39rpx; + } + .info-box-line{ + border-bottom: 1px solid #D8D8D8; + } + .info-title { + font-size: 35rpx; + font-weight: bold; + color: #000; + margin-bottom: 30rpx; + } + #box1{ + margin-top: 40rpx; + } + +.max-details{ + position: relative; + max-height: 650rpx; + overflow: hidden; +} +.white-placholder{ + position: absolute; + left: 0; + right: 0; + bottom: 0; + height: 333rpx; + background-image: linear-gradient(to bottom, transparent, #fff); +} +.show-btn{ + padding-top: 30rpx; + display: flex; + align-items: center; + justify-content: flex-end; + padding-right: 70rpx; +} +.show-btn view{ + width: 158rpx; + height: 44rpx; + border-radius: 22rpx; + border: 1px solid #0B898E; +font-weight: 500; +font-size: 28rpx; +color: #0B898E; +text-align: center; +line-height: 44rpx; +margin-right: 29rpx; +} + +.box { + /* margin: 20rpx; */ + /* background: white; */ + /* border-radius: 13rpx; */ + background: #f2f2f2; + padding: 20rpx; +} + +.box-top { + line-height: 95rpx; + border-bottom: 1rpx solid #d9d9d9; font-weight: 500; + color: #000; font-size: 35rpx; + padding: 0 20rpx; + background: #fff; + border-radius: 13rpx 13rpx 0 0; } -.detail { - padding: 0 27rpx; - display: block; + +.box-top .iconfont { + color: #0B898E; + font-size: 33rpx; + margin-right: 16rpx; } + +.empty-box { + text-align: center; + padding: 40rpx 0; + font-size: 23rpx; + color: #333; + background: #fff; + border-radius: 0 0 13rpx 13rpx; +} + +.empty-btn { + margin: 0 auto; + margin-top: 30rpx; + width: 283rpx; + line-height: 79rpx; + border: 1rpx solid #0B898E; + border-radius: 39rpx; + color: #0B898E; + font-size: 32rpx; + margin-bottom: 10rpx; +} + +.box-top .score { + color: #D62828; + font-size: 30rpx; + font-weight: 400; + margin-left: 11rpx; +} + + .fixed-bottom { position: fixed; left: 0; right: 0; - height: 104rpx; - background: #FFFFFF; - box-shadow: -1rpx 1rpx 16rpx 0px rgba(6, 0, 1, 0.1); + bottom: 0; + height: 140rpx; + background: white; + display: flex; + align-items: center; + box-shadow: 0px 0px 16rpx 0px rgba(6, 0, 1, 0.1); + padding: 0 40rpx; + color: #666666; + font-size: 23rpx; + justify-content: space-between; + text-align: center; + padding-left: 0; +} + +.fixed-bottom .iconfont { + font-size: 34rpx; + line-height: 40rpx; +} + +.btns { + color: #fff; + font-size: 32rpx; + font-weight: 500; + border-radius: 39rpx; text-align: center; display: flex; + align-items: center; justify-content: center; +} + +.btns .btn { + width: 240rpx; + line-height: 78rpx; + background: #D62828; + border-radius: 39rpx; +} +/* +.btns .btn:nth-child(1) { + margin-right: 3rpx; + border-radius: 39rpx 0 0 39rpx; +} + +.btns .btn:nth-child(2) { + border-radius: 0 39rpx 39rpx 0; +} */ + +.btns .btn.disable { + background: #ccc; +} + +.mask-content { + position: absolute; + left: 0; + right: 0; + bottom: 0; + width: 100%; +} + +.mask-content .icon-close { + position: absolute; + right: 40rpx; + top: 40rpx; +} + +.sku-info-box { + margin: 50rpx 40rpx; + display: flex; + justify-content: space-between; +} + +.sku-info-box image { + width: 218rpx; + height: 180rpx; + border-radius: 13rpx; + display: block; + margin-right: 40rpx; + flex-shrink: 0; +} + +.sku-info { + flex: 1; +} + +.sku-price { + font-size: 40rpx; + font-weight: 500; + color: #D62828; + margin: 20rpx 0; + display: flex; + justify-content: flex-start; + align-items: center; +} + +.sku-price::before { + content: "￥"; + font-weight: 400; + font-size: 27rpx; + vertical-align: baseline; +} + +.sku-price view { + font-size: 24rpx; + color: #FFFFFF; + background-color: #D62828; + border-radius: 22rpx; + line-height: 44rpx; + margin-left: 7rpx; + padding: 0 20rpx; +} + +.sku-name { + font-size: 27rpx; + color: #666666; +} + +.sku-names { + display: flex; + font-size: 29rpx; + color: #333; + margin: 0 40rpx; + text-align: center; + flex-wrap: wrap; + margin-bottom: 20rpx; + justify-content: space-between; +} + +.sku-name-item { + background: #EFEFEF; + border: 1rpx solid #EFEFEF; + /* width: 318rpx; */ + line-height: 77rpx; + border-radius: 14rpx; + margin-bottom: 25rpx; + margin-right: 30rpx; + max-width: 100%; + padding: 0 15rpx; + min-width: 270rpx; +} + +.sku-name-item:nth-child(2n) { + margin-right: 0; +} + +.sku-name-item.active { + color: #0B898E; + border-color: #0B898E; + background: rgba(11, 137, 142, 0.1); +} + +.number-box { + display: flex; + align-items: center; + border-top: 1rpx solid #ccc; + justify-content: space-between; + margin: 0 40rpx; + padding: 40rpx 0; +} + +.number-box text { + flex: 1; + font-size: 29rpx; + color: #333; +} + +.number-box view { + border: 1rpx solid #666; + border-radius: 7rpx; + text-align: center; + width: 67rpx; + line-height: 67rpx; + font-size: 33rpx; + color: #000; +} + +.number-box view.disable { + border-color: #ccc; + color: #999; +} + +.number-box view.number { + width: 94rpx; + margin: 0 15rpx; +} + +.btn-box { + height: 138rpx; + background: #FFFFFF; + box-shadow: 0px 0px 16rpx 0px rgba(6, 0, 1, 0.1); + display: flex; align-items: center; + justify-content: center; + position: fixed; + left: 0; + right: 0; bottom: 0; } -.fixed-bottom .btn { - width: 391rpx; - line-height: 74rpx; + +.mask-btn { + width: 670rpx; + line-height: 78rpx; background: #D62828; - border-radius: 37rpx; + border-radius: 39rpx; color: #fff; - font-size: 31rpx; + text-align: center; + font-size: 33rpx; font-weight: 500; } -.fixed-bottom .btn.disable { + +.mask-btn.disable { background: #ccc; -} \ No newline at end of file +} + +/* .icon-xin,.icon-shoucang { + position: absolute; + right: 20rpx; + margin-top: 20rpx; + width: 60rpx; + line-height: 60rpx; + background: rgba(0, 0, 0, 0.4); + border-radius: 50%; + text-align: center; + color: #fff; + font-size: 36rpx; + z-index: 1; +} */ +.icon-fenxiang { + position: absolute; + right: 20rpx; + margin-top: 20rpx; + width: 60rpx; + line-height: 60rpx; + background: rgba(0, 0, 0, 0.4); + border-radius: 50%; + text-align: center; + color: #fff; + font-size: 36rpx; + z-index: 1; +} + +.icon-shoucang { + color: #D62828; + font-size: 40rpx !important; + +} + +/* 购物车 */ +.cart-box { + position: fixed; + display: flex; + align-items: center; + justify-content: center; + width: 80rpx; + height: 80rpx; + background: #FFFFFF; + box-shadow: 0px 0px 20rpx 0px rgba(0, 0, 0, 0.2); + border-radius: 50%; + right: 20rpx; + bottom: 166rpx; +} + +.cart-box image { + display: block; + width: 49rpx; +} + +.cart-num { + width: 26rpx; + border: 1rpx solid; + border-radius: 50%; + line-height: 26rpx; + text-align: center; + font-size: 23rpx; + color: #D20000; + position: absolute; + right: -2rpx; + top: -5rpx; +} + + +.share-img-box { + /* width: 551rpx; */ + position: static; + background: none; + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; +} + +.share-img { + display: block; + width: 551rpx; +} + +.share-tips { + width: 426rpx; + height: 150rpx; + background: #FFFFFF; + border-radius: 25rpx; + margin-top: 25rpx; + display: flex; + align-items: center; + justify-content: space-between; + padding: 0 65rpx; + color: #999; + font-size: 24rpx; + text-align: center; + line-height: 40rpx; +} + +.share-tips .img { + display: block; + width: 55rpx; + margin: 0 auto; + margin-bottom: 4rpx; +} + +.tipimg { + position: absolute; + left: 50%; + margin-left: 16rpx; + width: 24rpx; + height: 24rpx; + background: #D62828; + border-radius: 50%; + display: flex; + align-items: center; + justify-content: center; + top: 34rpx; +} + +.tipimg image { + width: 21rpx; + display: block; + +} + +.save-btn { + width: 403rpx; + line-height: 77rpx; + background: #D62828; + border-radius: 39rpx; + text-align: center; + color: #fff; + font-size: 31rpx; + font-weight: 500; + margin-top: 50rpx; +} + +.allowance-box { + height: 113rpx; + background: url("https://sz-qd.oss-cn-hangzhou.aliyuncs.com/uploads/20220602/7762b9c4be5adac1f3d0ab5228569821.png"); + background-size: 100% auto; + background-repeat: no-repeat; + padding: 30rpx 30rpx 10rpx; + font-size: 24rpx; + color: #FFFFFF; + margin-top: -60rpx; + position: relative; + display: flex; + justify-content: start; + align-items: baseline; +} + +.allowance-box .com-price { + font-size: 30rpx; + color: #FFFFFF; +} + +.allowance-box .com-price:before { + font-size: 18rpx; + color: #FFFFFF; +} + +.allowance-box .com-price:after { + font-size: 18rpx; + color: #FFFFFF; +} + +.allowance-box .yellow { + color: #DF2115; + padding: 8rpx 14rpx; + background-color: #FDEDD4; + margin-left: 20rpx; + border-radius: 30rpx; +} + +.mask-allowance .mask-content { + margin: auto; + width: auto; + top: initial; + bottom: initial; + padding: 20rpx; + width: 80%; +} + +.mask-allowance .mask-content .rule-title { + text-align: center; + margin-bottom: 20rpx; +} +.imgs{ + width: 200rpx; + height: 200rpx; + margin: 10rpx; + border-radius: 8rpx; +} +.img-box{ + display: inline-block; + position: relative; +} +.all{ + color: #fff; + position:absolute; + bottom: 17rpx; + right: 10rpx; + width: 200rpx; + height: 200rpx; + border-radius: 8rpx; + background-color: rgba(0, 0, 0, .5); +} +.all view{ + text-align: center; +} +.all view:first-child{ + font-size: 45rpx; + margin-top: 40rpx; +} +.all view:last-child{ + margin-top: 10rpx; +} +.sku{ + margin-left: 10rpx; + color: #666; + font-size: 24rpx; + margin-top: 8rpx; +} +.proad{ + margin: 20rpx; +} +.proad-title{ + display: flex; + align-items: center; + justify-content: center; + margin-bottom: 16rpx; +} +.proad-title image{ + width: 292rpx; + height: 34rpx; +} +.pro-list{ + display: flex; + justify-content: space-between; + align-items: center; + flex-wrap: wrap; +} +.proitem{ + width: 213rpx; +} +.item-hd image{ + width: 213rpx; + height: 273rpx; + background: #D1D7CB; + border-radius: 13rpx; +} +.item-bm{ + padding: 8rpx 12rpx; +} +.protitle{ + +font-family: PingFang SC; +font-weight: 500; +font-size: 29rpx; +color: #111111; + +} +.pro-price{ + color: #E52910; + font-weight: 500; + font-size: 30rpx; +} +.pro-price:before { + display: inline-block; + content:"￥"; + color: #E52910; + font-size: 20rpx; +} + +.pro-price:after { + display: inline-block; + content:'起'; + color: #999999; + font-size: 10px; +} +.icon-shop{ + width: 34rpx; + height: 36rpx; +} +.left-img{ + display: flex; + width: 290rpx; + flex-shrink: 0; + justify-content: space-between; + padding: 0 40rpx; + box-sizing: border-box; +} +.no-shop{ + width: 230rpx; +} +.shop-box{ + display:flex; + flex-direction: column; + align-items: center; + justify-content: space-between; + height: 70rpx; +} + + .wineScene-price-container { + width: 750rpx; + height: 100rpx; + background: linear-gradient(-90deg,#FF413B, #FFAB2E); + border-radius: 20rpx 20rpx 0rpx 0rpx; + display: flex; + align-items: center; + justify-content: space-between; + padding: 0 26rpx; + box-sizing: border-box; + color: #FFFFFF; + font-size: 24rpx; + } + + .wineScene-price-container .wineSecne-price { + font-weight: bold; + font-size: 36rpx; + color: #FFFFFF; +} +.wineScene-price-container .wineSecne-money { + font-size: 24rpx; + font-weight: 500; + text-decoration-line: line-through; + padding-left: 14rpx; +} +.wineScene-price-container .wineSecne-price::before { + font-size: 24rpx; + content: '￥'; +} + +.hotel-custom-detail{ + display: flex; + /* justify-content: space-between; */ + height: fit-content; + font-family: PingFang SC; + font-weight: 500; + font-size: 24rpx; + color: #666666; + margin-bottom: 20rpx; +} +.hotel-custom-detail .tip-info{ + width: 33rpx; + position: relative; + display: flex; + justify-content: center; + flex-shrink: 0; +} +.hotel-custom-detail .tip-info .tip{ + font-family: PingFang SC; + font-weight: 500; + font-size: 23rpx; + color: #FFFFFF; + width: 33rpx; + height: 33rpx; + background: #6394FD; + border-radius: 50%; + position: absolute; + top: 0; + left: 0; + text-align: center; + line-height: 33rpx; +} +.hotel-custom-detail .tip-info .info{ + width: 11rpx; + height: 100%; + background: #D0DFFE; + border-radius: 5rpx; +} + +.hotel-custom-right>view{ + margin-bottom: 20rpx; +} +.hotel-custom-right>view:last-of-type{ + margin-bottom: 0; +} + diff --git a/pages/list/theatre/index.js b/pages/list/theatre/index.js index e65e066..6deda18 100644 --- a/pages/list/theatre/index.js +++ b/pages/list/theatre/index.js @@ -11,7 +11,7 @@ Page({ list:[], tagList: [], // 父标签6 total:1, - type:1, + type:278, sort:["","weight","distance","weight","price"], order:['','desc',"asc","desc","asc"], lat:"", @@ -52,37 +52,38 @@ Page({ getList:function(){ let list = this.data.list,that = this; if(list.length>=this.data.total) return; - // 距离排序 - if(this.data.type==2 && !this.data.lon){ - wx.getLocation({ - type: 'gcj02', - success: function (res) { - that.setData({ - lat:res.latitude, - lon:res.longitude - }) - that.realgetList() - }, - fail:function(){ - that.realgetList() - } - }) - } - else { - this.realgetList() - } + that.realgetList() + // // 距离排序 + // if(this.data.type==2 && !this.data.lon){ + // wx.getLocation({ + // type: 'gcj02', + // success: function (res) { + // that.setData({ + // lat:res.latitude, + // lon:res.longitude + // }) + // that.realgetList() + // }, + // fail:function(){ + // that.realgetList() + // } + // }) + // } + // else { + // this.realgetList() + // } }, realgetList:function(){ let list = this.data.list; commonApi._post("product/get_product_by_tag",{ - tag_id:"6", + tag_id: this.data.type, offset:list.length, limit:10, - sort:this.data.sort[this.data.type], - order:this.data.order[this.data.type], - lat:this.data.lat, - lon:this.data.lon, + // sort:this.data.sort[this.data.type], + // order:this.data.order[this.data.type], + // lat:this.data.lat, + // lon:this.data.lon, title:this.data.keywords }).then(res=>{ res.data.list.map(item=>{ @@ -106,7 +107,7 @@ Page({ // 获取子标签 getTags () { commonApi._post("",{ - tag_id:"6", + tag_id:"278", }).then(res=>{ let resData = res.data.list || [] this.setData({ diff --git a/pages/list/theatre/index.wxml b/pages/list/theatre/index.wxml index 95803f5..03bdcf0 100644 --- a/pages/list/theatre/index.wxml +++ b/pages/list/theatre/index.wxml @@ -5,7 +5,7 @@ - 全部 + 全部 距离最近 销量最高 价格最低 @@ -21,10 +21,9 @@ {{item.title}} - {{item.subtitle?item.subtitle:""}} - {{item.supplier_address}} + {{"开放时间"}} + {{"地址"}} - ￥{{item.price?item.price/100:0}}起 diff --git a/pages/order/show/index.js b/pages/order/show/index.js index 266ff5b..412bc6d 100644 --- a/pages/order/show/index.js +++ b/pages/order/show/index.js @@ -8,43 +8,99 @@ Page({ * 页面的初始数据 */ data: { - times:[], + dateArr: [ + {date: '2024-11-19', price: 7000}, + {date: '2024-11-20', price: 7000}, + {date: '2024-11-21', price: 7000}, + ], + times:[ + {sale_date: "2024-11-19", stock_number: 0, start_time: "07:30", end_time: "08:30"}, + {sale_date: "2024-11-19", stock_number: 2, start_time: "07:30", end_time: "08:30"}, + {sale_date: "2024-11-19", stock_number: 2, start_time: "07:30", end_time: "08:30"}, + {sale_date: "2024-11-19", stock_number: 2, start_time: "07:30", end_time: "08:30"}, + {sale_date: "2024-11-19", stock_number: 2, start_time: "07:30", end_time: "08:30"}, + {sale_date: "2024-11-19", stock_number: 2, start_time: "07:30", end_time: "08:30"}, + + ], product:null, dateindex:-1, - timeindex:-1 + timeindex:-1, + sku_id: null, + producNum: 1, + + cartTop: 0, + cartImgInfo: null, + cartCount: 0, }, /** * 生命周期函数--监听页面加载 */ onLoad: function (options) { + let that = this let product = app.globalData.product,start_date = util.formatDate(new Date()); this.setData({ product:product }) let end_date = util.formatDate(new Date(new Date(start_date.replace(/-/g,'/')).getTime() + 30 * 24 * 60 * 60 * 1000)); - commonApi.user_post("show/get_show_sku_seats_price_by_date",{ - sku_id:product.sku[0].id, + commonApi.user_post("product/product_date_price",{ + sku_id:1208, start_date:start_date, end_date:end_date }).then(res=>{ - let dateindex = -1,timeindex=-1; - for(let i=0;i{ + v.short_date = v.date.split("-").splice(1, 2).join("-") + }) + this.setData({dateArr: date}) + + this.initTime() + }, + + // 时间处理 + initTime () { + let times = this.data.times + times.forEach(v=>{ + v.week = this.getDay(v.sale_date) + }) + this.setData({times: times}) + }, + + // 选择日期 + changeDate:function(e){ + let dateindex = e.currentTarget.dataset.date + // todo获取时间 + this.setData({ + dateindex: dateindex }) + }, selectTime:function(e){ @@ -56,14 +112,20 @@ Page({ }) } }, + + minus: function () { + if (this.data.producNum == 1) return; + this.setData({ + producNum: this.data.producNum - 1 + }) + }, + add: function () { + this.setData({ + producNum: this.data.producNum + 1 + }) + }, next:function(){ - let product = app.globalData.product; - product.timeInfo = this.data.times[this.data.dateindex]; - product.timeInfo.screen = [this.data.times[this.data.dateindex].screen[this.data.timeindex]]; - app.globalData.product = product; - wx.navigateTo({ - url: '../showSeat/index', - }) + }, /** * 生命周期函数--监听页面初次渲染完成 @@ -76,9 +138,51 @@ Page({ * 生命周期函数--监听页面显示 */ onShow: function () { - + this.getCartNum() }, + // 获取购物车数量 + getCartNum () { + commonApi.user_post('cart/get_list', {}).then(res => { + this.setData({ + cartCount: res.data.length + }) + }) + }, + // 加入购物车 + showCart: function () { + commonApi.user_post('wx/get_user_keep', { + jumpurl: '/pages/info/postProductInfo/index?id=' + this.data.id, + title: this.data.info.title, + type: 'mini' + }).then(res => { + if (res.data.subscribe == 0) { + this.setData({ + wxqrcode: res.data.qrcode, + showQrCode: true + }) + } else { + if (this.data.info.sku.length == 0) { + wx.showToast({ + title: '该产品未设置规格，不能加购', + icon: 'none' + }) + return; + } + this.setData({ + skuFlag: "cart" + }) + let that = this + wx.createSelectorQuery().select('#skuImg').boundingClientRect(function (res) { + console.log(res) + that.setData({ + cartImgInfo: 'top:' + res.top + 'px;left:' + res.left + 'px;' + }) + }).exec() + } + }) + }, + /** * 生命周期函数--监听页面隐藏 */ diff --git a/pages/order/show/index.wxml b/pages/order/show/index.wxml index 775597f..95a9109 100644 --- a/pages/order/show/index.wxml +++ b/pages/order/show/index.wxml @@ -1,17 +1,62 @@ - + {{product.title}} - {{product.subtitle}} - 场次 - - {{date.sale_date}}{{item.start_time}} ~ {{item.end_time}} {{item.is_ticket==1?'有票':'售罄'}} + + 选择日期 + + 今天 {{dateArr[0].short_date}} + 明天 {{dateArr[1].short_date}} + 后天 {{dateArr[2].short_date}} + 更多 + + + + 场次 + + + {{item.sale_date}} {{item.week}} {{item.start_time}} + + + + + + 票档 + + + {{item.sale_date}} {{item.week}} {{item.start_time}} + + + + + + + + 数量 + + {{producNum}} + + + - 下一步 - \ No newline at end of file + 总价：￥560.00 + + 加入购物车 + 立即购买 + + + + + + + + {{cartCount}} + \ No newline at end of file diff --git a/pages/order/show/index.wxss b/pages/order/show/index.wxss index 16b489c..53c245f 100644 --- a/pages/order/show/index.wxss +++ b/pages/order/show/index.wxss @@ -1,92 +1,203 @@ /* pages/order/show/index.wxss */ page { - background: #f6f6f6; + background: white; } .order-top { - border-bottom: 1rpx solid #ccc; - padding: 30rpx 47rpx; - -} -.order-name { - font-weight: 500; - color: #000; - font-size: 33rpx; -} -.order-subtitle { - margin-top: 20rpx; - font-size: 27rpx; - color: #666; + background: #E6F3F3; + width: 100%; + padding: 26rpx 32rpx; + font-family: PingFang SC; + font-weight: bold; + font-size: 32rpx; + color: #111111; } + .box { - margin: 30rpx 25rpx; - background: white; - border-radius: 9rpx; padding-bottom: 30rpx; + padding: 48rpx 26rpx; } -.box-title { - line-height: 113rpx; - border-bottom: 1rpx solid #ccc; - padding: 0 20rpx; + +.box-content{ + margin-bottom: 50rpx; + width: 100%; } -.order-line-item { - margin: 0 20rpx; - display: flex; - align-items: center; - border: 1rpx solid #333; - border-radius: 10rpx; - margin-top: 30rpx; - font-size: 27rpx; - padding: 0 22rpx; - line-height: 70rpx; - box-sizing: border-box; + +.box-title{ + font-family: PingFang SC; + font-weight: bold; + font-size: 35rpx; + color: #333333; + margin-bottom: 38rpx; } -.order-line-item text { - margin-right: 15rpx; +.flex-between{ + display: flex; + align-items: center; + justify-content: space-between; } -.order-line-item .state { - width: 78rpx; - line-height: 34rpx; - border: 1rpx solid; - border-radius: 17rpx; - box-sizing: border-box; - text-align: center; - font-size: 24rpx; - color: #D62828; +.flex-wrap{ + display: flex; + flex-wrap: wrap; } -.order-line-item.disable .state { - color: #666; - border-color: #ccc; +.sku-box{ + display: flex; + flex-direction: column; } -.order-line-item.disable { - color: #666666; +.sku-box .tag{ + width: fit-content; } -.order-line-item.active .state { - color: #fff; +.tag{ + padding: 0rpx 19rpx; + border: 1px solid #999999; + height: 67rpx; + line-height: 67rpx; + text-align: center; + border-radius: 13rpx; + font-family: PingFang SC; + font-weight: bold; + font-size: 27rpx; + color: #333333; + margin-bottom: 17rpx; } -.order-line-item.active { - background: #0B898E; - border-color: #0B898E; - color: #fff; + +.tag.active{ + background: #0B898E; + border: none; + color: #FFFFFF; +} + +.tag.disabled{ + background: #CCCCCC; + border: none; + color: #FFFFFF; } + +.number-box { + display: flex; + align-items: center; + justify-content: space-between; + } + + .number-box text { + flex: 1; + font-size: 35rpx; + color: #333; + font-weight: bold; + } + + .number-box view { + border: 1rpx solid #999999; + border-radius: 10rpx; + text-align: center; + width: 67rpx; + line-height: 67rpx; + font-size: 33rpx; + color: #000; + } + + .number-box view.disable { + border-color: #ccc; + color: #999; + } + + .number-box view.number { + width: 80rpx; + margin: 0 10rpx; + border: none; + } + .number-box .add{ + background: #0B898E; + border-radius: 10rpx; + border: none; + color: white; + } + + .fixed-bottom { height: 138rpx; background: #FFFFFF; box-shadow: 0px 0px 16rpx 0px rgba(6, 0, 1, 0.1); display: flex; align-items: center; - justify-content: center; + justify-content: space-between; position: fixed; left: 0; right: 0; bottom: 0; + padding:0 26rpx; + color: #333333; + font-size: 31rpx; + font-weight: bold; } -.fixed-btn { - width: 657rpx; - line-height: 78rpx; - background: #D62828; - border-radius: 39rpx; - text-align: center; - color: #fff; - font-size: 33rpx; - font-weight: 500; -} \ No newline at end of file + + +/* 购物车 */ +.cart-box { + position: fixed; + display: flex; + align-items: center; + justify-content: center; + width: 80rpx; + height: 80rpx; + background: #FFFFFF; + box-shadow: 0px 0px 20rpx 0px rgba(0, 0, 0, 0.2); + border-radius: 50%; + right: 20rpx; + bottom: 166rpx; + } + + .cart-box image { + display: block; + width: 49rpx; + } + + .cart-num { + width: 26rpx; + border: 1rpx solid; + border-radius: 50%; + line-height: 26rpx; + text-align: center; + font-size: 23rpx; + color: #D20000; + position: absolute; + right: -2rpx; + top: -5rpx; + } + + .btns { + font-size: 32rpx; + font-weight: bold; + text-align: center; + display: flex; + align-items: center; + justify-content: center; + border-radius: 39rpx; + border: 1px solid #D62828; + color: #D62828; + } + + .btns .btn { + width: 200rpx; + height: 73rpx; + line-height: 73rpx; + background: #D62828; + } + + .btns .btn:nth-child(1) { + border-radius: 39rpx 0 0 39rpx; + background: white; + + } + + .btns .btn:nth-child(2) { + border-radius: 0 39rpx 39rpx 0; + color: white; + } + + .btns .btn.disable { + background: #ccc; + } + + .bottom-price{ + color: #D62828; + font-size: 36rpx; + } \ No newline at end of file diff --git a/utils/https.js b/utils/https.js index 50f43f4..58ee3a1 100644 --- a/utils/https.js +++ b/utils/https.js @@ -1,8 +1,8 @@ var app = getApp(); import util from "../utils/util" // import userApi from "../utils/https/user.js"; -// const baseUrl = "https://test.api.cloud.sz-trip.com/api/"; -let baseUrl = "https://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/"; const env = wx.getAccountInfoSync().miniProgram.envVersion if (env == 'develop1') { baseUrl = "https://test.api.cloud.sz-trip.com/api/"