#實訓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目錄下添加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目錄下添加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