如何使用ssm实现乐购游戏商城系统+vue

@TOC

ssm115乐购游戏商城系统+vue

第一章 绪 论

1.1背景及意义

系统管理也都将通过计算机进行整体智能化操作，对于乐购游戏商城所牵扯的管理及数据保存都是非常多的，这给管理者的工作带来了巨大的挑战，开发一套乐购游戏商城系统给用户带来非常大的方便，用户可以不用像传统的方式进行查看信息，这样不仅耽误自己的时间，而且比对过程比较单一，所以乐购游戏商城系统的开发不仅仅是能满足用户的需求，还能提高管理员的工作效率，减少原有不必要的工作量。

面对大量的信息，传统的管理系统，都是通过笔记的方式进行详细信息的统计，后来出现电脑，通过电脑输入软件将纸质的信息统计到电脑上，这种方式比较传统，而且想要统计数据信息比较麻烦，还受时间和空间的影响，所以为此开发了乐购游戏商城系统；为用户提供了方便管理平台，方便管理员查看及维护，并且可以通过需求进行商城内容的编辑及维护等；对于用户而言，可以随时进行查看商城公告和游戏信息，管理员可以足不出户就可以获取到系统的数据信息等，而且还能节省用户很多时间，所以开发乐购游戏商城系统给管理者带来了很大的方便，同时也方便管理员对用户信息进行处理。

本论文乐购游戏商城系统主要牵扯到的程序，数据库与计算机技术等。覆盖知识面大，可以大大的提高系统人员工作效率。

1.2国内外研究概况

随着国内经济形势的不断发展，中国互联网进入了一个难得的高峰发展时期，这使得中外资本家纷纷转向互联网市场。 然而，许多管理领域的不合理结构，人员不足以及市场管理需求的增加使得更多的人具备了互联网管理的意识。

在当今高度发达的信息中，信息管理改革已成为一种更加广泛和全面的趋势。 “乐购游戏商城系统”是基于Mysql数据库，在Java程序设计的基础上实现的。为确保中国经济的持续发展，信息时代日益更新，服务业仍在蓬勃发展。同时，随着信息社会的快速发展，各种管理系统面临着越来越多的数据需要处理，如何用方便快捷的方式使管理者在广阔的数据海洋里面查询、存储、管理和共享有效的数据信息，对我们的学习，工作和生活具有重要的现实意义。因此，国内外学术界对此进行了深入而广泛的研究，一个新的研究领域——乐购游戏商城系统诞生了。

28

1.3 研究的内容

目前许多人仍将传统的纸质工具作为信息管理的主要工具，而网络技术的应用只是起到辅助作用。在对网络工具的认知程度上，较为传统的office软件等仍是人们使用的主要工具，而相对全面且专业的信息管理软件仍没有得到大多数人的了解或认可。本选题则旨在通过标签分类管理等方式，实现乐购游戏商城系统的各种功能，从而达到对乐购游戏商城系统的管理。

详细内容介绍，将在以下六章中详细阐述：

第一章、绪论，介绍了研究课题选择的背景及意义、研究现状，简要介绍了本文的章节内容。

第二章、引入技术知识，通过引入关键技术进行开发，向系统中涉及直观表达的技术知识。

第三章、重点分析了系统的分析，从系统强大的供需市场出发，对系统开发的可行性，系统流程以及系统性能和功能进行了探讨。

第四章、介绍了系统的详细设计方案，包括系统结构设计和数据库设计。

第五章、系统设计的实现，通过对系统功能设计的详细说明，论证了系统的结构。

第六章、系统的整体测试，评判系统是否可以上线运行。

第二章 关键技术的研究

2.1 JAVA简介

Java主要采用CORBA技术和安全模型，可以在互联网应用的数据保护。它还提供了对EJB（Enterprise JavaBeans）的全面支持，java servlet API，Java（java server pages），和XML技术。JAVA语言是一种面向对象的语言，它通过提供最基本的方法来完成指定的任务，开发者只需要知道一些概念就能够编写出一些应用程序。Java程序相对较小，其代码能够在小机器上运行。Java是一种计算机编程语言，具有封装、继承和多态性三个主要特性，广泛应用于企业Web应用程序开发和移动应用程序开发。

