update

src/common/setup/table/tableQuote.ts

@@ -1,3 +1,4 @@
+import { QueryQuoteDayRsp } from '@/services/go/quote/interface';
 import { addSubscribeQuotation, removeSubscribeQuotation } from '@/services/socket/quota';
 import TimerUtils from '@/utils/timer/timerUtil';
 import { v4 } from 'uuid';
@@ -10,7 +11,7 @@ import { onBeforeUnmount, onMounted, Ref, ref, watchEffect } from "vue";
  * @param itemTableHeight 表格每一行的高度
  * @param selector 当前的滚动区域的选择器
  */
-export function handleSubcriteQuote<T extends object>(tableList: Ref<T[]>, codeKey = 'goodscode', itemTableHeight = 35, selector = '.ant-table-body') {
+export function handleSubcriteQuote<T extends object>(tableList: Ref<T[]>, codeKey = 'goodscode', itemTableHeight = 31, selector = '.ant-table-body') {
     const beforeScrollTop = ref<number>(0)
     const uuid = v4();
     onMounted(() => {
@@ -87,18 +88,27 @@ export function handleSubcriteQuote<T extends object>(tableList: Ref<T[]>, codeK
     }
 }
 
+function isPrice(price1: number | string, price2: number | string) {
+    if (price2 && price2 !== '--' && price1 && price1 !== '--') {
+        return true
+    } else {
+        return false
+    }
+}
+
 /**
  * 处理行情价格颜色
  * @param price1
  * @param price2
  * @returns
  */
-export function handleQuotePriceColor(price1: number | string, price2: number | string) {
+export function handleQuotePriceColor(record: QueryQuoteDayRsp) {
+    const { presettle, bid } = record
     let result = ''
-    if (price2 && price2 !== '--' && price1 && price1 !== '--') {
-        if (price1 === price2) {
+    if (isPrice(bid, presettle)) {
+        if (bid === presettle) {
             result = ''
-        } else if (price1 > price2) {
+        } else if (bid > presettle) {
             result = 'up-quote-color'
         } else {
             result = 'down-quote-color'
@@ -108,10 +118,29 @@ export function handleQuotePriceColor(price1: number | string, price2: number |
 }
 
 // 涨跌 最新价 - 昨结价
-export function quoteChange(price1: number | string, price2: number | string, decimalplace = 2) {
+export function quoteChange(record: QueryQuoteDayRsp, decimalplace = 2) {
+    const { presettle, last } = record
     let result = '--'
-    if (price2 && price2 !== '--' && price1 && price1 !== '--') {
-        result = ((price1 as number) - (price2 as number)).toFixed(decimalplace)
+    if (isPrice(last, presettle)) {
+        result = (last - presettle).toFixed(decimalplace)
+    }
+    return result
+}
+
+// 幅度（最新价 - 昨结价） / 100 %
+export function quoteAmplitude(record: QueryQuoteDayRsp, decimalplace = 2) {
+    const result = quoteChange(record, decimalplace)
+    return result === '--' ? '--' : (+result / 100).toFixed(decimalplace) + '%'
+}
+
+// (最高价 - 最低价 ) / 最新价  * 100 %
+export function quoteAmplituOfVibration(record: QueryQuoteDayRsp, decimalplace = 2) {
+    const { highest, lowest, last } = record
+    let result = '--'
+    if (isPrice(highest, lowest)) {
+        if (last && (last as unknown as any) !== '--') {
+            result = ((highest - lowest) / last * 100).toFixed(decimalplace) + '%'
+        }
     }
     return result
 }

src/services/socket/quota/adapter/index.ts

@@ -162,8 +162,8 @@ export function parseReceivePush(quotationData: any) {
                 goodsQuoteTik.settle = goodsQuoteTik.settle ? (fn(goodsQuoteTik.settle)) : '--'
                 goodsQuoteTik.strikeprice = goodsQuoteTik.strikeprice ? (fn(goodsQuoteTik.strikeprice)) : '--'
 
-                !goodsQuoteTik.bidvolume && (goodsQuoteTik.bidvolume = '--')
-                !goodsQuoteTik.askvolume && (goodsQuoteTik.askvolume = '--')
+                // !goodsQuoteTik.bidvolume && (goodsQuoteTik.bidvolume = '--')
+                // !goodsQuoteTik.askvolume && (goodsQuoteTik.askvolume = '--')
                 !goodsQuoteTik.lastvolume && (goodsQuoteTik.lastvolume = '--')
                 !goodsQuoteTik.holdvolume && (goodsQuoteTik.holdvolume = '--')
                 !goodsQuoteTik.holdincrement && (goodsQuoteTik.holdincrement = '--')

src/views/market/spot_trade/spot_trade_reference_market/index.vue

@@ -14,12 +14,41 @@
       <template #totalturnover="{ text }">
         <span>{{changeUnit(text)}}</span>
       </template>
+      <!-- 涨跌 -->
+      <template #change="{ record }">
+        <span>{{quoteChange(record, record.decimalplace)}}</span>
+      </template>
+      <!-- 幅度 -->
+      <template #amplitude="{ record }">
+        <span>{{quoteAmplituOfVibration(record, record.decimalplace)}}</span>
+      </template>
+      <!-- 振幅 -->
+      <template #vibration="{ record }">
+        <span>{{quoteAmplituOfVibration(record, record.decimalplace)}}</span>
+      </template>
       <template #index="{ index }">
         <span>{{index + 1}}</span>
       </template>
+      <!-- 买价 -->
       <template #bid="{ text, record }">
         <span :class="handleQuotePriceColor(text, record.presettle)">{{text}}</span>
       </template>
+      <!-- 卖价 -->
+      <template #ask="{ text, record }">
+        <span :class="handleQuotePriceColor(text, record.presettle)">{{text}}</span>
+      </template>
+      <!-- 最新价 -->
+      <template #last="{ text, record }">
+        <span :class="handleQuotePriceColor(text, record.presettle)">{{text}}</span>
+      </template>
+      <!-- 最低价 -->
+      <template #lowest="{ text, record }">
+        <span :class="handleQuotePriceColor(text, record.presettle)">{{text}}</span>
+      </template>
+      <!-- 最高价 -->
+      <template #highest="{ text, record }">
+        <span :class="handleQuotePriceColor(text, record.presettle)">{{text}}</span>
+      </template>
     </a-table>
     <!-- 右键 -->
     <contextMenu :contextMenu="contextMenu"
@@ -40,7 +69,7 @@ import { QueryOrderQuoteReq } from '@/services/go/wrtrade/interface';
 import { queryOrderQuote } from '@/services/go/wrtrade';
 import { handleComposeTable } from '@/views/market/spot_trade/setup';
 import { ref } from 'vue';
-import { handleSubcriteQuote, handleQuotePriceColor } from '@/common/setup/table/tableQuote';
+import { handleSubcriteQuote, handleQuotePriceColor, quoteChange, quoteAmplitude, quoteAmplituOfVibration } from '@/common/setup/table/tableQuote';
 import { QueryDeliveryRelationRsp } from '@/services/go/delivery/interface';
 import { getGoodsListByTrade, getQutoGoodsByTradeMode } from '@/services/bus/goods';
 import { TradeMode } from '@/common/constants/enumCommon';
@@ -64,7 +93,7 @@ const columnsList = [
     { title: '昨结价', key: 'presettle' },
     { title: '最低价', key: 'lowest' },
     { title: '最高价', key: 'highest' },
-    { title: '振幅', key: 'goodscode' }, // (最高价 - 最低价 ) / 最新价  * 100 %
+    { title: '振幅', key: 'vibration' }, // (最高价 - 最低价 ) / 最新价  * 100 %
     { title: '总量', key: 'totalvolume' },
     { title: '现量', key: 'lastvolume' },
     { title: '持仓量', key: 'holdvolume' },
@@ -116,6 +145,9 @@ export default defineComponent({
             columns,
             changeUnit,
             handleQuotePriceColor,
+            quoteChange,
+            quoteAmplitude,
+            quoteAmplituOfVibration,
         };
     },
 });