超市结算系统|Springboot+Vue通用超市结算收银系统

简介: 超市结算系统|Springboot+Vue通用超市结算收银系统

项目编号:BS-XX-154

前言:

信息数据从传统到当代,是一直在变革当中,突如其来的互联网让传统的信息管理看到了革命性的曙光,因为传统信息管理从时效性,还是安全性,还是可操作性等各个方面来讲,遇到了互联网时代才发现能补上自古以来的短板,有效的提升管理的效率和业务水平。传统的管理模式,时间越久管理的内容越多,也需要更多的人来对数据进行整理,并且数据的汇总查询方面效率也是极其的低下,并且数据安全方面永远不会保证安全性能。结合数据内容管理的种种缺点,在互联网时代都可以得到有效的补充。结合先进的互联网技术,开发符合需求的软件,让数据内容管理不管是从录入的及时性,查看的及时性还是汇总分析的及时性,都能让正确率达到最高,管理更加的科学和便捷。本次开发的通用超市结算系统实现了操作日志管理、字典管理、供应商信息管理、商品管理、出入库管理、出入库详情管理、收银管理、收银详情管理、用户管理、员工管理、用户表管理等功能。系统用到了关系型数据库中王者MySql作为系统的数据库,有效的对数据进行安全的存储,有效的备份,对数据可靠性方面得到了保证。并且程序也具备程序需求的所有功能,使得操作性还是安全性都大大提高,让通用超市结算系统更能从理念走到现实,确确实实的让人们提升信息处理效率。

一,项目简介

在管理员功能模块确定下来的基础上,对管理员各个功能进行设计,确定管理员功能的详细模块。绘制的管理员功能结构见下图。

分析程序的流程,涉及到程序的整体操作流程,通过分析与设计,绘制的程序操作流程图见下图。此程序为了确保安全,会让使用者通过登录模块验证信息,符合要求的使用者才有权限操作程序。

图3-1 程序操作流程图

程序处理数据会涉及到数据的录入环节,绘制的添加流程见下图。程序录入数据过程中,始终与数据库保持同步。

图3-2 信息添加流程图

程序里面的数据也会出现错误,因此就有相应的修改数据的功能,绘制的程序修改流程见下图。此过程也是跟后台数据库进行数据同步显示。

图3-3信息修改流程图

程序数据存放于数据仓库,有时也会涉及到数据删除,此过程对应的流程图见下图。数据信息被删除之后,数据库里面也就没有了该数据信息了。

图3-4 信息删除流程图

二,环境介绍

语言环境:Java:  jdk1.8

数据库:Mysql: mysql5.7

应用服务器:Tomcat:  tomcat8.5.31

开发工具:IDEA或VSCODE

后台开发技术:Springboot+mybatis+springmvc

前台开发技术:Node+vue+ElementUI

特色应用:支付宝沙箱

三,系统展示

3.1.1 商品管理

此页面让管理员管理商品的数据,商品管理页面见下图。此页面主要实现商品的增加、修改、删除、查看的功能。

图5-1 商品管理页面

3.1.2 供应商信息管理

供应商信息管理页面提供的功能操作有:新增供应商,修改供应商,删除供应商操作。下图就是供应商信息管理页面。

图5.3 供应商信息管理页面

3.1.2供应商类型管理

供应商类型管理页面显示所有供应商类型,在此页面既可以让管理员添加新的供应商信息类型,也能对已有的供应商类型信息执行编辑更新,失效的供应商类型信息也能让管理员快速删除。下图就是供应商类型管理页面。

图5.4 供应商类型列表页面

3.1.4 会员级别管理

3.1.5 商品管理

3.1.6 商品出入库管理

 3.1.7 员工管理

3.1.6 收银管理

会员收银支付直接从充值卡中扣款

非会员支付使用支付宝沙箱完成支付功能

四,核心代码展示

