165 lines
3.7 KiB
Vue
165 lines
3.7 KiB
Vue
<!-- 积分商城：商品列表 -->
|
||
<template>
|
||
<s-layout title="兑换成功" navbar="normal" :leftWidth="0" :rightWidth="0">
|
||
<view class="main">
|
||
<image src="https://zysc.fjptzykj.com:3000/shangcheng/4fd1540f5e7c4545140fe1278fd6db65f18a3cd86bc866b24470b888bf6664fe.png" class="img" mode=""></image>
|
||
<view class="title">商品兑换成功</view>
|
||
<view class="fgx"></view>
|
||
<view class="ddxx">
|
||
<view class="l">
|
||
订单编号
|
||
</view>
|
||
<view class="r">
|
||
wx23556151561321321351213
|
||
</view>
|
||
</view>
|
||
<view class="ddxx">
|
||
<view class="l">
|
||
兑换时间
|
||
</view>
|
||
<view class="r">
|
||
2024-10-18 15:46:03
|
||
</view>
|
||
</view>
|
||
<view class="ddxx">
|
||
<view class="l">
|
||
兑换方式
|
||
</view>
|
||
<view class="r">
|
||
积分兑换
|
||
</view>
|
||
</view>
|
||
<view class="ddxx">
|
||
<view class="l">
|
||
支付方式
|
||
</view>
|
||
<view class="r">
|
||
10
|
||
</view>
|
||
</view>
|
||
<view class="fgx"></view>
|
||
|
||
<view class="ck-detail">
|
||
查看详情
|
||
</view>
|
||
<view class="bk-home">
|
||
返回首页
|
||
</view>
|
||
</view>
|
||
</s-layout>
|
||
</template>
|
||
<script setup>
|
||
import sheep from '@/sheep';
|
||
import { onLoad, onReachBottom } from '@dcloudio/uni-app';
|
||
import { reactive, ref } from 'vue';
|
||
import PointApi from '@/sheep/api/promotion/point';
|
||
import SLayout from '@/sheep/components/s-layout/s-layout.vue';
|
||
|
||
// 计算页面高度
|
||
const { safeAreaInsets, safeArea } = sheep.$platform.device;
|
||
const statusBarHeight = sheep.$platform.device.statusBarHeight * 2;
|
||
const pageHeight =
|
||
(safeArea.height + safeAreaInsets.bottom) * 2 + statusBarHeight - sheep.$platform.navbar - 350;
|
||
|
||
const sPointCardRef = ref();
|
||
// 查询活动列表
|
||
const activityPageParams = reactive({
|
||
pageNo: 1, // 页码
|
||
pageSize: 5, // 每页数量
|
||
});
|
||
|
||
const activityTotal = ref(0); // 活动总数
|
||
const activityCount = ref(0); // 已加载活动数量
|
||
const loadStatus = ref(''); // 页面加载状态
|
||
async function getActivityList() {
|
||
loadStatus.value = 'loading';
|
||
const { data } = await PointApi.getPointActivityPage(activityPageParams);
|
||
await sPointCardRef.value.concatActivity(data.list);
|
||
activityCount.value = sPointCardRef.value.getActivityCount();
|
||
activityTotal.value = data.total;
|
||
|
||
loadStatus.value = activityCount.value < activityTotal.value ? 'more' : 'noMore';
|
||
}
|
||
|
||
// 加载更多
|
||
function loadMore() {
|
||
if (state.loadStatus !== 'noMore') {
|
||
activityPageParams.pageNo += 1;
|
||
getActivityList();
|
||
}
|
||
}
|
||
|
||
// 上拉加载更多
|
||
onReachBottom(() => {
|
||
loadMore();
|
||
});
|
||
onLoad(() => {
|
||
getActivityList();
|
||
});
|
||
</script>
|
||
|
||
<style lang="scss" scope>
|
||
.main{
|
||
background:white;
|
||
width:85%;
|
||
padding:15px;
|
||
position:fixed;
|
||
top:50%;
|
||
left:50%;
|
||
transform:translate(-50%, -50%);
|
||
border-radius:12px;
|
||
.img{
|
||
width:80px;
|
||
height:80px;
|
||
display:block;
|
||
margin:0 auto;
|
||
margin-top: -52px;
|
||
}
|
||
.title{
|
||
text-align: center;
|
||
font-size:18px;
|
||
margin:15px 0;
|
||
font-weight: 700;
|
||
}
|
||
.ddxx{
|
||
display: flex;
|
||
justify-content: space-between;
|
||
margin:10px 0;
|
||
.l{
|
||
font-size: 17px;
|
||
}
|
||
.r{
|
||
font-size: 16px;
|
||
color:rbga(102,102,102);
|
||
}
|
||
}
|
||
.fgx{
|
||
margin: 20px 0;
|
||
height: 1px;
|
||
width: 100%;
|
||
background:rgba(239,239,239);
|
||
}
|
||
.ck-detail{
|
||
// background: rgba(254,92,45);
|
||
background: rgba(207,162,92);
|
||
padding: 10px 0;
|
||
color: white;
|
||
font-size: 19px;
|
||
text-align: center;
|
||
width: 100%;
|
||
margin-bottom: 15px;
|
||
border-radius:31px;
|
||
}
|
||
.bk-home{
|
||
border:1px solid rgba(207,162,92);
|
||
padding: 10px 0;
|
||
color: rgba(207,162,92);
|
||
font-size: 19px;
|
||
text-align: center;
|
||
width: 100%;
|
||
border-radius:31px;
|
||
}
|
||
|
||
}
|
||
</style>
|