学院管理篇
(可将学校与学院关联起来)
一、从后端(projectName)添加学院模块
1、在models目录下添加academy.js:
projectName/db/models/academy.js:
const mongoose = require('mongoose')
const Schema= mongoose.Schema
const feld={
name: String,
//人物标签
major:String,
renshu: Number,
school : { type: Schema.Types.ObjectId, ref: 'School' }
}
//自动添加更新时间创建时间:
let schema = new Schema(feld, {timestamps: {createdAt: 'created', updatedAt: 'updated'}})
module.exports= mongoose.model('Academy',schema)
2、在routes目录下添加academy.js:
projectName/routes/academy.js:
const router = require('koa-router')()
let Model = require("../db/models/academy");
router.prefix('/academy')
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('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中加上academy模块的路由:
添加部分为:
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,'connection error:'));
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())
// error-handling
app.on('error', (err, ctx) => {
console.error('server error', err, ctx)
});
module.exports = app
二、从前端(vue-admin-template)添加学院模块
1、在src/views目录下添加academy目录(模块),如图所示:
①在academy目录下添加editor.vue:
vue-admin-template/src/views/academy/editor.vue:
立即创建
取消
效果图:
②在academy目录下添加index.vue:
vue-admin-template/src/views/academy/index.vue:
{{scope.row.school.name}}
编辑
删除
效果图:
2、在router下的index.js中添加academy模块的路由:
添加部分:
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 set true, item will not show in the sidebar(default is false)
* alwaysShow: true if set true, will always show the root menu
* if not set alwaysShow, when item has more than one children route,
* it will becomes nested mode, otherwise not show the root menu
* redirect: noRedirect if set noRedirect will no redirect in the breadcrumb
* name:'router-name' the name is used by (must set!!!)
* meta : {
roles: ['admin','editor'] control the page roles (you can set multiple roles)
title: 'title' the name show in sidebar and breadcrumb (recommend set)
icon: 'svg-name' the icon show in the sidebar
breadcrumb: false if set false, the item will hidden in breadcrumb(default is true)
activeMenu: '/example/list' if set path, the sidebar will highlight the path you set
}
*/
/**
* constantRoutes
* a base 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'),
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'),
meta: { title: '学院管理', icon: 'academy' }
},
{
path: 'editor',
name: 'editor',
component: () => import('@/views/academy/editor'),
meta: { title: '添加学院', icon: 'academy' }
}]
},
{
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
这样学院管理模块就构建好了,最终的效果图: