前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >Kotlin + Spring Boot (Gradle) + React.js (Nowa) 集成 Web 开发

Kotlin + Spring Boot (Gradle) + React.js (Nowa) 集成 Web 开发

作者头像
一个会写诗的程序员
发布2018-08-17 11:24:38
7740
发布2018-08-17 11:24:38
举报

Kotlin + Spring Boot (Gradle) + React.js (Nowa) 集成 Web 开发

Category.kt

代码语言:javascript
复制
package com.easykotlin.reakt.entity

import java.util.*
import javax.persistence.*


/**
 * Created by Kor on 2017-12-24 14:04:20.
 */
@Entity
@Table(indexes = [
    Index(columnList = "code", unique = true),
    Index(columnList = "name", unique = false),
    Index(columnList = "type", unique = false)
])
class Category {
    @Id
    @GeneratedValue(strategy = GenerationType.IDENTITY)
    var id: Long = -1
    var gmtCreate = Date()
    var gmtModify = Date()
    var isDeleted = 0

    @Column(length = 200)
    var name = ""
    @Column(length = 1000)
    var detail = ""

    /**
     * 1 学科分类
     * 2 图书分类
     * 3 行业分类
     * 4 动植物分类
     * 5 国家分类
     * 6 语言分类
     * 7 宗教分类
     * 8 组织机构分类
     * 9 音乐分类
     * 10 文学分类
     * 11 计算机编程语言分类
     *
     */
    var type = 1
    // 编码
    @Column(unique = true, length = 200)
    var code = "001"

}
代码语言:javascript
复制
package com.easykotlin.reakt.dao

import com.easykotlin.reakt.entity.Category
import org.springframework.data.domain.Page
import org.springframework.data.domain.Pageable
import org.springframework.data.jpa.repository.JpaRepository
import org.springframework.data.jpa.repository.Query
import org.springframework.data.repository.query.Param


/**
 * Created by Kor on 2017-12-24 14:04:20.
 */
interface CategoryDao : JpaRepository<Category, Long> {


    /**
     * Paging query needs to have a Pageable parameter!
     */
    @Query("select a from #{#entityName} a where type = :type and a.name like %:searchTxt%")
    fun page(@Param("searchTxt") searchTxt: String,
             @Param("type") type: Int,
             pageable: Pageable): Page<Category>

}
代码语言:javascript
复制
package com.easykotlin.reakt.controller

import com.alibaba.fastjson.JSON
import com.easykotlin.reakt.dao.CategoryDao
import com.easykotlin.reakt.entity.Category
import com.easykotlin.reakt.page.PageConterter
import com.easykotlin.reakt.page.PageDto
import org.springframework.beans.factory.annotation.Autowired
import org.springframework.data.domain.PageRequest
import org.springframework.web.bind.annotation.*
import javax.servlet.http.HttpServletRequest

/**
 * Created by Kor on 2017-12-24 14:04:20.
 */
@RestController
@RequestMapping("/category")
class CategoryController {

    @Autowired lateinit var CategoryDao: CategoryDao

    @GetMapping(value = ["/"])
    fun category(request: HttpServletRequest): List<Category> {
        return CategoryDao.findAll()
    }

    @GetMapping(value = ["/{id}"])
    fun getOne(@PathVariable("id") id: Long): Category {
        return CategoryDao.getOne(id)
    }


    @GetMapping(value = ["/page.json"])
    fun page(
        @RequestParam(value = "currentPage", defaultValue = "1") currentPage: Int,
        @RequestParam(value = "pageSize", defaultValue = "10") pageSize: Int,
        @RequestParam(value = "searchTxt", defaultValue = "") searchTxt: String,
        @RequestParam(value = "type", defaultValue = "1") type: Int
    ): PageDto<Category> {

        println("searchTxt = $searchTxt")

        // Spring Data JPA 的分页默认第一页是: pageNum = 0
        val page = CategoryDao.page(searchTxt, type,
                PageRequest.of(currentPage - 1, pageSize))
        println("page = ${JSON.toJSONString(page)}")
        val pageDto = PageDto<Category>()
        PageConterter.convert(page, pageDto)
        return pageDto
    }

}

分页

代码语言:javascript
复制
package com.easykotlin.reakt.page