Java语言和一般编译器以及直译的区别在于，Java首先将源代码转换为字节码，然后将其转换为JVM的可执行文件，JVM可以在各种不同的JVM上运行。因此，实现了它的跨平台特性。虽然这使得Java在早期非常缓慢，但是随着Java的开发，它已经得到了改进。

2.2 ECLIPSE 开发环境

ECLIPSE 支持广泛、兼容性高并且功能强大，是一个Eclipse 插件集合，普遍适应于JAVA和J2EE的系统开发，支持 JDBC，Hibernate，AJAX，Struts，Java Servlet，Spring，EJB3等市面上存在的几乎所有数据库链接工具和主流Eclipse产品 开发工具。

ECLIPSE 在业内是所熟知的开发工具，该平台在开发的过程中运用的就是该工具。ECLIPSE 又被称之为企业级的工作平台，它是以Eclipse IDE为基础的。ECLIPSE 可以帮助我们进行数据库的研发和J2EE的使用，除此之外，还可以提高系统的运营能力，这突出表现在服务器的整合过程中。ECLIPSE 的功能相当完备，能够为J2EE的集成提供必要的环境支持，从而完成编码、测试、调试及发布等功能。它可以支持Java，HTML，SQL，Javascript，Struts， CSS等。

2.3 Tomcat服务器

Tomcat属于一种轻型的服务器，所以说在中小企业中并不具有普适性。但是当程序员需要开发或调试Java 程序时，则通常会将该服务器作为首选。对于一个仅具有计算机基础知识的人来说，计算机系统具有一个好的Apache服务器，可以很好的对HTML 页面进行访问。Tomcat 虽然是Apache的扩展，但是它们都是可以独立运行的，二者是不互相干扰的。当配置正确的时候，Apache服务器为HTML 页面的运行提供技术支持，Tomcat 的任务则是运行Servle和Java 页面。Tomca也具有一定的HTML页面处理功能。

2.4 MySQL数据库

数据库是系统开发过程中不可或缺的一部分。在WEB应用方面，MySQL AB开发了一个具有很大优势的MySQL关系数据库管理系统。 MySQL可以将数据存储在不同的表中，这非常灵活，并且还可以提高系统在实际应用中的速度。数据库访问最常用于标准SQL语言，MySQL用于SQL语言，因此它具有高度兼容性。数据库的操作是必不可少的，包括对数据库表的增加、删除、修改、查询等功能。现如今，数据库可以分为关系型数据库和非关系型数据库，Mysql属于关系性数据库，Mysql数据库是一款小型的关系型数据库，它以其自身特点：体积小、速度快、成本低等，Mysql数据库是目前最受欢迎的开源数据库。

在WEB应用技术中， Mysql数据库支持不同的操作系统平台，虽然在不同平台下的安装和配置都不相同，但是差别也不是很大，Mysql在Windows平台下两种安装方式，二进制版和免安装版。安装完Mysql数据库之后，需要启动服务进程，相应的客户端就可以连接数据库，客户端可通过命令行或者图形界面工具登录数据库。

第三章 系统分析

3.1 系统设计目标

乐购游戏商城系统主要是为了用户方便对游戏的了解以及查看商城公告、订单信息、游戏信息，也是为了更好的让管理员进行更好存储所有数据信息及快速方便的检索功能，对系统的各个模块是通过许多今天的发达系统做出合理的分析来确定考虑用户的可操作性，遵循开发的系统优化的原则，经过全面的调查和研究。

