aside改用setup方式。
This commit is contained in:
parent
ddb57c8961
commit
1763154fa2
@ -2,7 +2,7 @@
|
|||||||
* @Author: Kane
|
* @Author: Kane
|
||||||
* @Date: 2023-01-04 11:30:33
|
* @Date: 2023-01-04 11:30:33
|
||||||
* @LastEditors: Kane
|
* @LastEditors: Kane
|
||||||
* @LastEditTime: 2023-02-05 10:47:17
|
* @LastEditTime: 2023-02-05 23:38:54
|
||||||
* @FilePath: /IT工具综合平台/src/layout/components/Aside.vue
|
* @FilePath: /IT工具综合平台/src/layout/components/Aside.vue
|
||||||
* @Description:
|
* @Description:
|
||||||
*
|
*
|
||||||
@ -12,7 +12,7 @@
|
|||||||
<el-scrollbar class="wrapper" height="400px">
|
<el-scrollbar class="wrapper" height="400px">
|
||||||
<el-menu id="side-bar" router :default-active="currentPath" background-color="#2f4156" text-color="#fff"
|
<el-menu id="side-bar" router :default-active="currentPath" background-color="#2f4156" text-color="#fff"
|
||||||
active-text-color="#ffd04b" :collapse="asideCollapse">
|
active-text-color="#ffd04b" :collapse="asideCollapse">
|
||||||
<template v-for="route in this.routers" :key="route.path">
|
<template v-for="route in routes" :key="route.path">
|
||||||
<template v-if="!route.hidden">
|
<template v-if="!route.hidden">
|
||||||
<template v-if="hasOnlyChild(route.children)">
|
<template v-if="hasOnlyChild(route.children)">
|
||||||
<!-- 当只有一个子路由时,直接渲染子路由 -->
|
<!-- 当只有一个子路由时,直接渲染子路由 -->
|
||||||
@ -46,19 +46,20 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
|
import { computed } from "vue";
|
||||||
|
import { useStore } from "vuex";
|
||||||
import { useRouter, useRoute } from "vue-router";
|
import { useRouter, useRoute } from "vue-router";
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: "LayoutAside",
|
name: "LayoutAside",
|
||||||
data()
|
setup()
|
||||||
{
|
{
|
||||||
return {
|
const router = useRouter();
|
||||||
routers: null,
|
const routes = router.getRoutes();
|
||||||
};
|
const store = useStore();
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
//用于判断一个路由是否只有一项子路由
|
//用于判断一个路由是否只有一项子路由
|
||||||
hasOnlyChild: function (children)
|
const hasOnlyChild = (children) =>
|
||||||
{
|
{
|
||||||
//防御验证
|
//防御验证
|
||||||
if (!children)
|
if (!children)
|
||||||
@ -78,27 +79,31 @@ export default {
|
|||||||
}
|
}
|
||||||
|
|
||||||
return false;
|
return false;
|
||||||
},
|
};
|
||||||
|
|
||||||
},
|
//计算变量
|
||||||
computed: {
|
|
||||||
//获取当前的路由
|
//获取当前的路由
|
||||||
currentPath()
|
const currentPath = computed(() =>
|
||||||
{
|
{
|
||||||
let path = useRoute().path;
|
let path = useRoute().path;
|
||||||
|
|
||||||
return path;
|
return path;
|
||||||
},
|
});
|
||||||
|
|
||||||
//获取导航栏是否折叠的标志
|
//获取导航栏是否折叠的标志
|
||||||
asideCollapse()
|
const asideCollapse = computed(() =>
|
||||||
{
|
{
|
||||||
return this.$store.state.app.ui.asideBarCollapse;
|
return store.state.app.ui.asideBarCollapse;
|
||||||
}
|
});
|
||||||
|
|
||||||
|
return {
|
||||||
|
router,
|
||||||
|
routes,
|
||||||
|
hasOnlyChild,
|
||||||
|
currentPath,
|
||||||
|
asideCollapse,
|
||||||
|
};
|
||||||
},
|
},
|
||||||
created()
|
|
||||||
{
|
|
||||||
this.routers = useRouter().options.routes;
|
|
||||||
}
|
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
@ -2,7 +2,7 @@
|
|||||||
* @Author: Kane
|
* @Author: Kane
|
||||||
* @Date: 2023-02-02 22:19:12
|
* @Date: 2023-02-02 22:19:12
|
||||||
* @LastEditors: Kane
|
* @LastEditors: Kane
|
||||||
* @LastEditTime: 2023-02-05 11:52:27
|
* @LastEditTime: 2023-02-05 23:05:12
|
||||||
* @FilePath: /IT工具综合平台/src/views/requirement/RequirementManager.vue
|
* @FilePath: /IT工具综合平台/src/views/requirement/RequirementManager.vue
|
||||||
* @Description:
|
* @Description:
|
||||||
*
|
*
|
||||||
@ -39,7 +39,7 @@
|
|||||||
<el-col :span="4">
|
<el-col :span="4">
|
||||||
<!-- <el-input v-model="query_param.status"></el-input> -->
|
<!-- <el-input v-model="query_param.status"></el-input> -->
|
||||||
<el-select multiple collapse-tags collapse-tags-tooltip v-model.trim.lazy="query_param.status">
|
<el-select multiple collapse-tags collapse-tags-tooltip v-model.trim.lazy="query_param.status">
|
||||||
<el-option v-for="option in statusData" :value="option.status_name" :key="option.status_code + option.status_name"></el-option>
|
<el-option v-for="option in statusData" :value="option.status_name" lable="option.status_code" :key="option.status_code + option.status_name"></el-option>
|
||||||
</el-select>
|
</el-select>
|
||||||
</el-col>
|
</el-col>
|
||||||
<el-col :span="6"></el-col>
|
<el-col :span="6"></el-col>
|
||||||
|
Loading…
x
Reference in New Issue
Block a user