cta strategy init
This commit is contained in:
simple321vip
@@ -0,0 +1,69 @@
|
||||
import request from '../utils/request'
|
||||
|
||||
"CTA strategy"
|
||||
|
||||
"strategy list"
|
||||
const get_strategy_list = () => {
|
||||
return request({
|
||||
url: '/auth/api/v1/trader',
|
||||
method: 'PUT',
|
||||
})
|
||||
}
|
||||
|
||||
"upload a strategy"
|
||||
const upload_strategy = () => {
|
||||
return request({
|
||||
url: '/auth/api/v1/trader',
|
||||
method: 'PUT',
|
||||
})
|
||||
}
|
||||
|
||||
"load a strategy"
|
||||
const load_strategy = (strategy_id: string) => {
|
||||
return request({
|
||||
url: '/auth/api/v1/trader',
|
||||
method: 'PUT',
|
||||
})
|
||||
}
|
||||
|
||||
"unload a strategy"
|
||||
const unload_strategy = (strategy_id: string) => {
|
||||
return request({
|
||||
url: '/auth/api/v1/trader',
|
||||
method: 'PUT',
|
||||
})
|
||||
}
|
||||
|
||||
"start a strategy"
|
||||
const start_strategy = (strategy_id: string) => {
|
||||
return request({
|
||||
url: '/auth/api/v1/trader',
|
||||
method: 'PUT',
|
||||
})
|
||||
}
|
||||
|
||||
"stop a strategy"
|
||||
const stop_strategy = (strategy_id: string) => {
|
||||
return request({
|
||||
url: '/auth/api/v1/trader',
|
||||
method: 'PUT',
|
||||
})
|
||||
}
|
||||
|
||||
"remove a strategy"
|
||||
const remove_strategy = (strategy_id: string) => {
|
||||
return request({
|
||||
url: '/auth/api/v1/trader',
|
||||
method: 'PUT',
|
||||
})
|
||||
}
|
||||
|
||||
export {
|
||||
get_strategy_list,
|
||||
upload_strategy,
|
||||
load_strategy,
|
||||
unload_strategy,
|
||||
start_strategy,
|
||||
stop_strategy,
|
||||
remove_strategy
|
||||
}
|
||||
@@ -0,0 +1,11 @@
|
||||
import request from '../utils/request'
|
||||
|
||||
const get_stock_data = (data: Object) => {
|
||||
return request({
|
||||
url: '/auth/api/v1/trader',
|
||||
method: 'PUT',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
|
||||
export { get_stock_data }
|
||||
@@ -49,7 +49,7 @@ const doLogin = () => {
|
||||
}
|
||||
const doLogout = () => {
|
||||
dialogVisible.value = false
|
||||
logout(tenant.id).then(() => {
|
||||
logout(tenant.id).catch(() => { console.log(1) }).finally(() => {
|
||||
tenant.logout()
|
||||
router.push({
|
||||
path: '/login'
|
||||
|
||||
@@ -61,6 +61,13 @@ const routes: Array<RouteRecordRaw> = [
|
||||
name: '一键打包'
|
||||
}
|
||||
},
|
||||
{
|
||||
path: '/trader',
|
||||
component: () => import('../view/trader/index.vue'),
|
||||
meta: {
|
||||
name: 'trader'
|
||||
}
|
||||
},
|
||||
]
|
||||
},
|
||||
{
|
||||
|
||||
@@ -0,0 +1,209 @@
|
||||
import * as echarts from 'echarts'
|
||||
const upColor = '#ec0000'
|
||||
const upBorderColor = '#8A0000'
|
||||
const downColor = '#00da3c'
|
||||
const downBorderColor = '#008F28'
|
||||
import { EChartsOption } from 'echarts'
|
||||
|
||||
type DataItem = [string, number, number, number, number, number, number];
|
||||
|
||||
const option: EChartsOption = {
|
||||
dataset: {
|
||||
source: []
|
||||
},
|
||||
title: {
|
||||
text: ''
|
||||
},
|
||||
tooltip: {
|
||||
trigger: 'axis',
|
||||
axisPointer: {
|
||||
type: 'line'
|
||||
}
|
||||
},
|
||||
toolbox: {
|
||||
feature: {
|
||||
dataZoom: {
|
||||
yAxisIndex: false
|
||||
}
|
||||
}
|
||||
},
|
||||
grid: [
|
||||
{
|
||||
left: '10%',
|
||||
right: '10%',
|
||||
bottom: 200
|
||||
},
|
||||
{
|
||||
left: '10%',
|
||||
right: '10%',
|
||||
height: 80,
|
||||
bottom: 80
|
||||
}
|
||||
],
|
||||
xAxis: [
|
||||
{
|
||||
type: 'category',
|
||||
boundaryGap: false,
|
||||
// inverse: true,
|
||||
axisLine: { onZero: false },
|
||||
splitLine: { show: false },
|
||||
min: 'dataMin',
|
||||
max: 'dataMax'
|
||||
},
|
||||
{
|
||||
type: 'category',
|
||||
gridIndex: 1,
|
||||
boundaryGap: false,
|
||||
axisLine: { onZero: false },
|
||||
axisTick: { show: false },
|
||||
splitLine: { show: false },
|
||||
axisLabel: { show: false },
|
||||
min: 'dataMin',
|
||||
max: 'dataMax'
|
||||
}
|
||||
],
|
||||
yAxis: [
|
||||
{
|
||||
scale: true,
|
||||
splitArea: {
|
||||
show: true
|
||||
}
|
||||
},
|
||||
{
|
||||
scale: true,
|
||||
gridIndex: 1,
|
||||
splitNumber: 2,
|
||||
axisLabel: { show: false },
|
||||
axisLine: { show: false },
|
||||
axisTick: { show: false },
|
||||
splitLine: { show: false }
|
||||
}
|
||||
],
|
||||
dataZoom: [
|
||||
{
|
||||
type: 'inside',
|
||||
xAxisIndex: [0, 1],
|
||||
start: 10,
|
||||
end: 100
|
||||
},
|
||||
{
|
||||
show: true,
|
||||
xAxisIndex: [0, 1],
|
||||
type: 'slider',
|
||||
bottom: 10,
|
||||
start: 10,
|
||||
end: 100
|
||||
}
|
||||
],
|
||||
visualMap: {
|
||||
show: false,
|
||||
seriesIndex: 1,
|
||||
dimension: 6,
|
||||
pieces: [
|
||||
{
|
||||
value: 1,
|
||||
color: upColor
|
||||
},
|
||||
{
|
||||
value: -1,
|
||||
color: downColor
|
||||
}
|
||||
]
|
||||
},
|
||||
series: [
|
||||
{
|
||||
type: 'candlestick',
|
||||
itemStyle: {
|
||||
color: upColor,
|
||||
color0: downColor,
|
||||
borderColor: upBorderColor,
|
||||
borderColor0: downBorderColor
|
||||
},
|
||||
encode: {
|
||||
x: 0,
|
||||
y: [1, 4, 3, 2]
|
||||
}
|
||||
},
|
||||
{
|
||||
name: 'Volumn',
|
||||
type: 'bar',
|
||||
xAxisIndex: 1,
|
||||
yAxisIndex: 1,
|
||||
itemStyle: {
|
||||
color: '#7fbe9e'
|
||||
},
|
||||
large: true,
|
||||
encode: {
|
||||
x: 0,
|
||||
y: 5
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
const generateOHLC = (count: number) => {
|
||||
let data: DataItem[] = [];
|
||||
|
||||
let xValue = +new Date(2011, 0, 1);
|
||||
let minute = 60 * 1000;
|
||||
let baseValue = Math.random() * 12000;
|
||||
let boxVals = new Array(4);
|
||||
let dayRange = 12;
|
||||
|
||||
for (let i = 0; i < count; i++) {
|
||||
baseValue = baseValue + Math.random() * 20 - 10;
|
||||
|
||||
for (let j = 0; j < 4; j++) {
|
||||
boxVals[j] = (Math.random() - 0.5) * dayRange + baseValue;
|
||||
}
|
||||
boxVals.sort();
|
||||
|
||||
let openIdx = Math.round(Math.random() * 3);
|
||||
let closeIdx = Math.round(Math.random() * 2);
|
||||
if (closeIdx === openIdx) {
|
||||
closeIdx++;
|
||||
}
|
||||
let volumn = boxVals[3] * (1000 + Math.random() * 500);
|
||||
|
||||
// ['open', 'close', 'lowest', 'highest', 'volumn']
|
||||
// [1, 4, 3, 2]
|
||||
data[i] = [
|
||||
echarts.format.formatTime('yyyy-MM-dd\nhh:mm:ss', (xValue += minute)),
|
||||
+boxVals[openIdx].toFixed(2), // open
|
||||
+boxVals[3].toFixed(2), // highest
|
||||
+boxVals[0].toFixed(2), // lowest
|
||||
+boxVals[closeIdx].toFixed(2), // close
|
||||
+volumn.toFixed(0),
|
||||
getSign(data, i, +boxVals[openIdx], +boxVals[closeIdx], 4) // sign
|
||||
];
|
||||
}
|
||||
|
||||
return data;
|
||||
}
|
||||
|
||||
const getSign = (
|
||||
data: DataItem[],
|
||||
dataIndex: number,
|
||||
openVal: number,
|
||||
closeVal: number,
|
||||
closeDimIdx: number
|
||||
) => {
|
||||
var sign
|
||||
if (openVal > closeVal) {
|
||||
sign = -1
|
||||
} else if (openVal < closeVal) {
|
||||
sign = 1
|
||||
} else {
|
||||
sign =
|
||||
dataIndex > 0
|
||||
? // If close === open, compare with close of last record
|
||||
data[dataIndex - 1][closeDimIdx] <= closeVal
|
||||
? 1
|
||||
: -1
|
||||
: // No record of previous, set to be positive
|
||||
1
|
||||
}
|
||||
return sign
|
||||
}
|
||||
|
||||
export { generateOHLC, option }
|
||||
@@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<div class="about" ref="bookmarks" id="bookmarks" :style="{
|
||||
width: '600px',
|
||||
height: '300px'
|
||||
height: '400px'
|
||||
}"></div>
|
||||
</template>
|
||||
|
||||
|
||||
@@ -0,0 +1,142 @@
|
||||
<template>
|
||||
<div class="bookmark">
|
||||
<!-- <el-form>
|
||||
<el-row>
|
||||
<el-col :span="6">
|
||||
<el-form-item>
|
||||
<el-input v-model="search_form.comment" placeholder="请输入" clearable />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-button type="primary" @click="doSearch">检索</el-button>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<div class="tag_list">
|
||||
<el-tag class="ml-2 click-icon" :type="item.clicked ? 'danger' : 'info'" v-for="(item) in bookmark_types"
|
||||
@click="handleTags(item)">{{ item.bk_type_name }}</el-tag>
|
||||
<el-button type="primary" @click="handleAddType" v-show="Tenant.account">增加</el-button>
|
||||
<el-button type="primary" @click="handleManageType" v-show="Tenant.account">自定义</el-button>
|
||||
</div>
|
||||
</el-form>
|
||||
<div class="create_dialog">
|
||||
<el-button type="primary" @click="handleInsert" v-show="Tenant.account">新建</el-button>
|
||||
</div>
|
||||
|
||||
<el-table ref="multipleTableRef" :data="strategy_list" @selection-change="handleSelectionChange" style="width: 100%">
|
||||
<el-table-column type="selection" width="55" />
|
||||
<el-table-column type="index" label="index" width="80" />
|
||||
<el-table-column prop="bk_type_name" label="分类" width="100" />
|
||||
<el-table-column prop="comment" label="名称" width="180" />
|
||||
<el-table-column prop="facvion" label="图标" width="60" />
|
||||
<el-table-column class="click-icon" prop="url" label="url">
|
||||
<template #default="scope">
|
||||
<span style="cursor: pointer" @click="openUrl(scope.row.url)">{{ scope.row.url }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作">
|
||||
<template #default="scope">
|
||||
<el-icon :size="20" @click="copyNumber(scope.row)" class="click-icon">
|
||||
<CopyDocument />
|
||||
</el-icon>
|
||||
<el-button class="click-icon" size="small" @click="handleEdit(scope.$index, scope.row)"
|
||||
v-show="Tenant.account">编辑
|
||||
</el-button>
|
||||
<el-button size="small" type="danger" @click="handleDelete(scope.$index, scope.row)" v-show="Tenant.account">
|
||||
删除
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<div style="margin-top: 20px">
|
||||
<el-button @click="toggleSelection([tableData[1], tableData[2]])">反选</el-button>
|
||||
<el-button @click="toggleSelection()">清除</el-button>
|
||||
</div> -->
|
||||
|
||||
<!-- <el-dialog v-model="dialogFormVisible" title="添加书签">
|
||||
<bookmark_dialog :dialog_form="currentDialogData" :operate_code="operate" :types="bookmark_types"
|
||||
@on-concel="closeDialog" @on-submit="doSubmit"></bookmark_dialog>
|
||||
</el-dialog>
|
||||
|
||||
<el-dialog v-model="dialogVisible">
|
||||
<delete_dialog :delete_id="currentDialogData.bk_id" @on-submit="doDelete"></delete_dialog>
|
||||
</el-dialog>
|
||||
|
||||
<el-dialog v-model="createTypeDialogVisible">
|
||||
<createType_dialog @on-update="doUpdate"></createType_dialog>
|
||||
</el-dialog> -->
|
||||
|
||||
<!-- <el-dialog v-model="typeDialogVisible">
|
||||
<bookmarkType_dialog :delete_id="currentDialogData.bk_id" @on-submit="doDelete"></bookmarkType_dialog>
|
||||
</el-dialog> -->
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { reactive } from 'vue';
|
||||
import {
|
||||
get_strategy_list,
|
||||
upload_strategy,
|
||||
load_strategy,
|
||||
unload_strategy,
|
||||
start_strategy,
|
||||
stop_strategy,
|
||||
remove_strategy
|
||||
} from '../../api/cta_strategy'
|
||||
|
||||
|
||||
type Strategy = {
|
||||
strategy_id: string,
|
||||
strategy_name: string,
|
||||
}
|
||||
|
||||
const strategy_list = reactive<Strategy[]>([])
|
||||
|
||||
const on_list = () => {
|
||||
get_strategy_list().then(res => {
|
||||
res.data.forEach((item: Strategy, index: number) => {
|
||||
strategy_list.push(item)
|
||||
})
|
||||
})
|
||||
}
|
||||
|
||||
const on_upload = () => {
|
||||
upload_strategy().then(res => {
|
||||
|
||||
})
|
||||
}
|
||||
|
||||
const on_load = (strategy_id: string) => {
|
||||
load_strategy(strategy_id).then(res => {
|
||||
|
||||
})
|
||||
}
|
||||
|
||||
const on_unload = (strategy_id: string) => {
|
||||
unload_strategy(strategy_id).then(res => {
|
||||
|
||||
})
|
||||
}
|
||||
|
||||
const on_start = (strategy_id: string) => {
|
||||
start_strategy(strategy_id).then(res => {
|
||||
|
||||
})
|
||||
}
|
||||
|
||||
const on_stop = (strategy_id: string) => {
|
||||
stop_strategy(strategy_id).then(res => {
|
||||
|
||||
})
|
||||
}
|
||||
|
||||
const on_remove = (strategy_id: string) => {
|
||||
remove_strategy(strategy_id).then(res => {
|
||||
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
</style>
|
||||
@@ -0,0 +1,63 @@
|
||||
<template>
|
||||
<div class="about" ref="trader_chart" id="trader_chart" :style="{
|
||||
width: '1200px',
|
||||
height: '600px'
|
||||
}"></div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { reactive } from 'vue';
|
||||
import * as echarts from 'echarts'
|
||||
import { EChartsOption } from 'echarts';
|
||||
import { onMounted, ref } from 'vue'
|
||||
import { generateOHLC, option } from '../../service/trader'
|
||||
import { get_stock_data } from '../../api/trader'
|
||||
|
||||
|
||||
const trader_chart = ref<HTMLElement>()
|
||||
|
||||
const data_count = 2e5;
|
||||
|
||||
|
||||
get_stock_data({}).then((response) => {
|
||||
response.data.forEach((element: any) => {
|
||||
console.log(element)
|
||||
});
|
||||
})
|
||||
|
||||
const data = generateOHLC(data_count);
|
||||
|
||||
const options = reactive<EChartsOption>(option)
|
||||
|
||||
""
|
||||
const set_option = () => {
|
||||
options.dataset = {
|
||||
source: data
|
||||
}
|
||||
options.title = {
|
||||
text: 'Data Amount: ' + echarts.format.addCommas(data_count)
|
||||
}
|
||||
}
|
||||
|
||||
const on_tick = () => {
|
||||
|
||||
}
|
||||
const on_start = () => {
|
||||
}
|
||||
onMounted(() => {
|
||||
|
||||
set_option()
|
||||
|
||||
const myEcharts = echarts.init(trader_chart.value!)
|
||||
|
||||
myEcharts.setOption(options)
|
||||
|
||||
})
|
||||
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.dashboard {
|
||||
background-color: beige;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user