系统所要实现的功能分析，对于现在网络方便的管理，根据自己的需求可以进行在线查看，这样既能节省用户的时间，不用在像传统的方式，需要查询、由于很多用户的时间的原因，没有办法去了解相关商城信息，真的很难去满足用户的各种需求。所以乐购游戏商城系统的开发不仅仅是能满足用户的需求，还能提高管理员的工作效率，减少原有不必要的工作量。

3.2 系统可行性分析

系统的开发环境和配置都是可以自行安装的，系统使用Java开发工具，使用比较成熟的Mysql数据库进行对系统用户和管理员之间相关的数据交互，根据技术语言对数据库，结合需求进行修改维护，可以使得系统运行更具有稳定性和安全性，从而完成实现系统的开发。

（1）硬件可行性分析

乐购游戏商城系统及信息分析的设计对于所使用的计算机没有什么硬性的要求，计算机只要可以正常的使用进行代码的编写及页面设计就可行，主要是对于服务器有些要求，对于平台搭建完成要上传的服务器是有一定的要求的，服务器必须选择安全性比较高的，然后就是在打开系统必须顺畅，不能停顿太长时间；性价比高；安全性高。

（2）软件可行性分析

开发整个系统使用的是云计算，流量的可扩展性和基于流量的智能调整云计算的优点就是流量的可扩展性和基于流量的智能调整，保障系统的安全及数据信息的及时备份。

因此，我们从两个方面进行了可行性研究，可以看出系统的开发没有问题。

3.3 系统功能分析和描述

使用乐购游戏商城系统的分为管理员和用户两个角色的权限子模块。

管理员所能使用的功能主要有：个人中心、用户管理、商城公告管理、游戏分类管理、商城游戏管理、订单信息管理、游戏下载管理、管理员管理、留言板管理、系统管理等。

用户可以实现个人中心、订单信息管理、游戏下载管理、留言板管理、我的收藏管理等。

用户可以实现首页、个人中心、游戏下载管理、游戏信息管理、留言板管理、补考费用管理

3.4系统UML用例分析

3.4.1管理员用例

管理员后台：个人中心、用户管理、商城公告管理、游戏分类管理、商城游戏管理、订单信息管理、游戏下载管理、管理员管理、留言板管理、系统管理，管理员的用例如图3-1所示。

图3-1 管理员用例图

3.4.2用户用例

用户后台；首页、个人中心、订单信息管理、游戏下载管理、留言板管理、我的收藏管理进行，用户用例如图3-2所示。

图3-2 用户用例图

3.5系统流程分析

3.5.2添加管理员登陆流程

下图为管理员登陆模块流程图，详细流程为最开始用户输入账号密码，系统判断是否正确，正确显示登陆成功错误或者用户和密码其一为空则需重新输入账号密码。如图4-1所示。

图4-1 登录主界面

3.5.1操作流程

用户想进入系统，首先进入系统登录界面，通过正确的用户名、密码，选择登录类型登录，系统会检查登录信息，信息正确，然后输入相应的功能界面，提示信息错误，登录失败。系统操作流程如图3-3所示。

图3-3操作流程图

3.5.3删除信息流程

用户选择要删除的信息并单击Delete按钮。系统提示是否删除信息。如果用户想要删除信息，系统将删除信息。系统数据库删除信息。删除信息流程图如图3-5所示。

图3-5 删除信息流程图

第四章 系统设计

4.1 系统体系结构

管理员是系统的管理者，因此管理员对管理也是不可或缺的部分，通过该操作登录账号密码，创建管理员信息，通过数据库的信息反馈到页面，判断该管理员是否存在，管理员时序图如图3-4所示。

图3-4 管理员时序图

用户登录也是本系统重要的部分，该模块主要对用户的信息进行添加、删除、修改、查询操作，与其他各个功能模块有着密不可分的关联，我们无论用哪种身份对系统进行操作时，都需要用身份去完成相应的操作。用户登录时序图如图3-5所示。

图3-5 用户时序图

这些功能可以充分满足乐购游戏商城系统的需求。此系统功能较为全面如下图系统功能结构如图4-4所示。

图4-4系统功能结构图

