今天给大家分享一个全新校园失物招领系统，网上找了很多没有找到springboot3 vue3这一技术栈的校园失物招领系统，只能自己写一个了，花了几天才完成，界面如下。
角色设计
此项目的操作主要是用户，如发布失物，发布招领，用户之间私信。因此设计两个角色用户与管理员就可以了。字段中用户名，密码，角色是最重要的，其它的字段如邮箱，手机号，地址可以随意设计。
此项目也录制了完整的带敲视频供大家参考学习 带敲视频
功能设计
此项目功能设计如丢失物品模块，招领物品模块，公告通模块肯定是必要的，其它模块可以自由发挥，如反馈信息，论坛帖子，轮播图模块等，想添加亮点可以在用户之间添加websocket对话功能，这一功能大家也可以去学习下，在很多项目开发中都可以用到，实用性拉满！
有同学对设计功能无从下手，可以参考别的的失物招领系统，核心功能基本都是固定的，项目功能如下图所示。
基本的功能如 注册，登录，个人信息管理每个项目都是这些，网上教程用有很多，在此不多赘述。
发布失物
此功能在丢失物品列表中，发布失物功能中可以添加富文本编辑，可以在编辑框中输入文字与上传图文，其它必要字段如丢失时间，地点，分类等。上传的物品在丢失物品栏目中显示，管理员可以置顶物品。
发布招领
用户也可以发布招领物品，功能与丢失物品功能类似。
物品详情
物品详细信息中包含物品分类 丢失时间 丢失地点 发布时间 发布人
此模块主要功能为私信，在查看丢失物品时，若自己捡到了，可以私信发布人。
若登录的用户是当前物品的发布人，需要判断无法与自己对话。代码如下
const handleAdd=(lostData)=>{ if (data.user.id==lostData.userId){ ElMessage.warning("无法与自己对话") return } data.form={} data.formVisible=true data.form.goodsId=lostData.id data.form.fromId=data.user.id data.form.toId=lostData.userId data.form.category='丢失物品' }
首页信息
首页提示消息借鉴了二手软件某鱼电脑版的右侧设计，发布失物，发布招领与消息提示，获取他人私信自己的未读消息数据进行统计。
统计当前用户未读消息代码
<select id="selectUnReadNum" resultType="int"> select count(id) from message where to_id=#{toId} and is_read=0 </select>
领取物品
用户在确定是自己的物品时，可以确定领取物品，此时物品状态需要进行调整，丢失物品/招领物品中不再显示此物品信息。
管理员功能
物品分类管理，添加物品的分类。 丢失/招领物品管理，这一功能主要是某些不合适的物品可以删除，也可以对贵重物品进行置顶，公告这一功能也是基本的增删改查。
echarts统计
可以根据官网的文档去引入echarts，本项目使用的丢失物品/招领物品统计以饼图的方式显示，网上也有很多教程，将它改为动态的，需要从后台获取相同格式的数据，代码如下可参考。
public List<Map<String,Object>> selectLostByState() { List<Lost> list=lostMapper.selectLostByState(); List<Map<String,Object>> mapList=new ArrayList<>(); for (Lost lost:list){ Map<String, Object> map=new HashMap<>(); map.put("value",lost.getNum()); map.put("name",lost.getState()); mapList.add(map); } return mapList; }
