定制设计JavaWeb综合案例（黑马程序员2021年JavaWeb课程总结，所有功能均实现，包含数据库sql文件）

目录

1.案例介绍：

1.前端：Vue.js + + ajax（axios）+ html

2.后端：maven + mybatis + servlet 

2.项目结构：

3.BrandMapper接口类

  1. package com.itheima.mapper;
  2.  
  3. import com.itheima.pojo.Brand;
  4. import org.apache.ibatis.annotations.*;
  5.  
  6. import java.util.List;
  7. import java.util.Map;
  8.  
  9. public interface BrandMapper {
  10.     /**
  11.      * 查询所有
  12.      *
  13.      * @return
  14.      */
  15.     @Select("select * from tb_brand")
  16.     @ResultMap("brandResultMap")
  17.     List<Brand> selectAll();
  18.  
  19.     /**
  20.      * dao定制设计层添加数据
  21.      *
  22.      * @param brand
  23.      */
  24.     @Insert("insert into tb_brand values (null,#{brandName},#{companyName},#{ordered},#{description},#{status})")
  25.     void add(Brand brand);
  26.  
  27.     /**
  28.      * 修改字段（定制设计修改全部字段你和修改部分字段），定制设计我用的是修改全部字段
  29.      *sql定制设计语句写到了映射文件
  30.      * @param brand
  31.      * @return
  32.      */
  33.     int update(Brand brand);
  34.  
  35.     /**
  36.      * 单个删除
  37.      * @param id
  38.      */
  39.     @Delete("delete from  tb_brand where id = #{id};")
  40.     void deleteById(int id);
  41.  
  42.     /**
  43.      * 批量删除
  44.      * @param ids
  45.      */
  46.     void deleteByIds( @Param("ids")int [] ids);
  47.  
  48.     /**
  49.      * 定制设计因为有两个参数，所以要用param注解，定制设计我也不知道为啥(分页查询)
  50.      * @param begin
  51.      * @param size
  52.      * @return
  53.      */
  54.     @Select("select * from tb_brand limit #{begin},#{size}")
  55.     @ResultMap("brandResultMap")
  56.     List<Brand> selectByPage(@Param("begin") int begin,@Param("size")int size);
  57.  
  58.     /**
  59.      * 定制设计定制设计定制设计查询总记录数
  60.      * @return
  61.      */
  62.     @Select("select Count(*) from tb_brand")
  63.     int selectTotalCount();
  64.  
  65.     /**
  66.      * 定制设计定制设计分页条件查询
  67.      * @param begin
  68.      * @param size
  69.      * @param brand
  70.      * @return
  71.      */
  72.     List<Brand> selectByPageAndCondition(@Param("begin") int begin,@Param("size")int size,@Param("brand") Brand brand);
  73.  
  74.     /**
  75.      * 查询总记录数（分页版本）(定制设计根据条件查询)
  76.      * @param brand
  77.      * @return
  78.      */
  79.     int selectTotalCountByCondition(Brand brand);
  80. }

4.Brand实体类

  1. package com.itheima.pojo;
  2.  
  3. public class Brand {
  4.     // id 主键
  5.     private Integer id;
  6.     // 品牌名称
  7.     private String brandName;
  8.     // 企业名称
  9.     private String companyName;
  10.     // 排序字段
  11.     private Integer ordered;
  12.     // 描述信息
  13.     private String description;
  14.     // 状态：0：禁用  1：启用
  15.     private Integer status;
  16.  
  17.  
  18.     public Integer getId() {
  19.         return id;
  20.     }
  21.  
  22.     public void setId(Integer id) {
  23.         this.id = id;
  24.     }
  25.  
  26.     public String getBrandName() {
  27.         return brandName;
  28.     }
  29.  
  30.     public void setBrandName(String brandName) {
  31.         this.brandName = brandName;
  32.     }
  33.  
  34.     public String getCompanyName() {
  35.         return companyName;
  36.     }
  37.  
  38.     public void setCompanyName(String companyName) {
  39.         this.companyName = companyName;
  40.     }
  41.  
  42.     public Integer getOrdered() {
  43.         return ordered;
  44.     }
  45.  
  46.     public void setOrdered(Integer ordered) {
  47.         this.ordered = ordered;
  48.     }
  49.  
  50.     public String getDescription() {
  51.         return description;
  52.     }
  53.  
  54.     public void setDescription(String description) {
  55.         this.description = description;
  56.     }
  57.  
  58.     public Integer getStatus() {
  59.         return status;
  60.     }
  61.     //逻辑视图
  62.     public String getStatusStr(){
  63.         if (status == null){
  64.             return "未知";
  65.         }
  66.         return status == 0 ? "禁用":"启用";
  67.     }
  68.  
  69.     public void setStatus(Integer status) {
  70.         this.status = status;
  71.     }
  72.  
  73.     @Override
  74.     public String toString() {
  75.         return "Brand{" +
  76.                 "id=" + id +
  77.                 ", brandName='" + brandName + '\'' +
  78.                 ", companyName='" + companyName + '\'' +
  79.                 ", ordered=" + ordered +
  80.                 ", description='" + description + '\'' +
  81.                 ", status=" + status +
  82.                 '}';
  83.     }
  84. }

5.PageBean实体类

  1. package com.itheima.pojo;
  2.  
  3. import java.util.List;
  4.  
  5. /**
  6.  * 定制设计分页查询的的JavaBean，定制设计目的是为了给前端提供数据
  7.  */
  8. public class PageBean<T> {
  9.  
  10.  
  11.     //总记录数
  12.     private int totalCount;
  13.     //定制设计当前页数据,泛型T，定制设计是为了更好的适配各种定制设计各样的实体
  14.     private List<T> rows;
  15.  
  16.  
  17.  
  18.     public int getTotalCount() {
  19.         return totalCount;
  20.     }
  21.  
  22.     public List<T> getRows() {
  23.         return rows;
  24.     }
  25.  
  26.     public void setTotalCount(int totalCount) {
  27.         this.totalCount = totalCount;
  28.     }
  29.  
  30.     public void setRows(List<T> rows) {
  31.         this.rows = rows;
  32.     }
  33. }

6.BrandService接口类

  1. package com.itheima.service;
  2.  
  3. import com.itheima.pojo.Brand;
  4. import com.itheima.pojo.PageBean;
  5. import org.apache.ibatis.annotations.Param;
  6.  
  7. import java.util.List;
  8.  
  9. public interface BrandService {
  10.     /**
  11.      * 查询所有
  12.      *
  13.      * @return
  14.      */
  15.     List<Brand> selectAll();
  16.  
  17.     /**
  18.      * 插入表单
  19.      *
  20.      * @param brand
  21.      */
  22.     void add(Brand brand);
  23.  
  24.     /**
  25.      * 定制设计部分和全部修改全部有
  26.      *
  27.      * @param brand
  28.      * @return
  29.      */
  30.     int update(Brand brand);
  31.  
  32.     /**
  33.      * 删除一个
  34.      *
  35.      * @param id
  36.      */
  37.     void deleteById(int id);
  38.  
  39.     /**
  40.      * 批量删除
  41.      *
  42.      * @param ids
  43.      */
  44.     void deleteByIds(int[] ids);
  45.  
  46.     /**
  47.      * 分页查询
  48.      *
  49.      * @param currentPage 当前页码
  50.      * @param pageSize    定制设计定制设计每页展示条数
  51.      * @return
  52.      */
  53.     PageBean<Brand> selectByPage(int currentPage, int pageSize);
  54.  
  55.     /**
  56.      * 分页条件查询
  57.      * @param currentPage
  58.      * @param pageSize
  59.      * @param brand
  60.      * @return
  61.      */
  62.     PageBean<Brand> selectByPageAndCondition(int currentPage, int pageSize, Brand brand);
  63.  
  64. }

