vue+springboot实现echarts数据图统计

①vue项目修改配置

 安装依赖:

npm i echarts -S

修改路由index.js:

import Vue from 'vue'
import VueRouter from 'vue-router'
import Manager from '../views/Manager.vue'
// 解决导航栏或者底部导航tabBar中的vue-router在3.0版本以上频繁点击菜单报错的问题。
const originalPush = VueRouter.prototype.push
VueRouter.prototype.push = function push (location) {return originalPush.call(this, location).catch(err => err)
}
Vue.use(VueRouter)const routes = [{path: '/',name: 'manager',component: Manager,children:[{path:'orders',name:'Orders',meta:{name:'订单管理'},component:()=>import('../views/manager/Orders.vue')},{path:'charts',name:'Charts',meta:{name:'数据统计'},component:()=>import('../views/manager/Charts.vue')},{path:'logs',name:'Logs',meta:{name:'系统日志'},component:()=>import('../views/manager/Logs.vue')},{path:'notice',name:'Notice',meta:{name:'系统公告'},component:()=>import('../views/manager/Notice.vue')},{path:'news',name:'News',meta:{name:'新闻信息'},component:()=>import('../views/manager/News.vue')},{path:'newsDetail',name:'NewsDetail',meta:{name:'新闻详情页'},component:()=>import('../views/manager/NewsDetail.vue')},{path:'home',name:'Home',meta:{ name:'系统首页' },component:()=>import('../views/manager/Home.vue')},{path:'user',name:'User',meta:{ name:'用户信息' },component:()=>import('../views/manager/User.vue')},{path:'403',name:'Auth',meta:{ name:'无权限' },component:()=>import('../views/Auth.vue')},{path:'Person',name:'person',meta:{ name:'个人信息' },component:()=>import('../views/manager/Person.vue')},{path:'Password',name:'password',meta:{ name:'修改密码' },component:()=>import('../views/manager/Password.vue')}],redirect:'/home'},{path: '/about',name: 'about',// route level code-splitting// this generates a separate chunk (about.[hash].js) for this route// which is lazy-loaded when the route is visited.component: () => import(/* webpackChunkName: "about" */ '../views/AboutView.vue')},{path:'/login',name:'login',meta:{ name:'登录' },component: ()=>import('../views/login.vue')},{path:'/register',name:'register',meta:{ name:'注册' },component: ()=>import('../views/register.vue')},{path:'*',name:'404',meta:{ name:'无法访问' },component: ()=>import('../views/404.vue')}
]const router = new VueRouter({mode: 'history',base: process.env.BASE_URL,routes
})
router.beforeEach((to,from,next)=>{let adminPaths=['/user']let user=JSON.parse(localStorage.getItem('honey-user')||'{}')if(user.role !== '管理员' && adminPaths.includes(to.path)){next('/403')}else{next()}
})
export default router

修改Manager.vue:

<template><div><el-container><!--    侧边栏  --><el-aside :width="asideWidth" style="min-height: 100vh; background-color: #001529"><div style="height: 60px; color: white; display: flex; align-items: center; justify-content: center"><img src="@/assets/logo1.png" alt="" style="width: 40px; height: 40px"><span class="logo-title" v-show="!isCollapse">honey2024</span></div><el-menu :default-openeds="['info']" :collapse="isCollapse" :collapse-transition="false" router background-color="#001529" text-color="rgba(255, 255, 255, 0.65)" active-text-color="#fff" style="border: none" :default-active="$route.path"><el-menu-item index="/home"><i class="el-icon-s-home"></i><span slot="title">系统首页</span></el-menu-item><el-submenu index="info" ><template slot="title"><i class="el-icon-menu"></i><span>信息管理</span></template><el-menu-item index="/user" v-if="user.role === '管理员'">用户信息</el-menu-item><el-menu-item index="/news" v-if="user.role === '管理员'">新闻信息</el-menu-item><el-menu-item index="/notice" v-if="user.role === '管理员'">系统公告</el-menu-item><el-menu-item index="/logs" v-if="user.role === '管理员'">系统日志</el-menu-item><el-menu-item index="/charts" v-if="user.role === '管理员'">数据统计</el-menu-item><el-menu-item index="/orders">订单管理</el-menu-item></el-submenu></el-menu></el-aside><el-container><!--        头部区域--><el-header><i :class="collapseIcon" style="font-size: 26px" @click="handleCollapse"></i><el-breadcrumb separator-class="el-icon-arrow-right" style="margin-left: 20px"><el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item><el-breadcrumb-item :to="{ path: $route.path }">{{ $route.meta.name }}</el-breadcrumb-item></el-breadcrumb><div style="flex: 1; width: 0; display: flex; align-items: center; justify-content: flex-end"><i class="el-icon-quanping" style="font-size: 26px" @click="handleFull"></i><el-dropdown placement="bottom"><div style="display: flex; align-items: center; cursor: default"><img :src="user.avatar||'https://cube.elemecdn.com/3/7c/3ea6beec64369c2642b92c6726f1epng.png'" alt="" style="width: 40px; height: 40px; margin: 0 5px;border-radius: 50%"><span>{{user.name}}</span></div><el-dropdown-menu slot="dropdown"><el-dropdown-item @click.native="$router.push('/person')">个人信息</el-dropdown-item><el-dropdown-item @click.native="$router.push('/password')">修改密码</el-dropdown-item><el-dropdown-item @click.native="logout">退出登录</el-dropdown-item></el-dropdown-menu></el-dropdown></div></el-header><!--        主体区域--><el-main><router-view @update:user="updateUser"></router-view></el-main></el-container></el-container></div>
</template><script>
import axios from "axios";
import request from '@/utils/request'export default {name: 'HomeView',data() {return {isCollapse: false,  // 不收缩asideWidth: '200px',collapseIcon: 'el-icon-s-fold',user:JSON.parse(localStorage.getItem('honey-user')||'{}'),}},mounted() {if(!this.user.id){this.$router.push('/login')}// axios.get('http://localhost:9090/user/selectall').then(res=>{//   console.log(res.data);//   this.users=res.data.data// })// request.get('/user/selectall').then(res => {//   this.users = res.data// })},methods: {updateUser(user){this.user=JSON.parse(JSON.stringify(user))},handleFileUpload(response,file,fileList){this.fileList=fileListconsole.log(response,file,fileList)},logout() {localStorage.removeItem("honey-user")this.$router.push('/login')},handleFull() {document.documentElement.requestFullscreen()},handleCollapse() {this.isCollapse = !this.isCollapsethis.asideWidth = this.isCollapse ? '64px' : '200px'this.collapseIcon = this.isCollapse ? 'el-icon-s-unfold' : 'el-icon-s-fold'}}
}
</script><style>
.el-menu--inline {background-color: #000c17 !important;
}.el-menu--inline .el-menu-item {background-color: #000c17 !important;padding-left: 49px !important;
}.el-menu-item:hover, .el-submenu__title:hover {color: #fff !important;
}.el-submenu__title:hover i {color: #fff !important;
}.el-menu-item:hover i {color: #fff !important;
}.el-menu-item.is-active {background-color: #1890ff !important;border-radius: 5px !important;width: calc(100% - 8px);margin-left: 4px;
}.el-menu-item.is-active i, .el-menu-item.is-active .el-tooltip {margin-left: -4px;
}.el-menu-item {height: 40px !important;line-height: 40px !important;
}.el-submenu__title {height: 40px !important;line-height: 40px !important;
}.el-submenu .el-menu-item {min-width: 0 !important;
}.el-menu--inline .el-menu-item.is-active {padding-left: 45px !important;
}/*.el-submenu__icon-arrow {*/
/*  margin-top: -5px;*/
/*}*/.el-aside {transition: width .3s;box-shadow: 2px 0 6px rgba(0, 21, 41, .35);
}.logo-title {margin-left: 5px;font-size: 20px;transition: all .3s; /* 0.3s */
}.el-header {box-shadow: 2px 0 6px rgba(0, 21, 41, .35);display: flex;align-items: center;
}
</style>

新建Charts.vue:

 

Charts.vue:静态版

<template>
<div><el-row :gutter="10"><el-col :span="12"><el-card><div style="height: 400px;width: 100%" id="line"></div></el-card></el-col><el-col :span="12"><el-card><div style="height: 400px;width: 100%" id="bar"></div></el-card></el-col></el-row><el-row :gutter="10" style="margin: 10px 0"><el-col :span="12"><el-card><div style="height: 400px;width: 100%" id="pie"></div></el-card></el-col></el-row>>
</div>
</template>
<script>
import * as echarts from 'echarts';
const option = {title: {text: '订单金额统计图',left:'center'},legend: {left: 'left'},tooltip: {trigger: 'axis'},xAxis: {type: 'category',data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']},yAxis: {type: 'value'},series: [{name:'金额',data: [150, 230, 224, 218, 135, 147, 260],type: 'line',smooth:true},{name:'库存',data: [15, 20, 22, 21, 110, 160, 225],type: 'line',smooth:true}]
};
const option1 = {title: {text: '订单金额柱状图',left:'center'},legend: {left: 'left'},tooltip: {trigger: 'axis'},xAxis: {type: 'category',data: ['水果', '零食', '奶制品', '饮料', '生活用品']},yAxis: {type: 'value'},series: [{name:'金额',data: [15000, 23000, 224000, 21800, 13500, 14700, 26000],type: 'bar',smooth:true},{name:'销量',data: [1500, 2000, 2200, 2100, 11000, 16000, 22500],type: 'bar',smooth:true}]
};
const option2={title: {text: '订单销售比例图',subtext: '比例图',left: 'center'},tooltip: {trigger: 'item'},legend: {orient: 'vertical',left: 'left'},series: [{name: 'Access From',type: 'pie',center:['50%','60%'],radius: '50%',data: [{ value: 1048, name: 'Search Engine' },{ value: 735, name: 'Direct' },{ value: 580, name: 'Email' },{ value: 484, name: 'Union Ads' },{ value: 300, name: 'Video Ads' }],emphasis: {itemStyle: {shadowBlur: 10,shadowOffsetX: 0,shadowColor: 'rgba(0, 0, 0, 0.5)'}}}]
};
export default {data(){},mounted() {let lineDom = document.getElementById('line');let lineChart = echarts.init(lineDom);lineChart.setOption(option)let barDom = document.getElementById('bar');let barChart = echarts.init(barDom);barChart.setOption(option1)let pieDom = document.getElementById('pie');let pieChart = echarts.init(pieDom);pieChart.setOption(option2)}
}
</script>
<style scoped></style>

新建Orders.vue:

<template><div><div><el-input style="width: 200px" placeholder="查询名称" v-model="name"></el-input><el-button type="primary" style="margin-left: 10px" @click="load(1)">查询</el-button><el-button type="info" @click="reset">重置</el-button></div><div style="margin: 10px 0"><el-button type="primary" plain @click="handleAdd">新增</el-button><el-button type="danger" plain @click="delBatch">批量删除</el-button></div><el-table :data="tableData" stripe :header-cell-style="{ backgroundColor: 'aliceblue', color: '#666' }" @selection-change="handleSelectionChange"><el-table-column type="selection" width="55" align="center"></el-table-column><el-table-column prop="id" label="序号" width="70" align="center"></el-table-column><el-table-column prop="no" label="编号"></el-table-column><el-table-column prop="name" label="订单名称"></el-table-column><el-table-column prop="money" label="金额" show-overflow-tooltip></el-table-column><el-table-column prop="user" label="用户"></el-table-column><el-table-column prop="date" label="创建时间"></el-table-column><el-table-column label="操作" align="center" width="180"><template v-slot="scope"><el-button size="mini" type="primary" plain @click="handleEdit(scope.row)">编辑</el-button><el-button size="mini" type="danger" plain @click="del(scope.row.id)">删除</el-button></template></el-table-column></el-table><div style="margin: 10px 0"><el-pagination@current-change="handleCurrentChange":current-page="pageNum":page-size="pageSize"layout="total, prev, pager, next":total="total"></el-pagination></div><el-dialog title="公告信息" :visible.sync="fromVisible" width="40%" :close-on-click-modal="false"><el-form :model="form" label-width="80px" style="padding-right: 20px" :rules="rules" ref="formRef"><el-form-item label="订单名称" prop="name"><el-input v-model="form.name" placeholder="名称"></el-input></el-form-item><el-form-item label="订单金额" prop="money"><el-input type="textarea" v-model="form.money" placeholder="金额"></el-input></el-form-item><el-form-item label="订单分类" prop="money"><el-select style="width: 100%" v-model="form.category"><el-option v-for="item in ['水果','蔬菜','零食','饮料','奶制品','糕点']" :key="item" :value="item"></el-option></el-select></el-form-item></el-form><div slot="footer" class="dialog-footer"><el-button @click="fromVisible = false">取 消</el-button><el-button type="primary" @click="save">确 定</el-button></div></el-dialog></div>
</template><script>
export default {name: "Orders",data() {return {tableData: [],  // 所有的数据pageNum: 1,   // 当前的页码pageSize: 5,  // 每页显示的个数username: '',name: '',total: 0,fromVisible: false,form: {},user: JSON.parse(localStorage.getItem('honey-user') || '{}'),rules: {name: [{ required: true, message: '请输入名称', trigger: 'blur' },],money: [{ required: true, message: '请输入金额', trigger: 'blur' },],category: [{ required: true, message: '请输入分类', trigger: 'blur' },],},ids: [],content:'',}},created() {this.load()},methods: {delBatch() {if (!this.ids.length) {this.$message.warning('请选择数据')return}this.$confirm('您确认批量删除这些数据吗?', '确认删除', {type: "warning"}).then(response => {this.$request.delete('/orders/delete/batch', { data: this.ids }).then(res => {if (res.code === '200') {   // 表示操作成功this.$message.success('操作成功')this.load(1)} else {this.$message.error(res.msg)  // 弹出错误的信息}})}).catch(() => {})},handleSelectionChange(rows) {   // 当前选中的所有的行数据this.ids = rows.map(v => v.id)},del(id) {this.$confirm('您确认删除吗?', '确认删除', {type: "warning"}).then(response => {this.$request.delete('/orders/delete/' + id).then(res => {if (res.code === '200') {   // 表示操作成功this.$message.success('操作成功')this.load(1)} else {this.$message.error(res.msg)  // 弹出错误的信息}})}).catch(() => {})},handleEdit(row) {   // 编辑数据this.form = JSON.parse(JSON.stringify(row))  // 给form对象赋值  注意要深拷贝数据this.fromVisible = true   // 打开弹窗},handleAdd() {   // 新增数据this.form = {}  // 新增数据的时候清空数据this.fromVisible = true   // 打开弹窗},save() {// 保存按钮触发的逻辑  它会触发新增或者更新this.$refs.formRef.validate((valid) => {if (valid) {this.sendSaveRequest();}})},sendSaveRequest(){this.$request({url: this.form.id ? '/orders/update': '/orders/add',method: this.form.id ? 'PUT' : 'POST',data: this.form}).then(res => {if (res.code === '200') {  // 表示成功保存this.$message.success('保存成功')this.load(1)this.fromVisible = false} else {this.$message.error(res.msg)  // 弹出错误的信息}})},reset() {this.name = ''this.load()},load(pageNum) {  // 分页查询if (pageNum)  this.pageNum = pageNumthis.$request.get('/orders/selectByPage', {params: {pageNum: this.pageNum,pageSize: this.pageSize,name: this.name}}).then(res => {this.tableData = res.data.recordsthis.total = res.data.total})},handleCurrentChange(pageNum) {this.load(pageNum)},}
}
</script><style>
.el-tooltip__popper{width: 200px !important;
}
</style>

 Charts.vue:动态版

<template>
<div><el-row :gutter="10"><el-col :span="12"><el-card><div style="height: 400px;width: 100%" id="line"></div></el-card></el-col><el-col :span="12"><el-card><div style="height: 400px;width: 100%" id="bar"></div></el-card></el-col></el-row><el-row :gutter="10" style="margin: 10px 0"><el-col :span="12"><el-card><div style="height: 400px;width: 100%" id="pie"></div></el-card></el-col></el-row>>
</div>
</template>
<script>
import * as echarts from 'echarts';
const option = {title: {text: '订单金额统计图',left:'center'},legend: {left: 'left'},tooltip: {trigger: 'axis'},xAxis: {type: 'category',data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']},yAxis: {type: 'value'},series: [{name:'金额',data: [],type: 'line',smooth:true},]
};
const option1 = {title: {text: '订单金额柱状图',left:'center'},legend: {left: 'left'},tooltip: {trigger: 'axis'},xAxis: {type: 'category',data: []},yAxis: {type: 'value'},series: [{name:'金额',data: [],type: 'bar',smooth:true},]
};
const option2={title: {text: '订单销售比例图',subtext: '比例图',left: 'center'},tooltip: {trigger: 'item'},legend: {orient: 'vertical',left: 'left'},series: [{name: '金额',type: 'pie',center:['50%','60%'],radius: '50%',data: [],label:{show:true,formatter(param){return param.name+'('+param.percent+'%)';}},emphasis: {itemStyle: {shadowBlur: 10,shadowOffsetX: 0,shadowColor: 'rgba(0, 0, 0, 0.5)'}}}]
};
export default {data(){},mounted() {let lineDom = document.getElementById('line');let lineChart = echarts.init(lineDom);let barDom = document.getElementById('bar');let barChart = echarts.init(barDom);let pieDom = document.getElementById('pie');let pieChart = echarts.init(pieDom);pieChart.setOption(option2)this.$request.get('/charts').then(res=>{option.xAxis.data=res.data?.line?.map(v=>v.date)||[]option.series[0].data=res.data?.line?.map(v=>v.value)||[]lineChart.setOption(option)option1.xAxis.data=res.data?.bar?.map(v=>v.name)||[]option1.series[0].data=res.data?.bar?.map(v=>v.value)||[]barChart.setOption(option1)option2.series[0].data=res.data?.bar||[]pieChart.setOption(option2)})}
}
</script>
<style scoped></style>

②后端配置

 新建数据库:

CREATE TABLE `orders` (`id` int(11) NOT NULL AUTO_INCREMENT,`no` varchar(255) COLLATE utf8mb4_unicode_ci DEFAULT NULL COMMENT '订单编号',`name` varchar(255) COLLATE utf8mb4_unicode_ci DEFAULT NULL COMMENT '订单名称',`money` decimal(10,2) DEFAULT NULL COMMENT '订单金额',`userid` int(11) DEFAULT NULL COMMENT '用户ID',`category` varchar(255) COLLATE utf8mb4_unicode_ci DEFAULT NULL COMMENT '订单分类',`date` varchar(255) COLLATE utf8mb4_unicode_ci DEFAULT NULL COMMENT '订单日期',PRIMARY KEY (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_unicode_ci COMMENT='订单表';

 springboot项目中创建Orders实体类

package com.example.springboot.entity;import com.baomidou.mybatisplus.annotation.IdType;
import com.baomidou.mybatisplus.annotation.TableField;
import com.baomidou.mybatisplus.annotation.TableId;
import lombok.AllArgsConstructor;
import lombok.Builder;
import lombok.Data;
import lombok.NoArgsConstructor;import java.math.BigDecimal;@Data
@AllArgsConstructor
@NoArgsConstructor
@Builder
public class Orders {@TableId(type = IdType.AUTO)private Integer id;private String no;private String name;private BigDecimal money;private Integer userid;private String category;private String date;@TableField(exist = false)private String user;
}

创建OrdersMapper:

 

package com.example.springboot.mapper;import com.baomidou.mybatisplus.core.mapper.BaseMapper;
import com.example.springboot.entity.Logs;
import com.example.springboot.entity.Orders;public interface OrdersMapper extends BaseMapper<Orders> {}

创建OrdersService:

package com.example.springboot.service;import com.baomidou.mybatisplus.extension.service.impl.ServiceImpl;
import com.example.springboot.entity.Logs;
import com.example.springboot.entity.Orders;
import com.example.springboot.mapper.LogsMapper;
import com.example.springboot.mapper.OrdersMapper;
import org.springframework.stereotype.Service;@Service
public class OrdersService extends ServiceImpl<OrdersMapper, Orders> {}

创建OrdersController:

 

package com.example.springboot.controller;import cn.hutool.core.date.DateUtil;
import cn.hutool.core.util.IdUtil;
import cn.hutool.core.util.StrUtil;
import com.baomidou.mybatisplus.core.conditions.query.QueryWrapper;
import com.baomidou.mybatisplus.extension.plugins.pagination.Page;
import com.example.springboot.common.HoneyLogs;
import com.example.springboot.common.LogType;
import com.example.springboot.common.Result;
import com.example.springboot.entity.Orders;
import com.example.springboot.entity.User;
import com.example.springboot.service.OrdersService;
import com.example.springboot.service.UserService;
import com.example.springboot.utils.TokenUtils;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.*;import java.util.List;@RestController
@RequestMapping("/orders")
public class OrdersController {@AutowiredOrdersService ordersService;@AutowiredUserService userService;/*** 新增信息*/@HoneyLogs(operation = "订单",type= LogType.ADD)@PostMapping("/add")public Result add(@RequestBody Orders orders) {User currentUser= TokenUtils.getCurrentUser();orders.setUserid(currentUser.getId());orders.setDate(DateUtil.today());orders.setNo(IdUtil.fastSimpleUUID());ordersService.save(orders);return Result.success();}/*** 修改信息*/@HoneyLogs(operation = "订单",type= LogType.UPDATE)@PutMapping("/update")public Result update(@RequestBody Orders orders) {ordersService.updateById(orders);return Result.success();}/*** 删除信息*/@HoneyLogs(operation = "订单",type= LogType.DELETE)@DeleteMapping("/delete/{id}")public Result delete(@PathVariable Integer id) {ordersService.removeById(id);return Result.success();}/*** 批量删除信息*/@HoneyLogs(operation = "订单",type= LogType.BATCH_DELETE)@DeleteMapping("/delete/batch")public Result batchDelete(@RequestBody List<Integer> ids) {ordersService.removeBatchByIds(ids);return Result.success();}/*** 查询全部信息*/@GetMapping("/selectAll")public Result selectAll() {List<Orders> ordersList = ordersService.list(new QueryWrapper<Orders>().orderByDesc("id"));return Result.success(ordersList);}@GetMapping("/selectUserData")public Result selectUserData() {QueryWrapper<Orders> queryWrapper=new QueryWrapper<Orders>().orderByDesc("id");queryWrapper.eq("open",1);List<Orders> userList = ordersService.list(queryWrapper);return Result.success(userList);}/*** 根据ID查询信息*/@GetMapping("/selectById/{id}")public Result selectById(@PathVariable Integer id) {Orders orders = ordersService.getById(id);User user=userService.getById(orders.getUserid());if(user!=null){orders.setUser(user.getName());}return Result.success(orders);}/*** 多条件模糊查询信息* pageNum 当前的页码* pageSize 每页查询的个数*/@GetMapping("/selectByPage")public Result selectByPage(@RequestParam Integer pageNum,@RequestParam Integer pageSize,@RequestParam String name) {QueryWrapper<Orders> queryWrapper = new QueryWrapper<Orders>().orderByDesc("id");  // 默认倒序,让最新的数据在最上面queryWrapper.like(StrUtil.isNotBlank(name), "name", name);Page<Orders> page = ordersService.page(new Page<>(pageNum, pageSize), queryWrapper);List<Orders> records=page.getRecords();
//        List<User> list=userService.list();for(Orders record:records){Integer authorid=record.getUserid();User user=userService.getById(authorid);
//            String author=list.stream().filter(u->u.getId().equals(authorid)).findFirst().map(User::getName).orElse("");if(user!=null){record.setUser(user.getName());}}return Result.success(page);}}

修改WebController:

package com.example.springboot.controller;import cn.hutool.core.collection.CollUtil;
import cn.hutool.core.lang.Dict;
import cn.hutool.core.util.StrUtil;
import com.example.springboot.common.AuthAccess;
import com.example.springboot.common.HoneyLogs;
import com.example.springboot.common.LogType;
import com.example.springboot.common.Result;
import com.example.springboot.entity.Orders;
import com.example.springboot.entity.User;
import com.example.springboot.exception.ServiceException;
import com.example.springboot.service.OrdersService;
import com.example.springboot.service.UserService;
import org.springframework.web.bind.annotation.*;import javax.annotation.Resource;
import java.math.BigDecimal;
import java.util.ArrayList;
import java.util.Comparator;
import java.util.List;
import java.util.Set;
import java.util.stream.Collectors;@RestController
public class WebController {@ResourceUserService userService;@ResourceOrdersService ordersService;@AuthAccess@GetMapping("/")public Result hello(){return Result.success("success");}@HoneyLogs(operation = "用户",type = LogType.LOGIN)@PostMapping("/login")public Result login(@RequestBody User user){if(StrUtil.isBlank(user.getUsername())||StrUtil.isBlank(user.getPassword())){return Result.error("数据输入错误");}user=userService.login(user);return Result.success(user);}@HoneyLogs(operation = "用户",type = LogType.REGISTER)@AuthAccess@PostMapping("/register")public Result register(@RequestBody User user){if(StrUtil.isBlank(user.getUsername())||StrUtil.isBlank(user.getPassword())){throw new ServiceException("输入不合法");}if(user.getUsername().length()>10||user.getPassword().length()>20){throw new ServiceException("长度过长");}user=userService.register(user);return Result.success(user);}@HoneyLogs(operation = "用户",type = LogType.UPDATE)@AuthAccess@PutMapping("/password")public Result password(@RequestBody User user){if(StrUtil.isBlank(user.getUsername())||StrUtil.isBlank(user.getPhone())){throw new ServiceException("输入不合法");}userService.resetPassword(user);return Result.success();}@GetMapping("/charts")public Result charts(){List<Orders> list = ordersService.list();Set<String> dates=list.stream().map(Orders::getDate).collect(Collectors.toSet());List<String> dateList=CollUtil.newArrayList(dates);dateList.sort(Comparator.naturalOrder());List<Dict> lineList=new ArrayList<>();for(String date:dates){BigDecimal sum=list.stream().filter(orders -> orders.getDate().equals(date)).map(Orders::getMoney).reduce(BigDecimal::add).orElse(BigDecimal.ZERO);Dict dict=Dict.create();Dict line=dict.set("date",date).set("value",sum);lineList.add(line);}Set<String> categories=list.stream().map(Orders::getCategory).collect(Collectors.toSet());List<Dict> barList=new ArrayList<>();for(String category:categories){BigDecimal sum=list.stream().filter(orders -> orders.getCategory().equals(category)).map(Orders::getMoney).reduce(BigDecimal::add).orElse(BigDecimal.ZERO);Dict dict=Dict.create();Dict bar=dict.set("name",category).set("value",sum);barList.add(bar);}Dict res=Dict.create().set("line",lineList).set("bar",barList);return Result.success(res);}
}

 

 

 

 

 

 

 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/pingmian/18590.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

「光储充放」一体充电站-一文读懂光储充放充电站

“光储充放”一体充电站作为一种储能充电的新形式渐渐走进人们的生活&#xff0c;全国很多地区都开始陆续投放运营“光储充放”一体充电站&#xff0c;今天的这篇文章&#xff0c;就带大家全面了解“光储充放”这一新型充电站。 头图来源 | 视觉中国 01 政策背景 早在2020年…

集合的交集、并集和差集运算

自学python如何成为大佬(目录):https://blog.csdn.net/weixin_67859959/article/details/139049996?spm1001.2014.3001.5501 集合最常用的操作就是进行交集、并集、差集和对称差集运算。进行交集运算时使用“&”符号&#xff0c;进行并集运算时使用“&#xff5c;”符号&…

基于振弦采集仪的岩土工程振弦监测技术研究与应用

基于振弦采集仪的岩土工程振弦监测技术研究与应用 岩土工程振弦监测技术是一种基于振弦采集仪的测试方法&#xff0c;用于对岩土体的力学特性进行监测和分析。振弦采集仪是一种先进的测试设备&#xff0c;能够准确测量岩土体中的振动响应&#xff0c;并通过分析振动信号来获取…

学习笔记——数据通信基础——数据通信网络(拓扑结构)

网络拓扑 网络拓扑(Network Topology)是指用传输介质(例如双绞线、光纤等)互连各种设备(例如计算机终端、路由器、交换机等)所呈现的结构化布局。 1、网络拓扑形态 星型网络∶所有节点通过一个中心节点连接在一起。 优点∶容易在网络中增加新的节点。通信数据必须经过中心节点…

python-数据可视化(总)

python-数据可视化 ** 数据可视化 指的是通过可视化表示来探索数据&#xff0c;它与数据挖掘**紧密相关&#xff0c;而数据挖掘指的是使用代码来探索数据集的规律和关联。数据集可以是用一行代码就能表示的小型数字列表&#xff0c;也可以是数以吉字节的数据 最流行的工具之一…

HTTP协议的基本了解

一、HTTP-概述 HTTP&#xff1a;Hyper Text Transfer Protocol(超文本传输协议)&#xff0c;规定了浏览器与服务器之间数据传输的规则。 http是互联网上应用最为广泛的一种网络协议 。http协议要求&#xff1a;浏览器在向服务器发送请求数据时&#xff0c;或是服务器在向浏览器…

7 步解决Android Studio模拟器切换中文输入

详细步骤传送地址&#xff1a;Android Studio 模拟器切换中文输入 目录 01 问题概述 02 模拟器的调试 01 问题概述 大家在使用Android Studio 软件进行项目演示时总会遇到一些输入框需要输入中文汉字的情况&#xff0c;由于AS自带的模拟器基本都是英文&#xff0c;这时就有同…

Dubbo生态之深度分析sentinel的流量控制

1. 深度了解sentinel限流规则参数的含义 博客Dubbo生态之sentinel限流-CSDN博客中有dubbo集成sentinel的demo演示 在sentinel中&#xff0c;限流的直接表现形式就是&#xff0c;在执行Entry nodeA SphU.entry(resourceName)的时候抛出FlowException异常&#xff0c;FlowExce…

Linux学习笔记(二)

一、Linux文件目录 1.命令&#xff1a;tree -L 1 2.挂载命令&#xff08;例如U盘&#xff0c;需要挂载之后才能访问&#xff09;&#xff1a; mount /dev/cdrom /mnt ls /mnt 3.查看登录信息&#xff1a; last / lastlog 4.修改/查看网络信息 vi /etc/sysconfig/netw…

【吊打面试官系列】Java高并发篇 - 死锁的原因?

大家好&#xff0c;我是锋哥。今天分享关于 【死锁的原因&#xff1f;】面试题&#xff0c;希望对大家有帮助&#xff1b; 死锁的原因&#xff1f; 1、是多个线程涉及到多个锁&#xff0c;这些锁存在着交叉&#xff0c;所以可能会导致了一个锁依赖 的闭环。 例如&#xff1a; …

计算机网络7——网络安全1 概述与加密

文章目录 一、网络安全问题概述1、计算机网络面临的安全性威胁2、安全的计算机网络3、数据加密模型 二、两类密码体制1、对称密钥密码体制2、公钥密码体制 随着计算机网络的发展&#xff0c;网络中的安全问题也日趋严重。当网络的用户来自社会各个阶层与部门时&#xff0c;大量…

文件跨境传输法律管控越来越严格,企业该如何有效应对?

文件跨境传输已经成为非常普遍的业务需求&#xff0c;企业在世界各地的总分支处、合作伙伴&#xff0c;客户间开展业务时&#xff0c;必须基于数据的跨境流转而展开。 但随着世界各国对数据安全的重视&#xff0c;文件跨境传输也日趋严格&#xff0c;各国在法律法规上均出具了更…

[RK3588-Android12] 关于ES8388 喇叭+PDM回采 4+2配置

问题描述&#xff1a; ES8388 喇叭PDM回采 42配置如下&#xff1a; 解决方案&#xff1a; // MICpdmics: dummy-codec {status "okay";compatible "rockchip,dummy-codec";#sound-dai-cells <0>;};// MICpdm_mic_array: pdm-mic-array {status …

thingsboard接入臻识道闸

thingsboard 和tb-gateway 是通过源码idea启动测试开发 为了测试这里只是买了臻识道闸的摄像机模组方便调试,然后添加一个开关量开关模拟雷达 道闸品牌 臻识C3R3C5R5变焦500万车牌识别相机高速追逃费相机华厦V86像机 淘宝地址 https://item.taobao.com/item.htm?_us1thkikq4…

气膜建筑:无硬件支撑的奇迹—轻空间

气膜建筑是一种创新的建筑形式&#xff0c;其独特之处在于其内部没有任何硬件支撑&#xff0c;仅靠空气吹起来。这种技术是如何实现的呢&#xff1f; 气膜结构的原理 气膜建筑的核心在于其充气结构。通过不断向气膜内部充入空气&#xff0c;气膜内部会维持一个较高的气压。这种…

最新微信发卡小程序 发卡网卡密系统流支持量主

2024.4更新 1.修复分类介绍报错 2.修改前端UI 3.增加插屏弹出广告 4.禁止PC端使用(PC端小程序没有广告) 免费下载&#xff1a;发卡小程序 卡密系统流支持量主 多种卡密领取模式【亲测】_麦田吧 前端演示地址&#xff1a;扫码查看 源码功能&#xff1a; 小程序系统/多种卡密领…

Excel单元格格式无法修改的原因与解决方法

Excel单元格格式无法更改可能由多种原因造成。以下是一些可能的原因及相应的解决方法&#xff1a; 单元格或工作表被保护&#xff1a; 如果单元格或工作表被设置为只读或保护状态&#xff0c;您将无法更改其中的格式。解决方法&#xff1a;取消单元格或工作表的保护。在Excel中…

LLC开关电源开发:第一节,LLC原理概述

第一节&#xff0c;LLC原理概述文章目录 一、LLC概述二、LLC电路拓扑1.电路拓扑2.电路工作原理3.电路原理分析 总结 一、LLC概述 LLC电路&#xff0c;是一种通过控制开关频率&#xff08;频率调节&#xff09;来实现输出电压恒定的谐振电路&#xff0c;它包括一个电感L、一个电…

001 仿muduo库实现高性能服务器组件_项目简介

​&#x1f308;个人主页&#xff1a;Fan_558 &#x1f525; 系列专栏&#xff1a;仿muduo &#x1f339;关注我&#x1f4aa;&#x1f3fb;带你学更多知识 文章目录 一、项目简介二、所需知识储备三、什么是muduo四、Reactor模式单Reactor单线程&#xff1a;单I/O多路复⽤业务…

C语言-02_变量与进制

文章目录 1.关键字2.标识符3.变量3.1 变量的声明与赋值3.2 变量的作用域3.3 变量按类型的分类 4.基本数据类型4.1 整数类型4.1.1 类型说明4.1.2 举例4.1.3 后缀4.1.4 整型的极限值 4.2 浮点类型4.2.1 类型说明4.2.2 举例 4.3 字符类型4.4 布尔类型 5.变量间的运算规则5.1 隐式类…