38. 尚融宝前台投资列表展示

前台显示投资记录

需求

后端

controller

LendItemController.java

    @ApiOperation("获取列表")
    @GetMapping("/list/{lendId}")
    public R list(
            @ApiParam(value = "标的id",required = true)
            @PathVariable Long lendId){
     
        List<LendItem> lendItemList =  lendItemService.listByIdAndStatus(lendId, LendItemEnum.PAY_OK.getStatus());
        return R.ok().setData("list",lendItemList);
    }

前端

script

pages/lend/_id.vue

export default {
     
  // 获取标的详情
  // 希望搜索引擎能收录，所以使用异步查询的方式
  async asyncData({
      $axios, params }) {
     
    let responseLendItemList = await $axios.$get(
      '/api/core/lendItem/list/' + lendId
    )

    return {
     
      lendItemList: responseLendItemList.data.list,
    }
  },

前台显示还款计划

需求

后端

controller

LendReturnController.java

package com.indi.srb.core.controller.api;

@Api(tags = "还款计划")
@RestController
@RequestMapping("/api/core/lendReturn")
public class LendReturnController {
     
    @Resource
    private LendReturnService lendReturnService;

    @ApiOperation("获取列表")
    @GetMapping("/list/{lendId}")
    public R list(
            @ApiParam(value = "标的id", required = true)
            @PathVariable Long lendId){
     
        List<LendReturn> lendReturnList = lendReturnService.listByLendId(lendId);
        return R.ok().setData("list",lendReturnList);
    }
}

前端

script

pages/lend/_id.vue

export default {
     
  // 获取标的详情
  // 希望搜索引擎能收录，所以使用异步查询的方式
  async asyncData({
      $axios, params }) {
     
    let responseLendReturnList = await $axios.$get(
      '/api/core/lendReturn/list/' + lendId
    )

    return {
     
      lendReturnList: responseLendReturnList.data.list,
    }
  },

前台显示回款计划

需求

根据投资人登录的账号，查询对应的回款计划

后端

controller

LendReturnController.java

package com.indi.srb.core.controller.api;

@Api(tags = "回款计划")
@RestController
@RequestMapping("/api/core/lendItemReturn")
public class LendItemReturnController {
     
    @Resource
    private LendItemReturnService lendItemReturnService;

    @ApiOperation("获取列表")
    @GetMapping("/auth/list/{lendId}")
    public R list(
            @ApiParam(value = "标的id",required = true)
            @PathVariable Long lendId, HttpServletRequest request){
     
        String token = request.getHeader("token");
        Long userId = JwtUtils.getUserId(token);
        List<LendItemReturn> lendItemReturnList = lendItemReturnService.listByLendIdAndUserId(lendId,userId);
        return R.ok().setData("list",lendItemReturnList);
    }
}

service

LendItemReturnService.java

    List<LendItemReturn> listByLendIdAndUserId(Long lendId, Long userId);

LendItemReturnServiceImpl.java

    @Override
    public List<LendItemReturn> listByLendIdAndUserId(Long lendId, Long userId) {
     
        QueryWrapper<LendItemReturn> queryWrapper = new QueryWrapper<>();
        queryWrapper.eq("lend_id",lendId)
                .eq("invest_user_id",userId)
                .orderByAsc("current_period");
        return baseMapper.selectList(queryWrapper);
    }

前端

script

pages/lend/_id.vue

  data() {
     
    return {
     
      lendItemReturnList: [], //回款计划
    }
  },
  
  //此时方法在客户端的浏览器中执行，可以获取到cookie
  mounted() {
     
    if (this.userType === 1) {
     
      this.fetchLendItemReturnList()
    }
  },  
  
  methods: {
     
    fetchLendItemReturnList() {
     
      this.$axios
        .$get('/api/core/lendItemReturn/auth/list/' + this.$route.params.id)
        .then((response) => {
     
          this.lendItemReturnList = response.data.list
        })
    },