// index.ts import { api_shopProduct } from "../../api/login"; import { debounce } from '../../utils/util' // 获取应用实例 const app = getApp() // pages/orders/orders.ts Page({ /** * 页面的初始数据 */ data: { imgList: [ // 'https://oss.dayaedu.com/ktyq/1732585725698.png', // 'https://oss.dayaedu.com/ktyq/1732519468124.png', // 'https://oss.dayaedu.com/ktyq/1732519479416.png', // 'https://oss.dayaedu.com/ktyq/1733110029242.png', // 'https://oss.dayaedu.com/ktyq/1732519500580.png' 'https://oss.dayaedu.com/ktyq/1733449062928.png', 'https://oss.dayaedu.com/ktyq/1733449075055.png', 'https://oss.dayaedu.com/ktyq/1733449085983.png', 'https://oss.dayaedu.com/ktyq/1733449097054.png' ], goodsImgList: [ 'https://oss.dayaedu.com/ktyq/1732175006625.png', 'https://oss.dayaedu.com/ktyq/1732175021350.png', 'https://oss.dayaedu.com/ktyq/1732175031878.png', 'https://oss.dayaedu.com/ktyq/1733457722973.png', 'https://oss.dayaedu.com/ktyq/173340695604938755d8b.png', 'https://oss.dayaedu.com/ktyq/17333975985307c7f2bec.png' ], detailImgList: [ { url: 'https://oss.dayaedu.com/ktyq/1733403675345.png', text: '合作学校音乐数字课堂公开课' }, { url: 'https://oss.dayaedu.com/ktyq/1733403707851.png', text: '音乐课课堂器乐教学' }, { url: 'https://oss.dayaedu.com/ktyq/1733403725644.png', text: '学期末汇报演出' } ], serviceShow: true, scrollTop: 0, current: 0, detailCurrent: 0, autoplay: false, interval: 5000, duration: 500, popupShow: false, videoHeight: '255px', list: [] as any, isOverSaled: false, // 是否所有商品都没有库存 selected: {} as any, opacity: 0, // showSelectedProduct: false, // 是否显示选中商品值 scrolIntoViewStr: '', scrolIntoView: '', scrollDiscount: false, // 是否扣减启 isScrollTT: false, scrollIntoViewType: false, headerHeight: 0, // 头部的高度 initialScrollHeight: 0, // 滚动高度 isFromPreviewImage: false, bannerPlay: false, // 视频是否播放 titleControls: false, // 详情是否显示控制条 liuControls: false, // 详情是否显示控制条 bannerImageloaded: false, // Banner图片是否加载完成 }, /** * 生命周期函数--监听页面加载 */ onLoad() { // this.onInit() const wxWindowInfo = wx.getWindowInfo() this.setData({ videoHeight: wxWindowInfo.windowWidth / 16 * 9 + 'px' }) }, onReady() { const that = this wx.createSelectorQuery().select('#scroll-header').boundingClientRect(function (rect) { that.setData({ headerHeight: rect.height }) }).exec(); wx.createSelectorQuery().select('#scroll-view').boundingClientRect(function (rect) { // console.log(rect, 'rect') that.setData({ initialScrollHeight: rect.height }) }).exec(); }, onBannerVideoLoad() { this.setData({ bannerImageloaded: true }) }, onBannerPlay() { const bannerVideo = wx.createVideoContext('bannerVideo') const titleVideo = wx.createVideoContext('titleVideo') // this.setData({ bannerPlay: true }, () => { bannerVideo.play() titleVideo.pause() // liuVideo.stop() }) }, onBannerVideoPlay() { const titleVideo = wx.createVideoContext('titleVideo') titleVideo.pause() // const liuVideo = wx.createVideoContext('liuVideo') // liuVideo.stop() }, onTitlePlay() { const bannerVideo = wx.createVideoContext('bannerVideo') bannerVideo.pause() // const liuVideo = wx.createVideoContext('liuVideo') // liuVideo.stop() }, onTItleVideoPlay() { const bannerVideo = wx.createVideoContext('bannerVideo') const titleVideo = wx.createVideoContext('titleVideo') // const liuVideo = wx.createVideoContext('liuVideo') this.setData({ titleControls: true }, () => { titleVideo.play() bannerVideo.pause() // liuVideo.stop() }) }, onLiuPlay() { const bannerVideo = wx.createVideoContext('bannerVideo') bannerVideo.pause() const titleVideo = wx.createVideoContext('titleVideo') titleVideo.pause() }, onLiuVideoPlay() { const bannerVideo = wx.createVideoContext('bannerVideo') const titleVideo = wx.createVideoContext('titleVideo') // const liuVideo = wx.createVideoContext('liuVideo') bannerVideo.pause() titleVideo.pause() this.setData({ liuControls: true }, () => { // liuVideo.play() }) }, /** * 获取基础信息 */ async onInit() { try { const { data } = await api_shopProduct({ appId: app.globalData.appId }); const list = data.data || [] let selected: any = {} let isOverSaled = true // 是否销售完 list.forEach((item: any) => { item.originalPrice = this.formatPrice(item.originalPrice, 'ALL'); item.showSalePrice = this.formatPrice(item.salePrice, 'ALL'); item.typeName = this.formatPeriod(item.num, item.period); item.discountPrice = this.formatPrice(item.originalPrice - item.salePrice, 'ALL') const prices: any = this.formatPrice(item.salePrice) item.integerPart = prices.integerPart item.decimalPart = prices.decimalPart // 格式化赠送内容 item.giftLongTime = item.giftFlag ? this.formatGiftPeriod(item.giftVipDay, item.giftPeriod) : ''; if(item.stockNum > 0) { isOverSaled = false if( !selected.id) { selected = item } } }); if(isOverSaled) { // 没有可购买商品则默认选中第一个商品 selected = list[0] } this.setData({ list, isOverSaled, selected }) } catch(e) { console.log(e, 'e') } }, // 格式化价格 formatPrice(price: number, type?: string) { const amountStr = price.toFixed(2) const [integerPart, decimalPart] = amountStr.split('.'); if(type === 'ALL') { return amountStr } return { integerPart, decimalPart } }, // 格式化类型 formatPeriod(num: number, type: string) { const template: any = { DAY: "天卡", MONTH: "月卡", YEAR: "年卡" } if(type === "YEAR" && num >= 99) { return '永久卡' } return num + template[type] }, formatGiftPeriod(num: number, type: string) { if(!num || !type) { return '' } const template: any = { DAY: "天", MONTH: "个月", YEAR: "年" } return num + template[type] }, // 选择 onSelectGoods(e: any) { const { dataset } = e.currentTarget const item = this.data.list.find((item: any) => item.id === dataset.id) // 判断是否有库存 if(item.stockNum <= 0) { return } this.setData({ selected: item || {} }) }, // 事件处理函数 changeSwiper(e: any) { const detail = e.detail; if(detail.source === 'touch' || detail.source == 'autoplay') { this.setData({ current: detail.current }) this.onTitlePlay() } }, changeSwiperDetail(e: any) { const detail = e.detail if(detail.source === 'touch' || detail.source == 'autoplay') { this.setData({ detailCurrent: detail.current }) } }, isLogin() { // 判断是否登录 if(!app.globalData.isLogin) { wx.navigateTo({ url: '../login/login', }) return false } return true }, /** 我的订单 */ onOrder() { // 判断是否登录 if(!this.isLogin()) { return } wx.navigateTo({ url: '../orders/orders', }) }, onBuyShop() { // 判断是否登录 if(!this.isLogin()) { return } this.setData({ popupShow: true, // showSelectedProduct: true, }) }, onClose() { this.setData({ popupShow: false }) }, onSubmit() { // 判断是否登录 const that = this debounce(function () { if(!that.isLogin()) { return } let info = JSON.stringify({ ...that.data.selected }); // console.log(that.data.selected, "that.data.selected") info = encodeURIComponent(info); wx.navigateTo({ url: `../orders/order-detail?orderInfo=${info}`, success: () => { that.setData({ popupShow: false }) } }) }, 200)() }, onPreivewBannerImg(e: { currentTarget: { dataset: any } }) { wx.previewImage({ current: e.currentTarget.dataset.src, urls: this.data.imgList, success: () => { this.setData({ isFromPreviewImage: true }) } }) }, onPreivewDetailImg(e: { currentTarget: { dataset: any } }) { wx.previewImage({ current: e.currentTarget.dataset.src, urls: ['https://oss.dayaedu.com/ktyq/1733403675345.png','https://oss.dayaedu.com/ktyq/1733403707851.png','https://oss.dayaedu.com/ktyq/1733403725644.png', ], success: () => { this.setData({ isFromPreviewImage: true }) } }) }, onPreivewGoodsImg(e: { currentTarget: { dataset: any } }) { wx.previewImage({ current: e.currentTarget.dataset.src, urls: this.data.goodsImgList, success: () => { this.setData({ isFromPreviewImage: true }) } }) }, onPreivewGoods(e: { currentTarget: { dataset: any } }) { wx.previewImage({ current: e.currentTarget.dataset.src, urls: [e.currentTarget.dataset.src], success: () => { this.setData({ isFromPreviewImage: true }) } }) }, /** * 生命周期函数--监听页面显示 */ onShow() { if(!this.data.isFromPreviewImage) { this.onInit() } else { this.setData({ isFromPreviewImage: false }) } this.setData({ serviceShow: true }) }, onHide() { this.setData({ serviceShow: false }) }, // 页面滚动时颜色变化 onScrollView(e: { detail: any }) { const top = e.detail.scrollTop || 0 const scrollHeight = e.detail.scrollHeight || 0 // 从100开始显示 // console.log(top, scrollHeight, this.data.initialScrollHeight, '121121221') this.setData({ // opacity: top < 100 ? 0 : (top - 100) > 150 ? 1 : (top - 100) / 150 opacity: top < 100 ? 0 : (top - 100) > 150 ? 1 : 1 }) if (top + this.data.initialScrollHeight >= scrollHeight - 80) { // console.log('已经滑动到底部了'); // 相应业务逻辑处理 this.setData({ scrolIntoViewStr: 'type2' }) } else { if(this.data.scrollIntoViewType) { this.setData({ scrollTop: this.data.scrollDiscount ? top - this.data.headerHeight : top, scrollIntoViewType: false, scrollDiscount: false, isScrollTT: true, }) } else { if(!this.data.isScrollTT) { this.onChangeScroll() } else { this.setData({ isScrollTT: false, }) } } } }, onChangeScroll() { const that = this; debounce(function() { wx.createSelectorQuery().select('#type3').boundingClientRect(function (rect) { let check = false if(rect.top > 0 && (rect.top <= that.data.headerHeight )) { that.setData({ scrolIntoViewStr: 'type3', }) check = true } if(rect.top > 0 && rect.top > that.data.headerHeight) { that.setData({ scrolIntoViewStr: 'type1' }) check = true } // console.log('checked', check) if(!check) { wx.createSelectorQuery().select('#type2').boundingClientRect(function (rect) { if(rect.top > 0 && rect.top <= that.data.headerHeight) { that.setData({ scrolIntoViewStr: 'type2' }) } if(rect.top > 0 && rect.top > that.data.headerHeight) { that.setData({ scrolIntoViewStr: 'type3' }) } }).exec(); } }).exec(); }, 100)() }, onTapAnchor(e: { currentTarget: { dataset: any } }) { const type = e.currentTarget.dataset.type this.setData({ scrolIntoView: type, scrolIntoViewStr: type, scrollDiscount: true, // type !== 'type2' ? true : false, scrollIntoViewType: true, }) }, onShareAppMessage() { return { title: '音乐数字AI', path: '/pages/index/index', imageUrl: 'https://oss.dayaedu.com/ktyq/1733309357691.png' } }, onShareTimeline() { return { title: '音乐数字AI', path: '/pages/index/index', imageUrl: 'https://oss.dayaedu.com/ktyq/1733309357691.png' } } // onLookMore() { // this.setData({ // popupShow: true // }) // } })