KHL 012 11-计算机-本职-前台-框架-extjs4.1 001 mvc 小例子

Posted 2020-10-15 khlbat

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了KHL 012 11-计算机-本职-前台-框架-extjs4.1 001 mvc 小例子相关的知识，希望对你有一定的参考价值。

说明

关于后台代码只贴出Controller部分与pojo部分

完整代码参见：https://gitee.com/laolang2016/extstudy

目录结构

后台代码

domain

BaseDomain:

 1 package com.laolang.ext.mvcone.domain;
 2 
 3 import com.fasterxml.jackson.annotation.JsonFormat;
 4 
 5 import java.util.Date;
 6 
 7 /**
 8  * 实体类基类
 9  * @author laolang2016
10  * @version 1.0
11  */
12 public class BaseDomain {
13 
14     /**
15      * 创建时间
16      */
17     @JsonFormat(pattern = "yyyy-MM-dd HH:mm:ss")
18     protected Date created;
19 
20     /**
21      * 最后更新时间
22      */
23     @JsonFormat(pattern = "yyyy-MM-dd HH:mm:ss")
24     protected Date updated;
25 
26     public Date getCreated() {
27         return created;
28     }
29     public void setCreated(Date created) {
30         this.created = created;
31     }
32     public Date getUpdated() {
33         return updated;
34     }
35     public void setUpdated(Date updated) {
36         this.updated = updated;
37     }
38 
39 
40 
41 }

View Code

User:

  1 package com.laolang.ext.mvcone.domain;
  2 
  3 import com.fasterxml.jackson.annotation.JsonFormat;
  4 import org.springframework.format.annotation.DateTimeFormat;
  5 
  6 import java.util.Date;
  7 
  8 import javax.persistence.*;
  9 /**
 10  * 用户实体类
 11  * @author laolang2016
 12  * @version 1.0
 13  */
 14 @Table(name = "tb_user")
 15 public class User extends BaseDomain {
 16 
 17 
 18     public User() {
 19     }
 20 
 21     @Override
 22     public String toString() {
 23         return "User{" +
 24                 "id=" + id +
 25                 ", nickName=\'" + nickName + \'\\\'\' +
 26                 ", pwd=\'" + pwd + \'\\\'\' +
 27                 ", sex=" + sex +
 28                 ", email=\'" + email + \'\\\'\' +
 29                 ", phone=\'" + phone + \'\\\'\' +
 30                 ", joinTime=" + joinTime +
 31                 ", birthday=" + birthday +
 32                 \'}\';
 33     }
 34 
 35     public Integer getId() {
 36         return id;
 37     }
 38 
 39     public void setId(Integer id) {
 40         this.id = id;
 41     }
 42 
 43     public String getNickName() {
 44         return nickName;
 45     }
 46 
 47     public void setNickName(String nickName) {
 48         this.nickName = nickName;
 49     }
 50 
 51     public String getPwd() {
 52         return pwd;
 53     }
 54 
 55     public void setPwd(String pwd) {
 56         this.pwd = pwd;
 57     }
 58 
 59     public boolean isSex() {
 60         return sex;
 61     }
 62 
 63     public void setSex(boolean sex) {
 64         this.sex = sex;
 65     }
 66 
 67     public String getEmail() {
 68         return email;
 69     }
 70 
 71     public void setEmail(String email) {
 72         this.email = email;
 73     }
 74 
 75     public String getPhone() {
 76         return phone;
 77     }
 78 
 79     public void setPhone(String phone) {
 80         this.phone = phone;
 81     }
 82 
 83     public Date getJoinTime() {
 84         return joinTime;
 85     }
 86 
 87     public void setJoinTime(Date joinTime) {
 88         this.joinTime = joinTime;
 89     }
 90 
 91     public Date getBirthday() {
 92         return birthday;
 93     }
 94 
 95     public void setBirthday(Date birthday) {
 96         this.birthday = birthday;
 97     }
 98 
 99     /**
100      * ID
101      */
102     @Id
103     @GeneratedValue(strategy = GenerationType.IDENTITY)
104     private Integer id;
105 
106     @Column(name = "nick_name")
107     private String nickName;
108 
109     private String pwd;
110 
111     private boolean sex;
112 
113     private String email;
114 
115     private String phone;
116 
117     @Column(name = "join_time")
118     @JsonFormat(pattern = "yyyy-MM-dd")
119     private Date joinTime;
120 
121     @DateTimeFormat(pattern = "yyyy-MM-dd")
122     @JsonFormat(pattern = "yyyy-MM-dd")
123     private Date birthday;
124 
125 }

