☻Blog("Laziji")

System.out.print("辣子鸡的博客");

0%

Posted on Edited on In

接上一篇, 上一篇文章写了Dao、Service、Controller的实现, 这篇讲述其中用到的Query以及Page

还是以app表为例, 表结构如下

1
2
3
4
`id` bigint(20)
`gmt_create` datetime
`gmt_modified` datetime
`name` varchar(32)

Query 查询类

Query是select查询信息 如limit, page, order by的封装

AppQuery.java

省略其中get, set方法, Query的属性是DO的扩展,如其中nameLike为name字段的模糊查询, toBean()实现Query转换为DO

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
public class AppQuery extends BaseQuery<AppDO> {

    private Long id;
    private Date gmtCreate;
    private Date gmtModified;
    private String name;
    private String nameLike;

    // ...get()
    // ...set()

    @Override
    public ClassifyDO toBean() {
        return JSON.parseObject(JSON.toJSONString(this),ClassifyDO.class);
    }
}

BaseQuery.java

BaseQuery中包含公共的查询属性, 例如分页, 排序, 省略其他默认的get, set

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
public abstract class BaseQuery<D> implements Query<D> {

    private Integer limit = 1;
    private Integer page = 0;
    private Integer offset = 0;
    private String sort;
    private String order;

    public void setLimit(Integer limit) {
        this.limit = limit > 0 ? limit : 1;
        this.offset = this.page * this.limit;
    }

    public void setPage(int page) {
        this.page = page >= 0 ? page : 0;
        this.offset = this.page * this.limit;
    }

    // ...get()
    // ...set()

    @Override
    public String toString() {
        return JSON.toJSONString(this);
    }
}

Query.java

1
2
3
4
public interface Query<D> {

    D toBean();
}

Page 分页查询结果类

由于前端分页显示时常常同时需要每页数据以及总条目数, 所以对分页查询结果简单封装

Page.java

1
2
3
4
5
6
7
8
public class Page<D> {

    private List<D> list;
    private Integer total;

    // ...get()
    // ...set()
}

Posted on Edited on In

简述

若手动编写数据库层是繁琐, 重复且容易出错。这里尝试实现通用的Dao、Service、Controllerc 减少重复的代码。使用generator来生成Mapper.xml、DO、Query。使编写数据库层自动化。

下面以app表为例

Dao 层

编写Dao层泛型接口, 对于每一个Mapper.xml 建一个Dao继承该接口, 其中无需编写代码

AppDao.java

1
2
3
4
@Mapper
public interface AppDao extends Dao<AppDO> {

}

Dao.java

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
public interface Dao<D> {

    D selectById(Long id);

    List<D> select(D bean);

    int selectCount(D bean);

    List<D> select(Query<D> query);

    int selectCount(Query<D> query);

    int insert(D bean);

    int update(D bean);

    int delete(Long id);
}

Service 层

service层编写 Service接口以及BaseService, service中在dao的基础上实现扩展方法, 详见service接口

AppService.java

1
2
3
4
@Service
public class AppService extends BaseService<AppDO> {

}

BaseService.java

此处注入dao 需要使用@Autowired, 若使用@Resource则会报错

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
public abstract class BaseService<D> implements Service<D> {

    @Autowired
    private Dao<D> mapper;

    @Override
    public D selectById(Long id){
        return mapper.selectById(id);
    }

    @Override
    public List<D> select(D bean){
        return mapper.select(bean);
    }

    @Override
    public int selectCount(D bean){
        return mapper.selectCount(bean);
    }

    @Override
    public List<D> selectByQuery(Query<D> query){
        return mapper.select(query);
    }

    @Override
    public int selectCountByQuery(Query<D> query){
        return mapper.selectCount(query);
    }

    @Override
    public List<D> selectAll(){
        return select(null);
    }

    @Override
    public D selectOne(D bean){
        if(selectCount(bean)!=1){
            return null;
        }
        List<D> list = select(bean);
        return list.get(0);
    }

    @Override
    public D selectOneByQuery(Query<D> query){
        if(selectCountByQuery(query)!=1){
            return null;
        }
        List<D> list = selectByQuery(query);
        return list.get(0);
    }

    @Override
    public Page<D> selectPageByQuery(Query<D> query){
        Page<D> page = new Page<>();
        page.setList(selectByQuery(query));
        page.setTotal(selectCountByQuery(query));
        return page;
    }

    @Override
    public int insert(D bean){
        return mapper.insert(bean);
    }

    @Override
    public int update(D bean){
        return mapper.update(bean);
    }

