|
|
@@ -5,6 +5,14 @@
|
|
|
:style="'--header-bg:url(\'../img/market-title-bg.jpg\')'" />
|
|
|
</template>
|
|
|
<table class="market-table" cellspacing="0" cellpadding="0">
|
|
|
+ <thead v-if="market">
|
|
|
+ <tr>
|
|
|
+ <th class="servertime" colspan="4">
|
|
|
+ {{ serverTime?.format('YYYY-MM-DD HH:mm:ss') }}
|
|
|
+ {{ [2, 6].includes(market.runstatus) ? getRunStatusName(market.runstatus) : '未开盘' }}
|
|
|
+ </th>
|
|
|
+ </tr>
|
|
|
+ </thead>
|
|
|
<thead>
|
|
|
<tr>
|
|
|
<th>商品</th>
|
|
|
@@ -53,18 +61,27 @@
|
|
|
</template>
|
|
|
|
|
|
<script lang="ts" setup>
|
|
|
-import { shallowRef, computed, onActivated, onDeactivated } from 'vue'
|
|
|
+import { shallowRef, computed, onActivated, onDeactivated, ref, onMounted, onUnmounted } from 'vue'
|
|
|
+import moment, { Moment } from 'moment'
|
|
|
+import { getServerTime } from '@/services/api/common'
|
|
|
import { handleNumberValue, formatDecimal } from '@/filters'
|
|
|
import { useNavigation } from '@mobile/router/navigation'
|
|
|
-import quoteSocket from '@/services/websocket/quote'
|
|
|
import { queryTouristGoods, queryTouristQuoteDay } from '@/services/api/goods'
|
|
|
import { useFuturesStore, useLoginStore } from '@/stores'
|
|
|
+import { timerTask } from '@/utils/timer'
|
|
|
+import { useRequest } from '@/hooks/request'
|
|
|
+import { getRunStatusName } from '@/constants/market'
|
|
|
+import { queryMarketRun } from '@/services/api/market'
|
|
|
+import quoteSocket from '@/services/websocket/quote'
|
|
|
|
|
|
const { router } = useNavigation()
|
|
|
const futuresStore = useFuturesStore()
|
|
|
const loginStore = useLoginStore()
|
|
|
const subscribe = quoteSocket.createSubscribe()
|
|
|
-const subscribeData = shallowRef<string[]>([]) // 订阅的商品代码
|
|
|
+// 订阅的商品代码
|
|
|
+const subscribeData = shallowRef<string[]>([])
|
|
|
+// 系统时间
|
|
|
+const serverTime = ref<Moment>()
|
|
|
|
|
|
// 构建游客交易商品
|
|
|
const touristTradeGoodsList = computed(() => {
|
|
|
@@ -87,6 +104,17 @@ const rowClick = (row: Model.GoodsQuote) => {
|
|
|
})
|
|
|
}
|
|
|
|
|
|
+// 校验服务器时间
|
|
|
+const checkServerTime = () => {
|
|
|
+ getServerTime().then((res) => {
|
|
|
+ serverTime.value = moment.parseZone(res.data)
|
|
|
+ // 每1分钟同步一次服务器时间
|
|
|
+ timerTask.setTimeout(() => {
|
|
|
+ checkServerTime()
|
|
|
+ }, 60 * 1000, 'getServerTime')
|
|
|
+ })
|
|
|
+}
|
|
|
+
|
|
|
if (loginStore.token) {
|
|
|
futuresStore.onDataCompleted(() => {
|
|
|
subscribeData.value = futuresStore.goodsList.map((e) => e.goodscode)
|
|
|
@@ -113,8 +141,36 @@ if (loginStore.token) {
|
|
|
})
|
|
|
}
|
|
|
|
|
|
+const { data: market, run: marketRun } = useRequest(queryMarketRun, {
|
|
|
+ params: {
|
|
|
+ marketID: touristTradeGoodsList.value[0].marketid
|
|
|
+ },
|
|
|
+ onSuccess: (res) => {
|
|
|
+ market.value = res.data[0]
|
|
|
+ // 每1分钟轮询刷新
|
|
|
+ timerTask.setTimeout(() => marketRun(), 60 * 1000, 'getMarketRun')
|
|
|
+ }
|
|
|
+})
|
|
|
+
|
|
|
+onMounted(() => {
|
|
|
+ serverTime.value = moment(new Date())
|
|
|
+ //
|
|
|
+ checkServerTime()
|
|
|
+ /// 获取市场运行情况
|
|
|
+ marketRun()
|
|
|
+ timerTask.setInterval(() => {
|
|
|
+ serverTime.value = moment(serverTime.value).add(1000, 'ms')
|
|
|
+ }, 1000, 'refreshTime')
|
|
|
+})
|
|
|
+
|
|
|
onActivated(() => subscribeData.value.length && subscribe.start(...subscribeData.value))
|
|
|
onDeactivated(() => subscribe.stop())
|
|
|
+
|
|
|
+onUnmounted(() => {
|
|
|
+ timerTask.clearInterval('refreshTime')
|
|
|
+ timerTask.clearTimeout('getServerTime')
|
|
|
+ timerTask.clearTimeout('getMarketRun')
|
|
|
+})
|
|
|
</script>
|
|
|
|
|
|
<style lang="less">
|