nodejs vue-admin-template-master(實訓56)

#實訓5

#學生管理篇(可將學校、學院、班級與學生關聯(lián)起來)

#一、從后端(projectName)添加學生模塊

##1、在models目錄下添加student.js:

projectName/db/models/student.js:

```

const mongoose = require('mongoose')

const Schema= mongoose.Schema

const feld={

???name: String,

???//人物標簽

???age:Number,

???student_number: Number,

???gender:String,

???school : { type: Schema.Types.ObjectId, ref: 'School' },

???academy : { type: Schema.Types.ObjectId, ref: 'Academy' },

???classs : { type: Schema.Types.ObjectId, ref: 'Classs' }

}

//自動添加更新時間創(chuàng)建時間:

let personSchema = new mongoose.Schema(feld,{timestamps: {createdAt: 'created', updatedAt: 'updated'}})

module.exports=mongoose.model('Student',personSchema)

```

##2、在routes目錄下添加student.js:

projectName/routes/student.js:

```

const router = require('koa-router')()

let Model = require("../db/models/student");

router.prefix('/student')


router.get('/', function (ctx, next) {

???ctx.body = 'this is a users response!'

})


router.post('/add', async function (ctx,next) {

???console.log(ctx.request.body)

???let model = new Model(ctx.request.body);

???model = await model.save();

???console.log('user',model)

???ctx.body = model

})


router.post('/find', async function (ctx,next) {

???let models = await Model.

???find({}).populate('classs').populate('academy').populate('school')

???ctx.body = models

})


router.post('/get', async function (ctx,next) {

???// let users = await User.

???// find({})

???console.log(ctx.request.body)

???let model = await Model.find(ctx.request.body)

???console.log(model)

???ctx.body = model

})


router.post('/update', async function (ctx,next) {

???console.log(ctx.request.body)

???let pbj = await Model.update({ _id: ctx.request.body._id },ctx.request.body);

???ctx.body = pbj

})

router.post('/delete', async function (ctx,next) {

???console.log(ctx.request.body)

???await Model.remove({ _id: ctx.request.body._id });

???ctx.body = 'shibai '

})

module.exports = router

```


##3、在app.js中加上student模塊的路由:

projectName/app.js:

```

const Koa = require('koa')

const app = new Koa()

const views = require('koa-views')

const json = require('koa-json')

const onerror = require('koa-onerror')

const bodyparser =require('koa-bodyparser')

const logger = require('koa-logger')



const mongoose = require('mongoose')

const dbconfig = require('./db/config')

mongoose.connect(dbconfig.dbs,{useNewUrlParser:true,useUnifiedTopology: true})

const db = mongoose.connection

db.on('error',console.error.bind(console,'connectionerror:'));

db.once('open',function () {

?console.log('mongoose連接成功')

});

// error handler

onerror(app)


// middlewares

app.use(bodyparser({

?enableTypes:['json', 'form', 'text']

}))

app.use(json())

app.use(logger())

app.use(require('koa-static')(__dirname +'/public'))


app.use(views(__dirname + '/views', {

?extension: 'pug'

}))


// logger

app.use(async (ctx, next) => {

?const start = new Date()

?await next()

?const ms = new Date() - start

?console.log(`${ctx.method} ${ctx.url} - ${ms}ms`)

})



// routes

const index = require('./routes/index')

app.use(index.routes(), index.allowedMethods())

const users = require('./routes/users')

app.use(users.routes(),users.allowedMethods())

const school = require('./routes/school')

app.use(school.routes(),school.allowedMethods())

const academy = require('./routes/academy')

app.use(academy.routes(),academy.allowedMethods())

const classs = require('./routes/classs')

app.use(classs.routes(),classs.allowedMethods())

const student = require('./routes/student')

app.use(student.routes(),student.allowedMethods())

// error-handling





app.on('error', (err, ctx) => {

?console.error('server error', err, ctx)

});


module.exports = app

```

#二、從前端(vue-admin-template)添加學生模塊

##1、在src/views目錄下添加student目錄(模塊)

