基于vue+node的校园交流平台

简介: 该系统基于vue.js+node.js整合,mysql数据库,页面很美观,功能完善。非常适合毕业设计、课程设计、数据库大作业等。

系统使用技术:node.js+express


前端技术:vue.js


开发工具:vscode或者idea等


数据库:mysql5.7


项目介绍:



该系统基于vue.js+node.js整合,mysql数据库,页面很美观,功能完善。非常适合毕业设计、课程设计、数据库大作业等。


功能详情:



- 前台
  * 问答
  * 活动
  * 失物认领
  * 二手交易
  * 招聘信息
  * 文章与新闻
  * 个人中心&&登录注册
    + 个人中心
     * 问答
       *  发布
        * 管理 
      * 活动
         *  发布
        * 管理 
     * 失物认领
        *  发布
        * 管理 
    * 二手交易
           *  发布
        * 管理 
     * 招聘信息
        *  发布
        * 管理 
    *   文章与新闻
        *  发布
        * 管理 
 * 后台
     * 仪表盘
     * 审核中心
        * 问答 /活动/失物认领/ 二手交易/招聘信息/ 文章与新闻
        * 留言审核
     * 认证中心
       * 学生认证
       * 公司认证
     * 客服中心
     * 平台管理
           分类管理
     * 账号管理
             账号添加/删除/授权/


部分功能展示:



下面我们来看看部分相关功能。


系统首页:


20210817151048715.png



问答


可以查看所有问答,也可以分类查看


20210817151123767.png



活动


查看活动信息,或者分类查看


20210817151205538.png



企业招聘


可以看到企业的招聘信息


2021081715123474.png


招聘详情


查看招聘要求,公司信息等


20210817151315139.png



二手信息


查看用户发布的二手信息


20210817151351778.png



意见反馈


用户可以反馈系统使用问题


20210817151439755.png


举报


用户可以举报用户,或者用户发布的信息,后台审核


20210817151514192.png



举报


用户可以举报用户,或者用户发布的信息,后台审核


20210817151556118.png


用户账户认证


用户可以对个人信息认证或者进行企业认证,认证之后才可以在相应板块发布信息


2021081715163054.png


发布活动信息


用户可以根据需要发布内容


20210817151722486.png



后台-登


管理员账户登录


20210817151804703.png


后台-数据中心


查看用户、评论以及内容的统计信息


20210817151832538.png


后台-个人中心


个人信息查看


20210817151900295.png



后台-用户管理


对用户进行操作,也可以封禁账户


20210817151919970.png



后台-管理员管理


管理员账户可以进行设置权限信息


20210817151954159.png


后台-标签管理


对问答、活动、文章等分类进行管理


20210817152015490.png


后台-评论审核


可以查看审核,并进行审核操作


20210817152044310.png


后台-轮播图管理


对轮播图动态操作


20210817152108645.png


后台-内容审核


对用户发布的内容操作


20210817152128795.png


数据库


2021081715215179.png


部分后台获取数据请求代码:



//登录
exports.login = async (req, res) => {
    req.body.password = md5(`${req.body.password}${PED_SALT}`)
    let info = [req.body.username, req.body.password]
    let sql = 'select * from admin where username=? and password=?'
    const result = await query(sql, info)
    if (result.length == 0) {
        data = {
            state: e,
            data: {
            }
        }   //    数据库里面没找到配对的内容返回参数
    } else {
        console.log(result[0].user_id)
        let uid = result[0].user_id
        let nickname = result[0].nickname
        let username = result[0].username
        let jurisdiction = {
            isyh: result[0].isyh,
            isgl: result[0].isgl,
            issh: result[0].issh,
            isfk: result[0].isfk,
            user_state: result[0].user_state,
        }
        //通过jwt生成token     npm i -s jsonwebtoken
        let token = jwt.sign(
            { uid, username, jurisdiction },
            PEIVATE_KEY,
            { expiresIn: EXPIRE_SIN }
        )
        data = {
            state: s,
            data: {
                token: token,
                userinfo: {
                    uid: uid,
                    nickname: nickname,
                    username: username,
                    jurisdiction: jurisdiction
                }
            }
        }//返回登录成功
    }
    console.log(data)
    res.send(data);
}
//获取管理员信息
exports.getadmin = async (req, res) => {
    let info = [req.user.uid]
    let sql = 'select * from admin where user_id =?'
    const result = await query(sql, info)
    data = {
        state: s,
        data: result[0]
    }
    res.send(data)
}
//删除用户
exports.deleteuser = async (req, res) => {
    console.log(req.body)
    let info = [req.body.user_id]
    let sql = `delete  from ${req.body.usertype} where user_id=? `
    const result = await query(sql, info)
    data = {
        state: s,
        data: result,
    }
    res.send(data)
}


以上就是部分功能展示,从整体上来看,本系统功能是十分完整的,界面设计简洁大方,交互友好,数据库设计也很合理,规模适中,比较适合毕业设计和课程设计的相关应用。


好了,今天就到这儿吧,小伙伴们点赞、收藏、评论,一键三连走起呀,下期见~~

