[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"article-public-iUdzrNPu":3,"public-project-articles-iUdzrNPu":17},{"id":4,"uuid":5,"project_id":6,"title":7,"content":8,"type":9,"status":10,"public_enabled":10,"views":11,"sort":12,"created_at":13,"updated_at":14,"project_title":15,"project_slug":16},1079,"iUdzrNPu",52,"16. 带你实现后台数据统计功能","## 商品的编辑出现 请求失败\n\n![](https:\u002F\u002Fcdn.nlark.com\u002Fyuque\u002F0\u002F2025\u002Fpng\u002F751015\u002F1764922600118-09807f81-f67b-4436-b1f5-83dc8b98da48.png)\n\n![](https:\u002F\u002Fcdn.nlark.com\u002Fyuque\u002F0\u002F2025\u002Fpng\u002F751015\u002F1764922629588-31193cac-c6e3-4ac0-85b3-1edb2219cadd.png)\n\n\n\n修改 GoodsService 的 update 方法\n\n```java\npublic void updateById(Goods goods) {\n    goodsMapper.updateById(goods);\n    if (\"下架\".equals(goods.getStatus())) {\n        \u002F\u002F 删除购物车的对应的商品\n        cartMapper.deleteByGoodsId(goods.getId());\n    }\n}\n```\n\n## Echarts 笔记\n\n[https:\u002F\u002Fwww.yuque.com\u002Fxiaqing-en2ii\u002Fskflxg\u002Fynkqw9ra0gufhdb7](https:\u002F\u002Fwww.yuque.com\u002Fxiaqing-en2ii\u002Fskflxg\u002Fynkqw9ra0gufhdb7)\n\n\n\n## 本节课前端代码 DataManager.vue\n\n```vue\n\u003Ctemplate>\n  \u003Cdiv>\n    \u003Cdiv style=\"display: flex; grid-gap: 10px\">\n      \u003Cdiv class=\"card\" style=\"padding: 20px; flex: 1; display: flex\">\n        \u003Cdiv style=\"flex: 1; font-size: 20px;\">销售总额\u003C\u002Fdiv>\n        \u003Cdiv style=\"flex: 1; font-size: 20px; font-weight: bold; color: red\">￥{{ data.count.total }}\u003C\u002Fdiv>\n      \u003C\u002Fdiv>\n      \u003Cdiv class=\"card\" style=\"padding: 20px; flex: 1; display: flex\">\n        \u003Cdiv style=\"flex: 1; font-size: 20px;\">今日销售额\u003C\u002Fdiv>\n        \u003Cdiv style=\"flex: 1; font-size: 20px; font-weight: bold; color: #ff8200\">￥{{ data.count.today }}\u003C\u002Fdiv>\n      \u003C\u002Fdiv>\n      \u003Cdiv class=\"card\" style=\"padding: 20px; flex: 1; display: flex\">\n        \u003Cdiv style=\"flex: 1; font-size: 20px;\">商品总数\u003C\u002Fdiv>\n        \u003Cdiv style=\"flex: 1; font-size: 20px; font-weight: bold; color: #00b0ef\">{{ data.count.goods }}\u003C\u002Fdiv>\n      \u003C\u002Fdiv>\n      \u003Cdiv class=\"card\" style=\"padding: 20px; flex: 1; display: flex\">\n        \u003Cdiv style=\"flex: 1; font-size: 20px;\">注册用户\u003C\u002Fdiv>\n        \u003Cdiv style=\"flex: 1; font-size: 20px; font-weight: bold; color: #9b3cfd\">{{ data.count.user }}\u003C\u002Fdiv>\n      \u003C\u002Fdiv>\n    \u003C\u002Fdiv>\n\n    \u003Cdiv style=\"margin-top: 10px; display: flex; grid-gap: 10px\">\n      \u003Cdiv id=\"line\" style=\"flex: 1; padding: 20px; height: 500px\" class=\"card\">\u003C\u002Fdiv>\n      \u003Cdiv id=\"pie\" style=\"flex: 1; padding: 20px; height: 500px\" class=\"card\">\u003C\u002Fdiv>\n    \u003C\u002Fdiv>\n\n  \u003C\u002Fdiv>\n\u003C\u002Ftemplate>\n\n\u003Cscript setup>\nimport { reactive, onMounted } from \"vue\";\nimport request from \"@\u002Futils\u002Frequest\";\nimport * as echarts from 'echarts'\n\nconst data = reactive({\n  count: {}\n})\n\nconst lineOption = {\n  title: {\n    text: '近一周订单销售的趋势图',\n    left: 'center'\n  },\n  tooltip: {\n    trigger: 'axis'\n  },\n  legend: {\n    left: 'left'\n  },\n  xAxis: {\n    name: '日期',\n    type: 'category',\n    data: []\n  },\n  yAxis: {\n    name: '销售额（元）',\n    type: 'value'\n  },\n  grid: {\n    top: '20%',\n    bottom:'10%'\n  },\n  series: [\n    {\n      data: [],\n      type: 'line',\n      smooth: true,\n      areaStyle: {\n        opacity: 0.8, \u002F\u002F 阴影的透明度\n        color: 'rgb(185,190,255)' \u002F\u002F 阴影的颜色和透明度\n      },\n      markPoint: {\n        data: [\n          { type: 'max', name: 'Max' },\n          { type: 'min', name: 'Min' }\n        ]\n      },\n      markLine: {\n        data: [{ type: 'average', name: 'Avg' }]\n      }\n    },\n  ]\n}\n\nconst pieOption = {\n  title: {\n    text: '分类商品销售额统计',\n    subtext: '比例图',\n    left: 'center'\n  },\n  tooltip: {\n    trigger: 'item',\n    formatter: '{a} \u003Cbr\u002F>{b} : {c}元 ({d}%)'\n  },\n  legend: {\n    top: 0,\n    orient: 'vertical',\n    left: 'left'\n  },\n  series: [\n    {\n      name: '销售额',\n      type: 'pie',\n      center: ['50%', '60%'],\n      radius: '50%',\n      data: [],\n      label: {\n        show: true,\n        formatter(param) {\n          return param.name + ' (' + param.percent + '%)';\n        }\n      },\n      emphasis: {\n        itemStyle: {\n          shadowBlur: 10,\n          shadowOffsetX: 0,\n          shadowColor: 'rgba(0, 0, 0, 0.5)'\n        }\n      }\n    }\n  ]\n}\n\nrequest.get('\u002Fcount').then(res => {\n  data.count = res.data\n})\n\n\u002F\u002F 等页面所有元素加载完成后再设置 echarts图表\nonMounted(() => {\n  \u002F\u002F 折线图\n  let lineDom = document.getElementById('line')\n  let lineChart = echarts.init(lineDom)\n  \u002F\u002F 请求数据  初始化图表\n  request.get('\u002FselectLine').then(res => {\n    lineOption.xAxis.data = res.data.date\n    lineOption.series[0].data = res.data.count\n    lineChart.setOption(lineOption)\n  })\n\n  \u002F\u002F 饼图\n  let pieDom = document.getElementById('pie')\n  let pieChart = echarts.init(pieDom)\n  \u002F\u002F 请求数据  初始化图表\n  request.get('\u002FselectPie').then(res => {\n    pieOption.series[0].data = res.data\n    pieChart.setOption(pieOption)\n  })\n})\n\u003C\u002Fscript>\n```\n\n## 后端代码 WebController\n\n```java\npackage com.example.controller;\n\nimport cn.hutool.core.date.DateField;\nimport cn.hutool.core.date.DateTime;\nimport cn.hutool.core.date.DateUtil;\nimport com.example.common.Result;\nimport com.example.entity.*;\nimport com.example.mapper.OrderDetailMapper;\nimport com.example.service.*;\nimport jakarta.annotation.Resource;\nimport org.springframework.web.bind.annotation.*;\n\nimport java.math.BigDecimal;\nimport java.util.*;\n\n\n@RestController\npublic class WebController {\n\n    @Resource\n    private AdminService adminService;\n    @Resource\n    private UserService userService;\n    @Resource\n    OrdersService ordersService;\n    @Resource\n    GoodsService goodsService;\n    @Resource\n    CategoryService categoryService;\n    @Resource\n    OrderDetailMapper orderDetailMapper;\n\n\n    \u002F**\n     * 默认请求接口\n     *\u002F\n    @GetMapping(\"\u002F\")\n    public Result hello() {\n        return Result.success();\n    }\n\n    \u002F**\n     * 登录\n     *\u002F\n    @PostMapping(\"\u002Flogin\")\n    public Result login(@RequestBody Account account) {\n        Account ac = null;\n        if (\"管理员\".equals(account.getRole())) {\n            ac = adminService.login(account);\n        }\n        if (\"普通用户\".equals(account.getRole())) {\n            ac = userService.login(account);\n        }\n        if (ac == null) {\n            return Result.error(\"登录失败，用户不存在\");\n        }\n        return Result.success(ac);\n    }\n\n    \u002F**\n     * 注册\n     *\u002F\n    @PostMapping(\"\u002Fregister\")\n    public Result register(@RequestBody User user) {\n        if (!user.getPassword().equals(user.getNewPassword())) {\n            return Result.error(\"两次输入密码不一致\");\n        }\n        userService.add(user);\n        return Result.success();\n    }\n\n    \u002F**\n     * 修改密码\n     *\u002F\n    @PutMapping(\"\u002FupdatePassword\")\n    public Result updatePassword(@RequestBody Account account) {\n        if (\"管理员\".equals(account.getRole())) {\n            adminService.updatePassword(account);\n        }\n        if (\"普通用户\".equals(account.getRole())) {\n            userService.updatePassword(account);\n        }\n        return Result.success();\n    }\n\n    \u002F\u002F 数据统计使用的接口\n    @GetMapping(\"\u002Fcount\")\n    public Result count() {\n        List\u003COrders> ordersList = ordersService.selectAll(null).stream().filter(orders -> !orders.getStatus().equals(\"已取消\")).toList();\n        BigDecimal total = ordersList.stream().map(Orders::getTotal).reduce(BigDecimal::add).orElse(BigDecimal.ZERO);\n        String todayDate = DateUtil.today();  \u002F\u002F 2025-12-05\n        BigDecimal today = ordersList.stream().filter(orders -> orders.getTime().contains(todayDate))\n                .map(Orders::getTotal).reduce(BigDecimal::add).orElse(BigDecimal.ZERO);\n        Integer goods = goodsService.selectAll(null).size();\n        Integer user = userService.selectByAll(null).size();\n        Map\u003CString, Object> map = new HashMap\u003C>();\n        map.put(\"total\", total);\n        map.put(\"today\", today);\n        map.put(\"goods\", goods);\n        map.put(\"user\", user);\n        return Result.success(map);\n    }\n\n    @GetMapping(\"\u002FselectLine\")\n    public Result selectLine() {\n        Date date = new Date();\n        DateTime start = DateUtil.offsetDay(date, -6);\n        List\u003CDateTime> dateTimes = DateUtil.rangeToList(start, date, DateField.DAY_OF_YEAR);\n        List\u003CString> dateStrList = dateTimes.stream().map(dateTime -> DateUtil.format(dateTime, \"MM-dd\")).sorted().toList();\n        List\u003COrders> ordersList = ordersService.selectAll(null).stream().filter(orders -> !orders.getStatus().equals(\"已取消\")).toList();\n        int year = DateUtil.year(date);\n        ArrayList\u003CBigDecimal> countList = new ArrayList\u003C>();\n        for (String day : dateStrList) {\n            \u002F\u002F 包含  年月日的  订单\n            BigDecimal total = ordersList.stream().filter(o -> o.getTime().contains(String.valueOf(year)) && o.getTime().contains(day))\n                    .map(Orders::getTotal).reduce(BigDecimal::add).orElse(BigDecimal.ZERO);\n            countList.add(total);\n        }\n        Map\u003CString, Object> map = new HashMap\u003C>();\n        map.put(\"date\", dateStrList);\n        map.put(\"count\", countList);\n        return Result.success(map);\n    }\n\n    @GetMapping(\"\u002FselectPie\")\n    public Result selectPie() {\n        List\u003CMap\u003CString, Object>> list = new ArrayList\u003C>();\n        List\u003CCategory> categoryList = categoryService.selectAll(null);\n        Map\u003CString, Object> map;\n        for (Category category : categoryList) {\n            map = new HashMap\u003C>();\n            map.put(\"name\", category.getName());\n            BigDecimal total = BigDecimal.ZERO;\n            List\u003COrderDetail> orderDetailList = orderDetailMapper.selectAll(null);\n            for (OrderDetail orderDetail : orderDetailList) {\n                Integer orderId = orderDetail.getOrderId();\n                Orders orders = ordersService.selectById(orderId);\n                if (!orders.getStatus().equals(\"已取消\")) {\n                    Integer goodsId = orderDetail.getGoodsId();\n                    Goods goods = goodsService.selectById(goodsId);\n                    if (goods.getCategoryId().equals(category.getId())) {\n                        total = total.add(orders.getTotal());\n                    }\n                }\n            }\n\n            map.put(\"value\", total);\n            if (total.compareTo(BigDecimal.ZERO) > 0) {\n                list.add(map);\n            }\n        }\n        return Result.success(list);\n    }\n\n}\n\n```\n\n","coding",1,2991,2107,"2025-12-05 17:37:57","2026-05-03 22:49:02","青哥带小白做毕设2026所有资料汇总","qingge-code-2026",{"project":18,"items":19},{"id":6,"title":15,"slug":16},[20,27,34,41,48,55,62,69,76,83,90,97,104,111,118,125,133,140],{"id":21,"uuid":22,"project_id":6,"title":23,"type":9,"status":10,"public_enabled":10,"views":24,"sort":25,"created_at":26,"updated_at":14,"project_title":15,"project_slug":16},993,"mgoFKmGT","00. 带小白做毕设课程介绍以及脚手架获取",32063,1966,"2026-03-29 19:37:39",{"id":28,"uuid":29,"project_id":6,"title":30,"type":9,"status":10,"public_enabled":10,"views":31,"sort":32,"created_at":33,"updated_at":14,"project_title":15,"project_slug":16},998,"1kCk1d2E","01. 导入并运行项目脚手架",14398,1974,"2025-11-11 16:24:50",{"id":35,"uuid":36,"project_id":6,"title":37,"type":9,"status":10,"public_enabled":10,"views":38,"sort":39,"created_at":40,"updated_at":14,"project_title":15,"project_slug":16},1003,"8ZlQ12IX","02. 带你开发一个基础的用户管理模块（上）",12150,1987,"2025-11-12 16:53:01",{"id":42,"uuid":43,"project_id":6,"title":44,"type":9,"status":10,"public_enabled":10,"views":45,"sort":46,"created_at":47,"updated_at":14,"project_title":15,"project_slug":16},1006,"6mmUNf9i","03. 带你开发一个基础的用户管理模块（下）",7782,1994,"2025-11-13 16:48:27",{"id":49,"uuid":50,"project_id":6,"title":51,"type":9,"status":10,"public_enabled":10,"views":52,"sort":53,"created_at":54,"updated_at":14,"project_title":15,"project_slug":16},1011,"3XNG04wA","04. 带你开发用户登录、注册、个人信息、修改密码功能",6474,2003,"2025-11-17 17:03:58",{"id":56,"uuid":57,"project_id":6,"title":58,"type":9,"status":10,"public_enabled":10,"views":59,"sort":60,"created_at":61,"updated_at":14,"project_title":15,"project_slug":16},1017,"LnAAYydZ","05. 带你开发商品分类管理功能",5467,2012,"2025-11-24 17:30:23",{"id":63,"uuid":64,"project_id":6,"title":65,"type":9,"status":10,"public_enabled":10,"views":66,"sort":67,"created_at":68,"updated_at":14,"project_title":15,"project_slug":16},1018,"584qohhy","06. 开发商品信息管理功能",4836,2013,"2025-11-24 17:30:12",{"id":70,"uuid":71,"project_id":6,"title":72,"type":9,"status":10,"public_enabled":10,"views":73,"sort":74,"created_at":75,"updated_at":14,"project_title":15,"project_slug":16},1024,"scxsifCZ","07. 开发轮播图信息管理功能",3313,2021,"2025-11-24 17:29:58",{"id":77,"uuid":78,"project_id":6,"title":79,"type":9,"status":10,"public_enabled":10,"views":80,"sort":81,"created_at":82,"updated_at":14,"project_title":15,"project_slug":16},1041,"AjujV8Gq","08. 带你实现前台首页功能",4058,2039,"2025-11-24 17:31:31",{"id":84,"uuid":85,"project_id":6,"title":86,"type":9,"status":10,"public_enabled":10,"views":87,"sort":88,"created_at":89,"updated_at":14,"project_title":15,"project_slug":16},1045,"p6yD8ZxS","09. 带你实现商品搜索、商品分类检索功能",3005,2048,"2025-11-25 16:35:45",{"id":91,"uuid":92,"project_id":6,"title":93,"type":9,"status":10,"public_enabled":10,"views":94,"sort":95,"created_at":96,"updated_at":14,"project_title":15,"project_slug":16},1050,"7gHUek7z","10. 带你实现商品详情页功能",2622,2053,"2025-11-26 17:22:20",{"id":98,"uuid":99,"project_id":6,"title":100,"type":9,"status":10,"public_enabled":10,"views":101,"sort":102,"created_at":103,"updated_at":14,"project_title":15,"project_slug":16},1059,"aX7rviTw","11. 带你实现商品收藏功能",2667,2067,"2025-11-28 17:00:21",{"id":105,"uuid":106,"project_id":6,"title":107,"type":9,"status":10,"public_enabled":10,"views":108,"sort":109,"created_at":110,"updated_at":14,"project_title":15,"project_slug":16},1060,"xcmGXr9E","12. 带你开发用户模拟充值功能",2443,2068,"2026-02-02 14:24:37",{"id":112,"uuid":113,"project_id":6,"title":114,"type":9,"status":10,"public_enabled":10,"views":115,"sort":116,"created_at":117,"updated_at":14,"project_title":15,"project_slug":16},1065,"z8IN0tX8","13. 带你实现购物车功能",2461,2078,"2025-12-01 17:16:05",{"id":119,"uuid":120,"project_id":6,"title":121,"type":9,"status":10,"public_enabled":10,"views":122,"sort":123,"created_at":124,"updated_at":14,"project_title":15,"project_slug":16},1069,"NfBIfhVx","14. 带你实现商品下单功能",3131,2086,"2025-12-02 16:57:21",{"id":126,"uuid":127,"project_id":6,"title":128,"type":9,"status":10,"public_enabled":10,"views":129,"sort":130,"created_at":131,"updated_at":132,"project_title":15,"project_slug":16},1072,"PDQdczrn","14.1 带你实现订单配送功能",2772,2097,"2025-12-03 16:10:40","2026-05-07 15:36:12.649662+00",{"id":134,"uuid":135,"project_id":6,"title":136,"type":9,"status":10,"public_enabled":10,"views":137,"sort":138,"created_at":139,"updated_at":14,"project_title":15,"project_slug":16},1075,"RYH15Bfu","15. 带你实现订单评价功能",2507,2103,"2025-12-04 17:10:47",{"id":4,"uuid":5,"project_id":6,"title":7,"type":9,"status":10,"public_enabled":10,"views":11,"sort":12,"created_at":13,"updated_at":14,"project_title":15,"project_slug":16}]