fish_app/src/pages/indexSub/seckillIndex/index.jsx

import { Component } from "react";
import { View, Image } from "@tarojs/components";
import "./index.less";
import Taro from "@tarojs/taro";
import seckillImg from "../../../images/seckill/seckillTop.jpg";
import ProductList from "../../../components/index/ProductList";
import { getRecommendProductList, addLog } from "../../../service";
import { formatDate } from "../../../common/time";
import { getShareContent } from "../../../common/share";
export default class Index extends Component {
  state = {
    productList: [], //推荐商品列表
    page: 1, //页数
    loading: false, //加载状态
    totalPages: 1, // 添加总页数
    isNoMore: false, // 是否没有更多
    isDirect: false, // 是否直接跳转
    isBanner: false, // 是否是banner跳转
    isShare: false, // 是否是分享跳转
    shareUserId: "", // 分享用户id
  };
  componentDidMount() {
    const { isDirect, isBanner, isShare, shareUserId } =
      Taro.getCurrentInstance().router.params || "";
    this.setState(
      {
        isDirect: isDirect || false,
        isBanner: isBanner || false,
        isShare: isShare || false,
        shareUserId: shareUserId || "",
      },
      () => {
        this.handleLog(
          isDirect
            ? "direct_to_fish_seckill"
            : isBanner
            ? "banner_to_fish_seckill"
            : isShare
            ? "share_to_fish_seckill"
            : "direct_to_fish_seckill"
        );
      }
    );
    this.getRecommendProductList();
  }
  // 获取推荐商品列表
  getRecommendProductList = async () => {
    const { page } = this.state;
    this.setState({ loading: true });

    const res = await getRecommendProductList({
      tag_id: 120,
      page,
      page_size: 10,
    });

    this.setState((prevState) => ({
      productList: [...prevState.productList, ...res.goods_list],
      totalPages: res.total_pages,
      loading: false,
      isNoMore: res.total_pages <= page,
    }));
  };
  // 埋点
  handleLog = (event_type) => {
    const dayid = formatDate(new Date(), "YYYY-MM-DD");
    const event_type_title =
      event_type == "banner_to_fish_seckill"
        ? "从banner 跳转到鱼市秒杀"
        : event_type == "share_to_fish_seckill"
        ? "从分享链接跳转到鱼市秒杀"
        : event_type == "direct_to_fish_seckill"
        ? "直接点击进入鱼市秒杀"
        : "直接点击进入鱼市秒杀";
    let userId = "";
    if (Taro.getStorageSync("loginInfo")) {
      userId = Taro.getStorageSync("loginInfo").id;
    }
    // 构建ext对象，包含share_id
    let ext = "";
    if (this.state.shareUserId) {
      ext = JSON.stringify({
        share_users_id: this.state.shareUserId,
      });
    }
    addLog({
      users_id: userId||0,
      goods_id: 0,
      event_type_title,
      event_type,
      dayid,
      ext,
    });
  };
  // 配置分享内容
  onShareAppMessage() {
    let shareUserId = "";
    if (Taro.getStorageSync("loginInfo")) {
      shareUserId = Taro.getStorageSync("loginInfo").id;
    }
    const shareConfig = getShareContent();
    if (shareConfig.title == "默认分享标题") {
      return {
        title: "鱼市秒杀",
        path: `/pages/indexSub/seckillIndex/index?isShare=true&shareUserId=${shareUserId}`,
        imageUrl: "",
      };
    } else {
      return getShareContent();
    }
  }
  // 页面上拉触底
  onReachBottom = () => {
    const { page, totalPages, loading } = this.state;
    if (page < totalPages && !loading) {
      this.setState(
        (prevState) => ({ page: prevState.page + 1 }),
        () => this.getRecommendProductList()
      );
    }
  };
  render() {
    return (
      <View className="index">
        <Image className="seckill" src={seckillImg} mode="aspectFill" />
        {/* 商品列表 */}
        <View className="product-list">
          <ProductList
            isSeckill={true}
            productList={this.state.productList}
            loading={this.state.loading}
            isNoMore={this.state.isNoMore}
            shareUserId={this.state.shareUserId}
          />
        </View>
      </View>
    );
  }
}