校园管理系统前后台开发实训
一、学校管理
后台三步骤：
1、打开projectName文件，在/db/models目录下创建school.js文件，接着文件操作：
const mongoose = require('mongoose')
const feld={
name: String,
//人物标签
where:String,
leixing: String
}
//自动添加更新时间创建时间:
let personSchema = new mongoose.Schema(feld, {timestamps: {createdAt: 'created', updatedAt: 'updated'}})
module.exports= mongoose.model('School',personSchema)
2、找到projectName下的routes目录：
const router = require('koa-router')()
let Model = require("../db/models/school");
router.prefix('/school')
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({})
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中挂载路由：
const school = require('./routes/school')
app.use(school.routes(), school.allowedMethods())
前台三步骤：
打开vue-admin-template-master文件，在src/views目录下创建一个school模块：
并在school目录下创建vue文件。
image.png
1.editor.vue为编辑文件，用于创建学校记录；
立即创建
取消
2.index.vue为目录文件，用于显示结果；
编辑
删除
3.在index.js中添加路由：
const school = require('./routes/school')
app.use(school.routes(), school.allowedMethods())
最后结果
image.png
image.png
二、学院管理
后台三步骤：
1、打开projectName文件，在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、找到projectName下的routes目录：
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中挂载路由：
const academy = require('./routes/academy')
app.use(academy.routes(), academy.allowedMethods())
前台三步骤：
打开vue-admin-template-master文件，在src/views目录下创建一个academy模块：
并在academy目录下创建vue文件。
image.png
1.editor.vue为编辑文件，用于创建学院记录；
立即创建
取消
2.index.vue为目录文件，用于显示结果；
{{scope.row.school.name}}
编辑
删除
3.在index.js中添加路由：
{
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' }
}]
},
最后结果
image.png
image.png
四、班级管理
后台三步骤：
1、打开projectName文件，在models目录下创建classs.js文件，接着文件操作：
const mongoose = require('mongoose')
const Schema= mongoose.Schema
const feld={
name: String,
//人物标签
level:String,
renshu: Number,
school : { type: Schema.Types.ObjectId, ref: 'School' },
academy : { type: Schema.Types.ObjectId, ref: 'Academy' }
}
//自动添加更新时间创建时间:
let personSchema = new mongoose.Schema(feld, {timestamps: {createdAt: 'created', updatedAt: 'updated'}})
module.exports= mongoose.model('Classs',personSchema)
2、找到projectName下的routes目录：
const router = require('koa-router')()
let Model = require("../db/models/classs");
router.prefix('/classs')
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('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中挂载路由：
const classs = require('./routes/classs')
app.use(classs.routes(), classs.allowedMethods())
前台三步骤：
打开vue-admin-template-master文件，在src/views目录下创建一个classs模块，并在classs目录下创建vue文件。
image.png
1.editor.vue为编辑文件，用于创建学院记录；
立即创建
取消
2.index.vue为目录文件，用于显示结果；
{{scope.row.school.name}}
{{scope.row.academy.name}}
编辑
删除
3.在index.js中添加路由：
{
path: '/classs',
component: Layout,
meta: { title: '班级管理', icon: 'example' },
redirect: '/classs',
children: [{
path: 'classs',
name: 'classs',
component: () => import('@/views/classs'),
meta: { title: '班级管理', icon: 'classs' }
},
{
path: 'editor',
name: 'editor',
component: () => import('@/views/classs/editor'),
meta: { title: '添加班级', icon: 'classs' }
}]
},
最后结果
image.png
image.png
五、老师管理
后台三步骤：
1、打开projectName文件，在models目录下创建teacher.js文件，接着文件操作：
const mongoose = require('mongoose')
const Schema= mongoose.Schema
const feld={
name: String,
age: String,
//人物标签
level:String,
gender:String,
school : { type: Schema.Types.ObjectId, ref: 'School' },
academy : { type: Schema.Types.ObjectId, ref: 'Academy' }
}
//自动添加更新时间创建时间:
let personSchema = new mongoose.Schema(feld, {timestamps: {createdAt: 'created', updatedAt: 'updated'}})
module.exports= mongoose.model('Teacher',personSchema)
2、找到projectName下的routes目录：
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('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中挂载路由：
const teacher = require('./routes/teacher')
app.use(teacher.routes(), teacher.allowedMethods())
前台三步骤：
打开vue-admin-template-master文件，在src/views目录下创建一个teacher模块，并在teacher目录下创建vue文件。
image.png
1.editor.vue为编辑文件，用于创建学院记录；
立即创建
取消
2.index.vue为目录文件，用于显示结果；
{{scope.row.school.name}}
{{scope.row.academy.name}}
编辑
删除
3.在index.js中添加路由：
{
path: '/teacher',
component: Layout,
meta: { title: '老师管理', icon: 'example' },
redirect: '/teacher',
children: [{
path: 'teacher',
name: 'teacher',
component: () => import('@/views/teacher/teacher'),
meta: { title: '老师管理', icon: 'user' }
},
{
path: 'editor',
name: 'editor',
component: () => import('@/views/teacher/editor'),
meta: { title: '添加老师', icon: 'user' }
}]
},
最后结果
image.png
image.png
六、学生管理
后台三步骤：
1、打开projectName文件，在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' }
}
//自动添加更新时间创建时间:
let personSchema = new mongoose.Schema(feld, {timestamps: {createdAt: 'created', updatedAt: 'updated'}})
module.exports= mongoose.model('Student',personSchema)
2、找到projectName下的routes目录：
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中挂载路由：
const student = require('./routes/student')
app.use(student.routes(), student.allowedMethods())
前台三步骤：
打开vue-admin-template-master文件，在src/views目录下创建一个student模块，并在student目录下创建vue文件。
image.png
1.editor.vue为编辑文件，用于创建学院记录；
立即创建
取消
2.index.vue为目录文件，用于显示结果；
{{scope.row.school.name}}
{{scope.row.academy.name}}
{{scope.row.classs.name}}
编辑
删除
3.在index.js中添加路由：
{
path: '/student',
component: Layout,
meta: { title: '学生管理', icon: 'example' },
redirect: '/student',
children: [{
path: 'student',
name: 'student',
component: () => import('@/views/student/index'),
meta: { title: '学生管理', icon: 'user' }
},
{
path: 'editor',
name: 'editor',
component: () => import('@/views/student/editor'),
meta: { title: '添加学生', icon: 'user' }
}]
},
最后结果
image.png
image.png
最后总结
校园管理系统下载（已完成）
校园管理系统后端
校园管理系统前端
school-manager 校园管理后台服务
实现了简单的校园管理业务。特点是环境基础良好，适合教学，和二次开发。
学校增删盖查
专业增删改查
班级层删改查
学生增删改查
老师增删改查
参与贡献
school-manager-admin
school-manager-admin这是一个极简的 vue admin 管理后台。它只包含了 Element UI & axios & iconfont & permission control & lint，这些搭建后台必要的东西。
目前版本为 v4.0+ 基于 vue-cli 进行构建，若你想使用旧版本，可以切换分支到tag/3.11.0，它不依赖 vue-cli。
Extra
如果你想要根据用户角色来动态生成侧边栏和 router，你可以使用该分支permission-control