PC-application/component/guidance/nav-tab.js

Vue.component('nav-tab', {
    template: '<div>\
	    			<div>\
		    			<ul class="nav-tab" style="height: 34px;">\
							<li @click="active(0)" :class="{\'active\': activeIdx == 0}">\
								个人模板\
							</li>\
							<li @click="active(1)" :class="{\'active\': activeIdx == 1}">\
								团队模板\
							</li>\
							<li @click="active(2)" :class="{\'active\': activeIdx == 2}">\
								系统模板\
							</li>\
						</ul>\
						<person-panel v-show="activeIdx==0" :activetemplate="activetemplate"></person-panel>\
						<team-panel v-show="activeIdx==1" :activetemplate="activetemplate"></team-panel>\
						<system-panel v-show="activeIdx==2" :activetemplate="activetemplate"></system-panel>\
	    			</div>\
					<div>\
						<div v-if="isLeader && activeIdx == 0" class="new-temp" @click="newPersonTemplate">\
							<img class="c-vam" src="../../../images/tianjia_pre.png" width="20" />\
							<span class="c-vam">新建指导模板</span>\
						</div>\
					</div>\
					<div>\
						<div v-if="isLeader && activeIdx == 1" class="new-temp" @click="newTeamTemplate">\
							<img class="c-vam" src="../../../images/tianjia_pre.png" width="20" />\
							<span class="c-vam">新建指导模板</span>\
						</div>\
					</div>\
    			</div>',
    props: [],
    data: function() {
        return {
        	activeIdx: 0,
        	activetemplate: null,
        	isLeader: storage.docInfo.isLeader
        }
    },
	created: function() {
		var vm = this
		EventBus.$on('active-template', function(template) {
			vm.activetemplate = template
		})
		EventBus.$on('active-nav-tab', function(idx) {
			vm.activeIdx = idx
		})
	},
    methods: {
        active: function(idx) {
        	this.activeIdx = idx
        },
        newPersonTemplate: function() {
        	var query = {
        		patient: storage.patient || "",
        		timestemp: $.now()
        	}
        	this.$router.push({path:'/person-new-panel',query:query})
        },
        newTeamTemplate: function() {
        	var query = {
        		patient: storage.patient || "",
        		timestemp: $.now()
        	}
        	this.$router.push({path:'/team-new-panel',query:query})
        }
    }
})