github项目地址：https://github.com/yitihua/pilipili

小组成员：

姓名	学号	gitID	应用技术
顾思宇	2016011993	dandelionClaw	全部后端开发（包括ssh、文件上传及shiro框架配置应用）
张慧	2016012019	BUZA2018	HTML5,Vue，JS，CSS
程羚	2016012050	chengling2016012050	HTML,JQuery，CSS

小组分工：

项目介绍

项目简介

pilipili资讯网集合了最新最热门的电视剧、电影、番剧及游戏资讯。管理员上传新闻，游客进行预览，注册后可进入个人界面和进行评论。 管理员可以进行对用户、所有文章、数据字典、资讯栏目的管理。

测试用管理员用户密码：

用户名：admin
密码：admin

功能模块

1.前台页面实现（负责人：张慧）

需要注意的是：为了代码编写方便，部分js文件中封装了JQuery中的$方法 前台页面中对代码直接的操作与维护最好不要链入JQuery文件,以免冲突报错

1.1游客界面

1.1.1网站默认页面

点击导航栏中的资讯类别可以进入不同分区

1.1.2文章预览页面

评论区

结构亮点：该多级评论功能即为树形结构的设计、开发、展示，后端实现具有良好扩展性，可轻松扩展为n级评论。

点击“回复”按钮展开二级评论框

回复框获得焦点展开，当其他一级评论的“回复”按钮被点击时，将收回

点击回复和登录按钮弹出登录/注册框

由用户名密码不合规范导致的注册失败

 

信息合规范时提示通过

1.1.3搜索功能

搜索成功与失败时的新闻列表

1.2普通用户界面

1.2.1头导航栏中，登录按钮变为用户头像

新用户头像为默认头像

普通用户的下拉框样式

1.2.2用户个人信息界面

用户可进行头像等个人信息的更改 点击修改按钮可展开和收起修改面板，完成对信息的修改

头像的修改有两种方式：

• 可点击加号链入本地图片
• 直接将图片拖入提交框内

随后提交框对提交的图片进行预览

以下是修改后的个人界面

1.2.3用户个人评论管理界面

评论为一级评论时，显示评论的文章名

评论为二级评论时，显示评论的评论作者

1.3管理员界面

1.3.1管理员登录后，默认页面显示后台管理入口

1.3.2管理员的头像下拉框多出“写文章”的入口

1.3.3管理员个人界面多出“文章管理选项”

1.3.4文章管理页面

1.3.5写文章

点击页面中的“新增”键或头像下拉框中的“写文章”均可跳转至文章增加页面

文章头图的上传与头像上传相同，可拖入也可从目录选择 文章可以没有头图 添加的头图宽高比最好接近1.68:1

添加好的带头图的文章效果如下

1.3.6文章编辑

1.4需要管理员手动维护的部分

1.4.1轮播图

在main/webapp/static/js文件夹下打开js文件carousel.js文件

在photoes对象中，可以进行对轮播图的增删改查。 photoes对象中，每个对象对应一张轮播图，对象中第一个键值对记录了轮播图的图片地址，第二个键值对记录了图片简介

如新增轮播图，只需要在已有键值对后按序添加新键值对，便可新生成一个轮播图和其按钮

1.4.2精选资讯

在main/webapp/static/js文件夹下打开js文件hotnews.js文件

精选资讯栏提供了五条资讯展示空间,它们的内容由hotnews对象控制

0键：0键决定了是否为资讯标题前加一个小火苗，如有需要，只需将0键的值设为真 1键：1键是该条资讯的标题 2键：2键是该条资讯的链接 如有需要，只需对相应键值对进行修改

2.后台管理页面（负责人：程羚）

2.1 数据字典

点击添加后会跳出相应弹框，效果图如下：

使用弹窗，可以更快的回到之前的页面，速度上比跳转响应要快，使后台管理界面看起来更加简单明了 弹窗界面与原界面相对独立，可以完全不影响页面的布局

 

点击编辑

弹框界面与添加大致相同

此时弹窗界面动态获取当前操作元素，自动读取相应数据并显示

点击删除

2.2 栏目管理

栏目管理所实现功能与数据字典大致相同

将栏目单独管理，可以方便产品的运营和维护

2.3 用户权限管理

在后台的用户权限管理，我们去除了新增权限和权限删除的功能

新增权限即新增用户，随着用户在前台的注册自动生成相关数据 管理员无法随意删除用户账号，用户账号长期保存于数据库中

2.3 新闻管理

在新闻管理时，点击编辑、删除将跳转至新的页面

此时，所处理的任务不在当前的业务流中，故摒弃了之前使用的弹窗方式

2.3.1 文章添加

文章的添加及删除操作，所处理的任务不在当前的业务流中，故摒弃了之前使用的弹窗方式，改为链接跳转

2.3.2 文章编辑

文章编辑与文章添加使用了相同的jsp文件，保持样式完全一致，以免用户产生差异感

2.4 返回前台

点击“返回主页”和“logout”均可返回前台界面，logout将直接登录