7.BrandServiceimpl实现类

  1. package com.itheima.service.impl;
  2.  
  3. import com.itheima.mapper.BrandMapper;
  4. import com.itheima.pojo.Brand;
  5. import com.itheima.pojo.PageBean;
  6. import com.itheima.service.BrandService;
  7. import com.itheima.util.SqlSessionFactoryUtils;
  8. import org.apache.ibatis.session.SqlSession;
  9. import org.apache.ibatis.session.SqlSessionFactory;
  10.  
  11. import java.util.List;
  12.  
  13. public class BrandServiceImpl implements BrandService {
  14.     //定制设计初始化工具类
  15.     private SqlSessionFactory sqlSessionFactory = SqlSessionFactoryUtils.getSqlSessionFactory();
  16.  
  17.     /**
  18.      * 查询所有
  19.      *
  20.      * @return
  21.      */
  22.     @Override
  23.     public List<Brand> selectAll() {
  24.         //1.获取sqlsession的对象
  25.         SqlSession sqlSession = sqlSessionFactory.openSession(true);//定制设计定制设计定制设计定制设计定制设计定制设计自定提交事务
  26.         //2.获取BrandMapper映射文件
  27.         BrandMapper mapper = sqlSession.getMapper(BrandMapper.class);
  28.         //3.调取service定制设计定制设计定制设计定制设计定制设计接口的方法
  29.         List<Brand> brands = mapper.selectAll();
  30.         //4.释放资源
  31.         sqlSession.close();
  32.         //5.返回集合
  33.         return brands;
  34.     }
  35.  
  36.     /**
  37.      * 插入表单
  38.      *
  39.      * @param brand
  40.      */
  41.     @Override
  42.     public void add(Brand brand) {
  43.         //1.获取sqlsession的对象
  44.         SqlSession sqlSession = sqlSessionFactory.openSession(true);//自定提交事务
  45.         //2.获取BrandMapper映射文件
  46.         BrandMapper mapper = sqlSession.getMapper(BrandMapper.class);
  47.         //3.调取service接口的方法
  48.         mapper.add(brand);
  49.         //4.释放资源
  50.         sqlSession.close();
  51.  
  52.     }
  53.  
  54.     /**
  55.      * 更新，定制设计因为是部分更新，定制设计所以全部更新1也能用
  56.      *
  57.      * @param brand
  58.      * @return
  59.      */
  60.     @Override
  61.     public int update(Brand brand) {
  62.         //1.获取sqlsession的对象
  63.         SqlSession sqlSession = sqlSessionFactory.openSession(true);//自定提交事务
  64.         //2.获取BrandMapper映射文件
  65.         BrandMapper mapper = sqlSession.getMapper(BrandMapper.class);
  66.         //3.调取service接口的方法
  67.         int update = mapper.update(brand);
  68.         //4.释放资源
  69.         sqlSession.close();
  70.         //5.给返回值
  71.         return update;
  72.     }
  73.  
  74.     /**
  75.      * 删除一个
  76.      *
  77.      * @param id
  78.      */
  79.     @Override
  80.     public void deleteById(int id) {
  81.         //1.获取sqlsession的对象
  82.         SqlSession sqlSession = sqlSessionFactory.openSession(true);//自定提交事务
  83.         //2.获取BrandMapper映射文件
  84.         BrandMapper mapper = sqlSession.getMapper(BrandMapper.class);
  85.         //3.调取service接口的方法
  86.         mapper.deleteById(id);
  87.         //4.释放资源
  88.         sqlSession.close();
  89.     }
  90.  
  91.     /**
  92.      * 批量删除
  93.      *
  94.      * @param ids
  95.      */
  96.     @Override
  97.     public void deleteByIds(int[] ids) {
  98.         //1.获取sqlsession的对象
  99.         SqlSession sqlSession = sqlSessionFactory.openSession(true);//自定提交事务
  100.         //2.获取BrandMapper映射文件
  101.         BrandMapper mapper = sqlSession.getMapper(BrandMapper.class);
  102.         //3.调取service接口的方法
  103.         mapper.deleteByIds(ids);
  104.         //4.释放资源
  105.         sqlSession.close();
  106.     }
  107.  
  108.     /**
  109.      * 分页查询(定制设计学到了新知识，真高兴，定制设计激动的不得了)
  110.      *
  111.      * @param currentPage 当前页码
  112.      * @param pageSize    每页展示条数
  113.      * @return
  114.      */
  115.     @Override
  116.     public PageBean<Brand> selectByPage(int currentPage, int pageSize) {
  117.         //1.获取sqlsession的对象
  118.         SqlSession sqlSession = sqlSessionFactory.openSession(true);//自定提交事务
  119.         //2.获取BrandMapper映射文件
  120.         BrandMapper mapper = sqlSession.getMapper(BrandMapper.class);
  121.  
  122.         //3.计算
  123.         int begin = (currentPage - 1) * pageSize;
  124.         int size = pageSize;
  125.  
  126.         //4.定制设计查询当前页的数据
  127.         List<Brand> rows= mapper.selectByPage(begin, size);
  128.  
  129.         //5.查询总记录数
  130.         int totalCount = mapper.selectTotalCount();
  131.  
  132.         //6.把rows与totalCount封装成一个PageBean对象
  133.         PageBean<Brand> pageBean = new PageBean<>();
  134.         pageBean.setRows(rows);
  135.         pageBean.setTotalCount(totalCount);
  136.  
  137.         //7.释放资源
  138.         sqlSession.close();
  139.  
  140.         //8.返回值
  141.         return pageBean;
  142.     }
  143.  
  144.     /**
  145.      * 分页条件查询
  146.      *
  147.      * @param currentPage
  148.      * @param pageSize
  149.      * @param brand
  150.      * @return
  151.      */
  152.     @Override
  153.     public PageBean<Brand> selectByPageAndCondition(int currentPage, int pageSize, Brand brand) {
  154.         //1.获取sqlsession的对象
  155.         SqlSession sqlSession = sqlSessionFactory.openSession(true);//自定提交事务
  156.         //2.获取BrandMapper映射文件
  157.         BrandMapper mapper = sqlSession.getMapper(BrandMapper.class);
  158.  
  159.         //3.计算,,处理一下brand条件，模糊表达式
  160.         int begin = (currentPage - 1) * pageSize;
  161.         int size = pageSize;
  162.  
  163.         //处理brand条件，模糊表达式
  164.         String brandName = brand.getBrandName();
  165.         if(brandName != null  && brandName.length()>0){
  166.             brand.setBrandName("%"+brandName+"%");
  167.         }
  168.         String companyName = brand.getCompanyName();
  169.         if(companyName != null  && companyName.length()>0){
  170.             brand.setCompanyName("%"+companyName+"%");
  171.         }
  172.  
  173.         //4.查询当前页的数据
  174.         List<Brand> rows= mapper.selectByPageAndCondition(begin, size,brand);
  175.  
  176.         //5.查询总记录数
  177.         int totalCount = mapper.selectTotalCountByCondition(brand);
  178.  
  179.         //6.把rows与totalCount封装成一个PageBean对象
  180.         PageBean<Brand> pageBean = new PageBean<>();
  181.         pageBean.setRows(rows);
  182.         pageBean.setTotalCount(totalCount);
  183.  
  184.         //7.释放资源
  185.         sqlSession.close();
  186.  
  187.         //8.返回值
  188.         return pageBean;
  189.     }
  190.  
  191. }

