add 资金管理

This commit is contained in:
simple321vip
2022-09-13 16:33:17 +08:00
parent cb6db21ab5
commit 3baa441fbb
8 changed files with 306 additions and 100 deletions
+188
View File
@@ -0,0 +1,188 @@
<template>
<div class="capital">
<el-descriptions title="Account Info">
<el-descriptions-item>
<template #label>
<div class="cell-item">
<el-icon style="iconStyle">
<user />
</el-icon>
Account
</div>
</template>
{{account_data.account_id}}
</el-descriptions-item>
<el-descriptions-item label="gateway_name">{{account_data.geteway_name}}</el-descriptions-item>
<el-descriptions-item label="frozen">{{account_data.frozen}}</el-descriptions-item>
<el-descriptions-item label="balance">
<el-tag size="small"> {{account_data.balance}}</el-tag>
</el-descriptions-item>
<el-descriptions-item label="Address">No.1188, Gaoxinyuan Avenue, Dalian District, Liaoning, Jiangsu
Province</el-descriptions-item>
</el-descriptions>
<div class="operate">
<div width="180px">
<el-select v-model="vt_symbol" placeholder="select a vt_symbol" @change="query_contract">
<el-option v-for="symbol in store.vt_symbols" :value="symbol" />
</el-select>
<el-input-number v-model="volume" :min="1" :max="10" @change="handleChange" />
<el-input-number v-model="price" :min="1" :max="10000" @change="handleChange" />
<el-button type="primary" @click="on_order">下单</el-button>
</div>
<div>
<div style="margin-top: 20px">
<el-radio-group v-model="direction">
<el-radio-button label="多" />
<el-radio-button label="空" />
</el-radio-group>
</div>
<div style="margin-top: 20px">
<el-radio-group v-model="offset">
<el-radio-button label="开" />
<el-radio-button label="平" />
</el-radio-group>
</div>
</div>
</div>
<el-tabs v-model="activeName" class="demo-tabs" @tab-click="handleClick">
<el-tab-pane label="持仓" name=1></el-tab-pane>
<el-tab-pane label="挂单" name=2></el-tab-pane>
<el-tab-pane label="委托" name=3></el-tab-pane>
<el-tab-pane label="成交" name=4></el-tab-pane>
</el-tabs>
<el-table v-if="activeName == 1" :data="position_data" stripe style="width: 100%">
<el-table-column prop="symbol" label="合约名称" width="180" />
<el-table-column prop="direction" label="多空" width="180" />
<el-table-column prop="open_price" label="开仓价格" width="180" />
<el-table-column prop="gain_loss" label="盈亏" />
</el-table>
<el-table v-if="activeName == 2" :data="position_data" stripe style="width: 100%">
<el-table-column prop="symbol" label="合约名称" width="180" />
<el-table-column prop="direction" label="多空" width="180" />
<el-table-column prop="balance" label="盈亏" />
</el-table>
<el-table v-if="activeName == 3" :data="position_data" stripe style="width: 100%">
<el-table-column prop="symbol" label="合约名称" width="180" />
<el-table-column prop="direction" label="多空" width="180" />
<el-table-column prop="balance" label="盈亏" />
</el-table>
<el-table v-if="activeName == 4" :data="deal_data" stripe style="width: 100%">
<el-table-column prop="symbol" label="合约名称" width="180" />
<el-table-column prop="direction" label="开平" width="180" />
<el-table-column prop="price" label="成交价" width="180" />
<el-table-column prop="volume" label="成交量" width="180" />
<el-table-column prop="balance" label="成交时间" width="180" />
</el-table>
</div>
</template>
<script setup lang="ts">
import { ElMessage, TabsPaneContext } from 'element-plus'
import { reactive, ref, h } from 'vue'
import { get_accounts, send_order, get_contract } from '../../api/capital'
import { strategyStore } from '../../store/strategy';
type AccountData = {
geteway_name: string
account_id: string
balance: number
frozen: number
}
type PositionData = {
symbol: string
direction: string
open_price: number
gain_loss: number
}
type DealData = {
symbol: string
direction: string
price: number
volume: number
}
const store = strategyStore()
const vt_symbol = ref<string>("")
const contracts = reactive<string[]>([])
const direction = ref('多')
const offset = ref('开')
const activeName = ref(1)
const account_data = reactive<AccountData>({
geteway_name: '',
account_id: '',
balance: 0.0,
frozen: 0.0
})
const position_data = reactive<PositionData[]>([])
const deal_data = reactive<DealData[]>([])
const on_query_accounts = () => {
get_accounts().then(res => {
account_data.account_id = res.data.account_id
account_data.balance = res.data.balance
account_data.geteway_name = res.data.geteway_name
account_data.frozen = res.data.frozen
})
}
const query_contract = () => {
get_contract(vt_symbol.value).then(res => {
})
}
const handleClick = (tab: TabsPaneContext, event: Event) => {
console.log(tab, event)
}
const volume = ref(1)
const price = ref(3000)
const handleChange = (value: number) => {
console.log(value)
}
const on_order = () => {
""
if (vt_symbol.value == "") {
ElMessage({
message: h('p', null, [
h('i', { style: 'color: teal' }, "合约不能为空"),
]),
})
return
}
let data = {
vt_symbol: vt_symbol.value,
direction: direction.value,
offset: offset.value,
volume: volume.value,
price: price.value
}
send_order(data).then(res => {
})
}
const init = () => {
on_query_accounts()
}
init()
</script>
<style>
.dashboard {
background-color: beige;
}
.iconStyle {
margin-right: '6px'
}
.operate {
display: flex;
align-items: center
/* justify-content: center */
}
</style>
+37 -46
View File
@@ -8,56 +8,47 @@
<script setup lang="ts">
import * as echarts from 'echarts'
import { onMounted, ref } from 'vue';
const bookmarks = ref<HTMLElement>()
import {
get_strategy_load_files,
get_vt_symbols
} from '../../api/cta_strategy'
import { h } from 'vue'
import { ElMessage } from 'element-plus'
import { strategyStore } from '../../store/strategy';
const store = strategyStore()
onMounted(() => {
const myEcharts = echarts.init(bookmarks.value!)
const option = {
tooltip: {
trigger: 'item'
},
legend: {
top: '5%',
left: 'center'
},
series: [
{
name: 'Access From',
type: 'pie',
radius: ['40%', '70%'],
avoidLabelOverlap: false,
itemStyle: {
borderRadius: 10,
borderColor: '#fff',
borderWidth: 2
},
label: {
show: false,
position: 'center'
},
emphasis: {
label: {
show: true,
fontSize: '25',
fontWeight: 'bold'
}
},
labelLine: {
show: false
},
data: [
{ value: 1048, name: 'Java' },
{ value: 735, name: 'JavaScript' },
{ value: 580, name: 'Internet' },
{ value: 484, name: '数据结构' },
{ value: 300, name: '数据库' }
]
}
]
}
myEcharts.setOption(option)
})
const init = () => {
get_strategy_load_files().then(res => {
store.$patch({ class_names: res.data.class_names })
}).catch(error => {
ElMessage({
message: h('p', null, [
h('i', { style: 'color: teal' }, "读取策略文件失败"),
]),
})
})
get_vt_symbols().then(res => {
store.$patch({ vt_symbols: res.data.vt_symbols })
}).catch(error => {
ElMessage({
message: h('p', null, [
h('i', { style: 'color: teal' }, "读取vt_symbols失败"),
]),
})
})
}
// init process
init()
</script>
<style>
</style>
-20
View File
@@ -1,20 +0,0 @@
<template>
<div class="dashboard">
初期设想作为登录用户的功能之一可选择式的数据抽取
包括用户相关资料的全部取回操作
bookmark
blog
study
cloud
等等并没有打算在每个模块下提供下载工程因为我这个不是面向业务的提供下载工程无非是怕数据丢失而已仅限于此
</div>
</template>
<script setup lang="ts">
</script>
<style>
.dashboard {
background-color: beige;
}
</style>
+5 -1
View File
@@ -1,5 +1,9 @@
<template>
<div class="dashboard">这里我想分享的一些东西无论是生活还是工作还是学科</div>
<div class="recommend">
- 行情订阅后将会出现在创建策略的symbol中<br>
-
</div>
</template>
<script setup lang="ts">
-20
View File
@@ -138,26 +138,6 @@ const on_status = (row: any) => {
const init = () => {
on_list()
get_strategy_load_files().then(res => {
store.$patch({ class_names: res.data.class_names })
}).catch(error => {
ElMessage({
message: h('p', null, [
h('i', { style: 'color: teal' }, "读取策略文件失败"),
]),
})
})
get_vt_symbols().then(res => {
store.$patch({ vt_symbols: res.data.vt_symbols })
}).catch(error => {
ElMessage({
message: h('p', null, [
h('i', { style: 'color: teal' }, "读取vt_symbols失败"),
]),
})
})
}
// init process
init()
+37 -8
View File
@@ -21,15 +21,44 @@
<el-table-column type="index" label="index" width="80" />
<el-table-column prop="file_name" label="策略文件名" width="200" />
<el-table-column prop="class_name" label="策略类名" width="200" />
<el-table-column prop="status" label="状态" width="180" />
<el-table-column prop="facvion" label="图标" width="60" />
<el-table-column class="click-icon" prop="url" label="操作">
<el-table-column prop="status" label="状态" width="60">
<template #default="scope">
<span v-if="scope.row.status == 0" style="cursor: pointer" @click="on_load(scope.row)">{{ "加载图标" }}</span>
<span v-if="scope.row.status == 0" style="cursor: pointer" @click="on_remove(scope.row)">{{ "删除" }}</span>
<span v-if="scope.row.status == 2" style="cursor: pointer">{{ "加载中图标" }}</span>
<span v-if="scope.row.status == 1" style="cursor: pointer" @click="on_unload(scope.row)">{{
"卸载图标" }}</span>
<el-icon v-if="scope.row.status == 0" :size="20">
<InfoFilled />
</el-icon>
<el-icon v-if="scope.row.status == 1" :size="20" color="green">
<SuccessFilled />
</el-icon>
<el-icon v-if="scope.row.status == 2" :size="20" color="gold">
<WarningFilled />
</el-icon>
</template>
</el-table-column>
<el-table-column prop="url" label="加载" width="60">
<template #default="scope">
<span v-if="scope.row.status == 0" style="cursor: pointer">
<el-icon :size="20" @click="on_remove(scope.row)" color="blue">
<CirclePlusFilled />
</el-icon>
</span>
</template>
</el-table-column>
<el-table-column prop="url" label="卸载" width="60">
<template #default="scope">
<span v-if="scope.row.status == 1" style="cursor: pointer">
<el-icon :size="20" @click="on_remove(scope.row)" color="red">
<RemoveFilled />
</el-icon>
</span>
</template>
</el-table-column>
<el-table-column prop="url" label="删除" width="60">
<template #default="scope">
<span v-if="scope.row.status == 0" style="cursor: pointer">
<el-icon :size="20" @click="on_remove(scope.row)" color="red">
<Delete />
</el-icon>
</span>
</template>
</el-table-column>
</el-table>