实训(三)
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)
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
在app.js 文件:
// error-handling
const academy = require('./routes/academy')
app.use(academy.routes(), academy.allowedMethods())
vue-admin-template-master文件,在src/views目录下创建一个academy
在academy文件下创建editor.vue和index.vue
editor文件
<template><divclass="dashboard-container"><el-formref="form":model="form"label-width="80px"><el-form-itemlabel="学院名称"><el-inputv-model="form.name"></el-input></el-form-item><el-form-itemlabel="专业"><el-inputv-model="form.major"></el-input></el-form-item><el-form-itemlabel="人数"><el-inputv-model="form.renshu"></el-input></el-form-item><el-form-itemlabel="所属学校"><el-selectv-model="form.school"placeholder="请选择"><el-optionv-for="item in options":key="item._id":label="item.name":value="item._id"></el-option></el-select></el-form-item><el-form-item><el-buttontype="primary"@click="onSubmit">立即创建</el-button><el-button>取消</el-button></el-form-item></el-form></div></template><script>import { mapGetters } from 'vuex' export default { name: 'academy', computed: { ...mapGetters([ 'name' ]) }, data(){ return{ options: [ ], apiModel:'academy', form:{} } }, methods:{ onSubmit(){ console.log('222:', 222) 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={} }) } } }, 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.$http.post('/api/school/find').then(res => { if(res&&res.length>0){ this.options = res console.log('res:', res) } }) } }</script><stylelang="scss"scoped>.dashboard { &-container { margin: 30px; } &-text { font-size: 30px; line-height: 46px; } }</style>
index.vue文件
{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'}}]},