添加 spider 后台管理页面和接口

manager/src/main/java/cn/reghao/devops/manager/admin/PostController.java → manager/src/main/java/cn/reghao/devops/manager/admin/controller/PostController.java

@@ -1,4 +1,4 @@
-package cn.reghao.devops.manager.admin;
+package cn.reghao.devops.manager.admin.controller;
 
 import cn.reghao.devops.manager.util.db.PageSort;
 import cn.reghao.jutil.jdk.db.PageList;

manager/src/main/java/cn/reghao/devops/manager/admin/SiteController.java → manager/src/main/java/cn/reghao/devops/manager/admin/controller/SiteController.java

@@ -1,4 +1,4 @@
-package cn.reghao.devops.manager.admin;
+package cn.reghao.devops.manager.admin.controller;
 
 import cn.reghao.devops.manager.util.db.PageSort;
 import cn.reghao.jutil.jdk.db.PageList;

manager/src/main/java/cn/reghao/devops/manager/admin/controller/SpiderApiController.java

@@ -0,0 +1,45 @@
+package cn.reghao.devops.manager.admin.controller;
+
+import cn.reghao.devops.manager.util.db.PageSort;
+import cn.reghao.jutil.jdk.db.PageList;
+import io.swagger.annotations.Api;
+import lombok.extern.slf4j.Slf4j;
+import org.springframework.data.domain.Page;
+import org.springframework.data.domain.PageImpl;
+import org.springframework.data.domain.PageRequest;
+import org.springframework.stereotype.Controller;
+import org.springframework.ui.Model;
+import org.springframework.web.bind.annotation.GetMapping;
+import org.springframework.web.bind.annotation.RequestMapping;
+
+/**
+ * @author reghao
+ * @date 2023-11-04 14:31:54
+ */
+@Slf4j
+@Api(tags = "爬虫")
+@Controller
+@RequestMapping("/spider")
+public class SpiderApiController {
+    @GetMapping("/chart")
+    public String spiderChart(Model model) {
+        PageRequest pageRequest = PageSort.pageRequest();
+        PageList<?> pageList = PageList.empty();
+        Page<?> page = new PageImpl<>(pageList.getList(), pageRequest, pageList.getTotalSize());
+
+        model.addAttribute("page", page);
+        model.addAttribute("list", page.getContent());
+        return "/spider/chart";
+    }
+
+    @GetMapping("/url")
+    public String categoryPage(Model model) {
+        PageRequest pageRequest = PageSort.pageRequest();
+        PageList<?> pageList = PageList.empty();
+        Page<?> page = new PageImpl<>(pageList.getList(), pageRequest, pageList.getTotalSize());
+
+        model.addAttribute("page", page);
+        model.addAttribute("list", page.getContent());
+        return "/spider/index";
+    }
+}

manager/src/main/java/cn/reghao/devops/manager/admin/controller/SpiderController.java

@@ -0,0 +1,37 @@
+package cn.reghao.devops.manager.admin.controller;
+
+import cn.reghao.devops.manager.admin.model.ChartData;
+import cn.reghao.jutil.jdk.result.WebResult;
+import io.swagger.annotations.Api;
+import lombok.extern.slf4j.Slf4j;
+import org.springframework.http.MediaType;
+import org.springframework.web.bind.annotation.GetMapping;
+import org.springframework.web.bind.annotation.RequestMapping;
+import org.springframework.web.bind.annotation.RestController;
+
+import java.util.ArrayList;
+import java.util.List;
+
+/**
+ * @author reghao
+ * @date 2023-11-04 14:31:54
+ */
+@Slf4j
+@Api(tags = "爬虫")
+@RestController
+@RequestMapping("/api/spider")
+public class SpiderController {
+    @GetMapping(value = "/chart", produces = MediaType.APPLICATION_JSON_VALUE)
+    public String spiderChart() {
+        List<ChartData> list = new ArrayList<>();
+        List<Integer> data1 = List.of(2038, 120, 220, 214, 125, 117, 210);
+        ChartData chartData1 = new ChartData("npm", "line", data1);
+        list.add(chartData1);
+
+        List<Integer> data2 = List.of(135, 147, 150, 230, 224, 218, 2360);
+        ChartData chartData2 = new ChartData("dotnetCore", "line", data2);
+        list.add(chartData2);
+
+        return WebResult.success(list);
+    }
+}

