|
@@ -1,135 +1,141 @@
|
|
|
<template>
|
|
<template>
|
|
|
- <!-- 挂牌求购 -->
|
|
|
|
|
- <Drawer
|
|
|
|
|
- :title="isBuy() ? '挂牌求购' : '挂牌卖出' "
|
|
|
|
|
- :placement="'right'"
|
|
|
|
|
- :visible="visible"
|
|
|
|
|
- @cancel="cancel"
|
|
|
|
|
- class="top"
|
|
|
|
|
- >
|
|
|
|
|
- <div class="title_right">
|
|
|
|
|
- <span class="tline"></span>
|
|
|
|
|
- <svg class="icon svg-icon" aria-hidden="true">
|
|
|
|
|
- <use xlink:href="#icon-xinjianzengjiaxinzeng-20" />
|
|
|
|
|
- </svg>
|
|
|
|
|
- <span @click="changeDirection">{{isBuy() ? '卖出' : '求购'}}</span>
|
|
|
|
|
- </div>
|
|
|
|
|
- <div class="post_buying">
|
|
|
|
|
- <a-form class="inlineForm dialogForm" ref="formRef" :model="formState" :rules="rules">
|
|
|
|
|
- <div class="formBar">
|
|
|
|
|
- <a-row :gutter="24">
|
|
|
|
|
- <a-col :span="24">
|
|
|
|
|
- <a-form-item label="交易账户" name="accountid">
|
|
|
|
|
- <a-select
|
|
|
|
|
- class="inlineFormSelect"
|
|
|
|
|
- style="width: 260px"
|
|
|
|
|
- v-model:value="formState.accountid"
|
|
|
|
|
- placeholder="请选择"
|
|
|
|
|
- >
|
|
|
|
|
- <a-select-option
|
|
|
|
|
- v-for="item in accountList"
|
|
|
|
|
- :value="item.accountid"
|
|
|
|
|
- :key="item.accountid"
|
|
|
|
|
- >{{item.accountid}}</a-select-option>
|
|
|
|
|
- </a-select>
|
|
|
|
|
- </a-form-item>
|
|
|
|
|
- </a-col>
|
|
|
|
|
- <a-col :span="24">
|
|
|
|
|
- <a-form-item label="价格类型" name>
|
|
|
|
|
- <a-radio-group
|
|
|
|
|
- class="commonRadioGroup"
|
|
|
|
|
- v-model:value="formState.priceType"
|
|
|
|
|
- >
|
|
|
|
|
- <a-radio :value="2">固定价</a-radio>
|
|
|
|
|
- <!-- 掉期交易商有固定价和浮动价选择 -->
|
|
|
|
|
- <!-- 普通交易商只有固定价 -->
|
|
|
|
|
- <a-radio :value="3" v-if="!useUserType()">浮动价</a-radio>
|
|
|
|
|
- </a-radio-group>
|
|
|
|
|
- </a-form-item>
|
|
|
|
|
- </a-col>
|
|
|
|
|
- <a-col :span="24" v-if="!isFloat()">
|
|
|
|
|
- <a-form-item label="挂牌价格" name="FixedPrice" class="inputIconBox">
|
|
|
|
|
- <a-input-number
|
|
|
|
|
- class="commonInput"
|
|
|
|
|
- style="width: 260px"
|
|
|
|
|
- :min="0"
|
|
|
|
|
- v-model:value="formState.FixedPrice"
|
|
|
|
|
- />
|
|
|
|
|
- <MinusOutlined @click="decreasePrice" />
|
|
|
|
|
- <PlusOutlined @click="increasePrice" />
|
|
|
|
|
- </a-form-item>
|
|
|
|
|
- </a-col>
|
|
|
|
|
- <a-col :span="24" v-else>
|
|
|
|
|
- <a-form-item label="基差" name="PriceMove">
|
|
|
|
|
- <a-input-number
|
|
|
|
|
- class="commonInput"
|
|
|
|
|
- style="width: 260px"
|
|
|
|
|
- v-model:value="formState.PriceMove"
|
|
|
|
|
- />
|
|
|
|
|
- </a-form-item>
|
|
|
|
|
- </a-col>
|
|
|
|
|
- <a-col :span="24" v-if="isFloat()">
|
|
|
|
|
- <a-form-item label="估算价" name="PriceMove">
|
|
|
|
|
- <span class="white">{{getFloatPrice()}}</span>
|
|
|
|
|
- </a-form-item>
|
|
|
|
|
- </a-col>
|
|
|
|
|
|
|
+ <!-- 挂牌求购 -->
|
|
|
|
|
+ <Drawer :title="isBuy() ? '挂牌求购' : '挂牌卖出' "
|
|
|
|
|
+ :placement="'right'"
|
|
|
|
|
+ :visible="visible"
|
|
|
|
|
+ @cancel="cancel"
|
|
|
|
|
+ class="top">
|
|
|
|
|
+ <div class="title_right">
|
|
|
|
|
+ <span class="tline"></span>
|
|
|
|
|
+ <svg class="icon svg-icon"
|
|
|
|
|
+ aria-hidden="true">
|
|
|
|
|
+ <use xlink:href="#icon-xinjianzengjiaxinzeng-20" />
|
|
|
|
|
+ </svg>
|
|
|
|
|
+ <span @click="changeDirection">{{isBuy() ? '卖出' : '求购'}}</span>
|
|
|
|
|
+ </div>
|
|
|
|
|
+ <div class="post_buying">
|
|
|
|
|
+ <a-form class="inlineForm dialogForm"
|
|
|
|
|
+ ref="formRef"
|
|
|
|
|
+ :model="formState"
|
|
|
|
|
+ :rules="rules">
|
|
|
|
|
+ <div class="formBar">
|
|
|
|
|
+ <a-row :gutter="24">
|
|
|
|
|
+ <a-col :span="24">
|
|
|
|
|
+ <a-form-item label="交易账户"
|
|
|
|
|
+ name="accountid">
|
|
|
|
|
+ <a-select class="inlineFormSelect"
|
|
|
|
|
+ style="width: 260px"
|
|
|
|
|
+ v-model:value="formState.accountid"
|
|
|
|
|
+ placeholder="请选择">
|
|
|
|
|
+ <a-select-option v-for="item in accountList"
|
|
|
|
|
+ :value="item.accountid"
|
|
|
|
|
+ :key="item.accountid">{{item.accountid}}</a-select-option>
|
|
|
|
|
+ </a-select>
|
|
|
|
|
+ </a-form-item>
|
|
|
|
|
+ </a-col>
|
|
|
|
|
+ <a-col :span="24">
|
|
|
|
|
+ <a-form-item label="价格类型"
|
|
|
|
|
+ name>
|
|
|
|
|
+ <a-radio-group class="commonRadioGroup"
|
|
|
|
|
+ v-model:value="formState.priceType">
|
|
|
|
|
+ <a-radio :value="2">固定价</a-radio>
|
|
|
|
|
+ <!-- 掉期交易商有固定价和浮动价选择 -->
|
|
|
|
|
+ <!-- 普通交易商只有固定价 -->
|
|
|
|
|
+ <a-radio :value="3"
|
|
|
|
|
+ v-if="!useUserType()">浮动价</a-radio>
|
|
|
|
|
+ </a-radio-group>
|
|
|
|
|
+ </a-form-item>
|
|
|
|
|
+ </a-col>
|
|
|
|
|
+ <a-col :span="24"
|
|
|
|
|
+ v-if="!isFloat()">
|
|
|
|
|
+ <a-form-item label="挂牌价格"
|
|
|
|
|
+ name="FixedPrice"
|
|
|
|
|
+ class="inputIconBox">
|
|
|
|
|
+ <a-input-number class="commonInput"
|
|
|
|
|
+ style="width: 260px"
|
|
|
|
|
+ :min="0"
|
|
|
|
|
+ v-model:value="formState.FixedPrice" />
|
|
|
|
|
+ <MinusOutlined @click="decreasePrice" />
|
|
|
|
|
+ <PlusOutlined @click="increasePrice" />
|
|
|
|
|
+ </a-form-item>
|
|
|
|
|
+ </a-col>
|
|
|
|
|
+ <a-col :span="24"
|
|
|
|
|
+ v-else>
|
|
|
|
|
+ <a-form-item label="基差"
|
|
|
|
|
+ name="PriceMove">
|
|
|
|
|
+ <a-input-number class="commonInput"
|
|
|
|
|
+ style="width: 260px"
|
|
|
|
|
+ v-model:value="formState.PriceMove" />
|
|
|
|
|
+ </a-form-item>
|
|
|
|
|
+ </a-col>
|
|
|
|
|
+ <a-col :span="24"
|
|
|
|
|
+ v-if="isFloat()">
|
|
|
|
|
+ <a-form-item label="估算价"
|
|
|
|
|
+ name="PriceMove">
|
|
|
|
|
+ <span class="white">{{getFloatPrice()}}</span>
|
|
|
|
|
+ </a-form-item>
|
|
|
|
|
+ </a-col>
|
|
|
|
|
|
|
|
- <a-col :span="24">
|
|
|
|
|
- <a-form-item label="挂牌数量" name="OrderQty" class="inputIconBox">
|
|
|
|
|
- <a-input-number
|
|
|
|
|
- class="commonInput"
|
|
|
|
|
- style="width: 260px"
|
|
|
|
|
- :min="0"
|
|
|
|
|
- :max="getMaxNum()"
|
|
|
|
|
- v-model:value="formState.OrderQty"
|
|
|
|
|
- />
|
|
|
|
|
- <MinusOutlined @click="decreasePrice" />
|
|
|
|
|
- <PlusOutlined @click="increasePrice" />
|
|
|
|
|
- <span class="input-enumdicname">{{selectedRow.enumdicname}}</span>
|
|
|
|
|
- </a-form-item>
|
|
|
|
|
- </a-col>
|
|
|
|
|
- <a-col :span="24" class="mt-10">
|
|
|
|
|
- <a-form-item>
|
|
|
|
|
- <a-slider
|
|
|
|
|
- :min="0"
|
|
|
|
|
- v-model:value="formState.OrderQty"
|
|
|
|
|
- :max="getMaxNum()"
|
|
|
|
|
- class="formSlider"
|
|
|
|
|
- />
|
|
|
|
|
- <div class="unit">
|
|
|
|
|
- <span>{{getMaxNum() ? selectedRow.minivalue : 0}}</span>
|
|
|
|
|
- <span>{{getMaxNum()}}{{selectedRow.enumdicname}}</span>
|
|
|
|
|
- </div>
|
|
|
|
|
- </a-form-item>
|
|
|
|
|
- </a-col>
|
|
|
|
|
- <a-col :span="24" class="relative mt20">
|
|
|
|
|
- <a-form-item :label="'挂牌金额'">
|
|
|
|
|
- <span class="white ml8">{{getMoney()}}</span>
|
|
|
|
|
- </a-form-item>
|
|
|
|
|
- </a-col>
|
|
|
|
|
- <a-col :span="24" v-if="getMargin()">
|
|
|
|
|
- <a-form-item :label="'履约保证金'">
|
|
|
|
|
- <span class="white ml8">{{getMargin()}}</span>
|
|
|
|
|
- </a-form-item>
|
|
|
|
|
- </a-col>
|
|
|
|
|
- <a-col :span="24">
|
|
|
|
|
- <a-form-item label="可用资金">
|
|
|
|
|
- <span class="white ml8">{{canUseMoney()}}</span>
|
|
|
|
|
- </a-form-item>
|
|
|
|
|
- </a-col>
|
|
|
|
|
- </a-row>
|
|
|
|
|
|
|
+ <a-col :span="24">
|
|
|
|
|
+ <a-form-item label="挂牌数量"
|
|
|
|
|
+ name="OrderQty"
|
|
|
|
|
+ class="inputIconBox">
|
|
|
|
|
+ <a-input-number class="commonInput"
|
|
|
|
|
+ style="width: 260px"
|
|
|
|
|
+ :min="0"
|
|
|
|
|
+ :max="getMaxNum()"
|
|
|
|
|
+ v-model:value="formState.OrderQty" />
|
|
|
|
|
+ <MinusOutlined @click="increaseNum" />
|
|
|
|
|
+ <PlusOutlined @click="decreaseNum" />
|
|
|
|
|
+ <span class="input-enumdicname">{{selectedRow.enumdicname}}</span>
|
|
|
|
|
+ </a-form-item>
|
|
|
|
|
+ </a-col>
|
|
|
|
|
+ <a-col :span="24"
|
|
|
|
|
+ class="mt-10">
|
|
|
|
|
+ <a-form-item>
|
|
|
|
|
+ <a-slider :min="0"
|
|
|
|
|
+ v-model:value="formState.OrderQty"
|
|
|
|
|
+ :max="getMaxNum()"
|
|
|
|
|
+ class="formSlider" />
|
|
|
|
|
+ <div class="unit">
|
|
|
|
|
+ <span>{{getMaxNum() ? selectedRow.minivalue : 0}}</span>
|
|
|
|
|
+ <span>{{getMaxNum()}}{{selectedRow.enumdicname}}</span>
|
|
|
</div>
|
|
</div>
|
|
|
- <a-row :gutter="24">
|
|
|
|
|
- <a-col :span="24" class="fixedBtns">
|
|
|
|
|
- <a-form-item class="btnCenter">
|
|
|
|
|
- <a-button class="listedBtn" @click="submit">{{isBuy() ? '买入' : '卖出'}}</a-button>
|
|
|
|
|
- <a-button class="ml10 cancelBtn" @click="cancel">取消</a-button>
|
|
|
|
|
- </a-form-item>
|
|
|
|
|
- </a-col>
|
|
|
|
|
- </a-row>
|
|
|
|
|
- </a-form>
|
|
|
|
|
|
|
+ </a-form-item>
|
|
|
|
|
+ </a-col>
|
|
|
|
|
+ <a-col :span="24"
|
|
|
|
|
+ class="relative mt20">
|
|
|
|
|
+ <a-form-item :label="'挂牌金额'">
|
|
|
|
|
+ <span class="white ml8">{{getMoney()}}</span>
|
|
|
|
|
+ </a-form-item>
|
|
|
|
|
+ </a-col>
|
|
|
|
|
+ <a-col :span="24"
|
|
|
|
|
+ v-if="getMargin()">
|
|
|
|
|
+ <a-form-item :label="'履约保证金'">
|
|
|
|
|
+ <span class="white ml8">{{getMargin()}}</span>
|
|
|
|
|
+ </a-form-item>
|
|
|
|
|
+ </a-col>
|
|
|
|
|
+ <a-col :span="24">
|
|
|
|
|
+ <a-form-item label="可用资金">
|
|
|
|
|
+ <span class="white ml8">{{canUseMoney()}}</span>
|
|
|
|
|
+ </a-form-item>
|
|
|
|
|
+ </a-col>
|
|
|
|
|
+ </a-row>
|
|
|
</div>
|
|
</div>
|
|
|
- </Drawer>
|
|
|
|
|
|
|
+ <a-row :gutter="24">
|
|
|
|
|
+ <a-col :span="24"
|
|
|
|
|
+ class="fixedBtns">
|
|
|
|
|
+ <a-form-item class="btnCenter">
|
|
|
|
|
+ <a-button class="listedBtn"
|
|
|
|
|
+ @click="submit">{{isBuy() ? '买入' : '卖出'}}</a-button>
|
|
|
|
|
+ <a-button class="ml10 cancelBtn"
|
|
|
|
|
+ @click="cancel">取消</a-button>
|
|
|
|
|
+ </a-form-item>
|
|
|
|
|
+ </a-col>
|
|
|
|
|
+ </a-row>
|
|
|
|
|
+ </a-form>
|
|
|
|
|
+ </div>
|
|
|
|
|
+ </Drawer>
|
|
|
</template>
|
|
</template>
|
|
|
|
|
|
|
|
<script lang="ts">
|
|
<script lang="ts">
|
|
@@ -156,7 +162,7 @@ import { v4 as uuidv4 } from 'uuid';
|
|
|
import { defineComponent, PropType, ref } from 'vue';
|
|
import { defineComponent, PropType, ref } from 'vue';
|
|
|
import { useUserType } from '../setup';
|
|
import { useUserType } from '../setup';
|
|
|
import { FormParam } from './interface';
|
|
import { FormParam } from './interface';
|
|
|
-import { handleForm, isFloat, useBuySellDirection } from './setup';
|
|
|
|
|
|
|
+import { handleForm, isFloat, useBuySellDirection, usePrice, useNum } from './setup';
|
|
|
|
|
|
|
|
export default defineComponent({
|
|
export default defineComponent({
|
|
|
emits: ['cancel', 'update'],
|
|
emits: ['cancel', 'update'],
|
|
@@ -263,6 +269,8 @@ export default defineComponent({
|
|
|
useUserType,
|
|
useUserType,
|
|
|
canUseMoney,
|
|
canUseMoney,
|
|
|
accountList,
|
|
accountList,
|
|
|
|
|
+ ...usePrice(),
|
|
|
|
|
+ ...useNum(),
|
|
|
};
|
|
};
|
|
|
},
|
|
},
|
|
|
});
|
|
});
|