|
|
@@ -12,36 +12,56 @@
|
|
|
<div class="inlineBar">
|
|
|
<div class="valNums bdf1 ml10">
|
|
|
<!-- 最新价 -->
|
|
|
- <div class="firstNum start" :class="handleQuotePriceColor(selectedRow.last, selectedRow.presettle)"> {{ selectedRow.last }}</div>
|
|
|
+ <div
|
|
|
+ class="firstNum start"
|
|
|
+ :class="handleQuotePriceColor(selectedRow.last, selectedRow.presettle)"
|
|
|
+ >{{ selectedRow.last }}</div>
|
|
|
<div class="lastNum start">
|
|
|
<!-- 涨跌值 -->
|
|
|
- <div :class="handleQuotePriceColor(selectedRow.last, selectedRow.presettle)"> {{ quoteChange(selectedRow, selectedRow.decimalplace) }}</div>
|
|
|
+ <div
|
|
|
+ :class="handleQuotePriceColor(selectedRow.last, selectedRow.presettle)"
|
|
|
+ >{{ quoteChange(selectedRow, selectedRow.decimalplace) }}</div>
|
|
|
<!-- 涨跌幅 -->
|
|
|
- <div class="ml20" :class="handleQuotePriceColor(selectedRow.last, selectedRow.presettle)"> {{ quoteAmplitude(selectedRow, selectedRow.decimalplace) }}</div>
|
|
|
+ <div
|
|
|
+ class="ml20"
|
|
|
+ :class="handleQuotePriceColor(selectedRow.last, selectedRow.presettle)"
|
|
|
+ >{{ quoteAmplitude(selectedRow, selectedRow.decimalplace) }}</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="priceBar ml20">
|
|
|
<div class="inlineBar start">
|
|
|
- <div class="greenBar green">
|
|
|
+ <div class="greenBar">
|
|
|
<div class="numBlock ml15">
|
|
|
- <div class="first">卖价</div>
|
|
|
- <div class="last" :class="handleQuotePriceColor(selectedRow.ask, selectedRow.presettle)"> {{ selectedRow.ask }}</div>
|
|
|
+ <div class="first grey">卖价</div>
|
|
|
+ <div
|
|
|
+ class="last"
|
|
|
+ :class="handleQuotePriceColor(selectedRow.ask, selectedRow.presettle)"
|
|
|
+ >{{ selectedRow.ask }}</div>
|
|
|
</div>
|
|
|
<div class="numBlock">
|
|
|
- <div class="first">卖量</div>
|
|
|
- <div class="last">{{ selectedRow.askvolume }}</div>
|
|
|
+ <div class="first grey">卖量</div>
|
|
|
+ <div
|
|
|
+ class="last"
|
|
|
+ :class="handleQuotePriceColor(selectedRow.ask, selectedRow.presettle)"
|
|
|
+ >{{ selectedRow.askvolume }}</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="inlineBar start">
|
|
|
- <div class="redBar red1">
|
|
|
+ <div class="redBar">
|
|
|
<div class="numBlock">
|
|
|
- <div class="first">买价</div>
|
|
|
- <div class="last" :class="handleQuotePriceColor(selectedRow.bid, selectedRow.presettle)"> {{ selectedRow.bid }}</div>
|
|
|
+ <div class="first grey">买价</div>
|
|
|
+ <div
|
|
|
+ class="last"
|
|
|
+ :class="handleQuotePriceColor(selectedRow.bid, selectedRow.presettle)"
|
|
|
+ >{{ selectedRow.bid }}</div>
|
|
|
</div>
|
|
|
<div class="numBlock">
|
|
|
- <div class="first">买量</div>
|
|
|
- <div class="last">{{ selectedRow.bidvolume }}</div>
|
|
|
+ <div class="first grey">买量</div>
|
|
|
+ <div
|
|
|
+ class="last"
|
|
|
+ :class="handleQuotePriceColor(selectedRow.bid, selectedRow.presettle)"
|
|
|
+ >{{ selectedRow.bidvolume }}</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
@@ -49,34 +69,30 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
<!-- 交易图表 -->
|
|
|
- <Chart v-if="showComponentsId === ComponentType.chart" @update="changeComponent" :selectedRow="selectedRow" />
|
|
|
+ <Chart
|
|
|
+ v-if="showComponentsId === ComponentType.chart"
|
|
|
+ @update="changeComponent"
|
|
|
+ :selectedRow="selectedRow"
|
|
|
+ />
|
|
|
<!-- 成交明细 -->
|
|
|
- <StockExchange :selectedRow="selectedRow" v-if="showComponentsId === ComponentType.tradeDetail" />
|
|
|
+ <StockExchange
|
|
|
+ :selectedRow="selectedRow"
|
|
|
+ v-if="showComponentsId === ComponentType.tradeDetail"
|
|
|
+ />
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
<script lang="ts">
|
|
|
-import { EnumRouterName } from '@/common/constants/enumRouterName';
|
|
|
-import { defineAsyncComponent, defineComponent, BtnList } from '@/common/export/commonTable';
|
|
|
+import { defineComponent } from '@/common/export/commonTable';
|
|
|
import { _closeModal } from '@/common/setup/modal/modal';
|
|
|
-import { WrOrderQuote } from '@/services/go/wrtrade/interface';
|
|
|
-import { LeftOutlined } from '@ant-design/icons-vue';
|
|
|
-import Buy from '../buy-market/index.vue';
|
|
|
-import Sell from '../sell-market/index.vue';
|
|
|
-import { handleModalComponent } from '@/common/setup/asyncComponent';
|
|
|
-import { onBeforeUnmount, onMounted, PropType, ref } from 'vue';
|
|
|
-
|
|
|
-import Bus from '@/utils/eventBus/index';
|
|
|
-import TimerUtils from '@/utils/timer/timerUtil';
|
|
|
-import { BtnListType } from '@/common/components/btnList/interface';
|
|
|
-import moment, { Moment } from 'moment';
|
|
|
+import { handleQuotePriceColor, handleSubcriteOnDemandQuote, quoteAmplitude, quoteAmplituOfVibration, quoteChange } from '@/common/setup/table/tableQuote';
|
|
|
import { QueryQuoteDayRsp } from '@/services/go/quote/interface';
|
|
|
-import { QueryDeliveryRelationRsp } from '@/services/go/delivery/interface';
|
|
|
-import StockExchange from './stock-exchange/index.vue';
|
|
|
-import { getQuoteDayInfoByCode } from '@/services/bus/goods';
|
|
|
+import { LeftOutlined } from '@ant-design/icons-vue';
|
|
|
+import { PropType, ref } from 'vue';
|
|
|
import Chart from './chart/index.vue';
|
|
|
import { ComponentType } from './setup';
|
|
|
-import { handleSubcriteOnDemandQuote, handleQuotePriceColor, quoteChange, quoteAmplitude, quoteAmplituOfVibration } from '@/common/setup/table/tableQuote';
|
|
|
+import StockExchange from './stock-exchange/index.vue';
|
|
|
+
|
|
|
|
|
|
export default defineComponent({
|
|
|
emits: ['cancel', 'update'],
|