Files
jdt-game/src/pages/turntable/records/index.vue
2024-01-19 11:09:55 +08:00

145 lines
3.7 KiB
Vue

<template>
<view class="app">
<template v-if="typeNum === 1">
<view class="card" v-for="(item,index) in list as any[]" :key="index">
<view>
<view>
{{ item.Periods }}期开奖:
<text
:style="{
color: numColor(item.Name),
}"
>
{{ item.Name }}
</text>
</view>
<view>开奖时间: {{ item.DrawTime }}</view>
</view>
</view>
</template>
<template v-else>
<view v-if="list.length > 0">
<view class="card desc" v-for="(item,index) in list as any[]" :key="index">
<view>
<view>{{ item.Periods }}期投注:</view>
<view>
点数:
<text style="color: red">{{ item.Name }}</text>
</view>
<view class="sub">
投注时间:
<text>{{ item.DrawTime }}</text>
</view>
</view>
<view style="text-align: right">
<view style="color: red" v-if="item.State === 1">
+{{ item.DrawNum }}积分
</view>
<view style="color: green">-{{ item.Number }}豆子</view>
</view>
</view>
</view>
<view v-else>
<view style="margin-top: 100px">暂无记录.....</view>
</view>
</template>
</view>
</template>
<script lang="ts" setup>
import { ref } from 'vue'
import Taro from '@tarojs/taro'
const list = ref<any[]>([])
const typeNum = ref(0)
Taro.useLoad((options) => {
typeNum.value = Number(options.type)
Taro.setNavigationBarTitle({
title: options.type === '1' ? '开奖记录' : '投注记录',
})
getData()
})
Taro.usePullDownRefresh(() => {
getData()
})
const numColor = (num: string) => {
switch (num) {
case '大':
return 'red'
case '小':
return 'green'
case '单':
return 'orange'
case '双':
return 'blue'
case '和':
return 'purple'
default:
return 'black'
}
}
const getData = async () => {
if (typeNum.value === 1) {
Taro.request({
url: `${process.env.TARO_APP_TURNTABLE_API}/draw`,
method: 'GET',
success: ({ data: res }) => {
list.value = res.data.data || []
},
})
} else {
Taro.request({
url: `${
process.env.TARO_APP_TURNTABLE_API
}/userTurntableRecord?uid=${Taro.getStorageSync('uid')}`,
method: 'GET',
success: ({ data: res }) => {
list.value = res.data.data || []
},
})
}
Taro.stopPullDownRefresh()
}
</script>
<style lang="scss">
.taro_page {
background-color: #f5f5f5 !important;
}
.app {
display: flex;
flex-direction: column;
align-items: center;
//justify-content: center;
font-size: 35px;
width: 100%;
padding: 10px;
box-sizing: border-box;
}
.card {
width: 95%;
padding: 20px;
background-color: #fff;
margin-top: 10px;
border-radius: 10px;
.sub {
margin-top: 10px;
color: #555555;
}
}
.desc {
display: flex;
justify-content: space-between;
align-items: center;
width: 100%;
}
</style>