<!--场景库管理，包括自然驾驶、标准法规、交通事故、泛化四个场景库-->
<template>
  <div>
    <toolbarTab
      :isConnect="true"
      position="top"
      :subPageActiveName="subPageActiveName"
      :toolbarItem="subPageList"
      @toolbarClick="toolsControl"
    >
    </toolbarTab>
    <natural-driving-scene
      v-show="subPageActiveName === 1"
      :roadList="roadList"
      :infrastructureList="infrastructureList"
      :trafficConditionList="trafficConditionList"
      :selfBehaviorList="selfBehaviorList"
      :targetBehaviorList="targetBehaviorList"
      :naturalEnvironmentList="naturalEnvironmentList"
      :temporaryOperationList="temporaryOperationList"
    >
    </natural-driving-scene>
    <standard-regulation-simulation-scene
      v-show="subPageActiveName === 2"
      :regulationTypeList="regulationTypeList"
    >
    </standard-regulation-simulation-scene>
    <traffic-accident-simulation-scene
      v-show="subPageActiveName === 3"
      :selfDrivingList="selfDrivingList"
      :targetDrivingList="targetDrivingList"
      :selfReactionList="selfReactionList"
      :conflictBehaviorList="conflictBehaviorList"
      :conflictTypeList="conflictTypeList"
    >
    </traffic-accident-simulation-scene>
    <generalization-scene
      v-show="subPageActiveName === 4"
      :scenarioRoadTypeList="scenarioRoadTypeList"
    ></generalization-scene>
    <benchmark-scenario v-show="subPageActiveName === 5">
    </benchmark-scenario>
  </div>
</template>

<script>
import toolbarTab from '@/components/toolbar/toolbarTab'
import trafficAccidentSimulationScene from './trafficAccidentSimulationScene'
import naturalDrivingScene from './naturalDrivingScene'
import standardRegulationSimulationScene from './standardRegulationSimulationScene'
import generalizationScene from './generalizationScene'
import benchmarkScenario from './benchmarkScenario.vue'

export default {
  name: 'sceneLibraryManagement', // 场景库管理
  components: {
    toolbarTab,
    naturalDrivingScene,
    standardRegulationSimulationScene,
    trafficAccidentSimulationScene,
    generalizationScene,
    benchmarkScenario,
  },
  data() {
    return {
      subPageActiveName: 1,
      selfDrivingList: [],
      targetDrivingList: [],
      selfReactionList: [],
      conflictBehaviorList: [],
      conflictTypeList: [],
      roadList: [],
      infrastructureList: [],
      trafficConditionList: [],
      selfBehaviorList: [],
      targetBehaviorList: [],
      naturalEnvironmentList: [],
      temporaryOperationList: [],
      regulationTypeList: [],
      fileNameList: [],
      // scenarioWeatherList: [],
      scenarioRoadTypeList: [],
    }
  },
  computed: {
    subPageList() {
      return [
        {
          type: 'primary',
          plain: true,
          title: '自然驾驶场景',
          disabled: false,
          api: '',
          fromId: 1,
        },
        {
          type: 'primary',
          plain: true,
          title: '标准法规场景',
          disabled: false,
          api: '',
          fromId: 2,
        },
        {
          type: 'primary',
          plain: true,
          title: '交通事故场景',
          disabled: false,
          api: '',
          fromId: 3,
        },
        {
          type: 'primary',
          plain: true,
          title: '泛化场景模板',
          disabled: false,
          api: '',
          fromId: 4,
        },
        {
          type: 'primary',
          plain: true,
          title: '基准场景库',
          disabled: false,
          api: '',
          fromId: 5,
        },
      ]
    },
  },
  methods: {
    toolsControl(item) {
      this.subPageActiveName = item.fromId
    },
  },
  async mounted() {
    await this.$dicsListsInit({
      selfDrivingList: 'selfDriving',
      targetDrivingList: 'targetDriving',
      selfReactionList: 'selfReaction',
      conflictBehaviorList: 'conflictBehavior',
      conflictTypeList: 'conflictType',
      regulationTypeList: 'regulationType',
      // scenarioWeatherList: "scenarioWeather",
      scenarioRoadTypeList: 'scenarioRoadType',
    })

    await this.$dicsTreesInit({
      roadList: 'road',
      infrastructureList: 'infrastructure',
      trafficConditionList: 'trafficCondition',
      selfBehaviorList: 'selfBehavior',
      targetBehaviorList: 'targetBehavior',
      naturalEnvironmentList: 'naturalEnvironment',
      temporaryOperationList: 'temporaryOperation',
    })
  },
}
</script>

<style scoped lang="less">
.tabsBox {
  position: relative;
  overflow: hidden;

  .el-button {
    position: absolute;
    right: 40px;
    top: 45px;
  }
}
.myTabsBox {
  min-height: 99px;
}
/deep/ .el-tabs__nav .el-tabs__item {
  width: auto;
  padding: 0 10px;
}
</style>