package com.controller;
import java.io.File;
import java.math.BigDecimal;
import java.net.URL;
import java.text.SimpleDateFormat;
import com.alibaba.fastjson.JSONObject;
import java.util.*;
import org.springframework.beans.BeanUtils;
import javax.servlet.http.HttpServletRequest;
import org.springframework.web.context.ContextLoader;
import javax.servlet.ServletContext;
import com.service.TokenService;
import com.utils.*;
import java.lang.reflect.InvocationTargetException;
import com.service.DictionaryService;
import org.apache.commons.lang3.StringUtils;
import com.annotation.IgnoreAuth;
import org.slf4j.Logger;
import org.slf4j.LoggerFactory;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.*;
import com.baomidou.mybatisplus.mapper.EntityWrapper;
import com.baomidou.mybatisplus.mapper.Wrapper;
import com.entity.*;
import com.entity.view.*;
import com.service.*;
import com.utils.PageUtils;
import com.utils.R;
import com.alibaba.fastjson.*;
/**
 * 操作日志
 * 后端接口
 * @author
 * @email
*/
@RestController
@Controller
@RequestMapping("/caozuorizhi")
public class CaozuorizhiController {
    private static final Logger logger = LoggerFactory.getLogger(CaozuorizhiController.class);
    private static final String TABLE_NAME = "caozuorizhi";
    @Autowired
    private CaozuorizhiService caozuorizhiService;
    @Autowired
    private TokenService tokenService;
    @Autowired
    private DictionaryService dictionaryService;
    @Autowired
    private YonghuService yonghuService;
    @Autowired
    private YuangongService yuangongService;
    /**
    * 后端列表
    */
    @RequestMapping("/page")
    public R page(@RequestParam Map<String, Object> params, HttpServletRequest request){
        logger.debug("page方法:,,Controller:{},,params:{}",this.getClass().getName(),JSONObject.toJSONString(params));
        String role = String.valueOf(request.getSession().getAttribute("role"));
        if(false)
            return R.error(511,"永不会进入");
        else if("用户".equals(role))
            params.put("yonghuId",request.getSession().getAttribute("userId"));
        else if("员工".equals(role))
            params.put("yuangongId",request.getSession().getAttribute("userId"));
        CommonUtil.checkMap(params);
        PageUtils page = caozuorizhiService.queryPage(params);
        //字典表数据转换
        List<CaozuorizhiView> list =(List<CaozuorizhiView>)page.getList();
        for(CaozuorizhiView c:list){
            //修改对应字典表字段
            dictionaryService.dictionaryConvert(c, request);
        }
        return R.ok().put("data", page);
    }
    /**
    * 后端详情
    */
    @RequestMapping("/info/{id}")
    public R info(@PathVariable("id") Long id, HttpServletRequest request){
        logger.debug("info方法:,,Controller:{},,id:{}",this.getClass().getName(),id);
        CaozuorizhiEntity caozuorizhi = caozuorizhiService.selectById(id);
        if(caozuorizhi !=null){
            //entity转view
            CaozuorizhiView view = new CaozuorizhiView();
            BeanUtils.copyProperties( caozuorizhi , view );//把实体数据重构到view中
            //修改对应字典表字段
            dictionaryService.dictionaryConvert(view, request);
            return R.ok().put("data", view);
        }else {
            return R.error(511,"查不到数据");
        }
    }
    /**
    * 后端保存
    */
    @RequestMapping("/save")
    public R save(@RequestBody CaozuorizhiEntity caozuorizhi, HttpServletRequest request){
        logger.debug("save方法:,,Controller:{},,caozuorizhi:{}",this.getClass().getName(),caozuorizhi.toString());
        String role = String.valueOf(request.getSession().getAttribute("role"));
        if(false)
            return R.error(511,"永远不会进入");
        Wrapper<CaozuorizhiEntity> queryWrapper = new EntityWrapper<CaozuorizhiEntity>()
            .eq("caozuorizhi_this_biao", caozuorizhi.getCaozuorizhiThisBiao())
            .eq("caozuorizhi_caozuobiao", caozuorizhi.getCaozuorizhiCaozuobiao())
            .eq("caozuorizhi_caozuozhanghu", caozuorizhi.getCaozuorizhiCaozuozhanghu())
            .eq("caozuorizhi_caozuoleixing", caozuorizhi.getCaozuorizhiCaozuoleixing())
            .eq("caozuorizhi_text", caozuorizhi.getCaozuorizhiText())
            ;
        logger.info("sql语句:"+queryWrapper.getSqlSegment());
        CaozuorizhiEntity caozuorizhiEntity = caozuorizhiService.selectOne(queryWrapper);
        if(caozuorizhiEntity==null){
            caozuorizhi.setInsertTime(new Date());
            caozuorizhi.setCreateTime(new Date());
            caozuorizhiService.insert(caozuorizhi);
            return R.ok();
        }else {
            return R.error(511,"表中有相同数据");
        }
    }
    /**
    * 后端修改
    */
    @RequestMapping("/update")
    public R update(@RequestBody CaozuorizhiEntity caozuorizhi, HttpServletRequest request) throws NoSuchFieldException, ClassNotFoundException, IllegalAccessException, InstantiationException {
        logger.debug("update方法:,,Controller:{},,caozuorizhi:{}",this.getClass().getName(),caozuorizhi.toString());
        CaozuorizhiEntity oldCaozuorizhiEntity = caozuorizhiService.selectById(caozuorizhi.getId());//查询原先数据
        String role = String.valueOf(request.getSession().getAttribute("role"));
//        if(false)
//            return R.error(511,"永远不会进入");
        //根据字段查询是否有相同数据
        Wrapper<CaozuorizhiEntity> queryWrapper = new EntityWrapper<CaozuorizhiEntity>()
            .notIn("id",caozuorizhi.getId())
            .andNew()
            .eq("caozuorizhi_this_biao", caozuorizhi.getCaozuorizhiThisBiao())
            .eq("caozuorizhi_caozuobiao", caozuorizhi.getCaozuorizhiCaozuobiao())
            .eq("caozuorizhi_caozuozhanghu", caozuorizhi.getCaozuorizhiCaozuozhanghu())
            .eq("caozuorizhi_caozuoleixing", caozuorizhi.getCaozuorizhiCaozuoleixing())
            .eq("caozuorizhi_text", caozuorizhi.getCaozuorizhiText())
            ;
        logger.info("sql语句:"+queryWrapper.getSqlSegment());
        CaozuorizhiEntity caozuorizhiEntity = caozuorizhiService.selectOne(queryWrapper);
        if(caozuorizhiEntity==null){
            caozuorizhiService.updateById(caozuorizhi);//根据id更新
            return R.ok();
        }else {
            return R.error(511,"表中有相同数据");
        }
    }
    /**
    * 删除
    */
    @RequestMapping("/delete")
    public R delete(@RequestBody Integer[] ids, HttpServletRequest request){
        logger.debug("delete:,,Controller:{},,ids:{}",this.getClass().getName(),ids.toString());
        List<CaozuorizhiEntity> oldCaozuorizhiList =caozuorizhiService.selectBatchIds(Arrays.asList(ids));//要删除的数据
        caozuorizhiService.deleteBatchIds(Arrays.asList(ids));
        return R.ok();
    }
    /**
     * 批量上传
     */
    @RequestMapping("/batchInsert")
    public R save( String fileName, HttpServletRequest request){
        logger.debug("batchInsert方法:,,Controller:{},,fileName:{}",this.getClass().getName(),fileName);
        Integer yonghuId = Integer.valueOf(String.valueOf(request.getSession().getAttribute("userId")));
        SimpleDateFormat sdf = new SimpleDateFormat("yyyy-MM-dd HH:mm:ss");
        try {
            List<CaozuorizhiEntity> caozuorizhiList = new ArrayList<>();//上传的东西
            Map<String, List<String>> seachFields= new HashMap<>();//要查询的字段
            Date date = new Date();
            int lastIndexOf = fileName.lastIndexOf(".");
            if(lastIndexOf == -1){
                return R.error(511,"该文件没有后缀");
            }else{
                String suffix = fileName.substring(lastIndexOf);
                if(!".xls".equals(suffix)){
                    return R.error(511,"只支持后缀为xls的excel文件");
                }else{
                    URL resource = this.getClass().getClassLoader().getResource("static/upload/" + fileName);//获取文件路径
                    File file = new File(resource.getFile());
                    if(!file.exists()){
                        return R.error(511,"找不到上传文件,请联系管理员");
                    }else{
                        List<List<String>> dataList = PoiUtil.poiImport(file.getPath());//读取xls文件
                        dataList.remove(0);//删除第一行,因为第一行是提示
                        for(List<String> data:dataList){
                            //循环
                            CaozuorizhiEntity caozuorizhiEntity = new CaozuorizhiEntity();
//                            caozuorizhiEntity.setCaozuorizhiThisBiao(data.get(0));                    //操作人所在表 要改的
//                            caozuorizhiEntity.setCaozuorizhiCaozuobiao(data.get(0));                    //操作表 要改的
//                            caozuorizhiEntity.setCaozuorizhiCaozuozhanghu(data.get(0));                    //操作账户 要改的
//                            caozuorizhiEntity.setCaozuorizhiCaozuoleixing(data.get(0));                    //操作类型 要改的
//                            caozuorizhiEntity.setCaozuorizhiText(data.get(0));                    //操作内容 要改的
//                            caozuorizhiEntity.setInsertTime(date);//时间
//                            caozuorizhiEntity.setCreateTime(date);//时间
                            caozuorizhiList.add(caozuorizhiEntity);
                            //把要查询是否重复的字段放入map中
                        }
                        //查询是否重复
                        caozuorizhiService.insertBatch(caozuorizhiList);
                        return R.ok();
                    }
                }
            }
        }catch (Exception e){
            e.printStackTrace();
            return R.error(511,"批量插入数据异常,请联系管理员");
        }
    }
}
package com.controller;
import java.util.Arrays;
import java.util.Map;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.PathVariable;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RequestBody;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.bind.annotation.RestController;
import com.annotation.IgnoreAuth;
import com.baomidou.mybatisplus.mapper.EntityWrapper;
import com.entity.ConfigEntity;
import com.service.ConfigService;
import com.utils.PageUtils;
import com.utils.R;
import com.utils.ValidatorUtils;
/**
 * 登录相关
 */
