init

.gitignore

@@ -1,18 +1,33 @@
-# Build and Release Folders
+HELP.md
-bin-debug/
+target/
-bin-release/
+!.mvn/wrapper/maven-wrapper.jar
-[Oo]bj/
+!**/src/main/**/target/
-[Bb]in/
+!**/src/test/**/target/
 
-# Other files and folders
+### STS ###
-.settings/
+.apt_generated
+.classpath
+.factorypath
+.project
+.settings
+.springBeans
+.sts4-cache
 
-# Executables
+### IntelliJ IDEA ###
-*.swf
+.idea
-*.air
+*.iws
-*.ipa
+*.iml
-*.apk
+*.ipr
 
-# Project files, i.e. `.project`, `.actionScriptProperties` and `.flexProperties`
+### NetBeans ###
-# should NOT be excluded as they contain compiler settings and other important
+/nbproject/private/
-# information for Eclipse / Flash Builder.
+/nbbuild/
+/dist/
+/nbdist/
+/.nb-gradle/
+build/
+!**/src/main/**/build/
+!**/src/test/**/build/
+
+### VS Code ###
+.vscode/

.mvn/wrapper/MavenWrapperDownloader.java

@@ -0,0 +1,118 @@
+/*
+ * Copyright 2007-present the original author or authors.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      https://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import java.net.*;
+import java.io.*;
+import java.nio.channels.*;
+import java.util.Properties;
+
+public class MavenWrapperDownloader {
+
+    private static final String WRAPPER_VERSION = "0.5.6";
+    /**
+     * Default URL to download the maven-wrapper.jar from, if no 'downloadUrl' is provided.
+     */
+    private static final String DEFAULT_DOWNLOAD_URL = "https://repo.maven.apache.org/maven2/io/takari/maven-wrapper/"
+            + WRAPPER_VERSION + "/maven-wrapper-" + WRAPPER_VERSION + ".jar";
+
+    /**
+     * Path to the maven-wrapper.properties file, which might contain a downloadUrl property to
+     * use instead of the default one.
+     */
+    private static final String MAVEN_WRAPPER_PROPERTIES_PATH =
+            ".mvn/wrapper/maven-wrapper.properties";
+
+    /**
+     * Path where the maven-wrapper.jar will be saved to.
+     */
+    private static final String MAVEN_WRAPPER_JAR_PATH =
+            ".mvn/wrapper/maven-wrapper.jar";
+
+    /**
+     * Name of the property which should be used to override the default download url for the wrapper.
+     */
+    private static final String PROPERTY_NAME_WRAPPER_URL = "wrapperUrl";
+
+    public static void main(String args[]) {
+        System.out.println("- Downloader started");
+        File baseDirectory = new File(args[0]);
+        System.out.println("- Using base directory: " + baseDirectory.getAbsolutePath());
+
+        // If the maven-wrapper.properties exists, read it and check if it contains a custom
+        // wrapperUrl parameter.
+        File mavenWrapperPropertyFile = new File(baseDirectory, MAVEN_WRAPPER_PROPERTIES_PATH);
+        String url = DEFAULT_DOWNLOAD_URL;
+        if (mavenWrapperPropertyFile.exists()) {
+            FileInputStream mavenWrapperPropertyFileInputStream = null;
+            try {
+                mavenWrapperPropertyFileInputStream = new FileInputStream(mavenWrapperPropertyFile);
+                Properties mavenWrapperProperties = new Properties();
+                mavenWrapperProperties.load(mavenWrapperPropertyFileInputStream);
+                url = mavenWrapperProperties.getProperty(PROPERTY_NAME_WRAPPER_URL, url);
+            } catch (IOException e) {
+                System.out.println("- ERROR loading '" + MAVEN_WRAPPER_PROPERTIES_PATH + "'");
+            } finally {
+                try {
+                    if (mavenWrapperPropertyFileInputStream != null) {
+                        mavenWrapperPropertyFileInputStream.close();
+                    }
+                } catch (IOException e) {
+                    // Ignore ...
+                }
+            }
+        }
+        System.out.println("- Downloading from: " + url);
+
+        File outputFile = new File(baseDirectory.getAbsolutePath(), MAVEN_WRAPPER_JAR_PATH);
+        if (!outputFile.getParentFile().exists()) {
+            if (!outputFile.getParentFile().mkdirs()) {
+                System.out.println(
+                        "- ERROR creating output directory '" + outputFile.getParentFile().getAbsolutePath() + "'");
+            }
+        }
+        System.out.println("- Downloading to: " + outputFile.getAbsolutePath());
+        try {
+            downloadFileFromURL(url, outputFile);
+            System.out.println("Done");
+            System.exit(0);
+        } catch (Throwable e) {
+            System.out.println("- Error downloading");
+            e.printStackTrace();
+            System.exit(1);
+        }
+    }
+
+    private static void downloadFileFromURL(String urlString, File destination) throws Exception {
+        if (System.getenv("MVNW_USERNAME") != null && System.getenv("MVNW_PASSWORD") != null) {
+            String username = System.getenv("MVNW_USERNAME");
+            char[] password = System.getenv("MVNW_PASSWORD").toCharArray();
+            Authenticator.setDefault(new Authenticator() {
+                @Override
+                protected PasswordAuthentication getPasswordAuthentication() {
+                    return new PasswordAuthentication(username, password);
+                }
+            });
+        }
+        URL website = new URL(urlString);
+        ReadableByteChannel rbc;
+        rbc = Channels.newChannel(website.openStream());
+        FileOutputStream fos = new FileOutputStream(destination);
+        fos.getChannel().transferFrom(rbc, 0, Long.MAX_VALUE);
+        fos.close();
+        rbc.close();
+    }
+
+}

.mvn/wrapper/maven-wrapper.properties

@@ -0,0 +1,2 @@
+distributionUrl=https://repo.maven.apache.org/maven2/org/apache/maven/apache-maven/3.6.3/apache-maven-3.6.3-bin.zip
+wrapperUrl=https://repo.maven.apache.org/maven2/io/takari/maven-wrapper/0.5.6/maven-wrapper-0.5.6.jar

Web/css/Chart.min.css

@@ -0,0 +1 @@
+@keyframes chartjs-render-animation{from{opacity:.99}to{opacity:1}}.chartjs-render-monitor{animation:chartjs-render-animation 1ms}.chartjs-size-monitor,.chartjs-size-monitor-expand,.chartjs-size-monitor-shrink{position:absolute;direction:ltr;left:0;top:0;right:0;bottom:0;overflow:hidden;pointer-events:none;visibility:hidden;z-index:-1}.chartjs-size-monitor-expand>div{position:absolute;width:1000000px;height:1000000px;left:0;top:0}.chartjs-size-monitor-shrink>div{position:absolute;width:200%;height:200%;left:0;top:0}

Web/html/_old_header.html

@@ -0,0 +1,81 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta name="referrer" content="no-referrer" />
+    <meta charset="UTF-8">
+    <title>DD监视器</title>
+</head>
+
+<body>
+    <div class="layui-header">
+        <ul class="layui-nav" lay-filter="" style="background-color: #1772B4;">
+            <li class="layui-nav-item">DD监视器</li>
+            <div id="admin" style="display: inline-block; font-size: 0px;">
+                <li class="layui-nav-item"><a href="/html/body/bilibili/upInfo.html">UP管理</a>
+
+                </li>
+            </div>
+            <li class="layui-nav-item">
+                <a href="/html/body/bilibili/realTimeData.html">实时数据</a>
+            </li>
+            <li class="layui-nav-item">
+                <a href="/html/body/bilibili/overview.html">数据统计</a>
+            </li>
+            <li class="layui-nav-item" id='icon'>
+                <a href="javascript:;" id="login"><img src="https://static.hdslb.com/images/akari.jpg" class="layui-nav-img" id="icon_img"><span
+                        id='login_text'>登录</span></a>
+                <dl class="layui-nav-child">
+                    <dd><a href="javascript:;" id="logout">退了</a></dd>
+                </dl>
+            </li>
+        </ul>
+    </div>
+</body>
+<script src="/js/qrcode.min.js"></script>
+<script>
+    let loginStatus = false;
+    $.post('/user/get/test.do',function (json) {
+        $('#login_text').text(json.data.uname);
+        $('#icon_img').attr("src",json.data.icon);
+        loginStatus=true;
+
+    })
+    $('#login').click(function () {
+        if (loginStatus) {
+            return;
+        }
+        $.post('/login/login.do',function (json) {
+            console.log(json)
+            layer.open({
+                title: "BiliBili客户端扫描登陆",
+                content: "<div id=\"qrcode\"></div>",
+                success: function () {
+                    new QRCode(document.getElementById("qrcode"), json.url);
+                },
+                yes: function (index) {
+                    layer.close(index)
+                    window.location.reload();
+                }
+
+            })
+        })
+    })
+    $(document).ready(function () {
+        let mobile = layui.device().mobile;
+        if (mobile) {
+            $('.layui-body').css('left', '0')
+            $('.layui-body').css('top', '150px')
+            $('.layui-body').css('height', '200%')
+            $('#icon').css('float', 'none')
+
+
+        } else {
+            $('.layui-body').css('padding-right', '100px')
+            $('#icon').css('float', 'right')
+        }
+    })
+</script>
+<style>
+</style>
+</html>

