校园社交网站(PC端)

项目介绍

在这里插入图片描述

校园社交网站是一个前后端分离的项目，项目采用Vue+Node+Mysql，elementUI组件库开发。
在这里插入图片描述

注意：node版本须在14.19.**以下,16版本npm安装会报错
链接地址

# 克隆到本地
git clone 项目地址# 安装依赖
npm install 或 yarn(推荐)# 开启本地服务器localhost:8080
npm run dev# 发布环境
npm run build

演示地址（请用PC端打开）

由于尝试访问学校后台失败，只能做一个静态页面了😩😩

发布通知：输入题目和内容(可输入链接)，可重置
授予权限：支持用户id模糊查询，可删除用户、设置用户为管理员、查看用户部分信息
数据分析：
    - 用户分布图：显示全国用户分布图，各省份用户人数
    - 学校数据柱状图：选择省份，显示省份下的各学校注册用户人数
    - 在线人数折线图：统计每天用户在线人数

展示动态列表：
    - 点赞：点击点赞图标，点赞列表更新
    - 评论：点击评论图标，输入内容(可选择添加表情)，评论列表更新
    - 转发：点击转发图标，动态列表更新
    - 删除：点击删除图标，动态列表(更新此动态为该用户自己发布的，才会有删除图标)
好友列表：
    - 查找好友：点击放大镜图标，输入用户id
    - 添加好友：点击加号图标，输入用户id，点击添加，输入验证信息发送，对方实时收到好友验证通知，对方反馈信息，自己实时收到对方反馈信息
    - 删除好友：在还有列表中，鼠标移到该用户id上，点击删除，刷新好友列表
动态主题(通过花瓣网爬取图片)
    - 显示背景主题：通过懒加载，背景主题列表默认显示电脑壁纸
    - 搜索背景主题：通过输入框搜索背景图片，通过爬取花瓣网可获得图片信息
    - 选择背景主题：在背景主题列表中选择主题图片，同时当前选择的主题图片禁选，选择后，跳转到动态页面

聊天时，好友向该用户发信息时，好友会置顶，标记未读

好友聊天：
    - 显示聊天记录：显示聊天记录，可点击文件进行下载
    - 发送聊天内容：可输入表情、发送图片、发送文件
    - 收藏聊天内容：鼠标移到某聊天内容上，出现提示是否收藏，点击即可收藏
群聊：
    - 创建群聊：输入群名，选择群成员(来自好友)
    - 显示群成员：显示群成员
    - 显示文件列表：显示群文件，同时显示文件大小，点击可下载
    - 删除群成员(为群主) ：若为群主，可点击删除图标，删除群成员
收藏：显示收藏的聊天记录
文件：显示聊天中所有文件信息，发布者头像，id，文件名，文件类型，文件大小，发布文件时间，来源(包括好友和群)，方便下载