@RequestMapping("config")
@RestController
public class ConfigController{
  @Autowired
  private ConfigService configService;
  /**
     * 列表
     */
    @RequestMapping("/page")
    public R page(@RequestParam Map<String, Object> params,ConfigEntity config){
        EntityWrapper<ConfigEntity> ew = new EntityWrapper<ConfigEntity>();
      PageUtils page = configService.queryPage(params);
        return R.ok().put("data", page);
    }
  /**
     * 列表
     */
    @IgnoreAuth
    @RequestMapping("/list")
    public R list(@RequestParam Map<String, Object> params,ConfigEntity config){
        EntityWrapper<ConfigEntity> ew = new EntityWrapper<ConfigEntity>();
      PageUtils page = configService.queryPage(params);
        return R.ok().put("data", page);
    }
    /**
     * 信息
     */
    @RequestMapping("/info/{id}")
    public R info(@PathVariable("id") String id){
        ConfigEntity config = configService.selectById(id);
        return R.ok().put("data", config);
    }
    /**
     * 详情
     */
    @IgnoreAuth
    @RequestMapping("/detail/{id}")
    public R detail(@PathVariable("id") String id){
        ConfigEntity config = configService.selectById(id);
        return R.ok().put("data", config);
    }
    /**
     * 根据name获取信息
     */
    @RequestMapping("/info")
    public R infoByName(@RequestParam String name){
        ConfigEntity config = configService.selectOne(new EntityWrapper<ConfigEntity>().eq("name", "faceFile"));
        return R.ok().put("data", config);
    }
    /**
     * 保存
     */
    @PostMapping("/save")
    public R save(@RequestBody ConfigEntity config){
//      ValidatorUtils.validateEntity(config);
      configService.insert(config);
        return R.ok();
    }
    /**
     * 修改
     */
    @RequestMapping("/update")
    public R update(@RequestBody ConfigEntity config){
//        ValidatorUtils.validateEntity(config);
        configService.updateById(config);//全部更新
        return R.ok();
    }
    /**
     * 删除
     */
    @RequestMapping("/delete")
    public R delete(@RequestBody Long[] ids){
      configService.deleteBatchIds(Arrays.asList(ids));
        return R.ok();
    }
}