Web/html/body/bilibili/overview.html

@@ -0,0 +1,326 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <title>数据统计</title>
+    <link rel="stylesheet" href="/layui/css/layui.css">
+    <link rel="stylesheet" href="/css/Chart.min.css">
+</head>
+<body>
+<div class="layui-layout layui-layout-admin">
+    <div id="header"></div>
+    <div class="layui-body" style="left: 0px;position: relative;z-index: 0">
+        <div style="width: 50%;margin-left: 25%; margin-top: 2%;">
+            <blockquote class="layui-elem-quote">
+                人气与观众访问数为每小时采集一次，礼物等信息为实时统计
+                <div id="temp"></div>
+            </blockquote>
+        </div>
+        <div style="width: 80%;margin-left: 10%; margin-top: 2%;">
+            <div class="layui-tab layui-tab-card" lay-filter="upInfo" lay-allowClose="false">
+                <ul class="layui-tab-title">
+                </ul>
+                <div class="layui-tab-content">
+
+                    <div style="padding: 20px; background-color: #F2F2F2;">
+                        <div class="layui-row layui-col-space15">
+                            <div class="layui-col-md4"> <!-- 注意：这一层元素并不是必须的 -->
+                                <input type="text" class="layui-input" id="timer">
+                            </div>
+                            <div class="layui-col-md4">
+                                <button type="button" class="layui-btn" id="query">查询</button>
+                                <button type="button" class="layui-btn layui-btn-warm" id="download">下载</button>
+                            </div>
+
+                        </div>
+                        <div class="layui-row layui-col-space15">
+                            <div class="layui-col-md4">
+                                <div class="layui-card" style="width: 100%;">
+                                    <div class="layui-card-header">礼物总数</div>
+                                    <div class="layui-card-body" id="giftMax">
+                                        0
+                                    </div>
+                                </div>
+                            </div>
+
+                            <div class="layui-col-md4">
+                                <div class="layui-card" style="width: 100%;">
+                                    <div class="layui-card-header">送礼人数</div>
+                                    <div class="layui-card-body" id="giftUser">
+                                        0
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="layui-col-md4">
+                                <div class="layui-card" style="width: 100%;">
+                                    <div class="layui-card-header">收益总数(金瓜子)</div>
+                                    <div class="layui-card-body" id="priceMax">
+                                        0
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="layui-col-md1"></div>
+                            <div class="layui-col-md5">
+                                <div class="layui-card" style="width: 100%;">
+                                <div class="layui-card-header">时均收益礼物</div>
+                                <div class="layui-card-body" id="priceOfH">
+                                    0
+                                </div>
+                                </div>
+                            </div>
+                            <div class="layui-col-md5">
+                                <div class="layui-card" style="width: 100%;">
+                                <div class="layui-card-header">人均送礼物数</div>
+                                <div class="layui-card-body" id="priceUser">
+                                    0
+                                </div>
+                                </div>
+                            </div>
+                            <div class="layui-col-md-offset2"></div>
+                            <div class="layui-col-md6">
+                                <div class="layui-card" style="width: 100%;height: 400px">
+                                    <div class="layui-card-header">人气值</div>
+                                    <div class="layui-card-body" id="popular">
+                                        <canvas style="color: #FD482C" id="popularChart" width="600" height="300"></canvas>
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="layui-col-md6">
+                                <div class="layui-card" style="width: 100%;height: 400px">
+                                    <div class="layui-card-header">访问数</div>
+                                    <div class="layui-card-body" id="user">
+                                        <canvas id="userChart" width="600" height="300"></canvas>
+                                    </div>
+                                </div>
+                            </div>
+
+                            <div class="layui-col-md-offset2"></div>
+                            <div class="layui-col-md6">
+                                <div class="layui-card" style="width: 100%;height: 400px">
+                                    <div class="layui-card-header">收益(金瓜子)</div>
+                                    <div class="layui-card-body">
+                                        <canvas id="toDayPrice" width="600" height="300"></canvas>
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="layui-col-md6">
+                                <div class="layui-card" style="width: 100%;height: 400px">
+                                    <div class="layui-card-header">礼物 (含免费)</div>
+                                    <div class="layui-card-body">
+                                        <canvas id="toDayGift" width="600" height="300"></canvas>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+
+
+        </div>
+      <div style="height: 150px"></div>
+    </div>
+
+    <div id="footer" style="z-index: 99;position: relative"></div>
+</div>
+<script src="/layui/layui.js"></script>
+<script src="/js/jquery-3.2.1.js"></script>
+<script src="/js/Chart.min.js"></script>
+<script src="/js/Chart.bundle.min.js"></script>
+<script>
+    $('#header').load("/html/header.html");
+    $('#footer').load("/html/footer.html");
+    layui.use(['layer', 'form', 'element', 'table','laydate'], function () {
+        let layer = layui.layer
+            , form = layui.form
+            , table = layui.table
+            , element = layui.element;
+        let laydate = layui.laydate;
+        let giftChart,priceChart,userChart,popularChart;
+
+        laydate.render({
+            elem: '#timer' //指定元素
+            ,type:'datetime'
+            ,range:true
+            ,value:new Date().toLocaleDateString().replaceAll("/",'-')+' 00:00:00 - '+new Date().toLocaleDateString().replaceAll("/",'-')+" 23:59:59"
+            ,isInitValue: true //是否允许填充初始值，默认为 true
+        });
+        $('#query').click(function () {
+            showData(roomId);
+        })
+        $('#download').click(function () {
+            let index=layer.load();
+            $.post("/overview/get/down.do",{
+                "roomid": roomId,
+                "startTime":new Date($('#timer').val().split(" - ")[0]),
+                "endTime":new Date($('#timer').val().split(" - ")[1]),
+            },function (json) {
+                if(json.code!==undefined){
+                    if(json.code===0){
+                        let url='/overview/get/download.do?fname='+json.data;
+                        download(url,index)
+                    }else{
+                        layer.msg(json.msg);
+                    }
+                }
+
+            })
+        })
+        $.post("/upinfo/get/list.do", function (json) {
+            let id=0;
+            if (json.code === 0) {
+                for (let i in json.data) {
+                    if(id===0){
+                        id=json.data[i].roomid;
+                    }
+                    element.tabAdd('upInfo', {
+                        title: json.data[i].name
+                        , id: json.data[i].roomid
+                    })
+                }
+
+            }
+            element.tabChange('upInfo', id);
+            form.render()
+        })
+        let roomId;
+        element.on('tab(upInfo)', function (data) {
+
+            roomId=this.getAttribute('lay-id');
+
+            setTimeout(function () {
+                showData(roomId);
+            },100)
+
+        })
+        function download(url,index){
+            $.post(url,function (data) {
+                if (data === undefined || data.length == 0) {
+                    setTimeout(function () {
+                        download(url,index)
+                    }, 1000)
+                } else {
+                    window.open(url)
+                    layer.close(index)
+                }
+            })
+        }
+        function showData(roomId){
+            if(giftChart!=null){
+                giftChart.destroy();
+            }
+            if(priceChart!=null){
+                priceChart.destroy()
+            }
+            if(popularChart!=null){
+                popularChart.destroy()
+            }
+            if(userChart!=null){
+                userChart.destroy()
+            }
+            let index = layer.load();
+            $.post("/realTimeData/get/query.do", {
+                "roomid": roomId,
+                "startTime":new Date($('#timer').val().split(" - ")[0]),
+                "endTime":new Date($('#timer').val().split(" - ")[1]),
+            }, function (json) {
+                console.log(json)
+                if (json.code !== 0) {
+                 //   $('#popular').text(0);
+                 //   $('#user').text(0);
+                    $('#price').text(0);
+                    layer.close(index)
+                    return;
+                }
+                let gifts = json.data.gift;
+                let prices = json.data.price;
+                let priceSize = 0;
+                let picTime = [];
+                let pic = []
+                let gift = []
+                let giftSize = []
+                for (let i in prices) {
+                    priceSize += prices[i].price;
+                    pic[i] = prices[i].price;
+                    picTime[i] = prices[i].time
+                }
+                for (let i in gifts) {
+                    gift[i] = gifts[i].giftName;
+                    giftSize[i] = gifts[i].size;
+                }
+                //$('#popular').text(json.data.popular);
+                //$('#user').text(json.data.vipLength + json.data.userLength);
+                //$('#price').text(priceSize);
+                priceChart= dataInit('toDayPrice', '金瓜子', 'line', picTime, pic)
+                giftChart=dataInit('toDayGift', '礼物', 'bar', gift, giftSize)
+            })
+            $.post("/overview/get/query.do",{
+                "roomid": roomId,
+                "startTime":new Date($('#timer').val().split(" - ")[0]),
+                "endTime":new Date($('#timer').val().split(" - ")[1]),
+            },function (json) {
+                console.log(json)
+                if(json.code!==0){
+                    layer.close(index);
+                    return;
+                }
+                let popular=[]
+                let user=[];
+                let time=[]
+                let map=json.data.map;
+                for(let i in map){
+                    time[i]=map[i].time;
+                    popular[i]=map[i].popular;
+                    user[i]=map[i].user;
+                }
+                $('#giftMax').text(json.data.giftCount)
+                $('#giftUser').text(json.data.giftUserCount)
+                $('#priceMax').text(json.data.price+" *叔叔抽成后:"+(json.data.price/2)+"(￥"+((json.data.price/2))/1000+")")
+                $('#priceOfH').text(json.data.hprice)
+                $('#priceUser').text((json.data.giftCount/json.data.giftUserCount))
+
+                popularChart= dataInit('popularChart', '人气值', 'line', time, popular)
+                userChart= dataInit('userChart', '访问数', 'line', time, user)
+                layer.close(index);
+            })
+        }
+        function dataInit(elemId, label, type, title, data) {
+            var ctx = document.getElementById(elemId).getContext('2d');
+            var myChart = new Chart(ctx, {
+                type: type,
+                data: {
+                    labels: title,
+                    datasets: [{
+                        label: label,
+                        data: data,
+                        backgroundColor: [
+
+                            'rgba(255, 159, 64, 0.2)'
+                        ],
+                        borderColor: [
+
+                            'rgba(255, 159, 64, 1)'
+                        ],
+                        borderWidth: 1
+                    }]
+                },
+                options: {
+                    scales: {
+                        yAxes: [{
+                            ticks: {
+                                beginAtZero: true
+                            }
+                        }]
+                    },
+                    tooltips: {
+                        intersect: false,
+                    }
+                }
+            });
+            return myChart;
+        }
+    });
+</script>
+</body>
+
+</html>

