diff --git a/src/pages/Nft/NftContract/List/components/AddNftContract.tsx b/src/pages/Nft/NftContract/List/components/AddNftContract.tsx index 473de75..f1495b3 100644 --- a/src/pages/Nft/NftContract/List/components/AddNftContract.tsx +++ b/src/pages/Nft/NftContract/List/components/AddNftContract.tsx @@ -22,8 +22,10 @@ const form = createForm({}); const AddNftContractModal = ({ onOk, onCancel, ...rest }: AddNftContractModalPropsType) => { const handleOk = () => { - const formState = form.getFormState(); - onOk(formState.values); + form.submit(async () => { + const formState = form.getFormState(); + onOk(formState.values); + }); }; const handleCancel = () => { onCancel(); @@ -35,24 +37,31 @@ const AddNftContractModal = ({ onOk, onCancel, ...rest }: AddNftContractModalPro - - + diff --git a/src/pages/Nft/NftContract/List/index.tsx b/src/pages/Nft/NftContract/List/index.tsx index ae77293..400c77b 100644 --- a/src/pages/Nft/NftContract/List/index.tsx +++ b/src/pages/Nft/NftContract/List/index.tsx @@ -1,8 +1,9 @@ import React, { useRef, useState } from 'react'; import Table, { ProColumns, ActionType } from '@/components/Table'; import { message } from 'antd'; -// import { fetchTableData } from '@/utils/table'; +import { fetchTableData } from '@/utils/table'; import AddNftContractModal from './components/AddNftContract'; +import { getContractData, createContract } from '@/services/nft/contract'; const Address: React.FC = () => { const tableRef = useRef(); @@ -35,6 +36,7 @@ const Address: React.FC = () => { { }, }, ]} - // request={async (params) => { - // // return fetchTableData(, params); - // }} + request={async (params) => { + return fetchTableData(getContractData, params); + }} /> { try { const params = { ...val }; - // await creatNftAddress(params); + await createContract(params); message.success('添加成功'); } catch (e) { console.log(e); diff --git a/src/pages/Nft/NftToken/List/components/AddNftModel.tsx b/src/pages/Nft/NftToken/List/components/AddNftModel.tsx index 524e42e..4e349e3 100644 --- a/src/pages/Nft/NftToken/List/components/AddNftModel.tsx +++ b/src/pages/Nft/NftToken/List/components/AddNftModel.tsx @@ -1,11 +1,19 @@ -import React, { useRef } from 'react'; +import React, { useRef, useEffect } from 'react'; import { createForm } from '@formily/core'; import { createSchemaField } from '@formily/react'; import Modal, { ModalProps } from '@/components/Modal'; import Upload from '@/components/Upload'; +import { Button, message } from 'antd'; // import { fetchTableData } from '@/utils/table'; -import { UploadBizType } from '@/constants/enum/uploadBizType'; -import { Form, FormItem, Input, NumberPicker } from '@formily/antd'; +import { + Form, + FormItem, + Input, + NumberPicker, + ArrayItems, + FormButtonGroup, + ArrayTable, +} from '@formily/antd'; interface AddNftModalPropsType extends ModalProps { onOk: (val: any) => void; @@ -18,6 +26,9 @@ const SchemaField = createSchemaField({ Input, NumberPicker, Upload, + ArrayItems, + FormButtonGroup, + ArrayTable, }, }); @@ -25,8 +36,20 @@ const form = createForm({}); const AddNftModal = ({ onOk, onCancel, ...rest }: AddNftModalPropsType) => { const handleOk = () => { - const formState = form.getFormState(); - onOk(formState.values); + form.submit(async () => { + const formState = form.getFormState(); + onOk(formState.values); + }); + }; + const handleAddResoruce = () => { + const resourceList = form.getFieldState('contacts').value; + if (resourceList.length >= 1) { + message.warning('只能添加1个属性'); + return; + } + form.setFieldState('contacts', (state) => { + state.value = [...resourceList, {}]; + }); }; const handleCancel = () => { onCancel(); @@ -37,16 +60,17 @@ const AddNftModal = ({ onOk, onCancel, ...rest }: AddNftModalPropsType) => {
@@ -54,17 +78,89 @@ const AddNftModal = ({ onOk, onCancel, ...rest }: AddNftModalPropsType) => { name="description" title="描述" required + x-validator={{ required: true }} x-decorator="FormItem" x-component="Input" /> + + + + + + + + + + + + + + ); diff --git a/src/pages/Nft/NftToken/List/components/EditNftModel.tsx b/src/pages/Nft/NftToken/List/components/EditNftModel.tsx index fa2aaa9..168b654 100644 --- a/src/pages/Nft/NftToken/List/components/EditNftModel.tsx +++ b/src/pages/Nft/NftToken/List/components/EditNftModel.tsx @@ -3,8 +3,8 @@ import { createForm } from '@formily/core'; import { createSchemaField } from '@formily/react'; import Modal, { ModalProps } from '@/components/Modal'; import Upload from '@/components/Upload'; -// import { fetchTableData } from '@/utils/table'; -import { Form, FormItem, Input, NumberPicker } from '@formily/antd'; +import { Button, message } from 'antd'; +import { Form, FormItem, Input, NumberPicker, ArrayItems, FormButtonGroup } from '@formily/antd'; interface EditNftModalPropsType extends ModalProps { onOk: (val: any) => void; @@ -18,6 +18,8 @@ const SchemaField = createSchemaField({ Input, NumberPicker, Upload, + ArrayItems, + FormButtonGroup, }, }); @@ -28,8 +30,20 @@ const EditNftModal = ({ onOk, onCancel, modalData, ...rest }: EditNftModalPropsT form.setInitialValues(modalData); }); const handleOk = () => { - const formState = form.getFormState(); - onOk(formState.values); + form.submit(async () => { + const formState = form.getFormState(); + onOk(formState.values); + }); + }; + const handleAddResoruce = () => { + const resourceList = form.getFieldState('contacts').value; + if (resourceList.length >= 1) { + message.warning('只能添加1个属性'); + return; + } + form.setFieldState('contacts', (state) => { + state.value = [...resourceList, {}]; + }); }; const handleCancel = () => { onCancel(); @@ -39,26 +53,21 @@ const EditNftModal = ({ onOk, onCancel, modalData, ...rest }: EditNftModalPropsT
- + - - + + + + + + + + + + + + + + ); diff --git a/src/pages/Nft/NftToken/List/index.tsx b/src/pages/Nft/NftToken/List/index.tsx index cbd616f..9dc8442 100644 --- a/src/pages/Nft/NftToken/List/index.tsx +++ b/src/pages/Nft/NftToken/List/index.tsx @@ -3,10 +3,11 @@ import { message, Button, Upload, Space, Row } from 'antd'; import Table, { ProColumns, ActionType } from '@/components/Table'; import { RcFile } from 'antd/lib/upload'; import XLSX from 'xlsx'; -// import { fetchTableData } from '@/utils/table'; +import { fetchTableData } from '@/utils/table'; import EditNftModal from './components/EditNftModel'; import AddNftModal from './components/AddNftModel'; import PaySelectModal from '@/widget/PaySelectModal'; +import { getNftData, createNft, editNft, getTokenId } from '@/services/nft/nft'; const Address: React.FC = () => { const [visible, setVisible] = useState(false); @@ -78,6 +79,18 @@ const Address: React.FC = () => { width: 150, hideInSearch: true, }, + { + title: 'image', + dataIndex: 'image', + width: 150, + hideInSearch: true, + }, + { + title: 'avatar', + dataIndex: 'avatar', + width: 150, + hideInSearch: true, + }, { title: '操作', valueType: 'option', @@ -117,9 +130,9 @@ const Address: React.FC = () => { rowKey="id" search={false} actionRef={tableRef} - // request={async (params) => { - // // return fetchTableData(, params); - // }} + request={async (params) => { + return fetchTableData(getNftData, params); + }} /> { try { const params = { ...val }; console.log(val); - // await creatNftAddress(params); + await createNft(params); message.success('添加成功'); + setVisible(false); tableRef.current?.reload(); } catch (e) { console.log(e); @@ -149,8 +163,7 @@ const Address: React.FC = () => { onOk={async function (val: any): Promise { try { const params = { ...val }; - // await creatNftAddress(params); - console.log(params); + await editNft(params); message.success('添加成功'); tableRef.current?.reload(); } catch (e) { @@ -166,16 +179,17 @@ const Address: React.FC = () => { setPayVisible(false); }} onOk={async function (val: any): Promise { - try { - const params = { ...val }; - // await creatNftAddress(params); - console.log(params); - message.success('添加成功'); - } catch (e) { - console.log(e); - message.success('发生错误'); - setPayVisible(false); - } + // setPayVisible(false); + // try { + // const params = { ...val }; + // // await creatNftAddress(params); + // console.log(params); + // message.success('添加成功'); + // } catch (e) { + // console.log(e); + // message.success('发生错误'); + // setPayVisible(false); + // } }} /> diff --git a/src/services/nft/contract.ts b/src/services/nft/contract.ts new file mode 100644 index 0000000..3a30b62 --- /dev/null +++ b/src/services/nft/contract.ts @@ -0,0 +1,17 @@ +import request from '@/utils/request'; +//获取获取所有合约 +export const getContractData = (params) => { + return request.request({ + url: '/tbg/api/v1/contract/get', + method: 'get', + params, + }); +}; +// 创建合约 +export const createContract = (data) => { + return request.request({ + url: '/tbg/api/v1/erc721/create', + method: 'post', + data, + }); +}; diff --git a/src/services/nft/nft.ts b/src/services/nft/nft.ts new file mode 100644 index 0000000..6434d71 --- /dev/null +++ b/src/services/nft/nft.ts @@ -0,0 +1,33 @@ +import request from '@/utils/request'; +//获取获取所有NFT +export const getNftData = (params) => { + return request.request({ + url: '/tbg/api/v1/nft/get', + method: 'get', + params, + }); +}; +// 创建NFT +export const createNft = (data) => { + return request.request({ + url: '/tbg/api/v1/nft/create', + method: 'post', + data, + }); +}; +//编辑NFT +export const editNft = (data) => { + return request.request({ + url: '/tbg/api/v1/nft/update', + method: 'post', + data, + }); +}; +// 检查TokenId +export const getTokenId = (params) => { + return request.request({ + url: '/tbg/api/v1/nft/check', + method: 'get', + params, + }); +};