gary
/
frontend-recharge-system
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

增加地址代码模块组件化

This commit is contained in:
vancekk 2022-07-08 17:01:59 +08:00
parent 5e3bfec173
commit e6f0c1f96d
6 changed files with 197 additions and 254 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

55
src/pages/Tron/Address/List/components/index.tsx Normal file
View File

@ -0,0 +1,55 @@
import React, { useRef } from 'react';
import { createForm } from '@formily/core';
import { createSchemaField } from '@formily/react';
import Modal, { ModalProps } from '@/components/Modal';
import { Form, FormItem, Input, NumberPicker } from '@formily/antd';
interface AddAddressModalPropsType extends ModalProps {
onOk: (val: any) => void;
onCancel: () => void;
}
const SchemaField = createSchemaField({
components: {
FormItem,
Input,
NumberPicker,
},
});
const form = createForm({});
const AddAddressModal = ({ onOk, onCancel, ...rest }: AddAddressModalPropsType) => {
const handleOk = () => {
const formState = form.getFormState();
onOk(formState.values);
};
const handleCancel = () => {
onCancel();
};
return (
<Modal title="添加地址" onOk={handleOk} onCancel={handleCancel} width={800} {...rest}>
<Form form={form} labelCol={4} wrapperCol={18}>
<SchemaField>
<SchemaField.String
name="alias"
title="备注"
required
x-decorator="FormItem"
x-component="Input"
/>
<SchemaField.Number
name="num"
title="数量"
required
x-decorator="FormItem"
x-component="NumberPicker"
/>
</SchemaField>
</Form>
</Modal>
);
};
export default AddAddressModal;

127
src/pages/Tron/Address/List/index.tsx
View File

@ -1,72 +1,13 @@
import React, { useRef, useState } from 'react';
import Table, { ProColumns, ActionType } from '@/components/Table';
import { Modal, Spin, message } from 'antd';
import { initWeb3, walletSign } from '../../../../utils/web3';
import DetailPageContainer from '@/components/DetailPageContainer';
import {
Form,
FormItem,
Input,
Select,
Submit,
FormGrid,
ArrayItems,
Editable,
Switch,
ArrayTable,
FormButtonGroup,
NumberPicker,
} from '@formily/antd';
import { message } from 'antd';
import AddAddressModal from '@/pages/Tron/Address/List/components/index';
import { initWeb3, walletSign } from '@/utils/web3';
import { creatTronAddress, getAddressList } from '@/services/address';
import { createForm } from '@formily/core';
import { createSchemaField } from '@formily/react';
// import { web3 } from '@/utils/web3';
import { fetchTronTableData } from '@/utils/table';
// import { getTronBalance, getTronTokenBalance, setTronRpc } from '@/utils/tronweb';
// import { useIntl, history, FormattedMessage, useModel } from 'umi';
const Address: React.FC = () => {
const tableRef = useRef<ActionType>();
const [visible, setVisible] = useState(false);
const form = createForm({});
const [loading, setLoading] = useState(false);
const SchemaField = createSchemaField({
components: {
FormItem,
FormGrid,
Input,
Select,
ArrayTable,
Switch,
ArrayItems,
NumberPicker,
Editable,
},
});
// const addAddress = () => {
// setVisible(true);
// };
const handleSubmit = async (val) => {
const params = { ...val };
setLoading(true);
await initWeb3();
const signInfo = await walletSign();
params.key = signInfo.raw;
params.sign = signInfo.sign;
params.coinType = 'tron';
await creatTronAddress(params);
tableRef.current?.reload();
message.success('操作成功');
setLoading(false);
};
// const save = async () => {
// const res = await makeTronAddress(state.form);
// };
// const featchdata = async (item) => {
// const res = await getAddressList(state.form);
// const ret = item
// };
const columns: ProColumns<any>[] = [
{
@ -81,11 +22,6 @@ const Address: React.FC = () => {
hideInSearch: true,
width: '20%',
},
{
title: '余额',
dataIndex: 'balance',
hideInSearch: true,
},
{
title: 'key',
dataIndex: 'key',
@ -112,43 +48,28 @@ const Address: React.FC = () => {
return fetchTronTableData(getAddressList, params);
}}
/>
<Modal
title="添加地址"
centered
<AddAddressModal
visible={visible}
onOk={() => setVisible(false)}
onCancel={() => setVisible(false)}
width={800}
>
<DetailPageContainer>
<Spin spinning={loading}>
<Form form={form} labelCol={4} wrapperCol={18} onAutoSubmit={handleSubmit}>
<SchemaField>
<SchemaField.String
name="alias"
title="备注名"
required
x-decorator="FormItem"
x-component="Input"
/>
<SchemaField.Number
name="num"
title="数量"
required
x-validator="number"
x-decorator="FormItem"
x-component="NumberPicker"
/>
</SchemaField>
<FormButtonGroup.FormItem>
<Submit block size="large">
确定
</Submit>
</FormButtonGroup.FormItem>
</Form>
</Spin>
</DetailPageContainer>
</Modal>
onCancel={function () {
setVisible(false);
}}
onOk={async function (val: any): Promise<void> {
try {
await initWeb3();
const signInfo = await walletSign();
val.key = signInfo.raw;
val.sign = signInfo.sign;
val.coinType = 'tron';
const params = { ...val };
await creatTronAddress(params);
message.success('添加成功');
} catch (e) {
console.log(e);
message.success('发生错误');
setVisible(false);
}
}}
/>
</div>
);
};

11
src/pages/Tron/Record/List/index.tsx
View File

@ -8,14 +8,12 @@ const Address: React.FC = () => {
{
title: '交易哈希',
dataIndex: 'txHash',
// width: '10%',
hideInSearch: true,
},
{
title: '金额',
dataIndex: 'amount',
hideInSearch: true,
// width: '20%',
},
{
@ -68,17 +66,8 @@ const Address: React.FC = () => {
<div>
<Table
columns={columns}
// indexColumn
rowKey="id"
actionRef={tableRef}
// toolBarActions={[
// {
// type: 'add',
// onConfirm: () => {
// history.push(RoutePath.WORK.EDIT);
// },
// },
// ]}
request={async (params) => {
return fetchTronTableData(getTronRecord, params);
}}

93
src/pages/Tron/Token/List/components/index.tsx Normal file
View File

@ -0,0 +1,93 @@
import React, { useRef } from 'react';
import { createForm } from '@formily/core';
import { createSchemaField } from '@formily/react';
import Modal, { ModalProps } from '@/components/Modal';
import { Form, FormItem, Input, NumberPicker } from '@formily/antd';
interface AddTokenModalPropsType extends ModalProps {
onOk: (val: any) => void;
onCancel: () => void;
}
const SchemaField = createSchemaField({
components: {
FormItem,
Input,
NumberPicker,
},
});
const form = createForm({});
const AddTokenModal = ({ onOk, onCancel, ...rest }: AddTokenModalPropsType) => {
const handleOk = () => {
const formState = form.getFormState();
onOk(formState.values);
};
const handleCancel = () => {
onCancel();
};
return (
<Modal title="添加地址" onOk={handleOk} onCancel={handleCancel} width={800} {...rest}>
<Form form={form} labelCol={4} wrapperCol={18}>
<SchemaField>
<SchemaField.String
name="network"
title="网络名称"
required
x-decorator="FormItem"
x-component="Input"
/>
<SchemaField.String
name="rpcUrl"
title="RPC URL"
required
x-component-props={{ maxLength: 100, showCount: true }}
x-decorator="FormItem"
x-component="Input.TextArea"
/>
<SchemaField.String
name="apiKey"
title="API Key"
required
x-decorator="FormItem"
x-component="Input"
/>
<SchemaField.Number
name="contract"
title="代币合约地址（放空则查找主代币"
required
x-validator="number"
x-decorator="FormItem"
x-component="NumberPicker"
/>
<SchemaField.String
name="symbol"
title="代币符号"
required
x-decorator="FormItem"
x-component="Editor"
/>
<SchemaField.String
name="decimals"
title="精度"
required
x-decorator="FormItem"
x-component="Editor"
/>
<SchemaField.String
name="browser"
title="区块浏览器"
required
x-decorator="FormItem"
x-component="Editor"
/>
</SchemaField>
</Form>
</Modal>
);
};
export default AddTokenModal;

158
src/pages/Tron/Token/List/index.tsx
View File

@ -1,51 +1,12 @@
import React, { useRef, useState } from 'react';
import Table, { ProColumns, ActionType } from '@/components/Table';
import { Modal, Spin, message } from 'antd';
import { createSchemaField } from '@formily/react';
import { createForm } from '@formily/core';
import DetailPageContainer from '@/components/DetailPageContainer';
// import { fetchTronTableData } from '@/utils/table';
import {
Form,
FormItem,
Input,
Select,
Submit,
FormGrid,
ArrayItems,
Editable,
Switch,
ArrayTable,
FormButtonGroup,
NumberPicker,
} from '@formily/antd';
import { message } from 'antd';
import AddTokenModal from '@/pages/Tron/Token/List/components/index';
import { initWeb3, walletSign } from '@/utils/web3';
const Address: React.FC = () => {
const tableRef = useRef<ActionType>();
const form = createForm({});
const [visible, setVisible] = useState(false);
const [loading, setLoading] = useState(false);
const SchemaField = createSchemaField({
components: {
FormItem,
FormGrid,
Input,
Select,
ArrayTable,
Switch,
ArrayItems,
NumberPicker,
Editable,
},
});
// const state = {
// queryForm: {
// page: 1,
// size: 20,
// coin_type: 'tron',
// },
// };
const columns: ProColumns<any>[] = [
{
title: '网络名称',
@ -96,27 +57,10 @@ const Address: React.FC = () => {
width: 150,
},
];
const handleSubmit = async (val) => {
const params = { ...val };
setLoading(true);
params.cointype = 'tron';
// const res = await makeTronAddress(params);
// if(res.code == 200){
// }
tableRef.current?.reload();
message.success('操作成功');
setLoading(false);
// history.back();
// } catch (e) {
// setLoading(false);
// }
};
return (
<div>
<Table
columns={columns}
// indexColumn
rowKey="id"
actionRef={tableRef}
toolBarActions={[
@ -127,83 +71,29 @@ const Address: React.FC = () => {
},
},
]}
// request={async (params) => {
// return fetchTronTableData(queryWorkList, state.queryForm);
// }}
/>
<Modal
title="添加地址"
centered
<AddTokenModal
visible={visible}
onOk={() => setVisible(false)}
onCancel={() => setVisible(false)}
width={800}
>
<DetailPageContainer>
<Spin spinning={loading}>
<Form form={form} labelCol={4} wrapperCol={18} onAutoSubmit={handleSubmit}>
<SchemaField>
<SchemaField.String
name="network"
title="网络名称"
required
x-decorator="FormItem"
x-component="Input"
/>
<SchemaField.String
name="rpcUrl"
title="RPC URL"
required
x-component-props={{ maxLength: 100, showCount: true }}
x-decorator="FormItem"
x-component="Input.TextArea"
/>
<SchemaField.String
name="apiKey"
title="API Key"
required
x-decorator="FormItem"
x-component="Input"
/>
<SchemaField.Number
name="contract"
title="代币合约地址（放空则查找主代币"
required
x-validator="number"
x-decorator="FormItem"
x-component="NumberPicker"
/>
<SchemaField.String
name="symbol"
title="代币符号"
required
x-decorator="FormItem"
x-component="Editor"
/>
<SchemaField.String
name="decimals"
title="精度"
required
x-decorator="FormItem"
x-component="Editor"
/>
<SchemaField.String
name="browser"
title="区块浏览器"
required
x-decorator="FormItem"
x-component="Editor"
/>
</SchemaField>
<FormButtonGroup.FormItem>
<Submit block size="large">
确定
</Submit>
</FormButtonGroup.FormItem>
</Form>
</Spin>
</DetailPageContainer>
</Modal>
onCancel={function () {
setVisible(false);
}}
onOk={async function (val: any): Promise<void> {
try {
await initWeb3();
const signInfo = await walletSign();
val.key = signInfo.raw;
val.sign = signInfo.sign;
val.coinType = 'tron';
const params = { ...val };
// await creatTronAddress(params);
message.success('添加成功');
} catch (e) {
console.log(e);
message.success('添加错误');
setVisible(false);
}
}}
/>
</div>
);
};

7
src/utils/table.ts
View File

@ -1,5 +1,4 @@
// 格式化表格获取数据接口的返回
import { getTronBalance } from './tronweb';
export const fetchTableData = async (
fetch: (params: any) => Promise<any>,
params: any,
@ -33,14 +32,10 @@ export const fetchTronTableData = async (
params.coinType = 'tron';
const res = (await fetch(params)) || {};
const data = res;
data.forEach((n: any) => {
// n.balance = getTronBalance(n.address);
console.log(n.address);
});
data.forEach((n: any) => {});
data?.forEach((n: any) => {
for (const key in formatObj) {
n[key] = n[formatObj[key]];
n.balance = getTronBalance(n.address);
}
});
return {