8.SqlSessionFactoryUtils工具类

  1. package com.itheima.util;
  2.  
  3. import org.apache.ibatis.io.Resources;
  4. import org.apache.ibatis.session.SqlSessionFactory;
  5. import org.apache.ibatis.session.SqlSessionFactoryBuilder;
  6.  
  7. import java.io.IOException;
  8. import java.io.InputStream;
  9.  
  10. public class SqlSessionFactoryUtils {
  11.  
  12.     private static SqlSessionFactory sqlSessionFactory;
  13.  
  14.     static {
  15.         //静态代码块会随着类的加载而自动执行，且只执行一次
  16.         try {
  17.             String resource = "mybatis-config.xml";
  18.             InputStream inputStream = Resources.getResourceAsStream(resource);
  19.             sqlSessionFactory = new SqlSessionFactoryBuilder().build(inputStream);
  20.         } catch (IOException e) {
  21.             e.printStackTrace();
  22.         }
  23.     }
  24.  
  25.  
  26.     public static SqlSessionFactory getSqlSessionFactory(){
  27.         return sqlSessionFactory;
  28.     }
  29. }

9.BaseServlet

  1. package com.itheima.web.servlet;
  2.  
  3. import javax.servlet.*;
  4. import javax.servlet.http.*;
  5. import javax.servlet.annotation.*;
  6. import java.io.BufferedReader;
  7. import java.io.IOException;
  8. import java.lang.reflect.InvocationTargetException;
  9. import java.lang.reflect.Method;
  10.  
  11. /**
  12.  * 1.替换HttpServlet的protected service的方法，使之很具请求最后一段路径名来进行方法分发
  13.  * 2.重写protected service方法准备重写
  14.  */
  15.  
  16. public class BaseServlet extends HttpServlet {
  17.  
  18.     /**
  19.      * service的方法是servlet会自动调用的，如果没有复写，就会去调用HttpServlet中的service方法
  20.      * 根据请求的最后一段来进行方法分发
  21.      */
  22.     @Override
  23.     protected void service(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
  24.  
  25.         //1.获取请求路径(获取地址栏输入的url地址路径)，短路径,req.getRequestURL()(长路径)
  26.         String uri = req.getRequestURI(); //uri形式为/Brand-case/brand/selectAll
  27.  
  28.         //2.截取  整条路经的最后的执行文件（方法名）（截取字符串）
  29.         int index = uri.lastIndexOf("/");//从后往前数 “/” 第一次出现的索引
  30.         String methodName = uri.substring(index+1);//由于结果是  /selectAll带斜杆---我不是很理解
  31.  
  32.         //3.执行方法
  33.         //3.1 获取BrandServlet/UserServlet的字节码文件 Class
  34.         //this 谁调用我，我代表谁（谁调用this所在的方法，谁就是this，可以是brandServlet，UserServlet，Base的任何子类）
  35.         Class<? extends BaseServlet> cls = this.getClass();
  36.  
  37.         //3.2获取方法method对象()请求参数
  38.         try {
  39.             //3.2获取方法method对象()请求参数
  40.             Method method = cls.getMethod(methodName,HttpServletRequest.class,HttpServletResponse.class);
  41.  
  42.             //3.3执行方法
  43.             method.invoke(this,req,resp);
  44.  
  45.         } catch (NoSuchMethodException e) {
  46.             e.printStackTrace();
  47.         } catch (InvocationTargetException e) {
  48.             e.printStackTrace();
  49.         } catch (IllegalAccessException e) {
  50.             e.printStackTrace();
  51.         }
  52.  
  53.  
  54.     }
  55. }