View Code

pojo

Tip:

 1 package com.laolang.ext.mvcone.pojo;
 2 
 3 /**
 4  * Created by Administrator on 2017/11/22.
 5  */
 6 public class Tip {
 7 
 8     public Tip() {
 9     }
10 
11     public boolean isSuccess() {
12         return success;
13     }
14 
15     public void setSuccess(boolean success) {
16         this.success = success;
17     }
18 
19     public String getMsg() {
20         return msg;
21     }
22 
23     public void setMsg(String msg) {
24         this.msg = msg;
25     }
26 
27     private boolean success;
28 
29     private String msg;
30 }

View Code

UserListExtPojo

 1 package com.laolang.ext.mvcone.pojo;
 2 
 3 
 4 import com.laolang.ext.mvcone.domain.User;
 5 
 6 import java.util.List;
 7 
 8 public class UserListExtPojo {
 9 
10     public UserListExtPojo() {
11     }
12 
13     public Long getTotal() {
14         return total;
15     }
16 
17     public void setTotal(Long total) {
18         this.total = total;
19     }
20 
21     public List<User> getData() {
22         return data;
23     }
24 
25     public void setData(List<User> data) {
26         this.data = data;
27     }
28 
29     private Long total;
30 
31     private List<User> data;
32 }

View Code

controller

 1 package com.laolang.ext.mvcone.web;
 2 
 3 import com.github.pagehelper.PageInfo;
 4 import com.laolang.ext.mvcone.domain.User;
 5 import com.laolang.ext.mvcone.pojo.Tip;
 6 import com.laolang.ext.mvcone.pojo.UserListExtPojo;
 7 import com.laolang.ext.mvcone.service.UserService;
 8 import com.laolang.ext.mvcone.util.StringUtils;
 9 import org.springframework.beans.factory.annotation.Autowired;
10 import org.springframework.http.HttpStatus;
11 import org.springframework.http.ResponseEntity;
12 import org.springframework.stereotype.Controller;
13 import org.springframework.web.bind.annotation.RequestMapping;
14 import org.springframework.web.bind.annotation.RequestMethod;
15 import org.springframework.web.bind.annotation.RequestParam;
16 
17 import java.util.List;
18 
19 @RequestMapping("user")
20 @Controller
21 public class UserController {
22 
23     @Autowired
24     private UserService userService;
25 
26     @RequestMapping(value = "list",method = RequestMethod.GET)
27     public ResponseEntity<UserListExtPojo> list(@RequestParam(name = "page", defaultValue = "1") Integer page, @RequestParam(name = "limit", defaultValue = "10") Integer size) {
28         try{
29             PageInfo<User> pageInfo = userService.findPageListByWhere(page,size,null);
30             UserListExtPojo users = new UserListExtPojo();
31             users.setTotal(pageInfo.getTotal());
32             users.setData(pageInfo.getList());
33 
34             return ResponseEntity.ok(users);
35         }catch (Exception e){
36 
37         }
38         return ResponseEntity.status(HttpStatus.INTERNAL_SERVER_ERROR).body(null);
39     }
40 
41     @RequestMapping(value = "delete/ids",method = RequestMethod.POST)
42     public ResponseEntity<Tip> deleteByIds( @RequestParam(name = "ids") String ids ){
43         Tip tip = new Tip();
44         try{
45             userService.deleteByIds(User.class,"id", StringUtils.idsToList(ids));
46             tip.setSuccess(true);
47             tip.setMsg("删除成功！");
48             return ResponseEntity.ok(tip);
49         }catch (Exception e){
50 
51         }
52         tip.setSuccess(false);
53         tip.setMsg("删除失败！");
54         return ResponseEntity.ok(tip);
55     }
56 
57     @RequestMapping(value = "save",method = RequestMethod.POST)
58     public ResponseEntity<Tip> save( User user){
59         Tip tip = new Tip();
60         try{
61             userService.save(user);
62             tip.setSuccess(true);
63             tip.setMsg("保存成功！");
64             return ResponseEntity.ok(tip);
65         }catch (Exception e){
66 
67         }
68         tip.setSuccess(false);
69         tip.setMsg("保存失败！");
70         return ResponseEntity.ok(tip);
71     }
72 
73     @RequestMapping(value = "update",method = RequestMethod.POST)
74     public ResponseEntity<Tip> update( User user ){
75         Tip tip = new Tip();
76         try{
77             userService.updateByPrimaryKeySelective(user);
78             tip.setSuccess(true);
79             tip.setMsg("修改成功！");
80             return ResponseEntity.ok(tip);
81         }catch (Exception e){
82 
83         }
84         tip.setSuccess(false);
85         tip.setMsg("修改失败！");
86         return ResponseEntity.ok(tip);
87     }
88 }