4.2 数据库设计原则

每个数据库的应用它们都是和区分开的，当运行到一定的程序当中，它就会与自己相关的协议与客户端进行通讯。那么这个系统就会对使这些数据进行连接。当我们选择哪个桥段的时候，接下来就会简单的叙述这个数据库是如何来创建的。当点击完成按钮的时候就会自动在对话框内弹出数据源的名称，在进行点击下一步即可，直接在输入相对应的身份验证和登录密码。

用户信息：用户名、用户姓名、头像、性别、手机号码、邮箱，实体E-R图，如图4.6所示。

图4.6用户信息E-R图

商城游戏信息：游戏名称、图片、游戏分类、价格、开发商、上市日期，E-R图，如图4.7所示。

图4.7商城游戏信息E-R图

4.3 数据表

将数据库概念设计的E-R图转换为关系数据库。在关系数据库中，数据关系由数据表组成，但是表的结构表现在表的字段上。

表4-1 allusers表

列名	数据类型	长度	约束
id	int	11	NOT NULL
username	varchar	50	default NULL
pwd	varchar	50	default NULL
cx	varchar	50	default NULL

表4-2：dingdanxinxi表

列名	数据类型	长度	约束
id	int	11	NOT NULL
addtime	varchar	50	default NULL
dingdanxinxi	varchar	50	default NULL
youximingcheng	varchar	50	default NULL
youxifenlei	varchar	50	default NULL
kaifashang	varchar	50	default NULL
jiage	varchar	50	default NULL
goumairiqi	varchar	50	default NULL
yonghuming	varchar	50	default NULL
yonghuxingming	varchar	50	default NULL
shoujihaoma	varchar	50	default NULL

表4-3：shangchenggonggao表

列名	数据类型	长度	约束
ID	int	11	NOT NULL
addtime	varchar	50	default NULL
gonggaobiaoti	varchar	50	default NULL
tupian	varchar	50	default NULL
gonggaoneirong	varchar	50	default NULL
faburiqi	varchar	50	default NULL

表4-4：shangchengyouxi表

列名	数据类型	长度	约束
id	int	11	NOT NULL
addtime	varchar	50	default NULL
youximingcheng	varchar	2	default NULL
tupian	varchar	50	default NULL
youxifenlei	varchar	50	default NULL
jiage	varchar	50	default NULL
kaifashang	varchar	255	default NULL
youxijianjie	varchar	50	default NULL
shangshiriqi	varchar	50	default NULL

表4-5：yonghu表

列名	数据类型	长度	约束
id	int	11	NOT NULL
addtime	varchar	50	default NULL
yonghuming	varchar	255	default NULL
mima	varchar	50	default NULL
yonghuxingming	varchar	50	default NULL
touxiang	varchar	50	default NULL
xingbie	varchar	50	default NULL
shoujihaoma	varchar	50	default NULL
youxiang	varchar	50	default NULL

5. 系统实现

5.1管理员功能模块

管理员通过用户名和密码，角色填写完成后进行登录，如图5-1所示。

管理员登录成功后进入到系统操作界面，可以对首页查看个人中心、用户管理、商城公告管理、游戏分类管理、商城游戏管理、订单信息管理、游戏下载、管理员管理、留言板管理、系统管理。如图5-2所示。

用户管理：管理员通过列表可以获取用户名、用户姓名、头像、性别、手机号码、邮箱等内容，可以进行修改或删除操作，如图5-3所示。

图5-1管理员登录页面

图5-2管理员首页页面

图5-3用户管理页面图

商城公告管理：管理员通过商城公告查看公告标题、图片、发布日期等信息，进行查看详情、删除或修改操作，如图5-4

图5-4商城公告管理界面图

商城游戏管理：管理员通过商城游戏列表可以查看游戏名称、图片、游戏分类、价格、开发商、上市日期等信息，进行详情、修改或删除操作，如图5-5所示。

图5-5商城游戏管理界面图

