You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 

655 lines
14 KiB

<template>
<view class="container">
<view class="sizer flex al-item-center" @click="showTimSe = !showTimSe">
<text class="iconfont icon-xia"></text>
<text :style="{color: t('color1')}" style="font-size: 24rpx;">{{timeTex}}</text>
</view>
<view v-for="(item, index) in datalist" :key="index" class="item">
<view :data-url="(item.type=='shop'?'/pages/':'/activity/')+ item.type + '/product?id=' + item.proid"
@tap="goto" class="product-item2">
<view class="product-pic">
<image :src="item.product.pic" mode="widthFix"></image>
</view>
<view class="product-info" v-if="item.type == 'scoreshop'">
<view class="p1">{{item.product.name}}</view>
<view class="p3">
<text class="t1" v-if="item.product.sales>0">已兑换{{item.product.sales}}件</text>
<text class="t2" v-else-if="item.product.sellpoint">{{item.product.sellpoint}}</text>
</view>
<view class="p2">
<text class="t1" :style="{color:t('color1')}">{{item.product.score_price}}{{t('积分')}}</text>
<text class="t2">市场价¥{{item.product.sell_price}}</text>
</view>
</view>
<view class="product-info" v-else>
<view class="p1">{{item.product.name}}</view>
<view class="p3">
<text class="t1" v-if="item.product.sales>0">已售{{item.product.sales}}件</text>
<text class="t2" v-else-if="item.product.sellpoint">{{item.product.sellpoint}}</text>
</view>
<view class="p2">
<text class="t1" :style="{color:t('color1')}"><text
style="font-size:24rpx">¥</text>{{item.product.sell_price}}</text>
<text class="t2"
v-if="item.product.market_price*1 > item.product.sell_price*1">¥{{item.product.market_price}}</text>
</view>
</view>
</view>
<view class="foot">
<text class="flex1">浏览时间:{{item.createtime}}</text>
<text class="btn" @tap="favoritedel" :data-id="item.proid" :data-type="item.type">删除</text>
</view>
</view>
<view class="selTim-box bg-color-white border-rius-5" v-show="showTimSe">
<view class="conm-time-slt ">
<view class="flex flex-w j-between">
<block v-for="(item, ndx) in timeTexList" :key="ndx">
<view :style="timeTexIndx == ndx ? (item.name == '重置'?'':'background: #E2F7EF;color:' + t('color1')) :''" class="tet-l border-rius-5" @click="selcTimTxe(item, ndx)">{{item.name}}</view>
</block>
</view>
<uni-section
:title="'日期范围用法:' + '[' + range + ']'"
type="line"
></uni-section>
<view class="example-body" style="margin-top: 30rpx;">
<uni-datetime-picker
@chang="submit"
v-model="range"
type="daterange"
rangeSeparator="-"
/>
</view>
</view>
</view>
<nomore v-if="nomore"></nomore>
<nodata v-if="nodata" text="暂无足迹"></nodata>
<loading v-if="loading"></loading>
<dp-tabbar :opt="opt"></dp-tabbar>
<popmsg ref="popmsg"></popmsg>
<!-- 悬浮按钮 -->
<drag-button></drag-button>
</view>
</template>
<script>
var app = getApp();
// import mrCalendar from '@/components/mr-calendar/mr-calendar';
export default {
components: {
// mrCalendar
},
data() {
return {
range:'',
timeTex:'',
timeTexIndx: 0,
stime: '',
etime: '',
opt: {},
loading: false,
isload: false,
menuindex: -1,
timeTexList: [],
datalist: [],
pagenum: 1,
nomore: false,
nodata: false,
showTimSe: false, // 选项弹框
timeDate: false,
drawer: true,
show: false,
};
},
onLoad: function(opt) {
this.opt = app.getopts(opt);
this.getdata();
this.setTime();
this.timeTex = this.timeTexList[0].stime.substr(0,10) +" 至 "+ this.timeTexList[0].etime.substr(0,10)
this.stime = this.timeTexList[0].stime.substr(0,10)
this.etime = this.timeTexList[0].etime.substr(0,10)
this.range = [this.stime,this.etime]
},
onPullDownRefresh: function() {
this.getdata();
},
onReachBottom: function() {
if (!this.nodata && !this.nomore) {
this.pagenum = this.pagenum + 1;
this.getdata(true);
}
},
watch: {
datetimesingle(newval) {
console.log("单选:", this.datetimesingle);
},
range(newval) {
console.log("范围选1:", this.range);
this.submit(this.range)
},
datetimerange(newval) {
console.log("范围选:2", this.datetimerange);
},
},
methods: {
setTime() {
let arr = []
let year = new Date().getFullYear();
let month = new Date().getMonth() + 1;
arr.push(this.timeHandle(year,month));
arr[0].name = "本月";
var pre_month;
var pre_year;
if((month-1) == 0) {
pre_month = 12;
pre_year = year - 1;
} else {
pre_month = month - 1;
pre_year = year;
}
arr.push(this.timeHandle(pre_year,pre_month));
arr[1].name = "上月";
arr.push({name:'今年',stime: year + '-01-01',etime: year + '-12-31' });
arr.push({name:'去年',stime: (year-1) + '-01-01',etime: (year-1) + '-12-31' });
arr.push({name:'重置',stime:'',etime:'' })
this.timeTexList = arr
},
timeHandle(year,month) {
let day = new Date(year,month,0).getDate(); // 最后一天
month = month < 10 ? '0' + month : month;
let stime = [year,month,'01'].join('-')
let etime = [year,month,day].join('-')
let time = {name: '',stime: stime,etime: etime};
return time;
},
reset() {
this.stime = '';
this.etime = '';
this.pagenum = 1;
this.getdata()
},
submit(e) {
if(e.length < 2 && e.length > 0) {
uni.showModal({
title: '提示',
content: '请选择结束时间',
showCancel: false
})
setTimeout(()=>{
this.timeDate = true
this.show = true
},100)
return
}
this.timeTex = e[0] + ' 至 ' + e[1]
this.stime = e[0]+' 00:00:00'
this.etime = e[1]+' 23:59:59'
this.showTimSe = false;
this.pagenum = 1;
this.getdata()
},
calclick(e) {
console.log(e, 'calclick')
},
selcTimTxe(item, num) {
if(item.name == '重置') {
this.timeTexIndx = 0
this.timeTex = this.timeTexList[0].stime.substr(0,10) +" 至 "+ this.timeTexList[0].etime.substr(0,10);
this.stime = this.timeTexList[0].stime.substr(0,10)
this.etime = this.timeTexList[0].etime.substr(0,10);
this.range = [this.timeTexList[0].stime.substr(0,10),this.timeTexList[0].etime.substr(0,10)]
}else {
this.timeTexIndx = num
this.timeTex = item.stime.substr(0,10) +" 至 "+ item.etime.substr(0,10);
this.stime = item.stime;
this.etime = item.etime;
this.range = [item.stime.substr(0,10),item.etime.substr(0,10)]
}
this.pagenum = 1;
this.datalist = [];
this.showTimSe = false
this.pagenum = 1;
// this.getdata()
},
disabledDate() {
return false
},
dateShow() {
this.timeDate = true
this.show = true
},
getdata: function(loadmore) {
if (!loadmore) {
this.pagenum = 1;
this.datalist = [];
}
var that = this;
var pagenum = that.pagenum;
var st = that.st;
that.nodata = false;
that.nomore = false;
that.loading = true;
app.post('ApiMy/history', {
st: st,
endTime: this.etime,
startTime: this.stime,
pagenum: pagenum
}, function(res) {
that.loading = false;
var data = res.data;
if (pagenum == 1) {
that.datalist = data;
if (data.length == 0) {
that.nodata = true;
}
that.loaded();
} else {
if (data.length == 0) {
that.nomore = true;
} else {
var datalist = that.datalist;
var newdata = datalist.concat(data);
that.datalist = newdata;
}
}
});
},
favoritedel: function(e) {
var that = this;
var proid = e.currentTarget.dataset.id;
var type = e.currentTarget.dataset.type;
uni.showActionSheet({
itemList: ['删除该项', '清空全部'],
success: function(res) {
if (res.tapIndex >= 0) {
if (res.tapIndex == 1) {
proid = 'all';
}
app.post('ApiMy/historydel', {
proid: proid,
type: type
}, function(data) {
app.success(data.msg);
setTimeout(function() {
that.getdata();
}, 1000);
});
}
}
});
}
}
};
</script>
<style lang="scss">
.container {
background: #F5F5F5;
padding-top: 86rpx;
}
.btn_box {
width: 100%;
margin-top: 20rpx;
display: flex;
// flex-direction: row-reverse;
// justify-content: space-between;
.btn {
// display: inline-block;
background-color: #efbe70;
color: #ffff;
height: 50rpx;
width: 116rpx;
border-radius: 8rpx;
display: flex;
justify-content: center;
align-items: center;
// margin: 0;
}
}
.sizer {
position: fixed;
left: 0;
top: 0;
width: 100%;
padding: 28rpx 24rpx 24rpx;
display: flex;
align-items: center;
color: #999;
background: #F5F5F5;
display: flex;
flex-direction: row-reverse;
.icon-xia {
font-size: 26rpx;
color: #333333;
position: static;
}
}
.flex {
display: flex;
}
.flex1 {
flex: 1;
}
.j-center {
justify-content: center;
}
.j-between {
justify-content: space-between;
}
.j-around {
justify-content: space-around;
}
.j-evenly {
justify-content: space-evenly;
}
.flex-colum {
flex-direction: column;
}
.flex-w {
flex-wrap: wrap;
}
.al-item-center {
align-items: center;
}
.font-w {
font-weight: bold;
}
.fs12 {
font-size: 24rpx;
}
.color-gray {
color: #999;
}
.color-white {
color: #fff;
}
.bg-color-white {
background-color: #fff;
}
.border-rius-r {
border-radius: 800rpx;
}
.border-rius-5 {
border-radius: 10rpx;
}
.border-rius-10 {
border-radius: 20rpx;
}
.overflow-hd {
overflow: hidden;
}
.text-overflow-tx {
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
}
.text-overflow-line {
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
overflow: hidden;
word-wrap: break-word;
word-break: break-all;
}
.myBalance-contx-h-title {
height: 80rpx;
padding: 20rpx 0;
.my-interest-h-title-tx {
padding: 0 10rpx;
position: relative;
}
.actives {
width: 100%;
height: 6rpx;
display: block;
position: absolute;
border-radius: 2rpx;
bottom: -10rpx;
left: 0;
// background-color: #EFBD6F;
}
}
.myBalance-contx-box {
padding: 0 20rpx 20rpx;
width: 100%;
height: calc(100vh - 80rpx);
position: relative;
.myBalance-contx-box-h {
padding: 20rpx;
width: 100%;
height: 170rpx;
position: fixed;
left: 0;
background-color: #f6f6f6;
z-index: 22;
.box-h-t:first-child {
margin-left: 0;
}
.box-h-t {
width: 130rpx;
height: 60rpx;
line-height: 60rpx;
text-align: center;
margin-left: 26rpx;
}
}
.contx-h-2 {
height: 80rpx;
}
.myBalance-contx-box-t {
padding: 20rpx;
box-shadow: 0 0 10rpx 0 #efefef;
margin-top: 30rpx;
}
.myBalance-contx-box-t:first-child {
margin-top: 0;
}
.myBalance-contx-tx {
padding: 20rpx;
box-shadow: 0 0 10rpx 0 #efefef;
margin-top: 30rpx;
.cosu-img {
width: 120rpx;
height: 120rpx;
}
.pt-txt {
padding-top: 6rpx;
}
}
}
// 弹框
.conm-time-slt {
padding: 40rpx 24rpx 32rpx;
.tet-l {
width: 158rpx;
height: 56rpx;
line-height: 56rpx;
text-align: center;
background-color: #F7F7F7;
margin-bottom: 24rpx;
color: #666666;
font-size: 28rpx;
}
.cus-time {
width: 190rpx;
height: 60rpx;
line-height: 60rpx;
text-align: center;
margin-top: 40rpx;
}
}
.selTim-box {
position: fixed;
top: 86rpx;
left: 0;
right: 0;
z-index: 3;
border-radius: 0 0 12rpx 12rpx;
.he-t {
width: 16rpx;
height: 2rpx;
margin-top: 30rpx;
background-color: #ccc;
}
}
.teitDate {
width: 100%;
height: 100%;
position: fixed;
top: 0;
left: 0;
background-color: rgba(0, 0, 0, .4);
z-index: 888;
}
.item {
margin: 0 24rpx 24rpx;
padding: 0 24rpx;
background: #fff;
border-radius: 12rpx;
}
.product-item2 {
display: flex;
padding: 28rpx 0 36rpx;
border-bottom: 1px solid #F4F4F4;
}
.product-item2 .product-pic {
width: 168rpx;
height: 168rpx;
border-radius: 12rpx;
overflow: hidden;
flex-shrink: 0;
}
.product-item2 .product-pic image {
width: 100%;
height: 100%;
}
.product-item2 .product-info {
flex: 1;
margin-left: 24rpx;
}
.product-item2 .product-info .p1 {
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
/* autoprefixer: ignore next */
-webkit-box-orient: vertical;
text-align: justify;
white-space: pre-wrap;
word-break: break-all;
height: 72rpx;
line-height: 36rpx;
font-size: 28rpx;
color: #333333;
}
.product-item2 .product-info .p2 {
font-size: 36rpx;
height: 50rpx;
line-height: 50rpx;
margin-top: 4rpx;
}
.product-item2 .product-info .p2 .t2 {
margin-left: 10rpx;
font-size: 26rpx;
color: #888;
text-decoration: line-through;
}
.product-item2 .product-info .p3 {
font-size: 24rpx;
height: 34rpx;
line-height: 34rpx;
margin-top: 10rpx;
}
.product-item2 .product-info .p3 .t1 {
color: #aaa;
font-size: 24rpx
}
.product-item2 .product-info .p3 .t2 {
color: #888;
font-size: 24rpx;
}
.foot {
display: flex;
align-items: center;
color: #999999;
font-size: 24rpx;
line-height: 34rpx;
padding: 20rpx 0 24rpx;
}
.foot .btn {
min-width: 84rpx;
box-sizing: border-box;
color: #FFFFFF;
text-align: center;
padding: 0 10rpx;
height: 50rpx;
line-height: 50rpx;
background: #EB5330;
border-radius: 8rpx;
}
</style>