五,项目总结

程序软件的开发阶段也包括了系统测试,这个部分就是程序质量评定的一个重要环节,如果说程序通过编码实现功能之后,不通过测试检查程序中出现的错误,那么程序一旦投入生活中运行使用时,就会产生许多大大小小的错误,这个时候去解决问题已经晚了,所以一个程序在被交付给使用者使用之前,开发者就需要使用多种测试方法反复进行测试,也是对程序的一个负责表现。程序进入系统测试阶段,在讲究策略进行测试时,也需要对时效性进行把控。当开发者测试完程序,并解决完测试期间程序产生的各种错误时,就需要程序的验收方来对程序进行验收测试,这也是程序测试的最后一个操作步骤。验收测试也是对程序的质量以及可交付性方面起到关键的作用。

5.1系统测试方法

程序软件进入到系统测试这一个环节时,也需要根据测试的方法进行规范化测试操作,测试方法以及使用顺序分别是:首先是单元测试,接着是集成测试和系统测试,最后才是验收测试,下面将描述系统测试方法。

单元测试:这个部分需要涉及到程序的代码方面的知识,这个操作环节是程序的开发者进行的,当程序开发者通过代码编写程序的子功能模块时,就会进行单元级别的测试,通常这个环节的测试也会被称作是白盒测试。