Web/html/body/bilibili/realTimeData.html

@@ -0,0 +1,192 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <title>实时数据</title>
+    <link rel="stylesheet" href="/layui/css/layui.css">
+    <link rel="stylesheet" href="/css/Chart.min.css">
+</head>
+<body>
+<div class="layui-layout layui-layout-admin">
+    <div id="header"></div>
+    <div class="layui-body" style="left: 0px;">
+        <div style="width: 50%;margin-left: 25%; margin-top: 2%;">
+            <blockquote class="layui-elem-quote">
+                选择选项卡可查看数据
+                <div id="temp"></div>
+            </blockquote>
+        </div>
+        <div style="width: 80%;margin-left: 10%; margin-top: 2%;">
+            <div class="layui-tab layui-tab-card" lay-filter="upInfo" lay-allowClose="false">
+                <ul class="layui-tab-title">
+                </ul>
+                <div class="layui-tab-content">
+                    <div style="padding: 20px; background-color: #F2F2F2;">
+                        <div class="layui-row layui-col-space15">
+                            <div class="layui-col-md4">
+                                <div class="layui-card" style="width: 100%;">
+                                    <div class="layui-card-header">当前人气值</div>
+                                    <div class="layui-card-body" id="popular">
+                                        0
+                                    </div>
+                                </div>
+                            </div>
+
+                            <div class="layui-col-md4">
+                                <div class="layui-card" style="width: 100%;">
+                                    <div class="layui-card-header">今日累计访问数</div>
+                                    <div class="layui-card-body" id="user">
+                                        0
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="layui-col-md4">
+                                <div class="layui-card" style="width: 100%;">
+                                    <div class="layui-card-header">今日累计收益(金瓜子)</div>
+                                    <div class="layui-card-body" id="price">
+                                        0
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="layui-col-md-offset2"></div>
+                            <div class="layui-col-md6">
+                                <div class="layui-card" style="width: 100%;height: 400px">
+                                    <div class="layui-card-header">今日收益(金瓜子)</div>
+                                    <div class="layui-card-body">
+                                        <canvas id="toDayPrice" width="600" height="300"></canvas>
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="layui-col-md6">
+                                <div class="layui-card" style="width: 100%;height: 400px">
+                                    <div class="layui-card-header">今日礼物 (含免费)</div>
+                                    <div class="layui-card-body">
+                                        <canvas id="toDayGift" width="600" height="300"></canvas>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+
+
+        </div>
+    </div>
+    <div id="footer"></div>
+</div>
+<script src="/layui/layui.js"></script>
+<script src="/js/jquery-3.2.1.js"></script>
+<script src="/js/Chart.min.js"></script>
+<script src="/js/Chart.bundle.min.js"></script>
+<script>
+    $('#header').load("/html/header.html");
+    $('#footer').load("/html/footer.html");
+    layui.use(['layer', 'form', 'element', 'table'], function () {
+        let layer = layui.layer
+            , form = layui.form
+            , table = layui.table
+            , element = layui.element;
+        let giftChart,priceChart;
+
+        $.post("/upinfo/get/list.do", function (json) {
+            let id=0;
+            if (json.code === 0) {
+                for (let i in json.data) {
+                    if(id===0){
+                        id=json.data[i].roomid;
+                    }
+                    element.tabAdd('upInfo', {
+                        title: json.data[i].name
+                        , id: json.data[i].roomid
+                    })
+                }
+
+            }
+            element.tabChange('upInfo', id);
+            form.render()
+        })
+        element.on('tab(upInfo)', function (data) {
+            let index = layer.load();
+            if(giftChart!=null){
+                giftChart.destroy();
+            }
+            if(priceChart!=null){
+                priceChart.destroy()
+            }
+            $.post("/realTimeData/get/query.do", {"roomid": this.getAttribute('lay-id')}, function (json) {
+                console.log(json)
+                if (json.code !== 0) {
+                    $('#popular').text(0);
+                    $('#user').text(0);
+                    $('#price').text(0);
+                    layer.close(index);
+                    return;
+                }
+                let gifts = json.data.gift;
+                let prices = json.data.price;
+                let priceSize = 0;
+                let picTime = [];
+                let pic = []
+                let gift = []
+                let giftSize = []
+                for (let i in prices) {
+                    priceSize += prices[i].price;
+                    pic[i] = prices[i].price;
+                    picTime[i] = prices[i].time
+                }
+                for (let i in gifts) {
+                    gift[i] = gifts[i].giftName;
+                    giftSize[i] = gifts[i].size;
+                }
+                let text=(json.data.vipLength + json.data.userLength)+"。 普通用户:"+json.data.userLength+"、  舰长:"+json.data.vipLength
+                $('#popular').text(json.data.popular);
+                $('#user').text(text);
+                $('#price').text(priceSize+" *叔叔抽成后:"+(priceSize/2)+"(￥"+((priceSize/2))/1000+")");
+                priceChart= dataInit('toDayPrice', '金瓜子', 'line', picTime, pic)
+                giftChart=dataInit('toDayGift', '礼物', 'bar', gift, giftSize)
+                layer.close(index);
+            })
+        })
+
+
+        function dataInit(elemId, label, type, title, data) {
+            var ctx = document.getElementById(elemId).getContext('2d');
+            var myChart = new Chart(ctx, {
+                type: type,
+                data: {
+                    labels: title,
+                    datasets: [{
+                        label: label,
+                        data: data,
+                        backgroundColor: [
+
+                            'rgba(255, 159, 64, 0.2)'
+                        ],
+                        borderColor: [
+
+                            'rgba(255, 159, 64, 1)'
+                        ],
+                        borderWidth: 1
+                    }]
+                },
+                options: {
+                    scales: {
+                        yAxes: [{
+                            ticks: {
+                                beginAtZero: true
+                            }
+                        }]
+                    },
+                    tooltips: {
+                        intersect: false,
+                    }
+                }
+            });
+            return myChart;
+        }
+    });
+</script>
+</body>
+
+</html>

