Explorar el Código

任务:2836

huangbin hace 4 años
padre
commit
42f35f8b8d

+ 1 - 1
src/views/market/spot_trade/spot_trade_order_transaction/spot_trade_order_transaction_swap/components/delisting/index.vue

@@ -66,7 +66,7 @@
             <div class="formBar">
               <a-row :gutter="24">
                 <a-col :span="24">
-                  <a-form-item label="易账户" name="accountid">
+                  <a-form-item label="易账户" name="accountid">
                     <a-select
                       class="inlineFormSelect"
                       style="width: 260px"

+ 287 - 227
src/views/market/spot_trade/spot_trade_order_transaction/spot_trade_order_transaction_swap/components/post_buying/index.vue

@@ -1,6 +1,13 @@
 <template>
   <!-- 挂牌求购 -->
-  <a-drawer placement="right" :closable="false" :visible="visible" :width="1052" :destroyOnClose="true" class="post-buying-container">
+  <a-drawer
+    placement="right"
+    :closable="false"
+    :visible="visible"
+    :width="1052"
+    :destroyOnClose="true"
+    class="post-buying-container"
+  >
     <div class="collapse">
       <div class="collapse-close" @click="cancelAction">
         <DoubleRightOutlined />
@@ -25,32 +32,47 @@
                 <div class="content--right">{{ selectedRow.goodsname }}</div>
               </div>
               <div class="chart-tips__last">
-                <div :class="['content--left', handleQuotePriceColor_out(selectedRow.refgoodscode, 'last')]">{{ getQuoteValue_out(selectedRow.refgoodscode, 'last') }}</div>
+                <div
+                  :class="['content--left', handleQuotePriceColor_out(selectedRow.refgoodscode, 'last')]"
+                >{{ getQuoteValue_out(selectedRow.refgoodscode, 'last') }}</div>
                 <div class="content--right">
-                  <span :class="handleQuotePriceColor_out(selectedRow.refgoodscode, 'last')">{{ quoteChange_out(selectedRow.refgoodscode) }}</span>
-                  <span :class="handleQuotePriceColor_out(selectedRow.refgoodscode, 'last')">{{ quoteAmplitude_out(selectedRow.refgoodscode) }}</span>
+                  <span
+                    :class="handleQuotePriceColor_out(selectedRow.refgoodscode, 'last')"
+                  >{{ quoteChange_out(selectedRow.refgoodscode) }}</span>
+                  <span
+                    :class="handleQuotePriceColor_out(selectedRow.refgoodscode, 'last')"
+                  >{{ quoteAmplitude_out(selectedRow.refgoodscode) }}</span>
                 </div>
               </div>
               <a-row>
                 <a-col :span="4" :offset="2">最高价</a-col>
                 <a-col :span="6">
-                  <span :class="handleQuotePriceColor_out(selectedRow.refgoodscode, 'highest')">{{ getQuoteValue_out(selectedRow.refgoodscode, 'highest') }}</span>
+                  <span
+                    :class="handleQuotePriceColor_out(selectedRow.refgoodscode, 'highest')"
+                  >{{ getQuoteValue_out(selectedRow.refgoodscode, 'highest') }}</span>
                 </a-col>
                 <a-col :span="4" :offset="2">开盘价</a-col>
                 <a-col :span="6">
-                  <span :class="handleQuotePriceColor_out(selectedRow.refgoodscode, 'opened')">{{ getQuoteValue_out(selectedRow.refgoodscode, 'opened') }}</span>
+                  <span
+                    :class="handleQuotePriceColor_out(selectedRow.refgoodscode, 'opened')"
+                  >{{ getQuoteValue_out(selectedRow.refgoodscode, 'opened') }}</span>
                 </a-col>
               </a-row>
               <a-row>
                 <a-col :span="4" :offset="2">最低价</a-col>
                 <a-col :span="6">
