<template>
    <contextMenu :contextMenuList="context" :tableList="dataSource">
        <a-table
            class="quote-table"
            :columns="columns"
            :data-source="dataSource"
            bordered
            :pagination="false"
            :scroll="{ x: '100%', y: '261px' }"
        >
            <template #action>
                <a>action</a>
            </template>
        </a-table>
    </contextMenu>
</template>
<script lang="ts">
import { defineComponent, ref } from 'vue';
import contextMenu from '@/common/components/contextMenu/index.vue';
import { MenuItem } from '@/common/components/contextMenu/interface';

export default defineComponent({
    components: {
        contextMenu,
    },
    props: {
        columns: {
            default: [],
            type: Array,
        },
        dataSource: {
            default: [],
            type: Array,
        },
    },
    setup(props) {
        const contextMenuList = ref<MenuItem[]>([
            {
                lable: '修改',
                callback: () => {},
            },
        ]);
        return {
            contextMenuList,
        };
    },
});
</script>
<style lang="less">
.quoteTable {
    width: 100%;
    // max-height: calc(100% - 68px);
    flex: 1;
}
.quote-table {
    height: 261px;
    .ant-spin-nested-loading {
        .ant-spin-container {
        }
    }
    .ant-table td {
        white-space: nowrap;
    }
    .ant-table-thead {
        .ant-table-fixed-columns-in-body {
            width: 100px;
        }
    }
    .ant-table-fixed,
    .ant-table-body {
        .ant-table-row-hover {
            td.ant-table-row-cell-break-word {
                background-color: @m-blue3 !important;
            }
        }
    }
}
</style
>;