订单信息管理：管理员通过订单信息列表可以查看订单编号、游戏名称、游戏分类、开发商、价格、购买日期、用户名、用户姓名、手机号码，进行查看用户支付状况，进行查看详情、修改或删除操作，如图5-6所示。

图5-6订单信息管理界面图

留言板管理：管理员通过留言板可以查看用户留言进行回复等信息，进行添加详情、修改或删除操作，如图5-7所示。

图5-7留言板管理界面图

系统管理：该页面为客服、轮播图管理界面。管理员可以在此页面进行回复用户、前台轮播图上传，以及图片的删除、修改，如图5-8所示。

图5-8系统管理界面图

5.2前台功能模块

乐购游戏商城系统，用户在乐购游戏商城系统前台首页可以查看首页、商城公告、商城游戏、留言反馈、个人中心、后台管理、客服等内容，如图5-9所示。

图5-9首页界面图

注册，用户通过注册页面填写用户名、密码、用户姓名、头像、性别、手机号码、邮箱等信息进行注册，如图5-10所示。

图5-10注册界面图

登录，在登录页面可以填写用户名、密码等信息，如图5-11所示。

图5-11登录界面图

个人中心，用户在个人信息页面可以查看用户名、用户姓名、头像、性别、手机号码、邮箱等信息可进行更新操作，如图5-12所示。

图5-12个人中心界面图

商城游戏，用户在商城游戏页面可以查看游戏名称、图片、游戏分类、价格、开发商、上市日期，可进行购买、收藏操作，如图5-13所示。

图5-13商城游戏界面图

5.3用户功能模块

用户通过填写用户名和密码，角色进行登录，如图5-14所示。

用户点击进入到系统操作界面，可以查看首页、个人中心、订单信息管理、游戏下载管理、留言板管理、我的收藏管理等功能，如图5-15所示

图5-14登陆界面图

图5-15首页界面图

订单信息管理：用户通过订单信息列表可进行查看支付状况进行支付操作，如图5-16所示。

图5-16订单信息管理界面图

游戏下载管理：用户通过游戏下载页面进行下载操作，如图5-17所示。

图5-17游戏下载界面图

我的收藏管理：用户在收藏管理页面可以查看收藏名称、收藏图片等等内容，并进行详情、删除操作，如图5-18所示。

图5-18我的收藏管理界面图

ShangchengyouxiController.java

package com.controller;

import java.text.SimpleDateFormat;
import java.util.ArrayList;
import java.util.Arrays;
import java.util.Calendar;
import java.util.Map;
import java.util.HashMap;
import java.util.Iterator;
import java.util.Date;
import java.util.List;
import javax.servlet.http.HttpServletRequest;

import com.utils.ValidatorUtils;
import org.apache.commons.lang3.StringUtils;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.format.annotation.DateTimeFormat;
import org.springframework.web.bind.annotation.PathVariable;
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.baomidou.mybatisplus.mapper.EntityWrapper;
import com.baomidou.mybatisplus.mapper.Wrapper;
import com.annotation.IgnoreAuth;

import com.entity.ShangchengyouxiEntity;
import com.entity.view.ShangchengyouxiView;

import com.service.ShangchengyouxiService;
import com.service.TokenService;
import com.utils.PageUtils;
import com.utils.R;
import com.utils.MD5Util;
import com.utils.MPUtil;
import com.utils.CommonUtil;


/**
 * 商城游戏
 * 后端接口
 * @author 
 * @email 
 * @date 2021-03-20 16:32:51
 */
@RestController
@RequestMapping("/shangchengyouxi")
public class ShangchengyouxiController {
    @Autowired
    private ShangchengyouxiService shangchengyouxiService;
    


