这个小dome简单来说的前后端分离,通过跨域调用接口来显示数据。

前端用到mui框架,主要来显示数据。

后端用到Java的springMVC,restful服务来做增删改查管理,

这里主要实现动态显示商品,剩下那些数据都是写固定的,不是动态的。

先看没有数据的的样子

 mui与springMVC前后端分离mui与springMVC前后端分离

前端的商品显示:

mui与springMVC前后端分离mui与springMVC前后端分离

 

 

后台的管理:

mui与springMVC前后端分离

 核心代码

package com.lch.kyu.Controller;


import com.lch.kyu.entity.Hungry;
import com.lch.kyu.service.HungryService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.*;

import java.util.List;

@RestController
@RequestMapping(path = "/hungry")
public class HungryCo {

    @Autowired
    HungryService hungryService;

    //查询
    @RequestMapping(path = "", method = RequestMethod.GET)
    public AjaxState getAllHung() {
        List<Hungry> hungries=(hungryService.queryAllHungry());
        for (Hungry h:hungries
             ) {
            System.out.println(h.getName());
        }
        boolean result=hungries!=null;
        return new AjaxState(result?"success":"error",hungries,result?"获得数据成功!":"获得数据失败!");
    }

    //添加
    @RequestMapping(path = "", method = RequestMethod.POST)
    public AjaxState addhungry(@RequestBody Hungry hungry) {
        boolean result=hungryService.addHungry(hungry);

        return new AjaxState(result?"success":"error",hungry,result?"添加成功!":"添加失败");
    }

    //修改
    @RequestMapping(path = "", method = RequestMethod.PUT)
    public AjaxState updatehungry(@RequestBody Hungry hungry) {
        boolean result=hungryService.editHungry(hungry);
        return new AjaxState(result?"success":"error",hungry,result?"修改成功!":"修改失败");
    }

    //删除
    @RequestMapping(path = "/{id}", method = RequestMethod.DELETE)
    public AjaxState deleteHungryid(@PathVariable int id) {
        Boolean result=hungryService.deleteHungry(id);
        return new AjaxState(result?"success":"error",id,result?"删除成功!":"删除失败");
    }


}



class  AjaxState{
    public String state;
    public Object data;
    public String message;

    public AjaxState(String state, Object data, String message) {
        this.state = state;
        this.data = data;
        this.message = message;
    }

    public AjaxState(){}
}
View Code

相关文章: