|
|
@@ -21,8 +21,8 @@
|
|
|
</el-form-item>
|
|
|
<el-form-item prop="OrderPrice" label="价格">
|
|
|
<div class="el-form-item--col">
|
|
|
- <el-input-number placeholder="请输入" :min="0" :step="priceStep" :precision="quote?.decimalplace"
|
|
|
- v-model="formData.OrderPrice" />
|
|
|
+ <el-input-number ref="priceRef" placeholder="请输入" :min="0" :step="priceStep"
|
|
|
+ :precision="quote?.decimalplace" v-model="formData.OrderPrice" @keyup.enter="qtyInputFocus" />
|
|
|
<div v-if="quote">
|
|
|
<div class="row-price g-price-up">
|
|
|
<Icon icon="Top" />
|
|
|
@@ -37,8 +37,8 @@
|
|
|
</el-form-item>
|
|
|
<el-form-item prop="OrderQty" label="数量">
|
|
|
<div class="g-qty-group">
|
|
|
- <el-input-number placeholder="请输入" :min="0" :precision="0" :step="qtyStep"
|
|
|
- v-model="formData.OrderQty" />
|
|
|
+ <el-input-number ref="qtyRef" placeholder="请输入" :min="0" :precision="0" :step="qtyStep"
|
|
|
+ v-model="formData.OrderQty" @keyup.enter="submitFocus" />
|
|
|
<el-radio-group size="small" v-model="qtyStep" @change="onRadioChange">
|
|
|
<el-radio v-for="(value, index) in qtyStepList" :key="index" :label="value" border />
|
|
|
</el-radio-group>
|
|
|
@@ -47,7 +47,8 @@
|
|
|
</el-form>
|
|
|
<div class="footer-btnbar">
|
|
|
<template v-if="formData.BuyOrSell === BuyOrSell.Buy">
|
|
|
- <el-button type="primary" :loading="loading" :disabled="!goodsStore.goodsId || !formData.OrderQty"
|
|
|
+ <el-button ref="submitRef" type="primary" :loading="loading"
|
|
|
+ :disabled="!goodsStore.goodsId || !formData.OrderQty"
|
|
|
@click="onSubmit(EBuildType.BUILDTYPE_OPEN)">订立买入</el-button>
|
|
|
<el-button type="primary" :loading="loading"
|
|
|
:disabled="!formData.OrderQty || !sellQty || (formData.OrderQty > sellQty)"
|
|
|
@@ -57,7 +58,8 @@
|
|
|
</el-button>
|
|
|
</template>
|
|
|
<template v-if="formData.BuyOrSell === BuyOrSell.Sell">
|
|
|
- <el-button type="primary" :loading="loading" :disabled="!goodsStore.goodsId || !formData.OrderQty"
|
|
|
+ <el-button ref="submitRef" type="primary" :loading="loading"
|
|
|
+ :disabled="!goodsStore.goodsId || !formData.OrderQty"
|
|
|
@click="onSubmit(EBuildType.BUILDTYPE_OPEN)">订立卖出</el-button>
|
|
|
<el-button type="primary" :loading="loading"
|
|
|
:disabled="!formData.OrderQty || !buyQty || (formData.OrderQty > buyQty)"
|
|
|
@@ -72,7 +74,7 @@
|
|
|
</template>
|
|
|
|
|
|
<script lang="ts" setup>
|
|
|
-import { shallowRef, computed, watch } from 'vue'
|
|
|
+import { shallowRef, computed, watch, onMounted } from 'vue'
|
|
|
import { ElMessage, ElMessageBox, FormInstance, FormRules } from 'element-plus'
|
|
|
import { EPriceMode, EListingSelectType, EDelistingType, EBuildType, EValidType, EOrderOperateType } from '@/constants/client'
|
|
|
import { BuyOrSell, getBuyOrSellList } from '@/constants/order'
|
|
|
@@ -90,6 +92,10 @@ const formRef = shallowRef<FormInstance>()
|
|
|
const qtyStepList = [1, 10, 100] // 数量步长列表
|
|
|
const qtyStep = shallowRef(qtyStepList[0]) // 数量步长
|
|
|
|
|
|
+const priceRef = shallowRef()
|
|
|
+const qtyRef = shallowRef()
|
|
|
+const submitRef = shallowRef()
|
|
|
+
|
|
|
// 商品盘面
|
|
|
const quote = computed(() => futuresStore.getGoodsQuote(goodsStore.goodsCode).value)
|
|
|
|
|
|
@@ -132,18 +138,36 @@ const formRules: FormRules = {
|
|
|
}],
|
|
|
}
|
|
|
|
|
|
+// 价格输入框获取焦点
|
|
|
+const priceInputFocus = () => {
|
|
|
+ priceRef.value.focus()
|
|
|
+}
|
|
|
+
|
|
|
+// 数量输入框获取焦点
|
|
|
+const qtyInputFocus = () => {
|
|
|
+ qtyRef.value.focus()
|
|
|
+}
|
|
|
+
|
|
|
+// 提交按钮获取焦点
|
|
|
+const submitFocus = () => {
|
|
|
+ submitRef.value.ref.focus()
|
|
|
+}
|
|
|
+
|
|
|
const onRadioChange = (value: number) => {
|
|
|
formData.OrderQty = value
|
|
|
+ qtyInputFocus()
|
|
|
}
|
|
|
|
|
|
const onBuyClick = (price: number) => {
|
|
|
formData.BuyOrSell = BuyOrSell.Sell
|
|
|
formData.OrderPrice = price
|
|
|
+ priceInputFocus()
|
|
|
}
|
|
|
|
|
|
const onSellClick = (price: number) => {
|
|
|
formData.BuyOrSell = BuyOrSell.Buy
|
|
|
formData.OrderPrice = price
|
|
|
+ priceInputFocus()
|
|
|
}
|
|
|
|
|
|
// 提交挂牌
|
|
|
@@ -169,17 +193,22 @@ const onSubmit = (buildType: number) => {
|
|
|
ElMessage.success('挂牌成功')
|
|
|
}).catch((err) => {
|
|
|
ElMessage.error('挂牌失败:' + err)
|
|
|
+ }).finally(() => {
|
|
|
+ priceInputFocus()
|
|
|
})
|
|
|
})
|
|
|
}
|
|
|
})
|
|
|
}
|
|
|
|
|
|
-watch(quote, () => {
|
|
|
+const goodsChange = () => {
|
|
|
const { last = 0, presettle = 0 } = quote.value ?? {}
|
|
|
formData.OrderPrice = last || presettle
|
|
|
formData.OrderQty = qtyStep.value
|
|
|
-})
|
|
|
+}
|
|
|
+
|
|
|
+watch(() => goodsStore.goodsId, () => goodsChange())
|
|
|
+onMounted(() => goodsChange())
|
|
|
</script>
|
|
|
|
|
|
<style lang="less">
|