集成测试:这个步骤的前提是程序的所有功能模块都已完成开发,这个时候需要把程序所有的子功能模块集成到一起,形成一个完整的系统,此测试的主要目的就是检查这些功能模块集成在一起时的兼容性,也就是检测它们是否按照预期正常运行。

系统测试:当程序测试进入到这个环节时,就意味着程序测试工作已经进行到一半了,这个部分的测试也有另外一个名字,称作是黑盒测试,主要用于测试系统的功能是否按照预期进行运行。

验收测试:开发的程序已经通过了前面的单元测试,集成测试,以及系统测试环节时,就需要进行验收了,这个环节的操作用户就是程序面临的最终用户或者是客户。测试主要目的就是验证开发完成的程序是不是能够符合用户对其的期望,以及程序的所有功能是否符合用户的真正需求。

5.2 系统功能测试

5.2.1 用户登录测试

登录模块主要还是验证使用者的信息,判断使用者是否具备使用权限。测试的数据见下表,这里主要针对管理员进行测试。

表6-1 管理员登录测试数据表

选取的功能

具体步骤

填写的数据

预测结果

最终结果

管理员登录

依照页面提示依次填写账号,密码,然后点击登录按钮

保持账号与密码这两项数据,其中一个有误,另一个正确,进行测试

失败

失败

保持账号与密码都正确

成功

成功

5.2.2 添加账户功能测试

此部分主要测试程序的“添加账户”功能。测试信息使用数据表展示。

表6-2 添加新闻功能测试数据表

选取的功能

具体步骤

填写的数据

预测结果

最终结果

添加账户功能

管理员在添加账户页面根据提示填写数据并提交

标题和内容为null或数据格式有误

失败

失败

标题和内容填写无误

成功

成功

6.3 系统测试分析

通用超市结算系统在经历了一系列测试步骤之后,可以确定该系统可以交付给使用者进行使用了,在系统的功能主界面上可以清晰展示各个功能,并且各个功能的超链接也是正常跳转,能够实现用户要求的功能。在程序的稳定性,可靠性,验证逻辑以及操作流程方面跟需求文档很贴合。所以,开发完成的通用超市结算系统符合用户需求,它在用户电脑上运行使用带给用户的便利是显而易见的。

