[SpringBoot+VueJs]2.3 SpringBoot

目录

1. 环境搭建
2. 后端
   2.1 数据库设计
   2.2 SpringBoot + Mybatis
   2.3 SpringBoot+RestfulAPI
3. 前端
   3.1 VueJS 2.0 + Webpack工程介绍
   3.2 Admin-LTE介绍及使用
   3.3 VueJS一些基础知识
   3.4 项目中用到的和VueJS的开源组件

1 前言

Spring boot写REST服务，和Spring几乎没有什么区别。

2 开始

2.1 加入依赖及Plugin

<dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-web</artifactId>
        </dependency>
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-aop</artifactId>
        </dependency>
        <!-- Spring Boot Test 依赖 -->
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-test</artifactId>
            <scope>test</scope>
        </dependency>
      ...
            <plugin>
                <groupId>org.springframework.boot</groupId>
                <artifactId>spring-boot-maven-plugin</artifactId>
            </plugin>

2.2 Main class [Application]

@SpringBootApplication(scanBasePackages="com.xxx.xxx")
// mapper 接口类扫描包配置
@MapperScan("com.xxx.xxx.dao")
public class Application {
    public static void main(String[] args) {
        new SpringApplicationBuilder(Application.class).run(args);
    }
}

2.3 写一个controller

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.http.HttpStatus;
import org.springframework.http.ResponseEntity;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.bind.annotation.RestController;

@RestController
@RequestMapping("/api")
public class SummaryController {
    @Autowired
    private SummaryService summaryService;

    @RequestMapping(value = "/summary")
    public ResponseEntity<SummaryResult> getSummary(@RequestParam(value = "reportId") String reportId) {

        SummaryResult results = (summaryService.getSummaryResult(reportId));

        return new ResponseEntity<>(results, HttpStatus.OK);
    }
}

这里值得注意的是
import org.springframework.http.ResponseEntity;
ResponseEntity: 代表了整个HTTP返回。可以指定Status Code，headers，body。它也有很多构造方法来使用。

2.4 Service层summaryService

import com.xxxx.xxxx.dao.SummaryMapper;
import com.xxxx.xxxx.dto.SummaryResult;
import com.xxxx.xxx.model.Summary;
import com.xxx.xxx.service.SummaryService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;

import java.text.DecimalFormat;
import java.util.List;

/**
 * Created with IntelliJ IDEA.
 * User: professor
 * Date: 2017/6/2
 * Time: 下午1:09
 */
@Service
public class SummaryServiceImpl implements SummaryService {

    @Autowired
    private SummaryMapper summaryMapper;

    @Override
    public SummaryResult getSummaryResult(String reportid) {
        DecimalFormat df = new DecimalFormat("#.##");
        Integer total_cases = 0;
        Integer case_passed = 0;
        SummaryResult result = new SummaryResult();

        List<Summary> summaryList = summaryMapper.selectByReportId(reportid);
        for (Summary s : summaryList) {
            total_cases += s.getCaseNum();
            case_passed += s.getCasePassed();
        }
        result.setTotal_cases(total_cases);
        result.setCase_passed(case_passed);
        Float radio = (case_passed * 100.0f) / total_cases;
        result.setPass_radio(df.format(radio));
        return result;
    }
}

就是使用summaryMapper.selectByReportId方法来从数据库中获取信息，并返回计算结果。

如此依赖一个REST服务就写好了。写过应该是：

http://127.0.0.1:7171/api/summary?reportId=3](http://127.0.0.1:7171/api/summary?reportId=3)
{
  "total_cases": 902,
  "case_passed": 707,
  "pass_radio": "78.38"
}

注意这里的7171是我在工程的application.properties文件里显式指定的HTTP服务端口：

server.address=0.0.0.0
server.port=7171