manager/src/main/java/cn/reghao/devops/manager/admin/model/ChartData.java

@@ -0,0 +1,16 @@
+package cn.reghao.devops.manager.admin.model;
+
+import lombok.AllArgsConstructor;
+
+import java.util.List;
+
+/**
+ * @author reghao
+ * @date 2023-11-04 15:43:40
+ */
+@AllArgsConstructor
+public class ChartData {
+    private String name;
+    private String type;
+    private List<Integer> data;
+}

manager/src/main/resources/templates/spider/chart.html

@@ -0,0 +1,207 @@
+<!DOCTYPE html>
+<html xmlns:th="http://www.thymeleaf.org">
+<head th:replace="/common/template :: header(~{::title},~{::link},~{::style})">
+    <style>
+        a{
+            color: #005980;
+        }
+        .widget-small{
+            background-color: #FFFFFF;
+            overflow: hidden;
+            text-align: center;
+            border-radius: 2px;
+            box-shadow: 0 1px 2px 0 rgba(0,0,0,.05);
+        }
+        .widget-small .fa{
+            float: left;
+            width: 40%;
+            line-height: 80px;
+            color: #FFFFFF;
+        }
+        .widget-user .fa{
+            background-color: #029789;
+        }
+        .widget-visit .fa{
+            background-color: #17a2b8;
+        }
+        .widget-message .fa{
+            background-color: #fbad4c;
+        }
+        .widget-like .fa{
+            background-color: #ff646d;
+        }
+        .widget-small-info{
+            float: left;
+            text-align: left;
+            width: 40%;
+            margin-left: 20px;
+            margin-top: 18px;
+            line-height: 24px;
+        }
+        .widget-small-info h4{
+            font-size: 18px;
+        }
+        .widget-small-info span{
+            font-size: 16px;
+        }
+        .project-introduce{
+            min-height: 466px;
+        }
+        .project-introduce h4{
+            font-weight: bold;
+            margin-top: 12px;
+            margin-bottom: 8px;
+        }
+        .project-introduce li{
+            list-style: decimal;
+            margin-left: 28px;
+        }
+        .alert {
+            padding: 15px;
+            margin-bottom: 10px;
+            border: 1px solid transparent;
+            border-radius: 4px;
+        }
+        .alert-info {
+            color: #31708f;
+            background-color: #d9edf7;
+            border-color: #bce8f1;
+        }
+    </style>
+</head>
+
+<body class="timo-layout-page">
+<div class="layui-row layui-col-space15">
+    <div class="layui-col-md8">
+        <div class="layui-card">
+            <div class="layui-card-header">爬取统计</div>
+            <div id="chart1" class="layui-card-body" style="width: 800px;height:400px;"></div>
+        </div>
+        <div class="layui-card">
+            <div class="layui-card-header">解析统计</div>
+            <div id="chart2" class="layui-card-body" style="width: 800px;height:400px;"></div>
+        </div>
+    </div>
+    <div class="layui-col-md4">
+        <div class="layui-card">
+            <div class="layui-card-header">爬虫</div>
+            <div class="layui-card-body">
+                <div id="chart4" class="layui-card-body" style="width: 400px;height:400px;"></div>
+            </div>
+        </div>
+    </div>
+</div>
+
+<script th:src="@{/js/plugins/jquery-3.4.1.min.js}" charset="utf-8"></script>
+<script th:src="@{/lib/echarts-4.7.0/echarts.js}" charset="utf-8"></script>
+<script type="text/javascript" th:inline="javascript">
+    function chart1() {
+        //var chartZhu = echarts.init(document.getElementById('chart1'));
+        //指定图表配置项和数据
+        var option = {
+            xAxis: {
+                type: 'category',
+                data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
+            },
+            yAxis: {
+                type: 'value'
+            },
+            legend: {
+                data: ['npm', 'dotnetCore']
+            },
+            series: [
+                /*{
+                    name: 'npm',
+                    type: 'line',
+                    data: [120, 220, 214, 238, 125, 117, 210],
+                },
+                {
+                    name: 'dotnetCore',
+                    type: 'line',
+                    data: [150, 230, 224, 218, 135, 147, 260],
+                }*/
+            ]
+        };
+
+        //chartZhu.setOption(option, true);
+        $.get('/api/spider/chart', function(result){
+            if (result.code === 0) {
+                option.series = result.data
+                var chart1 = echarts.init(document.getElementById('chart1'));
+                chart1.setOption(option, true);
+            }
+        });
+    }
+    chart1()
+
+    function chart2() {
+        var chartZhu = echarts.init(document.getElementById('chart2'));
+        //指定图表配置项和数据
+        var option = {
+            xAxis: {
+                type: 'category',
+                data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
+            },
+            yAxis: {
+                type: 'value'
+            },
+            series: [
+                {
+                    data: [150, 230, 224, 218, 135, 147, 260],
+                    type: 'line'
+                }
+            ]
+        };
+        chartZhu.setOption(option, true);
+    }
+    chart2()
+
+    function chart4() {
+        var option1 = {
+            tooltip: {
+                trigger: 'item'
+            },
+            legend: {
+                top: '5%',
+                left: 'center'
+            },
+            series: [
+                {
+                    name: 'App Type',
+                    type: 'pie',
+                    radius: ['40%', '70%'],
+                    avoidLabelOverlap: false,
+                    itemStyle: {
+                        borderRadius: 10,
+                        borderColor: '#fff',
+                        borderWidth: 2
+                    },
+                    label: {
+                        show: false,
+                        position: 'center'
+                    },
+                    emphasis: {
+                        label: {
+                            show: true,
+                            fontSize: 40,
+                            fontWeight: 'bold'
+                        }
+                    },
+                    labelLine: {
+                        show: false
+                    },
+                    data: [
+                        { value: 7, name: 'DotNotCore' },
+                        { value: 3, name: 'NPM' }
+                    ]
+                }
+            ]
+        };
+
+        var chart1 = echarts.init(document.getElementById('chart4'));
+        chart1.setOption(option1, true);
+    }
+    chart4()
+</script>
+</body>
+</html>

