vue项目实战(一)——资金管理系统-06数据信息接口

14 篇文章 0 订阅

1.主要进行数据的增删改查操作。
分别添加了一个models\Profile.js数据类型文件和routes\api\profiles.js 路由文件。
Profile.js:

const mongoose = require('mongoose');
const Schema = mongoose.Schema;

// Create Schema
const ProfileSchema = new Schema({
    type: {
        type: String
    },
    describe: {
        type: String
    },
    income: {
        type: String,
        required: true
    },
    expend: {
        type: String,
        required: true
    },
    cash: {
        type: String,
        required: true
    },
    remark: {
        type: String
    },
    date: {
        type: Date,
        default: Date.now
    }
});

module.exports = Profile = mongoose.model('profile', ProfileSchema);

profiles.js:

// 资金网关
// @login & register
const express = require('express');
const router = express.Router();
const passport = require('passport');

const Profile = require('../../models/Profile');

// @route  GET api/profiles/test
// @desc   返回的请求的json数据
// @access public
router.get('/test', (req, res) => {
    res.json({
        msg: 'profile works'
    });
});
module.exports = router;

server.js中引入;

const profiles = require('./routes/api/profiles');
app.use('/api/profiles', profiles);

进行测试:
在这里插入图片描述
2.添加信息接口
routes\api\profiles.js文件中


// @route  POST api/profiles/add
// @desc   创建信息接口
// @access Private
router.post(
    '/add',
    passport.authenticate('jwt', {
        session: false
    }),
    (req, res) => {
        const profileFields = {};

        if (req.body.type) profileFields.type = req.body.type;
        if (req.body.describe) profileFields.describe = req.body.describe;
        if (req.body.income) profileFields.income = req.body.income;
        if (req.body.expend) profileFields.expend = req.body.expend;
        if (req.body.cash) profileFields.cash = req.body.cash;
        if (req.body.remark) profileFields.remark = req.body.remark;

        new Profile(profileFields).save().then(profile => {
            res.json(profile);
        });
    }
);

进行测试:
在这里插入图片描述
2.获取单个及所有信息


// @route  GET api/profiles/:id
// @desc   获取所有信息
// @access Private

router.get(
   '/:id',
   passport.authenticate('jwt', {
       session: false
   }),
   (req, res) => {
       Profile.find()
           .then(profile => {
               if (!profile) {
                   return res.status(404).json('没有任何内容');
               }
               res.json(profile);
           }).catch(err => res.status(404).json(err));
   }
);

进行测试:
在这里插入图片描述
获取单个信息:

// @route  GET api/profiles/:id
// @desc   获取单个信息
// @access Private

router.get(
    '/:id',
    passport.authenticate('jwt', {
        session: false
    }),
    (req, res) => {
        Profile.findOne({
                _id:req.params.id
            })
            .then(profile => {
                if (!profile) {
                    return res.status(404).json('没有任何内容');
                }

                res.json(profile);
            })
            .catch(err => res.status(404).json(err));
    }
);

在这里插入图片描述
3.编辑和删除操作接口的编写

// @route  POST api/profiles/edit
// @desc   编辑信息接口
// @access Private
router.post(
    '/edit/:id',
    passport.authenticate('jwt', {
        session: false
    }),
    (req, res) => {
        const profileFields = {};

        if (req.body.type) profileFields.type = req.body.type;
        if (req.body.describe) profileFields.describe = req.body.describe;
        if (req.body.income) profileFields.income = req.body.income;
        if (req.body.expend) profileFields.expend = req.body.expend;
        if (req.body.cash) profileFields.cash = req.body.cash;
        if (req.body.remark) profileFields.remark = req.body.remark;

        Profile.findOneAndUpdate({
            _id: req.params.id
        }, {
            $set: profileFields
        }, {
            new: true
        }).then(profile => res.json(profile));
    }
);

在这里插入图片描述
4.删除操作

// @route  POST api/profiles/delete/:id
// @desc   删除信息接口
// @access Private
router.delete(
    '/delete/:id',
    passport.authenticate('jwt', {
        session: false
    }),
    (req, res) => {

        Profile.findOneAndRemove({
            _id: req.params.id
        }).then(profile => {
            profile.save().then(profile => res.json(profile));
        }).catch(err => res.status(404).json('删除失败'));
    }
);

测试:
在这里插入图片描述

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
如果你想进行VUE项目实战并开发一个VUE后台管理系统,以下是一些建议和资源可供参考。 首先,如果你是大学即将毕业或自学前端且缺乏项目经验,你可以考虑以下几点: - 寻找相关的在线教程或课程,这些资源通常会提供详细的步骤和案例来帮助你实践VUE项目。你可以搜索一些知名的在线教育平台,如网易云课堂、慕课网等。 - 参考md文档,一些教程可能会总结在md文档中,这将帮助你更好地理解项目开发过程中的每一步。 - 观看相关的视频教程,比如在哔哔哩哩上搜索"程序员Allen",他提供了一些关于VUE项目实战的视频教程。 另外,如果你想开发一个基于VUE的后台管理系统,你需要考虑以下几点: - 确定使用的技术栈。目前最新的技术栈中,Vue3.2、TypeScript、Vite3、Pinia、Element-Plus是一些常见的选择。这些技术将帮助你更高效地开发后台管理系统。 - 寻找开源的后台管理框架。你可以搜索一些开源的后台管理框架,这些框架提供了一些常用的组件、Hooks、指令、动态路由、按钮级别权限控制等功能。这将节省你的开发时间和提高效率。 总之,为了进行VUE项目实战和开发后台管理系统,你可以参考在线教程、学习md文档、观看相关视频教程,同时寻找开源的后台管理框架来加速你的开发过程。<span class="em">1</span><span class="em">2</span><span class="em">3</span> #### 引用[.reference_title] - *1* *3* [Vue项目实战 —— 后台管理系统( pc端 ) —— Pro最终版本](https://blog.csdn.net/m0_57904695/article/details/129730440)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v92^chatsearchT3_1"}}] [.reference_item style="max-width: 50%"] - *2* [Vue项目实战 —— 后台管理系统( pc端 )](https://blog.csdn.net/m0_67391377/article/details/124818830)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v92^chatsearchT3_1"}}] [.reference_item style="max-width: 50%"] [ .reference_list ]
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值