chushih
This commit is contained in:
li
@@ -0,0 +1,213 @@
|
||||
<template>
|
||||
<view class="transaction">
|
||||
<u-navbar
|
||||
leftIconColor="#eee"
|
||||
bgColor="#0c0c0d"
|
||||
:placeholder="true"
|
||||
:fixed="true"
|
||||
height="60"
|
||||
@leftClick="back"
|
||||
>
|
||||
<view class="nav" slot="center">
|
||||
<view
|
||||
class="li"
|
||||
:class="{ active: active == 11 }"
|
||||
@tap="chooseNav(11)"
|
||||
>{{ $lang.upperRecord }}</view
|
||||
>
|
||||
<view
|
||||
class="li"
|
||||
:class="{ active: active == 12 }"
|
||||
@tap="chooseNav(12)"
|
||||
>{{ $lang.lowerRecord }}</view
|
||||
>
|
||||
</view>
|
||||
<view class="data-btn" slot="right">
|
||||
<u-icon
|
||||
@tap="showDate = true"
|
||||
name="calendar"
|
||||
color="#eee"
|
||||
size="28"
|
||||
></u-icon>
|
||||
</view>
|
||||
</u-navbar>
|
||||
|
||||
<view class="item" v-for="(item, index) in list" :key="index">
|
||||
<template v-if="active == 11">
|
||||
<view class="box order">
|
||||
{{ $lang.transactionNumber }}： {{ item.OrderNo }}
|
||||
</view>
|
||||
<view class="box amount"
|
||||
>{{ $lang.upSplitAmount }}： {{ item.Money }}</view
|
||||
>
|
||||
<view class="box tiem">
|
||||
{{ $lang.upSplitDate }}： {{ item.CreateTime }}</view
|
||||
>
|
||||
<view class="box tiem">
|
||||
{{ $lang.upSplitState }}： {{ $lang.statusType[item.Status] }}</view
|
||||
>
|
||||
</template>
|
||||
<template v-if="active == 12">
|
||||
<view class="box order">
|
||||
{{ $lang.transactionNumber }}： {{ item.OrderNo }}
|
||||
</view>
|
||||
<view class="box amount"
|
||||
>{{ $lang.downSplitAmount }}： {{ item.Money }}</view
|
||||
>
|
||||
<view class="box tiem">
|
||||
{{ $lang.downSplitDate }}： {{ item.CreateTime }}</view
|
||||
>
|
||||
<view class="box tiem">
|
||||
{{ $lang.downSplitState }}： {{ $lang.statusType[item.Status] }}</view
|
||||
>
|
||||
</template>
|
||||
</view>
|
||||
<u-empty
|
||||
:show="status == 'nomore' && list.length == 0"
|
||||
text=" "
|
||||
marginTop="20%"
|
||||
icon="https://cdn.uviewui.com/uview/empty/data.png"
|
||||
>
|
||||
</u-empty>
|
||||
<u-loadmore :status="status" />
|
||||
<l-calendar
|
||||
v-model="showDate"
|
||||
@change="changeDate"
|
||||
:isRange="true"
|
||||
:maxDate="today"
|
||||
:initStartDate="startTime"
|
||||
:initEndDate="endTime"
|
||||
></l-calendar>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapState } from "vuex";
|
||||
import dayjs from "dayjs";
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
active: 11,
|
||||
status: "loadmore",
|
||||
list: [],
|
||||
page: 1,
|
||||
showDate: false,
|
||||
today: dayjs().format("YYYY-MM-D"),
|
||||
startTime: dayjs().subtract(1, "week").format("YYYY-MM-D"),
|
||||
endTime: dayjs().format("YYYY-MM-D"),
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
...mapState({
|
||||
userInfo: (state) => state.app.userInfo,
|
||||
$lang: (state) => state.app.lang[state.app.language],
|
||||
}),
|
||||
},
|
||||
onLoad() {
|
||||
this.getData("refresh");
|
||||
},
|
||||
onReachBottom() {
|
||||
this.getData("loading");
|
||||
},
|
||||
methods: {
|
||||
chooseNav(nav) {
|
||||
this.active = nav;
|
||||
this.getData("refresh");
|
||||
},
|
||||
changeDate(date) {
|
||||
this.startTime = date.startDate;
|
||||
this.endTime = date.endDate;
|
||||
this.getData("refresh");
|
||||
},
|
||||
getData(type) {
|
||||
if (type == "refresh") {
|
||||
this.list = [];
|
||||
this.page = 1;
|
||||
} else {
|
||||
this.page += 1;
|
||||
}
|
||||
const params = {
|
||||
type: this.active,
|
||||
pageSize: 10,
|
||||
page: this.page,
|
||||
};
|
||||
let start = dayjs(this.startTime).unix(),
|
||||
end = dayjs(this.endTime).unix();
|
||||
|
||||
if (end > start) {
|
||||
params.startTime = start;
|
||||
params.endTime = end + 24 * 60 * 60 * 1000 - 1;
|
||||
} else {
|
||||
params.startTime = end;
|
||||
params.endTime = start + 24 * 60 * 60 * 1000 - 1;
|
||||
}
|
||||
|
||||
this.status = "loading";
|
||||
this.$api
|
||||
.getScorelog(params)
|
||||
.then((res) => {
|
||||
let list = [];
|
||||
if (res.status_code == 200) {
|
||||
console.log(res);
|
||||
list = res?.data?.list || [];
|
||||
} else {
|
||||
this.$toast({
|
||||
message: res.message,
|
||||
duration: 2000,
|
||||
});
|
||||
}
|
||||
if (list.length == 0 || list.length < 10) {
|
||||
this.status = "nomore";
|
||||
}
|
||||
this.list = [...this.list, ...list];
|
||||
})
|
||||
.catch((err) => {
|
||||
this.status = "nomore";
|
||||
console.log(err);
|
||||
});
|
||||
},
|
||||
back() {
|
||||
uni.navigateBack();
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.transaction {
|
||||
/deep/.u-navbar__content__title {
|
||||
color: #eee;
|
||||
font-weight: 600;
|
||||
}
|
||||
.nav {
|
||||
display: flex;
|
||||
color: #959393;
|
||||
border-radius: 5px;
|
||||
overflow: hidden;
|
||||
font-size: 14px;
|
||||
.li {
|
||||
background: #242424;
|
||||
padding: 6px 15px;
|
||||
font-weight: 600;
|
||||
&.active {
|
||||
background: #947b2b;
|
||||
color: #000;
|
||||
}
|
||||
}
|
||||
}
|
||||
.item {
|
||||
color: $u-content-color;
|
||||
font-size: 28rpx;
|
||||
padding: 24rpx 0;
|
||||
border-bottom: 1px solid #38393b;
|
||||
.box {
|
||||
padding: 10rpx 20rpx;
|
||||
word-break: keep-all;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user