This commit is contained in:
yuyongdong 2024-04-10 20:36:24 +08:00
commit 44739ec674
7 changed files with 209 additions and 168 deletions

View File

@ -13,3 +13,5 @@ VUE_APP_NFT_URL = '0x59e751c2037B710090035B6ea928e0cce80aC03f'
VUE_APP_BEB_URL = '0x1304E6AA241eE3C9ea44Db9e593e85Ae76eC41F1' VUE_APP_BEB_URL = '0x1304E6AA241eE3C9ea44Db9e593e85Ae76eC41F1'
VUE_APP_CHAIN_ID = '5611' VUE_APP_CHAIN_ID = '5611'
VUE_APP_APP_NAME = 'CF UAW'

View File

@ -12,3 +12,5 @@ VUE_APP_NFT_URL = '0x59e751c2037B710090035B6ea928e0cce80aC03f'
VUE_APP_BEB_URL = '0x1304E6AA241eE3C9ea44Db9e593e85Ae76eC41F1' VUE_APP_BEB_URL = '0x1304E6AA241eE3C9ea44Db9e593e85Ae76eC41F1'
VUE_APP_CHAIN_ID = '5611' VUE_APP_CHAIN_ID = '5611'
VUE_APP_APP_NAME = 'CF UAW'

View File