10.BrandServlet

  1. package com.itheima.web.servlet;
  2.  
  3. import com.alibaba.fastjson.JSON;
  4. import com.alibaba.fastjson.JSONObject;
  5. import com.itheima.pojo.Brand;
  6. import com.itheima.pojo.PageBean;
  7. import com.itheima.service.BrandService;
  8. import com.itheima.service.impl.BrandServiceImpl;
  9.  
  10. import javax.servlet.ServletException;
  11. import javax.servlet.annotation.*;
  12. import javax.servlet.http.HttpServletRequest;
  13. import javax.servlet.http.HttpServletResponse;
  14. import java.io.BufferedReader;
  15. import java.io.IOException;
  16. import java.util.List;
  17.  
  18. @WebServlet("/brand/*")
  19. public class BrandServlet extends BaseServlet {
  20.  
  21.     //如果将来service层的代码发生了变化，相对应的servlet的代码也得跟着变，而接口不用变化，
  22.     private BrandService brandService = new BrandServiceImpl();
  23.  
  24.  
  25.     /**
  26.      * selectAll查询所有
  27.      *
  28.      * @param request
  29.      * @param response
  30.      * @throws ServletException
  31.      * @throws IOException
  32.      */
  33.     public void selectAll(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
  34.         //1.获取service实现类中的方法
  35.         List<Brand> brands = brandService.selectAll();
  36.  
  37.         //2.把service实现类中返回值改成json格式，
  38.         String s = JSON.toJSONString(brands);
  39.  
  40.         //3.别忘了编码问题，从数据库出来，改成json的格式,并设置data的结果值
  41.         response.setContentType("text/json;charset=utf-8");
  42.         response.getWriter().write(s);
  43.     }
  44.  
  45.     /**
  46.      * 添加数据（暂时没有灵活性的添加数据）
  47.      *
  48.      * @param request
  49.      * @param response
  50.      * @throws ServletException
  51.      * @throws IOException
  52.      */
  53.     public void add(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
  54.  
  55.         //1.获取请求行数据（获取json格式的独特方法JavaWeb）
  56.         BufferedReader reader = request.getReader();
  57.  
  58.         //2.读取请求行数据（json字符串）
  59.         String s = reader.readLine();
  60.  
  61.         //3.把json格式转为java对象
  62.         Brand brand = JSONObject.parseObject(s, Brand.class);
  63.  
  64.         //4.调用BrandServiceImpl方法,并且传入数据
  65.         brandService.add(brand);
  66.  
  67.         //5.相应成功后的数据（如果代码正常执行，给与前端一个相应成功的字符串）
  68.         response.getWriter().write("success");
  69.     }
  70.  
  71.     /**
  72.      * 删除数据（根据单个的id传入参数，进行传入id）
  73.      *
  74.      * @param request
  75.      * @param response
  76.      * @throws ServletException
  77.      * @throws IOException
  78.      */
  79.     public void deleteById(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
  80.  
  81.         //1.获取请求行数据（获取json格式的独特方法JavaWeb）
  82.         BufferedReader reader = request.getReader();
  83.  
  84.         //2.读取请求行数据（json字符串）
  85.         String s = reader.readLine();
  86.  
  87.         //3.把json格式转为java对象
  88.         Brand brand = JSONObject.parseObject(s, Brand.class);
  89.  
  90.         //4.调用BrandServiceImpl方法,并且传入数据
  91.         brandService.deleteById(brand.getId());
  92.  
  93.         //5.相应成功后的数据（如果代码正常执行，给与前端一个相应成功的字符串）
  94.         response.getWriter().write("success");
  95.     }
  96.  
  97.     /**
  98.      * 部分数据，和全部数据更新都有了
  99.      *
  100.      * @param request
  101.      * @param response
  102.      * @throws ServletException
  103.      * @throws IOException
  104.      */
  105.     public void update(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
  106.  
  107.         //1.获取请求行数据（获取json格式的独特方法JavaWeb）
  108.         BufferedReader reader = request.getReader();
  109.  
  110.         //2.读取请求行数据（json字符串）
  111.         String s = reader.readLine();
  112.  
  113.         //3.把json格式转为java对象
  114.         Brand brand = JSONObject.parseObject(s, Brand.class);
  115.         //4.调用BrandServiceImpl方法,并且传入数据
  116.         brandService.update(brand);
  117.  
  118.         //5.相应成功后的数据（如果代码正常执行，给与前端一个相应成功的字符串）
  119.         response.getWriter().write("success");
  120.     }
  121.  
  122.     /**
  123.      * 批量删除
  124.      *
  125.      * @param request
  126.      * @param response
  127.      * @throws ServletException
  128.      * @throws IOException
  129.      */
  130.     public void deleteByIds(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
  131.  
  132.         //1.获取请求行数据（获取json格式的独特方法JavaWeb)(获取数据形式多种多样)
  133.         BufferedReader reader = request.getReader();
  134.  
  135.         //2.读取请求行数据（json字符串）
  136.         String s = reader.readLine();
  137.  
  138.         //3.把json格式转为java对象
  139.         int[] ids = JSONObject.parseObject(s, int[].class);
  140.  
  141.         //4.调用BrandServiceImpl方法,并且传入数据
  142.         brandService.deleteByIds(ids);
  143.  
  144.         //5.相应成功后的数据（如果代码正常执行，给与前端一个相应成功的字符串）
  145.         response.getWriter().write("success");
  146.     }
  147.  
  148.     /**
  149.      * 分页查询
  150.      *
  151.      * @param request
  152.      * @param response
  153.      * @throws ServletException
  154.      * @throws IOException
  155.      */
  156.     public void selectByPage(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
  157.         //1.获取当前页码handleCurrentChange，和每页展示条数handleSizeChange url?currentPage=1&pageSize=5,把参数放到请求之后
  158.         String _currentPage = request.getParameter("currentPage");
  159.         String _pageSize = request.getParameter("pageSize");
  160.  
  161.         //2.把接收的数据，转换成Integer
  162.         int currentPage = Integer.parseInt(_currentPage);
  163.         int pageSize = Integer.parseInt(_pageSize);
  164.  
  165.         //3.调用service进行查询
  166.         PageBean<Brand> brandPageBean = brandService.selectByPage(currentPage, pageSize);
  167.  
  168.         //4.把service实现类中返回值改成json格式，
  169.         String s = JSON.toJSONString(brandPageBean);
  170.  
  171.         //5.别忘了编码问题，从数据库出来，改成json的格式,并设置data的结果值
  172.         response.setContentType("text/json;charset=utf-8");
  173.         response.getWriter().write(s);
  174.     }
  175.  
  176.     /**
  177.      * 分页动态条件查询
  178.      *
  179.      * @param request
  180.      * @param response
  181.      * @throws ServletException
  182.      * @throws IOException
  183.      */
  184.     public void selectByPageAndCondition(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
  185.  
  186.         //1.获取当前页码handleCurrentChange，和每页展示条数handleSizeChange url?currentPage=1&pageSize=5,把参数放到请求之后
  187.         String _currentPage = request.getParameter("currentPage");
  188.         String _pageSize = request.getParameter("pageSize");
  189.  
  190.         //2.把接收的数据，转换成Integer
  191.         int currentPage = Integer.parseInt(_currentPage);
  192.         int pageSize = Integer.parseInt(_pageSize);
  193.  
  194.  
  195.         //1.获取请求行数据（获取json格式的独特方法JavaWeb）
  196.         BufferedReader reader = request.getReader();
  197.  
  198.         //2.读取请求行数据（json字符串）
  199.         String s = reader.readLine();
  200.  
  201.         //3.把json格式转为java对象
  202.         Brand brand = JSONObject.parseObject(s, Brand.class);
  203.  
  204.  
  205.         //3.调用service进行查询
  206.         PageBean<Brand> brandPageBean = brandService.selectByPageAndCondition(currentPage, pageSize, brand);
  207.  
  208.         //4.把service实现类中返回值改成json格式，
  209.         String s2 = JSON.toJSONString(brandPageBean);
  210.  
  211.         //5.别忘了编码问题，从数据库出来，改成json的格式,并设置data的结果值
  212.         response.setContentType("text/json;charset=utf-8");
  213.         response.getWriter().write(s2);
  214.     }
  215. }
  216.  
  217.

11.UserServlet（没有写）

