|
|
@@ -28,40 +28,43 @@
|
|
|
@click="formData.BuyOrSell = BuyOrSell.Sell">卖出</Button>
|
|
|
</Col>
|
|
|
</Row>
|
|
|
- <Form ref="formRef" class="g-form__container">
|
|
|
+ <Form ref="formRef" class="g-form__container" @submit="onSubmit">
|
|
|
<CellGroup inset>
|
|
|
<Field label="类型" is-link>
|
|
|
<template #input>
|
|
|
- <app-select :options="[]" />
|
|
|
+ <app-select v-model="formData.PriceMode" :options="getPricemode2List()" />
|
|
|
</template>
|
|
|
</Field>
|
|
|
<Field label="价格">
|
|
|
<template #input>
|
|
|
- <app-stepper />
|
|
|
+ <app-stepper v-model="formData.OrderPrice"
|
|
|
+ :disabled="formData.PriceMode === PriceMode.Market" />
|
|
|
</template>
|
|
|
</Field>
|
|
|
<Field label="数量">
|
|
|
<template #input>
|
|
|
- <app-stepper />
|
|
|
+ <app-stepper v-model="formData.OrderQty" />
|
|
|
</template>
|
|
|
</Field>
|
|
|
- <Cell title="预估支付" value="0" />
|
|
|
+ <Cell title="预估支付" :value="calculations.estimate" />
|
|
|
</CellGroup>
|
|
|
<CellGroup inset v-if="formData.BuyOrSell === BuyOrSell.Buy">
|
|
|
- <Cell title="可用余额" value="0" />
|
|
|
- <Cell title="可开数量" value="0" />
|
|
|
- <Cell title="预估手续费" value="0" />
|
|
|
+ <Cell title="可用余额" :value="calculations.available" />
|
|
|
+ <Cell title="可开数量" :value="calculations.qty" />
|
|
|
+ <Cell title="预估手续费" :value="calculations.free" />
|
|
|
</CellGroup>
|
|
|
<CellGroup inset v-if="formData.BuyOrSell === BuyOrSell.Sell">
|
|
|
- <Cell title="可卖数量" value="0" />
|
|
|
- <Cell title="可获金额" value="0" />
|
|
|
- <Cell title="预估手续费" value="0" />
|
|
|
+ <Cell title="可卖数量" :value="calculations.qty" />
|
|
|
+ <Cell title="可获金额" :value="calculations.available" />
|
|
|
+ <Cell title="预估手续费" :value="calculations.free" />
|
|
|
</CellGroup>
|
|
|
</Form>
|
|
|
<Row class="g-layout-block g-layout-block--inset">
|
|
|
<Col span="24">
|
|
|
- <Button type="success" block v-if="formData.BuyOrSell === BuyOrSell.Buy">买入</Button>
|
|
|
- <Button type="danger" block v-if="formData.BuyOrSell === BuyOrSell.Sell">卖出</Button>
|
|
|
+ <Button type="success" block v-if="formData.BuyOrSell === BuyOrSell.Buy"
|
|
|
+ @click="formRef?.submit">买入</Button>
|
|
|
+ <Button type="danger" block v-if="formData.BuyOrSell === BuyOrSell.Sell"
|
|
|
+ @click="formRef?.submit">卖出</Button>
|
|
|
</Col>
|
|
|
</Row>
|
|
|
<Tabs v-model:active="tabIndex" sticky>
|
|
|
@@ -69,7 +72,7 @@
|
|
|
<spot-order v-bind="{ goodsId }" />
|
|
|
</Tab>
|
|
|
<Tab title="资金">
|
|
|
- <spot-account v-bind="{ accountId: 0 }" />
|
|
|
+ <spot-account v-bind="{ goodsId }" />
|
|
|
</Tab>
|
|
|
</Tabs>
|
|
|
</app-view>
|
|
|
@@ -77,10 +80,13 @@
|
|
|
|
|
|
<script lang="ts" setup>
|
|
|
import { shallowRef, reactive, computed } from 'vue'
|
|
|
-import { Form, Button, CellGroup, Field, Cell, Tab, Tabs, Col, Row } from 'vant'
|
|
|
+import { Form, Button, CellGroup, Field, Cell, Tab, Tabs, Col, Row, FormInstance } from 'vant'
|
|
|
+import { fullloading } from '@/utils/vant'
|
|
|
+import { ClientType } from '@/constants/client'
|
|
|
import { parsePercent } from '@/filters'
|
|
|
-import { BuyOrSell } from '@/constants/order'
|
|
|
+import { BuyOrSell, PriceMode, getPricemode2List } from '@/constants/order'
|
|
|
import { useNavigation } from '@mobile/router/navigation'
|
|
|
+import { digitalOrder } from '@/services/api/trade'
|
|
|
import { useFuturesStore } from '@/stores'
|
|
|
import AppSelect from '@mobile/components/base/select/index.vue'
|
|
|
import AppStepper from '@mobile/components/base/stepper/index.vue'
|
|
|
@@ -91,11 +97,26 @@ const { router, getQueryStringToNumber } = useNavigation()
|
|
|
const goodsId = getQueryStringToNumber('id')
|
|
|
const futuresStore = useFuturesStore()
|
|
|
const tabIndex = shallowRef(0)
|
|
|
+const formRef = shallowRef<FormInstance>()
|
|
|
+
|
|
|
+const formData = reactive<Partial<Proto.DigitalOrderReq>>({
|
|
|
+ ClientType: ClientType.Web,
|
|
|
+ BuyOrSell: BuyOrSell.Buy,
|
|
|
+ PriceMode: PriceMode.Limit
|
|
|
+})
|
|
|
|
|
|
const quote = computed(() => futuresStore.getQuoteInfo({ goodsid: goodsId }))
|
|
|
|
|
|
-const formData = reactive<Partial<Proto.DigitalOrderReq>>({
|
|
|
- BuyOrSell: BuyOrSell.Buy
|
|
|
+const calculations = computed(() => {
|
|
|
+ const { agreeunit = 0 } = quote.value ?? {}
|
|
|
+ const { OrderPrice = 0, OrderQty = 0 } = formData
|
|
|
+
|
|
|
+ return {
|
|
|
+ estimate: OrderPrice * OrderQty * agreeunit,
|
|
|
+ available: 0,
|
|
|
+ qty: 0,
|
|
|
+ free: 0
|
|
|
+ }
|
|
|
})
|
|
|
|
|
|
const navigateToGoodsChart = () => {
|
|
|
@@ -106,6 +127,18 @@ const navigateToGoodsChart = () => {
|
|
|
}
|
|
|
})
|
|
|
}
|
|
|
+
|
|
|
+const onSubmit = () => {
|
|
|
+ fullloading((hideLoading) => {
|
|
|
+ digitalOrder({
|
|
|
+ data: formData
|
|
|
+ }).then(() => {
|
|
|
+ hideLoading('提交成功', 'success')
|
|
|
+ }).catch((err) => {
|
|
|
+ hideLoading(err, 'fail')
|
|
|
+ })
|
|
|
+ })
|
|
|
+}
|
|
|
</script>
|
|
|
|
|
|
<style lang="less">
|