    /**
     * 后端列表
     */
    @RequestMapping("/page")
    public R page(@RequestParam Map<String, Object> params,ShangchengyouxiEntity shangchengyouxi, 
		HttpServletRequest request){

        EntityWrapper<ShangchengyouxiEntity> ew = new EntityWrapper<ShangchengyouxiEntity>();
		PageUtils page = shangchengyouxiService.queryPage(params, MPUtil.sort(MPUtil.between(MPUtil.likeOrEq(ew, shangchengyouxi), params), params));
        return R.ok().put("data", page);
    }
    
    /**
     * 前端列表
     */
	@IgnoreAuth
    @RequestMapping("/list")
    public R list(@RequestParam Map<String, Object> params,ShangchengyouxiEntity shangchengyouxi, HttpServletRequest request){
        EntityWrapper<ShangchengyouxiEntity> ew = new EntityWrapper<ShangchengyouxiEntity>();
		PageUtils page = shangchengyouxiService.queryPage(params, MPUtil.sort(MPUtil.between(MPUtil.likeOrEq(ew, shangchengyouxi), params), params));
        return R.ok().put("data", page);
    }

	/**
     * 列表
     */
    @RequestMapping("/lists")
    public R list( ShangchengyouxiEntity shangchengyouxi){
       	EntityWrapper<ShangchengyouxiEntity> ew = new EntityWrapper<ShangchengyouxiEntity>();
      	ew.allEq(MPUtil.allEQMapPre( shangchengyouxi, "shangchengyouxi")); 
        return R.ok().put("data", shangchengyouxiService.selectListView(ew));
    }

	 /**
     * 查询
     */
    @RequestMapping("/query")
    public R query(ShangchengyouxiEntity shangchengyouxi){
        EntityWrapper< ShangchengyouxiEntity> ew = new EntityWrapper< ShangchengyouxiEntity>();
 		ew.allEq(MPUtil.allEQMapPre( shangchengyouxi, "shangchengyouxi")); 
		ShangchengyouxiView shangchengyouxiView =  shangchengyouxiService.selectView(ew);
		return R.ok("查询商城游戏成功").put("data", shangchengyouxiView);
    }
	
    /**
     * 后端详情
     */
    @RequestMapping("/info/{id}")
    public R info(@PathVariable("id") Long id){
        ShangchengyouxiEntity shangchengyouxi = shangchengyouxiService.selectById(id);
        return R.ok().put("data", shangchengyouxi);
    }

    /**
     * 前端详情
     */
	@IgnoreAuth
    @RequestMapping("/detail/{id}")
    public R detail(@PathVariable("id") Long id){
        ShangchengyouxiEntity shangchengyouxi = shangchengyouxiService.selectById(id);
        return R.ok().put("data", shangchengyouxi);
    }
    



    /**
     * 后端保存
     */
    @RequestMapping("/save")
    public R save(@RequestBody ShangchengyouxiEntity shangchengyouxi, HttpServletRequest request){
    	shangchengyouxi.setId(new Date().getTime()+new Double(Math.floor(Math.random()*1000)).longValue());
    	//ValidatorUtils.validateEntity(shangchengyouxi);

        shangchengyouxiService.insert(shangchengyouxi);
        return R.ok();
    }
    
    /**
     * 前端保存
     */
    @RequestMapping("/add")
    public R add(@RequestBody ShangchengyouxiEntity shangchengyouxi, HttpServletRequest request){
    	shangchengyouxi.setId(new Date().getTime()+new Double(Math.floor(Math.random()*1000)).longValue());
    	//ValidatorUtils.validateEntity(shangchengyouxi);

        shangchengyouxiService.insert(shangchengyouxi);
        return R.ok();
    }

    /**
     * 修改
     */
    @RequestMapping("/update")
    public R update(@RequestBody ShangchengyouxiEntity shangchengyouxi, HttpServletRequest request){
        //ValidatorUtils.validateEntity(shangchengyouxi);
        shangchengyouxiService.updateById(shangchengyouxi);//全部更新
        return R.ok();
    }
    

    /**
     * 删除
     */
    @RequestMapping("/delete")
    public R delete(@RequestBody Long[] ids){
        shangchengyouxiService.deleteBatchIds(Arrays.asList(ids));
        return R.ok();
    }
    
