新增 现货市场 动态市场板块配置

src/common/components/firstMenu/index.vue

@@ -1,6 +1,12 @@
 <template>
     <div class="first-menu">
-        <a-menu class="a-menu_container" theme="dark" v-model:selectedKeys="current" @click="menuClick" mode="horizontal">
+        <a-menu
+            class="a-menu_container"
+            theme="dark"
+            v-model:selectedKeys="current"
+            @click="menuClick"
+            mode="horizontal"
+        >
             <a-menu-item :key="String(index)" v-for="(item, index) in list">{{ item[value] }}</a-menu-item>
         </a-menu>
         <div class="menu_right">

src/common/setup/table/tableQuote.ts

@@ -1,8 +1,9 @@
+import { getGoodsDecimalplaceByGoodsCode, getQuoteDayInfoByCode } from '@/services/bus/goods';
 import { QueryQuoteDayRsp } from '@/services/go/quote/interface';
 import { addSubscribeQuotation, removeSubscribeQuotation } from '@/services/socket/quota';
 import TimerUtils from '@/utils/timer/timerUtil';
 import { v4 } from 'uuid';
-import { onBeforeUnmount, onMounted, Ref, ref, watchEffect, nextTick } from "vue";
+import { nextTick, onBeforeUnmount, onMounted, Ref, ref, watchEffect } from "vue";
 
 /**
  * 订阅商品行情
@@ -225,7 +226,21 @@ export function handleQuotePriceColor(value: number, presettle: number) {
     }
     return result
 }
+// 外部行情 获取某个值
+export function getQuoteValue_out(goodscode: string, val: keyof QueryQuoteDayRsp) {
+    const obj = getQuoteDayInfoByCode(goodscode)
+    return obj ? obj[val] : '--'
+}
 
+// 外部行情  处理行情价格颜色
+export function handleQuotePriceColor_out(goodscode: string, val: keyof QueryQuoteDayRsp) {
+    const obj = getQuoteDayInfoByCode(goodscode)
+    let result = ''
+    if (obj) {
+        result = handleQuotePriceColor(obj[val] as number, obj.presettle)
+    }
+    return result
+}
 // 涨跌额/涨跌 最新价 - 昨结价
 export function quoteChange<T>(record: T, decimalplace = 2) {
     type Key = keyof T;
@@ -255,7 +270,26 @@ export function quoteAmplitude<T>(record: T, decimalplace = 2) {
     }
     return '--';
 }
-
+// 外部行情 幅度（最新价 - 昨结价） / 昨结价） *  100 %
+export function quoteAmplitude_out(goodscode: string) {
+    const obj = getQuoteDayInfoByCode(goodscode)
+    let result = '--'
+    // const decimalplace = getGoodsDecimalplaceByGoodsCode(goodscode)
+    if (obj) {
+        result = quoteAmplitude(obj, 2)
+    }
+    return result
+}
+// 外部行情 涨跌 最新价 - 昨结价
+export function quoteChange_out(goodscode: string) {
+    const obj = getQuoteDayInfoByCode(goodscode)
+    let result = '--'
+    const decimalplace = getGoodsDecimalplaceByGoodsCode(goodscode)
+    if (obj) {
+        result = quoteChange(obj, decimalplace)
+    }
+    return result
+}
 // 振幅 (最高价 - 最低价 ) / 最新价  * 100 %
 export function quoteAmplituOfVibration(record: QueryQuoteDayRsp, decimalplace = 2) {
     const { highest, lowest, last } = record
@@ -271,4 +305,5 @@ export function quoteAmplituOfVibration(record: QueryQuoteDayRsp, decimalplace =
 // 处理 空值  或者 0的时候，显示 --  的情况，
 export function handleNoneValue(value: number | string) {
     return value ? value : '--'
-}
+}
+

src/layout/components/menu.vue

@@ -104,10 +104,10 @@ export default defineComponent({
           secondeIndex = 0;
         for (let i = 0; i < list.length; i++) {
           for (let j = 0; j < list[i].children.length; j++) {
-            if (matched[1].name === 'dymanicMarket') {
+            debugger
+            if (matched[1].name === 'marketSpot') {
               // 处理动态市场 刷新问题
-              const code = 'market-' + route.query.id
-              if (code === list[i].children[j].code) {
+              if (list[i].children[j].code === 'market_spot') {
                 firstIndex = i;
                 secondeIndex = j;
                 break

src/layout/components/top.vue

@@ -22,17 +22,17 @@
     </a-layout>
 </template>
 <script lang="ts">
-import { defineComponent, ref, provide } from 'vue';
-
 import CapitalInfo from '@/common/components/capitalInfo/index.vue';
+import Drawer from '@/common/components/drawer/index.vue';
 import SecondMenu from '@/common/components/secondeMenu/index.vue';
+import { getHasBottom } from '@/common/setup/order/orderData';
+import { OperationTabMenu } from '@/services/go/commonService/interface';
+import { defineComponent, provide, ref } from 'vue';
 import { useRoute, useRouter } from 'vue-router';
-import Drawer from '@/common/components/drawer/index.vue';
 import Header from './header.vue';
-import Menu from './menu.vue';
 import Main from './main.vue';
-import { OperationTabMenu } from '@/services/go/commonService/interface';
-import { getHasBottom } from '@/common/setup/order/orderData';
+import Menu from './menu.vue';
+
 
 export default defineComponent({
     name: 'layout-top',
@@ -71,15 +71,14 @@ export default defineComponent({
 
             if (temp === 'home') {
                 // 第一次进入项目
-                if (value?.children.length) {
+                if (value?.code === 'market_spot') {
+                    // 现货市场
+                    router.push({ name: 'marketSpot' });
+                    return
+                } else if (value?.children.length) {
                     // 默认第一个tab页
                     name = value.children[0].code;
                     index.value = ['0'];
-                } else if (value?.code.includes('market-')) {
-                    // 动态市场
-                    const param = value.code.split('-')
-                    router.push({ name: 'dymanicMarket', query: { id: param[1] } });
-                    return
                 } else {
                     router.push({ name: '404' });
                     return;
@@ -88,10 +87,9 @@ export default defineComponent({
                 // 这里处理页面刷新，还原 导航栏数据
                 const i = value.children.findIndex((e) => e.code === temp);
                 if (i === -1) {
-                    if (value?.code.includes('market-')) {
-                        // 动态市场
-                        const param = value.code.split('-')
-                        router.push({ name: 'dymanicMarket', query: { id: param[1] } });
+                    if (value?.code === 'market_spot') {
+                        // 现货市场
+                        router.push({ name: 'marketSpot' });
                         return
                     } else if (value?.children.length) {
                         // 切换左边菜单栏

src/router/index.ts

@@ -38,10 +38,10 @@ const routes: Array<RouteRecordRaw> = [
                 component: () => import('@/views/home.vue'),
             },
             {
-                path: '/dymanicMarket/',
-                name: 'dymanicMarket',
-                component: () => import('@/views/market/index.vue'),
-                props: route => ({ id: route.query.id })
+                path: '/market-spot/',
+                name: 'marketSpot',
+                component: () => import('@/views/market/market-spot/index.vue'),
+                // props: route => ({ id: route.query.id })
             },
         ],
     },

src/services/bus/goods.ts

@@ -209,4 +209,10 @@ export function getGoodsQuoteList(exchangeId?: number): GoodsQuote[] {
         }
         return item;
     })
+}
+
+// 通过 goodscode 获取商品小数位
+export function getGoodsDecimalplaceByGoodsCode(goodscode: string) {
+    const obj = getGoodsByCode(goodscode)
+    return obj ? obj.decimalplace : 1
 }

src/services/bus/index.ts

@@ -40,8 +40,7 @@ export async function globalDataRefresh(): Promise<string> {
                 // token校验成功 马上轮询
                 checkTokenLoop();
                 await LoginQuery()
-                await Promise.all([GetErmcpGoods(), GetPCMenus(), QueryTableDefine(), QueryDeliveryGoodsDetail(), getTaAccount(), queryMarketRun()])
-                await queryTjmdMarketSection()
+                await Promise.all([GetErmcpGoods(), GetPCMenus(), QueryTableDefine(), QueryDeliveryGoodsDetail(), getTaAccount(), queryMarketRun(), queryTjmdMarketSection()])
                 const marketInfo = getMarketByTradeMode(TradeMode.WarehouseReceiptTrade);
                 if (marketInfo) {
                     await queryWrMarketTradeConfig({ marketid: marketInfo.marketid })

src/services/bus/login.ts

@@ -29,8 +29,7 @@ export const login = async (logidCode: string, password: string, byteArr: Uint8A
         // localstorage 缓存登录信息，处理页面刷新
         setLoginData(loginData);
         await LoginQuery()
-        await Promise.all([GetErmcpGoods(), GetPCMenus(), QueryTableDefine(), getServerTime(), QueryDeliveryGoodsDetail(), getTaAccount(), queryMarketRun()])
-        await queryTjmdMarketSection()
+        await Promise.all([GetErmcpGoods(), GetPCMenus(), QueryTableDefine(), getServerTime(), QueryDeliveryGoodsDetail(), getTaAccount(), queryMarketRun(), queryTjmdMarketSection()])
         const marketInfo = getMarketByTradeMode(TradeMode.WarehouseReceiptTrade);
         if (marketInfo) {
             await queryWrMarketTradeConfig({ marketid: marketInfo.marketid })

src/services/go/Tjmd/index.ts

@@ -1,7 +1,5 @@
 import APP from '@/services';
 import { commonSearch_go } from "@/services/go";
-import { localStorageUtil } from '@/utils/storage';
-import { OperationTabMenu } from '../commonService/interface';
 import * as type from './interface';
 
 /**
@@ -40,64 +38,13 @@ export function queryTjmdTransferApply(req: type.QueryTjmdTransferApplyReq): Pro
     });
 }
 
-function addMarketToMenu(markets: type.TjmdMarketSection[]) {
-    // 菜单JSON配置数据
-    const menus = localStorageUtil.getItem('menus')
-    const list = (menus ? menus : []) as OperationTabMenu[];
-    // 处理 市场配置
-    // 一开始市场是配置在菜单JSON里的，但后面修改为根据接口返回市场信息
-    // 此处为了兼容以前代码，如果在菜单json里没有找到市场配置，则创建一个新的市场配置
-    // 后续 应该根据服务返回，而不是前端在json里配置
-    let marketMenu = list.find(el => el.code === "market")
-    let hasMarketMenu = true
-    if (!marketMenu) {
-        hasMarketMenu = false
-        marketMenu = {
-            auth: [],
-            children: [],
-            code: "market",
-            component: "Layout",
-            path: "/market",
-            remark: "",
-            sort: 1,
-            title: "市场",
-            url: "",
-        }
-    }
-    // 市场板块
-    const marketsSection = markets.map(({ marketsectionname, marketsectionid, remark }) => {
-        return {
-            auth: [],
-            children: [],
-            code: `market-${marketsectionid}`, // code: （market- + 市场板块的id）
-            component: "Layout",
-            path: `market-${marketsectionid}`,
-            remark,
-            sort: 1,
-            title: marketsectionname,
-            url: "",
-        }
-    })
-    marketMenu.children = [...marketMenu.children, ...marketsSection]
-
-    // 菜单jsonm 没有 配置市场
-    if (!hasMarketMenu) {
-        list.unshift(marketMenu)
-    }
-    localStorageUtil.setItem('menus', list)
-    APP.set('menus', list);
-}
-
 
 /**
  * 查询市场板块  /Tjmd/QueryTjmdMarketSection
  */
 export function queryTjmdMarketSection(): Promise<string> {
     return commonSearch_go('/Tjmd/QueryTjmdMarketSection', {}).then(res => {
-        addMarketToMenu(res)
         console.log('查询市场板块:  ', res)
-        const list = localStorageUtil.getItem('menus');
-        console.log('菜单', list)
         APP.set('marketsSection', res);
         return 'ok'
     }).catch((err) => {

src/views/market/index.vue

@@ -1,33 +0,0 @@
-<template>
-  <div class="home">
-    市场
-  </div>
-</template>
-
-<script lang="ts">
-import { defineComponent } from 'vue';
-
-export default defineComponent({
-    components: {},
-    props: {
-      id: {
-        type: String,
-        default: ''
-      }
-    },
-    setup(props) {
-        console.log(props.id)
-        return {};
-    },
-});
-</script>
-
-<style lang="less">
-.home {
-    .withus {
-        cursor: pointer;
-        margin-top: 35px;
-        padding-bottom: 25px;
-    }
-}
-</style>

src/views/market/market-spot/compoments/spot_trade_order_transaction/index.vue

@@ -0,0 +1,229 @@
+<template>
+    <!--订单交易 商品掉期-->
+    <div class="topTableHeight">
+        <div class="filterTable">
+            <div class="filter-custom-table">
+                <a-select
+                    class="conditionSelect"
+                    :style="{ width: '180px', maxHeight: '400px', overflow: 'auto' }"
+                    @change="goodsChange"
+                    placeholder="全部标的合约"
+                >
+                    <a-select-option
+                        v-for="item in getRefGoodsList()"
+                        :value="item"
+                        :key="item"
+                    >{{ item }}</a-select-option>
+                </a-select>
+                <!-- <a-button class="btnDeafault"
+                @click="search(true)"
+                style="width: 80px">筛选</a-button>-->
+            </div>
+        </div>
+        <a-table
+            :columns="columns"
+            :class="['srcollYTable', isBottom ? 'secondTabTable' : 'secondTabTableNoBottom', goodsList.length ? 'noPlaceHolder' : 'hasPlaceHolder']"
+            :scroll="{ x: '100%', y: isBottom ? 'calc(100vh- 407px)' : 'calc(100vh - 167px)' }"
+            :pagination="false"
+            :loading="loading"
+            :expandedRowKeys="expandedRowKeys"
+            :customRow="Rowclick"
+            rowKey="refgoodscode"
+            ref="tableRef"
+            :data-source="goodsList"
+        >
+            <!-- <template #totalturnover="{ text }">
+        <span>{{changeUnit(text)}}</span>
+            </template>-->
+            <!-- 涨跌 -->
+            <template #change="{ record }">
+                <span
+                    :class="handleQuotePriceColor_out(record.refgoodscode, 'last')"
+                >{{ quoteChange_out(record.refgoodscode) }}</span>
+            </template>
+            <!-- 幅度 -->
+            <template #amplitude="{ record }">
+                <span
+                    :class="handleQuotePriceColor_out(record.refgoodscode, 'last')"
+                >{{ quoteAmplitude_out(record.refgoodscode) }}</span>
+            </template>
+            <!-- 振幅 -->
+            <template #vibration="{ record }">
+                <span>{{ quoteAmplituOfVibration(record, record.decimalplace) }}</span>
+            </template>
+            <template #index="{ index }">
+                <span>{{ index + 1 }}</span>
+            </template>
+            <!-- 买价 -->
+            <!-- <template #bid="{ record }">
+        <span :class="handleQuotePriceColor_out(record.refgoodscode, 'bid')">
+          {{getQuoteValue_out(record.refgoodscode, 'bid')}}</span>
+            </template>-->
+            <!-- 卖价 -->
+            <!-- <template #ask="{  record }">
+        <span :class="handleQuotePriceColor_out(record.refgoodscode, 'ask')">
+          {{getQuoteValue_out(record.refgoodscode, 'ask')}}</span>
+            </template>-->
+            <!-- 最新价 -->
+            <template #last="{ record }">
+                <span
+                    :class="handleQuotePriceColor_out(record.refgoodscode, 'last')"
+                >{{ getQuoteValue_out(record.refgoodscode, 'last') }}</span>
+            </template>
+            <!-- 开盘 -->
+            <template #opened="{ record }">
+                <span
+                    :class="handleQuotePriceColor_out(record.refgoodscode, 'opened')"
+                >{{ getQuoteValue_out(record.refgoodscode, 'opened') }}</span>
+            </template>
+            <!-- 结算 -->
+            <template #settle="{ record }">
+                <span
+                    :class="handleQuotePriceColor_out(record.refgoodscode, 'settle')"
+                >{{ getQuoteValue_out(record.refgoodscode, 'settle') }}</span>
+            </template>
+            <!-- 昨结算 -->
+            <template #presettle="{ record }">
+                <span>{{ getQuoteValue_out(record.refgoodscode, 'presettle') }}</span>
+            </template>
+            <!-- 最低价 -->
+            <template #lowest="{ record }">
+                <span
+                    :class="handleQuotePriceColor_out(record.refgoodscode, 'lowest')"
+                >{{ getQuoteValue_out(record.refgoodscode, 'lowest') }}</span>
+            </template>
+            <!-- 最高价 -->
+            <template #highest="{ record }">
+                <span
+                    :class="handleQuotePriceColor_out(record.refgoodscode, 'highest')"
+                >{{ getQuoteValue_out(record.refgoodscode, 'highest') }}</span>
+            </template>
+        </a-table>
+        <!-- 右键 -->
+        <contextMenu :contextMenu="contextMenu" @cancel="closeContext" :list="btnList"></contextMenu>
+        <component
+            :is="componentId"
+            v-if="componentId"
+            :selectedRow="selectedRow"
+            @cancel="closeComponent"
+        ></component>
+    </div>
+</template>
+
+<script lang="ts">
+import { getShowBottomValue } from '@/common/config/constrolBottom';
+import { contextMenu, defineComponent } from '@/common/export/commonTable';
+import { handleTableEventAndData } from '@/common/setup/table/compose';
+import { TableParam } from '@/common/setup/table/interface';
+import { getQuoteValue_out, handleQuotePriceColor_out, handleSubcriteOnDemandQuote, quoteAmplitude_out, quoteAmplituOfVibration, quoteChange_out } from '@/common/setup/table/tableQuote';
+import { QueryQuoteDayRsp } from '@/services/go/quote/interface';
+import { QueryQuoteGoodsListRsp } from '@/services/go/Tjmd/interface';
+import { columnsList, getBtnList, useSwapList } from './setup';
+
+export default defineComponent({
+    name: 'spot_trade_order_transaction_swap',
+    components: {
+        contextMenu,
+        // BuyAndSell: defineAsyncComponent(() => import('./components/buy-sell-market/index.vue')),
+        // PostBuying: defineAsyncComponent(() => import('./components/post_buying/index.vue')),
+        // Detail: defineAsyncComponent(() => import('./components/detail/index.vue')),
+    },
+    setup() {
+        const isBottom = getShowBottomValue();
+        const { loading, goodsList, getRefGoodsList, filterGoodsList } = useSwapList();
+
+        const param: TableParam = {
+            columnsList,
+            queryFn: () => { },
+            clickName: 'BuyAndSell',
+        };
+
+        // 行情按需订阅
+        let stopSubcribe = handleSubcriteOnDemandQuote<QueryQuoteGoodsListRsp>(goodsList, 'refgoodscode');
+        // 过滤标的合约
+        function goodsChange(value: string) {
+            filterGoodsList(value);
+            // 停止上次订阅
+            stopSubcribe();
+            // 重新发起订阅
+            stopSubcribe = handleSubcriteOnDemandQuote<QueryQuoteGoodsListRsp>(goodsList, 'refgoodscode');
+        }
+        return {
+            isBottom,
+            ...handleTableEventAndData<QueryQuoteDayRsp>(param),
+            btnList: getBtnList(true),
+            handleQuotePriceColor_out,
+            quoteChange_out,
+            quoteAmplitude_out,
+            quoteAmplituOfVibration,
+            getRefGoodsList,
+            goodsList,
+            loading,
+            goodsChange,
+            getQuoteValue_out,
+        };
+    },
+});
+</script>
+<style lang="less">
+.noData {
+    .position(absolute, 28px, 0, 0, 0);
+}
+.filter-custom-table {
+    display: inline-flex;
+    padding-top: 4px;
+    height: 34px;
+    .conditionSelect:first-child {
+        margin-right: 10px;
+    }
+    .btnDeafault.ant-btn,
+    .operBtn.ant-btn {
+        height: 26px !important;
+        line-height: 26px !important;
+    }
+
+    .ant-select-single:not(.ant-select-customize-input)
+        + .ant-select-single:not(.ant-select-customize-input),
+    .ant-select + .ant-space.ant-space-vertical {
+        margin-left: 10px;
+    }
+    .ant-select-single:not(.ant-select-customize-input) {
+        height: 26px;
+        line-height: 26px !important;
+        .ant-select-selector {
+            height: 26px;
+            border-color: @m-grey46 !important;
+            background: @m-grey47;
+            .rounded-corners(3px);
+            .ant-select-selection-item {
+                line-height: 26px;
+            }
+            .ant-select-selection-search {
+                height: 26px;
+                .ant-select-selection-search-input {
+                    height: 26px;
+                    line-height: 27px !important;
+                }
+            }
+            .ant-select-selection-placeholder {
+                line-height: 26px;
+            }
+        }
+    }
+
+    .allDatePicker.ant-calendar-picker {
+        height: 26px !important;
+        border: 1px solid @m-grey46 !important;
+        .ant-calendar-picker-input.ant-input {
+            height: 26px;
+            line-height: 26px;
+            &::placeholder {
+                color: @m-grey10 !important;
+            }
+        }
+    }
+    .conditionSelect + .conditionSelect {
+        margin-left: 10px;
+    }
+}
+</style>

src/views/market/market-spot/compoments/spot_trade_order_transaction/setup.ts

@@ -0,0 +1,103 @@
+import { BtnListType } from "@/common/components/btnList/interface"
+import { TradeMode } from "@/common/constants/enumCommon"
+import { initData } from "@/common/methods"
+import { queryTableList } from "@/common/setup/table"
+import { getMarketIdsByTradeMode } from "@/services/bus/market"
+import { getUserAccountType } from "@/services/bus/user"
+import { queryQuoteGoodsList } from "@/services/go/Tjmd"
+import { QueryQuoteGoodsListReq, QueryQuoteGoodsListRsp } from "@/services/go/Tjmd/interface"
+import { ref } from "vue"
+
+const refGoods = ref<QueryQuoteGoodsListRsp[]>([])
+
+export function findItemGoods(goodscode: string) {
+    return refGoods.value.find(el => el.goodscode === goodscode)!
+}
+
+const { loading, queryTable } = queryTableList<QueryQuoteGoodsListRsp>();
+
+export function getSwapList() {
+    // 组装 参数
+    const marketids = getMarketIdsByTradeMode(TradeMode.DiaoQi)
+    const param: QueryQuoteGoodsListReq = {
+        usertype: getUserAccountType(),
+    }
+    if (marketids) {
+        param.marketids = marketids
+    }
+    return queryTable(queryQuoteGoodsList, param)
+}
+
+// 获取 商品掉期 商品列表
+export const useSwapList = () => {
+    // 行情商品
+    const goodsList = ref<QueryQuoteGoodsListRsp[]>([])
+    initData(() => {
+        // 开始查询 商品掉期
+        getSwapList().then(res => {
+            refGoods.value = res
+            goodsList.value = res
+        })
+    })
+    // 获取标记商品列表
+    function getRefGoodsList(): string[] {
+        const result = new Set<string>(['全部标的合约'])
+        refGoods.value.forEach(el => {
+            result.add(el.refgoodsname)
+        })
+        return [...result]
+    }
+    // 过滤标的合约
+    function filterGoodsList(value: string) {
+        if (value === '全部标的合约') {
+            goodsList.value = refGoods.value
+        } else {
+            goodsList.value = refGoods.value.filter(goods => goods.refgoodsname === value)
+        }
+    }
+
+    return { loading, goodsList, getRefGoodsList, filterGoodsList, refGoods }
+}
+
+export const columnsList = [
+    { title: '序号', key: 'index', width: 80 },
+    { title: '代码', key: 'goodscode' },
+    { title: '名称', key: 'goodsname' },
+
+    { title: '标的合约', key: 'refgoodsname' },
+
+    // { title: '买价', key: 'bid' },
+    // { title: '买量', key: 'bidvolume' },
+    // { title: '卖价', key: 'ask' },
+    // { title: '卖量', key: 'askvolume' },
+
+    { title: '当前价', key: 'last' },
+    { title: '涨跌', key: 'change' }, // 最新价 - 昨结价
+    { title: '幅度', key: 'amplitude' }, // （最新价 - 昨结价） / 100 %
+    { title: '开盘', key: 'opened' },
+    { title: '最高', key: 'highest' },
+    { title: '最低', key: 'lowest' },
+
+    { title: '结算', key: 'settle' },
+
+    { title: '昨结算', key: 'presettle' },
+
+    // { title: '振幅', key: 'vibration' }, // (最高价 - 最低价 ) / 最新价  * 100 %
+    // { title: '总量', key: 'totalvolume' },
+    // { title: '现量', key: 'lastvolume' },
+    // { title: '持仓量', key: 'holdvolume' },
+    // { title: '日增', key: 'holdincrement' },
+    // { title: '金额', key: 'totalturnover' },
+];
+
+// 获取按钮列表
+export function getBtnList(isBuyAndSell: boolean) {
+    const btnList: BtnListType[] = [
+        { lable: '挂牌', code: 'PostBuying', className: 'operBtn' },
+        // { lable: '详情', code: 'Detail', className: 'btnDeafault' },
+    ];
+    if (isBuyAndSell) {
+        btnList.push({ lable: '买卖大厅', code: 'BuyAndSell', className: 'btnDeafault' })
+    }
+    return btnList
+}

src/views/market/market-spot/compoments/spot_trade_reference_market/index.vue

@@ -0,0 +1,199 @@
+<template>
+    <!--参考行情-->
+    <div class="topTableHeight topTableHeight_379">
+        <a-table
+            :columns="columns"
+            :class="['srcollYTable', isBottom ? '' : 'srcollYTableNoBottom', goodsList.length ? 'noPlaceHolder' : 'hasPlaceHolder']"
+            :scroll="{ x: '100%', y: isBottom ? 'calc(100vh - 378px)' : 'calc(100vh - 138px)' }"
+            :pagination="false"
+            :loading="loading"
+            :expandedRowKeys="expandedRowKeys"
+            :customRow="Rowclick"
+            rowKey="goodscode"
+            ref="tableRef"
+            :data-source="goodsList"
+        >
+            <template #totalturnover="{ text }">
+                <span>{{ changeUnit(text) }}</span>
+            </template>
+            <!-- 买量 -->
+            <template #bidvolume="{ text }">
+                <span>{{ handleNoneValue(text) }}</span>
+            </template>
+            <!-- 卖量 -->
+            <template #askvolume="{ text }">
+                <span>{{ handleNoneValue(text) }}</span>
+            </template>
+            <!-- 开盘价 -->
+            <template #opened="{ record, text }">
+                <span
+                    :class="handleQuotePriceColor(text, record.presettle)"
+                >{{ handleNoneValue(text) }}</span>
+            </template>
+            <!-- 涨跌 -->
+            <template #change="{ record }">
+                <span
+                    :class="handleQuotePriceColor(record.last, record.presettle)"
+                >{{ quoteChange(record, record.decimalplace) }}</span>
+            </template>
+            <!-- 幅度 -->
+            <template #amplitude="{ record }">
+                <span
+                    :class="handleQuotePriceColor(record.last, record.presettle)"
+                >{{ quoteAmplitude(record, record.decimalplace) }}</span>
+            </template>
+            <!-- 振幅 -->
+            <template #vibration="{ record, text }">
+                <span
+                    :class="handleQuotePriceColor(text, record.presettle)"
+                >{{ quoteAmplituOfVibration(record, record.decimalplace) }}</span>
+            </template>
+            <template #index="{ index }">
+                <span>{{ index + 1 }}</span>
+            </template>
+            <!-- 买价 -->
+            <template #bid="{ text, record }">
+                <span
+                    :class="handleQuotePriceColor(text, record.presettle)"
+                >{{ handleNoneValue(text) }}</span>
+            </template>
+            <!-- 卖价 -->
+            <template #ask="{ text, record }">
+                <span
+                    :class="handleQuotePriceColor(text, record.presettle)"
+                >{{ handleNoneValue(text) }}</span>
+            </template>
+            <!-- 最新价 -->
+            <template #last="{ text, record }">
+                <span
+                    :class="handleQuotePriceColor(text, record.presettle)"
+                >{{ handleNoneValue(text) }}</span>
+            </template>
+            <!-- 最低价 -->
+            <template #lowest="{ text, record }">
+                <span
+                    :class="handleQuotePriceColor(text, record.presettle)"
+                >{{ handleNoneValue(text) }}</span>
+            </template>
+            <!-- 最高价 -->
+            <template #highest="{ text, record }">
+                <span
+                    :class="handleQuotePriceColor(text, record.presettle)"
+                >{{ handleNoneValue(text) }}</span>
+            </template>
+            <!-- 昨结价 -->
+            <template #preclose="{ text, record }">
+                <span
+                    :class="handleQuotePriceColor(text, record.presettle)"
+                >{{ handleNoneValue(text) }}</span>
+            </template>
+        </a-table>
+        <!-- 右键 -->
+        <!-- <contextMenu :contextMenu="contextMenu" @cancel="closeContext" :list="firstBtn"></contextMenu> -->
+        <component
+            :is="componentId"
+            v-if="componentId"
+            :enumName="name"
+            :selectedRow="selectedRow"
+            @cancel="closeComponent"
+        ></component>
+    </div>
+</template>
+
+<script lang="ts">
+import { getShowBottomValue } from '@/common/config/constrolBottom';
+import { TradeMode } from '@/common/constants/enumCommon';
+import { EnumRouterName } from '@/common/constants/enumRouterName';
+import { ComposeTableParam, contextMenu, defineComponent, queryTableList } from '@/common/export/commonTable';
+import { handleTableColums } from '@/common/setup/table/clolumn';
+import { handleNoneValue, handleQuotePriceColor, handleSubcriteOnDemandQuote, quoteAmplitude, quoteAmplituOfVibration, quoteChange } from '@/common/setup/table/tableQuote';
+import { getQutoGoodsByTradeMode } from '@/services/bus/goods';
+import { QueryDeliveryRelationRsp } from '@/services/go/delivery/interface';
+import { QueryQuoteDayRsp } from '@/services/go/quote/interface';
+import { queryOrderQuote } from '@/services/go/wrtrade';
+import { QueryOrderQuoteReq } from '@/services/go/wrtrade/interface';
+import { changeUnit } from '@/utils/qt/common';
+import { handleComposeTable } from '@/views/market/spot_trade/setup';
+import { ref } from 'vue';
+
+const columnsList = [
+    { title: '序号', key: 'index', width: 80 },
+    { title: '代码', key: 'goodscode' },
+    { title: '名称', key: 'goodsname' },
+    { title: '买价', key: 'bid' },
+    { title: '买量', key: 'bidvolume' },
+    { title: '卖价', key: 'ask' },
+    { title: '卖量', key: 'askvolume' },
+    { title: '最新价', key: 'last' },
+    { title: '涨跌', key: 'change' }, // 最新价 - 昨结价
+    { title: '幅度', key: 'amplitude' }, // （最新价 - 昨结价） / 100 %
+    { title: '开盘价', key: 'opened' },
+    { title: '昨收价', key: 'preclose' },
+    { title: '昨结价', key: 'presettle' },
+    { title: '最低价', key: 'lowest' },
+    { title: '最高价', key: 'highest' },
+    { title: '振幅', key: 'vibration' }, // (最高价 - 最低价 ) / 最新价  * 100 %
+    { title: '总量', key: 'totalvolume' },
+    { title: '现量', key: 'lastvolume' },
+    { title: '持仓量', key: 'holdvolume' },
+    // { title: '日增', key: 'holdincrement' },
+    // { title: '金额', key: 'totalturnover' },
+];
+
+export default defineComponent({
+    name: EnumRouterName.spot_trade_reference_market,
+    components: {
+        contextMenu,
+        // [ModalEnum.spot_trade_warehouse_detail]: defineAsyncComponent(() => import('../../components/detail/index.vue')),
+        // [ModalEnum.spot_trade_warehouse_post_buying]: defineAsyncComponent(() => import('../../components/post_buying/index.vue')),
+        // buyAndSell: defineAsyncComponent(() => import('../components/goods-chart/index.vue')),
+        // postBuying: defineAsyncComponent(() => import('../../components/post_buying/index.vue')),
+    },
+    setup() {
+        const isBottom = getShowBottomValue();
+        // 表头
+        const { columns } = handleTableColums(columnsList);
+        // 表格列表数据
+        const { loading, tableList, queryTable } = queryTableList<QueryDeliveryRelationRsp>();
+        const tableRef = ref<any>(null);
+        // 行情商品
+        const goodsList = getQutoGoodsByTradeMode(TradeMode.quote99);
+        // 行情按需订阅
+        handleSubcriteOnDemandQuote<QueryQuoteDayRsp>(goodsList);
+        // 获取列表数据
+        const queryTableAction = () => {
+            const param: QueryOrderQuoteReq = {
+                wrpricetype: 1,
+                haswr: 1,
+            };
+            queryTable(queryOrderQuote, param);
+        };
+        // 表格通用逻辑
+        const param: ComposeTableParam = {
+            queryFn: queryTableAction,
+            menuType: EnumRouterName.warehouse_receipt_trade_price,
+            tableName: 'table_pcweb_spot_trade_warehouse_price',
+            tableFilterKey: [],
+            isDetail: false,
+        };
+        return {
+            isBottom,
+            ...handleComposeTable<QueryDeliveryRelationRsp>(param),
+            loading,
+            tableList,
+            goodsList,
+            tableRef,
+            columns,
+            changeUnit,
+            handleQuotePriceColor,
+            quoteChange,
+            quoteAmplitude,
+            quoteAmplituOfVibration,
+            handleNoneValue,
+        };
+    },
+});
+
+</script>
+<style lang="less">
+</style>

src/views/market/market-spot/compoments/warehouse_receipt_trade/index.vue

@@ -0,0 +1,120 @@
+<template>
+    <!-- 仓单贸 -->
+    <div class="topTableHeight">
+        <!-- <Filter :enumName="name" @search="search" @buy="buyOpen" /> -->
+        <a-table
+            :columns="columns"
+            :class="['srcollYTable', isBottom ? 'condSecondTabTable' : 'condSecondTabTableNoBottom', tableList.length ? 'noPlaceHolder' : 'hasPlaceHolder']"
+            :scroll="{ x: '100%', y: isBottom ? 'calc(100vh- 443px)' : 'calc(100vh - 196px)' }"
+            :pagination="false"
+            :loading="loading"
+            :expandedRowKeys="expandedRowKeys"
+            :customRow="Rowclick"
+            :rowKey="(record, index) => index"
+            :data-source="tableList"
+        ></a-table>
+        <!-- 右键 -->
+        <contextMenu :contextMenu="contextMenu" @cancel="closeContext" :list="firstBtn"></contextMenu>
+        <component
+            :is="componentId"
+            v-if="componentId"
+            :enumName="name"
+            :selectedRow="selectedRow"
+            @cancel="closeComponent"
+        ></component>
+    </div>
+</template>
+
+<script lang="ts">
+// import Filter from '../../components/filter/index.vue';
+import { getShowBottomValue } from '@/common/config/constrolBottom';
+import { EnumRouterName } from '@/common/constants/enumRouterName';
+import { ComposeTableParam, contextMenu, defineComponent, queryTableList } from '@/common/export/commonTable';
+import { queryOrderQuote } from '@/services/go/wrtrade';
+import { QueryOrderQuoteReq, WrOrderQuote } from '@/services/go/wrtrade/interface';
+import Bus from '@/utils/eventBus/index';
+import { handleComposeTable } from '@/views/market/spot_trade/setup';
+
+export default defineComponent({
+    name: EnumRouterName.warehouse_receipt_trade_price,
+    components: {
+        contextMenu,
+        // Filter,
+        // [ModalEnum.spot_trade_warehouse_detail]: defineAsyncComponent(() => import('../../components/detail/index.vue')),
+        // [ModalEnum.spot_trade_warehouse_post_buying]: defineAsyncComponent(() => import('../../components/post_buying/index.vue')),
+        // buyAndSell: defineAsyncComponent(() => import('../../components/buy-sell-market/index.vue')),
+        // postBuying: defineAsyncComponent(() => import('../../components/post_buying/index.vue')),
+    },
+    setup() {
+        const isBottom = getShowBottomValue();
+        // 表格列表数据
+        const { loading, tableList, queryTable } = queryTableList<WrOrderQuote>();
+        // 获取列表数据
+        const queryTableAction = () => {
+            const param: QueryOrderQuoteReq = {
+                wrpricetype: 1,
+                haswr: 1,
+            };
+            queryTable(queryOrderQuote, param);
+        };
+        Bus.$on('spotTrade', queryTableAction);
+        // 表格通用逻辑
+        const param: ComposeTableParam = {
+            queryFn: queryTableAction,
+            menuType: EnumRouterName.warehouse_receipt_trade_price,
+            tableName: 'table_pcweb_spot_trade_warehouse_price',
+            tableFilterKey: [],
+            isDetail: false,
+        };
+        const {
+            contextMenu,
+            openContext,
+            closeContext, // 右键
+            columns,
+            registerColumn,
+            updateColumn, // 表头
+            expandedRowKeys,
+            selectedRow,
+            Rowclick, // 表格折腾面板数据与单击、双击事件
+            componentId,
+            closeComponent, // 控制异步组件
+            firstBtn, // 表格按钮
+        } = handleComposeTable<WrOrderQuote>(param);
+        function search(value: Object) {
+            const param: QueryOrderQuoteReq = {
+                wrpricetype: 1,
+                haswr: 1,
+            };
+            Object.assign(param, value);
+            queryTable(queryOrderQuote, param);
+        }
+        function buyOpen(value: any, goods: any) {
+            componentId.value = 'postBuying';
+            selectedRow.value = value;
+        }
+
+        return {
+            isBottom,
+            contextMenu,
+            openContext,
+            closeContext, // 右键
+            columns,
+            registerColumn,
+            updateColumn, // 表头
+            expandedRowKeys,
+            selectedRow,
+            Rowclick, // 表格折腾面板数据与单击、双击事件
+            componentId,
+            closeComponent, // 控制异步组件
+            firstBtn, // 表格按钮
+            name: EnumRouterName.warehouse_receipt_trade_price,
+            loading,
+            tableList,
+            search,
+            buyOpen,
+        };
+    },
+});
+</script>
+<style lang="less">
+</style>

src/views/market/market-spot/index.vue

@@ -0,0 +1,69 @@
+<template>
+  <div class="topTableHeight">
+    <FristMenu :list="marketsSetion" :value="'marketsectionname'" @selectMenu="selectSection" />
+    <component :is="componentId" v-if="componentId"></component>
+    <ThirdMenu :list="markets" :value="'marketname'" @selectMenu="onSelectMarket" />
+  </div>
+</template>
+
+<script lang="ts">
+import FristMenu from '@/common/components/firstMenu/index.vue';
+import ThirdMenu from '@/common/components/thirdMenu/index.vue';
+import { TradeMode } from '@/common/constants/enumCommon';
+import { contextMenu, defineAsyncComponent, defineComponent } from '@/common/export/commonTable';
+import { initData } from '@/common/methods';
+import APP from '@/services';
+import { TjmdMarketSection, TjmdMarketSectionConfig } from '@/services/go/Tjmd/interface';
+import { ref } from 'vue';
+
+export default defineComponent({
+  components: {
+    FristMenu,
+    ThirdMenu,
+    contextMenu,
+    [TradeMode.WarehouseReceiptTrade]: defineAsyncComponent(() => import('./compoments/warehouse_receipt_trade/index.vue')),
+    [TradeMode.quote99]: defineAsyncComponent(() => import('./compoments/spot_trade_reference_market/index.vue')),
+    [TradeMode.DiaoQi]: defineAsyncComponent(() => import('./compoments/spot_trade_order_transaction/index.vue')),
+  },
+  setup() {
+    // 市场板块
+    const marketsSetion = APP.getRef('marketsSection')
+    // 市场
+    const markets = ref<TjmdMarketSectionConfig[]>([])
+    // 选中的市场
+    const selctedMarket = ref<TjmdMarketSectionConfig | null>(null)
+    const componentId = ref<string>('')
+    initData(() => {
+      if (marketsSetion.value.length) {
+        selectSection(marketsSetion.value[0])
+        // markets.value = marketsSetion.value[0].mlist
+      }
+    })
+    // 切换市场板块
+    function selectSection(value: TjmdMarketSection) {
+      markets.value = [...value.mlist, ...value.mlist]
+      const index = marketsSetion.value.findIndex((el: TjmdMarketSection) => el.marketsectionid === value.marketsectionid)
+      if (index !== -1 && value.mlist.length) {
+        onSelectMarket(index, value.mlist[0])
+      }
+    }
+    // 切换市场
+    function onSelectMarket(index: number, value: TjmdMarketSectionConfig) {
+      selctedMarket.value = value
+      componentId.value = value.trademode.toString()
+    }
+
+    return { marketsSetion, selectSection, markets, onSelectMarket, componentId };
+  },
+});
+</script>
+
+<style lang="less">
+.home {
+  .withus {
+    cursor: pointer;
+    margin-top: 35px;
+    padding-bottom: 25px;
+  }
+}
+</style>

src/views/market/market-spot/setup.ts

@@ -0,0 +1,28 @@
+import { initData } from '@/common/methods';
+import APP from '@/services';
+import { TjmdMarketSection, TjmdMarketSectionConfig } from '@/services/go/Tjmd/interface';
+import { ref } from 'vue';
+
+export const useMarketsSection = () => {
+    // 市场板块
+    const marketsSetion = APP.getRef('marketsSection')
+    // 市场
+    const markets = ref<TjmdMarketSectionConfig[]>([])
+    // 选中的市场
+    const selctedMarket = ref<TjmdMarketSectionConfig | null>(null)
+    initData(() => {
+        if (marketsSetion.value.length) {
+            markets.value = marketsSetion.value[0].mlist
+        }
+    })
+    // 切换市场板块
+    function selectSection(value: TjmdMarketSection) {
+        markets.value = [...value.mlist, ...value.mlist]
+    }
+    // 切换市场
+    function onSelectMarket(value: TjmdMarketSectionConfig) {
+        selctedMarket.value = value
+    }
+
+    return { marketsSetion, selectSection, markets, onSelectMarket, selctedMarket }
+}

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

@@ -1,67 +1,120 @@
 <template>
     <!--参考行情-->
-    <div class="topTableHeight">
-        <a-table :columns="columns" :class="['srcollYTable', isBottom ? '' : 'srcollYTableNoBottom', goodsList.length ? 'noPlaceHolder' : 'hasPlaceHolder']" :scroll="{ x: '100%', y: isBottom ? 'calc(100vh - 378px)' : 'calc(100vh - 138px)' }" :pagination="false" :loading="loading" :expandedRowKeys="expandedRowKeys" :customRow="Rowclick" rowKey="goodscode" ref="tableRef" :data-source="goodsList">
+    <div class="topTableHeight topTableHeight_379">
+        <a-table
+            :columns="columns"
+            :class="['srcollYTable', isBottom ? '' : 'srcollYTableNoBottom', goodsList.length ? 'noPlaceHolder' : 'hasPlaceHolder']"
+            :scroll="{ x: '100%', y: isBottom ? 'calc(100vh - 378px)' : 'calc(100vh - 138px)' }"
+            :pagination="false"
+            :loading="loading"
+            :expandedRowKeys="expandedRowKeys"
+            :customRow="Rowclick"
+            rowKey="goodscode"
+            ref="tableRef"
+            :data-source="goodsList"
+        >
             <template #totalturnover="{ text }">
                 <span>{{ changeUnit(text) }}</span>
             </template>
+            <!-- 买量 -->
+            <template #bidvolume="{ text }">
+                <span>{{ handleNoneValue(text) }}</span>
+            </template>
+            <!-- 卖量 -->
+            <template #askvolume="{ text }">
+                <span>{{ handleNoneValue(text) }}</span>
+            </template>
+            <!-- 开盘价 -->
+            <template #opened="{ record, text }">
+                <span
+                    :class="handleQuotePriceColor(text, record.presettle)"
+                >{{ handleNoneValue(text) }}</span>
+            </template>
             <!-- 涨跌 -->
             <template #change="{ record }">
-                <span>{{ quoteChange(record, record.decimalplace) }}</span>
+                <span
+                    :class="handleQuotePriceColor(record.last, record.presettle)"
+                >{{ quoteChange(record, record.decimalplace) }}</span>
             </template>
             <!-- 幅度 -->
             <template #amplitude="{ record }">
-                <span>{{ quoteAmplitude(record, record.decimalplace) }}</span>
+                <span
+                    :class="handleQuotePriceColor(record.last, record.presettle)"
+                >{{ quoteAmplitude(record, record.decimalplace) }}</span>
             </template>
             <!-- 振幅 -->
-            <template #vibration="{ record }">
-                <span>{{ quoteAmplituOfVibration(record, record.decimalplace) }}</span>
+            <template #vibration="{ record, text }">
+                <span
+                    :class="handleQuotePriceColor(text, record.presettle)"
+                >{{ 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>
+                <span
+                    :class="handleQuotePriceColor(text, record.presettle)"
+                >{{ handleNoneValue(text) }}</span>
             </template>
             <!-- 卖价 -->
             <template #ask="{ text, record }">
-                <span :class="handleQuotePriceColor(text, record.presettle)">{{ text }}</span>
+                <span
+                    :class="handleQuotePriceColor(text, record.presettle)"
+                >{{ handleNoneValue(text) }}</span>
             </template>
             <!-- 最新价 -->
             <template #last="{ text, record }">
-                <span :class="handleQuotePriceColor(text, record.presettle)">{{ text }}</span>
+                <span
+                    :class="handleQuotePriceColor(text, record.presettle)"
+                >{{ handleNoneValue(text) }}</span>
             </template>
             <!-- 最低价 -->
             <template #lowest="{ text, record }">
-                <span :class="handleQuotePriceColor(text, record.presettle)">{{ text }}</span>
+                <span
+                    :class="handleQuotePriceColor(text, record.presettle)"
+                >{{ handleNoneValue(text) }}</span>
             </template>
             <!-- 最高价 -->
             <template #highest="{ text, record }">
-                <span :class="handleQuotePriceColor(text, record.presettle)">{{ text }}</span>
+                <span
+                    :class="handleQuotePriceColor(text, record.presettle)"
+                >{{ handleNoneValue(text) }}</span>
+            </template>
+            <!-- 昨结价 -->
+            <template #preclose="{ text, record }">
+                <span
+                    :class="handleQuotePriceColor(text, record.presettle)"
+                >{{ handleNoneValue(text) }}</span>
             </template>
         </a-table>
         <!-- 右键 -->
         <!-- <contextMenu :contextMenu="contextMenu" @cancel="closeContext" :list="firstBtn"></contextMenu> -->
-        <component :is="componentId" v-if="componentId" :enumName="name" :selectedRow="selectedRow" @cancel="closeComponent"></component>
+        <component
+            :is="componentId"
+            v-if="componentId"
+            :enumName="name"
+            :selectedRow="selectedRow"
+            @cancel="closeComponent"
+        ></component>
     </div>
 </template>
 
 <script lang="ts">
-import { EnumRouterName } from '@/common/constants/enumRouterName';
-import { queryTableList, BtnList, contextMenu, defineAsyncComponent, defineComponent, ModalEnum, ComposeTableParam } from '@/common/export/commonTable';
-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 { handleSubcriteOnDemandQuote, handleQuotePriceColor, quoteChange, quoteAmplitude, quoteAmplituOfVibration } from '@/common/setup/table/tableQuote';
-import { QueryDeliveryRelationRsp } from '@/services/go/delivery/interface';
-import { getGoodsListByTrade, getQutoGoodsByTradeMode } from '@/services/bus/goods';
+import { getShowBottomValue } from '@/common/config/constrolBottom';
 import { TradeMode } from '@/common/constants/enumCommon';
+import { EnumRouterName } from '@/common/constants/enumRouterName';
+import { ComposeTableParam, contextMenu, defineAsyncComponent, defineComponent, queryTableList } from '@/common/export/commonTable';
 import { handleTableColums } from '@/common/setup/table/clolumn';
+import { handleNoneValue, handleQuotePriceColor, handleSubcriteOnDemandQuote, quoteAmplitude, quoteAmplituOfVibration, quoteChange } from '@/common/setup/table/tableQuote';
+import { getQutoGoodsByTradeMode } from '@/services/bus/goods';
+import { QueryDeliveryRelationRsp } from '@/services/go/delivery/interface';
 import { QueryQuoteDayRsp } from '@/services/go/quote/interface';
+import { queryOrderQuote } from '@/services/go/wrtrade';
+import { QueryOrderQuoteReq } from '@/services/go/wrtrade/interface';
 import { changeUnit } from '@/utils/qt/common';
-import { getShowBottomValue } from '@/common/config/constrolBottom';
+import { handleComposeTable } from '@/views/market/spot_trade/setup';
+import { ref } from 'vue';
 
 const columnsList = [
     { title: '序号', key: 'index', width: 80 },
@@ -83,8 +136,8 @@ const columnsList = [
     { title: '总量', key: 'totalvolume' },
     { title: '现量', key: 'lastvolume' },
     { title: '持仓量', key: 'holdvolume' },
-    { title: '日增', key: 'holdincrement' },
-    { title: '金额', key: 'totalturnover' },
+    // { title: '日增', key: 'holdincrement' },
+    // { title: '金额', key: 'totalturnover' },
 ];
 
 export default defineComponent({
@@ -136,9 +189,11 @@ export default defineComponent({
             quoteChange,
             quoteAmplitude,
             quoteAmplituOfVibration,
+            handleNoneValue,
         };
     },
 });
+
 </script>
 <style lang="less">
 </style>