Web_TracerMethodology/pages/mission-action/mission-action.vue

<template>
	<view class="mission-action-page">
		<!-- 指派改善任务 -->
		<component
		  :is="currentComponet"
		/>
	</view>
</template>

<script>
  import { mapState } from "vuex";
	import assignMission from './components/assign-mission.vue';
	import disagree from './components/disagree.vue'
	import personnel from './components/personnel.vue'
	import writeBack from './components/write-back.vue'
	import pdca from './components/pdca.vue'

	export default {
    computed: {
      ...mapState({
        missionDetails: state => state.mission.missionDetails
      })
    },
		data() {
			return {
				// 当前显示的组件
				currentComponet: 'write-back',
				compoentList: [
					{type: 1, name: '指派改善任务', component: 'assign-mission'},
					{type: 2, name: '原因', component: 'disagree'},
					{type: 3, name: '人员架构', component: 'personnel'},
					{type: 4, name: '改善回复', component: 'write-back'},
					{type: 5, name: 'PDCA', component: 'pdca'},
				]
			}
		},
		created() {
			// console.log(this.compoentList[0].component)
			// this.currentComponet = this.compoentList[0].component
		},
		methods: {

		},
		components: {
			assignMission,
			disagree,
			personnel,
			writeBack,
			pdca
		}
	}
</script>

<style lang="less">
	.mission-action-page {
		height: 100%;
	}
</style>