import org.springframework.data.domain.Page


class PageDto<T> {
    var content: Content<T> = Content()
}

class Content<T> {
    var data: List<T> = ArrayList()
    var currentPage = 1
    var totalCount = 100L
}

object PageConterter {
    fun <T> convert(page: Page<T>, pageDto: PageDto<T>) {
        pageDto.content.data = page.content
        // Spring Data JPA 的分页默认第一页是: pageNum = 0, 所以这里 + 1
        pageDto.content.currentPage = page.number + 1
        pageDto.content.totalCount = page.totalElements
    }
}

JSX

代码语言:javascript
复制
import {Component} from 'react';
import './CategoryList1.less';
import {URLS} from "../../app/variables";
import {isDev} from 'variables';
import Title from 'uxcore-title';

const Table = require('uxcore-table');
const fetchUrl = URLS.category_list_url_1;

export default class CategoryList1 extends Component {

  static defaultProps = {}

  static propTypes = {}

  constructor(props) {
    super(props);
  }


  render() {
    const me = this;
    const columns = [
      {dataKey: 'code', title: 'Code', width: 200},
      {dataKey: 'name', title: 'Name', width: 400, type: 'text'},
      {
        dataKey: 'detail', title: 'Detail', width: 600, type: 'text',
        render(cellData, rowData) {
          console.log(`cellData = ${cellData}`)
          console.log(`rowData = ${rowData}`)
          return <div><a href="javascript:;">{cellData}</a></div>;
        }
      },

    ];
    const renderProps = {
      height: 600,
      pageSize: 10,
      fetchUrl: fetchUrl,
      fetchParams: {},
      jsxcolumns: columns,
      showSearch: true,
      searchBarPlaceholder: '搜索',
      showMask: true,
      emptyText: '暂无数据',
      loadingText: '数据加载中',
      addRowClassName: function (rowData) {
        return 'multiline'
      }
    };

    return (
      <div className="mod-category_list_1">
        <Title type="secondary">学科分类</Title>
        <Table {...renderProps} />
      </div>
    );
  }
}

后台分页接口

代码语言:javascript
复制
package com.easykotlin.reakt.controller

import com.alibaba.fastjson.JSON
import com.easykotlin.reakt.dao.CategoryDao
import com.easykotlin.reakt.entity.Category
import com.easykotlin.reakt.page.PageConterter
import com.easykotlin.reakt.page.PageDto
import org.springframework.beans.factory.annotation.Autowired
import org.springframework.data.domain.PageRequest
import org.springframework.web.bind.annotation.*
import javax.servlet.http.HttpServletRequest

/**
 * Created by Kor on 2017-12-24 14:04:20.
 */
@RestController
@RequestMapping("/category")
class CategoryController {

    @Autowired lateinit var CategoryDao: CategoryDao

    @GetMapping(value = ["/"])
    fun category(request: HttpServletRequest): List<Category> {
        return CategoryDao.findAll()
    }

    @GetMapping(value = ["/{id}"])
    fun getOne(@PathVariable("id") id: Long): Category {
        return CategoryDao.getOne(id)
    }


    @GetMapping(value = ["/page.json"])
    fun page(
        @RequestParam(value = "currentPage", defaultValue = "1") currentPage: Int,
        @RequestParam(value = "pageSize", defaultValue = "10") pageSize: Int,
        @RequestParam(value = "searchTxt", defaultValue = "") searchTxt: String,
        @RequestParam(value = "type", defaultValue = "1") type: Int
    ): PageDto<Category> {

        println("searchTxt = $searchTxt")

        // Spring Data JPA 的分页默认第一页是: pageNum = 0
        val page = CategoryDao.page(searchTxt, type,
                PageRequest.of(currentPage - 1, pageSize))
        println("page = ${JSON.toJSONString(page)}")
        val pageDto = PageDto<Category>()
        PageConterter.convert(page, pageDto)
        return pageDto
    }

}

完整示例工程源代码: https://github.com/EasyKotlin/reakt

本文参与 腾讯云自媒体分享计划,分享自作者个人站点/博客。
原始发表:2017.12.27 ,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 完整示例工程源代码: https://github.com/EasyKotlin/reakt
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档