-                  <span :class="handleQuotePriceColor_out(selectedRow.refgoodscode, 'lowest')">{{ getQuoteValue_out(selectedRow.refgoodscode, 'lowest') }}</span>
+                  <span
+                    :class="handleQuotePriceColor_out(selectedRow.refgoodscode, 'lowest')"
+                  >{{ getQuoteValue_out(selectedRow.refgoodscode, 'lowest') }}</span>
                 </a-col>
                 <a-col :span="4" :offset="2">昨结价</a-col>
                 <a-col :span="6">{{ getQuoteValue_out(selectedRow.refgoodscode, 'presettle') }}</a-col>
               </a-row>
               <div class="chart-content">
-                <Chart :selectedRow="getQuoteDayInfoByCode(selectedRow.refgoodscode)" :showExchange="false" />
+                <Chart
+                  :selectedRow="getQuoteDayInfoByCode(selectedRow.refgoodscode)"
+                  :showExchange="false"
+                />
               </div>
             </div>
           </a-col>
@@ -60,9 +82,18 @@
                 <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-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>
@@ -78,19 +109,30 @@
                     </a-col>
                     <a-col :span="24">
                       <a-form-item label="参考价">
-                        <span :class="handleQuotePriceColor_out(selectedRow.refgoodscode, 'last')">{{ getQuoteValue_out(selectedRow.refgoodscode, 'last') }}</span>
+                        <span
+                          :class="handleQuotePriceColor_out(selectedRow.refgoodscode, 'last')"
+                        >{{ getQuoteValue_out(selectedRow.refgoodscode, 'last') }}</span>
                       </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" />
+                        <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-input-number
+                          class="commonInput"
+                          style="width: 260px"
+                          v-model:value="formState.PriceMove"
+                        />
                       </a-form-item>
                     </a-col>
                     <a-col :span="24" v-if="isFloat()">
@@ -101,7 +143,13 @@
 
                     <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" />
+                        <a-input-number
+                          class="commonInput"
+                          style="width: 260px"
+                          :min="0"
+                          :max="getMaxNum()"
+                          v-model:value="formState.OrderQty"
+                        />
                         <MinusOutlined @click="decreaseNum" />
                         <PlusOutlined @click="increaseNum" />
                         <span class="input-enumdicname">{{ selected.enumdicname }}</span>
@@ -109,7 +157,12 @@
                     </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" />
+                        <a-slider
+                          :min="0"
+                          v-model:value="formState.OrderQty"
+                          :max="getMaxNum()"
+                          class="formSlider"
+                        />
                         <div class="unit">
                           <span>{{ getMaxNum() ? selected.minivalue : 0 }}</span>
                           <span>{{ getMaxNum() }}{{ selected.enumdicname }}</span>
@@ -136,7 +189,12 @@
                 <a-row :gutter="24">
                   <a-col :span="24" class="fixedBtns">
                     <a-form-item class="btnCenter">
-                      <a-button class="listedBtn" :loading="loading" :disabled="loading" @click="submit">{{ isBuy() ? '买入' : '卖出' }}</a-button>
+                      <a-button
+                        class="listedBtn"
+                        :loading="loading"
+                        :disabled="loading"
+                        @click="submit"
+                      >{{ isBuy() ? '买入' : '卖出' }}</a-button>
                       <a-button class="ml10 cancelBtn" @click="cancel">取消</a-button>
                     </a-form-item>
                   </a-col>
@@ -160,6 +218,7 @@ import { useTaAccount } from '@/common/setup/account';
 import { validateAction } from '@/common/setup/form';
 import { _closeModal } from '@/common/setup/modal/modal';
 import { queryTableList } from '@/common/setup/table';
+import { getQuoteValue_out, handleNoneValue, handleQuotePriceColor, handleQuotePriceColor_out, handleSubcriteOnDemandQuote, quoteAmplitude, quoteAmplitude_out, quoteAmplituOfVibration, quoteChange, quoteChange_out } from '@/common/setup/table/tableQuote';
 import { useListingTradeNumAndPrice } from '@/common/setup/trade';
 import { ListingTradeNumAndPrice } from '@/common/setup/trade/interface';
 import { useTodayMargin } from '@/hooks/margin';
