|
|
@@ -20,21 +20,30 @@
|
|
|
<th>高/低</th>
|
|
|
</tr>
|
|
|
</thead>
|
|
|
- <tbody>
|
|
|
- <tr v-for="(item, index) in touristTradeGoodsList" :key="index" @click="rowClick(item)">
|
|
|
- <td>{{ item.goodsname }}</td>
|
|
|
- <td :class="item.bidColor">{{ handleNumberValue(formatDecimal(item.bid, item.decimalplace)) }}</td>
|
|
|
- <td :class="item.askColor">{{ handleNumberValue(formatDecimal(item.ask, item.decimalplace)) }}</td>
|
|
|
- <td>
|
|
|
- <span :class="item.highestColor">
|
|
|
- {{ handleNumberValue(formatDecimal(item.highest, item.decimalplace)) }}
|
|
|
- </span>
|
|
|
- <span :class="item.lowestColor">
|
|
|
- {{ handleNumberValue(formatDecimal(item.lowest, item.decimalplace)) }}
|
|
|
- </span>
|
|
|
- </td>
|
|
|
- </tr>
|
|
|
- </tbody>
|
|
|
+ <template v-for="group in touristTradeGoodsList" :key="group.groupId">
|
|
|
+ <thead v-if="touristTradeGoodsList.length > 1">
|
|
|
+ <tr>
|
|
|
+ <th class="title" colspan="4">{{ group.groupName }}</th>
|
|
|
+ </tr>
|
|
|
+ </thead>
|
|
|
+ <tbody>
|
|
|
+ <tr v-for="(item, index) in group.goodsList" :key="index" @click="rowClick(item)">
|
|
|
+ <td>{{ item.goodsname }}</td>
|
|
|
+ <td :class="item.bidColor">{{ handleNumberValue(formatDecimal(item.bid, item.decimalplace)) }}
|
|
|
+ </td>
|
|
|
+ <td :class="item.askColor">{{ handleNumberValue(formatDecimal(item.ask, item.decimalplace)) }}
|
|
|
+ </td>
|
|
|
+ <td>
|
|
|
+ <span :class="item.highestColor">
|
|
|
+ {{ handleNumberValue(formatDecimal(item.highest, item.decimalplace)) }}
|
|
|
+ </span>
|
|
|
+ <span :class="item.lowestColor">
|
|
|
+ {{ handleNumberValue(formatDecimal(item.lowest, item.decimalplace)) }}
|
|
|
+ </span>
|
|
|
+ </td>
|
|
|
+ </tr>
|
|
|
+ </tbody>
|
|
|
+ </template>
|
|
|
<thead>
|
|
|
<tr>
|
|
|
<th class="title" colspan="4">参考商品</th>
|
|
|
@@ -103,7 +112,28 @@ useRequest(queryImageConfigs, {
|
|
|
// 构建游客交易商品
|
|
|
const touristTradeGoodsList = computed(() => {
|
|
|
const list = futuresStore.getGoodsListByTradeMode(52)
|
|
|
- return list.sort((a, b) => a.goodsorder.localeCompare(b.goodsorder))
|
|
|
+ const result = list.sort((a, b) => a.goodsorder.localeCompare(b.goodsorder))
|
|
|
+
|
|
|
+ // 分组
|
|
|
+ return result.reduce<{
|
|
|
+ groupId: number;
|
|
|
+ groupName: string;
|
|
|
+ goodsList: Model.GoodsQuote[]
|
|
|
+ }[]>((pre, cur) => {
|
|
|
+ const existingGroup = pre.find((e) => e.groupId === cur.goodsgroupid)
|
|
|
+
|
|
|
+ if (existingGroup) {
|
|
|
+ existingGroup.goodsList.push(cur)
|
|
|
+ } else {
|
|
|
+ pre.push({
|
|
|
+ groupId: cur.goodsgroupid,
|
|
|
+ groupName: cur.goodsgroupname,
|
|
|
+ goodsList: [cur]
|
|
|
+ })
|
|
|
+ }
|
|
|
+
|
|
|
+ return pre
|
|
|
+ }, [])
|
|
|
})
|
|
|
|
|
|
// 构建游客参考行情商品
|
|
|
@@ -178,7 +208,7 @@ const { dataList: marketList, run: marketRun } = useRequest(queryMarketRun, {
|
|
|
// 市场信息
|
|
|
const marketInfo = computed(() => {
|
|
|
const [firstMarket] = touristTradeGoodsList.value
|
|
|
- return marketList.value.find((e) => e.marketid === firstMarket?.marketid)
|
|
|
+ return marketList.value.find((e) => e.marketid === firstMarket?.goodsList[0].marketid)
|
|
|
})
|
|
|
|
|
|
// 校验服务器时间
|