Skip to content

B
blindBox-vue
Commit a30223ad by haojie
Options

1

parent a5f84f81
Showing with 110 additions and 63 deletions
src/components/Foxwallet/index.less
...@@ -34,6 +34,9 @@ ...@@ -34,6 +34,9 @@
margin-left: 12px; margin-left: 12px;
} }
} }
& > :not(:first-child) {
margin-top: 12px;
}
} }
} }
} }
......
src/components/Foxwallet/index.tsx
...@@ -3,10 +3,12 @@ import { useFoxDialog } from '@/store/dialog'; ...@@ -3,10 +3,12 @@ import { useFoxDialog } from '@/store/dialog';
import './index.less'; import './index.less';
import CloseSvg from '@/assets/svg/dialog/close.svg'; import CloseSvg from '@/assets/svg/dialog/close.svg';
import FoxSvg from '@/assets/svg/dialog/fox.svg'; import FoxSvg from '@/assets/svg/dialog/fox.svg';
import BkSvg from '@/assets/img/bk_wallet.png';
import { MessagePlugin } from 'tdesign-vue-next'; import { MessagePlugin } from 'tdesign-vue-next';
import Loading from '../Loading'; import Loading from '../Loading';
import { useFoxWallet } from '@/store/FoxWallet'; import { useFoxWallet } from '@/store/FoxWallet';
import { useI18n } from 'vue-i18n'; import { useI18n } from 'vue-i18n';
import { Connect_Fox_tp_wallet, Connect_BK_wallet } from '@/utils/ethers';
export default defineComponent({ export default defineComponent({
setup(props) { setup(props) {
const { $state: foxDialog } = useFoxDialog(); const { $state: foxDialog } = useFoxDialog();
...@@ -20,8 +22,13 @@ export default defineComponent({ ...@@ -20,8 +22,13 @@ export default defineComponent({
{ {
icon: <FoxSvg></FoxSvg>, icon: <FoxSvg></FoxSvg>,
label: 'MetaMask Wallet', label: 'MetaMask Wallet',
value: '', value: 'fox',
}, },
// {
// icon: <img src={BkSvg} alt="" />,
// label: 'BitKeep',
// value: 'bk',
// },
], ],
}); });
const dialogHead = () => { const dialogHead = () => {
...@@ -30,23 +37,19 @@ export default defineComponent({ ...@@ -30,23 +37,19 @@ export default defineComponent({
const closeIcon = () => { const closeIcon = () => {
return <CloseSvg></CloseSvg>; return <CloseSvg></CloseSvg>;
}; };
// 连接小狐狸或tp
const getConnectFox = async (tooltip: boolean) => { const getConnectFox = async (tooltip: boolean) => {
// 这里是用户主动连接，临时存储到本地，刷新页面时自动赋值 // 这里是用户主动连接，临时存储到本地，刷新页面时自动赋值
let eth: any = window; let eth: any = window;
try { try {
const accounts = await eth.ethereum.request({ // 连接小狐狸或tp
method: 'eth_requestAccounts', let address_list = await Connect_Fox_tp_wallet();
}); if (address_list.address) {
if (accounts[0]) { userAddress.address = address_list.address;
userAddress.address = accounts[0]; userAddress.MaskAddress = address_list.MaskAddress;
userAddress.MaskAddress = `${accounts[0].slice( userAddress.value = 'fox';
0, // 记录上次连接的钱包
6 window.sessionStorage.setItem('ConnectFox', 'fox');
)}...${accounts[0].slice(
accounts[0].length - 4,
accounts[0].length
)}`;
window.sessionStorage.setItem('ConnectFox', 'true');
} }
if (tooltip) { if (tooltip) {
MessagePlugin.closeAll(); MessagePlugin.closeAll();
...@@ -65,12 +68,35 @@ export default defineComponent({ ...@@ -65,12 +68,35 @@ export default defineComponent({
console.log(e); console.log(e);
} }
}; };
const CustConnectBk = async (tooltip: boolean) => {
try {
let address_list: any = await Connect_BK_wallet();
if (address_list.address) {
userAddress.address = address_list.address;
userAddress.MaskAddress = address_list.MaskAddress;
userAddress.value = 'bk';
// 记录上次连接的钱包
window.sessionStorage.setItem('ConnectFox', 'bk');
if (tooltip) {
MessagePlugin.closeAll();
MessagePlugin.success(t('header.connectSuccess'));
}
}
} catch (e) {
console.log(e);
}
};
// 连接钱包 // 连接钱包
const ToConnectWallet = async (item: any) => { const ToConnectWallet = async (item: any) => {
try { try {
loading.value = false; loading.value = false;
if (item.value == 'fox') {
// 连接钱包--主动连接--需要提示文字 // 连接钱包--主动连接--需要提示文字
getConnectFox(true); getConnectFox(true);
} else if (item.value == 'bk') {
// 连接bk
CustConnectBk(true);
}
} catch (e) { } catch (e) {
console.log(e); console.log(e);
loading.value = false; loading.value = false;
...@@ -79,9 +105,12 @@ export default defineComponent({ ...@@ -79,9 +105,12 @@ export default defineComponent({
// 自动连接-- // 自动连接--
const custConnect = () => { const custConnect = () => {
let ConnectFox = window.sessionStorage.getItem('ConnectFox'); let ConnectFox = window.sessionStorage.getItem('ConnectFox');
if (ConnectFox == 'true') { if (ConnectFox == 'fox') {
// 不显示提示文字 // 不显示提示文字
getConnectFox(false); getConnectFox(false);
} else if (ConnectFox == 'bk') {
// 连接bk
CustConnectBk(false);
} }
}; };
onMounted(() => { onMounted(() => {
......
src/pages/raffle/components/ActivityDetail/index.tsx
...@@ -14,7 +14,7 @@ import { ...@@ -14,7 +14,7 @@ import {
} from '@/utils/api/BlindBox'; } from '@/utils/api/BlindBox';
import { useRoute } from 'vue-router'; import { useRoute } from 'vue-router';
import { useI18n } from 'vue-i18n'; import { useI18n } from 'vue-i18n';
import { fox_EtherPay } from '@/utils/ethers'; import { fox_EtherPay, bk_EtherPay } from '@/utils/ethers';
import Loading from '@/components/Loading'; import Loading from '@/components/Loading';
export default defineComponent({ export default defineComponent({
props: { props: {
...@@ -92,6 +92,7 @@ export default defineComponent({ ...@@ -92,6 +92,7 @@ export default defineComponent({
} }
} }
}; };
// 小狐狸-tp支付
const send_token = async () => { const send_token = async () => {
let hash: any = await fox_EtherPay(FoxWallet.to, props.info.price); let hash: any = await fox_EtherPay(FoxWallet.to, props.info.price);
if (hash) { if (hash) {
...@@ -100,14 +101,27 @@ export default defineComponent({ ...@@ -100,14 +101,27 @@ export default defineComponent({
recharge(hash, parseInt(props.info.price)); recharge(hash, parseInt(props.info.price));
} }
}; };
// bk-支付
const send_bk_token = async () => {
let hash: any = await bk_EtherPay(FoxWallet.to, props.info.price);
if (hash) {
UserHash.value = hash;
// 发送充值信息
recharge(hash, parseInt(props.info.price));
}
};
// 支付 // 支付
const Payment = () => { const Payment = () => {
if (!FoxWallet.to) { if (!FoxWallet.to) {
MessagePlugin.warning(t('raffle.Missingpayment')); MessagePlugin.warning(t('raffle.Missingpayment'));
return; return;
} }
if (FoxWallet.value == 'fox') {
// ethers // ethers
send_token(); send_token();
} else if (FoxWallet.value == 'bk') {
send_bk_token();
}
}; };
const getUserBuyStatus = async () => { const getUserBuyStatus = async () => {
try { try {
......
src/store/FoxWallet.ts
...@@ -6,6 +6,7 @@ export const useFoxWallet = defineStore('FoxWallet', { ...@@ -6,6 +6,7 @@ export const useFoxWallet = defineStore('FoxWallet', {
address: '', address: '',
MaskAddress: '', MaskAddress: '',
to: '', to: '',
value: '',
}; };
}, },
}); });
src/utils/ethers.ts
import { ethers } from 'ethers'; import { ethers } from 'ethers';
import { MessagePlugin } from 'tdesign-vue-next'; import { MessagePlugin } from 'tdesign-vue-next';
import ERC20ABI from './ERC20ABI.json'; import ERC20ABI from './ERC20ABI.json';
// 发起交易 let eth: any = window;
// 发起交易--小狐狸-tp支付
export const fox_EtherPay = async (to: string, price: number) => { export const fox_EtherPay = async (to: string, price: number) => {
try { try {
let eth: any = window;
// 代币地址 // 代币地址
const USDT = '0xc5a25e92e691635BDd6DF2e904633Dc3152360cD'; const USDT = '0xc5a25e92e691635BDd6DF2e904633Dc3152360cD';
const provider = new ethers.providers.Web3Provider(eth.ethereum); const provider = new ethers.providers.Web3Provider(eth.ethereum);
...@@ -34,49 +35,48 @@ export const fox_EtherPay = async (to: string, price: number) => { ...@@ -34,49 +35,48 @@ export const fox_EtherPay = async (to: string, price: number) => {
} }
}; };
export interface MyWalletOptions { export const bk_EtherPay = async (to: string, price: number) => {
chains: any[]; try {
shimDisconnect?: boolean; } catch (e) {
} console.log(e);
// const TokenPocket = ({ chains, shimDisconnect }: MyWalletOptions) => { }
// let eth: any = window; };
// let tpEtheruem = typeof eth !== 'undefined' ? eth.ethereum : undefined; // 是否安装小狐狸钱包插件
// const isTokenPocketInjected = export const CanNotDownLoadFoxWallet = () => {};
// typeof tpEtheruem !== 'undefined' && tpEtheruem?.isTokenPocket === true;
// const shouldUseWalletConnect = !isBrowser && !isTokenPocketInjected; // 连接小狐狸或tp钱包
// return { export const Connect_Fox_tp_wallet = async () => {
// id: 'Token Pocket', const accounts = await eth.ethereum.request({
// name: 'Token Pocket', method: 'eth_requestAccounts',
// iconUrl: TokenpocketSVG, });
// iconBackground: 'transparent', return address_filter(accounts);
// installed: !shouldUseWalletConnect ? isTokenPocketInjected : undefined, };
// downloadUrls: {
// android: // 连接bk钱包
// 'https://play.google.com/store/apps/details?id=vip.mytokenpocket', export const Connect_BK_wallet = async () => {
// ios: 'https://apps.apple.com/cn/app/tokenpocket-trusted-wallet/id1436028697', const provider = eth.bitkeep && eth.bitkeep.ethereum;
// browserExtension: if (!provider) {
// 'https://chrome.google.com/webstore/detail/tokenpocket/mfgccjchihfkkindfppnaooecgfneiii', MessagePlugin.warning('尚未安装BitKeep');
// qrCode: return;
// 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAARgAAAEYAQMAAAC9QHvPAAAABlBMVEX///8AAABVwtN+AAACj0lEQVRo3uWawbHDIAxEN+ODj5RAKe4s5nfmUlyCjz4w1tcukNSAwkwSC54OCAkkHERti7FdeCNZcXmDP/x5x77cWWMlLnMDWK/NKrK5woHVBO9254NKszLZnvXCy7yxi7/PcmUX8uFW+QHmzW6zE3Zj+6vuBDUEg8XOXc59p+Nl3oEfYJrPF8ayC5scoALoPj8rY2wXl9rn7t3P+hU0FpfpbSvLMIsZ1z1/hjAtw+7dLj6cLqbjDeRiPncKcZlv+LZ4loJ6nfMRYE6GT4plH985/gB9wyLMCI/NIMkkhbHc8yjapttnSsZnOdIH7HX1BxlCCoDmHpbBeoI+j8H07mx1PbdntUmZ7zGb+H3Cg9o/UpBzb8EZ//QSBzIWlYq58CDZtAy0utybsRrHDwA8c6UNxGXslBUeANqSP8kHXFO58aRMa1p3ePhChrioQCEyw662uulE5aZmKvwwomFipq9wLhVy7uO9WFegdliGEq1gLHHY9XI3f0YOqQCYkmEFrunCmSpBhsDOcU8sAjPdPvBxgDnkS8XPuKCxqRmXH4hTbkwhlzESl+Exa3f6bsmj6Bu3UNuczKJriHZ/WOjcqs3F9DwqNvMwasnQPgxsAN3nncOcjH9rdUdKqPCVIQQHZzyrSFzuUz5PjsttdreHMiUDjC3ZzlHQqqgrIz8Mzui1RrtWU8lOoVBBlpuSGXsU575j7QcQk0XzpnUPy/TWwld3p+NsUv3uI3Myi7H1PcpGUtXuJfROKjLT3lvxbBIjn6dg3T7ApEzLliRxumLk096UYUVn8KpQDetwOobPbyz85mb2mrybwviPR237s0VmAOg/A94NZGO3LoipDUzLGBsZMx2z4/LlmyiHZX64/QPNL9thE1XE0AAAAABJRU5ErkJggg==', }
// }, // 连接钱包
// createConnector: () => { const accounts = await provider.request({ method: 'eth_requestAccounts' });
// const connector = shouldUseWalletConnect return address_filter(accounts);
// ? getWalletConnectConnector({ chains }) };
// : new InjectedConnector({ chains, options: { shimDisconnect } });
// return { // 地址过滤
// connector, export const address_filter = (accounts: string[]) => {
// mobile: { if (accounts && accounts[0]) {
// getUri: shouldUseWalletConnect return {
// ? async () => { address: accounts[0],
// const connectorInfo: any = await connector.getProvider(); MaskAddress: `${accounts[0].slice(0, 6)}...${accounts[0].slice(
// return `tpoutside://wc?uri=${encodeURIComponent( accounts[0].length - 4,
// connectorInfo?.connector?.uri accounts[0].length
// )}`; )}`,
// } };
// : undefined, }
// }, return {
// }; address: '',
// }, MaskAddress: '',
// }; };
// }; };
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment