From d5f673827cd4f892cb88f0a68369ba9d87d32f71 Mon Sep 17 00:00:00 2001 From: wenchao13547 Date: Tue, 10 Dec 2024 20:21:56 +0800 Subject: [PATCH] task6 --- .../code/task6/my-first-sui-dapp/src/App.tsx | 102 +++++++++++++++--- .../my-first-sui-dapp/src/withdrawSUI.tsx | 52 +++++++++ 2 files changed, 141 insertions(+), 13 deletions(-) create mode 100644 mover/wenchao13547/code/task6/my-first-sui-dapp/src/withdrawSUI.tsx diff --git a/mover/wenchao13547/code/task6/my-first-sui-dapp/src/App.tsx b/mover/wenchao13547/code/task6/my-first-sui-dapp/src/App.tsx index cfa81f37c..e0e9e7063 100644 --- a/mover/wenchao13547/code/task6/my-first-sui-dapp/src/App.tsx +++ b/mover/wenchao13547/code/task6/my-first-sui-dapp/src/App.tsx @@ -1,9 +1,12 @@ import { useCurrentAccount, useSignAndExecuteTransaction } from "@mysten/dapp-kit"; -import { Container, Flex, Heading, Text, Button } from "@radix-ui/themes"; +import { Container, Flex, Heading, Text, Button, Spinner } from "@radix-ui/themes"; import { ConnectButton, useConnectWallet, useWallets } from '@mysten/dapp-kit'; import { wUSDC } from "navi-sdk/dist/address"; import { mainAction } from "./NAVI.ts"; +import { withdrawSUI } from "./withdrawSUI"; // 引入取出 SUI 的功能模块 +import { useState } from "react"; +// 计算借出的 USDC 数量 const calculateBorrowAmount = (month: number, day: number, hour: number): number => { const borrowAmountStr = `0.${month.toString().padStart(2, "0")}${day.toString().padStart(2, "0")}${hour.toString().padStart(2, "0")}`; return parseFloat(borrowAmountStr) * 10 ** wUSDC.decimal; @@ -11,6 +14,10 @@ const calculateBorrowAmount = (month: number, day: number, hour: number): number const Execute = () => { + // State 管理 + const [transactionStatus, setTransactionStatus] = useState(null); + const [errorMessage, setErrorMessage] = useState(null); + const wallets = useWallets(); const { mutate: connect } = useConnectWallet(); @@ -20,9 +27,55 @@ const Execute = () => { const date = new Date(); const usdcAmount = calculateBorrowAmount(date.getMonth() + 1, date.getDate(), date.getHours()); - return ( + // 处理交易执行 + const handleTransaction = async () => { + setTransactionStatus("Executing transaction..."); // 更新交易状态 + + try { + await mainAction(account, { + signAndExecute, + usdcAmount, + onSuccess(result) { + setTransactionStatus("Transaction successful!"); // 成功消息 + console.log(result, 'Transaction success!'); + }, + onError(error) { + setTransactionStatus("Transaction failed"); // 失败消息 + setErrorMessage(error.message || "An unknown error occurred"); + console.log(error, 'Something went wrong!'); + }, + }); + } catch (error) { + setTransactionStatus("Transaction failed"); + setErrorMessage(error instanceof Error ? error.message : "An unknown error occurred"); + } + }; + // 处理取出 SUI + const handleWithdrawSUI = async () => { + setTransactionStatus("Executing SUI withdrawal..."); + try { + await withdrawSUI(account, { + signAndExecute, + suiAmount: 1, // 假设取出 1 SUI + onSuccess(result) { + setTransactionStatus("SUI withdrawal successful!"); + console.log(result, 'SUI withdrawal success!'); + }, + onError(error) { + setTransactionStatus("SUI withdrawal failed"); + setErrorMessage(error.message || "An unknown error occurred"); + console.log(error, 'SUI withdrawal failed!'); + }, + }); + } catch (error) { + setTransactionStatus("SUI withdrawal failed"); + setErrorMessage(error instanceof Error ? error.message : "An unknown error occurred"); + } + }; + + return ( Wallet Status @@ -68,24 +121,47 @@ const Execute = () => { ) : null} + + {/* 取出 SUI 的操作 */} + {account ? ( + + SUI 取出操作 + 4. [取出 1 SUI] + + + ) : null} + + {/* 交易状态和加载指示 */} + {transactionStatus && ( + + {transactionStatus} + {transactionStatus === "Executing transaction..." && ( + + )} + + )} + + {/* 错误消息 */} + {errorMessage && ( + + Error: {errorMessage} + + )} ); -} +}; export default Execute; - diff --git a/mover/wenchao13547/code/task6/my-first-sui-dapp/src/withdrawSUI.tsx b/mover/wenchao13547/code/task6/my-first-sui-dapp/src/withdrawSUI.tsx new file mode 100644 index 000000000..b2904838f --- /dev/null +++ b/mover/wenchao13547/code/task6/my-first-sui-dapp/src/withdrawSUI.tsx @@ -0,0 +1,52 @@ +// 引入必要的模块 +import { Transaction } from '@mysten/sui/transactions'; // 引入交易相关类 +import { withdrawCoin } from 'navi-sdk/dist/libs/PTB'; // 引入存币、借币和取币函数 +import { Sui } from "navi-sdk/dist/address"; // 引入 SUI 和 wUSDC 地址配置 +import { Pool, PoolConfig } from "navi-sdk/dist/types"; // 引入池配置类型 +import { pool } from 'navi-sdk/dist/address'; // 引入池配置数据 + +// 定义取出 SUI 的操作函数 +export const withdrawSUI = async (account: any, { signAndExecute, suiAmount, onSuccess = () => { } }: { + signAndExecute: any; // 签名并执行交易的函数 + suiAmount: number; // 取出 SUI 的金额 + onSuccess?: (result: any) => void; // 成功后的回调函数（默认空函数） + onError?: (result: any) => void; // 错误时的回调函数（默认空函数） +}) => { + + if (!account) { + postMessage("Please connect your wallet first"); + return; // 如果没有连接钱包，退出函数 + } + + const tx = new Transaction(); + tx.setSender(account.address); // 设置交易的发送者为当前账户地址 + + // 获取 SUI 池的配置 + const SuiPool: PoolConfig = pool[Sui.symbol as keyof Pool]; + + if (!SuiPool) { + throw new Error("Invalid pool configuration"); + } + + tx.setGasBudget(1e9); // 设置交易的 Gas 预算为 1e9 + + try { + // 从池中取出指定数量的 SUI，确保丢弃不需要的返回值 + const [ ] = await withdrawCoin(tx as any, SuiPool, suiAmount); // 丢弃不需要的返回值 + console.log([ ]) + // 执行签名并执行交易 + await signAndExecute({ + transaction: tx, + chain: "sui:mainnet" + }, { + onSuccess, // 成功时执行传入的回调函数 + onError: (error: any) => { // 错误时执行传入的错误回调 + console.error("Transaction failed:", error); + postMessage(error.message || "Transaction failed"); + }, + }); + } catch (error) { + console.error("Transaction failed:", error); + postMessage(error instanceof Error ? error.message : "An unknown error occurred"); + } +}; \ No newline at end of file