classroom-music-activation/miniprogram/pages/index/index.ts

// index.ts

import { api_shopProduct, api_shopInstruments, api_getUserBeneficiaryPage } from "../../api/login";
import { debounce } from '../../utils/util'

// 获取应用实例
const app = getApp<IAppOption>()
// pages/orders/orders.ts
Page({
  /**
   * 页面的初始数据
   */
  data: {
    maxTop: 0,
    top: 0,  // 初始的上偏移
    startY: 0, // 触摸起始点 Y 坐标
    windowHeight: 0, // 屏幕高度
    elementHeight: 180, // 元素高度
    goodsImgList: [
      "https://oss.dayaedu.com/ktyq/1739518565519.png",
      "https://oss.dayaedu.com/ktyq/1739518602666.png",
      "https://oss.dayaedu.com/ktyq/1739518623253.png",
      "https://oss.dayaedu.com/ktyq/1739518638007.png"
    ],
    serviceShow: true,
    popupShow: false,
    list: [] as any,
    instrumentsList: [] as any[],
    isOverSaled: false, // 是否所有商品都没有库存
    selected: {} as any,
    selectedInstruments: {} as any,
    memberInfo: {} as any, // 会员信息
    isShowMemberInfoTip: false, // 会员信息提示
    isFromPreviewImage: false,
    isShowOperation: false, // 是否显示操作按钮
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad() {
    // this.onInit()
  },
  /**
   * 获取基础信息
   */
  async onInit() {
    try {
      const [{ data }, { data: instrumentsData }] = await Promise.all([api_shopProduct({ appId: app.globalData.appId }), api_shopInstruments({ appId: app.globalData.appId })])
      // 商品
      const list = data.data || []
      let selected: any = {}
      let isOverSaled = true // 是否销售完
      list.forEach((item: any) => {
        item.typeName = this.formatPeriod(item.num, item.period);
        if (item.stockNum > 0) {
          isOverSaled = false
          if (!selected.id) {
            selected = item
          }
        }
      });
      if (isOverSaled) {
        // 没有可购买商品则默认选中第一个商品
        selected = list[0]
      }
      // 乐器
      const instrumentsList = instrumentsData.data
      this.setData({
        list,
        isOverSaled,
        selected,
        instrumentsList,
        selectedInstruments: {}
      })
    } catch (e) {
      console.log(e, 'e')
    }
  },
  // 格式化类型
  formatPeriod(num: number, type: string) {
    const template: any = {
      DAY: "天卡",
      MONTH: "月卡",
      YEAR: "年卡"
    }
    if (type === "YEAR" && num >= 99) {
      return '永久卡'
    }
    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 || {}
    })
  },
  onSelectInstrumentsGoods(e: any) {
    const { dataset } = e.currentTarget
    let item = this.data.instrumentsList[dataset.index]
    if (item?.id === this.data.selectedInstruments?.id) {
      item = {}
    }
    this.setData({
      selectedInstruments: item || {}
    })
  },
  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
    })
  },
  onClose() {
    this.setData({
      popupShow: false
    })
  },
  async onMemberInfo() {
    this.setData({
      isShowMemberInfoTip: false
    })
    try {
      const resData = await api_getUserBeneficiaryPage()
      const pageRows = resData?.data?.data?.rows || []
      // 当有权益人的时候跳转到权益人选择列表页面，当没有权益人的时候到添加权益人页面
      if (pageRows.length) {
        wx.navigateTo({
          url: `/pages/member/memberList?id=${this.data.memberInfo.id}`
        });
      } else {
        // 当redirectUrl等于index的时候证明是首次添加，需要给上一个页面
        wx.navigateTo({
          url: `/pages/member/addMember?redirectUrl=index`
        });
      }
    } catch (e) {
      console.log(e, 'e')
    }
  },
  onSubmit() {
    // 判断是否登录
    const that = this
    debounce(function () {
      if (!that.isLogin()) {
        return
      }
      if (!that.data.memberInfo.id) {
        wx.showToast({
          title: "请填写会员信息",
          icon: 'none'
        })
        that.setData({
          isShowMemberInfoTip: true
        })
        return
      }
      let info = JSON.stringify({
        ...that.data.selected
      });
      let instrumentsInfo = JSON.stringify({
        ...that.data.selectedInstruments
      })
      let memberInfo = JSON.stringify({
        ...that.data.memberInfo
      })
      info = encodeURIComponent(info);
      instrumentsInfo = encodeURIComponent(instrumentsInfo);
      memberInfo = encodeURIComponent(memberInfo);
      wx.navigateTo({
        url: `../orders/order-detail?orderInfo=${info}&instrumentsInfo=${instrumentsInfo}&memberInfo=${memberInfo}`,
        success: () => {
        }
      })
    }, 300)()
  },
  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() {
    this.initPosInfo()
    if (!this.data.isFromPreviewImage && !this.data.popupShow) {
      this.onInit()
      this.setData({
        memberInfo: {}
      })
    } else {
      this.setData({
        isFromPreviewImage: false
      })
    }
    this.setData({
      serviceShow: true
    })
  },
  onHide() {
    this.setData({
      serviceShow: false
    })
  },
  // 初始化位置信息
  initPosInfo() {
    // 获取屏幕宽高
    const systemInfo = wx.getWindowInfo();
    const isAndroid = systemInfo.platform === 'android'
    // const isDevtools = systemInfo.platform === 'devtools'
    const barHeight = !isAndroid ? 44 : 48;
    const globalTop = app.globalData.sectionBoxTop
    this.setData({
      maxTop: barHeight + systemInfo.safeArea.top,
      windowHeight: systemInfo.windowHeight,
      top: globalTop
    });
  },
  onTouchStart(e: any) {
    // 记录触摸起始点的 Y 坐标
    this.setData({
      startY: e.touches[0].clientY
    });
  },
  onTouchMove(e: any) {
    // 计算上下方向的偏移量
    const deltaY = e.touches[0].clientY - this.data.startY;
    // 更新元素的垂直位置
    app.globalData.sectionBoxTop = this.data.top + deltaY
    this.setData({
      top: this.data.top + deltaY,
      startY: e.touches[0].clientY
    });
  },
  onTouchEnd() {
    const { top, windowHeight, elementHeight } = this.data;
    // 计算与顶部和底部边界的距离
    const distanceTop = top;
    const moveHeight = top + elementHeight
    // 判断元素与顶部和底部的距离，选择最近的边界
    if (distanceTop < this.data.maxTop) {
      this.setData({ top: this.data.maxTop }, () => {
        app.globalData.sectionBoxTop = this.data.maxTop
      }); // 吸附到顶部
    } else if (moveHeight >= windowHeight) {
      this.setData({ top: windowHeight - elementHeight }, () => {
        app.globalData.sectionBoxTop = windowHeight - elementHeight
      })
    } else {
      this.setData({ top }, () => {
        app.globalData.sectionBoxTop = top
      })
    }
  },
  onScroll(e: { detail: any }) {
    // console.log(e, 'any')
    const scrollTop = e.detail.scrollTop || 0
    if (scrollTop > 40) {
      this.setData({
        isShowOperation: true
      })
    } else {
      this.setData({
        isShowOperation: false
      })
    }
  },
  onShareAppMessage() {
    return {
      title: '音乐数字AI器乐工具',
      path: '/pages/index/index',
      imageUrl: 'https://oss.dayaedu.com/ktyq/1733311074676.png'
    }
  },
  onShareTimeline() {
    return {
      title: '音乐数字AI器乐工具',
      path: '/pages/index/index',
      imageUrl: 'https://oss.dayaedu.com/ktyq/1733311074676.png'
    }
  }
})