
软件工程:大作业(阶段 02)
软件工程:大作业报告(阶段二)
前端代码地址:Github
后端代码地址:Github
uniapp 设计
shop 页面最终效果如下:

基本轮廓
在主体小程序内设计了四个 tabbar 页面(首页、联系人、商店及我的)并为其额外设定了激活图案




shop 页面设计
搜索框

这里的搜索区域本质上可以看成一个“贴图”,在点击该区域时会跳转到一个新的页面(搜索页面)


在该窗口下存在三部分内容:
-
搜索区域,这里默认点击会调出手机键盘方便输入
-
搜索历史区域,该区域会读取登录用户存储的本地数据,不受登出及切换账号影响
-
单击搜索历史会跳转到一个搜索结果列表(分页查询)
-
-
搜索结果区域,该区域会通过键入的关键词进行实时搜索并返回结果(分页查询),同时激活该区域会覆盖历史区域部分
-
单击联想结果会直接跳转到对应的详情页面
-
轮播图区域

通过设置数据库内的 channel 表的 is_swiper 来实现动态管理轮播图内容控制。同时单击轮播图可以直接进入频道详情,如上“单击联想结果”
频道分类区域

通过设置数据库内的 channel_category 表可以动态地实现频道分类管理。通过单击相应的频道分类可以进入频道分类内容的列表,同时也提供了无内容提示。


在具体的分类列表内设置了下拉刷新及上拉触底刷新机制实现分页查询,可以有效避免数据请求相关错误的发生。同时也包含基本的数据请求完毕的反馈机制。

channel 频道详情页设置

详情页包含四部分内容:
- 频道预览图
- 频道相关信息(包括名称、创建人及简介)
- 订阅部分
- 补充部分的富文本
其中订阅部分内容主要如下:
-
日期选择器,通过选择合适订阅日期及时间来进行推送
-
订阅者选择,对象为包含自己在内的所有好友,其中自己是不需要进行请求确认的
-
订阅,相应的通过后台数据查询可以返回以下几种结果
- 订阅请求已发送
- 订阅者已订阅该频道
- 订阅失败
SpringBoot 设计(测试以本地为例)
创建订阅频道

返回内容备注:
- 1:正常添加完成
- 0:未添加成功
- -1:已经订阅该频道,未添加成功
获取轮播图数据

获取频道分类数据

通过关键字查询频道

返回内容备注:
- total:查询出符合要求的结果总数
- list:分页结果内容
- pageNum:当前页数
- pageSize:当前页大小
通过 channel_id 获取频道信息

备注:这里的 channel_id 是直接跟在https://localhost:8082/shop/channel/
后的,充当请求数据
本文是原创文章,采用 CC BY-NC-ND 4.0 协议,完整转载请注明来自 Owen
评论
匿名评论
隐私政策
你无需删除空行,直接评论以获取最佳展示效果