333 lines
8.7 KiB
Vue
333 lines
8.7 KiB
Vue
<template>
|
||
<view class="game">
|
||
<u-navbar
|
||
leftIconColor="#eee"
|
||
bgColor="#0c0c0d"
|
||
:placeholder="true"
|
||
:fixed="true"
|
||
height="60"
|
||
@leftClick="back"
|
||
>
|
||
<view class="nav" slot="center" @tap="show = true">
|
||
<text>{{ active.name }}</text>
|
||
<u-icon
|
||
class="icon"
|
||
name="arrow-down-fill"
|
||
color="#959393"
|
||
size="13"
|
||
></u-icon>
|
||
</view>
|
||
<view class="data-btn" slot="right">
|
||
<u-icon
|
||
v-if="active.game_id == 100"
|
||
@tap="showDate = true"
|
||
name="calendar"
|
||
color="#eee"
|
||
size="28"
|
||
></u-icon>
|
||
<text v-else class="rigt-text">{{ $lang.weekRecord }}</text>
|
||
</view>
|
||
</u-navbar>
|
||
<view class="item" v-for="(item, index) in list" :key="index">
|
||
<template v-if="active.game_id == 100">
|
||
<view class="box"> {{ $lang.gameName }}： {{ item.GameName }} </view>
|
||
<view class="box">{{ $lang.roomNo }}： {{ item.ChildGameID }}</view>
|
||
<view class="box">{{ $lang.totalBetting }}： {{ item.AllBet }}</view>
|
||
<view class="box">{{ $lang.winLose }}： {{ item.ValidBet }}</view>
|
||
<view class="box" v-if="item.Tax > 0"
|
||
>{{ $lang.taxation }}： {{ item.Tax }}</view
|
||
>
|
||
<view class="box"> {{ $lang.date }}： {{ item.createTime }}</view>
|
||
</template>
|
||
<template v-else>
|
||
<view class="box">
|
||
{{ $lang.tableNumber }}： {{ item.table_name }}
|
||
</view>
|
||
<view class="box">{{ $lang.playingMethod }}： {{ item.user_bet }}</view>
|
||
<view class="box" v-if="item.ximaliang"
|
||
>{{ $lang.ximaliang }}： {{ item.ximaliang }}</view
|
||
>
|
||
<view class="box" v-if="item.maliang"
|
||
>{{ $lang.maliang }}： {{ item.maliang }}</view
|
||
>
|
||
<view class="box">{{ $lang.result }}： {{ item.card_result }}</view>
|
||
<view class="box">{{ $lang.winLose }}： {{ item.win_total }}</view>
|
||
<view class="box">{{ $lang.date }}： {{ item.create_time }}</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" />
|
||
<view class="ft" v-if="active.game_id != 100">
|
||
<view class="text"> {{ $lang.common }}{{ num }}{{ $lang.strip }}</view>
|
||
<view class="text"> {{ $lang.totalBetting }} {{ alldown }} </view>
|
||
<view class="text"> {{ $lang.totalWin }} {{ allwin }} </view>
|
||
</view>
|
||
<view class="mb60"></view>
|
||
<l-calendar
|
||
v-model="showDate"
|
||
@change="changeDate"
|
||
:isRange="true"
|
||
:maxDate="today"
|
||
:initStartDate="startTime"
|
||
:initEndDate="endTime"
|
||
></l-calendar>
|
||
<u-picker
|
||
:title="$lang.gameType"
|
||
closeOnClickOverlay
|
||
:show="show"
|
||
:columns="$lang.gameList"
|
||
:cancelText="$lang.cancel"
|
||
:confirmText="$lang.confirm"
|
||
keyName="name"
|
||
@close="show = false"
|
||
@cancel="show = false"
|
||
@confirm="chooseNav"
|
||
></u-picker>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import { mapState } from "vuex";
|
||
import dayjs from "dayjs";
|
||
export default {
|
||
data() {
|
||
return {
|
||
status: "loadmore",
|
||
list: [],
|
||
page: 1,
|
||
num: 0,
|
||
pagenum: 0,
|
||
alldown: 0,
|
||
allwin: 0,
|
||
show: false,
|
||
showDate: false,
|
||
today: dayjs().format("YYYY-MM-D"),
|
||
startTime: dayjs().subtract(3, "day").format("YYYY-MM-D"),
|
||
endTime: dayjs().format("YYYY-MM-D"),
|
||
active: {},
|
||
};
|
||
},
|
||
computed: {
|
||
...mapState({
|
||
userInfo: (state) => state.app.userInfo,
|
||
$lang: (state) => state.app.lang[state.app.language],
|
||
}),
|
||
},
|
||
onLoad() {
|
||
this.active = this.$lang.gameList[0][0];
|
||
console.log(this.$lang.gameList);
|
||
this.getData("refresh");
|
||
},
|
||
onReachBottom() {
|
||
if (this.status != "nomore") {
|
||
this.getData("loading");
|
||
}
|
||
},
|
||
methods: {
|
||
chooseNav(nav) {
|
||
this.active = nav.value[0];
|
||
this.show = false;
|
||
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;
|
||
}
|
||
this.status = "loading";
|
||
if (this.active.game_id == 100) {
|
||
this.getGamelog();
|
||
} else {
|
||
this.getUserBets();
|
||
}
|
||
},
|
||
getUserBets() {
|
||
const params = {
|
||
user_id: this.userInfo.id,
|
||
api_token: this.userInfo.api_token,
|
||
game_id: this.active.game_id,
|
||
page: this.page,
|
||
time_interval: 3,
|
||
};
|
||
this.$api
|
||
.getUserBets(params)
|
||
.then((res) => {
|
||
let list = [];
|
||
if (res.Success == 1) {
|
||
const data = res.Data;
|
||
list = res?.Data?.bet_info || [];
|
||
this.num = data.bet_num || 0;
|
||
this.pagenum = data.page_num || 0;
|
||
this.alldown = data.bet_list_amount || 0;
|
||
this.allwin = data.bet_list_wintotal || 0;
|
||
} else {
|
||
this.$toast({
|
||
message: res.Msg,
|
||
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);
|
||
})
|
||
.finally(() => {});
|
||
},
|
||
getRobBet() {
|
||
const params = {
|
||
// user_id: this.userInfo.id,
|
||
// api_token: this.userInfo.api_token,
|
||
// game_id: this.active.game_id,
|
||
// page: this.page,
|
||
// time_interval: 3,
|
||
// user_id: this.userInfo.id,
|
||
// api_token: this.userInfo.api_token,
|
||
// game_id: this.type,
|
||
// page: this.robpage,
|
||
// number_tab_id: number_tab_id,
|
||
};
|
||
getRobBet(params)
|
||
.then((res) => {
|
||
if (res.Success == 1) {
|
||
const data = res.Data;
|
||
console.log(data);
|
||
// this.showRob = true;
|
||
// this.robTitle = title;
|
||
// this.robData = data.bet_info;
|
||
// this.robnum = data.bet_num;
|
||
// this.robpagenum = data.page_num;
|
||
// this.roballdown = data.bet_list_amount;
|
||
// this.roballwin = data.bet_list_wintotal;
|
||
} else {
|
||
// console.log(data)
|
||
}
|
||
})
|
||
.catch((err) => {
|
||
console.log(err);
|
||
});
|
||
},
|
||
getGamelog() {
|
||
const params = {
|
||
pageSize: 10,
|
||
page: this.page,
|
||
// startTime: dayjs(this.startTime).unix(),
|
||
// endTime: dayjs(this.endTime).unix(),
|
||
};
|
||
|
||
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.$api
|
||
.getGamelog(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>
|
||
.game {
|
||
height: calc(100vh - 40px);
|
||
::v-deep .u-navbar__content__title {
|
||
color: #eee;
|
||
font-weight: 600;
|
||
}
|
||
.nav {
|
||
display: flex;
|
||
border-radius: 5px;
|
||
overflow: hidden;
|
||
font-size: 16px;
|
||
color: #947b2b;
|
||
font-weight: 600;
|
||
display: flex;
|
||
align-items: center;
|
||
.icon {
|
||
padding-left: 5px;
|
||
}
|
||
}
|
||
.rigt-text {
|
||
color: #999;
|
||
font-size: 12px;
|
||
}
|
||
.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;
|
||
}
|
||
}
|
||
.ft {
|
||
position: fixed;
|
||
bottom: 0;
|
||
left: 0;
|
||
width: 100%;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
padding: 10px 20px;
|
||
background: #0c0c0d;
|
||
color: #947b2b;
|
||
box-sizing: border-box;
|
||
font-size: 14px;
|
||
}
|
||
.mb60 {
|
||
width: 100%;
|
||
height: 60px;
|
||
}
|
||
}
|
||
</style>
|