相关文章
|
27天前
|
JavaScript 安全 Java
如何使用 Spring Boot 和 Ant Design Pro Vue 实现动态路由和菜单功能,快速搭建前后端分离的应用框架
本文介绍了如何使用 Spring Boot 和 Ant Design Pro Vue 实现动态路由和菜单功能,快速搭建前后端分离的应用框架。首先,确保开发环境已安装必要的工具,然后创建并配置 Spring Boot 项目,包括添加依赖和配置 Spring Security。接着,创建后端 API 和前端项目,配置动态路由和菜单。最后,运行项目并分享实践心得,包括版本兼容性、安全性、性能调优等方面。
132 1
|
11天前
|
JavaScript 安全 Java
如何使用 Spring Boot 和 Ant Design Pro Vue 构建一个具有动态路由和菜单功能的前后端分离应用。
本文介绍了如何使用 Spring Boot 和 Ant Design Pro Vue 构建一个具有动态路由和菜单功能的前后端分离应用。首先,创建并配置 Spring Boot 项目,实现后端 API;然后,使用 Ant Design Pro Vue 创建前端项目,配置动态路由和菜单。通过具体案例,展示了如何快速搭建高效、易维护的项目框架。
92 62
|
3天前
|
XML Java 数据库连接
SpringBoot集成Flowable:打造强大的工作流管理系统
在企业级应用开发中,工作流管理是一个核心组件,它能够帮助我们定义、执行和管理业务流程。Flowable是一个开源的工作流和业务流程管理(BPM)平台,它提供了强大的工作流引擎和建模工具。结合SpringBoot,我们可以快速构建一个高效、灵活的工作流管理系统。本文将探讨如何将Flowable集成到SpringBoot应用中,并展示其强大的功能。
19 1
|
9天前
|
JavaScript 安全 Java
如何使用 Spring Boot 和 Ant Design Pro Vue 构建一个前后端分离的应用框架,实现动态路由和菜单功能
本文介绍了如何使用 Spring Boot 和 Ant Design Pro Vue 构建一个前后端分离的应用框架,实现动态路由和菜单功能。首先,确保开发环境已安装必要的工具,然后创建并配置 Spring Boot 项目,包括添加依赖和配置 Spring Security。接着,创建后端 API 和前端项目,配置动态路由和菜单。最后,运行项目并分享实践心得,帮助开发者提高开发效率和应用的可维护性。
24 2
|
12天前
|
JavaScript Java 项目管理
Java毕设学习 基于SpringBoot + Vue 的医院管理系统 持续给大家寻找Java毕设学习项目(附源码)
基于SpringBoot + Vue的医院管理系统,涵盖医院、患者、挂号、药物、检查、病床、排班管理和数据分析等功能。开发工具为IDEA和HBuilder X,环境需配置jdk8、Node.js14、MySQL8。文末提供源码下载链接。
|
21天前
|
存储 安全 Java
打造智能合同管理系统:SpringBoot与电子签章的完美融合
【10月更文挑战第7天】 在数字化转型的浪潮中,电子合同管理系统因其高效、环保和安全的特点,正逐渐成为企业合同管理的新宠。本文将分享如何利用SpringBoot框架实现一个集电子文件签字与合同管理于一体的智能系统,探索技术如何助力合同管理的现代化。
55 4
|
21天前
|
前端开发 Java Apache
SpringBoot实现电子文件签字+合同系统!
【10月更文挑战第15天】 在现代企业运营中,合同管理和电子文件签字成为了日常活动中不可或缺的一部分。随着技术的发展,电子合同系统因其高效性、安全性和环保性,逐渐取代了传统的纸质合同。本文将详细介绍如何使用SpringBoot框架实现一个电子文件签字和合同管理系统。
40 1
|
24天前
|
文字识别 安全 Java
SpringBoot3.x和OCR构建车牌识别系统
本文介绍了一个基于Java SpringBoot3.x框架的车牌识别系统,详细阐述了系统的设计目标、需求分析及其实现过程。利用Tesseract OCR库和OpenCV库,实现了车牌图片的识别与处理,确保系统的高准确性和稳定性。文中还提供了具体的代码示例,展示了如何构建和优化车牌识别服务,以及如何处理特殊和异常车牌。通过实际应用案例,帮助读者理解和应用这一解决方案。
|
28天前
|
JavaScript 安全 Java
如何使用 Spring Boot 和 Ant Design Pro Vue 构建一个具有动态路由和菜单功能的前后端分离应用
【10月更文挑战第8天】本文介绍了如何使用 Spring Boot 和 Ant Design Pro Vue 构建一个具有动态路由和菜单功能的前后端分离应用。首先,通过 Spring Initializr 创建并配置 Spring Boot 项目,实现后端 API 和安全配置。接着,使用 Ant Design Pro Vue 脚手架创建前端项目,配置动态路由和菜单,并创建相应的页面组件。最后,通过具体实践心得,分享了版本兼容性、安全性、性能调优等注意事项,帮助读者快速搭建高效且易维护的应用框架。
39 3
|
29天前
|
JavaScript 安全 Java
如何使用 Spring Boot 和 Ant Design Pro Vue 构建一个具有动态路由和菜单功能的前后端分离应用
【10月更文挑战第7天】本文介绍了如何使用 Spring Boot 和 Ant Design Pro Vue 构建一个具有动态路由和菜单功能的前后端分离应用。首先,通过 Spring Initializr 创建 Spring Boot 项目并配置 Spring Security。接着,实现后端 API 以提供菜单数据。在前端部分,使用 Ant Design Pro Vue 脚手架创建项目,并配置动态路由和菜单。最后,启动前后端服务,实现高效、美观且功能强大的应用框架。
34 2
下一篇
无影云桌面