12.BrandMapper.xml映射文件

  1. <?xml version="1.0" encoding="UTF-8" ?>
  2. <!DOCTYPE mapper
  3.         PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
  4.         "http://mybatis.org/dtd/mybatis-3-mapper.dtd">
  5. <mapper namespace="com.itheima.mapper.BrandMapper">
  6.  
  7.     <resultMap id="brandResultMap" type="brand">
  8.         <result property="brandName" column="brand_name"/>
  9.         <result property="companyName" column="company_name"/>
  10.     </resultMap>
  11.  
  12.     <!--
  13.          修改部分字段（当然也能修改全部字段）详细内容看https://blog.csdn.net/qq_51272114/article/details/
  14.     -->
  15.     <update id="update">
  16.         update tb_brand
  17.         <set>
  18.             <if test="companyName != null and companyName != '' ">
  19.                 company_name=#{companyName},
  20.             </if>
  21.             <if test="brandName != null and brandName != '' ">
  22.                 brand_name=#{brandName},
  23.             </if>
  24.             <if test="ordered != null ">
  25.                 ordered=#{ordered},
  26.             </if>
  27.             <if test="description != null and description != '' ">
  28.                 description=#{description},
  29.             </if>
  30.             <if test="status != null ">
  31.                 status=#{status}
  32.             </if>
  33.         </set>
  34.         where id = #{id};
  35.     </update>
  36.  
  37.     <!--
  38.         批量删除数据（遍历id集合），详细内容看https://blog.csdn.net/qq_51272114/article/details/
  39.     -->
  40.     <delete id="deleteByIds">
  41.         delete from tb_brand where id in
  42.         <foreach collection="ids" item="id" separator="," open="(" close=")">#{id}</foreach>
  43.         ;
  44.     </delete>
  45.  
  46.      <!--
  47.           f分页条件查询
  48.      -->
  49.  
  50.     <select id="selectByPageAndCondition" resultType="com.itheima.pojo.Brand" resultMap="brandResultMap">
  51.         select * from tb_brand
  52.         <where>
  53.             <if test="brand.status  != null">
  54.                 and status = #{brand.status}
  55.             </if>
  56.             <if test="brand.companyName != null and brand.companyName != '' ">
  57.                 and company_name like #{brand.companyName}
  58.             </if>
  59.             <if test="brand.brandName != null and brand.brandName != ''">
  60.                 and brand_name like #{brand.brandName}
  61.             </if>
  62.         </where>
  63.         limit #{begin},#{size}
  64.     </select>
  65.  
  66.     <!--
  67.             根据条件查询总记录数
  68.     -->
  69.     <select id="selectTotalCountByCondition" resultType="java.lang.Integer">
  70.         select count(*) from tb_brand
  71.         <where>
  72.             <if test="status  != null">
  73.                 and status = #{status}
  74.             </if>
  75.             <if test="companyName != null and companyName != '' ">
  76.                 and company_name like #{companyName}
  77.             </if>
  78.             <if test="brandName != null and brandName != ''">
  79.                 and brand_name like #{brandName}
  80.             </if>
  81.         </where>
  82.     </select>
  83. </mapper>

13.mybatis-config.xml连接数据库文件

  1. <?xml version="1.0" encoding="UTF-8" ?>
  2. <!DOCTYPE configuration
  3.         PUBLIC "-//mybatis.org//DTD Config 3.0//EN"
  4.         "http://mybatis.org/dtd/mybatis-3-config.dtd">
  5. <configuration>
  6.  
  7.     <typeAliases>
  8.         <package name="com.itheima.pojo"/>
  9.     </typeAliases>
  10.  
  11.     <environments default="development">
  12.         <environment id="development">
  13.             <transactionManager type="JDBC"/>
  14.             <dataSource type="POOLED">
  15.                 <property name="driver" value="com.mysql.jdbc.Driver"/>
  16.                 <property name="url" value="jdbc:mysql:///db1?useSSL=false"/>
  17.                 <property name="username" value="root"/>
  18.                 <property name="password" value="root"/>
  19.             </dataSource>
  20.         </environment>
  21.     </environments>
  22.     <mappers>
  23.        <!--扫描mapper-->
  24.         <package name="com.itheima.mapper"/>
  25.     </mappers>
  26. </configuration>