    /**
     * 提醒接口
     */
	@RequestMapping("/remind/{columnName}/{type}")
	public R remindCount(@PathVariable("columnName") String columnName, HttpServletRequest request, 
						 @PathVariable("type") String type,@RequestParam Map<String, Object> map) {
		map.put("column", columnName);
		map.put("type", type);
		
		if(type.equals("2")) {
			SimpleDateFormat sdf = new SimpleDateFormat("yyyy-MM-dd");
			Calendar c = Calendar.getInstance();
			Date remindStartDate = null;
			Date remindEndDate = null;
			if(map.get("remindstart")!=null) {
				Integer remindStart = Integer.parseInt(map.get("remindstart").toString());
				c.setTime(new Date()); 
				c.add(Calendar.DAY_OF_MONTH,remindStart);
				remindStartDate = c.getTime();
				map.put("remindstart", sdf.format(remindStartDate));
			}
			if(map.get("remindend")!=null) {
				Integer remindEnd = Integer.parseInt(map.get("remindend").toString());
				c.setTime(new Date());
				c.add(Calendar.DAY_OF_MONTH,remindEnd);
				remindEndDate = c.getTime();
				map.put("remindend", sdf.format(remindEndDate));
			}
		}
		
		Wrapper<ShangchengyouxiEntity> wrapper = new EntityWrapper<ShangchengyouxiEntity>();
		if(map.get("remindstart")!=null) {
			wrapper.ge(columnName, map.get("remindstart"));
		}
		if(map.get("remindend")!=null) {
			wrapper.le(columnName, map.get("remindend"));
		}


		int count = shangchengyouxiService.selectCount(wrapper);
		return R.ok().put("count", count);
	}
	


}

ConfigServiceImpl.java

package com.service.impl;


import java.util.Map;

import org.springframework.stereotype.Service;

import com.baomidou.mybatisplus.mapper.EntityWrapper;
import com.baomidou.mybatisplus.plugins.Page;
import com.baomidou.mybatisplus.service.impl.ServiceImpl;
import com.dao.ConfigDao;
import com.entity.ConfigEntity;
import com.entity.UserEntity;
import com.service.ConfigService;
import com.utils.PageUtils;
import com.utils.Query;


/**
 * 系统用户
 */
@Service("configService")
public class ConfigServiceImpl extends ServiceImpl<ConfigDao, ConfigEntity> implements ConfigService {
	@Override
	public PageUtils queryPage(Map<String, Object> params) {
		Page<ConfigEntity> page = this.selectPage(
                new Query<ConfigEntity>(params).getPage(),
                new EntityWrapper<ConfigEntity>()
        );
        return new PageUtils(page);
	}
}

ShangchengyouxiServiceImpl.java

package com.service.impl;

import org.springframework.stereotype.Service;
import java.util.Map;
import java.util.List;

import com.baomidou.mybatisplus.mapper.Wrapper;
import com.baomidou.mybatisplus.mapper.EntityWrapper;
import com.baomidou.mybatisplus.plugins.Page;
import com.baomidou.mybatisplus.service.impl.ServiceImpl;
import com.utils.PageUtils;
import com.utils.Query;


import com.dao.ShangchengyouxiDao;
import com.entity.ShangchengyouxiEntity;
import com.service.ShangchengyouxiService;
import com.entity.vo.ShangchengyouxiVO;
import com.entity.view.ShangchengyouxiView;

@Service("shangchengyouxiService")
public class ShangchengyouxiServiceImpl extends ServiceImpl<ShangchengyouxiDao, ShangchengyouxiEntity> implements ShangchengyouxiService {
	

    @Override
    public PageUtils queryPage(Map<String, Object> params) {
        Page<ShangchengyouxiEntity> page = this.selectPage(
                new Query<ShangchengyouxiEntity>(params).getPage(),
                new EntityWrapper<ShangchengyouxiEntity>()
        );
        return new PageUtils(page);
    }
    
