forked from TALL/tall3-pc-keti
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
115 lines
3.1 KiB
115 lines
3.1 KiB
<template>
|
|
<!-- <div class="task-detail">
|
|
<div class="task-con">任务详情页</div>
|
|
<div>
|
|
<router-view></router-view>
|
|
</div>
|
|
</div> -->
|
|
|
|
<a-config-provider :locale="locale">
|
|
<a-layout>
|
|
<a-layout-header style="background: #fff"> <TopNavbar /> </a-layout-header>
|
|
<a-layout>
|
|
<!-- 日历页-->
|
|
<a-layout-sider v-show="collapsed" style="background: #fff"><Left /></a-layout-sider>
|
|
|
|
<a-layout>
|
|
<Intro v-if="!projectId" />
|
|
|
|
<a-layout-sider v-if="projectId" class="project-detail"><ProjectDetail /></a-layout-sider>
|
|
|
|
<a-layout v-if="taskId">
|
|
<!-- 导航栏-->
|
|
<a-layout-header style="background: #fff">
|
|
<Navbar />
|
|
</a-layout-header>
|
|
<!-- 内容区-->
|
|
<a-layout-content><router-view></router-view></a-layout-content>
|
|
<!-- 脚部-->
|
|
<!-- <a-layout-footer>Footer</a-layout-footer>-->
|
|
</a-layout>
|
|
</a-layout>
|
|
</a-layout>
|
|
</a-layout>
|
|
</a-config-provider>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { computed, watch, ref } from 'vue';
|
|
import { useStore } from 'vuex';
|
|
// import { useRoute, useRouter } from 'vue-router';
|
|
import zhCN from 'ant-design-vue/es/locale/zh_CN';
|
|
import Left from 'components/tall/left/Index.vue';
|
|
import Navbar from 'components/tall/top/Navbar.vue';
|
|
import TopNavbar from 'components/tall/top/TopNavbar.vue';
|
|
import ProjectDetail from 'components/tall/center/ProjectDetail.vue';
|
|
import Intro from 'components/tall/right/Intro.vue';
|
|
|
|
const locale = zhCN;
|
|
const store = useStore();
|
|
const collapsed = computed(() => store.state.layout.display.left); // 是否显示左栏
|
|
|
|
const projectId = ref(null);
|
|
const project = computed(() => store.state.projects.project); // 项目信息
|
|
const sessionProjectId = sessionStorage.getItem('projectId');
|
|
projectId.value = sessionProjectId;
|
|
|
|
const taskId = ref(null);
|
|
const sessionTaskId = sessionStorage.getItem('taskId');
|
|
taskId.value = sessionTaskId;
|
|
const taskDetail = computed(() => store.state.task.taskDetail); // 任务信息
|
|
|
|
// 监听项目信息
|
|
watch(project, () => {
|
|
if (project.value) {
|
|
projectId.value = project.value.id;
|
|
} else {
|
|
projectId.value = null;
|
|
}
|
|
});
|
|
|
|
// 监听任务信息
|
|
watch(taskDetail, () => {
|
|
if (taskDetail.value) {
|
|
taskId.value = taskDetail.value.id;
|
|
} else {
|
|
taskId.value = null;
|
|
}
|
|
});
|
|
|
|
// 验证 获取query中u参数 获取token
|
|
// const route = useRoute();
|
|
// const router = useRouter();
|
|
// const userString = sessionStorage.getItem('user');
|
|
</script>
|
|
|
|
<style scoped>
|
|
.ant-layout {
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
|
|
.ant-layout-header {
|
|
height: 48px;
|
|
line-height: 48px;
|
|
padding: 0 16px;
|
|
border-bottom: 1px solid #cccccc;
|
|
}
|
|
|
|
.ant-layout-sider {
|
|
width: 300px !important;
|
|
max-width: 300px !important;
|
|
min-width: 300px !important;
|
|
border-right: 1px solid #cccccc;
|
|
flex: 0 0 300px !important;
|
|
}
|
|
|
|
.project-detail {
|
|
width: 400px !important;
|
|
max-width: 400px !important;
|
|
min-width: 400px !important;
|
|
border-right: 1px solid #cccccc;
|
|
flex: 0 0 400px !important;
|
|
background: #fff;
|
|
}
|
|
</style>
|
|
|