• 首页 首页 icon
  • 工具库 工具库 icon
    • IP查询 IP查询 icon
  • 内容库 内容库 icon
    • 快讯库 快讯库 icon
    • 精品库 精品库 icon
    • 问答库 问答库 icon
  • 更多 更多 icon
    • 服务条款 服务条款 icon

Springboot+Idea 管理系统

武飞扬头像
琼06
帮助1

管理系统

项目主要实现功能:用户登录、用户列表、用户的增删改查; (新手小白刚接触,做个总结)

1.前端介绍(h5,js,css,jQuery,ajax)

  • h5:页面各元素的显示;
  • css:页面的样式
  • => 这两者没有自己写,找个模板改的

js/jQuery: 给页面的元素增加上各种需要响应的事件:

常用页面响应事件(js)=>

  • 鼠标单击事件( onclick )
  • 鼠标经过事件( onmouSEO((Search Engine Optimization))ver )
  • 鼠标移开事件(onmouSEO((Search Engine Optimization))ut )
  • 光标聚焦事件( onfocus )
  • 失焦事件( onblur )
  • 内容选中事件( onselect )
  • 文本框内容改变事件( onchange )

常用函数(jQuery)=>

  • 页面加载之后就会执行
    $(function () { ...... })
  • $加#获取页面中input(包括选中的选框内的)
    value id = $("#userId" ).val()
  • 内容获取/修改
    id = $("#userId" ).html("新值") //html页面所有内容
    id = $("#userId" ).text("新值") //只获取文本内容
    如果不传入新值,那就那就是获取元素,否则就是对原来内容的覆盖

前后端数据传输(Ajax)=>

  $.ajax({
        type:"post",
        url: /user/login,//后端请求的地址,/user=>一级地址  /login=>二级地址(之后写controller要一个一个地对应起来)
        data:{//向后台传参数,参数之间用逗号隔开,
        "id":id,
        "username":username
        }
        dataType : "json",//传递的参数是json格式即key:value的样子,其中key,例如上边的“id”就是后端函数的对应参数
        async:false,//false:同步执行,true:异步执行
        success:function (data) {...}//后端的返回值是data,一般都是json格式
	 })

关于json

  • 创建一个json
    var jsonVar={}
  • 添加数据
    jsonVar["id"]=1 jsonVar["name"]="Ann"
  • 读取数据
    jsonVar["id"] 或者 jsonVar.id ==>两种方式,一种有引号,一种没有引号

2.springboot

1).controller

ajax向后端传入数据之后,controller中对数据进行接收。

@Controller==>controller类上面都要在上面加上这个注解
@RequestMapping("user")==>这个user对应ajax里的一级路径
public class UserController {
    @Autowired//请求service服务都要加上对应的注解
    UserService userService;
    @RequestMapping(value = "login", produces = "application/json; charset=utf-8")//value值就是前段ajax的二级路径,必须保持一致
    @ResponseBody
    public String login(User user){//一般和注解一样
        String res = userService.login(user);//请求service服务
        return res;//返回到前端
    }
}

==>

2).service/serviceImpl

controller请求service服务,service包括一个接口的java文件,和一个具体实现接口的java文件

  • 接口文件:
import com.cn.shixun.entity.User;//实体类,里面就是所有数据库的字段,以及逆向工程生成的get set 方法什么的
public interface UserService {
    public String login(User user);//单纯一个接口
}
  • 具体实现:
@Service//加service注解需要
public class UserServiceImpl implements UserService {
    @Autowired//之后需要查询向mapper请求服务,mapper通过sql语句对数据库进行操作,这里每一个mapper之前都要加注解!!!和上面的controller一样
    UserMapper userMapper;
    @Override//接口之后是对login的重写
    public String login(User user) {
        User u= userMapper.login(user);//调用mapper里面代码==>mapper要对数据库下手了
        Message msg = new Message("999","登录失败,请重新登录!");//message是自己定义的信息类
        if(u!= null){
            msg=new Message("200","登录成功");
        }
        return JSONObject.toJSONString(msg);//转化成json格式返回
    }
 }

3).mapper,mapper.xml

service请求mapper,mapper是一个接口,mapper.xml里面有sql语言

  • 接口文件 mapper.java
@Mapper//这里接口文件里需要加mapper注解,service文件是在具体文件里加注解
public interface UserMapper {
    User login(User user);//用户登录,service请求调用的那个函数
    
    int deleteByPrimaryKey(Integer id);

    int insert(User record);

    int insertSelective(User record);

    User selectByPrimaryKey(Integer id);

    int updateByPrimaryKeySelective(User record);

    int updateByPrimaryKey(User record);
}
学新通
  • 具体实现 mapper.xml
    通过不同的标签,里面写不同的功能

选择


<select id="login" parameterType="com.cn.shixun.entity.User" resultMap="BaseResultMap">//login就是函数名,parameterType是参数类型,resultMap是返回值类型
    select
    <include refid="Base_Column_List" />
    from user
    where username = #{username} and password = #{password}
    //标签里面就是原生的sql语句,username(这个是数据库里面的字段的名称) = #{username}(这个就是参数,需要和mapper一致,如果)
</select>

插入

<insert id="insert" parameterType="com.cn.shixun.entity.User">
    insert into user (id, username, password, 
      real_name, sex, sno, 
      admission_date, faculty_id, major_id, 
      class_id)
    values (#{id,jdbcType=INTEGER}, #{username,jdbcType=VARCHAR}, #{password,jdbcType=VARCHAR}, 
      #{realName,jdbcType=VARCHAR}, #{sex,jdbcType=VARCHAR}, #{sno,jdbcType=VARCHAR}, 
      #{admissionDate,jdbcType=TIMESTAMP}, #{facultyId,jdbcType=INTEGER}, #{majorId,jdbcType=INTEGER}, 
      #{classId,jdbcType=INTEGER})
</insert>

删除

<delete id="deleteByPrimaryKey" parameterType="java.lang.Integer">
   delete from user
   where id = #{id,jdbcType=INTEGER}
</delete>

3.数据库(MySql)

==> ALTER TABLE user MODIFY admission_date datetime(3) DEFAULT CURRENT_TIMESTAMP(3);//给字段更改默认值,这个是日期

loading。。。。。。。

这篇好文章是转载于:学新通技术网

  • 版权申明: 本站部分内容来自互联网,仅供学习及演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系,请提供相关证据及您的身份证明,我们将在收到邮件后48小时内删除。
  • 本站站名: 学新通技术网
  • 本文地址: /boutique/detail/tanhigbeee
系列文章
更多 icon
同类精品
更多 icon
继续加载