diff --git a/public/locales/en-US.json b/public/locales/en-US.json
index 8b5a9bd..40148a3 100644
--- a/public/locales/en-US.json
+++ b/public/locales/en-US.json
@@ -1053,15 +1053,10 @@
   "Community Auctions": "Community Auctions",
   "FAQs": "FAQs",
   "Auction duration": "Auction duration",
-  "Terms & Conditions": "Terms & Conditions",
-
-
-
-
-  "Hcc Info":"HighCityCoin",
-  "Hcc Nft":"其作用主要是在HighCitySwap上购买NFT、NFT盒子与其他可交易产品。",
-  "Hcc BTC":"同时，HCC与BTC、ETH具有相同属性，可以进行自由交易。",
-  "Bazaar":"NFT市场"
-
 
+  "Hcc Info": "HighCityCoin",
+  "Hcc Nft": "其作用主要是在HighCitySwap上购买NFT、NFT盒子与其他可交易产品。",
+  "Hcc BTC": "同时，HCC与BTC、ETH具有相同属性，可以进行自由交易。",
+  "Bazaar": "NFT市场",
+  "Insufficient Balance": "余额不足"
 }
diff --git a/public/locales/zh-CN.json b/public/locales/zh-CN.json
index f05b163..1edfa37 100644
--- a/public/locales/zh-CN.json
+++ b/public/locales/zh-CN.json
@@ -1055,70 +1055,69 @@
   "Auction duration": "Auction duration",
   "Terms & Conditions": "Terms & Conditions",
 