    @Override
    public int delete(Long id){
        return mapper.delete(id);
    }
}

Service.java

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
public interface Service<D> {

    D selectById(Long id);

    List<D> select(D bean);

    int selectCount(D bean);

    List<D> selectByQuery(Query<D> query);

    int selectCountByQuery(Query<D> query);

    List<D> selectAll();

    D selectOne(D bean);

    D selectOneByQuery(Query<D> query);

    Page<D> selectPageByQuery(Query<D> query);

    int insert(D bean);

    int update(D bean);

    int delete(Long id);
}

Controller 层

有了 编写Controller接口和BaseController, 普通增删改查控制器只需继承BaseController

AppController.java

1
2
3
4
5
@RestController
@RequestMapping("app")
public class AdminAppController extends BaseController<AppDO,AppQuery> {

}

BaseController.java

这里注入service同样要用@Autowired

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
public abstract class BaseController<D, Q extends Query<D>> implements Controller<D,Q> {

    @Autowired
    private Service<D> service;

    @Override
    @RequestMapping("list")
    public ResponseData list(@RequestBody Q query) {
        return ResponseData.successResponse(service.selectPageByQuery(query));
    }

    @Override
    @RequestMapping("save")
    public ResponseData save(@RequestBody D bean) {
        service.insert(bean);
        return ResponseData.successResponse();
    }

    @Override
    @RequestMapping("update")
    public ResponseData update(@RequestBody D bean) {
        service.update(bean);
        return ResponseData.successResponse();
    }
}

Controller.java

1
2
3
4
5
6
7
8
public interface Controller<D, Q extends Query<D>> {

    ResponseData list(Q query);

    ResponseData save(D bean);

    ResponseData update(D bean);
}

Posted on Edited on In

js实现动态加载图片, 节省流量, 并在加载时显示动画效果

思路及实现

给图片添加额外属性data-src, 并用空白小图片填充

1
<img data-src="./image.png" src="./blank.png">

找到页面内的所有图片

1
let imgs = $("img[data-src]");

根据滚动条高度以及窗口的高度判断图片是否在视野中, 若在, 将img.src= img.data-src

1
2
3
4
5
6
7
8
9
10
let bodyScrollHeight = document.body.scrollTop 
        || document.documentElement.scrollTop;
let windowHeight = window.innerHeight;
for (let i = 0; i < imgs.length; i++) {
    let imgHeight = $(imgs[i]).offset().top;
    if (imgHeight <= windowHeight + bodyScrollHeight 
        && imgHeight >= bodyScrollHeight) {
        imgs[i].src = imgs[i].getAttribute('data-src');
    }
}

源码

具体实现及添加动画效果见Github

https://github.com/GitHub-Laziji/JS-plugins

Posted on Edited on In

从github clone代码, 奇慢, 有时只有几K, 设置完代理直接起飞

设置代理

1
2
3
//1080 为本地ss代理端口
$ git config --global http.proxy http://127.0.0.1:1080
$ git config --global https.proxy https://127.0.0.1:1080

取消代理

1
2
$ git config --global --unset http.proxy
$ git config --global --unset https.proxy

Posted on Edited on In

创建Github Pages

一个Github用户可以存在多个Github Pages每个项目都可以有自己的Github Pages, 在项目的 setting > github pages 中进行设置

Github Pages访问路径为 https://username.github.io/project

若是项目名为 username.github.io 为主页项目, 则访问路径为 https://username.github.io

创建好后无需在其中添加任何文件, 待之后 git push 即可

安装Nodejs

下载

安装Hexo

1
$ npm install -g hexo-cli

创建Hexo文件

1
2
3
$ hexo init <folder>
$ cd <folder>
$ npm install

几个常见的Hexo命令

1
2
3
4
5
6
7
8
9
10
11
//新建文章 生成的文章在source文件夹下
$ hexo n "hello"

//构建 生成html
$ hexo g

//清除已生成的文件
$ hexo clean

//本地预览
$ hexo s

提交至Git

打开根目录下的_config.yml文件

1
2
3
4
5
6
7
8
9
10
11
12
//github page的访问地址
# url: https://github-laziji.github.io
url: https://github-laziji.github.io/lllblog

# root: /
root: /lllblog/

//repo 从你新建的项目中复制过来
deploy:
  type: git
  repo: git@github.com:GitHub-Laziji/lllblog.git
  branch: master

最后提交至github

1
$ hexo d

可以看到项目已经提交了, 访问 https://username.github.io/project 即可看到你的博客了