<template>
    <!-- 项目结项 项目基本内容 -->
      <div class="projectSettlement">
  
          <!-- 详情页 -->
        <div class="vfpHeader">
            <div class="titleOne">项目管理</div>
            <div class="smallTitle" style="left: 100px;">项目详情</div>
            <el-button type="primary" @click="$router.back()">返回</el-button>
        </div>
        <hr>
        <div class="AppBar">
            <div @click="pageState=0">项目基本内容<div v-if="pageState==0" class="pr1TitBass"></div></div>
            <div @click="pageState=1">项目详情<div v-if="pageState==1" class="pr1TitBass"></div></div>
            <div @click="pageState=2">项目附件<div v-if="pageState==2" class="pr1TitBass"></div></div>
            <div @click="pageState=3">项目结题附件<div v-if="pageState==3" class="pr1TitBass"></div></div>
            <div @click="pageState=4">结项评语<div v-if="pageState==4" class="pr1TitBass"></div></div>
        </div>
        <!-- 特色创客空间建设 -->
        <projectSettlementDetailBase_MakerSpace v-if="pageState==0 && $route.query['tid']=='5f7a66d5-c206-11ed-a4cd-509a4c5b67cf'"/>
        <projectSettlementDetail_MakerSpace v-if="pageState==1 && $route.query['tid']=='5f7a66d5-c206-11ed-a4cd-509a4c5b67cf'"/>
        
        <!-- 学生创业项目 -->
        <projectSettlementDetailBase_StudentVue v-if="pageState==0 && $route.query['tid']=='5e21b204-c206-11ed-a4cd-509a4c5b67cf'" ></projectSettlementDetailBase_StudentVue>
        <projectSettlementDetail_Student v-if="pageState==1 && $route.query['tid']=='5e21b204-c206-11ed-a4cd-509a4c5b67cf'"></projectSettlementDetail_Student>

        <!-- 项目附件 -->
        <projectSettlementDetailAnnex v-if="pageState==2"/>
        <!-- 项目结题附件 -->
        <projectSettlementDetailConclusion v-if="pageState==3"/>
        <!-- 项目评语 -->
        <projectSettlementDetailComment v-if="pageState==4"/>
      </div>
    </template>
    
    <script>
    //学生创业项目
    import projectSettlementDetailBase_StudentVue from './components/projectSettlementDetailBase_Student.vue';
    import projectSettlementDetail_Student from './components/projectSettlementDetail_Student.vue'

    //特色创客空间建设项目
    import projectSettlementDetailBase_MakerSpace from './components/projectSettlementDetailBase_MakerSpace.vue';
    import projectSettlementDetail_MakerSpace from './components/projectSettlementDetail_MakerSpace.vue';

    //共同的项目附件
    import projectSettlementDetailAnnex from './components/projectSettlementDetailAnnex.vue';
    import projectSettlementDetailConclusion from './components/projectSettlementDetailConclusion.vue';
    import projectSettlementDetailComment from './components/projectSettlementDetailComment.vue';
        export default {
        components:{
            projectSettlementDetailBase_MakerSpace,
            projectSettlementDetail_MakerSpace,
            projectSettlementDetailAnnex,
            projectSettlementDetailConclusion,
            projectSettlementDetailComment,
            projectSettlementDetailBase_StudentVue,
            projectSettlementDetail_Student
        },
        data() {
          return {
            pageState:0,
          }
        },
        methods:{
         
        },
        mounted(){
            console.log(this.$route)
        }
        }
    </script>
    
    <style lang="less">
    .projectSettlement{
      .psSmallTit{
          width: 100%;
          margin: 15px 0px 20px 0px;
          text-align: left;
          font-size: 16px;
      }
    }
    .projectApplicationfundAddDialog{  
   
   .el-dialog__header{
       background: #32455b;
  
   }
   .el-dialog{
     border-radius:5px ;
     overflow: hidden;
   }
   
   .deleteContent{
     width: 100%;
     text-align: center;
     font-size: 22px;
     color: #000;
   }
   .addDialogLogo{
           width: 60px;
           height: 30px;
           border-radius: 5px;
           display: flex;
           justify-content: center;
           line-height: 30px;
           background: #f2f2f2;
           position: absolute;
           left: 20px; top: 15px; 
   }
  
   .el-dialog__title{
           color:#fff;
           display: flex;
           justify-content: center;
           font-size: 18px;
           position: relative;
           top: -2px;
   }
   .addDialogMid{
     box-sizing: border-box;
     padding:0 60px 0 10px;
     .addDialogTit{
       display: flex;
       span{
         width: 80px;
         line-height: 40px;
         text-align: left;
       }
     }
   .addDialogTit1{
     display: flex;
     justify-content: space-between;
     margin-bottom: 15px;
   }
   .addDialogTit2{
     margin-top: 10px;
     font-size: 18px;
     color: #000;
     text-indent: 2em;
   }
   .addDialogCon{
     margin-top: 20px;
   }
   }
   .dialog-footer{
   display: flex;
   justify-content: center;
  
   }
  }
    </style>