From e4c423acbac110c1f7dfbbf7d7fb264638e22a8c Mon Sep 17 00:00:00 2001
From: vance <1143350292@qq.com>
Date: Tue, 30 Aug 2022 17:24:02 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BB=A3=E7=A0=81=E8=A7=84=E8=8C=83=E8=B0=83?=
=?UTF-8?q?=E6=95=B4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
.../List/components/AddNftContract.tsx | 29 +++--
src/pages/Nft/NftContract/List/index.tsx | 14 ++-
.../NftToken/List/components/AddNftModel.tsx | 114 ++++++++++++++++--
.../NftToken/List/components/EditNftModel.tsx | 105 ++++++++++++++--
src/pages/Nft/NftToken/List/index.tsx | 48 +++++---
src/services/nft/contract.ts | 17 +++
src/services/nft/nft.ts | 33 +++++
7 files changed, 305 insertions(+), 55 deletions(-)
create mode 100644 src/services/nft/contract.ts
create mode 100644 src/services/nft/nft.ts
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) => {
);
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,
+ });
+};