相关文章
|
JavaScript 前端开发 开发者
VUE 开发——Node.js学习(一)
VUE 开发——Node.js学习(一)
281 2
|
11月前
|
数据采集 JavaScript Android开发
【02】仿站技术之python技术,看完学会再也不用去购买收费工具了-本次找了小影-感觉页面很好看-本次是爬取vue需要用到Puppeteer库用node.js扒一个app下载落地页-包括安卓android下载(简单)-ios苹果plist下载(稍微麻烦一丢丢)-优雅草卓伊凡
【02】仿站技术之python技术,看完学会再也不用去购买收费工具了-本次找了小影-感觉页面很好看-本次是爬取vue需要用到Puppeteer库用node.js扒一个app下载落地页-包括安卓android下载(简单)-ios苹果plist下载(稍微麻烦一丢丢)-优雅草卓伊凡
507 7
【02】仿站技术之python技术,看完学会再也不用去购买收费工具了-本次找了小影-感觉页面很好看-本次是爬取vue需要用到Puppeteer库用node.js扒一个app下载落地页-包括安卓android下载(简单)-ios苹果plist下载(稍微麻烦一丢丢)-优雅草卓伊凡
|
12月前
|
JavaScript 前端开发 jenkins
抛弃node和vscode,如何用记事本开发出一个完整的vue前端项目
本文探讨了在不依赖Node和VSCode的情况下,仅使用记事本和浏览器开发一个完整的Vue3前端项目的方法。通过CDN引入Vue、Vue Router、Element-UI等库,直接编写HTML文件实现页面功能,展示了前端开发的本质是生成HTML。虽然日常开发离不开现代工具,但掌握这种基础方法有助于快速实现想法或应对特殊环境限制。文章还介绍了如何用Node简单部署HTML文件到服务器,提供了一种高效、轻量的开发思路。
298 10
|
JavaScript 关系型数据库 MySQL
基于VUE的校园二手交易平台系统设计与实现毕业设计论文模板
基于Vue的校园二手交易平台是一款专为校园用户设计的在线交易系统,提供简洁高效、安全可靠的二手商品买卖环境。平台利用Vue框架的响应式数据绑定和组件化特性,实现用户友好的界面,方便商品浏览、发布与管理。该系统采用Node.js、MySQL及B/S架构,确保稳定性和多功能模块设计,涵盖管理员和用户功能模块,促进物品循环使用,降低开销,提升环保意识,助力绿色校园文化建设。
|
JavaScript 应用服务中间件 Linux
宝塔面板部署Vue项目、服务端Node___配置域名
本文介绍了如何使用宝塔面板在阿里云服务器上部署Vue项目和Node服务端项目,并配置域名。文章详细解释了安装宝塔面板、上传项目文件、使用pm2启动Node项目、Vue项目打包上传、以及通过Nginx配置域名和反向代理的步骤。
4578 1
宝塔面板部署Vue项目、服务端Node___配置域名
|
JavaScript 前端开发
Vue、ElementUI配合Node、multiparty模块实现图片上传并反显_小demo
如何使用Vue和Element UI配合Node.js及multiparty模块实现图片上传并反显的功能,包括前端的Element UI组件配置和后端的Node.js服务端代码实现。
245 1
Vue、ElementUI配合Node、multiparty模块实现图片上传并反显_小demo
|
JavaScript 前端开发 持续交付
构建现代Web应用:Vue.js与Node.js的完美结合
【10月更文挑战第22天】随着互联网技术的快速发展,Web应用已经成为了人们日常生活和工作的重要组成部分。前端技术和后端技术的不断创新,为Web应用的构建提供了更多可能。在本篇文章中,我们将探讨Vue.js和Node.js这两大热门技术如何完美结合,构建现代Web应用。
773 4
|
JavaScript 前端开发
vue配合axios连接express搭建的node服务器接口_简单案例
文章介绍了如何使用Express框架搭建一个简单的Node服务器,并使用Vue结合Axios进行前端开发和接口调用,同时讨论了开发过程中遇到的跨域问题及其解决方案。
266 0
vue配合axios连接express搭建的node服务器接口_简单案例
|
JavaScript 前端开发 API
全栈开发革命来临!Vue.js与Node.js联手,打造前后端无缝对接的奇迹之作!
【8月更文挑战第30天】在Web开发领域,前后端分离与协作至关重要。Vue.js以其轻量级和易用性深受前端开发者喜爱,而Node.js则以高性能和事件驱动特性在后端领域崭露头角。二者结合开启了全栈开发新篇章,通过RESTful API或GraphQL实现高效稳定通信。本文以示例说明如何使用Vue.js和Node.js构建全栈应用,从前端Vue组件到后端Express服务器,展示了数据获取与展示的全过程。这种组合提供了一种高效简洁的全栈开发方案,使开发者能更专注于业务逻辑实现。
1239 1
|
JavaScript
成功解决node、node-sass和sass-loader版本冲突问题、不需要降低node版本。如何在vue项目中安装node-sass,以及安装node-sass可能遇到的版本冲突问题
这篇文章介绍了在Vue项目中安装node-sass和sass-loader时遇到的版本冲突问题,并提供了解决这些问题的方法,包括在不降低node版本的情况下成功安装node-sass。
成功解决node、node-sass和sass-loader版本冲突问题、不需要降低node版本。如何在vue项目中安装node-sass,以及安装node-sass可能遇到的版本冲突问题