|
@@ -1,13 +1,7 @@
|
|
|
<template>
|
|
<template>
|
|
|
<!--期货-->
|
|
<!--期货-->
|
|
|
<div class="topTableHeight">
|
|
<div class="topTableHeight">
|
|
|
- <a-table :columns="getColumnsList()"
|
|
|
|
|
- :class="['srcollYTable', isBottom ? 'condSecondTabTable' : 'condSecondTabTableNoBottom', tableList.length ? 'noPlaceHolder' : 'hasPlaceHolder']"
|
|
|
|
|
- :scroll="{ x: '100%', y: isBottom ? 'calc(100vh- 443px)' : 'calc(100vh - 196px)' }"
|
|
|
|
|
- :pagination="false"
|
|
|
|
|
- :loading="loading"
|
|
|
|
|
- rowKey="key"
|
|
|
|
|
- :data-source="tableList">
|
|
|
|
|
|
|
+ <a-table :columns="getColumnsList()" :class="['srcollYTable', isBottom ? 'condSecondTabTable' : 'condSecondTabTableNoBottom', tableList.length ? 'noPlaceHolder' : 'hasPlaceHolder']" :scroll="{ x: '100%', y: isBottom ? 'calc(100vh- 443px)' : 'calc(100vh - 196px)' }" :pagination="false" :loading="loading" :customRow="Rowclick" rowKey="key" :data-source="tableList">
|
|
|
<template #totalturnover="{ text }">
|
|
<template #totalturnover="{ text }">
|
|
|
<span>{{changeUnit(text)}}</span>
|
|
<span>{{changeUnit(text)}}</span>
|
|
|
</template>
|
|
</template>
|
|
@@ -47,17 +41,10 @@
|
|
|
<span :class="handleQuotePriceColor(text, record.presettle)">{{text}}</span>
|
|
<span :class="handleQuotePriceColor(text, record.presettle)">{{text}}</span>
|
|
|
</template>
|
|
</template>
|
|
|
</a-table>
|
|
</a-table>
|
|
|
- <ThridMenu :list="tabList"
|
|
|
|
|
- :selectedKey="index"
|
|
|
|
|
- @selectMenu="changeTab" />
|
|
|
|
|
|
|
+ <ThridMenu :list="tabList" :selectedKey="index" @selectMenu="changeTab" />
|
|
|
<!-- 右键 -->
|
|
<!-- 右键 -->
|
|
|
- <contextMenu :contextMenu="contextMenu"
|
|
|
|
|
- @cancel="closeContext"
|
|
|
|
|
- :list="buttons"></contextMenu>
|
|
|
|
|
- <component :is="componentId"
|
|
|
|
|
- v-if="componentId"
|
|
|
|
|
- :selectedRow="selectedRow"
|
|
|
|
|
- @cancel="closeComponent"></component>
|
|
|
|
|
|
|
+ <contextMenu :contextMenu="contextMenu" @cancel="closeContext" :list="buttons"></contextMenu>
|
|
|
|
|
+ <component :is="componentId" v-if="componentId" :selectedRow="selectedRow" @cancel="closeComponent"></component>
|
|
|
</div>
|
|
</div>
|
|
|
</template>
|
|
</template>
|
|
|
|
|
|
|
@@ -68,11 +55,18 @@ import { getShowBottomValue } from '@/common/config/constrolBottom';
|
|
|
import { handleModalComponent } from '@/common/setup/asyncComponent';
|
|
import { handleModalComponent } from '@/common/setup/asyncComponent';
|
|
|
import { handleQuotePriceColor, handleSubcriteOnDemandQuote, quoteAmplitude, quoteAmplituOfVibration, quoteChange } from '@/common/setup/table/tableQuote';
|
|
import { handleQuotePriceColor, handleSubcriteOnDemandQuote, quoteAmplitude, quoteAmplituOfVibration, quoteChange } from '@/common/setup/table/tableQuote';
|
|
|
import { QueryQuoteDayRsp } from '@/services/go/quote/interface';
|
|
import { QueryQuoteDayRsp } from '@/services/go/quote/interface';
|
|
|
-import { ref } from 'vue';
|
|
|
|
|
|
|
+import { ref, reactive, Ref, toRefs } from 'vue';
|
|
|
import { getColumnsList, useExternalexchange } from './setup';
|
|
import { getColumnsList, useExternalexchange } from './setup';
|
|
|
import { getTableButton } from '@/common/setup/table/button';
|
|
import { getTableButton } from '@/common/setup/table/button';
|
|
|
import { contextMenu, defineAsyncComponent, defineComponent } from '@/common/export/commonTable';
|
|
import { contextMenu, defineAsyncComponent, defineComponent } from '@/common/export/commonTable';
|
|
|
import { handleContextMenu } from '@/common/components/contextMenu/setup';
|
|
import { handleContextMenu } from '@/common/components/contextMenu/setup';
|
|
|
|
|
+import { TableEventCB } from '@/common/setup/table/interface';
|
|
|
|
|
+import { getTableEvent } from '@/common/export/table';
|
|
|
|
|
+import { ContextMenuTemp } from '@/common/components/contextMenu/interface';
|
|
|
|
|
+import { BtnListType } from '@/common/components/btnList/interface';
|
|
|
|
|
+import APP from '@/services';
|
|
|
|
|
+import { Goods } from '@/services/go/ermcp/goodsInfo/interface';
|
|
|
|
|
+import { getQuoteDayInfoByCode } from '@/services/bus/goods';
|
|
|
|
|
|
|
|
export default defineComponent({
|
|
export default defineComponent({
|
|
|
name: 'spot_trade_order_transaction_swap',
|
|
name: 'spot_trade_order_transaction_swap',
|
|
@@ -82,21 +76,75 @@ export default defineComponent({
|
|
|
trade: defineAsyncComponent(() => import('./compoments/futures-trade/index.vue')),
|
|
trade: defineAsyncComponent(() => import('./compoments/futures-trade/index.vue')),
|
|
|
},
|
|
},
|
|
|
setup() {
|
|
setup() {
|
|
|
|
|
+ interface Quote {
|
|
|
|
|
+ goodscode: string;
|
|
|
|
|
+ goodsname: string;
|
|
|
|
|
+ decimalplace: number;
|
|
|
|
|
+ last?: Ref;
|
|
|
|
|
+ presettle?: Ref;
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ const goodsList = APP.get('Goods') as Goods[];
|
|
|
|
|
+ const tableList = reactive<Quote[]>([]);
|
|
|
|
|
+ const quoteList = ref<QueryQuoteDayRsp[]>([]);
|
|
|
|
|
+
|
|
|
|
|
+ goodsList.forEach((el) => {
|
|
|
|
|
+ const quote = getQuoteDayInfoByCode(el.goodscode);
|
|
|
|
|
+ if (quote) {
|
|
|
|
|
+ quoteList.value.push(quote);
|
|
|
|
|
+ }
|
|
|
|
|
+ tableList.push({
|
|
|
|
|
+ goodscode: el.goodscode,
|
|
|
|
|
+ goodsname: el.goodsname,
|
|
|
|
|
+ decimalplace: el.decimalplace,
|
|
|
|
|
+ });
|
|
|
|
|
+ });
|
|
|
|
|
+
|
|
|
const isBottom = getShowBottomValue();
|
|
const isBottom = getShowBottomValue();
|
|
|
- const selectedRow = ref<QueryQuoteDayRsp>();
|
|
|
|
|
const buttons = getTableButton();
|
|
const buttons = getTableButton();
|
|
|
console.log('buttons', buttons);
|
|
console.log('buttons', buttons);
|
|
|
- const { index, loading, tabList, tableList, hanldeQuoteData } = useExternalexchange();
|
|
|
|
|
|
|
+ const { index, loading, tabList, hanldeQuoteData } = useExternalexchange();
|
|
|
// 行情按需订阅
|
|
// 行情按需订阅
|
|
|
- let stopSubcribe = handleSubcriteOnDemandQuote<QueryQuoteDayRsp>(tableList);
|
|
|
|
|
|
|
+ let stopSubcribe = handleSubcriteOnDemandQuote<QueryQuoteDayRsp>(quoteList);
|
|
|
function changeTab(index: number, current: TabList) {
|
|
function changeTab(index: number, current: TabList) {
|
|
|
hanldeQuoteData(index);
|
|
hanldeQuoteData(index);
|
|
|
console.log(index, current);
|
|
console.log(index, current);
|
|
|
// 停止上次订阅
|
|
// 停止上次订阅
|
|
|
stopSubcribe();
|
|
stopSubcribe();
|
|
|
// 重新发起订阅
|
|
// 重新发起订阅
|
|
|
- stopSubcribe = handleSubcriteOnDemandQuote<QueryQuoteDayRsp>(tableList);
|
|
|
|
|
|
|
+ stopSubcribe = handleSubcriteOnDemandQuote<QueryQuoteDayRsp>(quoteList);
|
|
|
}
|
|
}
|
|
|
|
|
+
|
|
|
|
|
+ quoteList.value.forEach((item) => {
|
|
|
|
|
+ const refs = toRefs(item);
|
|
|
|
|
+ const index = tableList.findIndex((e) => e.goodscode === item.goodscode);
|
|
|
|
|
+ if (index > -1) {
|
|
|
|
|
+ tableList[index].last = refs.last;
|
|
|
|
|
+ tableList[index].presettle = refs.presettle;
|
|
|
|
|
+ }
|
|
|
|
|
+ });
|
|
|
|
|
+
|
|
|
|
|
+ // 右键逻辑
|
|
|
|
|
+ const { contextMenu, closeContext: closeContextAction } = handleContextMenu();
|
|
|
|
|
+ // 右键回调函数
|
|
|
|
|
+ const eventsCB: TableEventCB = {
|
|
|
|
|
+ contextmenuCB: (record: QueryQuoteDayRsp, value: ContextMenuTemp) => {
|
|
|
|
|
+ // 控制打开右键
|
|
|
|
|
+ contextMenu.value = value;
|
|
|
|
|
+ },
|
|
|
|
|
+ };
|
|
|
|
|
+ // 表格事件
|
|
|
|
|
+ const { selectedRow, Rowclick } = getTableEvent<QueryQuoteDayRsp>(eventsCB);
|
|
|
|
|
+ // 控制异步组件
|
|
|
|
|
+ const { componentId, closeComponent, openComponent } = handleModalComponent(() => {}, selectedRow);
|
|
|
|
|
+ // 关闭右键
|
|
|
|
|
+ function closeContext(value: BtnListType | null) {
|
|
|
|
|
+ // 打开对应的弹窗组件
|
|
|
|
|
+ if (value) openComponent(value, selectedRow.value);
|
|
|
|
|
+ // 关闭右键
|
|
|
|
|
+ closeContextAction();
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
return {
|
|
return {
|
|
|
index,
|
|
index,
|
|
|
loading,
|
|
loading,
|
|
@@ -110,8 +158,12 @@ export default defineComponent({
|
|
|
quoteAmplituOfVibration,
|
|
quoteAmplituOfVibration,
|
|
|
getColumnsList,
|
|
getColumnsList,
|
|
|
buttons,
|
|
buttons,
|
|
|
- ...handleModalComponent(() => {}, selectedRow),
|
|
|
|
|
- ...handleContextMenu(),
|
|
|
|
|
|
|
+ contextMenu,
|
|
|
|
|
+ closeContext,
|
|
|
|
|
+ Rowclick,
|
|
|
|
|
+ componentId,
|
|
|
|
|
+ closeComponent,
|
|
|
|
|
+ selectedRow,
|
|
|
};
|
|
};
|
|
|
},
|
|
},
|
|
|
});
|
|
});
|