![student模塊](https://upload-images.jianshu.io/upload_images/23950256-6ef697e3654c21d1.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)

在student目錄下添加editor.vue:


vue-admin-template/src/views/student/editor.vue:

```







???????????v-for="item in schools"

???????????:key="item._id"

???????????:label="item.name"

???????????:value="item._id">








???????????v-for="item in academys"

???????????:key="item._id"

???????????:label="item.name"

???????????:value="item._id">








???????????v-for="item in classs"

???????????:key="item._id"

???????????:label="item.name"

???????????:value="item._id">


















???????立即創(chuàng)建

???????取消





?import { mapGetters } from 'vuex'


?export default {

???name: 'student',

???computed: {

?????...mapGetters([

???????'name'

?????])

???},

???data(){

?????return{

???????schools:[],

???????academys:[],

???????classs:[],

???????//列表內(nèi)容

???????options: [

???????],

???????apiModel:'student',

???????form:{}

?????}

???},

???methods:{

?????onSubmit(){

???????if(this.form._id){

?????????this.$http.post(`/api/${this.apiModel}/update`,this.form).then(res =>{

???????????console.log('bar:', res)

???????????this.$router.push({path:this.apiModel})

???????????this.form={}

????????? })

???????}else

???????{

?????????this.$http.post('/api/'+this.apiModel+'/add',this.form).then(res => {

???????????console.log('bar:', res)

???????????this.$router.push({path:this.apiModel})

???????????this.form={}

?????????})

???????}

?? ???},

?????schoolChange(val1){

???????//顯示學院選擇欄目

???????this.$http.post('/api/academy/get',{school:val1}).then(res => {

?????????if(res&&res.length>0){

???????????this.academys = res

???????????console.log('res:', res)

?????????}

???????})

?????}

???},

???mounted() {

?????if(this.$route.query._id){

???????this.$http.post('/api/'+this.apiModel+'/get',{_id:this.$route.query._id}).then(res=> {

?????????if(res&&res.length>0){

???????????this.form = res[0]

???????????this.schoolChange(this.form.school)

?????????}

???????})

?????}


?????//顯示學校選擇欄目

?????this.$http.post('/api/school/find').then(res => {

???????if(res&&res.length>0){

?????????this.schools = res

?????????console.log('res:', res)

???????}

?????})


?????//顯示班級欄目

???? ?this.$http.post('/api/classs/find').then(res=> {

???????if(res&&res.length>0){

?????????this.classs = res

?????????console.log('res:', res)

???????}

?????})

??? }

? }


?.dashboard {

???&-container {

?????margin: 30px;

??? }

???&-text {

?????font-size: 30px;

?????line-height: 46px;

??? }

? }

```

在student目錄下添加index.vue:

vue-admin-template/src/views/student/index.vue:

```



?????:data="users"

?????style="width: 100%"

?????:row-class-name="tableRowClassName">


???????prop="name"

???????label="名字"

???????width="180">



???????prop="age"

???????label="年齡"

???????width="180">



???????prop="student_number"

???????label="學號">



???????prop="gender"

???????label="性別">



?????-->


???????prop="school"

???????label="學校名稱"

???????width="180">




?????????????:type="scope.row.school.name === '深圳信息職業(yè)技術學院' ? 'primary' : 'success'"

?????????????disable-transitions>{{scope.row.school.name}}






???????prop="academy"

???????label="學院名稱"

???????width="180">




?????????????:type="scope.row.academy.name === '軟件學院' ?'primary' : 'success'"

????????????? disable-transitions>{{scope.row.academy.name}}






???????prop="classs"

???????label="班級名稱"

???????width="180">




????????????? :type="scope.row.classs.name=== '18軟工4-3' ? 'primary' : 'success'"

?????????????disable-transitions>{{scope.row.classs.name}}








???????????size="mini"

???????????@click="handleEdit(scope.$index, scope.row)">編輯



???????????size="mini"

???????????type="danger"

???????????@click="handleDelete(scope.$index, scope.row)">刪除







?import { mapGetters } from 'vuex'


?export default {

???name: 'student',

???computed: {

?????...mapGetters([

???????'name'

?????])

???},

???data() {

?????return {

???????apiModel:'student',

???????users: {}

?????}

???},

???methods: {

?????onSubmit() {

???????console.log(123434)

?????},

?????handleEdit(index, item) {

???????this.$router.push({ path: '/'+this.apiModel+'/editor', query:{_id:item._id} })

?????},

?????handleDelete(index, item) {

???????this.$http.post('/api/'+this.apiModel+'/delete', item).then(res => {

?????????console.log('res:', res)

?????????this.findUser()

???????})


?????},

?????findUser(){

???????this.$http.post('/api/'+this.apiModel+'/find', this.user).then(res =>{

?????????console.log('res:', res)

????????? this.users = res

???????})

?????}

???},

???mounted() {

?????this.findUser()

??? }

? }


?.dashboard {

???&-container {

?????margin: 30px;

??? }


???&-text {

?????font-size: 30px;

?????line-height: 46px;

??? }

? }

```

#2、在router下的index.js中添加student模塊的路由:

vue-admin-template/src/router/index.js:

```

import Vue from 'vue'

import Router from 'vue-router'


Vue.use(Router)


/* Layout */

import Layout from '@/layout'


/**

?*Note: sub-menu only appear when route children.length >= 1

?*Detail see:https://panjiachen.github.io/vue-element-admin-site/guide/essentials/router-and-nav.html

?*

?*hidden: true?????????????????? if settrue, item will not show in the sidebar(default is false)

?*alwaysShow: true?????????????? if settrue, will always show the root menu

?*??????????????????????????????? if not setalwaysShow, when item has more than one children route,

?*??????????????????????????????? it will becomesnested mode, otherwise not show the root menu

?*redirect: noRedirect?????????? if setnoRedirect will no redirect in the breadcrumb

?*name:'router-name'???????????? the nameis used by (must set!!!)

?*meta : {

???roles: ['admin','editor']???control the page roles (you can set multiple roles)

???title: 'title'?????????????? thename show in sidebar and breadcrumb (recommend set)

???icon: 'svg-name'???????????? theicon show in the sidebar

???breadcrumb: false??????????? ifset false, the item will hidden in breadcrumb(default is true)

???activeMenu: '/example/list'? ifset path, the sidebar will highlight the path you set

? }

?*/


/**

?*constantRoutes

?* abase page that does not have permission requirements

?*all roles can be accessed

?*/

export const constantRoutes = [

? {

???path: '/login',

???component: () => import('@/views/login/index'),

???hidden: true

? },


? {

???path: '/school',

???component: Layout,

???meta: { title: '學校管理', icon: 'example' },

???redirect: 'school',

???children: [{

?????path: 'school',

?????name: 'school',

?????component: () => import('@/views/school/index'),

?????meta: { title: '學校管理', icon: 'school' }

???},

?????{

???????path: 'editor',

???????name: 'editor',

???????component: () => import('@/views/school/editor'),

???????meta: { title: '添加學校', icon: 'school' }

?????}]

? },


? {

???path: '/academy',

???component: Layout,

???meta: { title: '學院管理', icon: 'example' },

???redirect: 'academy',

???children: [{

?????path: 'academy',

?????name: 'academy',

?????component: () => import('@/views/academy/index'),

?????meta: { title: '學院管理', icon: 'academy' }

???},

?????{

???????path: 'editor',

???????name: 'editor',

???????component: () => import('@/views/academy/editor'),

???????meta: { title: '添加學院', icon: 'academy' }

?????}]

? },


? {

???path: '/classs',

???component: Layout,

???meta: { title: '班級管理', icon: 'example' },

???redirect: 'classs',

???children: [{

?????path: 'classs',

?????name: 'classs',

?????component: () => import('@/views/classs/index'),

?????meta: { title: '班級管理', icon: 'classs' }

???},

?????{

???????path: 'editor',

???????name: 'editor',

???????component: () => import('@/views/classs/editor'),

???????meta: { title: '添加班級', icon: 'classs' }

?????}]

? },


? {

???path: '/student',

???component: Layout,

?? ?meta: { title: '學生管理',icon: 'example' },

???redirect: 'student',

???children: [{

?????path: 'student',

?????name: 'student',

?????component: () => import('@/views/student/index'),

?????meta: { title: '學生管理', icon: 'student' }

???},

?????{

???????path: 'editor',

???????name: 'editor',

???????component: () => import('@/views/student/editor'),

???????meta: { title: '添加學生', icon: 'student' }

?????}]

? },


? {

???path: '/404',

??? component: () => import('@/views/404'),

???hidden: true

? },


? {

???path: '/',

???component: Layout,

???redirect: '/dashboard',

???children: [{

?????path: 'dashboard',

?????name: 'Dashboard',

?????component: () => import('@/views/dashboard/index'),

?????meta: { title: 'Dashboard', icon: 'dashboard' }

???}]

? },

? //404 page must be placed at the end !!!

? {path: '*', redirect: '/404', hidden: true }

]


const createRouter = () => new Router({

? //mode: 'history', // require service support

?scrollBehavior: () => ({ y: 0 }),

?routes: constantRoutes

})


const router = createRouter()


// Detail see:https://github.com/vuejs/vue-router/issues/1234#issuecomment-357941465

export function resetRouter() {

?const newRouter = createRouter()

?router.matcher = newRouter.matcher // reset router

}


export default router

```

#實訓6

#教師管理篇

(可將學校、學院、班級、學生與教師關聯(lián)起來)

#一、從后端(projectName)添加教師模塊

##1、在models目錄下添加teacher.js:

projectName/db/models/teacher.js:

```

const mongoose = require('mongoose')

const Schema= mongoose.Schema

const feld={

???name: String,

???//人物標簽

???age:Number,

???student_number: Number,

???gender:String,

???school : { type: Schema.Types.ObjectId, ref: 'School' },

???academy : { type: Schema.Types.ObjectId, ref: 'Academy' },

???classs : { type: Schema.Types.ObjectId, ref: 'Classs' },

???student : { type: Schema.Types.ObjectId, ref: 'Student' }

}

//自動添加更新時間創(chuàng)建時間:

let personSchema = newmongoose.Schema(feld, {timestamps: {createdAt: 'created', updatedAt:'updated'}})

module.exports=mongoose.model('Teacher',personSchema)

```

##2、在routes目錄下添加teacher.js:

projectName/routes/teacher.js:

```

const router = require('koa-router')()

let Model =require("../db/models/teacher");

router.prefix('/teacher')


router.get('/', function (ctx, next) {

???ctx.body = 'this is a users response!'

})


router.post('/add', async function (ctx,next) {

???console.log(ctx.request.body)

???let model = new Model(ctx.request.body);

???model = await model.save();

???console.log('user',model)

???ctx.body = model

})


router.post('/find', async function (ctx,next) {

???let models = await Model.

???find({}).populate('student').populate('classs').populate('academy').populate('school')

???ctx.body = models

})


router.post('/get', async function (ctx,next) {

???// let users = await User.

???// find({})

???console.log(ctx.request.body)

???let model = await Model.find(ctx.request.body)

???console.log(model)

???ctx.body = model

})


router.post('/update', async function (ctx,next) {

???console.log(ctx.request.body)

???let pbj = await Model.update({ _id: ctx.request.body._id },ctx.request.body);

???ctx.body = pbj

})

router.post('/delete', async function (ctx,next) {

???console.log(ctx.request.body)

???await Model.remove({ _id: ctx.request.body._id });

???ctx.body = 'shibai '

})

module.exports = router

```

#3、在app.js中加上teacher模塊的路由:

projectName/app.js:

```

const Koa = require('koa')

const app = new Koa()

const views = require('koa-views')

const json = require('koa-json')

const onerror = require('koa-onerror')

const bodyparser =require('koa-bodyparser')

const logger = require('koa-logger')



const mongoose = require('mongoose')

const dbconfig = require('./db/config')

mongoose.connect(dbconfig.dbs,{useNewUrlParser:true,useUnifiedTopology: true})

const db = mongoose.connection

db.on('error',console.error.bind(console,'connectionerror:'));

db.once('open',function () {

?console.log('mongoose連接成功')

});

// error handler

onerror(app)


// middlewares

app.use(bodyparser({

?enableTypes:['json', 'form', 'text']

}))

app.use(json())

app.use(logger())

app.use(require('koa-static')(__dirname +'/public'))


app.use(views(__dirname + '/views', {

?extension: 'pug'

}))


// logger

app.use(async (ctx, next) => {

?const start = new Date()

?await next()

?const ms = new Date() - start

?console.log(`${ctx.method} ${ctx.url} - ${ms}ms`)

})



// routes

const index = require('./routes/index')

app.use(index.routes(),index.allowedMethods())

const users = require('./routes/users')

app.use(users.routes(),users.allowedMethods())

const school = require('./routes/school')

app.use(school.routes(),school.allowedMethods())

const academy = require('./routes/academy')

app.use(academy.routes(),academy.allowedMethods())

const classs = require('./routes/classs')

app.use(classs.routes(),classs.allowedMethods())

const student = require('./routes/student')

app.use(student.routes(),student.allowedMethods())

const teacher = require('./routes/teacher')

app.use(teacher.routes(),teacher.allowedMethods())

// error-handling





app.on('error', (err, ctx) => {

?console.error('server error', err, ctx)

});


module.exports = app

```

#二、從前端(vue-admin-template)添加教師模塊

##1、在src/views目錄下添加teacher目錄(模塊)

![teacher模塊](https://upload-images.jianshu.io/upload_images/23950256-1f21eb9f220494fa.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)


在teacher目錄下添加editor.vue:

vue-admin-template/src/views/teacher/editor.vue:

```







???????????v-for="item in schools"

???????????:key="item._id"

???????????:label="item.name"

???????????:value="item._id">








???????????v-for="item in academys"

???????????:key="item._id"

???????????:label="item.name"

???????????:value="item._id">








???????????v-for="item in classs"

???????????:key="item._id"

???????????:label="item.name"

???????????:value="item._id">









???????????v-for="item in students"

???????????:key="item._id"

???????????:label="item.name"

???????????:value="item._id">















???????立即創(chuàng)建

???????取消





?import { mapGetters } from 'vuex'


?export default {

???name: 'teacher-editor',

???computed: {

?????...mapGetters([

???????'name'

?????])

???},

???data(){

?????return{

???????schools:[],

???????academys:[],

???????classs:[],

???????students:[],

???????//列表內(nèi)容

???????options: [

???????],

???????apiModel:'teacher',

???????form:{}

?????}

???},

???methods:{

?????onSubmit(){

???????if(this.form._id){

?????????this.$http.post(`/api/${this.apiModel}/update`,this.form).then(res =>{

???????????console.log('bar:', res)

???????????this.$router.push({path:this.apiModel})

???????????this.form={}

?????????})

???????}else

???????{

?????????this.$http.post('/api/'+this.apiModel+'/add',this.form).then(res => {

???????????console.log('bar:', res)

???????????this.$router.push({path:this.apiModel})

???????????this.form={}

?????????})

???????}

?????},

?????schoolChange(val1){

???????//顯示學院選擇欄目

???????this.$http.post('/api/academy/get',{school:val1}).then(res => {

?????????if(res&&res.length>0){

???????????this.academys = res

???????????console.log('res:', res)

?????????}

???????})

?????}

???},

???mounted() {

?????if(this.$route.query._id){

???????this.$http.post('/api/'+this.apiModel+'/get',{_id:this.$route.query._id}).then(res=> {

?????????if(res&&res.length>0){

???????????this.form = res[0]

???????????this.schoolChange(this.form.school)

?????????}

???????})

?????}


?????//顯示學校選擇欄目

?????this.$http.post('/api/school/find').then(res => {

???????if(res&&res.length>0){

?????????this.schools = res

?????????console.log('res:', res)

???????}

?????})


?????//顯示班級欄目

?????this.$http.post('/api/classs/find').then(res => {

???????if(res&&res.length>0){

?????????this.classs = res

?????????console.log('res:', res)

???????}

?????})


?????//顯示學生欄目

?????this.$http.post('/api/student/find').then(res => {

???????if(res&&res.length>0){

?????????this.students = res

?????????console.log('res:', res)

???????}

?????})

??? }

? }


?.dashboard {

???&-container {

?????margin: 30px;

??? }

???&-text {

?????font-size: 30px;

?????line-height: 46px;

??? }

? }

```

在teacher目錄下添加index.vue:

vue-admin-template/src/views/teacher/index.vue:

```



?????:data="users"

?????style="width: 100%"

?????:row-class-name="tableRowClassName">


???????prop="name"

???????label="名字"

???????width="180">



???????prop="age"

???????label="年齡"

???????width="180">



???????prop="gender"

???????label="性別">



?????-->


???????prop="school"

???????label="學校名稱"

???????width="180">




????????????? :type="scope.row.school.name=== '深圳信息職業(yè)技術學院' ? 'primary' : 'success'"

?????????????disable-transitions>{{scope.row.school.name}}






???????prop="academy"

???????label="學院名稱"

???????width="180">




?????????????:type="scope.row.academy.name === '軟件學院' ?'primary' : 'success'"

?????????????disable-transitions>{{scope.row.academy.name}}






?????prop="classs"

?????label="班級名稱"

?????width="180">




????????????? :type="scope.row.classs.name=== '18軟工4-3' ? 'primary' : 'success'"

?????????????disable-transitions>{{scope.row.classs.name}}






???????prop="student"

???????label="學生名稱"

???????width="180">




????????????? :type="scope.row.student.name=== '湯圓' ? 'primary' : 'success'"

?????????????disable-transitions>{{scope.row.student.name}}








???????????size="mini"

???????????@click="handleEdit(scope.$index, scope.row)">編輯



???????????size="mini"

???????????type="danger"

???????????@click="handleDelete(scope.$index, scope.row)">刪除







?import { mapGetters } from 'vuex'


?export default {

???name: 'teacher',

???computed: {

???? ?...mapGetters([

???????'name'

?????])

???},

???data() {

?????return {

???????apiModel:'teacher',

???????users: {}

?????}

???},

???methods: {

?????onSubmit() {

???????console.log(123434)

?????},

?????handleEdit(index, item) {

???????this.$router.push({ path: '/'+this.apiModel+'/editor', query:{_id:item._id} })

?????},

?????handleDelete(index, item) {

???????this.$http.post('/api/'+this.apiModel+'/delete', item).then(res => {

?????????console.log('res:', res)

?????????this.findUser()

???????})


?????},

?????findUser(){

???????this.$http.post('/api/'+this.apiModel+'/find', this.user).then(res =>{

?????????console.log('res:', res)

?????????this.users = res

???????})

?????}

???},

??? mounted(){

?????this.findUser()

??? }

? }


?.dashboard {

???&-container {

?????margin: 30px;

??? }


???&-text {

?????font-size: 30px;

?????line-height: 46px;

??? }

? }

```

##2、在router下的index.js中添加teacher模塊的路由:

vue-admin-template/src/router/index.js:

```

import Vue from 'vue'

import Router from 'vue-router'


Vue.use(Router)


/* Layout */

import Layout from '@/layout'


/**

?*Note: sub-menu only appear when route children.length >= 1

?*Detail see:https://panjiachen.github.io/vue-element-admin-site/guide/essentials/router-and-nav.html

?*

?*hidden: true?????????????????? if settrue, item will not show in the sidebar(default is false)

?*alwaysShow: true?????????????? if settrue, will always show the root menu

?*??????????????????????????????? if not setalwaysShow, when item has more than one children route,

?*??????????????????????????????? it will becomesnested mode, otherwise not show the root menu

?*redirect: noRedirect?????????? if setnoRedirect will no redirect in the breadcrumb

?*name:'router-name'???????????? the nameis used by (must set!!!)

?*meta : {

???roles: ['admin','editor']???control the page roles (you can set multiple roles)

???title: 'title'?????????????? thename show in sidebar and breadcrumb (recommend set)

???icon: 'svg-name'???????????? theicon show in the sidebar

???breadcrumb: false??????????? ifset false, the item will hidden in breadcrumb(default is true)

???activeMenu: '/example/list'? ifset path, the sidebar will highlight the path you set

? }

?*/


/**

?*constantRoutes

?* abase page that does not have permission requirements

?*all roles can be accessed

?*/

export const constantRoutes = [

? {

???path: '/login',

???component: () => import('@/views/login/index'),

???hidden: true

? },


? {

???path: '/school',

???component: Layout,

???meta: { title: '學校管理', icon: 'example' },

???redirect: 'school',

???children: [{

?????path: 'school',

?????name: 'school',

?????component: () => import('@/views/school/index'),

?????meta: { title: '學校管理', icon: 'school' }

???},

?????{

???????path: 'editor',

???????name: 'editor',

???????component: () => import('@/views/school/editor'),

???????meta: { title: '添加學校', icon: 'school' }

?????}]

? },


? {

???path: '/academy',

???component: Layout,

???meta: { title: '學院管理', icon: 'example' },

??? redirect: 'academy',

???children: [{

?????path: 'academy',

?????name: 'academy',

?????component: () => import('@/views/academy/index'),

?????meta: { title: '學院管理', icon: 'academy' }

???},

?????{

???????path: 'editor',

???????name: 'editor',

???????component: () => import('@/views/academy/editor'),

???????meta: { title: '添加學院', icon: 'academy' }

?????}]

? },


? {

???path: '/classs',

???component: Layout,

???meta: { title: '班級管理', icon: 'example' },

???redirect: 'classs',

???children: [{

?????path: 'classs',

?????name: 'classs',

?????component: () => import('@/views/classs/index'),

?????meta: { title: '班級管理', icon: 'classs' }

???},

?????{

???????path: 'editor',

???????name: 'editor',

???????component: () => import('@/views/classs/editor'),

???????meta: { title: '添加班級', icon: 'classs' }

?????}]

? },


? {

???path: '/student',

???component: Layout,

???meta: { title: '學生管理', icon: 'example' },

???redirect: 'student',

???children: [{

?????path: 'student',

?????name: 'student',

?????component: () => import('@/views/student/index'),

?????meta: { title: '學生管理', icon: 'student' }

???},

?????{

???????path: 'editor',

???????name: 'editor',

???????component: () => import('@/views/student/editor'),

???????meta: { title: '添加學生', icon: 'student' }

?????}]

? },


? {

???path: '/teacher',

???component: Layout,

???meta: { title: '老師管理', icon: 'example' },

???redirect: '/teacher',

???children: [{

?????path: 'teacher',

?????name: 'teacher',

?????component: () => import('@/views/teacher/index'),

?????meta: { title: '老師管理', icon: 'user' }

???},

?????{

???????path: 'editor',

???????name: 'editor',

???????component: () => import('@/views/teacher/editor'),

???????meta: { title: '添加老師', icon: 'user' }

?????}]

? },


? {

???path: '/404',

???component: () => import('@/views/404'),

???hidden: true

? },


? {

???path: '/',

???component: Layout,

??? redirect:'/dashboard',

???children: [{

?????path: 'dashboard',

?????name: 'Dashboard',

?????component: () => import('@/views/dashboard/index'),

?????meta: { title: 'Dashboard', icon: 'dashboard' }

???}]

? },

? //404 page must be placed at the end !!!

? {path: '*', redirect: '/404', hidden: true }

]


const createRouter = () => new Router({

? //mode: 'history', // require service support

?scrollBehavior: () => ({ y: 0 }),

?routes: constantRoutes

})


const router = createRouter()


// Detail see: https://github.com/vuejs/vue-router/issues/1234#issuecomment-357941465

export function resetRouter() {

?const newRouter = createRouter()

?router.matcher = newRouter.matcher // reset router

}


export default router

?著作權歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務。

相關閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容