修改文案页面布局

.env.development

@@ -1,7 +1,9 @@
 VITE_BASE_API='https://oauth-svr.cebggame.com/mint'
 VITE_GPAL_API='http://192.168.100.83:4000/sns'
+# VITE_GPAL_ROUTER='https://vlpwkzon-testflight.counterfire.games'
+VITE_GPAL_ROUTER='https://mint.kingsome.cn/'
 VITE_TOKENID_ID='0x34a1'
 VITE_ERC_ADDRESS='0xFd42bfb03212dA7e1A4608a44d7658641D99CF34'
 VITE_CFNFT_ADDRESS='0xaa34B79A0Ab433eaC900fB3CB9f191F5Cd27501D'
 VITE_CLAIM_ADDRESS='0xf45702180314187a3549FEDac3B78349b47ca6A0'
-VITE_CLAIMWL_ADDRESS='0x31f29c9a3d0c1c13c825475aebf0d964b5b47c45'
+VITE_CLAIMWL_ADDRESS='0x20204A3df0c3191Ee93f4DB328Ca92aEe148Ce24'

.env.production

@@ -1,5 +1,6 @@
 VITE_BASE_API='https://oauth-svr.cebggame.com/mint'
 VUE_APP_GPAL_API='http://192.168.100.83:4000/sns'
+VITE_GPAL_ROUTER='http://localhost:5173'
 VITE_TOKENID_ID='0x34a1'
 VITE_ERC_ADDRESS='0xFd42bfb03212dA7e1A4608a44d7658641D99CF34'
 VITE_CFNFT_ADDRESS='0xaa34B79A0Ab433eaC900fB3CB9f191F5Cd27501D'

.env.text

@@ -0,0 +1,8 @@
+VITE_BASE_API='https://oauth-svr.cebggame.com/mint'
+VITE_GPAL_API='http://192.168.100.83:4000/sns'
+VITE_GPAL_ROUTER='http://localhost:5173'
+VITE_TOKENID_ID='0x34a1'
+VITE_ERC_ADDRESS='0xFd42bfb03212dA7e1A4608a44d7658641D99CF34'
+VITE_CFNFT_ADDRESS='0xaa34B79A0Ab433eaC900fB3CB9f191F5Cd27501D'
+VITE_CLAIM_ADDRESS='0xf45702180314187a3549FEDac3B78349b47ca6A0'
+VITE_CLAIMWL_ADDRESS='0x20204A3df0c3191Ee93f4DB328Ca92aEe148Ce24'

package.json

@@ -4,6 +4,7 @@
   "version": "0.0.0",
   "type": "module",
   "scripts": {
+    "text": "vite --host --mode text",
     "dev": "vite --host --mode development",
     "build": "vite build --mode development",
     "build:prod": "vite build --mode production",

src/App.vue

@@ -1,5 +1,5 @@
 <template>
-  <div>
+  <div id="app">
     <HelloWorld />
     <FooterView />
 </div>
@@ -11,7 +11,7 @@ import HelloWorld from "./view/mintIndex.vue";
 import FooterView from "./components/footerView.vue";
 </script>
 
-<style scoped>
+<style  lang="scss" scoped>
 #app {
   font-family: Avenir, Helvetica, Arial, sans-serif;
   -webkit-font-smoothing: antialiased;

src/components/starTimer.vue

@@ -11,6 +11,10 @@ const props = defineProps({
     type: String,
     required: true,
   },
+  openNft: {
+    type: Number,
+    required: true,
+  }
 });
 let remainingTime = ref(0); // 24小时 = 86400秒
 const day = ref(0);
