up

src/components/Subject.vue

@@ -7,15 +7,24 @@
     }
 </style>
 <template>
-    <el-cascader v-if='value' class="sub" :props='props' clearable
-    placeholder="请选择培训科目 / 作业类别 / 准操项目"
-    v-model="value1" @change="handleChange"
-    :options="data"></el-cascader>
-    <el-cascader v-else class="sub" :props='props1' clearable
-    placeholder="请选择培训科目 / 作业类别 / 准操项目"
-    v-model="value1" @change="handleChange"
-    :options="data"></el-cascader>
-</template>
+    <span v-if='!subject_id'>
+        <el-cascader v-if='value' class="sub" :props='props' clearable
+        placeholder="请选择培训科目 / 作业类别 / 准操项目"
+        v-model="value1" @change="handleChange"
+        :options="data"></el-cascader>
+        <el-cascader v-else class="sub" :props='props1' clearable
+        placeholder="请选择培训科目 / 作业类别 / 准操项目"
+        v-model="value1" @change="handleChange"
+        :options="data"></el-cascader>
+    </span>
+    <span v-else>
+        <el-cascader class="sub" :props='props1' clearable
+        placeholder="请选择作业类别 / 准操项目"
+        v-model="value1" @change="handleChange"
+        :options="data">
+        </el-cascader>
+    </span>
+</template>   
 <script>
 export default {
     data(){
@@ -36,12 +45,23 @@ export default {
     },
     props: {
         value:'',
-        subvalue:''
+        subvalue:'',
+        subject_id:''
     },
     methods:{
         getData(type){
             this.$api.getSubList().then(res=>{
-              this.data=res.data.data
+                let data=res.data.data;
+                if(this.subject_id){
+                    for(let i=0;i<data.length;i++){
+                        if(data[i].id == this.subject_id){
+                            this.data=data[i].children
+                        }
+                    }
+                }else{
+                    this.data=res.data.data
+                }
+              
           })
         },
         handleChange(value) {
@@ -63,7 +83,6 @@ export default {
         if(this.subvalue){
             this.value1=this.subvalue.split('|')
         }
-        console.log(this.value1)
     }
 }
 </script>

src/router.js

@@ -46,9 +46,9 @@ export default new Router({
       show:1,
       isLeaf:0,
       children:[
-        { path: '/new', component: () => import('./views/apply/New.vue'), name: '新办' },
-        { path: '/update', component: () => import('./views/apply/Update.vue'), name: '复审' },
-        { path: '/change', component: () => import('./views/apply/Change.vue'), name: '换证' },
+        { path: '/new/*', component: () => import('./views/apply/New.vue'), name: '新办' },
+        { path: '/update/*', component: () => import('./views/apply/Update.vue'), name: '复审' },
+        { path: '/change/*', component: () => import('./views/apply/Change.vue'), name: '换证' },
         { path: '/sign/detail',hide:1, component: () => import('./views/apply/Detail.vue'), name: '修改' },
         { path: '/sign/edit',hide:1, component: () => import('./views/apply/Edit.vue'), name: '修改' },
       ]

src/style/home.scss

@@ -69,6 +69,9 @@ $height: 50px;
 		.el-menu-item-group__title{
 			padding: 0;
 		}
+		.child{
+			padding-left: 60px !important;
+		}
 		// .el-menu-item{
 		// 	height: 44px;
 		// 	line-height: 44px;

src/views/Home.vue

@@ -24,28 +24,38 @@
 		<el-container class="main">
 			<!-- 左侧菜单 -->
 			<el-aside class="left-aside" width="210px">
-           <el-menu  :default-active="$route.path" router class="left-menue" active-text-color="#ffffff">
+           <el-menu :unique-opened='true'  :default-active="$route.path" router class="left-menue" active-text-color="#ffffff">
             <template v-for="(item, index) in $router.options.routes">
-              <el-menu-item v-if='item.show&&item.isLeaf' :index="item.path"  :key='index'>
-                <i :class="item.icon"></i>
-                <span slot="title">{{item.name}}</span>
-              </el-menu-item>
-              <el-submenu v-if='item.show&&!item.isLeaf' :index="'index_'+index"  :key='index'>
-                <template slot="title">
-                  <i :class="item.icon"></i>
-                  <span>{{item.name}}</span>
-                </template>
-                <el-menu-item-group v-if='item.change'>
-                  	<el-menu-item v-for="(child,idx) in menu" :key="index+'_'+idx" :index="child.path" v-show='!child.hide'>
-					  {{child.name}}
+            	<template v-if="index != 3">
+					<el-menu-item v-if='item.show&&item.isLeaf' :index="item.path"  :key='index'>
+						<i :class="item.icon"></i>
+						<span slot="title">{{item.name}}</span>
 					</el-menu-item>
-                </el-menu-item-group>
-				<el-menu-item-group v-else>
-                  	<el-menu-item v-for="(child,idx) in item.children" :key="index+'_'+idx" :index="child.path" v-show='!child.hide'>
-					  {{child.name}}
-					</el-menu-item>
-                </el-menu-item-group>
-              </el-submenu>
+					<el-submenu v-if='item.show&&!item.isLeaf' :index="'index_'+index"  :key='index'>
+						<template slot="title">
+						<i :class="item.icon"></i>
+						<span>{{item.name}}</span>
+						</template>
+						<el-menu-item-group>
+							<el-menu-item class="child" v-for="(child,idx) in item.children" :key="index+'_'+idx" :index="child.path" v-show='!child.hide'>
+							{{child.name}}
+							</el-menu-item>
+						</el-menu-item-group>
+					</el-submenu>
+			  	</template>
+				<template v-else>
+					<el-submenu v-for="(sub,id) in menu" :index="'index_'+index+'_'+id"  :key='index+"_"+id'>
+						<template slot="title">
+						<i :class="sub.icon"></i>
+						<span>{{sub.name}}</span>
+						</template>
+						<el-menu-item-group>
+							<el-menu-item class="child" v-for="(child,idx) in sub.children" :key="index+'_'+idx" :index="child.path">
+							{{child.name}}
+							</el-menu-item>
+						</el-menu-item-group>
+					</el-submenu>
+				</template>
             </template>
           </el-menu>
 			</el-aside>
@@ -89,9 +99,14 @@ export default {
 			  let path=[]
 			  for(let i=0;i<data.length;i++){
 				  path.push({
-					  	path: '/subject?id='+data[i].id,
-						// component: () => import('./views/project/Index.vue'),
-						name: data[i].name
+					  	path: '/',
+						name: data[i].name,
+						icon:'el-icon-document-checked',
+						children:[
+							{ path: '/new/'+data[i].id,  name: '新办'},
+							{ path: '/update/'+data[i].id,  name: '复审'},
+							{ path: '/change/'+data[i].id,  name: '换证'},
+						]
 				  })
 			  }
 			  this.menu=path
@@ -101,6 +116,7 @@ export default {
 	$route(to){
     },
 	created(){
+		console.log(this.$route)
 		this.getData()
 	}
 };

src/views/apply/Change.vue

@@ -46,12 +46,12 @@
 </style>
 <template>
     <section class="apply">
-        <p>报名信息  >  换证</p>
+        <p>报名列表 > {{subject_item}} > 换证</p>
         <div class="filter">
             <el-form label-width="75px" :inline="true" size="small">
                 <!-- <el-divider></el-divider> -->
                 <el-form-item label="培训项目">
-                    <Subject @subChange='subChange'/>
+                    <Subject v-if='subject_id' @subChange='subChange' :subject_id='subject_id' />
                 </el-form-item>
                 <el-form-item label="姓名" label-width="40px">
                         <el-input placeholder="姓名" v-model="form.name"></el-input>
@@ -249,7 +249,9 @@ export default {
       ids:[],
       dialogVisible:false,
       url:'',
-      loading:false
+      loading:false,
+      subject_id:'',
+      subject_item:''
     }
   },
   methods:{
@@ -287,7 +289,8 @@ export default {
           })
       },
       subChange(data){
-          this.form.subject_item=data.join('|')
+          this.form.subject_item=this.subject_item+'|'+data.join('|');
+          this.getData();
       },
       tabClick(tab){
           this.form.order_status=tab.name
@@ -457,7 +460,17 @@ export default {
       }
   },
   created(){
-      this.getData()
+      this.subject_id=this.$route.path.split('/')[2]
+      this.$api.getSubList().then(res=>{
+          let data=res.data.data;
+            for(let i=0;i<data.length;i++){
+                if(data[i].id == this.subject_id){
+                    this.subject_item=data[i].name
+                    this.form.subject_item=data[i].name
+                }
+            }
+            this.getData()
+      })
   }
 }
 </script>

src/views/apply/New.vue

@@ -46,12 +46,12 @@
 </style>
 <template>
     <section class="apply">
-        <p>报名信息  >  新办</p>
+        <p>报名列表 > {{subject_item}} > 新办</p>
         <div class="filter">
             <el-form label-width="75px" :inline="true" size="small">
                 <!-- <el-divider></el-divider> -->
                 <el-form-item label="培训项目">
-                    <Subject @subChange='subChange'/>
+                    <Subject v-if='subject_id' @subChange='subChange' :subject_id='subject_id' />
                 </el-form-item>
                 <el-form-item label="姓名" label-width="40px">
                         <el-input placeholder="姓名" v-model="form.name"></el-input>
@@ -249,7 +249,9 @@ export default {
       ids:[],
       dialogVisible:false,
       url:'',
-      loading:false
+      loading:false,
+      subject_id:'',
+      subject_item:''
     }
   },
   methods:{
@@ -287,7 +289,8 @@ export default {
           })
       },
       subChange(data){
-          this.form.subject_item=data.join('|')
+          this.form.subject_item=this.subject_item+'|'+data.join('|');
+          this.getData();
       },
       tabClick(tab){
           this.form.order_status=tab.name
@@ -457,7 +460,17 @@ export default {
       }
   },
   created(){
-      this.getData()
+      this.subject_id=this.$route.path.split('/')[2]
+      this.$api.getSubList().then(res=>{
+          let data=res.data.data;
+            for(let i=0;i<data.length;i++){
+                if(data[i].id == this.subject_id){
+                    this.subject_item=data[i].name
+                    this.form.subject_item=data[i].name
+                }
+            }
+            this.getData()
+      })
   }
 }
 </script>

