<template>
  <view>
    <view class="w-full py-40rpx bg-white rounded-b-xs flex items-center justify-center flex-col">
      <!-- 支付成功 -->
      <block v-if="type == 'success'">
        <image class="w-77rpx h-77rpx" src="/static/images/user/pay_sel.png" mode=""></image>
        <view class="text-xl text-primary font-extrabold mt-10rpx">支付成功</view>
        <view class="pb-base flex items-center mt-40rpx w-full justify-between px-150rpx">
          <view class="text-lg text-txBase"
            @tap="$u.route({ url: `/pages/order_details/index`, type: 'redirectTo', params: { id: id } })">
            查看订单</view>
          <view class="text-lg text-primary" @tap="switchTab">返回首页</view>
        </view>
      </block>
      <!-- 支付失败 -->
      <block v-else>
        <image class="w-77rpx h-77rpx" src="/static/images/user/err.png" mode=""></image>
        <view class="text-xl text-hex-FF5B5F font-extrabold mt-10rpx">支付失败</view>
        <view class="pb-base flex items-center mt-40rpx w-full justify-between px-150rpx">
          <view class="text-lg text-txBase"
            @tap="$u.route({ url: `/pages/order_details/index`, type: 'redirectTo', params: { id: id } })">
            查看订单</view>
          <view class="text-lg text-primary" @tap="switchTab">返回首页</view>
        </view>
      </block>
    </view>
    <view class="flex items-center justify-center mt-base">
      <view class="w-25rpx h-1rpx bg-txBase"></view>
      <view class="text-xl font-extrabold text-txBase mx-10rpx">推荐</view>
      <view class="w-25rpx h-1rpx bg-txBase"></view>
    </view>
    <mescroll-body class="mt-20rpx" :bottombar="false" ref="mescrollRef" @init="mescrollInit" @up="upCallback"
      :down="downOption" :up="upOption">
      <view class="px-base">
        <goods-list :list="goodsList"></goods-list>
      </view>
    </mescroll-body>
  </view>
</template>

<script>
  import MescrollMixin from '@/uni_modules/mescroll-uni/components/mescroll-uni/mescroll-mixins.js';
  export default {
    mixins: [MescrollMixin],
    data() {
      return {
        type: 'success',
        id: '',
        goodsList: [],
        downOption: {
          use: false,
        },
        upOption: {
          page: {
            size: 20,
          },
        },
      };
    },
    onLoad({
      type,
      id
    }) {
      this.id = id;
      this.type = type;
      this.$store.dispatch('user/getUserInfo');
    },
    methods: {
      async upCallback(page) {
        this.getInterest(page);
      },
      //猜你喜欢
      async getInterest({
        num,
        size
      }) {
        const resData = await this.$api.get('/v1/product/products', {
          params: {
            per_page: size,
            page: num
          }
        });
        const {
          data
        } = resData;

        if (num === 1) {
          this.goodsList = data;
        } else {
          this.goodsList = this.goodsList.concat(data);
        }
        // console.log(this.goodsList);
        this.mescroll.endSuccess(data.length, size == data.length);
      },
      switchTab() {
        uni.switchTab({
          url: '/pages/index/index',
        });
      },
    },
  };
</script>

<style lang="scss"></style>