@@ -23,7 +27,7 @@ const starTimer = () => {
   let nowTime = new Date().getTime();
   // let str = localStorage.getItem(`openTime${props.getAddress}`)
   // let strTime = (1718098200000 - nowTime) / 1000
-  let strTime = (1718098200000 - nowTime) / 1000
+  let strTime = (props.openNft - nowTime) / 1000
   intervalId = setInterval(() => {
     if (strTime >= 1) {
       // remainingTime.value -= 1;

src/style.css

@@ -80,6 +80,21 @@ button:focus-visible {
 body {
   padding: 0 !important;
   margin: 0 !important;
+  &::-webkit-scrollbar {
+    width: 0px;
+  }
+  &::-webkit-scrollbar-track {
+    background: #171220;
+    border-radius: 2px;
+  }
+  &::-webkit-scrollbar-corner {
+    display: block;
+  }
+  &::-webkit-scrollbar-thumb {
+    height: 15px;
+    background: #9950fd;
+    border-radius: 10px;
+  }
 }
 
 h1 {

src/wallet/index.js

@@ -1,7 +1,5 @@
 import Web3 from 'web3'
-import { config, passport } from '@imtbl/sdk';
+import passportInit from './initPassport.js'
-import { ethers, providers } from 'ethers';
-
 import ERC_abi from './../abi/ImmutableERC20MinterBurnerPermit.json'
 import CFNFT_abi from './../abi/CFNFTGame.json'
 import CLAIM_abi from './../abi/NFTClaimStage2.json'
@@ -20,8 +18,8 @@ var chainId = import.meta.env.VITE_TOKENID_ID
 // var connectUrl = process.env.VUE_APP_CONFIG_URL
 
 // 公用方法
-const MINT_CONTRACT_ADDRESS='0x31f29c9a3d0c1c13c825475aebf0d964b5b47c45'
+const MINT_CONTRACT_ADDRESS = '0x31f29c9a3d0c1c13c825475aebf0d964b5b47c45'
-const RPC='https://rpc.testnet.immutable.com/'
+const RPC = 'https://rpc.testnet.immutable.com/'
 
 const requestChain = async (rpc, method, params) => {
   const data = {
@@ -39,7 +37,7 @@ const requestChain = async (rpc, method, params) => {
   }
   return fetch(rpc, options, DEFAULT_TIMEOUT).then(res => res.json())
 }
-const queryMintData = async(user, data) => {
+const queryMintData = async (user, data) => {
   const params = [{
     from: user,
     to: MINT_CONTRACT_ADDRESS,
@@ -48,121 +46,40 @@ const queryMintData = async(user, data) => {
   return requestChain(RPC, 'eth_call', params)
 }
 
-// const checkoutSDK = new checkout.Checkout()
-//   const type = checkout.WalletFilterTypes.ALL;
-// window.addEventListener('load', function() {
-//   const passportInstance = new passport.Passport({
-//       baseConfig: {
-//         environment: config.Environment.SANDBOX, // or Environment.PRODUCTION 
-//         publishableKey: 'wc:b348768c53d32b69062adcc7f67b263f771564c39edc06acc4cb3e9ee561d415@2?relay-protocol=irn&symKey=b8302aed25de3f9e3485eb8601d27c52779ab28cd8b1398312aa18be01cebbe8', // replace with your publishable API key from Hub
-//         // publishableKey: '', // replace with your publishable API key from Hub
-//       },
-//       clientId: 'eWbQF3aPY83RCNBMYGv2wUAbOJFKZo8l', // replace with your client ID from Hub
-//       redirectUri: 'http://localhost:5173/', // replace with one of your redirect URIs from Hub
-//       logoutRedirectUri: 'http://localhost:5173/', // replace with one of your logout URIs from Hub
-//       audience: '',
-//       scope: 'openid offline_access email transact',
-//       popupOverlayOptions: {
-//         disableGenericPopupOverlay: false, // Set to true to disable the generic pop-up overlay
-//         disableBlockedPopupOverlay: false, // Set to true to disable the blocked pop-up overlay
-//       }
-//   });
-
-//   passportInstance.loginCallback();
-// });
-
-
-const passportInstance = new passport.Passport({
-  baseConfig: {
-    environment: config.Environment.SANDBOX, // or Environment.PRODUCTION 
-    publishableKey: 'pk_imapik-test-1E-detBXtG7U$5961WuL', // replace with your publishable API key from Hub
-    // publishableKey: '', // replace with your publishable API key from Hub
-  },
-  clientId: 'gYQrjtct7CN4UVwDG2sb8yACfYRo3xQJ', // replace with your client ID from Hub
-  redirectUri: 'http://localhost:5173/redirect', // replace with one of your redirect URIs from Hub
-  logoutRedirectUri: 'http://localhost:5173/logout', // replace with one of your logout URIs from Hub
-  audience: 'platform_api',
-  scope: 'openid offline_access email transact',
-  popupOverlayOptions: {
-    disableGenericPopupOverlay: true, // Set to true to disable the generic pop-up overlay
-    disableBlockedPopupOverlay: true, // Set to true to disable the blocked pop-up overlay
-  }
-});
-
-// 链接Wallet Connect钱包
-export async function getConnect() {
-  const passportProvider = proxy.$passportInit;
-  const accounts = await passportProvider.request({ method: "eth_requestAccounts" })
-  console.log( accounts,'-----------------------------------------------------------------')
-  return
-}
-
-export async function getLogout() {
-  const profile = await passportInstance.logout();
-  return
-}
 
 export async function linkWallet(val) {
-let res
+  let res
-  if(val == 'ethereum') {
+  if (val == 'ethereum') {
     const web3js = window.ethereum
     if (typeof web3js !== "undefined") {
-      // let res1 = await isSepoliNetwork(val)
-      // console.log(res1)
-      // return
       res = await ethereum.request({ method: "eth_requestAccounts" })
     }
-  } else if(val == 'okxwallet') {
+  } else if (val == 'okxwallet') {
-    // let res1 = await isSepoliNetwork(val)
-    // console.log(res1)
-    // return
     res = await okxwallet.request({ method: "eth_requestAccounts" });
   }
   return res[0]
 }
 
 export async function disconnectLink(name) {
-  if(name == 'ethereum') {
+  if (name == 'ethereum') {
     await window.ethereum.request({
-      "method": "wallet_revokePermissions",
+      method: "wallet_revokePermissions",
-      "params": [
+      params: [
         {
-          "eth_accounts": {}
+          eth_accounts: {}
         }
       ]
     });
-  } else if(name == 'okxwallet') {
+  } else if (name == 'okxwallet') {
     await okxwallet.request({
-      "method": "wallet_disconnect",
+      method: "wallet_disconnect",
     })
-  } else if(name == 'connect') {
+  // } else if (name == 'connect') {
-    await passportInstance.logout()
+  //   await passportInit.logout()
+  //   await passportInit.logoutSilentCallback(`${import.meta.env.VITE_GPAL_ROUTER}`)
   }
 }
 
-
-// Wallet Connect初始化
-// import { EthereumProvider } from '@walletconnect/ethereum-provider'
-// const provider = await EthereumProvider.init({
-//   projectId: 'e7743d46923911fa8850619b7a7f6d9d', // required
-//   chains: ['1'], // required
-//   showQrModal: true, // requires @walletconnect/modal
-//   optionalChains: ['1'],
-//   // optionalMethods: ['eth_signTypedData', 'eth_signTypedData_v4'],
-//   metadata: {
-//     name: 'Counter Fire',
-//     description: 'Counter Fire',
-//     url: 'https://mint.counterfire.games/',
-//     icons: ['https://www.counterfire.games/favicon.ico'],
-//   },
-// });
-// 链接Wallet Connect钱包
-// export async function getConnect() {
-//   await provider.connect()
-//   let result = await provider.request({ method: 'eth_requestAccounts' })
-//   return result
-// }
-
 // 获取钱包地址
 export async function getWalletAddress() {
   const web3js = window.ethereum
@@ -185,7 +102,7 @@ export async function isWalletConnected() {
     let res = await ethereum.request({ method: "eth_accounts" })
     // await okxwallet.request({ method: "eth_accounts" });
     // console.log(res,'279-----')
-    if(res[0] == '') {
+    if (res[0] == '') {
       return false
     } else {
       return true
@@ -197,7 +114,7 @@ export async function isWalletConnected() {
 // 检查是否有arbitrum-sepolia网络
 export async function isSepoliNetwork(name) {
   let res
-  if(name == 'ethereum') {
+  if (name == 'ethereum') {
     res = await window.ethereum.request({
       method: "wallet_switchEthereumChain",
       params: [
@@ -206,9 +123,8 @@ export async function isSepoliNetwork(name) {
         }
       ]
     });
-    console.log(res,'-----')
     return false
-  } else if(name == 'okxwallet') {
+  } else if (name == 'okxwallet') {
     res =
       await window.ethereum.request({
         method: "wallet_switchEthereumChain",
@@ -219,15 +135,15 @@ export async function isSepoliNetwork(name) {
         ]
       });
     return false
-  } else if(name == 'connect') {
+  } else if (name == 'connect') {
     return false
   }
 }
 
 // 添加arbitrum-sepolia网络
 export async function addNetwork(name) {
-  if(name == 'ethereum') {
+  if (name == 'ethereum') {
-    try{
+    try {
       let res = await window.ethereum.request({
         method: 'wallet_addEthereumChain',
         params: [{
@@ -244,11 +160,11 @@ export async function addNetwork(name) {
         },]
       })
       return await res
-    } catch(e) {
+    } catch (e) {
       return false
     }
-  } else if(name == 'okxwallet') {
+  } else if (name == 'okxwallet') {
-    try{
+    try {
       let res = await okxwallet.request({
         method: 'wallet_addEthereumChain',
         params: [{
@@ -265,11 +181,11 @@ export async function addNetwork(name) {
         }]
       })
       return await res
-    } catch(e) {
+    } catch (e) {
       return false
     }
-  } else if(name == 'connect') {
+  } else if (name == 'connect') {
-    try{
+    try {
       let res = await window.provider.request({
         method: 'wallet_addEthereumChain',
         params: [{
@@ -286,142 +202,96 @@ export async function addNetwork(name) {
         }]
       })
       return await res
-    } catch(e) {
+    } catch (e) {
       return false
     }
   }
 }
 
 const GAS_BOOST = 2
-
 // claim NFT
-export const claimStage2Nft = async(name, myAddress, params, web3) => {
+export const claimStage2Nft = async (name, myAddress, params, mintPrice, web3) => {
-  let price = params*1e18
+  const price = params * mintPrice * 1e18
-  if(name == 'connect') {
+  console.log(BigInt(price))
-    let gasPrice = await web3.request({ method: 'eth_gasPrice' })
-    let web3Provider = new providers.Web3Provider(web3)
-    const signer = web3Provider.getSigner();
-    const [ userAddress ] = await web3.request({ method: "eth_requestAccounts"});
-    const contractFT = new ethers.Contract(ERCAddress, abis['ERC'].abi, signer);
-    let gasApprove = await contractFT.estimateGas.approve(claimWlAddress, BigInt(price))
-    // let gasApprove = await contractFT.estimateGas.approve(claimWlAddress, price)
-    gasApprove = (parseInt(gasApprove) * GAS_BOOST) | 0;
-    await contractFT.approve(claimWlAddress, BigInt(price))
-    // await contractFT.approve(claimWlAddress, price)
-    //------
-    const contract = new ethers.Contract(claimWlAddress, abis['CLAIMWL'].abi, signer);
-    let gas = await contract.estimateGas.claim(params)
-    // console.log(await contract.claim(params))
-    return await contract.claim(params)
-    
-  } else {
-    // const account = await web3.eth.getAccounts()
-    // let res = await isSepoliNetwork(name)
-    // if(!res) {
-    //   await addNetwork(name)
-    // }
   const gasPrice = await web3.eth.getGasPrice()
   const contractFT = new web3.eth.Contract(abis['ERC'].abi, ERCAddress, {
     from: myAddress
   });
   const allowance = await contractFT.methods.allowance(myAddress, claimWlAddress).call()
-    console.log('allowance', allowance)
+  
+  if(allowance < BigInt(price)) {
     let gasApprove = await contractFT.methods.approve(claimWlAddress, price).estimateGas();
     gasApprove = (parseInt(gasApprove) * GAS_BOOST) | 0;
     await contractFT.methods.approve(claimWlAddress, price).send({ gas: gasApprove, gasPrice });
+  }
   const contract = new web3.eth.Contract(abis['CLAIMWL'].abi, claimWlAddress, {
     from: myAddress
   });
   let gas = await contract.methods.claim(params).estimateGas()
   gas = (parseInt(gas) * GAS_BOOST) | 0;
-    // let abc = await contract.methods.claim(params).send({gas, gasPrice})
+  return contract.methods.claim(params).send({ gas, gasPrice })
-    // console.log(abc)
+
-    return contract.methods.claim(params).send({gas, gasPrice})
-  }
 }
 
 
 // 查询已Mint NFT数量
-export const balanceOfAmount = async(name, myAddress) => {
+export const balanceOfAmount = async (name, myAddress) => {
   let web3
-  if(name == 'ethereum') {
+  if (name == 'ethereum') {
     web3 = new Web3(window.ethereum);
-  } else if(name == 'okxwallet') {
+  } else if (name == 'okxwallet') {
     web3 = new Web3(okxwallet)
-  } else if(name == 'connect') {
+  } else if (name == 'connect') {
     web3 = new Web3(provider)
   }
-  let contract = new web3.eth.Contract(abis['CLAIM'].abi, claimAddress, { from: myAddress})
+  let contract = new web3.eth.Contract(abis['CLAIMWL'].abi, claimWlAddress, { from: myAddress })
   const tokenId = await contract.methods.totalCount(myAddress).call();
   return parseInt(tokenId)
 }
 
 
 // mint配置
-export const mintConfig = async(name, myAddress) => {
+export const mintConfig = async (name, myAddress) => {
   let web3
-  if(name == 'ethereum') {
+  if (name == 'ethereum') {
     web3 = new Web3(window.ethereum);
-  } else if(name == 'okxwallet') {
+  } else if (name == 'okxwallet') {
     web3 = new Web3(okxwallet)
-  } else if(name == 'connect') {
+  } else if (name == 'connect') {
     web3 = new Web3(provider)
   }
-  let contract = new web3.eth.Contract(abis['CLAIM'].abi, claimAddress, { from: myAddress})
+  let contract = new web3.eth.Contract(abis['CLAIMWL'].abi, claimWlAddress, { from: myAddress })
   const mintArr = await contract.methods.mintConfig(myAddress).call();
   return mintArr
 }
 
 // 当前用户白单数量
-export const fetchWLCount = async(name, myAddress) => {
+export const fetchWLCount = async (name, myAddress) => {
   let web3
-  if(name == 'ethereum') {
+  if (name == 'ethereum') {
     web3 = new Web3(window.ethereum);
-  } else if(name == 'okxwallet') {
+  } else if (name == 'okxwallet') {
     web3 = new Web3(okxwallet)
-  } else if(name == 'connect') {
+  } else if (name == 'connect') {
     web3 = new Web3(provider)
   }
-  let contract = new web3.eth.Contract(abis['CLAIMWL'].abi, claimWlAddress, { from: myAddress})
+  let contract = new web3.eth.Contract(abis['CLAIMWL'].abi, claimWlAddress, { from: myAddress })
   const tokenId = await contract.methods.whiteCount(myAddress).call();
   return parseInt(tokenId)
-
-  const data = '0xe65ee803'
-  return queryMintData(user, data)
 }
 
 // 当前用户已获得的数量
 export const fetchMintedCount = async (name, myAddress) => {
   let web3
-  if(name == 'ethereum') {
+  if (name == 'ethereum') {
     web3 = new Web3(window.ethereum);
-  } else if(name == 'okxwallet') {
+  } else if (name == 'okxwallet') {
     web3 = new Web3(okxwallet)
-  } else if(name == 'connect') {
+  } else if (name == 'connect') {
     web3 = new Web3(provider)
   }
-  let contract = new web3.eth.Contract(abis['CLAIMWL'].abi, claimWlAddress, { from: myAddress})
+  let contract = new web3.eth.Contract(abis['CLAIMWL'].abi, claimWlAddress, { from: myAddress })
-  const tokenId = await contract.methods.mintedNft(myAddress).call();
+  const tokenArr = await contract.methods.mintedNft(myAddress).call();
-  return tokenId
+  return tokenArr
-
-  const data = '0xe65ee803'
-  return queryMintData(user, data)
 }
 
-
-
-// passport send()
-
-const returnSend = async (web3, ERCAddress, contractAddress, abi, data) => {
-  // let gasPrice = await web3.request({ method: 'eth_gasPrice' })
-  let web3Provider = new providers.Web3Provider(web3)
-  const signer = web3Provider.getSigner();
-  const contract = new ethers.Contract(ERCAddress, abi, signer);
-  let gasApprove = await contract.estimateGas.approve(contractAddress, data)
-  // let gasApprove =  tx
-  gasApprove = (parseInt(gasApprove) * GAS_BOOST) | 0;
-  console.log(parseInt(gasApprove),'---')
-  return contract.approve(contractAddress, data)
-}
-
-

src/wallet/initPassport.js

@@ -1,18 +1,21 @@
+import { Web3 } from "web3"
 import { config, passport } from '@imtbl/sdk';
+console.log(import.meta.env.VITE_GPAL_ROUTER,'import.meta.env.VITE_GPAL_ROUTER')
 const passportInstance = new passport.Passport({
   baseConfig: {
     environment: config.Environment.SANDBOX, // or Environment.PRODUCTION 
-    publishableKey: 'pk_imapik-test-1E-detBXtG7U$5961WuL', // replace with your publishable API key from Hub
+    publishableKey: 'pk_imapik-test-1E-detBXtG7U$5961WuL', // replace with your publishable API key from Hub pk_imapik-tU10buLqoyLZ0o54rcub pk_imapik-test-1E-detBXtG7U$5961WuL
     // publishableKey: '', // replace with your publishable API key from Hub
   },
-  clientId: 'gYQrjtct7CN4UVwDG2sb8yACfYRo3xQJ', // replace with your client ID from Hub
+  clientId: 'gYQrjtct7CN4UVwDG2sb8yACfYRo3xQJ', // replace with your client ID from Hub gYQrjtct7CN4UVwDG2sb8yACfYRo3xQJ tTB5eEedqDOHPHMI41sRDGmqAQwus9oE
-  redirectUri: 'http://localhost:5173/redirect', // replace with one of your redirect URIs from Hub
+  redirectUri: `${import.meta.env.VITE_GPAL_ROUTER}/redirect`, // replace with one of your redirect URIs from Hub
-  logoutRedirectUri: 'http://localhost:5173/logout', // replace with one of your logout URIs from Hub
+  logoutRedirectUri: `${import.meta.env.VITE_GPAL_ROUTER}`, // replace with one of your logout URIs from Hub
+  logoutMode: 'silent',
   audience: 'platform_api',
   scope: 'openid offline_access email transact',
   popupOverlayOptions: {
-    disableGenericPopupOverlay: true, // Set to true to disable the generic pop-up overlay
+    disableGenericPopupOverlay: false, // Set to true to disable the generic pop-up overlay
-    disableBlockedPopupOverlay: true, // Set to true to disable the blocked pop-up overlay
+    disableBlockedPopupOverlay: false, // Set to true to disable the blocked pop-up overlay
   }
 });
 const passportInit  = app => {