1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859 |
- <!--
- * @Author: jixiang
- * @Date: 2021-08-14 10:17:45
- * @Description: nav
- * @FilePath: /book_account/src/layout/Lefter.vue
- * One World One Drefeel(56580223@qq.com)
- -->
- <template>
- <div class="left_Navigation">
- <a-menu
- v-model:selectedKeys="state.selectedKeys"
- mode="inline"
- :theme="state.theme"
- @click="onClick"
- >
- <a-menu-item key="/bookManage"> 图书管理</a-menu-item>
- </a-menu>
- </div>
- </template>
- <script lang="ts" setup>
- import { WalletOutlined } from '@ant-design/icons-vue';
- import { defineComponent, reactive } from 'vue';
- import { useRouter, useRoute } from 'vue-router';
- const state = reactive({
- theme: 'light',
- selectedKeys: ['/bookManage'],
- });
- const router = useRouter();
- const routers = useRoute();
- function goToPage(path, pathName) {
- router.push({
- path: path,
- });
- }
- const onClick = (e) => {
- console.log(e, routers);
- router.push({
- path: e.key,
- });
- };
- </script>
- <style lang="less" scoped>
- .left_Navigation {
- background: #fff;
- border-right: 1px solid #f0f0f0;
- height: calc(100vh - 6.4rem);
- padding-top: 2rem;
- // position: fixed;
- width: 20rem;
- .item {
- cursor: pointer;
- height: 40px;
- line-height: 40px;
- text-align: center;
- }
- }
- </style>
|