View Code

extjs代码

index.html

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>ext hello</title>
 6 
 7     <!-- extjs css-->
 8     <link href="/assets/extjs-4.1.1/resources/css/ext-all.css" type="text/css" rel="stylesheet" />
 9 </head>
10 <body>
11 
12 
13 
14 <script type="text/javascript" src="/assets/extjs-4.1.1/bootstrap.js"></script>
15 <script type="text/javascript" src="/assets/extjs-4.1.1/locale/ext-lang-zh_CN.js"></script>
16 
17 <script type="text/javascript" src="/app/app.js"></script>
18 <script type="text/javascript" src="/assets/js/lib.js"></script>
19 
20 </body>
21 </html>

View Code

lib.js

 1 /**
 2  * Created by Administrator on 2017/11/22.
 3  */
 4 var KM = {
 5     timeType : {
 6         DATE : \'date\',
 7         DATETIME : \'datetime\'
 8     },
 9     /**
10      * 转换时间戳
11      * @param time
12      * @param type
13      * @returns {string}
14      */
15     converDate : function(time,type) {
16         if ( type == KM.timeType.DATE ){
17             return Ext.util.Format.date(time,\'Y-m-d\');
18         }
19         if( type == KM.timeType.DATETIME ){
20             return Ext.util.Format.date(time,\'Y-m-d H:m:s\');
21         }
22     },
23     /**
24      * 性别转换
25      * @param sex
26      * @returns {string}
27      */
28     convertSex : function( sex ){
29         if( sex ){
30             return \'男\';
31         }else{
32             return \'女\';
33         }
34     },
35     url:{
36         user:{
37             list:\'http://www.extmvcone.com/user/list\',
38             deleteByIds:\'http://www.extmvcone.com/user/delete/ids\',
39             save : \'http://www.extmvcone.com/user/save\',
40             update : \'http://www.extmvcone.com/user/update\'
41         }
42     }
43 };

View Code

app.js

 1 /**
 2  * Created by Administrator on 2017/11/22.
 3  */
 4 Ext.onReady(function () {
 5     Ext.QuickTips.init();
 6     Ext.Loader.setConfig({
 7         enabled : true
 8     });
 9 
10     Ext.application({
11         name : \'KM\',
12         appFolder : \'app\',
13         launch : function(){
14             //Ext.MessageBox.alert(\'hello\',\'hello world!\');
15             Ext.create(\'Ext.container.Viewport\',{
16                 layout : "fit",
17                 border : 0,
18                 items : [{
19                     xtype : "mainviewLayout"
20                 }]
21             });
22         },
23         controllers : [
24             \'KM.controller.MainController\'
25         ]
26     });
27 });

View Code

MainViewLayout.js

 1 /**
 2  * Created by Administrator on 2017/11/22.
 3  */
 4 Ext.define(\'KM.view.MainViewLayout\',{
 5     extend : \'Ext.panel.Panel\',
 6     layout : \'border\',
 7     alias  : \'widget.mainviewLayout\',
 8     items : [{
 9         region : \'north\',
10         xtype : \'topview\'
11     },{
12         region : \'west\',
13         xtype : \'leftview\'
14     },{
15         xtype : \'panel\',
16         region : \'center\',
17         layout : \'fit\',
18         items : [{
19             xtype : \'centerview\',
20             border : 0
21         }]
22     }],
23     initComponent : KHL 006 作品-计算机-KM-小试-博客系统-功能记录
 进阶之路（基础篇） - 012 Arduino IDE 添加DHT11传感器第三方库的方法
 ruby RubySteps 012  -  Rails  - 迷你框架片段
 012-Go ORM框架之Gorm测试
 用 C 读科学记数法
 012.CI4框架CodeIgniter, 加载并调用自己的Libraries库