修改购买流程

.env.development

@@ -1,9 +1,9 @@
 VUE_APP_WALLET_INFURAID='e7743d46923911fa8850619b7a7f6d9d'
-VUE_APP_BASE_API='http://game2006api-test.kingsome.cn'
+VUE_APP_BASE_API='https://market-test.kingsome.cn'
-VUE_APP_CHAIN_ID=97
+VUE_APP_CHAIN_ID=322
-VUE_APP_CHAIN_RPC='https://data-seed-prebsc-1-s1.binance.org:8545'
+VUE_APP_CHAIN_RPC='https://rpc-testnet.kcc.network'
-VUE_APP_CHAIN_NAME='Smart Chain - Testnet'
+VUE_APP_CHAIN_NAME='KCC-TESTNET'
-VUE_APP_CHAIN_EXPLORERURL='https://testnet.bscscan.com'
+VUE_APP_CHAIN_EXPLORERURL='https://scan-testnet.kcc.network
 VUE_APP_CHAIN_CURRENCY_NAME='name'
-VUE_APP_CHAIN_CURRENCY_SYMBOL='BNB'
+VUE_APP_CHAIN_CURRENCY_SYMBOL='KCS'
 VUE_APP_CHAIN_CURRENCY_DECIMALS=18

.env.production

@@ -1,9 +1,9 @@
 VUE_APP_WALLET_INFURAID='e7743d46923911fa8850619b7a7f6d9d'
-VUE_APP_BASE_API='https://market.cebg.games'
+VUE_APP_BASE_API='https://market-test.kingsome.cn'
-VUE_APP_CHAIN_ID=97
+VUE_APP_CHAIN_ID=322
-VUE_APP_CHAIN_RPC='https://data-seed-prebsc-1-s1.binance.org:8545'
+VUE_APP_CHAIN_RPC='https://rpc-testnet.kcc.network'
-VUE_APP_CHAIN_NAME='Smart Chain - Testnet'
+VUE_APP_CHAIN_NAME='KCC-TESTNET'
-VUE_APP_CHAIN_EXPLORERURL='https://testnet.bscscan.com'
+VUE_APP_CHAIN_EXPLORERURL='https://scan-testnet.kcc.network
 VUE_APP_CHAIN_CURRENCY_NAME='name'
-VUE_APP_CHAIN_CURRENCY_SYMBOL='BNB'
+VUE_APP_CHAIN_CURRENCY_SYMBOL='KCS'
 VUE_APP_CHAIN_CURRENCY_DECIMALS=18

src/components/main/MainHeader.vue

@@ -58,7 +58,7 @@
         <li v-if="accountId" @click.stop="disconnectWallet">
           <a href="javascript:void(0)" >Logout</a>
         </li>
-        <li v-if="!accountId">
+        <li v-if="!accountId" @click="collectToWallet">
           <a href="javascript:void(0)" >Connect Wallet</a>
         </li>
       </ul>
@@ -100,6 +100,10 @@ export default class extends Vue {
     return this.bc.disconnect()
   }
 
+  async collectToWallet() {
+    return this.bc.connect()
+  }
+
   toggleDrop() {
     this.dropShow = !this.dropShow
   }

src/components/main/NftSection.vue

@@ -71,6 +71,7 @@ export default class extends Vue {
 
   async fetchData() {
     await this.queryPresaleList()
+    await this.getPresaleInfo()
   }
 
   subscribeToEvents() {
@@ -173,12 +174,19 @@ export default class extends Vue {
         this.beginCountdown()
       }
       AppModule.updatePresaleStat(this.presaleStatus)
+
+      const buySet: Set<string> = new Set()
+      if (res.presale_info.buyable_list) {
+        for (const sub of res.presale_info.buyable_list) {
+          buySet.add(sub.box_id)
+        }
+      }
       AppModule.updateCanBuy(this.presaleStatus === 2 &&
-        this.numberRest > 0 &&
+        this.numberRest > 0 && buySet.size > 0
-        !this.buyed
       )
+
       for (const data of this.heroDatas) {
-        Vue.set(data, 'stopBuy', this.buyed)
+        Vue.set(data, 'stopBuy', !buySet.has(data.id!))
       }
     }
   }

src/components/market/NftItem.vue

