|
|
@@ -3,7 +3,7 @@
|
|
|
<view class="content">
|
|
|
<Header>
|
|
|
<template #title
|
|
|
- >ACC <text style="padding: 0 12rpx">|</text>{{address}}</template
|
|
|
+ >ACC <text style="padding: 0 12rpx">|</text>{{ address }}</template
|
|
|
>
|
|
|
</Header>
|
|
|
<view></view>
|
|
|
@@ -17,17 +17,39 @@
|
|
|
</view>
|
|
|
</view>
|
|
|
<view class="home-code">
|
|
|
- <view class="trade-border-box"> $0 </view>
|
|
|
- <view class="trade-border-num">≈￥0</view>
|
|
|
+ <view class="trade-border-box"> ${{ gameDetail.counts }}</view>
|
|
|
+ <view class="trade-border-num">≈￥{{ gameDetail.bonus }}</view>
|
|
|
</view>
|
|
|
<view class="trade-img-box">
|
|
|
<image src="@/static/image/trade/money-box.png" mode="aspectFit" />
|
|
|
</view>
|
|
|
- <view class="trade-process"></view>
|
|
|
+ <view class="trade-process">
|
|
|
+ <view
|
|
|
+ :class="
|
|
|
+ gameCheck == index
|
|
|
+ ? 'trde-process-item-active'
|
|
|
+ : 'trde-process-item'
|
|
|
+ "
|
|
|
+ v-for="(item, index) in gameList"
|
|
|
+ :key="index"
|
|
|
+ @click="selectGame(index, item)"
|
|
|
+ >
|
|
|
+ <view class="trade-game-name">{{ item.title }}</view>
|
|
|
+ <view class="trade-game-time"
|
|
|
+ >{{ dayjs(item.date).format("MM-DD") }}-{{
|
|
|
+ dayjs(item.end_date).format("MM-DD")
|
|
|
+ }}</view
|
|
|
+ >
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
<view class="trade-time-box">
|
|
|
- <view class="time-title"> 距离 <text>赛程 竞赛结束 </text>还有 </view>
|
|
|
+ <view class="time-title">
|
|
|
+ 距离 <text>{{ gameDetail.title }}赛程 竞赛结束 </text>还有
|
|
|
+ </view>
|
|
|
<up-count-down
|
|
|
- :time="30 * 60 * 60 * 1000"
|
|
|
+ :time="
|
|
|
+ dayjs(gameDetail.end_date).valueOf() - dayjs(new Date()).valueOf()
|
|
|
+ "
|
|
|
format="DD:HH:mm:ss"
|
|
|
autoStart
|
|
|
millisecond
|
|
|
@@ -56,8 +78,10 @@
|
|
|
</view>
|
|
|
</up-count-down>
|
|
|
<view class="start-btn">未报名</view>
|
|
|
- <view class="num-txt">奖池数量：<text>$0</text> </view>
|
|
|
- <view class="num-txt-small">≈￥0</view>
|
|
|
+ <view class="num-txt"
|
|
|
+ >奖池数量：<text>${{ gameDetail.counts }}</text>
|
|
|
+ </view>
|
|
|
+ <view class="num-txt-small">≈￥{{ gameDetail.bonus }}</view>
|
|
|
</view>
|
|
|
<view class="game-play-name">赛程名次</view>
|
|
|
<view class="game-list">
|
|
|
@@ -92,20 +116,58 @@
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
- <view class="fix-box" @click="awardFun">
|
|
|
- <view class="fix-item">赛程规则</view>
|
|
|
+ <view class="fix-box">
|
|
|
+ <view class="fix-item" @click="openGamePopup">赛程规则</view>
|
|
|
<view class="fix-item">赛程名次</view>
|
|
|
</view>
|
|
|
+ <!-- @click="awardFun" -->
|
|
|
+ <up-popup
|
|
|
+ :show="showGameMsg"
|
|
|
+ :round="10"
|
|
|
+ mode="center"
|
|
|
+ :closeOnClickOverlay="true"
|
|
|
+ @close="showGameMsg = false"
|
|
|
+ >
|
|
|
+ <view class="show-game-msg">
|
|
|
+ <image
|
|
|
+ class="close-img"
|
|
|
+ src="@/static/image/home/alert-pay-close.png"
|
|
|
+ mode="scaleToFill"
|
|
|
+ @click="showGameMsg=false"
|
|
|
+ />
|
|
|
+ <view class="show-game-title">
|
|
|
+ <text>赛程</text>竞赛消息
|
|
|
+ </view>
|
|
|
+ <view class="show-game-content">
|
|
|
+ <view class="game-msg">1:赛程开始时间：</view>
|
|
|
+ <view class="game-msg">2:赛程结束时间：</view>
|
|
|
+ <view class="game-msg">3:参与场次：<text>0场；</text>输：<text>0局；</text>赢：<text>0局；</text></view>
|
|
|
+ <view class="game-msg">4:排名赢局：<text>0局</text></view>
|
|
|
+ <view class="desc-title">注意：</view>
|
|
|
+ <view class="dest-item">①: 当期赛程信息可能存在延迟,仅供参考;</view>
|
|
|
+ <view class="dest-item">②：如当期赛程奖励未在有效期内领取,将视为放弃；</view>
|
|
|
+ <view class="dest-item">③：赢局次数小于等于0的地址参与排名，但没有奖励分配；</view>
|
|
|
+ <view class="dest-item" style="color:red;">④：每场赛程中相同地址频繁对战,场次将不作为有效局数； </view>
|
|
|
+ <view class="dest-item" style="color:red;">⑤：对于恶意刷单地址,平台将永久封禁账号；</view>
|
|
|
+
|
|
|
+ </view>
|
|
|
+ <view class="show-game-bottom">
|
|
|
+ <view class="show-game-btn" @click="showGameMsg=false">关闭</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </up-popup>
|
|
|
</view>
|
|
|
</template>
|
|
|
|
|
|
<script setup>
|
|
|
import { ref, onMounted, reactive } from "vue";
|
|
|
import Header from "@/components/Header";
|
|
|
-import {getWalletAddress} from "@/utils/utils";
|
|
|
-import { sendSingleReward } from '@/utils/web.js';
|
|
|
+import { getWalletAddress } from "@/utils/utils";
|
|
|
+import { sendSingleReward } from "@/utils/web.js";
|
|
|
+import { matchList, matchRank, matchInfo } from "@/api/game";
|
|
|
+import dayjs from "dayjs";
|
|
|
const timeData = ref({});
|
|
|
-const address = ref('');
|
|
|
+const address = ref("");
|
|
|
// 定义 onChange 方法
|
|
|
const onChange = (e) => {
|
|
|
timeData.value = e;
|
|
|
@@ -113,25 +175,78 @@ const onChange = (e) => {
|
|
|
onMounted(async () => {
|
|
|
const addr = await getWalletAddress();
|
|
|
if (addr) {
|
|
|
- console.log(addr)
|
|
|
+ console.log(addr);
|
|
|
address.value = `${addr.slice(0, 4)}...${addr.slice(-4)}`;
|
|
|
} else {
|
|
|
- address.value = '未连接钱包';
|
|
|
+ address.value = "未连接钱包";
|
|
|
}
|
|
|
});
|
|
|
// 例子 调用合约
|
|
|
-const awardFun = async () =>{
|
|
|
+const awardFun = async () => {
|
|
|
// const privateKey = window.android.getPrivateKey();//app
|
|
|
- const privateKey = '0x4553077da5d773773dad0511c6e5d33142ae2c1bd05a3a8a4a7becbc0d23d9b5';//h5
|
|
|
+ const privateKey =
|
|
|
+ "0x4553077da5d773773dad0511c6e5d33142ae2c1bd05a3a8a4a7becbc0d23d9b5"; //h5
|
|
|
try {
|
|
|
- const result = await sendSingleReward(privateKey,0.01);
|
|
|
- if (result.status === "success") {
|
|
|
- console.log(result)
|
|
|
- }
|
|
|
- } catch (error) {
|
|
|
-
|
|
|
+ const result = await sendSingleReward(privateKey, 0.01);
|
|
|
+ if (result.status === "success") {
|
|
|
+ console.log(result);
|
|
|
+ }
|
|
|
+ } catch (error) {}
|
|
|
+};
|
|
|
+// 获取各种数据
|
|
|
+const gameList = ref([]);
|
|
|
+const getGameMatchList = async () => {
|
|
|
+ let params = {
|
|
|
+ dapp_id: 15,
|
|
|
+ };
|
|
|
+ // 获取游戏赛事列表
|
|
|
+ let res = await matchList(params);
|
|
|
+ if (res.status == 200) {
|
|
|
+ gameList.value = res.data;
|
|
|
+ getGameInfo(res.data[0].id);
|
|
|
+ getGameRank(res.data[0].id);
|
|
|
}
|
|
|
-}
|
|
|
+};
|
|
|
+getGameMatchList();
|
|
|
+// 游戏赛事排行
|
|
|
+const gameRankList = ref([]);
|
|
|
+// 查询游戏赛事排名
|
|
|
+const getGameRank = async (id) => {
|
|
|
+ let params = {
|
|
|
+ dapp_id: 15,
|
|
|
+ match_id: id,
|
|
|
+ };
|
|
|
+ // 获取游戏赛事列表
|
|
|
+ let res = await matchRank(params);
|
|
|
+ if (res.status == 200) {
|
|
|
+ gameRankList.value = res.data;
|
|
|
+ }
|
|
|
+};
|
|
|
+// 游戏详情
|
|
|
+const gameDetail = ref("");
|
|
|
+// 获取游戏赛事详情
|
|
|
+const getGameInfo = async (id) => {
|
|
|
+ let params = {
|
|
|
+ dapp_id: 15,
|
|
|
+ match_id: id,
|
|
|
+ };
|
|
|
+ // 获取游戏赛事列表
|
|
|
+ let res = await matchInfo(params);
|
|
|
+ if (res.status == 200) {
|
|
|
+ gameDetail.value = res.data;
|
|
|
+ }
|
|
|
+};
|
|
|
+const gameCheck = ref(1);
|
|
|
+const selectGame = (value, item) => {
|
|
|
+ gameCheck.value = value;
|
|
|
+ getGameInfo(item.id);
|
|
|
+ getGameRank(item.id);
|
|
|
+};
|
|
|
+// 游戏规则弹出框
|
|
|
+const showGameMsg = ref(false);
|
|
|
+const openGamePopup = () => {
|
|
|
+ showGameMsg.value = true;
|
|
|
+};
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
@@ -259,6 +374,74 @@ const awardFun = async () =>{
|
|
|
background-position: center center;
|
|
|
background-size: 100% 100%;
|
|
|
background-repeat: no-repeat;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
+ .trde-process-item {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ color: #d3bdd9;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ .trade-game-name {
|
|
|
+ font-size: 28rpx;
|
|
|
+ font-weight: 600;
|
|
|
+ }
|
|
|
+ .trade-game-time {
|
|
|
+ font-size: 24rpx;
|
|
|
+ margin-top: 12rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .trde-process-item {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ color: #d3bdd9;
|
|
|
+ overflow: hidden;
|
|
|
+ padding-left: 36rpx;
|
|
|
+ box-sizing: border-box;
|
|
|
+ .trade-game-name {
|
|
|
+ overflow: hidden;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ white-space: nowrap;
|
|
|
+ width: 100%;
|
|
|
+ font-size: 28rpx;
|
|
|
+ font-weight: 600;
|
|
|
+ }
|
|
|
+ .trade-game-time {
|
|
|
+ font-size: 24rpx;
|
|
|
+ margin-top: 12rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .trde-process-item-active {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ color: #4c303a;
|
|
|
+ overflow: hidden;
|
|
|
+ padding-left: 36rpx;
|
|
|
+ box-sizing: border-box;
|
|
|
+ .trade-game-name {
|
|
|
+ overflow: hidden;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ white-space: nowrap;
|
|
|
+ width: 100%;
|
|
|
+ font-size: 28rpx;
|
|
|
+ font-weight: 600;
|
|
|
+ }
|
|
|
+ .trade-game-time {
|
|
|
+ font-size: 24rpx;
|
|
|
+ margin-top: 12rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
.trade-time-box {
|
|
|
margin: 24rpx 0;
|
|
|
@@ -394,5 +577,74 @@ const awardFun = async () =>{
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
+.show-game-msg {
|
|
|
+ background: #000;
|
|
|
+ border-radius: 25rpx;
|
|
|
+ padding: 30rpx;
|
|
|
+ box-sizing: border-box;
|
|
|
+ width: 80vw;
|
|
|
+ height: 60vh;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ position: relative;
|
|
|
+ .close-img{
|
|
|
+ width: 50rpx;
|
|
|
+ height: 50rpx;
|
|
|
+ position: absolute;
|
|
|
+ right: 0;
|
|
|
+ top: 0;
|
|
|
+ }
|
|
|
+ .show-game-title {
|
|
|
+ flex-shrink: 0;
|
|
|
+ font-size: 32rpx;
|
|
|
+ font-weight: 700;
|
|
|
+ margin-bottom: 35rpx;
|
|
|
+ text-align: center;
|
|
|
+ color: #fff;
|
|
|
+ text{
|
|
|
+ color: rgb(255, 214, 0);
|
|
|
+ margin-right: 10rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .show-game-content {
|
|
|
+ padding-bottom: 24rpx;
|
|
|
+ box-sizing: border-box;
|
|
|
+ overflow-y: auto;
|
|
|
+ flex: 1;
|
|
|
+ font-size: 28rpx;
|
|
|
+ font-weight: 700;
|
|
|
+ color: #fff;
|
|
|
+ .game-msg{
|
|
|
+ color: #f1dc00;
|
|
|
+ font-size: 26rpx;
|
|
|
+ margin-bottom: 6rpx;
|
|
|
+ text{
|
|
|
+ color: #fff;
|
|
|
+ font-weight: 600;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .desc-title{
|
|
|
+ padding: 12rpx 0;
|
|
|
+ box-sizing: border-box;
|
|
|
+ }
|
|
|
+ .dest-item{
|
|
|
+ font-weight: 400;
|
|
|
+ margin-bottom: 6rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .show-game-bottom {
|
|
|
+ width: 100%;
|
|
|
+ flex-shrink: 0;
|
|
|
+ .show-game-btn{
|
|
|
+ background: linear-gradient(90deg, rgba(0, 179, 170, .7) 0, #00b3aa);
|
|
|
+ color: #fff;
|
|
|
+ height: 80rpx;
|
|
|
+ border-radius:8rpx ;
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
</style>
|
|
|
|
jianghaili
