文章目录

目录

文章目录

项目背景

项目效果展示

软件开发整体介绍

软件开发流程

 角色分工

软件环境

瑞吉外卖项目介绍

项目介绍

产品原型展示

 技术选型

角色

开发环境搭建

数据库环境搭建

maven项目搭建

后台登录功能开发

需求分析

 代码开发

功能测试

---

项目背景

时间：某年寒假

地点：菩提阁餐厅

人物：软件工程专业大学生小王，菩提阁餐厅老板老王，父子关系

事件：小王在寒假期间帮忙打理父亲的餐厅，发现每天客户订餐量非常大，但是餐厅还是传统的电话接单方式，效率低下而且容易漏单，所以决定利用学校所学知识开发一套在线订餐系统，并且系统开发完成后，还可以推销给其他餐厅，可以赚点外快

问题：由于小王在学校学习的知识以后端开发为主，对于前端页面的编写并不熟练，所以决定联系一下在软件公司做前端开发的表姐帮忙来编写页面

项目效果展示

 

 

软件开发整体介绍

软件开发流程

 

 角色分工

 

软件环境

开发环境(development)：开发人员在开发阶段使用的环境，一般外部用户无法访问
测试环境(testing)：专门给测试人员使用的环境，用于测试项目，一般外部用户无法访问
生产环境(production)：即线上环境，正式提供对外服务的环境

瑞吉外卖项目介绍

项目介绍

产品原型，就是一款产品成型之前的一个简单的框架，就是将页面的排版布局展现出来，使产品的初步构思有一个可视化的展示。通过原型展示，可以更加直观的了解项目的需求和提供的功能。
 

产品原型展示

 技术选型

 

角色

后台系统管理员：登录后台管理系统，拥有后台系统中的所有操作权限
后台系统普通员工：登录后台管理系统，对菜品、套餐、订单等进行管理
C端用户：登录移动端应用，可以浏览菜品、添加购物车、设置地址、在线下单等

开发环境搭建

数据库环境搭建

 

 

maven项目搭建

创建maven项目

 pom文件：

<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
         xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 https://maven.apache.org/xsd/maven-4.0.0.xsd">
    <modelVersion>4.0.0</modelVersion>

    <parent>
        <groupId>org.springframework.boot</groupId>
        <artifactId>spring-boot-starter-parent</artifactId>
        <version>2.6.6</version>
        <relativePath/>
    </parent>

    <groupId>com.itheima</groupId>
    <artifactId>reggie_take_out</artifactId>
    <version>0.0.1-SNAPSHOT</version>
    <name>reggie_take_out</name>
    <description>Demo project for Spring Boot</description>

    <properties>
        <java.version>1.8</java.version>
    </properties>

    <dependencies>
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter</artifactId>
        </dependency>

        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-test</artifactId>
            <scope>test</scope>
        </dependency>

        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-web</artifactId>
            <scope>compile</scope>
        </dependency>

        <dependency>
            <groupId>com.baomidou</groupId>
            <artifactId>mybatis-plus-boot-starter</artifactId>
            <version>3.4.2</version>
        </dependency>

        <dependency>
            <groupId>org.projectlombok</groupId>
            <artifactId>lombok</artifactId>
            <version>1.18.20</version>
        </dependency>

        <dependency>
            <groupId>com.alibaba</groupId>
            <artifactId>fastjson</artifactId>
            <version>1.2.76</version>
        </dependency>

        <dependency>
            <groupId>commons-lang</groupId>
            <artifactId>commons-lang</artifactId>
            <version>2.6</version>
        </dependency>

        <dependency>
            <groupId>mysql</groupId>
            <artifactId>mysql-connector-java</artifactId>
            <scope>runtime</scope>
        </dependency>

        <dependency>
            <groupId>com.alibaba</groupId>
            <artifactId>druid-spring-boot-starter</artifactId>
            <version>1.1.23</version>
        </dependency>

    </dependencies>

    <build>
        <plugins>
            <plugin>
                <groupId>org.springframework.boot</groupId>
                <artifactId>spring-boot-maven-plugin</artifactId>
            </plugin>
        </plugins>
    </build>

</project>

导入Spring Boot配置文件application.yml

server:
  port: 8081
spring:
  application:
    name: reggie_take_out
  datasource:
    druid:
      driver-class-name: com.mysql.cj.jdbc.Driver
      url: jdbc:mysql://localhost:3306/reggie?serverTimezone=Asia/Shanghai&useUnicode=true&characterEncoding=utf-8&zeroDateTimeBehavior=convertToNull&useSSL=false&allowPublicKeyRetrieval=true
      username: root
      password: 123456
mybatis-plus:
  configuration:
    map-underscore-to-camel-case: true
    log-impl: org.apache.ibatis.logging.stdout.StdOutImpl
  global-config:
    db-config:
      id-type: ASSIGN_ID

创建配置类WebMvcConfig，设置静态资源映射，否则无法访问页面
一般情况下访问的是static或者是templates

@Slf4j
@Configuration
public class WebMvcConfig extends WebMvcConfigurationSupport {

//    设置静态资源映射
    @Override
    protected void addResourceHandlers(ResourceHandlerRegistry registry) {

        log.info("开始进行静态资源映射");

        registry.addResourceHandler("/backend/**").addResourceLocations("classpath:backend/");

        registry.addResourceHandler("/front/**").addResourceLocations("classpath:front/");
    }
}

后台登录功能开发

需求分析

1.页面原型展示

 2.登录页面展示（页面位置：项目/resources/backend/page/login/login.html）

 3.查看登录请求信息
通过浏览器调试工具（F12），可以发现，点击登录按钮时，页面会发送请求（请求地址为http://localhost:8080/employee/login）并提交参数（username和password）
此时报404，是因为我们的后台系统还没有响应此请求的处理器，所以我们需要创建相关类来处理登录请求

 4.数据模型（employee表）

 5.分析前端页面代码

 代码开发

1.创建实体类Employee，和employee表进行映射

package com.itheima.reggie_take_out.entity;

import com.baomidou.mybatisplus.annotation.FieldFill;
import com.baomidou.mybatisplus.annotation.TableField;
import lombok.Data;
import java.io.Serializable;
import java.time.LocalDateTime;

/*
* 员工实体类
*
*
* */

@Data
public class Employee implements Serializable {

    private static final long serialVersionUID = 1L;

    private Long id;

    private String username;

    private String name;

    private String password;

    private String phone;

    private String sex;

    private String idNumber;  // 身份证号码

    private Integer status;

    private LocalDateTime createTime;

    private LocalDateTime updateTime;

    @TableField(fill = FieldFill.INSERT)
    private Long createUser;

    @TableField(fill = FieldFill.INSERT_UPDATE)
    private Long updateUser;

}

2.创建Controller、Service、Mapper

dao层，这里只需要写一个接口就行，使用动态代理方式形成实体类。

@Mapper
public interface EmployeeMapper extends BaseMapper<Employee> {
}

service层，这一层实现

public interface EmployeeService extends IService<Employee> {
}

@Service
public class EmployeeServiceImpl extends ServiceImpl<EmployeeMapper, Employee> implements EmployeeService {
}

功能测试