|
|
@@ -1,10 +1,12 @@
|
|
|
<template>
|
|
|
<!-- 现货仓单 现货明细 挂牌 -->
|
|
|
- <Drawer :title="'挂牌'"
|
|
|
- :placement="'right'"
|
|
|
- class="delistingBottom650"
|
|
|
- :visible="visible"
|
|
|
- @cancel="cancel">
|
|
|
+ <Drawer
|
|
|
+ :title="'挂牌'"
|
|
|
+ :placement="'right'"
|
|
|
+ class="delistingBottom650"
|
|
|
+ :visible="visible"
|
|
|
+ @cancel="cancel"
|
|
|
+ >
|
|
|
<div class="listing">
|
|
|
<div class="condition">
|
|
|
<a-button class="conditionBtn">{{ selectedRow.deliverygoodsname }}</a-button>
|
|
|
@@ -12,109 +14,110 @@
|
|
|
<a-button class="conditionBtn">{{ selectedRow.warehousename }}</a-button>
|
|
|
</div>
|
|
|
|
|
|
- <a-form class="inlineForm dialogForm"
|
|
|
- ref="formRef"
|
|
|
- :model="formState"
|
|
|
- :rules="rules">
|
|
|
+ <a-form class="inlineForm dialogForm" ref="formRef" :model="formState" :rules="rules">
|
|
|
<div class="formBar">
|
|
|
<a-row :gutter="24">
|
|
|
<a-col :span="12">
|
|
|
- <a-form-item label="挂牌方式"
|
|
|
- name="marketid">
|
|
|
- <a-select class="inlineFormSelect"
|
|
|
- v-model:value="formState.marketid"
|
|
|
- @change="handleMarket"
|
|
|
- style="width: 140px"
|
|
|
- placeholder="请选择挂牌市场">
|
|
|
+ <a-form-item label="挂牌方式" name="marketid">
|
|
|
+ <a-select
|
|
|
+ class="inlineFormSelect"
|
|
|
+ v-model:value="formState.marketid"
|
|
|
+ @change="handleMarket"
|
|
|
+ style="width: 140px"
|
|
|
+ placeholder="请选择挂牌市场"
|
|
|
+ >
|
|
|
<!-- <a-select-option :value="1">一口价</a-select-option>
|
|
|
<a-select-option :value="2">浮动价</a-select-option>
|
|
|
- <a-select-option :value="3">贸易圈</a-select-option> -->
|
|
|
- <a-select-option v-for="item in spotMarkets" :key="item.marketid" :value="item.marketid">{{item.marketname}}</a-select-option>
|
|
|
+ <a-select-option :value="3">贸易圈</a-select-option>-->
|
|
|
+ <a-select-option
|
|
|
+ v-for="item in spotMarkets"
|
|
|
+ :key="item.marketid"
|
|
|
+ :value="item.marketid"
|
|
|
+ >{{ item.marketname }}</a-select-option>
|
|
|
</a-select>
|
|
|
</a-form-item>
|
|
|
</a-col>
|
|
|
- <a-col :span="12"
|
|
|
- v-if="isFixed()">
|
|
|
- <a-form-item label="挂牌价"
|
|
|
- name="FixedPrice">
|
|
|
- <a-input-number class="dialogInput"
|
|
|
- :min="0"
|
|
|
- style="width: 140px"
|
|
|
- v-model:value="formState.FixedPrice"
|
|
|
- placeholder="请输入挂牌价" />
|
|
|
+ <a-col :span="12" v-if="isFixed()">
|
|
|
+ <a-form-item label="挂牌价" name="FixedPrice">
|
|
|
+ <a-input-number
|
|
|
+ class="dialogInput"
|
|
|
+ :min="0"
|
|
|
+ style="width: 140px"
|
|
|
+ v-model:value="formState.FixedPrice"
|
|
|
+ placeholder="请输入挂牌价"
|
|
|
+ />
|
|
|
</a-form-item>
|
|
|
</a-col>
|
|
|
- <a-col :span="12"
|
|
|
- v-if="isBlocs()">
|
|
|
- <a-form-item label="挂牌价格"
|
|
|
- name="FixedPrice"
|
|
|
- class="inputIconBox">
|
|
|
- <a-input-number class="commonInput"
|
|
|
- style="width: 140px"
|
|
|
- :min="0"
|
|
|
- v-model:value="formState.FixedPrice" />
|
|
|
- <a-checkbox class="commonCheckbox"
|
|
|
- v-model:checked="priceCheck">可议价</a-checkbox>
|
|
|
+ <a-col :span="12" v-if="isBlocs()">
|
|
|
+ <a-form-item label="挂牌价格" name="FixedPrice" class="inputIconBox">
|
|
|
+ <a-input-number
|
|
|
+ class="commonInput"
|
|
|
+ style="width: 140px"
|
|
|
+ :min="0"
|
|
|
+ v-model:value="formState.FixedPrice"
|
|
|
+ />
|
|
|
+ <a-checkbox class="commonCheckbox" v-model:checked="priceCheck">可议价</a-checkbox>
|
|
|
</a-form-item>
|
|
|
</a-col>
|
|
|
-
|
|
|
</a-row>
|
|
|
- <a-row :gutter="24"
|
|
|
- v-if="isFloat()">
|
|
|
+ <a-row :gutter="24" v-if="isFloat()">
|
|
|
<a-col :span="24">
|
|
|
- <a-form-item label="行情商品"
|
|
|
- name="goodsid">
|
|
|
+ <a-form-item label="行情商品" name="goodsid">
|
|
|
<!-- <a-select class="inlineFormSelect"
|
|
|
style="width: 135px"
|
|
|
placeholder="请择交易所">
|
|
|
- </a-select>-->
|
|
|
- <a-select class="inlineFormSelect ml5"
|
|
|
- @change="handleGoodsGroups"
|
|
|
- style="width: 180px"
|
|
|
- v-model:value="formState.goodsgroupid"
|
|
|
- placeholder="请选择商品">
|
|
|
- <a-select-option v-for="item in goodsGroup"
|
|
|
- :value="item.goodsgroupid"
|
|
|
- :key="item.goodsgroupid">{{ item.goodsgroupname }}
|
|
|
- </a-select-option>
|
|
|
+ </a-select>-->
|
|
|
+ <a-select
|
|
|
+ class="inlineFormSelect ml5"
|
|
|
+ @change="handleGoodsGroups"
|
|
|
+ style="width: 180px"
|
|
|
+ v-model:value="formState.goodsgroupid"
|
|
|
+ placeholder="请选择商品"
|
|
|
+ >
|
|
|
+ <a-select-option
|
|
|
+ v-for="item in goodsGroup"
|
|
|
+ :value="item.goodsgroupid"
|
|
|
+ :key="item.goodsgroupid"
|
|
|
+ >{{ item.goodsgroupname }}</a-select-option>
|
|
|
</a-select>
|
|
|
- <a-select class="inlineFormSelect ml5"
|
|
|
- style="width: 180px"
|
|
|
- @change="handleGoodsChange"
|
|
|
- v-model:value="formState.goodsid"
|
|
|
- placeholder="请选择合约">
|
|
|
- <a-select-option v-for="item in goodsList"
|
|
|
- :value="item.goodsid"
|
|
|
- :key="item.goodsid">{{ item.goodsname }}</a-select-option>
|
|
|
+ <a-select
|
|
|
+ class="inlineFormSelect ml5"
|
|
|
+ style="width: 180px"
|
|
|
+ @change="handleGoodsChange"
|
|
|
+ v-model:value="formState.goodsid"
|
|
|
+ placeholder="请选择合约"
|
|
|
+ >
|
|
|
+ <a-select-option
|
|
|
+ v-for="item in goodsList"
|
|
|
+ :value="item.goodsid"
|
|
|
+ :key="item.goodsid"
|
|
|
+ >{{ item.goodsname }}</a-select-option>
|
|
|
</a-select>
|
|
|
</a-form-item>
|
|
|
</a-col>
|
|
|
</a-row>
|
|
|
<a-row :gutter="24">
|
|
|
<a-col :span="12">
|
|
|
- <a-form-item label="挂牌数量"
|
|
|
- class="inputIconBox"
|
|
|
- name="OrderQty">
|
|
|
- <a-input-number class="dialogInput"
|
|
|
- style="width: 140px !important"
|
|
|
- :min="0"
|
|
|
- v-model:value="formState.OrderQty"
|
|
|
- placeholder="请输入挂牌数量" />
|
|
|
+ <a-form-item label="挂牌数量" class="inputIconBox" name="OrderQty">
|
|
|
+ <a-input-number
|
|
|
+ class="dialogInput"
|
|
|
+ style="width: 140px !important"
|
|
|
+ :min="0"
|
|
|
+ v-model:value="formState.OrderQty"
|
|
|
+ placeholder="请输入挂牌数量"
|
|
|
+ />
|
|
|
<span class="input-enumdicname">{{ selectedRow.enumdicname }}</span>
|
|
|
- <a-checkbox class="commonCheckbox"
|
|
|
- v-if="isBlocs()"
|
|
|
- v-model:checked="numCheck">整单</a-checkbox>
|
|
|
+ <a-checkbox class="commonCheckbox" v-if="isBlocs()" v-model:checked="numCheck">整单</a-checkbox>
|
|
|
</a-form-item>
|
|
|
</a-col>
|
|
|
- <a-col :span="12"
|
|
|
- v-if="!numCheck">
|
|
|
- <a-form-item label="起摘数量"
|
|
|
- class="relative"
|
|
|
- name="DelistMinQty">
|
|
|
- <a-input-number class="commonInput"
|
|
|
- :min="0"
|
|
|
- v-model:value="formState.DelistMinQty"
|
|
|
- style="width: 140px !important" />
|
|
|
+ <a-col :span="12" v-if="!numCheck">
|
|
|
+ <a-form-item label="起摘数量" class="relative" name="DelistMinQty">
|
|
|
+ <a-input-number
|
|
|
+ class="commonInput"
|
|
|
+ :min="0"
|
|
|
+ v-model:value="formState.DelistMinQty"
|
|
|
+ style="width: 140px !important"
|
|
|
+ />
|
|
|
<span class="input-enumdicname">{{ selectedRow.enumdicname }}</span>
|
|
|
<div class="tip-listing">
|
|
|
<span>最小单位：</span>
|
|
|
@@ -124,14 +127,15 @@
|
|
|
</a-col>
|
|
|
</a-row>
|
|
|
<a-row :gutter="24">
|
|
|
- <a-col :span="12"
|
|
|
- class="mt-20">
|
|
|
+ <a-col :span="12" class="mt-20">
|
|
|
<a-form-item>
|
|
|
- <a-slider v-model:value="formState.OrderQty"
|
|
|
- :min="0"
|
|
|
- :max="selectedRow.enableqty"
|
|
|
- class="formSlider"
|
|
|
- style="width: 140px" />
|
|
|
+ <a-slider
|
|
|
+ v-model:value="formState.OrderQty"
|
|
|
+ :min="0"
|
|
|
+ :max="selectedRow.enableqty"
|
|
|
+ class="formSlider"
|
|
|
+ style="width: 140px"
|
|
|
+ />
|
|
|
<div class="unit">
|
|
|
<span>0</span>
|
|
|
<span>{{ selectedRow.enableqty }}{{ selectedRow.enumdicname }}</span>
|
|
|
@@ -140,112 +144,103 @@
|
|
|
</a-col>
|
|
|
<a-col :span="12"> </a-col>
|
|
|
</a-row>
|
|
|
-
|
|
|
- <a-row :gutter="24">
|
|
|
- <a-col :span="12">
|
|
|
- <a-form-item label="履约保证金"
|
|
|
- name="margin">
|
|
|
- <a-input-number class="commonInput"
|
|
|
- v-model:value="formState.margin"
|
|
|
- :min="0"
|
|
|
- style="width: 140px" />
|
|
|
- <span class="input-enumdicname">%</span>
|
|
|
- </a-form-item>
|
|
|
- </a-col>
|
|
|
- <a-col :span="12">
|
|
|
- <a-form-item label="挂牌有效期"
|
|
|
- name="vidaliteTime"
|
|
|
- class="inputIconBox">
|
|
|
- <a-date-picker style="width: 140px"
|
|
|
- v-model:value="formState.vidaliteTime"
|
|
|
- :allowClear="false"
|
|
|
- class="commonDatePicker dialogDatePicker" />
|
|
|
- </a-form-item>
|
|
|
- </a-col>
|
|
|
- </a-row>
|
|
|
- <a-row :gutter="24">
|
|
|
- <a-col :span="12">
|
|
|
- <a-form-item label="履约方式"
|
|
|
- class="inputIconBox">
|
|
|
- <span :class="['clickBox', formState.permanceTempName ? 'white' : '']"
|
|
|
- style="width: 140px"
|
|
|
- @click="handlePermance">{{ formState.permanceTempName ? formState.permanceTempName : '选择履约模板' }}</span>
|
|
|
- <svg class="icon svg-icon"
|
|
|
- aria-hidden="true"
|
|
|
- @click="handlePermance">
|
|
|
- <use xlink:href="#icon-moban" />
|
|
|
- </svg>
|
|
|
- </a-form-item>
|
|
|
- </a-col>
|
|
|
- <template v-if="isBlocs()">
|
|
|
+
|
|
|
+ <a-row :gutter="24">
|
|
|
+ <a-col :span="12">
|
|
|
+ <a-form-item label="履约保证金" name="margin">
|
|
|
+ <a-input-number
|
|
|
+ class="commonInput"
|
|
|
+ v-model:value="formState.margin"
|
|
|
+ :min="0"
|
|
|
+ style="width: 140px"
|
|
|
+ />
|
|
|
+ <span class="input-enumdicname">%</span>
|
|
|
+ </a-form-item>
|
|
|
+ </a-col>
|
|
|
+ <a-col :span="12">
|
|
|
+ <a-form-item label="挂牌有效期" name="vidaliteTime" class="inputIconBox">
|
|
|
+ <a-date-picker
|
|
|
+ style="width: 140px"
|
|
|
+ v-model:value="formState.vidaliteTime"
|
|
|
+ :allowClear="false"
|
|
|
+ class="commonDatePicker dialogDatePicker"
|
|
|
+ />
|
|
|
+ </a-form-item>
|
|
|
+ </a-col>
|
|
|
+ </a-row>
|
|
|
+ <a-row :gutter="24">
|
|
|
+ <a-col :span="12">
|
|
|
+ <a-form-item label="履约方式" class="inputIconBox">
|
|
|
+ <span
|
|
|
+ :class="['clickBox', formState.permanceTempName ? 'white' : '']"
|
|
|
+ style="width: 140px"
|
|
|
+ @click="handlePermance"
|
|
|
+ >{{ formState.permanceTempName ? formState.permanceTempName : '选择履约模板' }}</span>
|
|
|
+ <svg class="icon svg-icon" aria-hidden="true" @click="handlePermance">
|
|
|
+ <use xlink:href="#icon-moban" />
|
|
|
+ </svg>
|
|
|
+ </a-form-item>
|
|
|
+ </a-col>
|
|
|
+ <template v-if="isBlocs()">
|
|
|
<a-col :span="12">
|
|
|
- <a-form-item label="指定朋友"
|
|
|
- class="inputIconBox">
|
|
|
- <span :class="['clickBox', getFriendLength() ? 'white' : '']"
|
|
|
- style="width: 140px"
|
|
|
- @click="openFriend">{{ getFriendLength() ? `已选${getFriendLength()}人` : '选择朋友' }}</span>
|
|
|
- <svg class="icon svg-icon"
|
|
|
- aria-hidden="true"
|
|
|
- @click="openFriend">
|
|
|
+ <a-form-item label="指定朋友" class="inputIconBox">
|
|
|
+ <span
|
|
|
+ :class="['clickBox', getFriendLength() ? 'white' : '']"
|
|
|
+ style="width: 140px"
|
|
|
+ @click="openFriend"
|
|
|
+ >{{ getFriendLength() ? `已选${getFriendLength()}人` : '选择朋友' }}</span>
|
|
|
+ <svg class="icon svg-icon" aria-hidden="true" @click="openFriend">
|
|
|
<use xlink:href="#icon-pengyou1" />
|
|
|
</svg>
|
|
|
- <a-checkbox class="commonCheckbox"
|
|
|
- v-model:checked="friendCheck"
|
|
|
- @change="limiteFriends">不限</a-checkbox>
|
|
|
+ <a-checkbox
|
|
|
+ class="commonCheckbox"
|
|
|
+ v-model:checked="friendCheck"
|
|
|
+ @change="limiteFriends"
|
|
|
+ >不限</a-checkbox>
|
|
|
</a-form-item>
|
|
|
</a-col>
|
|
|
- </template>
|
|
|
- </a-row>
|
|
|
- <a-row :gutter="24"
|
|
|
- v-if="isFloat()">
|
|
|
+ </template>
|
|
|
+ </a-row>
|
|
|
+ <a-row :gutter="24" v-if="isFloat()">
|
|
|
<a-col :span="12">
|
|
|
- <a-form-item label="基差"
|
|
|
- name="PriceMove">
|
|
|
- <a-input-number class="commonInput"
|
|
|
- v-model:value="formState.PriceMove"
|
|
|
- style="width: 140px" />
|
|
|
+ <a-form-item label="基差" name="PriceMove">
|
|
|
+ <a-input-number
|
|
|
+ class="commonInput"
|
|
|
+ v-model:value="formState.PriceMove"
|
|
|
+ style="width: 140px"
|
|
|
+ />
|
|
|
</a-form-item>
|
|
|
</a-col>
|
|
|
</a-row>
|
|
|
<a-row :gutter="24">
|
|
|
- <a-col :span="24"
|
|
|
- v-if="isFloat()"
|
|
|
- class="relative">
|
|
|
+ <a-col :span="24" v-if="isFloat()" class="relative">
|
|
|
<a-form-item :label="'估算价'">
|
|
|
<span class="white ml8">{{ getPrice() }}</span>
|
|
|
</a-form-item>
|
|
|
</a-col>
|
|
|
</a-row>
|
|
|
<a-row :gutter="24">
|
|
|
- <a-col :span="24"
|
|
|
- v-if="isFloat()"
|
|
|
- class="relative">
|
|
|
+ <a-col :span="24" v-if="isFloat()" class="relative">
|
|
|
<a-form-item :label="'估算金额'">
|
|
|
<span class="white ml8">{{ getWrMoney() }}</span>
|
|
|
</a-form-item>
|
|
|
</a-col>
|
|
|
- <a-col :span="24"
|
|
|
- v-if="isFixed()"
|
|
|
- class="relative">
|
|
|
+ <a-col :span="24" v-if="isFixed()" class="relative">
|
|
|
<a-form-item :label="'挂牌金额'">
|
|
|
<span class="white ml8">{{ getWrMoney() }}</span>
|
|
|
</a-form-item>
|
|
|
</a-col>
|
|
|
- <a-col :span="24"
|
|
|
- v-if="isBlocs()"
|
|
|
- class="relative">
|
|
|
+ <a-col :span="24" v-if="isBlocs()" class="relative">
|
|
|
<a-form-item :label="'挂牌金额'">
|
|
|
<span class="white ml8">{{ getMoney() }}</span>
|
|
|
</a-form-item>
|
|
|
</a-col>
|
|
|
- <a-col :span="24"
|
|
|
- v-if="getWrMargin() && !isBlocs()">
|
|
|
+ <a-col :span="24" v-if="getWrMargin() && !isBlocs()">
|
|
|
<a-form-item :label="getWrMargin() ? '履约保证金' : ''">
|
|
|
<span class="white ml8">{{ getWrMargin() }}</span>
|
|
|
</a-form-item>
|
|
|
</a-col>
|
|
|
- <a-col :span="24"
|
|
|
- v-if="isBlocs()">
|
|
|
+ <a-col :span="24" v-if="isBlocs()">
|
|
|
<a-form-item label="履约保证金">
|
|
|
<span class="white ml8">{{ getMargin() }}</span>
|
|
|
</a-form-item>
|
|
|
@@ -258,17 +253,15 @@
|
|
|
</a-row>
|
|
|
</div>
|
|
|
<a-row :gutter="24">
|
|
|
- <a-col :span="24"
|
|
|
- class="fixedBtns">
|
|
|
+ <a-col :span="24" class="fixedBtns">
|
|
|
<a-form-item class="btnCenter">
|
|
|
- <a-button class="listedBtn"
|
|
|
- :loading="loading"
|
|
|
- :disabled="loading"
|
|
|
- @click="submit">卖出</a-button>
|
|
|
- <a-button class="ml10 cancelBtn"
|
|
|
- :loading="loading"
|
|
|
- :disabled="loading"
|
|
|
- @click="cancel">取消</a-button>
|
|
|
+ <a-button class="listedBtn" :loading="loading" :disabled="loading" @click="submit">卖出</a-button>
|
|
|
+ <a-button
|
|
|
+ class="ml10 cancelBtn"
|
|
|
+ :loading="loading"
|
|
|
+ :disabled="loading"
|
|
|
+ @click="cancel"
|
|
|
+ >取消</a-button>
|
|
|
</a-form-item>
|
|
|
</a-col>
|
|
|
</a-row>
|
|
|
@@ -276,17 +269,21 @@
|
|
|
</div>
|
|
|
</Drawer>
|
|
|
<!-- 选择朋友 -->
|
|
|
- <Friend v-if="showFriend"
|
|
|
- :friends="formState.friends"
|
|
|
- :position="'bottom'"
|
|
|
- @cancel="chooseFriend"
|
|
|
- @update="chooseFriend" />
|
|
|
+ <Friend
|
|
|
+ v-if="showFriend"
|
|
|
+ :friends="formState.friends"
|
|
|
+ :position="'bottom'"
|
|
|
+ @cancel="chooseFriend"
|
|
|
+ @update="chooseFriend"
|
|
|
+ />
|
|
|
<!-- 选择履约模板 -->
|
|
|
- <Permance v-if="showPermance"
|
|
|
- :position="'bottom'"
|
|
|
- :marketid="formState.marketid"
|
|
|
- @cancel="choosePermance"
|
|
|
- @update="choosePermance" />
|
|
|
+ <Permance
|
|
|
+ v-if="showPermance"
|
|
|
+ :position="'bottom'"
|
|
|
+ :marketid="formState.marketid"
|
|
|
+ @cancel="choosePermance"
|
|
|
+ @update="choosePermance"
|
|
|
+ />
|
|
|
</template>
|
|
|
|
|
|
<script lang="ts">
|
|
|
@@ -315,127 +312,125 @@ import { ListingForm } from './interface';
|
|
|
import { handleForm, handleGoods, handleNumAndPrice, queryMarketSection } from './setup';
|
|
|
|
|
|
export default defineComponent({
|
|
|
- name: ModalEnum.spot_warrant_spot_details_listed,
|
|
|
- components: { Drawer, Friend, Permance },
|
|
|
- emits: ['cancel', 'update'],
|
|
|
- props: {
|
|
|
- selectedRow: {
|
|
|
- type: Object as PropType<WrHoldLB>,
|
|
|
- default: {},
|
|
|
- },
|
|
|
+ name: ModalEnum.spot_warrant_spot_details_listed,
|
|
|
+ components: { Drawer, Friend, Permance },
|
|
|
+ emits: ['cancel', 'update'],
|
|
|
+ props: {
|
|
|
+ selectedRow: {
|
|
|
+ type: Object as PropType<WrHoldLB>,
|
|
|
+ default: {},
|
|
|
},
|
|
|
- setup(props, context) {
|
|
|
- const loading = ref<boolean>(false);
|
|
|
- const { visible, cancel } = _closeModal(context);
|
|
|
- const { rules, formState, formRef } = handleForm(props.selectedRow);
|
|
|
+ },
|
|
|
+ setup(props, context) {
|
|
|
+ const loading = ref<boolean>(false);
|
|
|
+ const { visible, cancel } = _closeModal(context);
|
|
|
+ const { rules, formState, formRef } = handleForm(props.selectedRow);
|
|
|
|
|
|
- // 选择朋友
|
|
|
- const { friendCheck, showFriend, chooseFriend, openFriend, getFriendLength, limiteFriends } = useBlocksFriends(formState);
|
|
|
- // 履约模板
|
|
|
- const { showPermance, choosePermance, openPermance } = useBlocksPermaceTemp(formState);
|
|
|
- // 价格
|
|
|
- const { priceCheck, increasePrice, decreasePrice } = useBlocksPrice(formState);
|
|
|
- // 摘牌数量
|
|
|
- const { numCheck, increaseNumber, decreaseNumber } = useBlocksNumber(formState);
|
|
|
+ // 选择朋友
|
|
|
+ const { friendCheck, showFriend, chooseFriend, openFriend, getFriendLength, limiteFriends } = useBlocksFriends(formState);
|
|
|
+ // 履约模板
|
|
|
+ const { showPermance, choosePermance, openPermance } = useBlocksPermaceTemp(formState);
|
|
|
+ // 价格
|
|
|
+ const { priceCheck, increasePrice, decreasePrice } = useBlocksPrice(formState);
|
|
|
+ // 摘牌数量
|
|
|
+ const { numCheck, increaseNumber, decreaseNumber } = useBlocksNumber(formState);
|
|
|
|
|
|
- const { goodsGroup, goodsList, groupsChange, findGoodsCode } = handleGoods();
|
|
|
+ const { goodsGroup, goodsList, groupsChange, findGoodsCode } = handleGoods();
|
|
|
|
|
|
- // 获取仓单贸易市场
|
|
|
- const { spotMarkets } = queryMarketSection(false)
|
|
|
+ // 获取仓单贸易市场
|
|
|
+ const { spotMarkets } = queryMarketSection(false)
|
|
|
|
|
|
- // 切换市场
|
|
|
- function handleMarket(value: number) {
|
|
|
- const market = spotMarkets.value.find(item => item.marketid === value)
|
|
|
- if (!market) return
|
|
|
+ // 切换市场
|
|
|
+ function handleMarket(value: number) {
|
|
|
+ const market = spotMarkets.value.find(item => item.marketid === value)
|
|
|
+ if (!market) return
|
|
|
|
|
|
- // 判断所选择市场挂牌方式 1:一口价 2:浮动价 3:贸易圈 4:协议指定
|
|
|
- if (market.listingmode === 1) {
|
|
|
- formState.WRPriceType = 1
|
|
|
- } else if (market.listingmode === 2) {
|
|
|
- formState.WRPriceType = 2
|
|
|
- } else {
|
|
|
- formState.WRPriceType = 3
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- // 点选履约模板
|
|
|
- function handlePermance() {
|
|
|
- // 必须先选择市场再选择对应的履约模板
|
|
|
- if (!formState.marketid) {
|
|
|
- message.info('请先选择市场')
|
|
|
- return
|
|
|
- }
|
|
|
+ // 判断所选择市场挂牌方式 1:一口价 2:浮动价 3:贸易圈 4:协议指定
|
|
|
+ if (market.listingmode === 1) {
|
|
|
+ formState.WRPriceType = 1
|
|
|
+ } else if (market.listingmode === 2) {
|
|
|
+ formState.WRPriceType = 2
|
|
|
+ } else {
|
|
|
+ formState.WRPriceType = 3
|
|
|
+ }
|
|
|
+ }
|
|
|
|
|
|
- openPermance()
|
|
|
- }
|
|
|
+ // 点选履约模板
|
|
|
+ function handlePermance() {
|
|
|
+ // 必须先选择市场再选择对应的履约模板
|
|
|
+ if (!formState.marketid) {
|
|
|
+ message.info('请先选择市场')
|
|
|
+ return
|
|
|
+ }
|
|
|
|
|
|
- // 切换商品组
|
|
|
- function handleGoodsGroups(value: number) {
|
|
|
- groupsChange(value);
|
|
|
- formState.goodsid = undefined;
|
|
|
- // formRef.value.validate();
|
|
|
- }
|
|
|
- const uuid = v4();
|
|
|
- const goodsCode = ref<string>('');
|
|
|
- // 切换商品
|
|
|
- function handleGoodsChange(id: number) {
|
|
|
- //行情订阅
|
|
|
- removeSubscribeQuotation(uuid);
|
|
|
- goodsCode.value = goodsList.value.find((e) => e.goodsid === id)?.goodscode as string;
|
|
|
- const arr = [{ exchangeCode: 250, goodsCode: goodsCode.value, subState: 0 }];
|
|
|
- addSubscribeQuotation(uuid, arr);
|
|
|
- formRef.value.validate();
|
|
|
- }
|
|
|
- // 估算价
|
|
|
- function getPrice() {
|
|
|
- let result = '--';
|
|
|
- if (goodsCode.value) {
|
|
|
- const goodsPrice = getQuoteDayInfoByCodeFindPrice(goodsCode.value);
|
|
|
- if (goodsPrice && goodsPrice !== '--') {
|
|
|
- // 有实时行情价格
|
|
|
- result = ((goodsPrice as number) + formState.PriceMove).toFixed(2);
|
|
|
- }
|
|
|
- }
|
|
|
+ openPermance()
|
|
|
+ }
|
|
|
|
|
|
- return result;
|
|
|
+ // 切换商品组
|
|
|
+ function handleGoodsGroups(value: number) {
|
|
|
+ groupsChange(value);
|
|
|
+ formState.goodsid = undefined;
|
|
|
+ // formRef.value.validate();
|
|
|
+ }
|
|
|
+ const uuid = v4();
|
|
|
+ const goodsCode = ref<string>('');
|
|
|
+ // 切换商品
|
|
|
+ function handleGoodsChange(id: number) {
|
|
|
+ //行情订阅
|
|
|
+ removeSubscribeQuotation(uuid);
|
|
|
+ goodsCode.value = goodsList.value.find((e) => e.goodsid === id)?.goodscode as string;
|
|
|
+ const arr = [{ exchangeCode: 250, goodsCode: goodsCode.value, subState: 0 }];
|
|
|
+ addSubscribeQuotation(uuid, arr);
|
|
|
+ formRef.value.validate();
|
|
|
+ }
|
|
|
+ // 估算价
|
|
|
+ function getPrice() {
|
|
|
+ let result = '--';
|
|
|
+ if (goodsCode.value) {
|
|
|
+ const goodsPrice = getQuoteDayInfoByCodeFindPrice(goodsCode.value);
|
|
|
+ if (goodsPrice && goodsPrice !== '--') {
|
|
|
+ // 有实时行情价格
|
|
|
+ result = ((goodsPrice as number) + formState.PriceMove).toFixed(2);
|
|
|
}
|
|
|
- onMounted(() => {
|
|
|
- removeSubscribeQuotation(uuid);
|
|
|
- });
|
|
|
- const { getWrMoney, getWrMargin, isFloat, isFixed, isBlocs } = handleNumAndPrice();
|
|
|
- function submit() {
|
|
|
- debugger;
|
|
|
- // 市场信息
|
|
|
- if (!formState.marketid) {
|
|
|
- message.info("请选择市场")
|
|
|
- return
|
|
|
- }
|
|
|
- // const marketInfo = getMarketRunByTradeMode(17);
|
|
|
- const market = spotMarkets.value.find(item => item.marketid === formState.marketid)
|
|
|
- if (!market) {
|
|
|
- message.info("市场信息异常，请稍后重试")
|
|
|
- return
|
|
|
- }
|
|
|
+ }
|
|
|
|
|
|
- // 履约模板
|
|
|
- if (!formState.permanceTempName) {
|
|
|
- message.info('请选择履约模板')
|
|
|
- return
|
|
|
- }
|
|
|
+ return result;
|
|
|
+ }
|
|
|
+ onMounted(() => {
|
|
|
+ removeSubscribeQuotation(uuid);
|
|
|
+ });
|
|
|
+ const { getWrMoney, getWrMargin, isFloat, isFixed, isBlocs } = handleNumAndPrice();
|
|
|
+ function submit() {
|
|
|
+ // 市场信息
|
|
|
+ if (!formState.marketid) {
|
|
|
+ message.info("请选择市场")
|
|
|
+ return
|
|
|
+ }
|
|
|
+ // const marketInfo = getMarketRunByTradeMode(17);
|
|
|
+ const market = spotMarkets.value.find(item => item.marketid === formState.marketid)
|
|
|
+ if (!market) {
|
|
|
+ message.info("市场信息异常，请稍后重试")
|
|
|
+ return
|
|
|
+ }
|
|
|
|
|
|
- const marketInfo = getMarketRunByTradeMode(market!.trademode)
|
|
|
- if (marketInfo) {
|
|
|
- validateAction<ListingForm>(formRef, formState).then((res) => {
|
|
|
- const wrGoodsInfo: WRGoodsInfo = {
|
|
|
- GoodsID: res.goodsid as number, // uint32 配置商品ID
|
|
|
- GoodsCode: findGoodsCode(res.goodsid as number) as string, // string 配置商品代码
|
|
|
- PriceFactor: 1, // double 商品价格系数
|
|
|
- PriceMove: 0, // double 商品升贴水值
|
|
|
- WeightRatio: 1, // double 商品重量系数
|
|
|
- };
|
|
|
+ // 履约模板
|
|
|
+ if (!formState.permanceTempName) {
|
|
|
+ message.info('请选择履约模板')
|
|
|
+ return
|
|
|
+ }
|
|
|
|
|
|
- // 仓单贸易挂牌 （仓单贸易 = HasWr = 1）
|
|
|
+ const marketInfo = getMarketRunByTradeMode(market!.trademode)
|
|
|
+ if (marketInfo) {
|
|
|
+ validateAction<ListingForm>(formRef, formState).then((res) => {
|
|
|
+ const wrGoodsInfo: WRGoodsInfo = {
|
|
|
+ GoodsID: res.goodsid as number, // uint32 配置商品ID
|
|
|
+ GoodsCode: findGoodsCode(res.goodsid as number) as string, // string 配置商品代码
|
|
|
+ PriceFactor: 1, // double 商品价格系数
|
|
|
+ PriceMove: 0, // double 商品升贴水值
|
|
|
+ WeightRatio: 1, // double 商品重量系数
|
|
|
+ };
|
|
|
|
|
|
+ // 仓单贸易挂牌 （仓单贸易 = HasWr = 1）
|
|
|
const param = {
|
|
|
AccountID: getInTaAccount(), // 默认内部资金账号第一个
|
|
|
ClientSerialNo: v4(), // 客户端流水号
|
|
|
@@ -512,161 +507,161 @@ export default defineComponent({
|
|
|
} else {
|
|
|
message.error('市场信息未获取到，请联系管理员！');
|
|
|
}
|
|
|
- }
|
|
|
+ }
|
|
|
|
|
|
- return {
|
|
|
- submit,
|
|
|
- visible,
|
|
|
- cancel,
|
|
|
- loading,
|
|
|
- rules,
|
|
|
- formState,
|
|
|
- formRef,
|
|
|
- goodsGroup,
|
|
|
- goodsList,
|
|
|
- handleGoodsGroups,
|
|
|
- handleGoodsChange,
|
|
|
- getWrMoney,
|
|
|
- getWrMargin,
|
|
|
- isFloat,
|
|
|
- isFixed,
|
|
|
- isBlocs,
|
|
|
- getCanUseMoney,
|
|
|
- priceCheck,
|
|
|
- increasePrice,
|
|
|
- decreasePrice,
|
|
|
- ...useBlocksAccount(formState),
|
|
|
- ...useBlocksMoney(formState),
|
|
|
- showPermance,
|
|
|
- choosePermance,
|
|
|
- openPermance,
|
|
|
- numCheck,
|
|
|
- increaseNumber,
|
|
|
- decreaseNumber,
|
|
|
- friendCheck,
|
|
|
- showFriend,
|
|
|
- chooseFriend,
|
|
|
- openFriend,
|
|
|
- getFriendLength,
|
|
|
- limiteFriends,
|
|
|
- getPrice,
|
|
|
- spotMarkets,
|
|
|
- handleMarket,
|
|
|
- handlePermance,
|
|
|
- };
|
|
|
- },
|
|
|
+ return {
|
|
|
+ submit,
|
|
|
+ visible,
|
|
|
+ cancel,
|
|
|
+ loading,
|
|
|
+ rules,
|
|
|
+ formState,
|
|
|
+ formRef,
|
|
|
+ goodsGroup,
|
|
|
+ goodsList,
|
|
|
+ handleGoodsGroups,
|
|
|
+ handleGoodsChange,
|
|
|
+ getWrMoney,
|
|
|
+ getWrMargin,
|
|
|
+ isFloat,
|
|
|
+ isFixed,
|
|
|
+ isBlocs,
|
|
|
+ getCanUseMoney,
|
|
|
+ priceCheck,
|
|
|
+ increasePrice,
|
|
|
+ decreasePrice,
|
|
|
+ ...useBlocksAccount(formState),
|
|
|
+ ...useBlocksMoney(formState),
|
|
|
+ showPermance,
|
|
|
+ choosePermance,
|
|
|
+ openPermance,
|
|
|
+ numCheck,
|
|
|
+ increaseNumber,
|
|
|
+ decreaseNumber,
|
|
|
+ friendCheck,
|
|
|
+ showFriend,
|
|
|
+ chooseFriend,
|
|
|
+ openFriend,
|
|
|
+ getFriendLength,
|
|
|
+ limiteFriends,
|
|
|
+ getPrice,
|
|
|
+ spotMarkets,
|
|
|
+ handleMarket,
|
|
|
+ handlePermance,
|
|
|
+ };
|
|
|
+ },
|
|
|
});
|
|
|
</script>
|
|
|
|
|
|
<style lang="less" scoped>
|
|
|
.inputIconBox .input-enumdicname {
|
|
|
- right: 100px;
|
|
|
+ right: 100px;
|
|
|
}
|
|
|
.ant-form.inlineForm .relative.ant-form-item .tip {
|
|
|
- top: -5px;
|
|
|
- left: calc(100% + 5px);
|
|
|
- white-space: normal;
|
|
|
- span {
|
|
|
- display: block;
|
|
|
- line-height: 15px;
|
|
|
- }
|
|
|
+ top: -5px;
|
|
|
+ left: calc(100% + 5px);
|
|
|
+ white-space: normal;
|
|
|
+ span {
|
|
|
+ display: block;
|
|
|
+ line-height: 15px;
|
|
|
+ }
|
|
|
}
|
|
|
.listing {
|
|
|
- width: 100%;
|
|
|
- height: 100%;
|
|
|
- .flex;
|
|
|
- flex-direction: column;
|
|
|
- overflow: hidden;
|
|
|
- .condition {
|
|
|
- width: calc(100% - 32px);
|
|
|
- height: 48px;
|
|
|
- margin: 0 16px;
|
|
|
- padding: 10px 0;
|
|
|
- border-bottom: 1px solid @m-black6;
|
|
|
- .inlineflex;
|
|
|
- .conditionBtn {
|
|
|
- align-self: center;
|
|
|
- align-items: center;
|
|
|
- border: 0;
|
|
|
- min-width: 80px;
|
|
|
- height: 28px;
|
|
|
- line-height: 28px;
|
|
|
- background: @m-black7;
|
|
|
- .rounded-corners(3px);
|
|
|
- font-size: 14px;
|
|
|
- color: @m-blue0;
|
|
|
- &:hover {
|
|
|
- background: @m-black7-hover;
|
|
|
- color: @m-blue0-hover;
|
|
|
- }
|
|
|
- }
|
|
|
- .conditionBtn + .conditionBtn {
|
|
|
- margin-left: 10px;
|
|
|
- }
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ .flex;
|
|
|
+ flex-direction: column;
|
|
|
+ overflow: hidden;
|
|
|
+ .condition {
|
|
|
+ width: calc(100% - 32px);
|
|
|
+ height: 48px;
|
|
|
+ margin: 0 16px;
|
|
|
+ padding: 10px 0;
|
|
|
+ border-bottom: 1px solid @m-black6;
|
|
|
+ .inlineflex;
|
|
|
+ .conditionBtn {
|
|
|
+ align-self: center;
|
|
|
+ align-items: center;
|
|
|
+ border: 0;
|
|
|
+ min-width: 80px;
|
|
|
+ height: 28px;
|
|
|
+ line-height: 28px;
|
|
|
+ background: @m-black7;
|
|
|
+ .rounded-corners(3px);
|
|
|
+ font-size: 14px;
|
|
|
+ color: @m-blue0;
|
|
|
+ &:hover {
|
|
|
+ background: @m-black7-hover;
|
|
|
+ color: @m-blue0-hover;
|
|
|
+ }
|
|
|
}
|
|
|
- /deep/.ant-form {
|
|
|
- .formBar {
|
|
|
- height: calc(100% - 98px);
|
|
|
- .clickBox {
|
|
|
- height: 30px;
|
|
|
- }
|
|
|
- .ant-row.inputIconBox.ant-form-item {
|
|
|
- .ant-col.ant-form-item-control-wrapper {
|
|
|
- .ant-form-item-control {
|
|
|
- .ant-form-item-children {
|
|
|
- width: 232px;
|
|
|
- .ant-checkbox-wrapper.commonCheckbox {
|
|
|
- left: 140px;
|
|
|
- .ant-checkbox {
|
|
|
- margin-right: 0;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
+ .conditionBtn + .conditionBtn {
|
|
|
+ margin-left: 10px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ /deep/.ant-form {
|
|
|
+ .formBar {
|
|
|
+ height: calc(100% - 98px);
|
|
|
+ .clickBox {
|
|
|
+ height: 30px;
|
|
|
+ }
|
|
|
+ .ant-row.inputIconBox.ant-form-item {
|
|
|
+ .ant-col.ant-form-item-control-wrapper {
|
|
|
+ .ant-form-item-control {
|
|
|
+ .ant-form-item-children {
|
|
|
+ width: 232px;
|
|
|
+ .ant-checkbox-wrapper.commonCheckbox {
|
|
|
+ left: 140px;
|
|
|
+ .ant-checkbox {
|
|
|
+ margin-right: 0;
|
|
|
}
|
|
|
+ }
|
|
|
}
|
|
|
+ }
|
|
|
}
|
|
|
+ }
|
|
|
}
|
|
|
+ }
|
|
|
}
|
|
|
.mt-20 {
|
|
|
- margin-top: -20px;
|
|
|
+ margin-top: -20px;
|
|
|
}
|
|
|
.unit {
|
|
|
- margin-left: 70px;
|
|
|
- width: 140px;
|
|
|
- .flex;
|
|
|
- justify-content: space-between;
|
|
|
- font-size: 14px;
|
|
|
- color: @m-grey41;
|
|
|
- height: 14px;
|
|
|
- line-height: 14px;
|
|
|
+ margin-left: 70px;
|
|
|
+ width: 140px;
|
|
|
+ .flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ font-size: 14px;
|
|
|
+ color: @m-grey41;
|
|
|
+ height: 14px;
|
|
|
+ line-height: 14px;
|
|
|
}
|
|
|
.listedBtn {
|
|
|
- width: 120px;
|
|
|
- height: 30px;
|
|
|
- line-height: 30px;
|
|
|
- background: linear-gradient(0deg, @m-blue2 0%, @m-blue0 100%);
|
|
|
- border-radius: 3px;
|
|
|
- color: @m-white0;
|
|
|
- font-size: 14px;
|
|
|
- text-align: center;
|
|
|
- border: 0;
|
|
|
- &:hover {
|
|
|
- background: linear-gradient(0deg, @m-blue0-hover 0%, @m-blue2-hover 100%);
|
|
|
- color: @m-white0-hover;
|
|
|
- }
|
|
|
+ width: 120px;
|
|
|
+ height: 30px;
|
|
|
+ line-height: 30px;
|
|
|
+ background: linear-gradient(0deg, @m-blue2 0%, @m-blue0 100%);
|
|
|
+ border-radius: 3px;
|
|
|
+ color: @m-white0;
|
|
|
+ font-size: 14px;
|
|
|
+ text-align: center;
|
|
|
+ border: 0;
|
|
|
+ &:hover {
|
|
|
+ background: linear-gradient(0deg, @m-blue0-hover 0%, @m-blue2-hover 100%);
|
|
|
+ color: @m-white0-hover;
|
|
|
+ }
|
|
|
}
|
|
|
.cancelBtn:extend(.listedBtn) {
|
|
|
- background: linear-gradient(0deg, @m-grey12 0%, @m-grey13 100%);
|
|
|
- &:hover {
|
|
|
- background: linear-gradient(0deg, @m-grey12-hover 0%, @m-grey13-hover 100%);
|
|
|
- color: @m-white0-hover;
|
|
|
- }
|
|
|
+ background: linear-gradient(0deg, @m-grey12 0%, @m-grey13 100%);
|
|
|
+ &:hover {
|
|
|
+ background: linear-gradient(0deg, @m-grey12-hover 0%, @m-grey13-hover 100%);
|
|
|
+ color: @m-white0-hover;
|
|
|
+ }
|
|
|
}
|
|
|
.ml10 {
|
|
|
- margin-left: 10px;
|
|
|
+ margin-left: 10px;
|
|
|
}
|
|
|
.ml5 {
|
|
|
- margin-left: 5px;
|
|
|
+ margin-left: 5px;
|
|
|
}
|
|
|
</style>;
|