@@ -4,7 +4,7 @@
     <div v-if="data.id" class="anim-border">
       <img class="card-main-img" :src="require(`@/assets/main/card/${data.skelName}.png`)"  alt=""/>
       <div class="name-label" :class="{'bottom': !data.showBuy}">{{data.name}}</div>
-      <div class="info-div" v-if="data.showBuy" @click="buyItem" :class="{'gray': !canBuy}">
+      <div class="info-div" v-if="data.showBuy" @click="buyItem" :class="{'gray': !showLight}">
         <img class='buy-icon' src="@/assets/main/card/icon_buy.png" alt=""/>
         <div class="price-label">
           <span :class="{'price': data.price !== data.priceDiscount}">{{priceDiscountShow}} {{data.currency}}</span>
@@ -25,7 +25,7 @@ import { BlockChain } from '@/utils/blockchain'
 import { AppModule } from '@/store/modules/app'
 import { buyBox } from '@/api/Mall'
 import { Message } from 'element-ui'
-import { EventBus, PRESALE_BEGIN, PRESALE_ERROR, PRESALE_ORDER_GET, PRESALE_SUCCESS } from '@/utils/event-bus'
+import { EventBus, NEED_LOGIN, PRESALE_BEGIN, PRESALE_ERROR, PRESALE_ORDER_GET } from '@/utils/event-bus'
 
 declare module 'vue/types/vue' {
   interface Vue {
@@ -46,8 +46,12 @@ export default class extends Vue {
     return AppModule.walletConnected
   }
 
+  get showLight() {
+    return !this.accountId || this.canBuy
+  }
+
   get canBuy() {
-    return !this.data.showBuy && AppModule.presaleStatus === 2
+    return !this.data.stopBuy && AppModule.presaleStatus === 2
   }
 
   get priceDiscountShow() {
@@ -65,6 +69,11 @@ export default class extends Vue {
   }
 
   async buyItem() {
+    console.log('on click item: ', this.data.id)
+    if (!this.accountId) {
+      EventBus.$emit(NEED_LOGIN)
+      return
+    }
     if (!this.canBuy) {
       Message({
         message: 'Can`t buy current time',
@@ -108,8 +117,8 @@ export default class extends Vue {
         nonce,
         signature
       }
-      await this.bc.increaseAllowance(this.data.coinAddress!, price)
       const res: any = await buyBox(buyData)
+      await this.bc.increaseAllowance(this.data.coinAddress!, price)
       const orderId = res.order_id
       localStorage.setItem('tmp_presale_order_id', orderId)
       EventBus.$emit(PRESALE_ORDER_GET, orderId)

src/utils/blockchain.ts

@@ -5,6 +5,7 @@ import { AppModule } from '@/store/modules/app'
 import Web3 from 'web3'
 import { MessageBox } from 'element-ui'
 import { ERC20ABI, MALL_ADDRESS } from '@/utils/config_chain'
+import { EventBus, NEED_LOGIN } from '@/utils/event-bus'
 
 @singleton
 export class BlockChain {
@@ -42,6 +43,7 @@ export class BlockChain {
     if (this.isWalletConnect) {
       this.connect()
     }
+    EventBus.$on(NEED_LOGIN, this.connect.bind(this))
   }
 
   loadJson(url: string) {
@@ -68,7 +70,7 @@ export class BlockChain {
             'You need to connect to supported network',
             'Wrong Network',
             {
-              confirmButtonText: 'Switch to BSC network',
+              confirmButtonText: `Switch to ${process.env.VUE_APP_CHAIN_NAME} network`,
               cancelButtonText: 'Cancel',
               type: 'warning'
             }
@@ -136,7 +138,7 @@ export class BlockChain {
             'You need to connect to supported network',
             'Wrong Network',
             {
-              confirmButtonText: 'Switch to BSC network',
+              confirmButtonText: `Switch to ${process.env.VUE_APP_CHAIN_NAME} network`,
               cancelButtonText: 'Cancel',
               type: 'warning'
             }

src/utils/event-bus.ts

@@ -8,3 +8,5 @@ export const PRESALE_ORDER_GET = 'presale_order_get'
 export const PRESALE_SUCCESS = 'presale_success'
 
 export const PRESALE_ERROR = 'presale_error'
+
+export const NEED_LOGIN = 'need_login'