update

src/hooks/echarts/candlestick/index.ts

@@ -1,4 +1,4 @@
-import { ref, computed, watch } from 'vue'
+import { ref, computed } from 'vue'
 //import { timerInterceptor } from '@/utils/timer'
 import { ChartCycleType } from '@/constants/chart'
 import { queryHistoryDatas } from '@/services/api/quote'
@@ -8,14 +8,13 @@ import { useOptions } from './options'
 import moment from 'moment'
 
 export function useCandlestickChart(goodscode: string) {
-    const futuresStore = useFuturesStore()
+    const { quoteWatch } = useFuturesStore()
     const { dataset, handleData, clearData, calcIndicator } = useDataset();
     const { options, initOptions, updateOptions } = useOptions(dataset);
 
     const loading = ref(false);
     const isEmpty = ref(true);
     const dataIndex = ref(-1); // 当前数据索引值
-    const quote = futuresStore.getQuote(goodscode); // 实时行情
 
     // 当前选中的数据项
     const selectedItem = computed(() => {
@@ -231,7 +230,7 @@ export function useCandlestickChart(goodscode: string) {
     }
 
     // 监听行情推送
-    watch(() => quote.value, (val) => {
+    quoteWatch(goodscode, (val) => {
         if (!loading.value && !isEmpty.value) {
             updateChart(val)
         }

src/hooks/echarts/smoothedline/index.ts

@@ -1,4 +1,4 @@
-import { ref, computed, watch } from 'vue'
+import { ref, computed } from 'vue'
 import { useFuturesStore } from '@/stores'
 import { formatDate } from '@/filters'
 import { queryHistoryTikDatas } from '@/services/api/quote'
@@ -6,14 +6,13 @@ import { useDataset } from './dataset'
 import { useOptions } from './options'
 
 export function useSmoothedLineChart(goodscode: string) {
-    const futuresStore = useFuturesStore()
+    const { quoteWatch } = useFuturesStore()
     const { dataset, clearData } = useDataset()
     const { options, initOptions, updateOptions } = useOptions(dataset)
 
     const loading = ref(false)
     const isEmpty = ref(false)
     const dataIndex = ref(-1); // 当前数据索引值
-    const quote = futuresStore.getQuote(goodscode) // 实时行情
 
     // 当前选中的数据项
     const selectedItem = computed(() => {
@@ -56,7 +55,7 @@ export function useSmoothedLineChart(goodscode: string) {
     }
 
     // 监听行情推送
-    watch(() => quote.value, ({ last, lasttime }) => {
+    quoteWatch(goodscode, ({ last, lasttime }) => {
         if (!loading.value && last) {
             const { date, price } = dataset.line.source
             date.push(formatDate(lasttime, 'HH:mm:ss'))

src/hooks/echarts/timeline/index.ts

@@ -1,4 +1,4 @@
-import { ref, computed, watch } from 'vue'
+import { ref, computed } from 'vue'
 //import { timerInterceptor } from '@/utils/timer'
 import { queryTSData } from '@/services/api/quote'
 import { useFuturesStore } from '@/stores'
@@ -7,14 +7,13 @@ import { useOptions } from './options'
 import moment from 'moment'
 
 export function useTimelineChart(goodscode: string) {
-    const futuresStore = useFuturesStore()
+    const { quoteWatch } = useFuturesStore()
     const { dataset, handleData, clearData, calcIndicator } = useDataset()
     const { options, initOptions, updateOptions } = useOptions(dataset)
 
     const loading = ref(false)
     const isEmpty = ref(false)
     const dataIndex = ref(-1) // 当前数据索引值
-    const quote = futuresStore.getQuote(goodscode) // 实时行情
 
     // 当前选中的数据项
     const selectedItem = computed(() => {
@@ -101,7 +100,7 @@ export function useTimelineChart(goodscode: string) {
     }
 
     // 监听行情推送
-    watch(() => quote.value, (val) => {
+    quoteWatch(goodscode, (val) => {
         if (!loading.value && !isEmpty.value) {
             updateChart(val)
         }

src/packages/mobile/components/modules/quote/forex/index.vue

@@ -37,7 +37,6 @@
 import { shallowRef, computed, useAttrs } from 'vue'
 import { Icon } from 'vant'
 import { handleNumberValue } from '@/filters'
-import { useNavigation } from '../../../../router/navigation'
 import { BuyOrSell } from '@/constants/order'
 import { useFuturesStore } from '@/stores'
 
@@ -53,7 +52,6 @@ const props = defineProps({
 })
 
 const emit = defineEmits<{ (event: string, ...args: unknown[]): void }>()
-const { router } = useNavigation()
 const attrs = useAttrs()
 const futuresStore = useFuturesStore()
 const quote = computed(() => futuresStore.getGoodsQuote(props.goodsCode).value)

src/packages/mobile/views/transfer/listing/Index.vue

@@ -60,7 +60,7 @@ import { useOrder } from '@/business/trade'
 import { useAccountStore, useFuturesStore } from '@/stores'
 import AppModal from '@/components/base/modal/index.vue'
 import { BuyOrSell } from '@/constants/order'
-import { EPriceMode, EValidType, EListingSelectType, EBuildType } from '@/constants/client'
+import { EPriceMode, EValidType, EListingSelectType, EBuildType, EDelistingType } from '@/constants/client'
 
 const Price = defineAsyncComponent(() => import('../../../components/modules/quote/price/index.vue'))
 const Forex = defineAsyncComponent(() => import('../../../components/modules/quote/forex/index.vue'))
@@ -149,6 +149,7 @@ const onSubmit = () => {
     formData.PriceMode = EPriceMode.PRICEMODE_LIMIT
     formData.ListingSelectType = EListingSelectType.LISTINGSELECTTYPE_DELISTINGTHENLISTING
     formData.BuildType = props.buyOrSell === BuyOrSell.Sell ? EBuildType.BUILDTYPE_CLOSE : EBuildType.BUILDTYPE_OPEN
+    formData.DelistingType = EDelistingType.DELISTINGTYPE_PRICE
 
     fullloading((hideLoading) => {
         formSubmit().then(() => {

src/packages/pc/components/modules/quote/tik/index.vue

@@ -19,7 +19,7 @@
 </template>
 
 <script lang="ts" setup>
-import { ref, watch } from 'vue'
+import { ref } from 'vue'
 import { formatDate, handleNumberValue, handlePriceColor, formatDecimal } from '@/filters'
 import { useRequest } from '@/hooks/request'
 import { queryHistoryTikDatas, queryMarketRun } from '@/services/api/market'
@@ -32,9 +32,8 @@ const props = defineProps({
     },
 })
 
-const futuresStore = useFuturesStore()
-const quoteDay = futuresStore.getGoodsQuote(props.goodsCode)
-const quote = futuresStore.getQuote(props.goodsCode)
+const { getGoodsQuote, quoteWatch } = useFuturesStore()
+const quoteDay = getGoodsQuote(props.goodsCode)
 const dataList = ref<Model.HistoryTikDatasRsp[]>([])
 
 const { run: getHistoryTikDatas } = useRequest(queryHistoryTikDatas, {
@@ -63,8 +62,9 @@ useRequest(queryMarketRun, {
     }
 })
 
-watch(() => quote.value, (q) => {
-    const { last = 0, lasttime = '', lastvolume = 0 } = q
+// 监听行情推送
+quoteWatch(props.goodsCode, (quote) => {
+    const { last = 0, lasttime = '', lastvolume = 0 } = quote as Partial<Model.QuoteDayRsp>
     if (last && lastvolume) {
         const list = dataList.value
         if (list.length > 19) {

src/stores/modules/futures.ts

@@ -1,4 +1,5 @@
-import { reactive, computed, toRefs } from 'vue'
+import { reactive, computed, toRefs, onUnmounted } from 'vue'
+import { v4 } from 'uuid'
 import { handlePriceColor } from '@/filters'
 import { queryErmcpGoods, queryQuoteDay } from '@/services/api/goods'
 import { defineStore } from '../store'
@@ -11,10 +12,12 @@ import moment from 'moment'
  * @returns 
  */
 export const useFuturesStore = defineStore(() => {
+    // 行情监听集合
+    const quoteWatchMap = new Map<string, { keys: string[]; callback: (value: Partial<Model.QuoteDayRsp>) => void; }>()
+
     const state = reactive({
         loading: false,
         goodsList: <Model.GoodsRsp[]>[], // 商品列表
-        quotes: <Partial<Model.QuoteDayRsp>[]>[], // 行情数据
         goodsQuoteList: <Model.GoodsQuote[]>[], // 商品行情列表
     })
 
@@ -60,16 +63,6 @@ export const useFuturesStore = defineStore(() => {
         })
     }
 
-    // 通过 goodscode 获取实时行情
-    const getQuote = (goodsCode: string) => {
-        return computed(() => {
-            const quote = state.quotes.find((e) => e.goodscode === goodsCode)
-            return {
-                ...quote
-            }
-        })
-    }
-
     // 获取商品名称
     const getGoodsName = (code: string | number) => {
         const quote = state.goodsList.find((e) => e.goodscode === code || e.goodsid === code)
@@ -82,20 +75,48 @@ export const useFuturesStore = defineStore(() => {
         return quote?.marketid ?? 0
     }
 
+    // 监听行情推送
+    const quoteWatch = (goodsCodes: string | string[], callback: (value: Partial<Model.QuoteDayRsp>) => void) => {
+        const uuid = v4()
+
+        quoteWatchMap.set(uuid, {
+            keys: Array.isArray(goodsCodes) ? goodsCodes : [goodsCodes],
+            callback
+        })
+
+        const append = (...goodsCodes: string[]) => {
+            const value = quoteWatchMap.get(uuid)
+            value?.keys.push(...goodsCodes)
+        }
+
+        const stop = () => {
+            quoteWatchMap.delete(uuid)
+        }
+
+        // 页面离开时停止监听事件，防止事件重复触发
+        onUnmounted(() => stop())
+
+        return {
+            uuid,
+            append,
+            stop
+        }
+    }
+
     // 接收行情推送通知
     const quotePushNotify = eventBus.$on('QuotePushNotify', (res) => {
         const data = res as Proto.Quote[]
         data.forEach((item) => {
             const quote = handleQuote(item)
-            const index = state.quotes.findIndex((e) => e.goodscode === item.goodscode)
-            if (index > -1) {
-                state.quotes[index] = quote
-            } else {
-                state.quotes.push(quote)
-            }
             if (!state.loading) {
                 updateGoodsQuote(quote)
             }
+            // 触发行情监听事件
+            for (const e of quoteWatchMap.values()) {
+                if (e.keys.includes(item.goodscode ?? '')) {
+                    e.callback(quote)
+                }
+            }
         })
     })
 
@@ -303,13 +324,13 @@ export const useFuturesStore = defineStore(() => {
 
     return {
         ...toRefs(state),
-        getQuote,
         getQuotePrice,
         getGoodsList,
         getGoodsQuote,
         getGoodsName,
         getGoodsMarket,
         updateGoodsQuote,
+        quoteWatch,
         quotePushNotify,
     }
 })