SDK
To integrate the DCA API, you'll need to use the Limit Order SDK, which provides functionality for creating and canceling limit orders.
How to install the SDK in your project
npm i @openocean.finance/limitorder-sdkHow to use the SDK in your project
import { openoceanLimitOrderSdk } from '@openocean.finance/limitorder-sdk';You can then use all the functions explored by the SDK (API and swapSDK).
Create DCA Orders:
For DCA SDK, you would need to add a param of mode:'Dca' (Capitalized the D) when create the DCA orders.
// you have to import OpenoceanSdk before you call features:
const function putOrder(wallet, order) {
const {
provider, // wallet provider
chainKey, // chain key, pleaze refer to supported chains
chainId，// chian id
account, // user's wallet address
mode:'Dca'
} = wallet
const {
makerTokenAddress, // maker token address
makerTokenDecimals, // maker token decimals
takerTokenAddress, // taker token address
takerTokenDecimals, // taker token decimals
makerAmount, // maker amount with decimals
takerAmount, // taker amount with decimals
gasPrice, // gas price
expire, // time difference counted by millisecond
receiver, // receiver(Optional)
receiverInputData, // receiver input data(Optional)
} = order
// You need to upload the result "Create limit order"
// to finalize the limit order implementation.
let result = await openoceanLimitOrderSdk.createLimitOrder(wallet, order)
}Cancel DCA Orders:
// You have to use Openocean API to get your limit order information to cancel order.
const function cancelOrder(wallet, order){
const {
provider, // wallet provider
chainKey, // chain key, pleaze refer to supported chains
chainId，// chian id
account, // user's wallet address
} = wallet
const {
orderData, // order data
gasPrice, // gas price
} = order
const result = await openoceanLimitOrderSdk.cancelLimitOrder(wallet, order)
}Load Chart
await openoceanLimitOrderSdk.loadChart({
chain: "base", // chain code,
fromTokenSymbol: "WETH", // from token symbol
toTokenSymbol: "BUSD", // to token symbol
container: document.getElementById('chart'), // chart's container
timeLimit: "1d", // 1d、1w、1m、1y、all
theme: "dark", // dark、light
type: "line", // line、bar
setPoint: ({ label, des }) => { // setPoint callback
console.log('setPoint', label, des);
}
})Demo
<template>
<div id="app">
<div style="color:blue">
<div v-if="chain">chain:{{ chain.chainName }}</div>
<div v-if="myWallet"> walletName:{{ myWallet.name }}</div>
<div v-if="myWallet">address:{{ myWallet.address }}</div>
</div>
<div>
<div>
<h3>ConnectWallet</h3>
<button @click="connectWallet()" style="margin-right:10px">connectWallet</button>
</div>
<div>
<h3>createDcaOrder</h3>
<button @click="createDcaOrder">createDcaOrder</button>
</div>
<div>
<h3>Orders</h3>
</div>
<div v-for="(item, i) in orders" :key="i">
<!-- {{ item.data }} -->
<span>{{ item.data.makerAssetSymbol }}</span>
<span>-></span>
<span>{{ item.data.takerAssetSymbol }}</span>
<button v-if="item.statuses === 5 || item.statuses === 1" @click="cancelOrder(item)">cancelOrder</button>
</div>
<div id="chart" style="width: 100%; height: 400px; border: 1px solid #c00;">
</div>
</div>
</div>
</template>
<script>
import { tryWalletConnect, Wallets, Chains } from '@openocean.finance/wallet';
import { openoceanLimitOrderSdk } from '@openocean.finance/limitorder-sdk';
import axios from 'axios';
// import VConsole from 'vconsole';
// const vConsole = new VConsole({ theme: 'dark' });
export default {
name: 'App',
components: {
},
data () {
return {
chainName: 'base',
walletName: 'MetaMask',
inToken: {
"address": "0x4200000000000000000000000000000000000006",
"decimals": 18,
"symbol": "WETH",
},
outToken: {
"address": "0x833589fcd6edb6e08f4c7c32d4f71b54bda02913",
"decimals": 18,
"symbol": "USDC"
},
gasPrice: 3000000000,
inTokenBalance: null,
outTokenBalance: null,
inAmount: 1,
outAmount: null,
myWallet: null,
chain: null,
provider: null,
limitOrderExpireOptions: [
{
value: "10M",
label: "10 Mins",
},
{
value: "1H",
label: "1 Hour",
},
{
value: "1D",
label: "1 Day",
},
{
value: "3D",
label: "3 Days",
},
{
value: "7D",
label: "7 Days",
},
{
value: "30D",
label: "1 Month",
},
{
value: "3Month",
label: "3 Month",
},
{
value: "6Month",
label: "6 Month",
},
{
value: "1Y",
label: "1 Year",
}
],
orders: []
}
},
async created () {
},
mounted () {
this.loadChart()
},
methods: {
async createDcaOrder () {
let order = await openoceanLimitOrderSdk.createLimitOrder(
{
provider: this.provider,
chainKey: this.chainName,
account: this.myWallet.address,
chainId: this.chain.chainId,
mode: 'dca'
},
{
makerTokenAddress: this.inToken.address,
makerTokenDecimals: this.inToken.decimals,
takerTokenAddress: this.outToken.address,
takerTokenDecimals: this.outToken.decimals,
makerAmount: 1 * (10 ** this.inToken.decimals) + '',
takerAmount: 2 * (10 ** this.outToken.decimals) + '',
gasPrice: this.gasPrice,
expire: this.limitOrderExpireOptions[1].value,
}
);
let json = {
...order,
expireTime: 180,
time: 60, // 1 Minute
times: 2,
// minPrice:1,
// maxPrice:2,
}
const result = await axios.post(
`https://open-api.openocean.finance/v1/${this.chain.chainId}/dca/swap`,
json,
{
headers: { 'Content-Type': 'application/json' },
}
);
this.getLimitOrder()
},
async getLimitOrder () {
let url = `https://open-api.openocean.finance/v1/${this.chain.chainId}/dca/address/${this.myWallet.address}?page=1&limit=100&statuses=[1,2,5]&sortBy=createDateTime&exclude=0`
const res = await axios.get(url);
this.orders = res.data.data
},
async cancelOrder (order) {
const { orderHash } = order;
const result = await axios.post(
`https://open-api.openocean.finance/v1/${this.chain.chainId}/dca/cancel`,
{ orderHash }
);
const { status } = (result && result.data) || {};
if (!(status === 3 || status === 4)) {
let res = await openoceanLimitOrderSdk.cancelLimitOrder(
{
provider: this.provider,
chainKey: this.chainName,
account: this.myWallet.address,
chainId: this.chain.chainId
},
{
orderData: order.data,
gasPrice: this.gasPrice,
}
);
}
this.getLimitOrder()
},
async connectWallet () {
try {
let data = await tryWalletConnect({
chainName: this.chainName,
walletName: this.walletName
})
if (data) {
this.provider = data.wallet.sdk
this.myWallet = data.wallet
this.chain = data.chain
this.getLimitOrder()
}
} catch (error) {
this.myWallet = null
this.chain = null
}
},
async loadChart () {
await openoceanLimitOrderSdk.loadChart({
chain: "bsc", // chain code,
fromTokenSymbol: "BNB", // from token symbol
toTokenSymbol: "BUSD", // to token symbol
container: document.getElementById('chart'), // chart's container
timeLimit: "1d", // 1d、1w、1m、1y、all
theme: "dark", // dark、light
type: "line", // line、bar
setPoint: ({ label, des }) => { // setPoint callback
console.log('setPoint', label, des);
}
})
}
}
}
</script>
<style></style>
Last updated