@@ -173,18 +232,15 @@ import { QueryTjmdTodayAccountMarginReq } from '@/services/go/Tjmd/interface';
 import { diaoQiOrder } from '@/services/socket/order';
 import { OrderReq } from '@/services/socket/order/interface';
 import Bus from '@/utils/eventBus';
-import { MinusOutlined, PlusOutlined, SwapOutlined } from '@ant-design/icons-vue';
+import Chart from '@/views/market/spot_trade/components/goods-chart/chart/index.vue';
+import { DoubleRightOutlined, LineChartOutlined, MinusOutlined, PlusOutlined, SwapOutlined } from '@ant-design/icons-vue';
 import moment from 'moment';
 import { v4 as uuidv4 } from 'uuid';
 import { defineComponent, PropType, ref } from 'vue';
 import { RefGoodsList } from '../../interface';
 import { useUserType } from '../setup';
 import { FormParam } from './interface';
-import { handleForm, isFloat, useBuySellDirection, useNum, usePrice, useChart } from './setup';
-import { DoubleRightOutlined, LineChartOutlined } from '@ant-design/icons-vue';
-import { handleQuotePriceColor, quoteChange, handleNoneValue, quoteAmplitude } from '@/common/setup/table/tableQuote';
-import { handleQuotePriceColor_out, handleSubcriteOnDemandQuote, quoteAmplitude_out, quoteAmplituOfVibration, quoteChange_out, getQuoteValue_out } from '@/common/setup/table/tableQuote';
-import Chart from '@/views/market/spot_trade/components/goods-chart/chart/index.vue';
+import { handleForm, isFloat, useBuySellDirection, useChart, useNum, usePrice } from './setup';
 
 export default defineComponent({
   emits: ['cancel', 'update'],
@@ -370,263 +426,267 @@ export default defineComponent({
 
 <style lang="less">
 .post-buying-container {
-    top: 101px;
-    .ant-drawer-content-wrapper {
-        height: 605px;
-    }
+  top: 101px;
+  .ant-drawer-content-wrapper {
+    height: 605px;
+  }
 }
 .chart-content {
-    height: 400px;
+  height: 400px;
 
-    .chart-content__header,
-    .chart-content__main {
-        width: 90% !important;
-        margin: auto !important;
-    }
+  .chart-content__header,
+  .chart-content__main {
+    width: 90% !important;
+    margin: auto !important;
+  }
 
-    .chart-slider {
-        display: none;
-    }
+  .chart-slider {
+    display: none;
+  }
 }
 .formBar {
-    height: 100%;
-    max-height: 100%;
+  height: 100%;
+  max-height: 100%;
 }
 .post_buying_chart {
-    [theme='light'] & {
-        --bgcolor: #fff;
-        --tab-border-color: #dae5ec;
-        --tab-checked-color: #0866b8;
-        --tab-checked-bgcolor: #d4e0ff;
-        --slider-border-color: #b2c4dd;
-        --slider-bgcolor: #edf2f7;
-        --slider-button-color: #b2c4dd;
-        --row-border-color: #dae5ec;
-        --row-title-color: #acb8c0;
-        --row-content-color: #3c454b;
-        --tik-title-bgcolor: #ecf2f5;
-        --tik-title-color: #7a8a94;
-    }
-    color: @m-grey67;
+  [theme="light"] & {
+    --bgcolor: #fff;
+    --tab-border-color: #dae5ec;
+    --tab-checked-color: #0866b8;
+    --tab-checked-bgcolor: #d4e0ff;
+    --slider-border-color: #b2c4dd;
+    --slider-bgcolor: #edf2f7;
+    --slider-button-color: #b2c4dd;
+    --row-border-color: #dae5ec;
+    --row-title-color: #acb8c0;
+    --row-content-color: #3c454b;
+    --tik-title-bgcolor: #ecf2f5;
+    --tik-title-color: #7a8a94;
+  }
+  color: @m-grey67;
 
-    // background-color: var(--bgcolor, #0e0e0f);
+  // background-color: var(--bgcolor, #0e0e0f);
 
-    // background: @m-blue37;
-    // color: @m-grey67;
-    .buying_chart {
-        display: flex;
+  // background: @m-blue37;
+  // color: @m-grey67;
+  .buying_chart {
+    display: flex;
 
-        // background-color: @m-blue36;
-        &__nav {
-            display: flex;
-            justify-content: center;
-            align-items: center;
+    // background-color: @m-blue36;
+    &__nav {
+      display: flex;
+      justify-content: center;
+      align-items: center;
 
-            .content {
-                &:first-child:not(:last-child) {
-                    margin-right: 16px;
-                }
+      .content {
+        &:first-child:not(:last-child) {
+          margin-right: 16px;
+        }
 
-                &--left {
-                    font-size: 16px;
-                    color: var(--row-content-color, #acb8c0);
-                    margin-right: 6px;
-                }
+        &--left {
+          font-size: 16px;
+          color: var(--row-content-color, #acb8c0);
+          margin-right: 6px;
+        }
 
-                &--right {
-                    font-size: 24px;
-                    color: #fc9618;
-                }
-            }
+        &--right {
+          font-size: 24px;
+          color: #fc9618;
         }
+      }
     }
-    .chart-tips {
-        display: flex;
-        flex-direction: column;
-        width: 300px;
-        height: 100%;
+  }
+  .chart-tips {
+    display: flex;
+    flex-direction: column;
+    width: 300px;
+    height: 100%;
 
-        &__last {
-            display: flex;
-            justify-content: center;
-            align-items: center;
-            padding: 16px 0;
-            .content {
-                &--left {
-                    font-size: 24px;
-                    margin-right: 16px;
-                }
+    &__last {
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      padding: 16px 0;
+      .content {
+        &--left {
+          font-size: 24px;
+          margin-right: 16px;
+        }
 
-                &--right {
-                    display: flex;
-                    flex-direction: column;
-                    align-items: flex-start;
-                }
-            }
+        &--right {
+          display: flex;
+          flex-direction: column;
+          align-items: flex-start;
         }
+      }
     }
+  }
 }
 .post_buying {
-    width: 100%;
-    height: 100%;
-    .flex;
-    flex-direction: column;
-    position: relative;
-    overflow: hidden;
+  width: 100%;
+  height: 100%;
+  .flex;
+  flex-direction: column;
+  position: relative;
+  overflow: hidden;
 
-    .ant-form {
-        height: 100%;
+  .ant-form {
+    height: 100%;
+  }
+  .condition {
+    width: 100%;
+    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;
+      }
     }
-    .condition {
-        width: 100%;
-        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;
-        }
+    .conditionBtn + .conditionBtn {
+      margin-left: 10px;
     }
+  }
 }
 .title_right {
-    color: @m-blue25;
-    position: absolute;
-    top: 8px;
-    right: 19px;
-    cursor: pointer;
-    display: flex;
-    .tline {
-        width: 1px;
-        height: 18px;
-        background: @m-black47;
-        margin-top: 2px;
-        box-shadow: 1px 0px 0px 0px @m-black48;
-    }
-    .icon {
-        font-size: 16px;
-        height: 16px;
-        line-height: 16px;
-        margin: 3px 7px 3px 17px;
-        fill: @m-blue25;
-    }
-    span {
-        font-size: 14px;
-        font-family: Adobe Heiti Std;
-        font-weight: normal;
-    }
+  color: @m-blue25;
+  position: absolute;
+  top: 8px;
+  right: 19px;
+  cursor: pointer;
+  display: flex;
+  .tline {
+    width: 1px;
+    height: 18px;
+    background: @m-black47;
+    margin-top: 2px;
+    box-shadow: 1px 0px 0px 0px @m-black48;
+  }
+  .icon {
+    font-size: 16px;
+    height: 16px;
+    line-height: 16px;
+    margin: 3px 7px 3px 17px;
+    fill: @m-blue25;
+  }
+  span {
+    font-size: 14px;
+    font-family: Adobe Heiti Std;
+    font-weight: normal;
+  }
 }
 .unit {
-    margin-left: 70px;
-    width: 260px;
-    .flex;
-    justify-content: space-between;
-    font-size: 14px;
-    color: @m-grey41;
-    height: 14px;
-    line-height: 14px;
+  margin-left: 70px;
+  width: 260px;
+  .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%) !important;
-    &:hover {
-        background: linear-gradient(0deg, @m-grey12-hover 0%, @m-grey13-hover 100%) !important;
-        color: @m-white0-hover;
-    }
+  background: linear-gradient(0deg, @m-grey12 0%, @m-grey13 100%) !important;
+  &:hover {
+    background: linear-gradient(
+      0deg,
+      @m-grey12-hover 0%,
+      @m-grey13-hover 100%
+    ) !important;
+    color: @m-white0-hover;
+  }
 }
 .ml10 {
-    margin-left: 10px;
+  margin-left: 10px;
 }
 .ant-form.dialogForm .ant-row.ant-form-item {
-    margin-bottom: 14px;
+  margin-bottom: 14px;
 }
 .mt20 {
-    margin-top: 20px;
+  margin-top: 20px;
 }
 .mt-10 {
-    margin-top: -10px;
+  margin-top: -10px;
 }
 .ant-input-suffix {
-    position: absolute;
-    right: -25px;
+  position: absolute;
+  right: -25px;
 }
 .minusBtn,
 .plusBtn {
-    width: 15px;
-    height: 32px;
-    line-height: 32px;
-    font-size: 15px;
-    color: @m-blue15;
-    cursor: pointer;
+  width: 15px;
+  height: 32px;
+  line-height: 32px;
+  font-size: 15px;
+  color: @m-blue15;
+  cursor: pointer;
 }
 .minusBtn {
-    position: absolute;
-    top: -6px;
-    left: 14px;
-    z-index: 1;
+  position: absolute;
+  top: -6px;
+  left: 14px;
+  z-index: 1;
 }
 .plusBtn {
-    position: absolute;
-    top: -6px;
-    right: 14px;
-    z-index: 1;
+  position: absolute;
+  top: -6px;
+  right: 14px;
+  z-index: 1;
 }
 .stepper {
-    padding-left: 30px;
-    padding-right: 30px;
-    text-align: center;
-    color: @m-yellow1;
-    font-size: 16px;
+  padding-left: 30px;
+  padding-right: 30px;
+  text-align: center;
+  color: @m-yellow1;
+  font-size: 16px;
 }
 .ant-slider.formSlider {
-    width: 260px !important;
-    margin-left: 70px;
-    .ant-slider-rail {
-        margin-right: 0;
-        padding-right: 0;
-        height: 3px !important;
-        border-radius: 2px !important;
-        background-color: @m-blue14;
-    }
-    .ant-slider-track {
-        height: 3px;
-        background-color: @m-blue0;
-    }
-    .ant-slider-step {
-        height: 3px;
-    }
-    .ant-progress-text {
-        display: none;
-    }
+  width: 260px !important;
+  margin-left: 70px;
+  .ant-slider-rail {
+    margin-right: 0;
+    padding-right: 0;
+    height: 3px !important;
+    border-radius: 2px !important;
+    background-color: @m-blue14;
+  }
+  .ant-slider-track {
+    height: 3px;
+    background-color: @m-blue0;
+  }
+  .ant-slider-step {
+    height: 3px;
+  }
+  .ant-progress-text {
+    display: none;
+  }
 }
 </style>