14.brand.html

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <title>Title</title>
  6.     <style>
  7.         .el-table .warning-row {
  8.             background: oldlace;
  9.         }
  10.  
  11.         .el-table .success-row {
  12.             background: #f0f9eb;
  13.         }
  14.     </style>
  15.  
  16. </head>
  17. <body>
  18. <div id="app">
  19.  
  20.     <!--搜索表单-->
  21.     <el-form :inline="true" :model="brand" class="demo-form-inline">
  22.  
  23.         <el-form-item label="当前状态">
  24.             <el-select v-model="brand.status" placeholder="当前状态">
  25.                 <el-option label="启用" value="1"></el-option>
  26.                 <el-option label="禁用" value="0"></el-option>
  27.             </el-select>
  28.         </el-form-item>
  29.  
  30.         <el-form-item label="企业名称">
  31.             <el-input v-model="brand.companyName" placeholder="企业名称"></el-input>
  32.         </el-form-item>
  33.  
  34.         <el-form-item label="品牌名称">
  35.             <el-input v-model="brand.brandName" placeholder="品牌名称"></el-input>
  36.         </el-form-item>
  37.  
  38.         <el-form-item>
  39.             <el-button type="primary" @click="onSubmit">查询</el-button>
  40.         </el-form-item>
  41.     </el-form>
  42.  
  43.     <!--按钮-->
  44.  
  45.     <el-row>
  46.  
  47.         <el-button type="danger" plain @click="deleteByIds">批量删除</el-button>
  48.         <el-button type="primary" plain @click="dialogVisible = true">新增</el-button>
  49.  
  50.     </el-row>
  51.     <!--添加数据对话框表单-->
  52.     <el-dialog
  53.             title="新增品牌"
  54.             :visible.sync="dialogVisible"
  55.             width="30%"
  56.     >
  57.  
  58.         <el-form ref="form" :model="brand" label-width="80px">
  59.             <el-form-item label="品牌名称">
  60.                 <el-input v-model="brand.brandName"></el-input>
  61.             </el-form-item>
  62.  
  63.             <el-form-item label="企业名称">
  64.                 <el-input v-model="brand.companyName"></el-input>
  65.             </el-form-item>
  66.  
  67.             <el-form-item label="排序">
  68.                 <el-input v-model="brand.ordered"></el-input>
  69.             </el-form-item>
  70.  
  71.             <el-form-item label="备注">
  72.                 <el-input type="textarea" v-model="brand.description"></el-input>
  73.             </el-form-item>
  74.  
  75.             <el-form-item label="状态">
  76.                 <el-switch v-model="brand.status"
  77.                            active-value="1"
  78.                            inactive-value="0"
  79.                 ></el-switch>
  80.             </el-form-item>
  81.  
  82.  
  83.             <el-form-item>
  84.                 <el-button type="primary" @click="addBrand">提交</el-button>
  85.                 <el-button @click="dialogVisible = false">取消</el-button>
  86.             </el-form-item>
  87.         </el-form>
  88.  
  89.     </el-dialog>
  90.  
  91.     <!--update表单-->
  92.     <el-dialog
  93.             title="修改品牌"
  94.             :visible.sync="updateDialogVisible"
  95.             width="30%"
  96.     >
  97.  
  98.         <el-form ref="form" :model="brand" label-width="80px">
  99.             <el-input v-model="brand.id" type="hidden"></el-input>
  100.             <el-form-item label="品牌名称">
  101.                 <el-input v-model="brand.brandName"></el-input>
  102.             </el-form-item>
  103.  
  104.             <el-form-item label="企业名称">
  105.                 <el-input v-model="brand.companyName"></el-input>
  106.             </el-form-item>
  107.  
  108.             <el-form-item label="排序">
  109.                 <el-input v-model="brand.ordered"></el-input>
  110.             </el-form-item>
  111.  
  112.             <el-form-item label="备注">
  113.                 <el-input type="textarea" v-model="brand.description"></el-input>
  114.             </el-form-item>
  115.  
  116.             <el-form-item label="状态">
  117.                 <el-switch v-model="brand.status"
  118.                            active-value="1"
  119.                            inactive-value="0"
  120.                 ></el-switch>
  121.             </el-form-item>
  122.  
  123.             <el-form-item>
  124.                 <el-button type="primary" @click="updateBrand">提交</el-button>
  125.                 <el-button @click="updateDialogVisible = false">取消</el-button>
  126.             </el-form-item>
  127.         </el-form>
  128.  
  129.     </el-dialog>
  130.  
  131.     <!--表格-->
  132.     <template>
  133.         <el-table
  134.                 :data="tableData"
  135.                 style="width: 100%"
  136.                 :row-class-name="tableRowClassName"
  137.                 @selection-change="handleSelectionChange"
  138.         >
  139.             <el-table-column
  140.                     type="selection"
  141.                     width="55">
  142.             </el-table-column>
  143.             <el-table-column
  144.                     type="index"
  145.                     width="50">
  146.             </el-table-column>
  147.  
  148.             <el-table-column
  149.                     prop="brandName"
  150.                     label="品牌名称"
  151.                     align="center"
  152.             >
  153.             </el-table-column>
  154.             <el-table-column
  155.                     prop="companyName"
  156.                     label="企业名称"
  157.                     align="center"
  158.             >
  159.             </el-table-column>
  160.             <el-table-column
  161.                     prop="ordered"
  162.                     align="center"
  163.                     label="排序">
  164.             </el-table-column>
  165.             <el-table-column
  166.                     prop="status"
  167.                     align="center"
  168.                     label="当前状态">
  169.             </el-table-column>
  170.  
  171.             <el-table-column
  172.                     align="center"
  173.                     label="操作">
  174.                 <template slot-scope="scope">
  175.                     <el-row>
  176.                         <el-button type="primary" @click=startUpdate(scope.row)>修改</el-button>
  177.                         <el-button type="danger" @click="open(scope.row)">删除</el-button>
  178.                     </el-row>
  179.                 </template>
  180.  
  181.             </el-table-column>
  182.  
  183.         </el-table>
  184.     </template>
  185.  
  186.     <!--分页工具条-->
  187.     <el-pagination
  188.             @size-change="handleSizeChange"
  189.             @current-change="handleCurrentChange"
  190.             :current-page="currentPage"
  191.             :page-sizes="[5, 10, 15, 20]"
  192.             :page-size="5"
  193.             layout="total, sizes, prev, pager, next, jumper"
  194.             :total="totalCount"
  195.             background
  196.             layout="prev, pager, next"
  197.             :total="100">
  198.     </el-pagination>
  199.  
  200. </div>
  201.  
  202.  
  203. <script src="js/vue.js"></script>
  204. <script src="element-ui/lib/index.js"></script>
  205. <link rel="stylesheet" href="element-ui/lib/theme-chalk/index.css">
  206. <script src="js/axios-0.18.0.js"></script>
  207. <script>
  208.     new Vue({
  209.         el: "#app",
  210.  
  211.         mounted() {
  212.             //调用selectAll方法直接使用
  213.             this.selectAll();
  214.         },
  215.         methods: {
  216.             selectAll() {
  217.                 //var _this = this;//提生命周期
  218.                 axios({
  219.                     method: "post",
  220.                     url: "http://localhost:8080/brand-case/brand/selectByPageAndCondition?currentPage=" + this.currentPage + "&pageSize=" + this.pageSize + "",
  221.                     data: this.brand,
  222.                 }).then(resp => {  //新特性，然后就可以在then里面的下划线say no了
  223.                     this.tableData = resp.data.rows;//此时{rows:[],totalCount:[]}
  224.                     this.totalCount = resp.data.totalCount;
  225.                 })
  226.             },
  227.             tableRowClassName({row, rowIndex}) {
  228.                 if (rowIndex === 1) {
  229.                     return 'warning-row';
  230.                 } else if (rowIndex === 3) {
  231.                     return 'success-row';
  232.                 }
  233.                 return '';
  234.             },
  235.             // 复选框选中后执行的方法
  236.             handleSelectionChange(val) {
  237.                 this.multipleSelection = val;
  238.  
  239.                 console.log(this.multipleSelection)
  240.             },
  241.             // 添加数据
  242.             addBrand() {
  243.                 //console.log(this.brand);
  244.                 //发送Ajax请求，发送json数据
  245.                 //var _this = this;
  246.                 axios({
  247.                     method: "post",
  248.                     url: "http://localhost:8080/brand-case/brand/add",
  249.                     data: this.brand
  250.                 }).then(resp => {
  251.                     if (resp.data == "success") {
  252.                         //录入成功，关闭窗口,并且重新查询数据
  253.                         this.dialogVisible = false;
  254.                         this.selectAll();
  255.                         this.$message({
  256.                             message: '成功添加一条数据',
  257.                             type: 'success'
  258.                         });
  259.                     }
  260.                 })
  261.             },
  262.             // 修改数据
  263.             updateBrand() {
  264.                 //console.log(this.brand);可以获取完整数据
  265.                 //发送Ajax请求，发送json数据
  266.                 //var _this = this;
  267.                 axios({
  268.                     method: "post",
  269.                     url: "http://localhost:8080/brand-case/brand/update",
  270.                     data: this.brand
  271.                 }).then(resp => {
  272.                     if (resp.data == "success") {
  273.                         //录入成功，关闭窗口,并且重新查询数据
  274.                         this.updateDialogVisible = false;
  275.                         this.selectAll();
  276.                         this.$message({
  277.                             message: '成功添加一条数据',
  278.                             type: 'success'
  279.                         });
  280.                     }
  281.                 })
  282.             },
  283.             //执行修改的onclick
  284.             startUpdate(row) {
  285.                 // 获取改行已经有的数据，以供填入修改框
  286.                 // var _this = this
  287.                 this.brand = JSON.parse(JSON.stringify(row));
  288.                 // 弹出修改框
  289.                 this.updateDialogVisible = true;
  290.             },
  291.             //打开删除的提示框，并根据提示进行操作
  292.             open(row) {
  293.                 this.brand = JSON.parse(JSON.stringify(row));
  294.                 //var _this = this;
  295.                 this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {
  296.                     confirmButtonText: '确定',
  297.                     cancelButtonText: '取消',
  298.                     type: 'warning'
  299.                 }).then(() => {  //确认之后执行axios请求
  300.                     axios({
  301.                         method: "post",
  302.                         url: "http://localhost:8080/brand-case/brand/deleteById",
  303.                         data: this.brand
  304.                     }).then(resp => {
  305.                         if (resp.data == "success") {
  306.                             //录入成功，关闭窗口,并且重新查询数据
  307.                             this.selectAll();
  308.                             this.$message({
  309.                                 message: '删除成功',
  310.                                 type: 'success'
  311.                             });
  312.                         }
  313.                     })
  314.  
  315.                 }).catch(() => { //取消之后执行标签
  316.                     this.$message({
  317.                         type: 'info',
  318.                         message: '已取消删除'
  319.                     });
  320.                 });
  321.             },
  322.             //批量删除的单击事件
  323.             deleteByIds() {
  324.                 //console.log(this.multipleSelection);
  325.                 //1.创建id数组[1,2,3],从multipleSelection模型里面来的数据
  326.                 for (let i = 0; i < this.multipleSelection.length; i++) {
  327.                     let element = this.multipleSelection[i];
  328.                     //获取遍历后得到id值
  329.                     this.selectByIds[i] = element.id;
  330.                 }
  331.                 //var _this = this;
  332.                 this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {
  333.                     confirmButtonText: '确定',
  334.                     cancelButtonText: '取消',
  335.                     type: 'warning'
  336.                 }).then(() => {
  337.                     axios({
  338.                         method: "post",
  339.                         url: "http://localhost:8080/brand-case/brand/deleteByIds",
  340.                         data: this.selectByIds
  341.                     }).then(resp => {
  342.                         if (resp.data == "success") {
  343.                             //录入成功，关闭窗口,并且重新查询数据
  344.                             this.selectAll();
  345.                             this.$message({
  346.                                 message: '成功删除数据',
  347.                                 type: 'success'
  348.                             });
  349.                         }else{
  350.                             this.$message({
  351.                                 message: '没有数据可以删除',
  352.                                 type: 'info'
  353.                             });
  354.                         }
  355.                     })
  356.                 }).catch(() => {
  357.                     this.$message({
  358.                         type: 'info',
  359.                         message: '已取消删除'
  360.                     });
  361.                 });
  362.  
  363.             },
  364.             //
  365.             // 查询方法
  366.             onSubmit() {
  367.                 //console.log(this.brand);
  368.                 this.selectAll();
  369.             },
  370.             //每页显示条数
  371.             handleSizeChange(val) {
  372.                 //console.log(`每页 ${val} 条`);
  373.                 //重新设置当每页显示的条数
  374.                 this.pageSize = val;
  375.                 this.selectAll();
  376.             },
  377.             //当前页码
  378.             handleCurrentChange(val) {
  379.                 //console.log(`当前页: ${val}`);
  380.                 //重新去设置当前页码，动态改变
  381.                 this.currentPage = val;
  382.                 this.selectAll();
  383.             }
  384.  
  385.         },
  386.         data() {
  387.             return {
  388.                 pageSize: 5,
  389.                 //页码的总记录数
  390.                 totalCount: 100,
  391.                 // 当前页码
  392.                 currentPage: 1,
  393.                 // 添加数据对话框是否展示的标记
  394.                 dialogVisible: false,
  395.                 updateDialogVisible: false,
  396.                 // 品牌模型数据
  397.                 brand: {
  398.                     status: '',
  399.                     brandName: '',
  400.                     companyName: '',
  401.                     id: '',
  402.                     ordered: "",
  403.                     description: ""
  404.                 },
  405.                 //被选中的id数组
  406.                 selectByIds: [],
  407.                 // 复选框选中数据集合
  408.                 multipleSelection: [],
  409.                 // 表格数据
  410.                 tableData: [{
  411.                     brandName: '华为',
  412.                     companyName: '华为科技有限公司',
  413.                     ordered: '100',
  414.                     status: "1"
  415.                 }, {
  416.                     brandName: '华为',
  417.                     companyName: '华为科技有限公司',
  418.                     ordered: '100',
  419.                     status: "1"
  420.                 }, {
  421.                     brandName: '华为',
  422.                     companyName: '华为科技有限公司',
  423.                     ordered: '100',
  424.                     status: "1"
  425.                 }, {
  426.                     brandName: '华为',
  427.                     companyName: '华为科技有限公司',
  428.                     ordered: '100',
  429.                     status: "1"
  430.                 }]
  431.             }
  432.         }
  433.     })
  434.  
  435. </script>
  436.  
  437. </body>
  438. </html>