manager/src/main/resources/templates/spider/index.html

@@ -0,0 +1,41 @@
+<!DOCTYPE html>
+<html xmlns:th="http://www.thymeleaf.org">
+<head th:replace="/common/template :: header(~{::title},~{::link},~{::style})"></head>
+
+<body class="timo-layout-page">
+<div class="layui-card">
+    <div class="layui-card-header timo-card-header">
+        <span><i class="fa fa-bars"></i> 数据统计</span>
+        <i class="layui-icon layui-icon-refresh refresh-btn"></i>
+    </div>
+    <div class="layui-card-body">
+        <div class="timo-table-wrap">
+            <table class="layui-table timo-table">
+                <thead>
+                <tr>
+                    <th data-field="userId">site</th>
+                    <th data-field="screenName">parser</th>
+                    <th data-field="gender">URL 总量</th>
+                    <th data-field="signature">已爬取 URL</th>
+                    <th data-field="following">待爬取 URL</th>
+                    <th data-field="follower">粉丝</th>
+                </tr>
+                </thead>
+                <tbody>
+                <tr th:each="item:${list}">
+                    <td th:text="${item.userId}"></td>
+                    <td th:text="${item.screenName}"></td>
+                    <td th:text="${item.gender}"></td>
+                    <td th:text="${item.signature}"></td>
+                    <td th:text="${item.following}"></td>
+                    <td th:text="${item.follower}"></td>
+                </tr>
+                </tbody>
+            </table>
+        </div>
+    </div>
+</div>
+
+<script th:replace="/common/template :: script"></script>
+</body>
+</html>