69 lines
1.5 KiB
Vue
69 lines
1.5 KiB
Vue
<template>
|
|
<view>
|
|
<u-tabs :list="tabList" class='tabs' @change="activedIndexChanged"></u-tabs>
|
|
<view class="sized-box"></view>
|
|
<ProjectDetailHome v-if="activedIndex==0"></ProjectDetailHome>
|
|
<ProjectProgress v-else-if="activedIndex==1"> </ProjectProgress>
|
|
<QualityManage v-else-if="activedIndex==2"> </QualityManage>
|
|
<view v-else>
|
|
<text>Lorem ipsum dolor sit amet consectetur adipisicing elit. Velit dolor similique molestiae, nostrum
|
|
ducimus provident aperiam consequuntur adipisci id in impedit rem officiis ipsam alias error! Ipsam
|
|
facere numquam omnis.</text>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import ProjectDetailHome from './project_detail_home/project_detail_home.vue'
|
|
import ProjectProgress from './project_progress/project_progress.vue'
|
|
import QualityManage from './quality_manage/quality_manage.vue'
|
|
export default {
|
|
name: 'ProjectHome',
|
|
components: {
|
|
ProjectDetailHome,
|
|
ProjectProgress,
|
|
QualityManage
|
|
},
|
|
data() {
|
|
return {
|
|
activedIndex: 2,
|
|
tabList: [{
|
|
name: '主页'
|
|
}, {
|
|
name: '进度管理'
|
|
},
|
|
{
|
|
name: '质量管理'
|
|
},
|
|
{
|
|
name: '安全管理'
|
|
},
|
|
|
|
]
|
|
}
|
|
},
|
|
methods: {
|
|
activedIndexChanged(item) {
|
|
this.activedIndex = item.index;
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
<style>
|
|
page {
|
|
background-color: #f6f6f6;
|
|
}
|
|
</style>
|
|
<style lang="scss" scoped>
|
|
.tabs {
|
|
position: fixed;
|
|
width: 100%;
|
|
z-index: 99;
|
|
background-color: white;
|
|
}
|
|
|
|
.sized-box {
|
|
height: 88rpx;
|
|
}
|
|
</style>
|