-
-
-  "Hcc Info":"HighCityCoin简称HCC，由HighCityTM铸造，",
-  "Hcc Nft":"其作用主要是在HighCitySwap上购买NFT、NFT盒子与其他可交易产品。",
-  "Hcc BTC":"同时，HCC与BTC、ETH具有相同属性，可以进行自由交易。",
-  "Bazaar":"NFT市场",
-  "HlighCitySwapInfo":"HIighCitySwap的诞生，源于创始人Liu Bus对区块链技术的狂热追求，他始终相信区块链技术能够得到更广泛的应用。为此，他做了一个勇敢的决定，放弃在其他领域的投资，身心专注投入到区块链技术实践应用当中去，将自己所熟悉的领域——互联网社交，与区块链技术融合，HighCitySwap由此诞生。这就是我们的开始，感谢你们的支持，HighCity团队将永远前行。",
-  "Stage one: Origin":"第一阶段：起源",
-  "Stage two: Action":"第二阶段：行动",
-  "Stage three: Creation":"第三阶段：创造",
-  "Stage four: Integration":"第四阶段：融合",
-  "Stage five: Closing the curtain":"第五阶段：落幕",
-  "The project concept was born in May 2021":"2021年5月项目概念的诞生；",
-  "Set up HighClty team in June 2021":"2021年6月搭建HighClty团队；",
-  "May 2021 -- January 2022 Team run-in":"2021年5月~2022年1月团队磨合；",
-  "In April 2022, social networking and media release activities, HighCity coin started and dividend mechanism went online":"2022年4月社交建社，交媒体发布活动，HighCity铸币开始，分红机制上线；",
-  "In March 2022, project approval, web design, roadmap announcement, smart contract development":"2022年3月项目立项，网页设计，路线图公布，智能合约开发；",
-  "Launch of social software in December 2022":"2022年12月社交软件落地；",
-  "Created by NFT in May 2022":"2022年5月NFT创造；",
-  "June 2022 social software development":"2022年6月社交软件开发；",
-  "December 2022 NFT bonus binding social software":"2022年12月NFT分红绑定社交软件；",
-  "In December 2022, HighCity Ecology was preliminarily completed":"2022年12月HighCity生态初步建成；",
-  "HighCity Ecology completed in December 2022":"2022年12月HighCity生态建成;",
-  "Maintain dividend income growth in December 2022":"2022年12月保持分红收益增长；",
-  "Buy commander NFT":"购买军团长NFT",
-  "Upgrade recommendation rights, can enjoy the share of secondary recommendation":"升级推荐权益，可享有二级推荐的分成",
-  "Enjoy a higher percentage than ordinary users":"享有比普通用户更高的分成比例",
-  "Commander NFT can be traded in the NFT market":"军团长NFT可在NFT市场内进行交易",
-  "First stage sharing ratio":"一级分成比例",
-  "Secondary split ratio":"二级分成比例",
-  "Buy It Now":"立即购买",
-  "recommend":"推荐",
-  "The lower the number of":"下级数量",
-  "NFT total revenue":"NFT总收益",
-  "HCC total revenue":"HCC总收益",
-  "To get profit":"待领收益",
-  "No income is received temporarily":"暂无收益领取",
-  "Upgrade commander":"升级军团长",
-  "Regimental recommendation":"军团长推荐",
-  "Number of secondary subordinates":"二级下级人数",
-  "Number of first-level subordinates":"一级下级人数",
-  "Immediately to receive":"立即领取",
-  "buy again":"再次购买",
-  "Connect the purse":"连接钱包",
-  "HCC total revenue percentage :10%":"HCC总收益(分成比例:10%)",
-  "Contract address":"合约地址",
-  "Assets agreement":"资产协议",
-  "Assets and chain":"资产公链",
-  "each time":"1.当倒计时少于1小时时，每次加价增加倒计时时间1小时",
-  "last bid":"2.拍卖每次固定加价10%，倒计时结束后，拍卖品由最后出价的出价人获得",
-  "commission fee":"3.拍卖成功后，平台将收取发布人收益的6%作为手续费",
-  "announcement":"公告",
-  "return":"返回",
-  "Total capital pool":"资金池总额",
-  "The total amount of dividends":"分红总额",
-  "Pending dividend":"待领取分红",
-  "Number of boards":"董事会数量",
-  "Number of holders":"持有人数量",
-  "total revenue":"总收益",
-  "revenue":"收益",
-  "purchase":"购买",
-  "Enter a keyword search":"输入关键字搜索",
-  "By using the invitation at the top right of the page, new users can be invited to enter and obtained after users purchase coins":"使用页面右上方的邀请，可邀请新用户进入，并在用户购买币后获得",
-  "The commission":"的提成！",
-  "market value":"市值",
-  "Loaded all":"已加载全部"
+  "Hcc Info": "HighCityCoin简称HCC，由HighCityTM铸造，",
+  "Hcc Nft": "其作用主要是在HighCitySwap上购买NFT、NFT盒子与其他可交易产品。",
+  "Hcc BTC": "同时，HCC与BTC、ETH具有相同属性，可以进行自由交易。",
+  "Bazaar": "NFT市场",
+  "HlighCitySwapInfo": "HIighCitySwap的诞生，源于创始人Liu Bus对区块链技术的狂热追求，他始终相信区块链技术能够得到更广泛的应用。为此，他做了一个勇敢的决定，放弃在其他领域的投资，身心专注投入到区块链技术实践应用当中去，将自己所熟悉的领域——互联网社交，与区块链技术融合，HighCitySwap由此诞生。这就是我们的开始，感谢你们的支持，HighCity团队将永远前行。",
+  "Stage one: Origin": "第一阶段：起源",
+  "Stage two: Action": "第二阶段：行动",
+  "Stage three: Creation": "第三阶段：创造",
+  "Stage four: Integration": "第四阶段：融合",
+  "Stage five: Closing the curtain": "第五阶段：落幕",
+  "The project concept was born in May 2021": "2021年5月项目概念的诞生；",
+  "Set up HighClty team in June 2021": "2021年6月搭建HighClty团队；",
+  "May 2021 -- January 2022 Team run-in": "2021年5月~2022年1月团队磨合；",
+  "In April 2022, social networking and media release activities, HighCity coin started and dividend mechanism went online": "2022年4月社交建社，交媒体发布活动，HighCity铸币开始，分红机制上线；",
+  "In March 2022, project approval, web design, roadmap announcement, smart contract development": "2022年3月项目立项，网页设计，路线图公布，智能合约开发；",
+  "Launch of social software in December 2022": "2022年12月社交软件落地；",
+  "Created by NFT in May 2022": "2022年5月NFT创造；",
+  "June 2022 social software development": "2022年6月社交软件开发；",
+  "December 2022 NFT bonus binding social software": "2022年12月NFT分红绑定社交软件；",
+  "In December 2022, HighCity Ecology was preliminarily completed": "2022年12月HighCity生态初步建成；",
+  "HighCity Ecology completed in December 2022": "2022年12月HighCity生态建成;",
+  "Maintain dividend income growth in December 2022": "2022年12月保持分红收益增长；",
+  "Buy commander NFT": "购买军团长NFT",
+  "Upgrade recommendation rights, can enjoy the share of secondary recommendation": "升级推荐权益，可享有二级推荐的分成",
+  "Enjoy a higher percentage than ordinary users": "享有比普通用户更高的分成比例",
+  "Commander NFT can be traded in the NFT market": "军团长NFT可在NFT市场内进行交易",
+  "First stage sharing ratio": "一级分成比例",
+  "Secondary split ratio": "二级分成比例",
+  "Buy It Now": "立即购买",
+  "recommend": "推荐",
+  "The lower the number of": "下级数量",
+  "NFT total revenue": "NFT总收益",
+  "HCC total revenue": "HCC总收益",
+  "To get profit": "待领收益",
+  "No income is received temporarily": "暂无收益领取",
+  "Upgrade commander": "升级军团长",
+  "Regimental recommendation": "军团长推荐",
+  "Number of secondary subordinates": "二级下级人数",
+  "Number of first-level subordinates": "一级下级人数",
+  "Immediately to receive": "立即领取",
+  "buy again": "再次购买",
+  "Connect the purse": "连接钱包",
+  "HCC total revenue percentage :10%": "HCC总收益(分成比例:10%)",
+  "Contract address": "合约地址",
+  "Assets agreement": "资产协议",
+  "Assets and chain": "资产公链",
+  "each time": "1.当倒计时少于1小时时，每次加价增加倒计时时间1小时",
+  "last bid": "2.拍卖每次固定加价10%，倒计时结束后，拍卖品由最后出价的出价人获得",
+  "commission fee": "3.拍卖成功后，平台将收取发布人收益的6%作为手续费",
+  "announcement": "公告",
+  "return": "返回",
+  "Total capital pool": "资金池总额",
+  "The total amount of dividends": "分红总额",
+  "Pending dividend": "待领取分红",
+  "Number of boards": "董事会数量",
+  "Number of holders": "持有人数量",
+  "total revenue": "总收益",
+  "revenue": "收益",
+  "purchase": "购买",
+  "Enter a keyword search": "输入关键字搜索",
+  "By using the invitation at the top right of the page, new users can be invited to enter and obtained after users purchase coins": "使用页面右上方的邀请，可邀请新用户进入，并在用户购买币后获得",
+  "The commission": "的提成！",
+  "market value": "市值",
+  "Loaded all": "已加载全部",
+  "Insufficient Balance": "余额不足"
 }
