|
|
@@ -24,21 +24,36 @@
|
|
|
</template> -->
|
|
|
</a-table>
|
|
|
</contextMenu>
|
|
|
+ <a-drawer placement="bottom"
|
|
|
+ :closable="false"
|
|
|
+ :visible="visible"
|
|
|
+ :get-container="false"
|
|
|
+ :wrap-style="{ position: 'absolute' }"
|
|
|
+ @close="closeDrawer">
|
|
|
+ <div>
|
|
|
+ <p>Some contents...</p>
|
|
|
+ <ThridMenu :list="tabList"
|
|
|
+ @selectMenu="selectMenu" />
|
|
|
+ </div>
|
|
|
+ </a-drawer>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
<script lang="ts">
|
|
|
-import { defineComponent, ref } from 'vue';
|
|
|
+import { defineComponent, Ref, ref } from 'vue';
|
|
|
import { initData } from '@/common/methods';
|
|
|
import filterCustomTable from '../../components/filterTable/index.vue';
|
|
|
import { getBtnList } from '@/common/setup/contextMenu/index';
|
|
|
import contextMenu from '@/common/components/contextMenu/index.vue';
|
|
|
import { getColumsAndSearch } from '../setup';
|
|
|
-import { QueryActualExposure } from '@/services/go/ermcp/exposure/index';
|
|
|
-import { ErmcpRealExposureModel } from '@/services/go/ermcp/exposure/interface';
|
|
|
+import { QueryActualExposure, QueryActualExposureDetail, QueryAutualExposurePosition } from '@/services/go/ermcp/exposure/index';
|
|
|
+import { ErmcpRealExposureModel, Ermcp3ExposureDetail, ErmcpExposurePostion } from '@/services/go/ermcp/exposure/interface';
|
|
|
import { message } from 'ant-design-vue';
|
|
|
import { handleTableEvent } from '@/common/setup/event/index';
|
|
|
import BtnList from '@/common/components/buttonList/index.vue';
|
|
|
+import ThridMenu from '@/common/components/thirdMenu/index.vue';
|
|
|
+import { ColumnType } from '@/common/methods/table';
|
|
|
+import { TableKey } from '@/common/methods/table/interface';
|
|
|
|
|
|
// 获取表格数据
|
|
|
function getExposure() {
|
|
|
@@ -61,15 +76,75 @@ function getExposure() {
|
|
|
|
|
|
return { loading, tableList, queryList };
|
|
|
}
|
|
|
+// 明细
|
|
|
+function handleDrawer(loading: Ref<boolean>, selectedRow: ErmcpRealExposureModel) {
|
|
|
+ const visible = ref<boolean>(true);
|
|
|
+ const tabList = [{ lable: '现货明细' }, { lable: '期货明细' }];
|
|
|
+ const detailTableList = ref<Ermcp3ExposureDetail[] | ErmcpExposurePostion[]>([]);
|
|
|
+ const detailColumns = ref<ColumnType[]>([]);
|
|
|
+ function closeDrawer() {
|
|
|
+ visible.value = false;
|
|
|
+ }
|
|
|
+ function selectMenu(index: number) {
|
|
|
+ let tableKey: keyof TableKey = 'table_pcweb_exposure_detail';
|
|
|
+ if (index) {
|
|
|
+ AutualExposurePosition();
|
|
|
+ } else {
|
|
|
+ ActualExposureDetail();
|
|
|
+ tableKey = 'table_pcweb_exposure_futures_detail';
|
|
|
+ }
|
|
|
+ const { columns, getColumns } = getColumsAndSearch(tableKey, false);
|
|
|
+ getColumns();
|
|
|
+ detailColumns.value = columns.value;
|
|
|
+ }
|
|
|
+
|
|
|
+ // 现货明细信息
|
|
|
+ function ActualExposureDetail() {
|
|
|
+ loading.value = true;
|
|
|
+ const param = { middlegoodsid: selectedRow.MiddleGoodsID };
|
|
|
+ QueryActualExposureDetail(param)
|
|
|
+ .then((res) => {
|
|
|
+ detailTableList.value = res.map((e, i) => {
|
|
|
+ return { ...e, key: String(i) };
|
|
|
+ });
|
|
|
+ loading.value = false;
|
|
|
+ console.log('查询列表', detailTableList);
|
|
|
+ })
|
|
|
+ .catch((err) => {
|
|
|
+ message.error(err);
|
|
|
+ loading.value = false;
|
|
|
+ });
|
|
|
+ }
|
|
|
+ // 期货头寸明细
|
|
|
+ function AutualExposurePosition() {
|
|
|
+ loading.value = true;
|
|
|
+ const param = { middleGoodsId: selectedRow.MiddleGoodsID };
|
|
|
+ QueryAutualExposurePosition(param)
|
|
|
+ .then((res) => {
|
|
|
+ detailTableList.value = res.map((e, i) => {
|
|
|
+ return { ...e, key: String(i) };
|
|
|
+ });
|
|
|
+ loading.value = false;
|
|
|
+ console.log('查询列表', detailTableList);
|
|
|
+ })
|
|
|
+ .catch((err) => {
|
|
|
+ message.error(err);
|
|
|
+ loading.value = false;
|
|
|
+ });
|
|
|
+ }
|
|
|
+ return { visible, closeDrawer, tabList, selectMenu };
|
|
|
+}
|
|
|
|
|
|
export default defineComponent({
|
|
|
name: 'purchase-real-time',
|
|
|
components: {
|
|
|
contextMenu,
|
|
|
filterCustomTable,
|
|
|
+ ThridMenu,
|
|
|
},
|
|
|
setup() {
|
|
|
const { columns, search, getColumns } = getColumsAndSearch('table_pcweb_exposure', true);
|
|
|
+ const { expandedRowKeys, selectedRow, Rowclick } = handleTableEvent<ErmcpRealExposureModel>();
|
|
|
const { loading, tableList, queryList } = getExposure();
|
|
|
const { commonBtn, forDataBtn } = getBtnList('exposure_realtime', false);
|
|
|
|
|
|
@@ -77,13 +152,13 @@ export default defineComponent({
|
|
|
queryList();
|
|
|
getColumns();
|
|
|
});
|
|
|
- return { commonBtn, forDataBtn, loading, tableList, columns, search, ...handleTableEvent() };
|
|
|
+ return { commonBtn, forDataBtn, loading, tableList, columns, search, expandedRowKeys, selectedRow, Rowclick, ...handleDrawer(loading, (selectedRow as unknown) as ErmcpRealExposureModel) };
|
|
|
},
|
|
|
});
|
|
|
</script>
|
|
|
|
|
|
<style lang="less">
|
|
|
.purchase-real-time {
|
|
|
+ position: relative;
|
|
|
}
|
|
|
-</style
|
|
|
->;
|
|
|
+</style>;
|
huangbin