bug fix: mint hero

src/components/assets/cenCard.vue

@@ -24,7 +24,7 @@
             <img :src="icon" alt="">
           </div>
         </div>
-        <div class="link-below" @click="lockToGame('convert')">
+        <div class="link-below" @click="mintHero('convert')">
           <!-- Convert -->
           <img src="@/assets/img/marketplace/Off-Chain.png" alt="">
         </div>
@@ -152,6 +152,18 @@ const lockToGame = async(type) => {
     }
   }
 }
+// mint一个英雄
+const mintHero = async () => {
+  const confirmResult = await createModal(ConfirmDialog, {
+    title: '', 
+    message: 'After converting, you will be able to use the hero in the game. At the end of Season 1, the hero will automatically be returned to your wallet or Immutable Passport. Do you want to proceed?'
+  }).show()
+  if (confirmResult.errcode == 0) {
+    // loadingDialogVisible.value = true
+    const res = await new BlockChain().locker.mintNft([toRaw(props.nftData).uniid])  
+    console.log(res)
+  }
+}
 const lockToGameConfirm = async () => {
   try {
     const bc = new BlockChain()

src/components/chain/BlockChain.js

@@ -1,4 +1,4 @@
-import {PassportWallet} from "@/components/chain/wallet/PassportWallet";
+import {PassportWallet, baseConfig} from "@/components/chain/wallet/PassportWallet";
 import { MetaMaskWallet } from '@/components/chain/wallet/MetaMaskWallet';
 import { OkxWallet } from '@/components/chain/wallet/OkxWallet'; 
 import {walletStore} from "@/store/wallet";
@@ -9,6 +9,7 @@ import {ImtblMarket} from "@/components/chain/Market";
 import { ALL_PROVIDERS } from "@/configs/configchain";
 import {Locker} from "@/components/chain/contract/Locker";
 import ConfirmDialog from "@/components/Dialogs/confirmDialog.vue";
+import { checkout } from '@imtbl/sdk';
 
 
 export const allProviders = {
@@ -72,6 +73,7 @@ export class BlockChain {
     }
     this.store.$persist();
     this.market.updateProvider(provider);
+    // this.initWidget(provider);
     return provider;
   }
 
@@ -138,7 +140,7 @@ export class BlockChain {
    */
   async passportToken() {
     if (this.store.walletType == 3) {
-      return this.store.token
+      return this.token()
     }
     if (!this.passportProvider) {
       return ''
@@ -212,4 +214,28 @@ export class BlockChain {
     }
     return { provider, address: accounts[0] };
   }
+
+  async initWidget(provider) {
+    const checkoutSDK = new checkout.Checkout({
+      baseConfig,
+      passport: this.passportInstance,
+      bridge: { enable: true },
+      swap: { enable: true },
+      onRamp: { enable: true }
+    });
+    
+    const widgets = await checkoutSDK.widgets({
+      config: { theme: checkout.WidgetTheme.DARK },
+    });
+
+    // RECOMMENDED - create all of the widgets once at the start of your application
+    // use the created widgets throughout your application to mount and unmount in specific parts of your application
+    const connect = widgets.create(checkout.WidgetType.CONNECT);
+    const wallet = widgets.create(checkout.WidgetType.WALLET, {provider}); // you can optionally pass in additional config per widget
+    const swap = widgets.create(checkout.WidgetType.SWAP);
+    const bridge = widgets.create(checkout.WidgetType.BRIDGE);
+    const onramp = widgets.create(checkout.WidgetType.ONRAMP);
+    // Mount the wallet widget passing the element id of where to mount the widget
+    wallet.mount('wallet');
+  }
 }

src/components/chain/contract/Locker.js

@@ -43,16 +43,18 @@ export class Locker {
     return res.hash
   }
   
-  async sendUnlockOrMint(provider, {to, data}) {
+  async sendUnlockOrMint(provider, {from, to, data}) {
     
-    const txHash = await provider.request({
+    const txHash = await provider.provider.request({
       method: 'eth_sendTransaction',
       params: [{
+        from,
         to,
         data
       }]
     })
     console.log(txHash)
+    await provider.waitForTransaction(txHash)
     return txHash
   }
 
@@ -90,6 +92,7 @@ export class Locker {
     if (errcode) {
       throw new Error(errmsg)
     }
-    return this.sendUnlockOrMint(provider, trans_req)
+    trans_req.from = address
+    return this.sendUnlockOrMint(this.bc.web3Provider, trans_req)
   }
 }

src/components/chain/wallet/PassportWallet.js

@@ -32,7 +32,7 @@ export class PassportWallet {
     this.passportInstance.loginCallback().then(()=>{}).catch(err=>{});
     this.client = new orderbook.Orderbook({ baseConfig });
   }
-  async initWidget() {
+  async initWidget(provider) {
     const checkoutSDK = new checkout.Checkout({
       baseConfig,
       passport: this.passportInstance,
@@ -48,13 +48,12 @@ export class PassportWallet {
     // RECOMMENDED - create all of the widgets once at the start of your application
     // use the created widgets throughout your application to mount and unmount in specific parts of your application
     const connect = widgets.create(checkout.WidgetType.CONNECT);
-    const wallet = widgets.create(checkout.WidgetType.WALLET); // you can optionally pass in additional config per widget
+    const wallet = widgets.create(checkout.WidgetType.WALLET, {provider}); // you can optionally pass in additional config per widget
     const swap = widgets.create(checkout.WidgetType.SWAP);
     const bridge = widgets.create(checkout.WidgetType.BRIDGE);
     const onramp = widgets.create(checkout.WidgetType.ONRAMP);
-
     // Mount the wallet widget passing the element id of where to mount the widget
-    connect.mount('wallet');
+    wallet.mount('wallet');
   }
   get nativeProvider() {
     return this.passportInstance.connectEvm();
@@ -65,6 +64,7 @@ export class PassportWallet {
     const accounts = await passportProvider.request({ method: "eth_requestAccounts" });
     const provider = new providers.Web3Provider(passportProvider);
     const token = await this.passportInstance.getIdToken()
+    // this.initWidget(provider);
     return { provider, accounts, token };
   }
   

src/components/layout/NavBar.vue

@@ -59,7 +59,7 @@
         </div>
       </div>
     </div>
-    <div id="wallet"></div>
+    <div id="wallet" class="wallet-widget"></div>
     <Cart v-if="cartShow" @closeCart="closeCartBox" class="cart-con" />
   </div>
 </template>
@@ -660,4 +660,10 @@ onMounted( async () => {
   background: #1e1b23;
   z-index: 999;
 }
+.wallet-widget {
+  position: fixed;
+  top: 84px;
+  right: 0;
+  z-index: 10000;
+}
 </style>