基于 Vue3 + Element Plus 的校园智能二手闲置物品交易系统
完整 PRD 需求规格说明书 + Vue3 高保真原型全套源码（PC电脑端 + 手机移动端 + 运营管理中后台）+ 模拟数据引擎 + 开箱即用运行环境
一、 项目背景与业务痛点
在各大高等院校中，每逢学期初开学以及毕业季，学生群体内部都会产生海量的闲置生活物品、考研升学教材、二手电子数码及代步电动车。传统的校园闲置交易方式多依托于微信群、校园表白墙、贴吧或二手论坛，普遍存在以下业务痛点：
- 信息极度分散与碎片化：缺乏统一标准的信息检索通道，求购与闲置难以高效撮合匹配；
- 缺乏信用保障与真实身份背书：虚假信息、校外中介混杂，易发生诈骗风险；
- 线下自提易产生纠纷：缺乏担保金锁定期与当面验货核销闭环机制；
- 定价缺乏参考基准：学生对物品二手折旧行情不了解，出清周期漫长。
💡 建设目标：构建集“PC端大厅 + 移动端H5 + 中后台风控 + 实名认证 + 智能估价 + 在线议价 + 担保交易 + 求购广场 + 大数据大屏”于一体的多端一体化校园闲置流转平台，实现绿色校园与资源循环。
二、 系统高保真界面与核心交互全景解读（附详细图文说明）
▲ 图 1：电脑 PC 端校园闲置市集大厅
功能深度解读：市集首页采用现代响应式卡片流布局，顶部配备全局搜索与校园绿色通知公告；支持按校区（东区/西区/本部）、品类（教材、数码、代步、宿舍、穿搭、外设、乐器）、成色（全新/95新/9成新）及价格区间进行多维联动过滤，并支持“综合排序、最新发布、价格高低”毫秒级响应切换，直观展示商品成色、自提楼栋、卖家信用徽章与点赞热度。
▲ 图 2：闲置宝贝详情与交易协同
功能深度解读：详情页提供多视角高清图集轮播与原图缩放，完整展示卖家实名档案、学籍所属学院与历史履约信用评分；右侧提供【立即担保下单】（支持选择宿舍楼下/蜂巢柜/食堂面交并生成核销码）、【在线智能议价】（买家输入心理价一键推送卖家）及【楼中楼留言板】，实现买卖双方全闭环互动。
▲ 图 3：闲置发布与 AI 智能估价助手
功能深度解读：集成基于本校同类二手交易大数据的 AI 估价小助手，卖家输入物品型号后即可智能推荐最优转手价区间与预期出清天数；表单支持图文九宫格、分类级联选择、原价参考、成色评级与自提位置说明，内置完整表单实时校验。
▲ 图 4：校园求购心愿广场（反向撮合）
功能深度解读：解决“找不到特定闲置”的痛点，学生可发布急求教材、考研笔记或二手小电驴心愿单，附带时效标签与预算上限；其他持有同款闲置的同学可一键点击“我有一件”，关联自己已发布的好物快速推荐对接。
▲ 图 5：个人订单中心与当面提货核销码
功能深度解读：支持待付款、待自提/验货、已完成等全生命周期订单跟踪；核心亮点在于每笔担保订单均生成唯一的 4 位数自提核销码，买家当面验货无误后将核销码出示给卖家，卖家核销后担保金自动打入卖家账户，彻底杜绝跑单与诈骗。
▲ 图 6：运营后台全校交易流转大数据大屏
功能深度解读：采用 ECharts 5.5 进行全域数据可视化监控，顶部呈现全校累计交易总额、在售闲置数、成功撮合订单与碳减排绿色贡献 4 大核心 KPI 指标；下方结合渐变色柱状图与环形图实时展现各学院闲置流转活跃度排名与热销品类占比分布。
▲ 图 7：运营后台商品资产管理与风控
功能深度解读：管理人员可对全校所有在售/下架商品进行检索与分类过滤；支持一键将优质好物【置顶推荐至首页】，对疑似违规物品执行【强制下架查封】操作，实现全流程商品合规化运营。
▲ 图 8：学生学籍档案与信用评级管控中心
功能深度解读：集中管控全校学生实名认证状态、学号档案与在售商品数；支持根据履约情况对学生进行【+5 增加信用 / -10 扣分惩戒】动态调节，对违规校外中介账号支持一键封禁与解封。
▲ 图 9：交易订单流转与纠纷仲裁中心
功能深度解读：专门处理买卖双方线下验货发生的争议与纠纷，展示买家举证理由与争议金额；管理员可直接介入裁决，支持【强制退还担保金至买家钱包】或【驳回申诉结算给卖家】，并实时跟踪全校订单流水。
▲ 图 10：校园自提点字典与风控敏感词配置
功能深度解读：支持运营人员对各校区官方推荐的自提柜、食堂面交点与宿管大厅进行动态维护；下方内置平台敏感词词库，发帖时若命中敏感词汇将自动拦截并进入人工审核。
▲ 图 11：手机移动端 (H5/小程序形态) 市集首页
功能深度解读：专为手机端优化的原生质感交互，拥有金刚区分类快捷图标、滑动分类卡片、双列精致瀑布流与原生风格底部 TabBar 导航，极大提升移动端随时随地淘好物的体验。
▲ 图 12：手机移动端宝贝详情与吸底操作条
功能深度解读：移动端宝贝详情支持手势滑动大图与价格标签，底部固定吸底【智能议价】与【担保下单】操作条，触控即可呼出下单抽屉与议价弹窗。
三、 技术架构与系统实现
- 前端框架：
Vue 3.4+（全量基于<script setup>与 Composition API 组合式设计） - 脚手架与构建器：
Vite 5.x（支持毫秒级冷启动与极速热模块重载 HMR） - UI 组件库：
Element Plus 2.6+配合@element-plus/icons-vue图标全套封装 - 状态仓库：
Pinia 2.1+，实现多端响应式数据驱动与持久化 Mock Store - 路由管理：
Vue Router 4（包含 PC、移动端与管理后台三端路由树及守卫） - 数据可视化：
ECharts 5.5+，深度定制渐变色柱状图与自适应环形分布图
四、 本地开箱即用运行教程
# 1. 解压项目源码包后进入项目根目录
cd campus-flea-market
# 2. 安装前端项目所需依赖
npm install
# 3. 启动本地 Vite 开发服务器
npm run dev
# 4. 浏览器访问控制台输出的地址即可立即预览：
# – 电脑PC端：http://localhost:3000/market
# – 手机端H5：http://localhost:3000/m/market
# – 运营后台：http://localhost:3000/admin/dashboard
五、 资源获取与完整源码下载
本项目包含整套前端工程源码（PC+移动+后台三端）、PRD 需求规格说明书、12张高清界面图集、本地运行环境及开箱即用示例数据，已打包上传至夸克网盘无速限下载：