@ -14,7 +14,6 @@
</noscript> </noscript>
<div id="app"></div> <div id="app"></div>
<!-- built files will be auto injected --> <!-- built files will be auto injected -->
<script src="https://www.google.com/recaptcha/api.js?render=6Ld3xoIpAAAAABW7f5ImgAC6GcWLeDCbt5HPXqe2"></script>
<script th:inline="javascript"> <script th:inline="javascript">
/** /**
* 加载外部js * 加载外部js

View File

@ -0,0 +1,81 @@
<template>
<el-button class="mybtn" :loading="timeLeft > 0" @click="beginAction">{{ timeLeft > 0 ? timeLeft + 's' : title }}</el-button>
</template>
<script>
import {
apiCheckActivity,
} from "@/utils/webapi.js";
export default {
props: {
title: String,
time: String,
dataid: String
},
data() {
return {
timeLeft: 0,
}
},
methods: {
async beginAction() {
try {
let { errcode, data } = await apiCheckActivity(this.dataid);
if (errcode !== 0) {
this.beginCountdown();
return;
}
if (data.status === 2) {
this.$emit('stateupdate', data.status);
return;
}
this.beginCountdown();
} catch (err) {
console.log(err);
this.beginCountdown();
}
},
beginCountdown() {
this.timeLeft = parseInt(this.time);
let timer = setInterval(() => {
this.timeLeft--;
if (this.timeLeft <= 0) {
clearInterval(timer);
}
}, 1000);
}
}
}
</script>
<style lang="scss" scoped>
.mybtn{
width: 90px;
height: 30px;
line-height: 0!important;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50% , -50%);
background: #fec25d;
background: url('@/assets/home/ButtonFollow.png') no-repeat;
background-size: 100% 100%;
color: unset;
border: none;
}
.mybtn:disabled{
color:unset;
border: none;
line-height: 0!important;
}
.mybtn.is-loading:before{
background-color: unset;
}
</style>
<style lang="scss">
.mybtn .el-icon-loading{
line-height: 0!important;
}
</style>

View File

@ -9,18 +9,8 @@
</div> </div>
<div class="dialog-content"> <div class="dialog-content">
<p>Connect your wallet to start your Counter Fire journey</p> <p>Connect your wallet to start your Counter Fire journey</p>
<div class="wallet-content" v-if="isWallet != null">
<li v-for="(item, index) in walletList" :key="index" @click="getLinkWallet(item.value)"> <div class="wallet-content">
<div class="disconnect" v-if="index == 2">
<span>{{ item.name }}</span>
</div>
<div v-else>
<img :src="item.imgUrl" alt />
<span>{{ item.name }}</span>
</div>
</li>
</div>
<div class="wallet-content" v-else>
<li <li
v-for="(item, index1) in isWalletList" v-for="(item, index1) in isWalletList"
:key="index1" :key="index1"
@ -31,6 +21,11 @@
<span>{{ item.name }}</span> <span>{{ item.name }}</span>
</div> </div>
</li> </li>
<li @click="disconnect" v-if="isWallet">
<div class="disconnect">
<span>Disconnect</span>
</div>
</li>
</div> </div>
</div> </div>
</el-dialog> </el-dialog>
@ -38,12 +33,7 @@
</template> </template>
<script> <script>
import Web3 from 'web3'; import { isWalletConnected, linkWallet, disconnectLink, loginWithEthereum } from './../../wallet/index.js';
import { loginNonce, hexToBase58, aesEncrypt, loginWithSignature } from './../../utils/webapi.js'
import { isWalletConnected, linkWallet, disconnectLink, addNetwork } from './../../wallet/index.js';
import { SiweMessage } from './../../utils/siwe.js'
import { GlobalData } from './../../utils/GlobalData.js'
import { parseTokenData } from './../../utils/utils.js'
import { setToken, getToken } from './../../utils/cookies.js' import { setToken, getToken } from './../../utils/cookies.js'
export default { export default {
@ -52,27 +42,6 @@ export default {
}, },
data() { data() {
return { return {
walletList: [
{
name: "MetaMask",
value: "ethereum",
imgUrl: require("./../../assets/home/icon_metaMask.png")
},
{
name: "OKXwallet",
value: "okxwallet",
imgUrl: require("./../../assets/home/icon_OKXwallet.png")
// },
// {
// name: "WalletConnect",
// value: "connect",
// imgUrl: require("./../../assets/home/icon_ConnectWallet.png")
},
{
name: "Disconnect",
value: "disconnect"
}
],
isWalletList: [ isWalletList: [
{ {
name: "MetaMask", name: "MetaMask",
@ -90,7 +59,7 @@ export default {
// imgUrl: require("./../../assets/home/icon_ConnectWallet.png") // imgUrl: require("./../../assets/home/icon_ConnectWallet.png")
} }
], ],
isWallet: localStorage.getItem('walletName'), isWallet: !!localStorage.getItem('walletName'),
myAddress: '', myAddress: '',
activity: 'uaw_activity', activity: 'uaw_activity',
}; };
@ -100,97 +69,30 @@ export default {
methods: { methods: {
// //
async getLinkWallet(val) { async getLinkWallet(val) {
// await addNetwork(val) // const currentWalletName = localStorage.getItem('walletName')
// return // if(currentWalletName) {
if(localStorage.getItem('walletName')) { // await disconnectLink(currentWalletName)
let res = await linkWallet(val) // }
this.myAddress = res
localStorage.setItem('walletName',val)
localStorage.setItem('myAddress',res)
this.handleClose()
this.getWalletConnected()
} else {
disconnectLink(val)
if(val == 'connect') {
this.handleClose()
let res = await linkWallet(val)
localStorage.setItem('walletName',val)
localStorage.setItem('myAddress',res)
this.myAddress = res
} else if(val == "disconnect") {
this.logOut()
} else {
let res = await linkWallet(val) let res = await linkWallet(val)
this.handleClose() this.handleClose()
localStorage.setItem('walletName',val) localStorage.setItem('walletName',val)
localStorage.setItem('myAddress',res) localStorage.setItem('myAddress',res)
this.myAddress = res this.myAddress = res
await this.getWalletConnected() await this.getWalletConnected()
} },
} async disconnect() {
let walletName = localStorage.getItem('walletName')
await disconnectLink(walletName)
this.logOut()
this.isWallet = false
location.reload()
}, },
// //
async getWalletConnected() { async getWalletConnected() {
let token = await loginWithEthereum(this.activity)
const provider = window.ethereum; await this.getUserState(token)
let ethereum = window.ethereum;
var web3 = new Web3(provider);
if (ethereum) {
if(localStorage.getItem("walletName") == 'ethereum') {
ethereum.request({ method: "eth_requestAccounts" });
} else if(localStorage.getItem("walletName") == 'okxwallet') {
okxwallet.request({ method: "eth_requestAccounts" });
console.log('这里')
}
const address = web3.utils.toChecksumAddress(this.myAddress);
// return
let chainId = await web3.eth.getChainId();
chainId = parseInt(chainId);
// console.log(chainId, "----");
const nonce = await loginNonce(address);
// console.log(nonce, "nonce-------------");
const nonceStr = `${nonce}|okx`;
const nonceEncrypt = hexToBase58(
aesEncrypt(nonceStr, "uaw_activity")
);
const message = new SiweMessage({
domain: document.location.host,
address: address,
chainId,
uri: document.location.origin,
version: "1",
statement: "Tasks test",
nonce: nonceEncrypt
});
let msgSign = message.toMessage();
let signature = await provider.request({
method: "personal_sign",
params: [web3.utils.utf8ToHex(msgSign), address]
});
let resLogin = await loginWithSignature(
message,
signature,
this.activity
);
console.log(resLogin.errcode,'61')
if (!resLogin.errcode) {
new GlobalData().token = resLogin.data.token;
this.token = resLogin.data.token;
localStorage.setItem("token", resLogin.data.token);
localStorage.setItem(
`${this.TOKEN_KEY}+ ${address}`,
resLogin.data.token
);
setToken(resLogin.data.token)
// console.log(resLogin.data.token);
console.log(parseTokenData(resLogin.data.token),'------------------');
this.getUserState(resLogin.data.token)
}
} else {
console.log("Please install the MetaMask plugin");
}
}, },
// //
getUserState(token) { getUserState(token) {

View File

@ -112,7 +112,7 @@
</li> </li>
</div> </div>
<div class="wallet" @click="onWalletLogin"> <div class="wallet" @click="onWalletLogin">
<span v-if="!myAddress">X Connected</span> <span v-if="!token">X Connected</span>
<div <div
class="wallet-address" class="wallet-address"
v-else v-else
@ -164,24 +164,15 @@
<p>{{ item.desc }}</p> <p>{{ item.desc }}</p>
</div> </div>
</div> </div>
<div v-if="token" class="btn"> <div v-if="token != null" class="btn">
<div class="is-btn" v-if="item.task == 'TwitterConnect'"> <div class="is-btn">
<div v-if="item.status == 0 || item.status == 1" class="started" @click="toPost(item)">Connect</div> <div v-if="item.status == 0" class="started" @click="toPost(item)">{{ item.actionTitle }}</div>
<div v-if="item.status == 2" class="claim" @click="getTaskClaim(item.id)">Claim</div> <CheckBtn v-if="item.status == 1" @stateupdate="toCheck" :dataid="item.id" time="10" title="Check" class="started">Check</CheckBtn>
<div v-if="item.status == 3" class="success">+{{ item.score }} <img src="./../../assets/home/Checkmark.png" alt=""></div>
</div>
<div class="is-btn" v-if="item.task == 'TwitterFollow'">
<div v-if="item.status == 0 || item.status == 1" class="started" @click="toPost(item)">Follow</div>
<div v-if="item.status == 2" class="claim" @click="getTaskClaim(item.id)">Claim</div>
<div v-if="item.status == 3" class="success">+{{ item.score }} <img src="./../../assets/home/Checkmark.png" alt=""></div>
</div>
<div class="is-btn" v-if="item.task == 'TwitterRetweet'">
<div v-if="item.status == 0 || item.status == 1" class="started" @click="toPost(item)">Retweet</div>
<div v-if="item.status == 2" class="claim" @click="getTaskClaim(item.id)">Claim</div> <div v-if="item.status == 2" class="claim" @click="getTaskClaim(item.id)">Claim</div>
<div v-if="item.status == 3" class="success">+{{ item.score }} <img src="./../../assets/home/Checkmark.png" alt=""></div> <div v-if="item.status == 3" class="success">+{{ item.score }} <img src="./../../assets/home/Checkmark.png" alt=""></div>
</div> </div>
</div> </div>
<LinkBtn v-else text="Connect Wallet" /> <div class='light-btn' v-else @click="onWalletLogin">Connect Wallet</div>
</li> </li>
</div> </div>
<div class="tips"> <div class="tips">
@ -488,35 +479,29 @@ import Calen from "./calenView.vue";
import BoxBtm from './boxBtm.vue' import BoxBtm from './boxBtm.vue'
// import ImgView from './../../components/imgView.vue' // import ImgView from './../../components/imgView.vue'
import gameView from "./gameView.vue"; import gameView from "./gameView.vue";
import LinkBtn from "@/components/linkButton/linkBtnView.vue"; import CheckBtn from "@/components/checkBtn.vue";
import WalletDialog from "./../../components/walletDialog/index.vue"; import WalletDialog from "@/components/walletDialog/index.vue";
import Web3 from "web3"; import { getToken } from '@/utils/cookies.js'
import { getToken } from './../../utils/cookies.js' import { getWalletAddress, isWalletConnected, linkWallet } from "@/wallet/index.js";
import { getWalletAddress, isWalletConnected, linkWallet } from "./../../wallet/index.js";
import { import {
apiGameStat,
apiBeginActivity, apiBeginActivity,
apiCheckActivity, apiCheckActivity,
apiTaskClaim, apiTaskClaim,
apiUsercheckin,
apiProgress,
apiCheckinClaim, apiCheckinClaim,
apiCheckinClaimSeq, apiCheckinClaimSeq,
apiGameStep,
checkReCaptcha, checkReCaptcha,
retweetTwitter, retweetTwitter,
} from "./../../utils/webapi.js"; } from "./../../utils/webapi.js";
import { sendDailyCheckIn, sendClaimTask, sendHelp, sendExplore } from "./../../utils/chainapi.js"; import { sendDailyCheckIn, sendClaimTask, sendHelp } from "./../../utils/chainapi.js";
import CryptoJS from "crypto-js";
export default { export default {
components: { components: {
// Zillionaire, // Zillionaire,
Calen, Calen,
LinkBtn,
gameView, gameView,
WalletDialog, WalletDialog,
BoxBtm, BoxBtm,
CheckBtn
// ImgView, // ImgView,
}, },
data() { data() {
@ -638,7 +623,16 @@ export default {
.then(res => { .then(res => {
// if (res.data.errcode == 0) { // if (res.data.errcode == 0) {
this.activityName = res.data.data.name; this.activityName = res.data.data.name;
this.activeList = res.data.data.tasks; const actionTitles = {
TwitterConnect: "Connect",
TwitterFollow: "Follow",
TwitterRetweet: "Retweet",
};
this.activeList.length = 0
for (let data of res.data.data.tasks) {
data.actionTitle = actionTitles[data.task] || 'Proceed'
this.activeList.push(data)
}
this.activityData = res.data.data this.activityData = res.data.data
// } // }
}) })
@ -668,7 +662,7 @@ export default {
async toPost(data) { async toPost(data) {
let res = await apiBeginActivity(data.id); let res = await apiBeginActivity(data.id);
if(res.errcode == 0) { if(res.errcode == 0) {
this.getActivitrStatue(data.id) this.getProgress()
// console.log("", res, data); // console.log("", res, data);
} }
if (data.task == "TwitterConnect") { if (data.task == "TwitterConnect") {
@ -679,10 +673,14 @@ export default {
retweetTwitter(data.desc) retweetTwitter(data.desc)
} }
}, },
//
async toCheck() {
await this.getProgress()
},
// //
async getActivitrStatue(id) { async getActivitrStatue(id) {
let res = await apiCheckActivity(id); await apiCheckActivity(id);
this.getProgress() await this.getProgress()
// console.log(res, "------------------"); // console.log(res, "------------------");
}, },
loginTwitter() { loginTwitter() {
@ -2162,6 +2160,9 @@ export default {
} }
} }
} }
.light-btn{
cursor: pointer;
}
.Explore-dialog { .Explore-dialog {
} }

View File

@ -1,6 +1,12 @@
import Web3 from 'web3' import Web3 from 'web3'
import { toHexChainId } from '@/utils/utils' import { toHexChainId } from '@/utils/utils'
import { loginNonce, hexToBase58, aesEncrypt, loginWithSignature } from '@/utils/webapi.js'
import { SiweMessage } from '@/utils/siwe.js'
import { GlobalData } from '@/utils/GlobalData.js'
import { parseTokenData } from '@/utils/utils.js'
import { setToken } from '@/utils/cookies.js'
// Wallet Connect初始化 // Wallet Connect初始化
@ -47,18 +53,18 @@ const connectWc = async() => {
}); });
return wc return wc
} }
let provider = null let provider = window.provider || null
export async function getWalletAddress() { export async function getWalletAddress() {
const web3 = await provider.request({ const res = await provider.request({
method: 'eth_accounts' method: 'eth_accounts'
}) })
if (web3 !== 'undefined') { if (res !== 'undefined') {
if (web3[0] == '') { if (res[0] == '') {
return false return false
} else { } else {
return await web3[0] return await res[0]
} }
} }
} }
@ -146,7 +152,7 @@ export const changeChain = async() => {
}; };
// 链接钱包 // 链接钱包
export const linkWallet = async(name) => { export async function linkWallet(name){
if(name == "ethereum") { if(name == "ethereum") {
provider = window.ethereum provider = window.ethereum
} else if(name == "okxwallet") { } else if(name == "okxwallet") {
@ -154,10 +160,12 @@ export const linkWallet = async(name) => {
} else if(name == "connect") { } else if(name == "connect") {
provider = await connectWc() provider = await connectWc()
} }
window.provider = provider
let res = await provider.request({ method: "eth_requestAccounts" }) let res = await provider.request({ method: "eth_requestAccounts" })
return res[0] return res[0]
// location.reload() // location.reload()
}; }
// 断开链接 // 断开链接
export async function disconnectLink(name) { export async function disconnectLink(name) {
@ -197,6 +205,52 @@ export async function isWalletConnected() {
// 添加网络 // 添加网络
export async function addNetwork(name) { export async function addNetwork() {
changeChain() changeChain()
} }
export async function loginWithEthereum(activity) {
const web3 = new Web3(provider)
let address = await getWalletAddress()
address = web3.utils.toChecksumAddress(address);
// return
let chainId = await web3.eth.getChainId();
chainId = parseInt(chainId);
// console.log(chainId, "----");
const nonce = await loginNonce(address);
// console.log(nonce, "nonce-------------");
const nonceStr = `${nonce}|okx`;
const nonceEncrypt = hexToBase58(
aesEncrypt(nonceStr, "uaw_activity")
);
const message = new SiweMessage({
domain: document.location.host,
address: address,
chainId,
uri: document.location.origin,
version: "1",
statement: process.env.VUE_APP_APP_NAME,
nonce: nonceEncrypt
});
let msgSign = message.toMessage();
let signature = await provider.request({
method: "personal_sign",
params: [web3.utils.utf8ToHex(msgSign), address]
});
let resLogin = await loginWithSignature(
message,
signature,
activity
);
console.log(resLogin.errcode,'61')
if (!resLogin.errcode) {
new GlobalData().token = resLogin.data.token;
localStorage.setItem("token", resLogin.data.token);
setToken(resLogin.data.token)
// console.log(resLogin.data.token);
console.log(parseTokenData(resLogin.data.token),'------------------');
return resLogin.data.token;
} else {
throw new Error(resLogin.errmsg);
}
}