    @Override
	public PageUtils queryPage(Map<String, Object> params, Wrapper<ShangchengyouxiEntity> wrapper) {
		  Page<ShangchengyouxiView> page =new Query<ShangchengyouxiView>(params).getPage();
	        page.setRecords(baseMapper.selectListView(page,wrapper));
	    	PageUtils pageUtil = new PageUtils(page);
	    	return pageUtil;
 	}
    
    @Override
	public List<ShangchengyouxiVO> selectListVO(Wrapper<ShangchengyouxiEntity> wrapper) {
 		return baseMapper.selectListVO(wrapper);
	}
	
	@Override
	public ShangchengyouxiVO selectVO(Wrapper<ShangchengyouxiEntity> wrapper) {
 		return baseMapper.selectVO(wrapper);
	}
	
	@Override
	public List<ShangchengyouxiView> selectListView(Wrapper<ShangchengyouxiEntity> wrapper) {
		return baseMapper.selectListView(wrapper);
	}

	@Override
	public ShangchengyouxiView selectView(Wrapper<ShangchengyouxiEntity> wrapper) {
		return baseMapper.selectView(wrapper);
	}

}

IndexMain.vue

<template>
	<el-main>
		<bread-crumbs :title="title" class="bread-crumbs"></bread-crumbs>
		<router-view class="router-view"></router-view>
	</el-main>
</template>
<script>
	import menu from "@/utils/menu";
	export default {
		data() {
			return {
				menuList: [],
				role: "",
				currentIndex: -2,
				itemMenu: [],
				title: ''
			};
		},
		mounted() {
			let menus = menu.list();
			this.menuList = menus;
			this.role = this.$storage.get("role");
		},
		methods: {
			menuHandler(menu) {
				this.$router.push({
					name: menu.tableName
				});
				this.title = menu.menu;
			},
			titleChange(index, menus) {
				this.currentIndex = index
				this.itemMenu = menus;
				console.log(menus);
			},
			homeChange(index) {
				this.itemMenu = [];
				this.title = ""
				this.currentIndex = index
				this.$router.push({
					name: 'home'
				});
			},
			centerChange(index) {
				this.itemMenu = [{
					"buttons": ["新增", "查看", "修改", "删除"],
					"menu": "修改密码",
					"tableName": "updatePassword"
				}, {
					"buttons": ["新增", "查看", "修改", "删除"],
					"menu": "个人信息",
					"tableName": "center"
				}];
				this.title = ""
				this.currentIndex = index
				this.$router.push({
					name: 'home'
				});
			}
		}
	};
</script>
<style lang="scss" scoped>
	a {
		text-decoration: none;
		color: #555;
	}

	a:hover {
		background: #00c292;
	}

	.nav-list {
		width: 100%;
		margin: 0 auto;
		text-align: left;
		margin-top: 20px;

		.nav-title {
			display: inline-block;
			font-size: 15px;
			color: #333;
			padding: 15px 25px;
			border: none;
		}

		.nav-title.active {
			color: #555;
			cursor: default;
			background-color: #fff;
		}
	}

	.nav-item {
		margin-top: 20px;
		background: #FFFFFF;
		padding: 15px 0;

		.menu {
			padding: 15px 25px;
		}
	}

	.el-main {
		background-color: #F6F8FA;
		padding: 0 24px;
		// padding-top: 60px;
	}

	.router-view {
		padding: 10px;
		margin-top: 10px;
		background: #FFFFFF;
		box-sizing: border-box;
	}

	.bread-crumbs {
		width: 100%;
		// border-bottom: 1px solid #e9eef3;
		// border-top: 1px solid #e9eef3;
		margin-top: 10px;
		box-sizing: border-box;
	}
</style>

声明

本博客适用于广泛的学术和教育用途，包括但不限于个人学习、开发设计，产品设计。仅供学习参考，旨在为读者提供深入理解和学术研究的材料。