Web/html/body/bilibili/upInfo.html

@@ -0,0 +1,401 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <title>UP主管理</title>
+    <link rel="stylesheet" href="/layui/css/layui.css">
+</head>
+<body>
+<div class="layui-layout layui-layout-admin">
+    <div id="header"></div>
+    <div class="layui-body" style="left: 0px;">
+        <div style="width: 50%;margin-left: 25%; margin-top: 2%;">
+            <blockquote class="layui-elem-quote">
+                在这里添加需要监控的UP主，添加请填入直播地址或房间号
+                <div id="temp"></div>
+            </blockquote>
+        </div>
+        <div style="width: 80%;margin-left: 10%; margin-top: 2%;">
+            <form class="layui-form" action="" lay-filter="myForm">
+
+                <div class="layui-tab layui-tab-card" lay-filter="type" lay-allowclose="true">
+                    <ul class="layui-tab-title">
+                    </ul>
+                    <div class="layui-tab-content">
+                    </div>
+                </div>
+            </form>
+        </div>
+    </div>
+    <div id="footer"></div>
+</div>
+<script src="/layui/layui.js"></script>
+<script src="/js/jquery-3.2.1.js"></script>
+<script type="text/html" id="topTools">
+    <a class="layui-btn layui-btn-xs" lay-event="addAddress">新增</a>
+    <scan id="online">当前正在直播:0</scan>
+</script>
+<script type="text/html" id="listTools">
+    <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
+    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
+</script>
+<script type="text/html" id="upInfoCheckToOfflineListening">
+    {{# if(d.offlinelistening==1){}}
+    <div><input name="offlineListeningCheckbox" lay-filter="offlineListeningCheckbox" type="checkbox" lay-skin="switch"
+                lay-text="开启|关闭" value="{{d.roomid}}" checked></div>
+    {{# } else { }}
+    <div><input name="offlineListeningCheckbox" lay-filter="offlineListeningCheckbox" type="checkbox" lay-skin="switch"
+                lay-text="开启|关闭" value="{{d.roomid}}"></div>
+    {{# }}}
+</script>
+<script type="text/html" id="upInfoCheckToEnable">
+    {{# if(d.enable==1){}}
+    <div><input name="enableCheckbox{{d.roomid}}" lay-filter="enableCheckbox" type="checkbox" lay-skin="switch"
+                lay-text="启用|关闭"
+                value="{{d.roomid}}" checked></div>
+    {{# } else { }}
+    <div><input name="enableCheckbox{{d.roomid}}" lay-filter="enableCheckbox" type="checkbox" lay-skin="switch"
+                lay-text="启用|关闭"
+                value="{{d.roomid}}"></div>
+    {{# }}}
+</script>
+<script type="text/html" id="upInfoCheckToSaveLive">
+    {{# if(d.savelive==1){}}
+    <div><input name="saveLiveCheckbox{{d.roomid}}" lay-filter="saveLiveCheckbox" type="checkbox"
+                lay-skin="switch"
+                lay-text="启用|关闭"
+                value="{{d.roomid}}" checked></div>
+    {{# } else { }}
+    <div><input name="saveLiveCheckbox{{d.roomid}}" lay-filter="saveLiveCheckbox" type="checkbox"
+                lay-skin="switch"
+                lay-text="启用|关闭"
+                value="{{d.roomid}}"></div>
+    {{# }}}
+
+</script>
+<script type="text/html" id="upInfoCheckTolive">
+    <div><input id="live" name="liveCheckbox{{d.roomid}}" lay-filter="liveCheckbox" type="checkbox" lay-skin="switch"
+                lay-text="直播|自闭"
+                value="{{d.roomid}}"></div>
+</script>
+<script type="text/html" id="upInfoCheckToSaveDanmu">
+    {{# if(d.savedanmu==1){}}
+    <div><input name="saveDanmuCheckbox" lay-filter="saveDanmuCheckbox" type="checkbox" lay-skin="switch"
+                lay-text="开启|关闭" value="{{d.roomid}}" checked></div>
+    {{# } else { }}
+    <div><input name="saveDanmuCheckbox" lay-filter="saveDanmuCheckbox" type="checkbox" lay-skin="switch"
+                lay-text="开启|关闭" value="{{d.roomid}}"></div>
+    {{# }}}
+</script>
+<script>
+    let form = layui.form;
+    $('#header').load("/html/header.html");
+    $('#footer').load("/html/footer.html");
+    layui.use(['layer', 'form', 'element', 'table'], function () {
+        let layer = layui.layer
+            , form = layui.form
+            , table = layui.table
+            , element = layui.element;
+        element.tabAdd('type', {
+            title: "BiliBili"
+            , content: '<table id="bili_up" lay-filter="listTools"></table>'
+            , id: 1
+        })
+        element.on('tab(type)', function (data) {
+
+            table.render({
+                elem: "#bili_up"
+                , url: '/upinfo/get/list.do'
+                , toolbar: '#topTools'
+                , page: true
+                , cols: [[
+                    {field: "id", title: "id", width: 80, sort: true, fixed: 'left'}
+                    , {
+                        field: 'name',
+                        title: '标题 <i class="layui-icon" id="htitle">&#xe60b;</i>',
+                        width: 150,
+                        templet: '<div><span id="{{d.roomid}}">{{d.name}}</span></div>'
+                    }
+                    , {field: 'roomid', title: 'roomid', width: 100}
+                    , {
+                        field: 'url',
+                        title: '直播地址',
+                        width: 250,
+                        templet: '<div><a href="{{d.url}}" target="_blank">{{d.url}}</a></div>'
+                    }
+                    , {
+                        field: 'offlinelistening',
+                        title: '24小时监控 <i class="layui-icon" id="h24">&#xe60b;</i>   ',
+                        width: 150,
+                        templet: '#upInfoCheckToOfflineListening'
+                    }
+                    , {
+                        field: 'enable',
+                        title: '统计 <i class="layui-icon" id="hdata">&#xe60b;</i>',
+                        width: 100,
+                        templet: '#upInfoCheckToEnable'
+                    }
+                    , {
+                        field: 'saveLive',
+                        title: '录制 <i class="layui-icon" id="hsave">&#xe60b;</i>',
+                        width: 120,
+                        templet: '#upInfoCheckToSaveLive'
+                    }
+                    , {
+                        field: 'live',
+                        title: '直播状态 <i class="layui-icon" id="hlive">&#xe60b;</i>',
+                        width: 120,
+                        templet: '#upInfoCheckTolive'
+                    }
+                    , {
+                        field: 'saveDanmu',
+                        title: '保存弹幕 <i class="layui-icon" id="hdanmu">&#xe60b;</i>',
+                        width: 120,
+                        templet: '#upInfoCheckToSaveDanmu'
+                    }
+                    , {field: "right", width: 200, toolbar: '#listTools'}
+                ]]
+                , done: function (res, curr, count) {
+                    let index=layer.load()
+                    $('#htitle').on('click', function () {
+                        var that = this;
+                        layer.tips('当名字变成绿色则代表后台正在统计中，为黑色则代表未统计，如果需要统计请打开统计开关后刷新查看结果', that, {
+                            tpis: 4
+                        });
+                    });
+                    $('#h24').on('click', function () {
+                        var that = this;
+                        layer.tips('只有开启24小时监控才会自动统计数据或录制', that, {
+                            tpis: 4
+                        });
+                    });
+                    $('#hdata').on('click', function () {
+                        var that = this;
+                        layer.tips('启动统计数据，仅在主播正在直播时可用，如需统计未直播时段，请开启24小时监控', that, {
+                            tpis: 4
+                        });
+                    });
+                    $('#hsave').on('click', function () {
+                        var that = this;
+                        layer.tips('在主播直播时录制视频，在统计为开启时才可用，录像文件在UP管理-录像中查看', that, {
+                            tpis: 4
+                        });
+                    });
+                    $('#hlive').on('click', function () {
+                        var that = this;
+                        layer.tips('主播当前直播状态，显示直播时并不代表在统计和录制视频，该状态仅代表主播是否正在直播', that, {
+                            tpis: 4
+                        });
+                    });
+                    $('#hdanmu').on('click', function () {
+                        var that = this;
+                        layer.tips('在统计为启用时保存弹幕信息，该功能可能占用大量储存空间请注意，保存文件为sqlite', that, {
+                            tpis: 4
+                        });
+                    });
+                    $.post('/upinfo/get/liveInfo.do', function (json) {
+                        if (json.code === 0) {
+                            $('#online').text("当前正在直播:" + json.data.online)
+                            for (let i in json.data.info) {
+                                console.log('input[name="liveCheckbox' + json.data.info[i].roomid + '"]')
+                                $('input[name="liveCheckbox' + json.data.info[i].roomid + '"]').prop('checked', true);
+                            }
+                            for (let i in json.data.live) {
+                                $('#' + json.data.live[i].roomid).css('color', '#8FE18F')
+                            }
+
+                            $.post('/user/get/test.do',function (json) {
+                                console.log(json.data.power)
+                                if(json.data.power.indexOf(-1)===-1&&json.data.power.indexOf(4)===-1){
+                                    $('input[type="checkbox"]').prop('disabled',true)
+                                }
+                                layer.close(index);
+                                form.render();
+
+                            })
+                        }else{
+                            layer.msg("close")
+                            layer.close();
+                        }
+                    })
+
+                }
+            });
+        })
+        /* $('#h24').on('click', function(){
+             var that = this;
+             layer.tips('只有开启24小时监控才会自动统计数据或录制', that);
+
+         });*/
+
+        table.on('toolbar(listTools)', function (obj) {
+            if (obj.event === 'addAddress') {
+                layer.prompt({
+                    formType: 2,
+                    value: '',
+                    title: '请输入房间号或直播地址(直播地址请勿包含参数 如http://live.bilibili.com/110?abcd)',
+                    area: ['350px', '30px'] //自定义文本域宽高
+                }, function (value, index, elem) {
+                    $.post("/user/up/set/add.do", {"url": value}, function (json) {
+                        layer.msg(json.msg)
+                        layer.close(index)
+                    })
+                });
+            }
+        })
+        table.on('tool(listTools)', function (obj) {
+            let event = obj.event;
+            switch (event) {
+                case "edit":
+                    layer.prompt({
+                        formType: 2,
+                        value: '',
+                        title: '请输入房间号或直播地址(直播地址请勿包含参数 如http://live.bilibili.com/110?abcd)',
+                        area: ['350px', '30px'] //自定义文本域宽高
+                    }, function (value, index, elem) {
+                        let dialogIndex=layer.load();
+                        queryUpInfo(obj.data.roomid, function (udata) {
+                            udata.url = value;
+                            udata.offlinelistening = udata.offlinelistening ? 1 : 0;
+                            udata.live = udata.live ? 1 : 0;
+                            udata.saveDanmu = udata.saveDanmu ? 1 : 0;
+                            console.log(udata)
+                            $.post("/upinfo/update.do", udata, function (json) {
+                                layer.close(dialogIndex);
+                                layer.msg(json.msg,function () {
+                                    window.location.reload();
+                                })
+                                layer.close(index)
+
+                            })
+                        })
+
+                    });
+                    break;
+                case "del":
+                    layer.open({
+                        title: '提示！'
+                        , content: '确定是否删除' + obj.data.name + '直播间？删除后已保存数据并不会一并删除！'
+                        , btn: ['确定', '取消']
+                        , yes: function (index, layero) {
+                            $.post('/upinfo/set/delete.do', {'roomid': obj.data.roomid}, function (json) {
+                                layer.msg(json.msg)
+                            })
+                            layer.close(index); //如果设定了yes回调，需进行手工关闭
+                        }
+                    });
+                    break;
+            }
+
+        })
+        form.on('switch(offlineListeningCheckbox)', function (data) {
+            let roomid = data.value;
+            let flag = data.elem.checked ? 1 : 0;
+            queryUpInfo(roomid, function (udata) {
+                udata.offlinelistening = flag;
+                udata.live = udata.live ? 1 : 0;
+                udata.saveDanmu = udata.saveDanmu ? 1 : 0;
+                $.post('/upinfo/set/update.do', udata, function (json) {
+                    layer.msg(json.msg)
+                })
+            })
+
+        });
+        form.on('switch(liveCheckbox)', function (data) {
+            let roomid = data.value;
+            let flag = data.elem.checked ? 1 : 0;
+            queryUpInfo(roomid, function (udata) {
+                udata.live = flag;
+                udata.offlinelistening = udata.offlinelistening ? 1 : 0;
+                udata.saveDanmu = udata.saveDanmu ? 1 : 0;
+                $.post('/upinfo/set/update.do', udata, function (json) {
+                    layer.msg(json.msg)
+                })
+            })
+        });
+        form.on('switch(enableCheckbox)', function (data) {
+            let roomid = data.value;
+            let flag = data.elem.checked ? 1 : 0;
+            queryUpInfo(roomid, function (udata) {
+                udata.enable = flag;
+                udata.offlinelistening = udata.offlinelistening ? 1 : 0;
+                udata.saveDanmu = udata.saveDanmu ? 1 : 0;
+                console.log(udata)
+                $.post('/upinfo/set/update.do', udata, function (json) {
+                    layer.msg(json.msg)
+                })
+            })
+        });
+        form.on('switch(saveLiveCheckbox)', function (data) {
+            let roomid = data.value;
+            let flag = data.elem.checked ? 1 : 0;
+            queryUpInfo(roomid, function (udata) {
+                udata.savelive = flag;
+                udata.offlinelistening = udata.offlinelistening ? 1 : 0;
+                udata.saveDanmu = udata.saveDanmu ? 1 : 0;
+                $.post('/upinfo/set/update.do', udata, function (json) {
+                    layer.msg(json.msg)
+                })
+            })
+        });
+        form.on('switch(saveDanmuCheckbox)', function (data) {
+            if (data.elem.checked) {
+                layer.open({
+                    title: '警告！'
+                    , content: '保存弹幕可能会占用大量硬盘空间，也可能会降低数据库查询时间，请谨慎使用（建议手动控制时段开关）'
+                    , btn: ['确定', '取消']
+                    , yes: function (index, layero) {
+                        let roomid = data.value;
+                        let flag = data.elem.checked ? 1 : 0;
+                        queryUpInfo(roomid, function (udata) {
+                            udata.savedanmu = flag;
+                            $.post('/upinfo/set/update.do', udata, function (json) {
+                                layer.msg(json.msg)
+                            })
+                        })
+                        layer.close(index); //如果设定了yes回调，需进行手工关闭
+                    }
+                    , btn2: function (index, layero) {
+                        console.log('off')
+                        $('input[name="saveDanmuCheckbox"]').prop('checked', false)
+                        form.render();
+                        layer.close(index)
+                    }
+                    , cancel: function (index, layero) {
+                        console.log('off')
+                        $('input[name="saveDanmuCheckbox"]').prop('checked', false)
+                        form.render();
+                        layer.close(index)
+                    }
+                });
+
+            } else {
+                let roomid = data.value;
+                let flag = data.elem.checked ? 1 : 0;
+                queryUpInfo(roomid, function (udata) {
+                    udata.savedanmu = flag;
+                    $.post('/upinfo/set/update.do', udata, function (json) {
+                        layer.msg(json.msg)
+                    })
+                })
+            }
+
+
+        })
+        element.tabChange('type', '1');
+
+    })
+    let that;
+
+    function queryUpInfo(roomid, fun) {
+        $.post('/upinfo/get/query.do', {"roomid": roomid}, function (data) {
+            fun(data)
+        })
+    }
+
+</script>
+
+
+</body>
+
+</html>

Web/html/body/bilibili/video.html

@@ -0,0 +1,170 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
+    <title>录播管理</title>
+    <link rel="stylesheet" href="/layui/css/layui.css">
+</head>
+
+<body>
+<div class="layui-layout layui-layout-admin">
+    <div id="header"></div>
+    <div class="layui-body" style="left: 0px;">
+        <div style="width: 50%;margin-left: 25%; margin-top: 2%;">
+            <div class="layui-card">
+                <div class="layui-card-header">录像管理</div>
+                <div class="layui-card-body">
+                    <table id="bili_video" lay-filter="listTools"></table>
+                </div>
+            </div>
+
+        </div>
+
+    </div>
+    <div id="footer"></div>
+</div>
+<script type="text/html" id="listTools">
+    <a class="layui-btn layui-btn-xs" lay-event="play">播放</a>
+    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="download">下载</a>
+</script>
+<script src="/layui/layui.js"></script>
+<script src="/js/jquery-3.2.1.js"></script>
+<script src="/js/flv.min.js"></script>
+<script>
+    layui.use(['layer', 'form', 'element', 'table'], function () {
+        let layer = layui.layer
+            , form = layui.form
+            , table = layui.table
+            , element = layui.element;
+        table.render({
+            elem: '#bili_video'
+            , height: 700
+            , url: '/bili/video/get/list.do' //数据接口
+            , page: true //开启分页
+            , cols: [[ //表头
+                {field: 'name', title: 'UP主/房间号', width: 150, sort: true, fixed: 'left'}
+                , {field: 'date', title: '日期', width: 120, sort: true}
+                , {field: 'time', title: '时间', width: 80, sort: true}
+                , {field: 'fileName', title: '文件名', width: 300}
+                , {field: 'fileSize', title: '大小', width: 80}
+                , {field: "right", width: 120, toolbar: '#listTools'}
+            ]]
+        });
+        table.on('tool(listTools)', function (obj) {
+            console.log(obj.data)
+            switch (obj.event) {
+                case 'download':
+                    window.open("/bili/video/download/get.do?fileName=" + encodeURI(obj.data.fileName))
+                    break;
+                case 'play':
+                    play("/download/" + obj.data.date + "/" + encodeURI(obj.data.fileName), obj.data.fileName);
+                    break;
+            }
+        })
+
+        function play(url, fileName) {
+            if (flvjs.isSupported()) {
+                let id = 'video_' + fileName
+                let volume = 1;
+                let isPlay = true;
+                let flvPlayer;
+                layer.open({
+                    title: fileName
+                    , type: 1
+                    , shade: 0
+                    , maxWidth: 680
+                    , zIndex: layer.zIndex
+                    , area: ['640px', '480px']
+                    , maxmin: false
+                    , resize: false
+                    , content: '<div><video id="' + id + '" style="height: 100%;width: 100%">' +
+                        '</video><a href="javascript:;" class="layui-btn layui-btn-xs" id="pause">暂停/播放</a>' +
+                        '</video><a href="javascript:;" class="layui-btn layui-btn-xs" id="reset">重播</a>' +
+                        '</video><a href="javascript:;" class="layui-btn layui-btn-xs" id="danmu">弹幕</a>' +
+                        '</video><a href="javascript:;" class="layui-btn layui-btn-xs" id="volume">静音</a>' +
+                        '</video><a href="javascript:;" class="layui-btn layui-btn-xs" id="seekDown">-10s</a>' +
+                        '</video><a href="javascript:;" class="layui-btn layui-btn-xs" id="seekUp">+10s</a>' +
+                        '</div>'
+                    , success: function (layero, index) {
+
+                        layer.setTop(layero);
+                        let videoElement = document.getElementById(id);
+                        videoElement.onended=function (){
+                          layer.close(index)
+                        };
+                        let playerConfig = {
+                            enableWorker: false,
+                            deferLoadAfterSourceOpen: true,
+                            stashInitialSize: 512 * 1024,
+                            enableStashBuffer: true
+                        }
+                        flvPlayer = flvjs.createPlayer({
+                            type: 'flv',
+                            url: url
+                        },playerConfig)
+
+                        flvPlayer.attachMediaElement(videoElement);
+                        flvPlayer.load();
+                        flvPlayer.play();
+                        $('#pause').click(function () {
+                            if (isPlay) {
+                                flvPlayer.pause();
+                            } else {
+                                flvPlayer.play();
+                            }
+                            isPlay=!isPlay;
+                        })
+                        $('#reset').click(function () {
+                            flvPlayer.unload();
+                            flvPlayer.load();
+                            flvPlayer.play();
+                        })
+                        $('#danmu').click(function () {
+                            layer.msg("鸽了")
+                        })
+                        $('#seekDown').click(function () {
+                            flvPlayer.currentTime = flvPlayer.currentTime - 10
+                        })
+                        $('#seekUp').click(function () {
+                            flvPlayer.currentTime = flvPlayer.currentTime + 10
+                        })
+                        $('#volume').click(function () {
+                            if (volume === 0) {
+                                volume = 1;
+                            } else {
+                                volume = 0;
+                            }
+                            console.log(flvPlayer)
+                            flvPlayer.volume = volume;
+                        })
+                    }
+                    , cancel: function (index) {
+                        flvPlayer.unload();
+                        flvPlayer.detachMediaElement();
+                        flvPlayer.destroy();
+                        flvPlayer = null;
+                        layer.close(index)
+                    }
+
+                });
+            }
+        }
+
+    });
+    $('#header').load("/html/header.html");
+    $('#footer').load("/html/footer.html");
+
+</script>
+
+</body>
+<style>
+    .layui-body {
+        position: relative;
+        z-index: 0;
+        background-color: #F2F2F2;
+    }
+
+</style>
+</html>

Web/html/body/user.html

@@ -0,0 +1,172 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
+    <title>用户中心</title>
+    <link rel="stylesheet" href="/layui/css/layui.css">
+</head>
+
+<body>
+<div class="layui-layout layui-layout-admin">
+    <div id="header"></div>
+    <div class="layui-body" style="left: 0px;">
+        <div style="width: 40%;height: 25%;margin-left: 25%; margin-top: 2%;">
+            <blockquote class="layui-elem-quote" style="background-color: #FFFFFF; height: 50%;">
+                <div align="center">
+                    哔哩哔哩账号，用于后台监控数据及录屏~
+                    <p></p>
+                    <a href="javascript:;" id="login"><img src="https://static.hdslb.com/images/akari.jpg"
+                                                           class="layui-nav-img" id="bili_icon_img"
+                                                           style="height: 80%;width: 10%">
+                        <p></p>
+                        <span id='bili_login_text'>管理员哔哩哔哩登陆</span></a>
+                </div>
+            </blockquote>
+            <div class="layui-card" style="margin-top: 5%;height: 120%">
+                <div class="layui-card-header">用户设置</div>
+                <div class="layui-card-body">
+                    <form class="layui-form" action="" style="margin-top: 2%;width: 80%">
+                        <div class="layui-form-item">
+                            <label class="layui-form-label">修改名称</label>
+                            <div class="layui-input-block">
+                                <input type="text" name="user" required lay-verify="required" placeholder="新名称"
+                                       autocomplete="off" class="layui-input">
+                            </div>
+                        </div>
+                        <div class="layui-form-item">
+                            <label class="layui-form-label">修改密码</label>
+                            <div class="layui-input-block">
+                                <input type="password" name="password" required lay-verify="required" placeholder="新密码"
+                                       autocomplete="off" class="layui-input">
+                            </div>
+                        </div>
+                        <div class="layui-form-item">
+                            <div class="layui-input-block">
+                                <button class="layui-btn" type="button" lay-submit lay-filter="formDemo">立即提交</button>
+                                <button type="reset" class="layui-btn layui-btn-primary">重置</button>
+                            </div>
+                        </div>
+                    </form>
+                </div>
+                <div id="config" class="layui-card" style="margin-top: 5%;height: 100%;display: none">
+                    <div class="layui-card-header">系统设置</div>
+                    <div class="layui-card-body">
+                        <form class="layui-form" action="" style="margin-top: 2%;width: 80%">
+                            <div class="layui-form-item">
+                                <label class="layui-form-label">开放注册</label>
+                                <div class="layui-input-block">
+                                    <input id="userReg" type="checkbox" lay-filter="userReg" lay-skin="switch" lay-text="开启|关闭">
+                                </div>
+                            </div>
+                            <div class="layui-form-item">
+                                <label class="layui-form-label">保存阿B数据</label>
+                                <div class="layui-input-block">
+                                    <input id="saveBiliLive" type="checkbox" lay-filter="saveBiliLive" lay-skin="switch" lay-text="开启|关闭">
+                                </div>
+                            </div>
+                        </form>
+                    </div>
+                </div>
+            </div>
+
+
+        </div>
+
+    </div>
+    <div id="footer"></div>
+</div>
+
+<script src="/layui/layui.js"></script>
+<script src="/js/jquery-3.2.1.js"></script>
+<script src="/js/qrcode.min.js"></script>
+<script>
+    layui.use(['layer', 'form', 'element'], function () {
+        let layer = layui.layer
+            , form = layui.form;
+        form.on('submit(formDemo)', function (data) {
+            console.log(data.field) //当前容器的全部表单字段，名值对形式：{name: value}
+            $.post('/user/set/update.do', data.field, function (json) {
+                if (json.code !== undefined) {
+                    layer.msg(json.msg)
+                    if (josn.code === 0) {
+                        window.location.reload()
+                    }
+                } else {
+                    layer.msg("可能未登录")
+                }
+            })
+            return false; //阻止表单跳转。如果需要表单跳转，去掉这段即可。
+        });
+        $.post('/system/get/config.do', function (json) {
+            if (json.code !== undefined) {
+                $('#config').css('display', 'block')
+                if (json.data.userReg === '1') {
+                    $('#userReg').prop('checked', true);
+                }
+                if (json.data.biliLive === '1') {
+                    $('#saveBiliLive').prop('checked', true);
+                }
+                form.render();
+            }
+        })
+        form.on('switch(userReg)', function (data) {
+            let flag = data.elem.checked ? '1' : '0';
+            $.post("/system/set/config.do", {key: "userReg", value: flag}, function (json) {
+                if (json.code !== undefined) {
+                    layer.msg(json.msg)
+                }
+            })
+        })
+        form.on('switch(saveBiliLive)', function (data) {
+            let flag = data.elem.checked ? '1' : '0';
+            $.post("/system/set/config.do", {key: "biliLive", value: flag}, function (json) {
+                if (json.code !== undefined) {
+                    layer.msg(json.msg)
+                }
+            })
+        })
+    });
+    $.post('/bili/login/get/test.do', function (json) {
+        if (json.code === undefined || json.code !== 0) {
+            return;
+        }
+        $('#bili_login_text').text(json.data.uname);
+        $('#bili_icon_img').attr("src", json.data.icon);
+
+    })
+    $('#login').click(function () {
+        $.post('/bili/login/set/login.do', function (json) {
+            if (json.code === undefined || json.code !== 0) {
+                layer.msg("您无权修改")
+                return;
+            }
+            console.log(json)
+            layer.open({
+                title: "BiliBili客户端扫描登陆",
+                content: "<div id=\"qrcode\"></div>",
+                success: function () {
+                    new QRCode(document.getElementById("qrcode"), json.url);
+                },
+                yes: function (index) {
+                    layer.close(index)
+                    window.location.reload();
+                }
+
+            })
+        })
+    })
+    $('#header').load("/html/header.html");
+    $('#footer').load("/html/footer.html");
+
+</script>
+</body>
+<style>
+    .layui-body {
+        position: relative;
+        z-index: 0;
+        background-color: #F2F2F2;
+    }
+</style>
+</html>

Web/html/footer.html

@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html>
+    <head>
+        <meta charset="UTF-8">
+    </head>
+    <body>
+        <div class="layui-footer" style="left: 0px; text-align: center; height: 60px; line-height: 0;">
+            <div style="line-height: 44px;">
+                ©2021 by Yutou
+            </div>
+            <div>
+                <a href="#">OvO?</a>
+            </div>
+
+        </div>
+    </body>
+</html>

Web/html/header.html

@@ -0,0 +1,132 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta name="referrer" content="no-referrer"/>
+    <meta charset="UTF-8">
+    <title>DD监视器</title>
+</head>
+
+<body>
+
+<div class="layui-header">
+    <ul class="layui-nav" lay-filter="" style="background-color: #1772B4;">
+        <li class="layui-nav-item">DD监视器</li>
+        <div id="admin" style="display: inline-block; font-size: 0px;">
+            <li class="layui-nav-item"><a href="/html/body/bilibili/upInfo.html">UP管理</a>
+                <dl class="layui-nav-child">
+                    <dd><a href="/html/body/bilibili/video.html">录像</a></dd>
+                </dl>
+            </li>
+        </div>
+        <li class="layui-nav-item">
+            <a href="/html/body/bilibili/realTimeData.html">实时数据</a>
+        </li>
+        <li class="layui-nav-item">
+            <a href="/html/body/bilibili/overview.html">数据统计</a>
+        </li>
+        <li class="layui-nav-item" id='icon'>
+            <a href="javascript:;" id="login"><img src="https://static.hdslb.com/images/akari.jpg" class="layui-nav-img"
+                                                   id="icon_img"><span
+                    id='login_text'>登录</span></a>
+            <dl class="layui-nav-child">
+                <dd><a href="/html/body/user.html">设置</a></dd>
+                <dd><a href="javascript:;" id="logout">退了</a></dd>
+            </dl>
+        </li>
+    </ul>
+
+</div>
+
+</body>
+<div id="loginDialog" style="display: none;width: 80%;height: 100%">
+    <br>
+    <label class="layui-form-label">账号</label>
+    <div class="layui-input-block">
+        <input type="text" id="uname" required="" lay-verify="required" placeholder="请输入账号" autoComplete="off"
+               class="layui-input">
+    </div>
+    <label class="layui-form-label" style="margin-top: 10px">密码</label>
+    <div class="layui-input-block" style="margin-top: 10px">
+        <input type="password" id="pass" required="" lay-verify="required" placeholder="请输入密码" autoComplete="off"
+               class="layui-input">
+    </div>
+</div>
+<script>
+    let loginStatus = false;
+    $.post('/user/get/test.do', function (json) {
+        console.log(json)
+        if (json.code === 0) {
+            $('#login_text').text(json.data.user);
+            loginStatus = true;
+        }
+
+    })
+
+    $('#login').click(function () {
+        if (loginStatus) {
+            return;
+        }
+        layer.open({
+            title: "登陆",
+            content: $('#loginDialog'),
+            type: 1,
+            btn: ['登陆', '注册'],
+            success: function () {
+                //new QRCode(document.getElementById("qrcode"), json.url);
+            },
+            yes: function (index) {
+                let uname = $('#uname').val();
+                let password = $('#pass').val()
+                $.post('/user/login.do', {user: uname, password: password}, function (json) {
+                    layer.msg(json.msg, function () {
+                        console.log(json)
+                        if (json.code === 0) {
+                            layer.close(index)
+                            $('#loginDialog').css('display', 'none')
+                        }
+                    })
+                })
+            },
+            btn2: function (index) {
+                let uname = $('#uname').val();
+                let password = $('#pass').val()
+                $.post('/user/reg.do', {user: uname, password: password}, function (json) {
+                    layer.msg(json.msg, function () {
+                        console.log(json)
+                        if (json.code === 0) {
+                            layer.close(index)
+                            $('#loginDialog').css('display', 'none')
+                            window.location.reload();
+                        }
+                    })
+                })
+            }
+
+        })
+    });
+    $('#logout').click(function (){
+        $.post('/user/logout.do',function (json) {
+            layer.msg(json.msg,function (){
+                window.location.reload();
+            })
+        })
+    })
+    $(document).ready(function () {
+        let mobile = layui.device().mobile;
+        if (mobile) {
+            $('.layui-body').css('left', '0')
+            $('.layui-body').css('top', '150px')
+            $('.layui-body').css('height', '200%')
+            $('#icon').css('float', 'none')
+
+
+        } else {
+            $('.layui-body').css('padding-right', '100px')
+            $('#icon').css('float', 'right')
+        }
+    })
+</script>
+<style>
+</style>
+</html>

Web/index.html

@@ -0,0 +1,59 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
+    <title>DD监视器</title>
+    <link rel="stylesheet" href="/layui/css/layui.css">
+</head>
+
+<body>
+<div class="layui-layout layui-layout-admin">
+    <div id="header"></div>
+    <div class="layui-body" style="left: 0px;">
+        <div style="width: 50%;margin-left: 25%; margin-top: 2%;" >
+            <blockquote class="layui-elem-quote" style="background-color: #FFFFFF">
+               本站点采用限时注册模式，仅登陆用户可使用。当前注册状态: <span style="color: #FD482C" id="model">关闭</span>
+            </blockquote>
+            <div align="center">
+
+            <img  src="https://s1.hdslb.com/bfs/static/jinkela/international-home/assets/bgm-nodata.png" style="float: contour">
+
+            </div>
+        </div>
+
+    </div>
+    <div id="footer"></div>
+</div>
+
+<script src="/layui/layui.js"></script>
+<script src="/js/jquery-3.2.1.js"></script>
+<script>
+    layui.use(['layer', 'form', 'element'], function () {
+        var layer = layui.layer
+            , form = layui.form;
+
+    });
+    $('#header').load("/html/header.html");
+    $('#footer').load("/html/footer.html");
+    $.post("/system/public/reg.do",function (json) {
+        if(json.data.userReg){
+            $('#model').css('color','#499C54')
+            $('#model').text('开启')
+        }else{
+            $('#model').css('color','#FD482C')
+            $('#model').text('关闭')
+        }
+    })
+</script>
+
+</body>
+<style>
+    .layui-body {
+        position: relative;
+        z-index: 0;
+        background-color: #F2F2F2;
+    }
+</style>
+</html>

Web/js/myjs.js

@@ -0,0 +1,112 @@
+function Base64() {
+
+    // private property
+    _keyStr = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=";
+
+    // public method for encoding
+    this.encode = function (input) {
+        let output = "";
+        let chr1, chr2, chr3, enc1, enc2, enc3, enc4;
+        let i = 0;
+        input = _utf8_encode(input);
+        while (i < input.length) {
+            chr1 = input.charCodeAt(i++);
+            chr2 = input.charCodeAt(i++);
+            chr3 = input.charCodeAt(i++);
+            enc1 = chr1 >> 2;
+            enc2 = ((chr1 & 3) << 4) | (chr2 >> 4);
+            enc3 = ((chr2 & 15) << 2) | (chr3 >> 6);
+            enc4 = chr3 & 63;
+            if (isNaN(chr2)) {
+                enc3 = enc4 = 64;
+            } else if (isNaN(chr3)) {
+                enc4 = 64;
+            }
+            output = output +
+                _keyStr.charAt(enc1) + _keyStr.charAt(enc2) +
+                _keyStr.charAt(enc3) + _keyStr.charAt(enc4);
+        }
+        return output;
+    }
+
+    // public method for decoding
+    this.decode = function (input) {
+        let output = "";
+        let chr1, chr2, chr3;
+        let enc1, enc2, enc3, enc4;
+        let i = 0;
+        input = input.replace(/[^A-Za-z0-9\+\/\=]/g, "");
+        while (i < input.length) {
+            enc1 = _keyStr.indexOf(input.charAt(i++));
+            enc2 = _keyStr.indexOf(input.charAt(i++));
+            enc3 = _keyStr.indexOf(input.charAt(i++));
+            enc4 = _keyStr.indexOf(input.charAt(i++));
+            chr1 = (enc1 << 2) | (enc2 >> 4);
+            chr2 = ((enc2 & 15) << 4) | (enc3 >> 2);
+            chr3 = ((enc3 & 3) << 6) | enc4;
+            output = output + String.fromCharCode(chr1);
+            if (enc3 != 64) {
+                output = output + String.fromCharCode(chr2);
+            }
+            if (enc4 != 64) {
+                output = output + String.fromCharCode(chr3);
+            }
+        }
+        output = _utf8_decode(output);
+        return output;
+    }
+
+    // private method for UTF-8 encoding
+    _utf8_encode = function (string) {
+        string = string.replace(/\r\n/g,"\n");
+        let utftext = "";
+        for (let n = 0; n < string.length; n++) {
+            let c = string.charCodeAt(n);
+            if (c < 128) {
+                utftext += String.fromCharCode(c);
+            } else if((c > 127) && (c < 2048)) {
+                utftext += String.fromCharCode((c >> 6) | 192);
+                utftext += String.fromCharCode((c & 63) | 128);
+            } else {
+                utftext += String.fromCharCode((c >> 12) | 224);
+                utftext += String.fromCharCode(((c >> 6) & 63) | 128);
+                utftext += String.fromCharCode((c & 63) | 128);
+            }
+
+        }
+        return utftext;
+    }
+
+    // private method for UTF-8 decoding
+    _utf8_decode = function (utftext) {
+        let string = "";
+        let i = 0;
+        let c = c1 = c2 = 0;
+        while ( i < utftext.length ) {
+            c = utftext.charCodeAt(i);
+            if (c < 128) {
+                string += String.fromCharCode(c);
+                i++;
+            } else if((c > 191) && (c < 224)) {
+                c2 = utftext.charCodeAt(i+1);
+                string += String.fromCharCode(((c & 31) << 6) | (c2 & 63));
+                i += 2;
+            } else {
+                c2 = utftext.charCodeAt(i+1);
+                c3 = utftext.charCodeAt(i+2);
+                string += String.fromCharCode(((c & 15) << 12) | ((c2 & 63) << 6) | (c3 & 63));
+                i += 3;
+            }
+        }
+        return string;
+    }
+}
+function getParam(name){
+    console.log(window.location.href)
+    var results = new RegExp('[\?&]' + name + '=([^&#]*)').exec(window.location.href);
+    if (results == null) {
+        return null;
+    } else {
+        return decodeURI(results[1]) || 0;
+    }
+}

Web/layui/css/modules/code.css

@@ -0,0 +1,2 @@
+/** layui-v2.5.7 MIT License */
+ html #layuicss-skincodecss{display:none;position:absolute;width:1989px}.layui-code-h3,.layui-code-view{position:relative;font-size:12px}.layui-code-view{display:block;margin:10px 0;padding:0;border:1px solid #e2e2e2;border-left-width:6px;background-color:#F2F2F2;color:#333;font-family:Courier New}.layui-code-h3{padding:0 10px;height:32px;line-height:32px;border-bottom:1px solid #e2e2e2}.layui-code-h3 a{position:absolute;right:10px;top:0;color:#999}.layui-code-view .layui-code-ol{position:relative;overflow:auto}.layui-code-view .layui-code-ol li{position:relative;margin-left:45px;line-height:20px;padding:0 5px;border-left:1px solid #e2e2e2;list-style-type:decimal-leading-zero;*list-style-type:decimal;background-color:#fff}.layui-code-view pre{margin:0}.layui-code-notepad{border:1px solid #0C0C0C;border-left-color:#3F3F3F;background-color:#0C0C0C;color:#C2BE9E}.layui-code-notepad .layui-code-h3{border-bottom:none}.layui-code-notepad .layui-code-ol li{background-color:#3F3F3F;border-left:none}