<template>
  <div class="container">
    <component :menuItems="menuItems" :is="finalSideBar"></component>
    <!-- <el-main class="main_container"> -->
    <router-view></router-view>
    <!-- </el-main> -->
  </div>
</template>

<script>
import SiderBar from './SiderBar.vue'
import ReviewManagementDetailSideBar from '@/components/ReviewManagementDetailSideBar.vue'
export default {
  components: {
    SiderBar,
    ReviewManagementDetailSideBar
  },
  props:{
    menuItems:Array
  },
  computed: {
    finalSideBar() {
      return this.$route.path.startsWith('/main/reviewManagementDetail') ? 
              ReviewManagementDetailSideBar : 
              (this.menuItems?.length  > 0 ?  SiderBar : null)
    }
  }
}
</script>

<script setup>
  import {  reactive } from 'vue';

  // 评价管理 的 步骤公共信息 下发
  const evaluationManageStepData  = reactive({
    evaluationManageDetailName:'',  // 评价管理任务名称
    
    evaluationType:null,   // 评价方式  0-线上匿名，1-线下答卷，2-线上导入，3-线上实名


    isHeadTeacherInvolved:null,    //班主任是否参与评价
    isGenerateAccountByGender:null,  // 是否按男女生成评价账号
    isGenerateReviewCode:null,  //是否已生成评价码
    // 各个步骤的完成状态
    isFinishEvaluationData:null,  // 评价数据是否完成
    isFinishTeachingRelationship:null, // 授课关系是否完成
    isFinishQuestionnaireTemplate:null,  //问卷模板是否完成
    isFinishReviewAccount:null,  //评价账号是否完成
    isFinishParameterSetting:null,   //参数设置是否完成
    isFinishEvaluationProgress:null, //评价进度是否完成
    isFinsihGenerateAnalysis:null,  //生成分析是否完成
  })

</script>

<style scoped lang="scss">
.container {
    /* border:solid blue 2px; */

    flex: 1 1;
    position: relative;
    box-sizing: border-box;
    max-width: 100vw;
    width: 100vw;
    display: flex;
    justify-content: flex-start;
    height: calc(100vh - 60px);

  .main_container {
    /* border:solid blue 2px; */

    position: relative;
    flex: 1 1;
    padding: 20px;
    background: #F0F4FB;
    height: calc(100vh - 60px);
    overflow:auto;
  }
}

</style>