<template>
  <!-- 现货合同 -->
  <div class="spot-contract">
    <firstMenu :list="list"
               :value="'value'"
               @selectMenu="selectMenu" />
    <router-view />
  </div>
</template>

<script lang="ts">
import { defineComponent } from 'vue';
import firstMenu from '@/components/firstMenu/index.vue';
import { useRouter } from 'vue-router';

// 处理菜单
function handleMenu() {
    const router = useRouter();
    const list = [
        { key: 'spot_contract-not-commit', value: '未提交' },
        { key: 'spot_contract-peddding', value: '待审核' },
        { key: 'spot_contract-performance', value: '履约中' },
        { key: 'spot_contract-done', value: '已完成' },
    ];
    function selectMenu(item: any) {
        router.push({ name: item.key });
    }
    return { list, selectMenu };
}

export default defineComponent({
    name: 'spot-contract',
    components: {
        firstMenu,
    },
    setup() {
        const { list, selectMenu } = handleMenu();
        return { list, selectMenu };
    },
});
</script>

<style lang="less">
.spot-contract {
}
</style>;
