From 25af48a21957c76e00af9a313b927cb92126ffa1 Mon Sep 17 00:00:00 2001 From: zzy <> Date: Fri, 10 Jun 2022 15:02:18 +0800 Subject: [PATCH] =?UTF-8?q?=E6=B7=BB=E5=8A=A0web3=E7=99=BB=E5=BD=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- package.json | 8 ++- .../Address/Edit/components/AddAddress.tsx | 0 src/pages/Eth/Address/List/index.tsx | 0 .../Currency/Edit/components/AddCurrency.tsx | 0 src/pages/Eth/Currency/List/index.tsx | 0 src/pages/Eth/Record/List/index.tsx | 0 src/pages/Login/index.tsx | 11 +++- src/routes/index.ts | 44 ++++++++++++++ src/routes/routePath.ts | 14 +++++ src/services/login.ts | 18 +++++- src/utils/request.ts | 2 +- src/utils/web3.ts | 57 +++++++++++++++++++ 12 files changed, 147 insertions(+), 7 deletions(-) create mode 100644 src/pages/Eth/Address/Edit/components/AddAddress.tsx create mode 100644 src/pages/Eth/Address/List/index.tsx create mode 100644 src/pages/Eth/Currency/Edit/components/AddCurrency.tsx create mode 100644 src/pages/Eth/Currency/List/index.tsx create mode 100644 src/pages/Eth/Record/List/index.tsx create mode 100644 src/utils/web3.ts diff --git a/package.json b/package.json index 3e4df34..80d49e4 100644 --- a/package.json +++ b/package.json @@ -72,7 +72,11 @@ "react-dom": "^17.0.0", "react-helmet-async": "^1.0.4", "umi": "^3.5.0", - "umi-serve": "^1.9.10" + "umi-serve": "^1.9.10", + "web3": "^1.7.0", + "@metamask/detect-provider": "^1.2.0", + "@walletconnect/client": "^1.7.1", + "@walletconnect/qrcode-modal": "^1.7.1" }, "devDependencies": { "@ant-design/pro-cli": "^2.0.2", @@ -94,7 +98,7 @@ "@umijs/yorkie": "^2.0.3", "babel-plugin-import": "^1.13.3", "carlo": "^0.9.46", - "cross-env": "^7.0.0", + "cross-env": "^7.0.3", "cross-port-killer": "^1.1.1", "detect-installer": "^1.0.1", "enzyme": "^3.11.0", diff --git a/src/pages/Eth/Address/Edit/components/AddAddress.tsx b/src/pages/Eth/Address/Edit/components/AddAddress.tsx new file mode 100644 index 0000000..e69de29 diff --git a/src/pages/Eth/Address/List/index.tsx b/src/pages/Eth/Address/List/index.tsx new file mode 100644 index 0000000..e69de29 diff --git a/src/pages/Eth/Currency/Edit/components/AddCurrency.tsx b/src/pages/Eth/Currency/Edit/components/AddCurrency.tsx new file mode 100644 index 0000000..e69de29 diff --git a/src/pages/Eth/Currency/List/index.tsx b/src/pages/Eth/Currency/List/index.tsx new file mode 100644 index 0000000..e69de29 diff --git a/src/pages/Eth/Record/List/index.tsx b/src/pages/Eth/Record/List/index.tsx new file mode 100644 index 0000000..e69de29 diff --git a/src/pages/Login/index.tsx b/src/pages/Login/index.tsx index a06865a..47cded9 100644 --- a/src/pages/Login/index.tsx +++ b/src/pages/Login/index.tsx @@ -1,4 +1,4 @@ -import { LockOutlined, UserOutlined } from '@ant-design/icons'; +import { LeftSquareFilled, LockOutlined, UserOutlined } from '@ant-design/icons'; import React, { useState } from 'react'; import { ProFormText, LoginForm } from '@ant-design/pro-form'; import { useIntl, history, FormattedMessage, useModel } from 'umi'; @@ -7,13 +7,18 @@ import defaultSettings from '../../../config/defaultSettings'; import styles from './index.less'; import { CACHE_TOKEN } from '@/constants/cacheKey'; +import { initWeb3, walletSign } from '../../utils/web3'; + const Login: React.FC = () => { const intl = useIntl(); - const handleSubmit = async (values: API.LoginParams) => { // 登录 - const res: any = await login({ ...values }); + await initWeb3(); + const signInfo = await walletSign(); + const res: any = await login({ data: signInfo.raw, sign: signInfo.sign }); localStorage.setItem(CACHE_TOKEN, res.token); + // const res: any = await login({ ...values }); + // localStorage.setItem(CACHE_TOKEN, res.token); /** 此方法会跳转到 redirect 参数所在的位置 */ if (!history) return; const { query } = history.location; diff --git a/src/routes/index.ts b/src/routes/index.ts index e6d4016..81dd357 100644 --- a/src/routes/index.ts +++ b/src/routes/index.ts @@ -10,6 +10,50 @@ export default [ layout: false, component: './Login', }, + { + name: 'ETH', + path: RoutePath.ETH, + routes: [ + { + path: RoutePath.ETH, + redirect: RoutePath.ADDRESS.LIST, + hideInMenu: true, + }, + { + name: 'ETH地址管理', + path: RoutePath.ADDRESS.LIST, + component: './Work/List', + }, + { + name: 'ETH地址详情', + path: RoutePath.ADDRESS.EDIT, + hideInMenu: true, + component: './Work/Edit', + }, + { + name: 'ETH充值记录', + path: RoutePath.RECORD.LIST, + component: './Work/List', + }, + { + name: 'ETH充值详情', + path: RoutePath.RECORD.EDIT, + hideInMenu: true, + component: './Work/Edit', + }, + { + name: 'ETH币种管理', + path: RoutePath.CURRENCY.LIST, + component: './Work/List', + }, + { + name: 'ETH币种详情', + path: RoutePath.CURRENCY.EDIT, + hideInMenu: true, + component: './Work/Edit', + }, + ], + }, { name: '设置', path: RoutePath.SETTING, diff --git a/src/routes/routePath.ts b/src/routes/routePath.ts index 566cd52..6a53c47 100644 --- a/src/routes/routePath.ts +++ b/src/routes/routePath.ts @@ -1,6 +1,20 @@ const SETTING = '/setting'; +const ETH = '/eth'; const RoutePath = { LOGIN: '/login', + ETH: ETH, + ADDRESS: { + LIST: `${ETH}/address`, + EDIT: `${ETH}/address/edit`, + }, + RECORD: { + LIST: `${ETH}/record`, + EDIT: `${ETH}/record/edit`, + }, + CURRENCY: { + LIST: `${ETH}/currency`, + EDIT: `${ETH}/currency/edit`, + }, SETTING: SETTING, WORK: { LIST: `${SETTING}/work`, diff --git a/src/services/login.ts b/src/services/login.ts index a8a49e8..de4d1cd 100644 --- a/src/services/login.ts +++ b/src/services/login.ts @@ -1,8 +1,24 @@ import request from '@/utils/request'; +// export const login = (data) => { +// return request.request({ +// url: '/admin/login', +// method: 'post', +// data, +// }); +// }; + +export const getData = (params) => { + return request.request({ + url: '/admin/api/v1/sign', + method: 'get', + params, + }); +}; + export const login = (data) => { return request.request({ - url: '/admin/login', + url: '/admin/api/v1/login', method: 'post', data, }); diff --git a/src/utils/request.ts b/src/utils/request.ts index 6664c28..c64c710 100644 --- a/src/utils/request.ts +++ b/src/utils/request.ts @@ -6,7 +6,7 @@ import { CACHE_TOKEN } from '@/constants/cacheKey'; // create an axios instance const request = axios.create({ - baseURL: '', // + baseURL: 'http://192.168.31.249:8888', // timeout: 10000, // request timeout }); // request interceptor diff --git a/src/utils/web3.ts b/src/utils/web3.ts new file mode 100644 index 0000000..b64adcb --- /dev/null +++ b/src/utils/web3.ts @@ -0,0 +1,57 @@ +import Web3 from 'web3'; +import detectEthereumProvider from '@metamask/detect-provider'; +import { getData } from '@/services/login'; + +let provider: any; + +export const web3 = new Web3(); +if (typeof window.ethereum !== 'undefined') { + web3.eth.defaultAccount = window.ethereum.selectedAddress; +} + +export async function initWeb3() { + provider = await detectEthereumProvider(); + + if (!provider) { + console.log('请安装MetaMask'); + return false; + } + + try { + web3.setProvider(provider); + const accounts = await provider.request({ + method: 'eth_requestAccounts', + }); + //如果用户同意了登录请求，你就可以拿到用户的账号 + web3.eth.defaultAccount = accounts[0]; + return true; + } catch (reason) { + switch (reason) { + case 'Already processing eth_requestAccounts. Please wait.': // 已有请求存在 + console.log('请打开MetaMask完成授权'); + break; + case 'User rejected provider access': //如果用户拒绝了登录请求 + console.log('请同意登录请求'); + break; + default: + // 本不该执行到这里，但是真到这里了，说明发生了意外 + console.log('登录出错！err:' + reason); + break; + } + } + return false; +} + +export async function walletSign() { + const res: any = await getData({}); + // const data = '1234'; + const rawData: any = web3.utils.fromUtf8(res); + const { result } = await provider.send('personal_sign', [ + rawData, + web3.eth.defaultAccount!.toLowerCase(), + ]); + return { + raw: res, + sign: result, + }; +}