218 lines
4.3 KiB
Vue
218 lines
4.3 KiB
Vue
<template>
|
||
<s-layout title="兑换记录" color="white" :bgStyle="{ color: '#fff' }" opacityBgUi=""
|
||
navbarbackgroundColor="rgba(193,145,81)">
|
||
<view class="container">
|
||
<view class="card" v-for="(item, index) in reservationList" :key="index">
|
||
<view class="top">
|
||
订单时间:
|
||
{{
|
||
sheep.$helper.timeFormat(item.createTime, 'yyyy-mm-dd')
|
||
}}
|
||
</view>
|
||
<view class="left">
|
||
<image :src="item.picUrl" class="img"></image>
|
||
</view>
|
||
<view class="right">
|
||
<view class='t ss-line-2'>{{item.name}}</view>
|
||
<!-- <view class='c'>共<text class="c-t">{{item.count}}</text>件商品</view>
|
||
<view class='b'>来自:</view> -->
|
||
<view class="card-bottom">
|
||
<view class="card-left">
|
||
<!-- <image
|
||
src="https://zysc.fjptzykj.com:3000/shangcheng/d1dd98b6a37ea9ea90c49898024d3669a54ee2a48f028b671609937b6b1250af.png"
|
||
class="img" mode=""></image> -->
|
||
<!-- <text class="card-c">×</text> -->
|
||
<view class="card-r">-{{item.usePoint}} 积分</view>
|
||
</view>
|
||
<view class="r-cart" @click="sheep.$router.go('/pages/activity/point/exchange_detail', { id: item.id })">查看详情</view>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="r-cart r-top" :class="item.status == 40 ? 'hui' : ''">{{item.label}}</view>
|
||
</view>
|
||
|
||
</view>
|
||
</s-layout>
|
||
</template>
|
||
|
||
<script>
|
||
import {
|
||
computed
|
||
} from 'vue';
|
||
import sheep from '@/sheep';
|
||
import request from '@/sheep/request';
|
||
import {
|
||
baseUrl,
|
||
apiPath
|
||
} from '@/sheep/config';
|
||
export default {
|
||
data() {
|
||
return {
|
||
memberId: null,
|
||
reservationList: [],
|
||
page: 1,
|
||
limit: 10,
|
||
totalPages: 1,
|
||
sheep
|
||
};
|
||
},
|
||
created() {
|
||
this.memberId = computed(() => sheep.$store('user').userInfo).value.id
|
||
this.getList();
|
||
},
|
||
methods: {
|
||
getList() {
|
||
request({
|
||
// url: `${baseUrl}${apiPath}/h5/reservation/list`,
|
||
url: `${baseUrl}${apiPath}/trade/order/getPointOrder`,
|
||
method: 'GET',
|
||
// params: {
|
||
// userId: this.memberId,
|
||
// },
|
||
custom: {
|
||
showLoading: false,
|
||
},
|
||
}).then((res) => {
|
||
this.reservationList = res.data
|
||
console.log('this.reservationList', this.reservationList)
|
||
});
|
||
// uni.request({
|
||
// url: `${baseUrl}${apiPath}/h5/reservation/list`, // 接口地址
|
||
// data: {
|
||
// userId:this.memberId,
|
||
// },
|
||
// success: (res) => {
|
||
// console.log(res.data);
|
||
// this.reservationList = res.data.rows
|
||
// },
|
||
// fail: (error) => {
|
||
// console.log(error)
|
||
// }
|
||
// })
|
||
},
|
||
}
|
||
};
|
||
</script>
|
||
|
||
|
||
<style scoped lang="scss">
|
||
.container {
|
||
width: 100%;
|
||
|
||
.card {
|
||
width: 86%;
|
||
padding: 7px 15px;
|
||
background: white;
|
||
margin: 10px auto;
|
||
border-radius: 13px;
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
position: relative;
|
||
box-shadow: 3px -2px 12px 7px rgba(0, 0, 0, 0.05);
|
||
|
||
.top {
|
||
width: 100%;
|
||
padding-bottom: 6px;
|
||
color: rgba(127, 128, 128);
|
||
font-size: 11px;
|
||
}
|
||
|
||
.r-cart {
|
||
// position:absolute;
|
||
// top:0;
|
||
// right:0;
|
||
padding: 2px 11px;
|
||
border-radius: 12px;
|
||
height: 20px;
|
||
line-height:20px;
|
||
background: rgba(193, 145, 81);
|
||
color: white;
|
||
font-size: 11px;
|
||
text-align: center;
|
||
|
||
&.hui {
|
||
background: rgba(223, 241, 244);
|
||
color: rgba(75, 79, 82);
|
||
}
|
||
|
||
}
|
||
.r-top{
|
||
position:absolute;
|
||
top:0;
|
||
right:0;
|
||
background:rgba(242, 232, 218);
|
||
border-radius: 0px 12px 0px 12px;
|
||
color:rgba(163,109,45);
|
||
}
|
||
.left {
|
||
width: 70px;
|
||
height: 70px;
|
||
margin-right: 10px;
|
||
border-radius: 12px;
|
||
|
||
.img {
|
||
width: 100%;
|
||
height: 100%;
|
||
border-radius: 12px;
|
||
}
|
||
}
|
||
|
||
.right {
|
||
flex: 1;
|
||
position: relative;
|
||
|
||
.t {
|
||
font-size: 15px;
|
||
font-weight: 700;
|
||
}
|
||
|
||
.card-bottom {
|
||
position: absolute;
|
||
bottom: 0;
|
||
}
|
||
|
||
.c {
|
||
font-size: 14px;
|
||
margin: 5px 0;
|
||
|
||
.c-t {
|
||
color: #cccc08;
|
||
}
|
||
}
|
||
|
||
.b {
|
||
font-size: 14px;
|
||
color: #dbcccc;
|
||
}
|
||
}
|
||
}
|
||
|
||
.card-bottom {
|
||
width: 100%;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
|
||
.card-left {
|
||
width: 48%;
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
.img {
|
||
width: 20px;
|
||
height: 20px;
|
||
}
|
||
|
||
.card-r {
|
||
color: rgba(162, 75, 72);
|
||
font-size: 16px;
|
||
font-weight: 700;
|
||
}
|
||
}
|
||
|
||
.card-right {
|
||
flex: 1;
|
||
text-align: right;
|
||
}
|
||
}
|
||
}
|
||
</style> |