15.pom.xml 

  1. <?xml version="1.0" encoding="UTF-8"?>
  2. <project xmlns="http://maven.apache.org/POM/4.0.0"
  3.          xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
  4.          xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
  5.     <modelVersion>4.0.0</modelVersion>
  6.  
  7.     <groupId>org.example</groupId>
  8.     <artifactId>brand-case</artifactId>
  9.     <version>1.0-SNAPSHOT</version>
  10.  
  11.     <properties>
  12.         <maven.compiler.source>18</maven.compiler.source>
  13.         <maven.compiler.target>18</maven.compiler.target>
  14.     </properties>
  15.     <packaging>war</packaging>
  16.  
  17.     <build>
  18.         <plugins>
  19.             <!--tomcat 的插件 （相当于在maven内部放置了个tomcat服务器）-->
  20.             <plugin>
  21.                 <groupId>org.apache.tomcat.maven</groupId>
  22.                 <artifactId>tomcat7-maven-plugin</artifactId>
  23.                 <version>2.2</version>
  24.             </plugin>
  25.             <plugin>
  26.                 <groupId>org.apache.maven.plugins</groupId>
  27.                 <artifactId>maven-compiler-plugin</artifactId>
  28.                 <configuration>
  29.                     <source>17</source>
  30.                     <target>17</target>
  31.                 </configuration>
  32.             </plugin>
  33.         </plugins>
  34.     </build>
  35.  
  36.     <dependencies>
  37.         <dependency>
  38.             <groupId>javax.servlet</groupId>
  39.             <artifactId>javax.servlet-api</artifactId>
  40.             <version>3.1.0</version>
  41.             <scope>provided</scope>
  42.         </dependency>
  43.         <!--apache提供的与io适配的工具类，好用-->
  44.         <dependency>
  45.             <groupId>commons-io</groupId>
  46.             <artifactId>commons-io</artifactId>
  47.             <version>2.6</version>
  48.         </dependency>
  49.         <!--mybatis依赖-->
  50.         <dependency>
  51.             <groupId>org.mybatis</groupId>
  52.             <artifactId>mybatis</artifactId>
  53.             <version>3.5.5</version>
  54.         </dependency>
  55.         <!--mysql依赖-->
  56.         <dependency>
  57.             <groupId>mysql</groupId>
  58.             <artifactId>mysql-connector-java</artifactId>
  59.             <version>8.0.29</version>
  60.         </dependency>
  61.         <!--junit依赖-->
  62.         <dependency>
  63.             <groupId>junit</groupId>
  64.             <artifactId>junit</artifactId>
  65.             <version>4.13.2</version>
  66.             <scope>Test</scope>
  67.         </dependency>
  68.         <!--添加slf4j-api日志api-->
  69.         <dependency>
  70.             <groupId>org.slf4j</groupId>
  71.             <artifactId>slf4j-api</artifactId>
  72.             <version>1.7.36</version>
  73.         </dependency>
  74.         <!--添加logback-classic依赖-->
  75.         <dependency>
  76.             <groupId>ch.qos.logback</groupId>
  77.             <artifactId>logback-classic</artifactId>
  78.             <version>1.2.3</version>
  79.         </dependency>
  80.         <!--添加logback-core依赖-->
  81.         <dependency>
  82.             <groupId>ch.qos.logback</groupId>
  83.             <artifactId>logback-core</artifactId>
  84.             <version>1.2.3</version>
  85.         </dependency>
  86.         <dependency>
  87.             <groupId>jstl</groupId>
  88.             <artifactId>jstl</artifactId>
  89.             <version>1.2</version>
  90.         </dependency>
  91.         <dependency>
  92.             <groupId>taglibs</groupId>
  93.             <artifactId>standard</artifactId>
  94.             <version>1.1.2</version>
  95.         </dependency>
  96.         <dependency>
  97.             <groupId>com.alibaba</groupId>
  98.             <artifactId>fastjson</artifactId>
  99.             <version>1.2.62</version>
  100.         </dependency>
  101.     </dependencies>
  102. </project>

 16.mysql数据库文件

  1. -- 删除tb_brand表
  2. drop table if exists tb_brand;
  3. -- 创建tb_brand表
  4. create table tb_brand
  5. (
  6.     -- id 主键
  7.     id           int primary key auto_increment,
  8.     -- 品牌名称
  9.     brand_name   varchar(20),
  10.     -- 企业名称
  11.     company_name varchar(20),
  12.     -- 排序字段
  13.     ordered      int,
  14.     -- 描述信息
  15.     description  varchar(100),
  16.     -- 状态：0：禁用  1：启用
  17.     status       int
  18. );
  19. -- 添加数据
  20. insert into tb_brand (brand_name, company_name, ordered, description, status)
  21. values 
  22.        ('华为', '华为技术有限公司', 100, '万物互联', 1),
  23.        ('小米', '小米科技有限公司', 50, 'are you ok', 1),
  24.        ('格力', '格力电器股份有限公司', 30, '让世界爱上中国造', 1),
  25.        ('阿里巴巴', '阿里巴巴集团控股有限公司', 10, '买买买', 1),
  26.        ('腾讯', '腾讯计算机系统有限公司', 50, '玩玩玩', 0),
  27.        ('百度', '百度在线网络技术公司', 5, '搜搜搜', 0),
  28.        ('京东', '北京京东世纪贸易有限公司', 40, '就是快', 1),
  29.        ('小米', '小米科技有限公司', 50, 'are you ok', 1),
  30.        ('三只松鼠', '三只松鼠股份有限公司', 5, '好吃不上火', 0),
  31.        ('华为', '华为技术有限公司', 100, '万物互联', 1),
  32.        ('小米', '小米科技有限公司', 50, 'are you ok', 1),
  33.        ('格力', '格力电器股份有限公司', 30, '让世界爱上中国造', 1),
  34.        ('阿里巴巴', '阿里巴巴集团控股有限公司', 10, '买买买', 1),
  35.        ('腾讯', '腾讯计算机系统有限公司', 50, '玩玩玩', 0),
  36.        ('百度', '百度在线网络技术公司', 5, '搜搜搜', 0),
  37.        ('京东', '北京京东世纪贸易有限公司', 40, '就是快', 1),
  38.        ('华为', '华为技术有限公司', 100, '万物互联', 1),
  39.        ('小米', '小米科技有限公司', 50, 'are you ok', 1),
  40.        ('格力', '格力电器股份有限公司', 30, '让世界爱上中国造', 1),
  41.        ('阿里巴巴', '阿里巴巴集团控股有限公司', 10, '买买买', 1),
  42.        ('腾讯', '腾讯计算机系统有限公司', 50, '玩玩玩', 0),
  43.        ('百度', '百度在线网络技术公司', 5, '搜搜搜', 0),
  44.        ('京东', '北京京东世纪贸易有限公司', 40, '就是快', 1),
  45.        ('小米', '小米科技有限公司', 50, 'are you ok', 1),
  46.        ('三只松鼠', '三只松鼠股份有限公司', 5, '好吃不上火', 0),
  47.        ('华为', '华为技术有限公司', 100, '万物互联', 1),
  48.        ('小米', '小米科技有限公司', 50, 'are you ok', 1),
  49.        ('格力', '格力电器股份有限公司', 30, '让世界爱上中国造', 1),
  50.        ('阿里巴巴', '阿里巴巴集团控股有限公司', 10, '买买买', 1),
  51.        ('腾讯', '腾讯计算机系统有限公司', 50, '玩玩玩', 0),
  52.        ('百度', '百度在线网络技术公司', 5, '搜搜搜', 0),
  53.        ('京东', '北京京东世纪贸易有限公司', 40, '就是快', 1),
  54.        ('华为', '华为技术有限公司', 100, '万物互联', 1),
  55.        ('小米', '小米科技有限公司', 50, 'are you ok', 1),
  56.        ('格力', '格力电器股份有限公司', 30, '让世界爱上中国造', 1),
  57.        ('阿里巴巴', '阿里巴巴集团控股有限公司', 10, '买买买', 1),
  58.        ('腾讯', '腾讯计算机系统有限公司', 50, '玩玩玩', 0),
  59.        ('百度', '百度在线网络技术公司', 5, '搜搜搜', 0),
  60.        ('京东', '北京京东世纪贸易有限公司', 40, '就是快', 1),
  61.        ('小米', '小米科技有限公司', 50, 'are you ok', 1),
  62.        ('三只松鼠', '三只松鼠股份有限公司', 5, '好吃不上火', 0),
  63.        ('华为', '华为技术有限公司', 100, '万物互联', 1),
  64.        ('小米', '小米科技有限公司', 50, 'are you ok', 1),
  65.        ('格力', '格力电器股份有限公司', 30, '让世界爱上中国造', 1),
  66.        ('阿里巴巴', '阿里巴巴集团控股有限公司', 10, '买买买', 1),
  67.        ('腾讯', '腾讯计算机系统有限公司', 50, '玩玩玩', 0),
  68.        ('百度', '百度在线网络技术公司', 5, '搜搜搜', 0),
  69.        ('京东', '北京京东世纪贸易有限公司', 40, '就是快', 1)
  70.         ;
  71.    
  72.  
  73. SELECT * FROM tb_brand;

16.成品效果 

 

 

 

网站建设定制开发 软件系统开发定制 定制软件开发 软件开发定制 定制app开发 app开发定制 app开发定制公司 电商商城定制开发 定制小程序开发 定制开发小程序 客户管理系统开发定制 定制网站 定制开发 crm开发定制 开发公司 小程序开发定制 定制软件 收款定制开发 企业网站定制开发 定制化开发 android系统定制开发 定制小程序开发费用 定制设计 专注app软件定制开发 软件开发定制定制 知名网站建设定制 软件定制开发供应商 应用系统定制开发 软件系统定制开发 企业管理系统定制开发 系统定制开发