基于Java+MySQL实现的新闻网站【100011218】

# 一、系统设计 ## 1.1 ER图 数据库设计1张表，显示页面的各项内容存储表，对应的ER图如图3-1所示。  图3-1 数据库ER图 ## 1.2 UML类图（Class Diagram） 各类的结构及类之间的关系如图2-5所示：  图2-5 用户功能类图 ## 1.3需求分析  按上图设计实现新闻显示页面，页面所需图片，文字均来自数据库。 # 二、系统实现 ## 2.1 项目结构   ## 2.2 配置文件 在项目下引入Vue的js包  ### 2.2.1 jdbc.properties文件 该配置文件主要是以文件形式保存数据库的驱动类名称，连接数据库的URL地址，访问数据库的用户名及对应的密码，程序运行时会读取该文件相关信息，避免硬编码，当相关信息发生变化时，只需修改配置文件而不用修改源代码，增加程序的可扩展型。 ```c++ jdbc.username=root jdbc.password=123456 jdbc.url=jdbc:mysql://47.110.70.107:8081/news?serverTimezone=UTC&useUnicode=true&characterEncoding=utf8 jdbc.className=com.mysql.jdbc.Driver ``` ### 2.2.2 mybatis-config.xml文件 描述该文件作用，并对里面的配置进行解释 ```c++ <?xml version="1.0" encoding="UTF-8" ?> <!DOCTYPE configuration PUBLIC "-//mybatis.org//DTD Config 3.0//EN" "http://mybatis.org/dtd/mybatis-3-config.dtd"> <configuration> <settings> <setting name="mapUnderscoreToCamelCase" value="true"/> <setting name="logImpl" value="STDOUT_LOGGING"/> </settings> <typeAliases> <package name="com.qxx.bean"/> </typeAliases> </configuration> ``` ## 2.3 实体类News ```c++ package com.qxx.bean; import java.io.Serializable; public class News implements Serializable { private Integer id;//可供查询的id private String section;//显示的栏目 private String href;//各个栏目的连接 private Integer pid;//各栏目的显示页面父id private String showType;//各栏目的显示方式 private String summary;//显示页面中的概括内容 private String imgSrc;//页面中的图片资源 private String artical;//相关的内容存储 private static final long serialVersionUID = 1L; public Integer getId() { return id; } public void setId(Integer id) { this.id = id; } public String getSection() { return section; } public void setSection(String section) { this.section = section == null ? null : section.trim(); } public String getHref() { return href; } public void setHref(String href) { this.href = href == null ? null : href.trim(); } public Integer getPid() { return pid; } public void setPid(Integer pid) { this.pid = pid; } public String getShowType() { return showType; } public void setShowType(String showType) { this.showType = showType == null ? null : showType.trim(); } public String getSummary() { return summary; } public void setSummary(String summary) { this.summary = summary == null ? null : summary.trim(); } public String getImgSrc() { return imgSrc; } public void setImgSrc(String imgSrc) { this.imgSrc = imgSrc == null ? null : imgSrc.trim(); } public String getArtical() { return artical; } public void setArtical(String artical) { this.artical = artical == null ? null : artical.trim(); } } ``` ## 2.4 接口类NewsMapper ```c++ package com.qxx.dao; import com.qxx.bean.News; import com.qxx.bean.NewsExample; import java.util.List; import org.apache.ibatis.annotations.Param; public interface NewsMapper { long countByExample(NewsExample example); int deleteByExample(NewsExample example); int deleteByPrimaryKey(Integer id); int insert(News record); int insertSelective(News record); List<News> selectByExampleWithBLOBs(NewsExample example); List<News> selectByExample(NewsExample example); News selectByPrimaryKey(Integer id); int updateByExampleSelective(@Param("record") News record, @Param("example") NewsExample example); int updateByExampleWithBLOBs(@Param("record") News record, @Param("example") NewsExample example); int updateByExample(@Param("record") News record, @Param("example") NewsExample example); int updateByPrimaryKeySelective(News record); int updateByPrimaryKeyWithBLOBs(News record); int updateByPrimaryKey(News record); } ``` ## 2.5 服务层NewsService ```c++ package com.qxx.service; import com.qxx.bean.News; import com.qxx.bean.NewsExample; import com.qxx.dao.NewsMapper; import org.springframework.beans.factory.annotation.Autowired; import org.springframework.stereotype.Service; import java.util.HashMap; import java.util.List; import java.util.Map; @Service public class NewsService { @Autowired NewsMapper newsMapper; //从后端读取内容后以List的方式存储，并将List存入同一个map中 public Map<Integer,Object> getColumns() { NewsExample newsExample = new NewsExample(); NewsExample.Criteria criteria = newsExample.createCriteria(); criteria.andPidEqualTo(0); criteria.andShowTypeEqualTo("0"); List<News> type0List = newsMapper.selectByExample(newsExample); NewsExample newsExample2 = new NewsExample(); NewsExample.Criteria criteria2 = newsExample2.createCriteria(); criteria2.andPidEqualTo(0); criteria2.andShowTypeEqualTo("-1"); List<News> typeSpecialList = newsMapper.selectByExample(newsExample2); Map<Integer,Object> map = new HashMap<>(); map.put(0,type0List); map.put(-1,typeSpecialList); return map; } public List<News> getAll() { NewsExample newsExample = new NewsExample(); return newsMapper.selectByExample(newsExample); } public Map<Integer, Object> getSectionContent(Integer id){ NewsExample newsExample = new NewsExample(); NewsExample.Criteria criteria = newsExample.createCriteria(); criteria.andPidEqualTo(id); criteria.andShowTypeEqualTo("1"); List<News> type1List = newsMapper.selectByExample(newsExample); NewsExample newsExample2 = new NewsExample(); NewsExample.Criteria criteria2 = newsExample2.createCriteria(); criteria2.andPidEqualTo(id); criteria2.andShowTypeEqualTo("2"); List<News> type2List = newsMapper.selectByExample(newsExample2); Map<Integer,Object> map = new HashMap<>(); map.put(1,type1List); map.put(2,type2List); return map; } } ``` ## 2.6 前端页面显示层index.html ```c++ <!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="GB2312"> <script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script> <title>Title</title> </head> <style> hr { height: 2px; border: none; border-top: 2px solid darkred; } .topBtn { background: #ffffff; color: grey; text-align: center; width: 110px; height: 30px; margin-top: -9px; border: none; font-weight: bold; font-size: 19px; } form { border: solid 1px grey; } a{ text-decoration: none; color: black;