src/views/apply/Update.vue

@@ -46,12 +46,12 @@
 </style>
 <template>
     <section class="apply">
-        <p>报名信息  >  复审</p>
+        <p>报名列表 > {{subject_item}} > 复审</p>
         <div class="filter">
             <el-form label-width="75px" :inline="true" size="small">
                 <!-- <el-divider></el-divider> -->
                 <el-form-item label="培训项目">
-                    <Subject @subChange='subChange'/>
+                    <Subject v-if='subject_id' @subChange='subChange' :subject_id='subject_id' />
                 </el-form-item>
                 <el-form-item label="姓名" label-width="40px">
                         <el-input placeholder="姓名" v-model="form.name"></el-input>
@@ -249,7 +249,9 @@ export default {
       ids:[],
       dialogVisible:false,
       url:'',
-      loading:false
+      loading:false,
+      subject_id:'',
+      subject_item:''
     }
   },
   methods:{
@@ -287,7 +289,8 @@ export default {
           })
       },
       subChange(data){
-          this.form.subject_item=data.join('|')
+          this.form.subject_item=this.subject_item+'|'+data.join('|');
+          this.getData();
       },
       tabClick(tab){
           this.form.order_status=tab.name
@@ -457,7 +460,17 @@ export default {
       }
   },
   created(){
-      this.getData()
+      this.subject_id=this.$route.path.split('/')[2]
+      this.$api.getSubList().then(res=>{
+          let data=res.data.data;
+            for(let i=0;i<data.length;i++){
+                if(data[i].id == this.subject_id){
+                    this.subject_item=data[i].name
+                    this.form.subject_item=data[i].name
+                }
+            }
+            this.getData()
+      })
   }
 }
 </script>

src/views/project/Index.vue

@@ -223,8 +223,8 @@ export default {
   created(){
         if(this.$route.query.id){
             this.id=this.$route.query.id
-            this.getData()
         }
+        this.getData()
   }
 }
 </script>