diff --git a/src/services/referral.ts b/src/services/referral.ts
index b202817..23fb4a8 100644
--- a/src/services/referral.ts
+++ b/src/services/referral.ts
@@ -1,19 +1,33 @@
 import request from 'utils/request'
 
-export const getReferralInfo = () => {
+export const getReferralRewardInfo = () => {
   return request.request({
     url: '/high_city/app/api/invite/reward',
     method: 'get',
   })
 }
 
-export const withdrawReward = () => {
+export const getReferralConfigInfo = () => {
+  return request.request({
+    url: '/high_city/app/api/invite/config',
+    method: 'get',
+  })
+}
+
+export const getBuyReferralParams = () => {
+  return request.request({
+    url: '/high_city/app/api/invite/commander/purchase',
+    method: 'get',
+  })
+}
+
+export const getWithdrawRewardParams = () => {
   return request.request({
     url: '/high_city/app/api/invite/reward/receive',
     method: 'get',
   })
 }
-export const checkWithdrawResult = (params) => {
+export const checkBuyResult = (params) => {
   return request.request({
     url: '/high_city/app/api/invite/commander/tx',
     method: 'post',
@@ -28,4 +42,4 @@ export const inviteReceive = () => {
   })
 }
 
-export default getReferralInfo
+export default getReferralRewardInfo
diff --git a/src/state/referral/index.ts b/src/state/referral/index.ts
index 181d1c8..766d4de 100644
--- a/src/state/referral/index.ts
+++ b/src/state/referral/index.ts
@@ -1,6 +1,6 @@
 import { createSlice } from '@reduxjs/toolkit'
-import { getReferralInfo } from 'services/referral'
-import { ReferralInfo, ReferralConfigType } from 'types/referral'
+import { getReferralRewardInfo, getReferralConfigInfo } from 'services/referral'
+import { ReferralInfo, ReferralConfigType, ReferralConfigInfo } from 'types/referral'
 import BigNumber from 'bignumber.js'
 import erc20ABI from 'config/abi/erc20.json'
 import multicall from 'utils/multicall'
@@ -16,7 +16,6 @@ const initialState: ReferralState = {
 }
 const payWayList = {
   usdt: tokens.usdt,
-  // bnb: tokens.bnb,
   hcc: tokens.hcc,
 }
 export const referralSlice = createSlice({
@@ -40,13 +39,14 @@ export const fetchReferralInfoAsync = (account) => async (dispatch) => {
     dispatch(setReferralInfo({}))
     return
   }
-  const data: ReferralInfo = await getReferralInfo()
+  const data: ReferralInfo = await getReferralRewardInfo()
+  const configInfo: ReferralConfigInfo[] = await getReferralConfigInfo()
   dispatch(
     setReferralInfo({
-      commanderConfigInfo: data.inviteConfigList?.find((item) => item.type === ReferralConfigType.COMMANDER),
-      normalConfigInfo: data.inviteConfigList?.find((item) => item.type === ReferralConfigType.NORMAL),
+      commanderConfigInfo: configInfo?.find((item) => item.type === ReferralConfigType.COMMANDER),
+      normalConfigInfo: configInfo?.find((item) => item.type === ReferralConfigType.NORMAL),
       isCommander: data.isCommander,
-      rewardInfo: data.reward,
+      rewardInfo: data.reward || {},
     }),
   )
 }
@@ -62,7 +62,10 @@ export const fetchReferralUserAllowances = async (account: string) => {
   const parsedLpAllowances = rawLpAllowances.map((balance) => {
     return new BigNumber(balance).toNumber()
   })
-  return parsedLpAllowances
+  return {
+    usdt: parsedLpAllowances[0],
+    hcc: parsedLpAllowances[1],
+  }
 }
 
 export default referralSlice.reducer
diff --git a/src/views/Referral/components/BuyActions.tsx b/src/views/Referral/components/BuyActions.tsx
new file mode 100644
index 0000000..5916940
--- /dev/null
+++ b/src/views/Referral/components/BuyActions.tsx
@@ -0,0 +1,109 @@
+import React, { useState, useEffect } from 'react'
+import { Flex, Button, Modal, Image } from '@pancakeswap/uikit'
+import styled from 'styled-components'
+import { useTranslation } from 'contexts/Localization'
+import { useAccount } from 'state/userInfo/hooks'
+import { fetchReferralUserAllowances } from 'state/referral'
+import { useERC20 } from 'hooks/useContract'
+import { getAddress } from 'utils/addressHelpers'
+import useToast from 'hooks/useToast'
+import { checkBuyResult } from 'services/referral'
+import useRefresh from 'hooks/useRefresh'
+import tokens from 'config/constants/tokens'
+import { useCheckTokenBalance, useApproveReferral, useBuyTransaction } from '../hooks'
+
+// interface BuyActionsProps {
+
+// }
+
+const Btn = styled(Button)`
+  width: 50%;
+  margin: 20px auto 0px auto;
+  border-radius: 50px;
+  background: linear-gradient(180deg, #7be0fc 0%, #ac7bf1 100%);
+  border: none;
+`
+const BuyActions: React.FC = () => {
+  const { t } = useTranslation()
+  const account = useAccount()
+  const [allowanceList, setAllowanceList] = useState({ usdt: 0, hcc: 0 })
+  const usdtContract = useERC20(getAddress(tokens.usdt.address))
+  const [loading, setLoading] = useState(false)
+  const [txId, setTxId] = useState()
+  const { toastSuccess } = useToast()
+  const { fastRefresh } = useRefresh()
+  const hccContract = useERC20(getAddress(tokens.hcc.address))
+  const { onApprove: onUsdtApprove } = useApproveReferral(usdtContract)
+  const { onApprove: onHccApprove } = useApproveReferral(hccContract)
+  const buyTransaction = useBuyTransaction()
+  const handleApprove = async (approve) => {
+    try {
+      setLoading(true)
+      await approve()
+      setLoading(false)
+      getAllowances()
+    } catch (e) {
+      console.error(e)
+    }
+  }
+  const getAllowances = async () => {
+    const allowances = await fetchReferralUserAllowances(account)
+    setAllowanceList({
+      usdt: allowances.usdt,
+      hcc: allowances.hcc,
+    })
+  }
+  const handleBuy = async () => {
+    await buyTransaction()
+  }
+  const getTransactionResult = async () => {
+    const res = await checkBuyResult({ tx: txId })
+    if (res?.success) {
+      setLoading(false)
+      setTxId(undefined)
+      toastSuccess('Buy Success')
+    }
+  }
+  useEffect(() => {
+    if (txId && loading) {
+      getTransactionResult()
+    }
+  }, [fastRefresh])
+
+  useEffect(() => {
+    if (account) {
+      getAllowances()
+    } else {
+      setAllowanceList({ usdt: 0, hcc: 0 })
+    }
+  }, [])
+
+  return (
+    <Flex>
+      {!allowanceList.usdt && (
+        <Btn
+          disabled={loading}
+          onClick={() => {
+            handleApprove(onUsdtApprove)
+          }}
+        >
+          {t('Approve %coin% Contract', { coin: 'usdt' })}
+        </Btn>
+      )}
+
+      {!allowanceList.hcc && (
+        <Btn
+          disabled={loading}
+          onClick={() => {
+            handleApprove(onHccApprove)
+          }}
+        >
+          {t('Approve %coin% Contract', { coin: 'hcc' })}
+        </Btn>
+      )}
+      {allowanceList?.usdt && allowanceList.hcc ? <Btn onClick={handleBuy}>{t('Buy It Now')}</Btn> : null}
+    </Flex>
+  )
+}
+
+export default BuyActions
diff --git a/src/views/Referral/components/BuyNftModal.tsx b/src/views/Referral/components/BuyNftModal.tsx
index ff31720..839a35e 100644
--- a/src/views/Referral/components/BuyNftModal.tsx
+++ b/src/views/Referral/components/BuyNftModal.tsx
@@ -3,6 +3,7 @@ import styled from 'styled-components'
 import { useTranslation } from 'contexts/Localization'
 import { useReferralNormalConfigInfo, useReferralCommanderConfigInfo } from 'state/referral/hooks'
 import { Flex, Button, Modal, Image } from '@pancakeswap/uikit'
+import BuyActions from './BuyActions'
 import TextFlex from './TextFlex'
 import FlexCom from './FlexCom'
 
@@ -27,13 +28,7 @@ const InfoDiv = styled.div`
     margin-left: 60px;
   }
 `
-const UpBtn = styled(Button)`
-  width: 50%;
-  margin: 20px auto 0px auto;
-  border-radius: 50px;
-  background: linear-gradient(180deg, #7be0fc 0%, #ac7bf1 100%);
-  border: none;
-`
+
 const ImageDiv = styled(Image)`
   width: 300px;
   height: 300px;
@@ -77,10 +72,10 @@ const BuyNftModal: React.FC = () => {
           <FlexCom name={t('Assets and chain')} value={t('Assets and chain')} />
         </InfoDiv>
       </Flex>
-
-      <Flex>
+      <BuyActions />
+      {/* <Flex>
         <UpBtn>{t('Buy It Now')}</UpBtn>
-      </Flex>
+      </Flex> */}
     </ModalDiv>
   )
 }
diff --git a/src/views/Referral/components/Connected.tsx b/src/views/Referral/components/Connected.tsx
index 6407c7b..9651bbc 100644
--- a/src/views/Referral/components/Connected.tsx
+++ b/src/views/Referral/components/Connected.tsx
@@ -55,9 +55,7 @@ const ConnectedCom: React.FC = () => {
   const { t } = useTranslation()
   const [onBuyModal] = useModal(<BuyNftModal />)
   const referralNormalConfigInfo = useReferralNormalConfigInfo()
-  console.log('referralNormalConfigInfo:', referralNormalConfigInfo)
   const referralRewardInfo = useReferralRewardInfo()
-  console.log('referralRewardInfo:', referralRewardInfo)
   const referralCommanderConfigInfo = useReferralCommanderConfigInfo()
   const getInviteReceive = async () => {
     await inviteReceive()
diff --git a/src/views/Referral/hooks/index.ts b/src/views/Referral/hooks/index.ts
index d769b6d..25f5a16 100644
--- a/src/views/Referral/hooks/index.ts
+++ b/src/views/Referral/hooks/index.ts
@@ -1,39 +1,41 @@
 import { useState, useCallback } from 'react'
 import { useReferralchef, useReferralRewardchef } from 'hooks/useContract'
-import useTokenBalance, { useGetBnbBalance } from 'hooks/useTokenBalance'
-import { getAddress } from 'utils/addressHelpers'
+import useTokenBalance from 'hooks/useTokenBalance'
+import { getAddress, getReferralAddress } from 'utils/addressHelpers'
 import tokensList from 'config/constants/tokens'
 import useToast from 'hooks/useToast'
 import { useTranslation } from 'contexts/Localization'
+import { ethers, Contract } from 'ethers'
 import { getBalanceNumber, getDecimalAmountNumber } from 'utils/formatBalance'
-import { withdrawReward } from 'services/referral'
+import { getWithdrawRewardParams, getBuyReferralParams } from 'services/referral'
 
-const useCheckTokenBalance = ({ isBnb, isHcc, isUsdt }) => {
-  const { balance: bnbTokenBalance } = useGetBnbBalance()
+export const useCheckTokenBalance = ({ isBnb, isHcc, isUsdt }) => {
   const { balance: usdtTokenBalance } = useTokenBalance(getAddress(tokensList.usdt.address))
   const { balance: hccTokenBalance } = useTokenBalance(getAddress(tokensList.hcc.address))
   const { toastWarning } = useToast()
   const { t } = useTranslation()
-  const onCheck = useCallback(() => {
-    if (
-      (isBnb && getBalanceNumber(bnbTokenBalance) === 0) ||
-      (isHcc && getBalanceNumber(hccTokenBalance) === 0) ||
-      (isUsdt && getBalanceNumber(usdtTokenBalance) === 0)
-    ) {
-      toastWarning(t('Insufficient Balance'))
-    }
-  }, [isBnb, isHcc, isUsdt])
+  const onCheck = useCallback(
+    (hccAmount, usdtAmount) => {
+      if (
+        (isHcc && getBalanceNumber(hccTokenBalance) === hccAmount) ||
+        (isUsdt && getBalanceNumber(usdtTokenBalance) === usdtAmount)
+      ) {
+        toastWarning(t('Insufficient Balance'))
+      }
+    },
+    [isBnb, isHcc, isUsdt],
+  )
   return [onCheck]
 }
 
 export const useBuyTransaction = () => {
   const referralContract = useReferralchef()
   const transaction = async () => {
-    const data = await withdrawReward()
-    const { address, receive, timestamp, sign } = data
-    const params = [address, receive, timestamp, sign]
-    const price = getDecimalAmountNumber(receive)
-    const res = await referralContract.adminMint(...params, { value: price })
+    const data = await getBuyReferralParams()
+    const { address, hccPrice, otherPaymentPirce, code, timestamp, sign } = data
+    const params = [address, hccPrice, otherPaymentPirce, code, timestamp, sign]
+    // const price = getDecimalAmountNumber(receive)
+    const res = await referralContract.mint(...params)
     return res
   }
   return transaction
@@ -42,7 +44,7 @@ export const useBuyTransaction = () => {
 export const useWithdraw = () => {
   const referralRewardContract = useReferralRewardchef()
   const transaction = async () => {
-    const data = await withdrawReward()
+    const data = await getWithdrawRewardParams()
     const { address, receive, timestamp, sign } = data
     const params = [address, receive, timestamp, sign]
     const price = getDecimalAmountNumber(receive)
@@ -52,4 +54,18 @@ export const useWithdraw = () => {
   return transaction
 }
 
+export const useApproveReferral = (tokenContract: Contract) => {
+  const handleApprove = useCallback(async () => {
+    try {
+      const tx = await tokenContract.approve(getReferralAddress(), ethers.constants.MaxUint256)
+      const receipt = await tx.wait()
+      return receipt.status
+    } catch (e) {
+      return false
+    }
+  }, [tokenContract])
+
+  return { onApprove: handleApprove }
+}
+
 export default useCheckTokenBalance