From 065254c672c2d1432de1227620d06871f3a1de97 Mon Sep 17 00:00:00 2001 From: eson Date: Mon, 31 Aug 2020 18:10:38 +0800 Subject: [PATCH] TODO: router --- .gitignore | 1 + .vscode/launch.json | 14 +- goserver/count_tag.go | 28 --- goserver/go.mod | 3 +- goserver/go.sum | 32 +-- goserver/main.go | 39 ---- goserver/middleware.go | 45 ++++ src/App.js | 182 +++++++++------- src/ChartsCount.js | 20 +- src/ContentTable.js | 19 -- src/Router.js | 33 +++ src/Table.js | 278 ------------------------- src/TableData.js | 233 +++++++++++++++++++++ src/{Table.less => TableData.less} | 0 src/{TableTest.js => TableDataTest.js} | 5 +- src/Var.js | 2 +- src/index.js | 4 +- start.sh | 2 +- 18 files changed, 447 insertions(+), 493 deletions(-) create mode 100644 goserver/middleware.go delete mode 100644 src/ContentTable.js create mode 100644 src/Router.js delete mode 100644 src/Table.js create mode 100644 src/TableData.js rename src/{Table.less => TableData.less} (100%) rename src/{TableTest.js => TableDataTest.js} (91%) diff --git a/.gitignore b/.gitignore index 919a70a..91fe42c 100644 --- a/.gitignore +++ b/.gitignore @@ -17,3 +17,4 @@ npm-debug.log #go debug.test intimate_server +screenlog.* diff --git a/.vscode/launch.json b/.vscode/launch.json index 62e9869..c5229c9 100644 --- a/.vscode/launch.json +++ b/.vscode/launch.json @@ -4,13 +4,13 @@ // 欲了解更多信息，请访问: https://go.microsoft.com/fwlink/?linkid=830387 "version": "0.2.0", "configurations": [ - { - "type": "chrome", - "request": "attach", - "name": "Attach to Chrome", - "port": 9222, - "webRoot": "${workspaceFolder}" - }, + // { + // "type": "chrome", + // "request": "attach", + // "name": "Attach to Chrome", + // "port": 9222, + // "webRoot": "${workspaceFolder}" + // }, { "type": "chrome", "request": "launch", diff --git a/goserver/count_tag.go b/goserver/count_tag.go index 611c974..730d43f 100644 --- a/goserver/count_tag.go +++ b/goserver/count_tag.go @@ -178,34 +178,6 @@ func countTagInfo(cxt *gin.Context, ret func(cxt *gin.Context, cw *tagcounter)) cw = icw } - // rows, err := StoreStreamer.Query(sql) - // if err != nil { - // cxt.Error(err) - // return - // } - - // cw = &tagcounter{} - // cw.CountWord = make(map[string]*taginfo) - // cw.Name = platform - // cw.LastTime = time.Now() - - // for rows.Next() { - // var stag string - // err = rows.Scan(&stag) - // if err != nil { - // log.Println(err) - // } - // var tag []string - // json.Unmarshal([]byte(stag), &tag) - // for _, t := range tag { - // if _, ok := cw.CountWord[t]; ok { - // cw.CountWord[t].Value++ - // } else { - // cw.CountWord[t] = &taginfo{Name: t, Value: 1} - // } - // } - // } - cw.Name = platform heap := heap.New(func(a, b interface{}) int { if a.(*taginfo).Value >= b.(*taginfo).Value { diff --git a/goserver/go.mod b/goserver/go.mod index f110dd3..72053d4 100644 --- a/goserver/go.mod +++ b/goserver/go.mod @@ -7,6 +7,5 @@ require ( github.com/Pallinder/go-randomdata v1.2.0 github.com/gin-gonic/gin v1.6.3 github.com/go-sql-driver/mysql v1.5.0 - github.com/jinzhu/gorm v1.9.16 // indirect - gopkg.in/yaml.v2 v2.3.0 + gopkg.in/yaml.v2 v2.2.8 ) diff --git a/goserver/go.sum b/goserver/go.sum index 8124eac..3b481f9 100644 --- a/goserver/go.sum +++ b/goserver/go.sum @@ -4,16 +4,14 @@ github.com/Pallinder/go-randomdata v1.1.0 h1:gUubB1IEUliFmzjqjhf+bgkg1o6uoFIkRsP github.com/Pallinder/go-randomdata v1.1.0/go.mod h1:yHmJgulpD2Nfrm0cR9tI/+oAgRqCQQixsA8HyRZfV9Y= github.com/Pallinder/go-randomdata v1.2.0 h1:DZ41wBchNRb/0GfsePLiSwb0PHZmT67XY00lCDlaYPg= github.com/Pallinder/go-randomdata v1.2.0/go.mod h1:yHmJgulpD2Nfrm0cR9tI/+oAgRqCQQixsA8HyRZfV9Y= -github.com/PuerkitoBio/goquery v1.5.1/go.mod h1:GsLWisAFVj4WgDibEWF4pvYnkVQBpKBKeU+7zCJoLcc= -github.com/andybalholm/cascadia v1.1.0/go.mod h1:GsXiBklL0woXo1j/WYWtSYYC4ouU9PqHO0sqidkEA4Y= github.com/davecgh/go-spew v1.1.0/go.mod h1:J7Y8YcW2NihsgmVo/mv3lAwl/skON4iLHjSsI+c5H38= +github.com/davecgh/go-spew v1.1.1 h1:vj9j/u1bqnvCEfJOwUhtlOARqs3+rkHYY13jYWTU97c= github.com/davecgh/go-spew v1.1.1/go.mod h1:J7Y8YcW2NihsgmVo/mv3lAwl/skON4iLHjSsI+c5H38= -github.com/denisenkom/go-mssqldb v0.0.0-20191124224453-732737034ffd/go.mod h1:xbL0rPBG9cCiLr28tMa8zpbdarY27NDyej4t/EjAShU= -github.com/erikstmartin/go-testdb v0.0.0-20160219214506-8d10e4a1bae5/go.mod h1:a2zkGnVExMxdzMo3M0Hi/3sEU+cWnZpSni0O6/Yb/P0= github.com/gin-contrib/sse v0.1.0 h1:Y/yl/+YNO8GZSjAhjMsSuLt29uWRFHdHYUb5lYOV9qE= github.com/gin-contrib/sse v0.1.0/go.mod h1:RHrZQHXnP2xjPF+u1gW/2HnVO7nvIa9PG3Gm+fLHvGI= github.com/gin-gonic/gin v1.6.3 h1:ahKqKTFpO5KTPHxWZjEdPScmYaGtLo8Y4DMHoEsnp14= github.com/gin-gonic/gin v1.6.3/go.mod h1:75u5sXoLsGZoRN5Sgbi1eraJ4GU3++wFwWzhwvtwp4M= +github.com/go-playground/assert/v2 v2.0.1 h1:MsBgLAaY856+nPRTKrp3/OZK38U/wa0CcBYNjji3q3A= github.com/go-playground/assert/v2 v2.0.1/go.mod h1:VDjEfimB/XKnb+ZQfWdccd7VUvScMdVu0Titje2rxJ4= github.com/go-playground/locales v0.13.0 h1:HyWk6mgj5qFqCT5fjGBuRArbVDfE4hi8+e8ceBS/t7Q= github.com/go-playground/locales v0.13.0/go.mod h1:taPMhCMXrRLJO55olJkUXHZBHCxTMfnGwq/HNwmWNS8= @@ -23,54 +21,36 @@ github.com/go-playground/validator/v10 v10.2.0 h1:KgJ0snyC2R9VXYN2rneOtQcw5aHQB1 github.com/go-playground/validator/v10 v10.2.0/go.mod h1:uOYAAleCW8F/7oMFd6aG0GOhaH6EGOAJShg8Id5JGkI= github.com/go-sql-driver/mysql v1.5.0 h1:ozyZYNQW3x3HtqT1jira07DN2PArx2v7/mN66gGcHOs= github.com/go-sql-driver/mysql v1.5.0/go.mod h1:DCzpHaOWr8IXmIStZouvnhqoel9Qv2LBy8hT2VhHyBg= -github.com/golang-sql/civil v0.0.0-20190719163853-cb61b32ac6fe/go.mod h1:8vg3r2VgvsThLBIFL93Qb5yWzgyZWhEmBwUJWevAkK0= github.com/golang/protobuf v1.3.3 h1:gyjaxf+svBWX08ZjK86iN9geUJF0H6gp2IRKX6Nf6/I= github.com/golang/protobuf v1.3.3/go.mod h1:vzj43D7+SQXF/4pzW/hwtAqwc6iTitCiVSaWz5lYuqw= github.com/google/gofuzz v1.0.0/go.mod h1:dBl0BpW6vV/+mYPU4Po3pmUjxk6FQPldtuIdl/M65Eg= -github.com/jinzhu/gorm v1.9.16 h1:+IyIjPEABKRpsu/F8OvDPy9fyQlgsg2luMV2ZIH5i5o= -github.com/jinzhu/gorm v1.9.16/go.mod h1:G3LB3wezTOWM2ITLzPxEXgSkOXAntiLHS7UdBefADcs= -github.com/jinzhu/inflection v1.0.0 h1:K317FqzuhWc8YvSVlFMCCUb36O/S9MCKRDI7QkRKD/E= -github.com/jinzhu/inflection v1.0.0/go.mod h1:h+uFLlag+Qp1Va5pdKtLDYj+kHp5pxUVkryuEj+Srlc= -github.com/jinzhu/now v1.0.1/go.mod h1:d3SSVoowX0Lcu0IBviAWJpolVfI5UJVZZ7cO71lE/z8= github.com/json-iterator/go v1.1.9 h1:9yzud/Ht36ygwatGx56VwCZtlI/2AD15T1X2sjSuGns= github.com/json-iterator/go v1.1.9/go.mod h1:KdQUCv79m/52Kvf8AW2vK1V8akMuk1QjK/uOdHXbAo4= github.com/leodido/go-urn v1.2.0 h1:hpXL4XnriNwQ/ABnpepYM/1vCLWNDfUNts8dX3xTG6Y= github.com/leodido/go-urn v1.2.0/go.mod h1:+8+nEpDfqqsY+g338gtMEUOtuK+4dEMhiQEgxpxOKII= -github.com/lib/pq v1.1.1/go.mod h1:5WUZQaWbwv1U+lTReE5YruASi9Al49XbQIvNi/34Woo= github.com/mattn/go-isatty v0.0.12 h1:wuysRhFDzyxgEmMf5xjvJ2M9dZoWAXNNr5LSBS7uHXY= github.com/mattn/go-isatty v0.0.12/go.mod h1:cbi8OIDigv2wuxKPP5vlRcQ1OAZbq2CE4Kysco4FUpU= -github.com/mattn/go-sqlite3 v1.14.0/go.mod h1:JIl7NbARA7phWnGvh0LKTyg7S9BA+6gx71ShQilpsus= github.com/modern-go/concurrent v0.0.0-20180228061459-e0a39a4cb421 h1:ZqeYNhU3OHLH3mGKHDcjJRFFRrJa6eAM5H+CtDdOsPc= github.com/modern-go/concurrent v0.0.0-20180228061459-e0a39a4cb421/go.mod h1:6dJC0mAP4ikYIbvyc7fijjWJddQyLn8Ig3JB5CqoB9Q= github.com/modern-go/reflect2 v0.0.0-20180701023420-4b7aa43c6742 h1:Esafd1046DLDQ0W1YjYsBW+p8U2u7vzgW2SQVmlNazg= github.com/modern-go/reflect2 v0.0.0-20180701023420-4b7aa43c6742/go.mod h1:bx2lNnkwVCuqBIxFjflWJWanXIb3RllmbCylyMrvgv0= +github.com/pmezard/go-difflib v1.0.0 h1:4DBwDE0NGyQoBHbLQYPwSUPoCMWR5BEzIk/f1lZbAQM= github.com/pmezard/go-difflib v1.0.0/go.mod h1:iKH77koFhYxTK1pcRnkKkqfTogsbg7gZNVY4sRDYZ/4= github.com/stretchr/objx v0.1.0/go.mod h1:HFkY916IF+rwdDfMAkV7OtwuqBVzrE8GR6GFx+wExME= github.com/stretchr/testify v1.3.0/go.mod h1:M5WIy9Dh21IEIfnGCwXGc5bZfKNJtfHm1UVUgZn+9EI= +github.com/stretchr/testify v1.4.0 h1:2E4SXV/wtOkTonXsotYi4li6zVWxYlZuYNCXe9XRJyk= github.com/stretchr/testify v1.4.0/go.mod h1:j7eGeouHqKxXV5pUuKE4zz7dFj8WfuZ+81PSLYec5m4= github.com/ugorji/go v1.1.7 h1:/68gy2h+1mWMrwZFeD1kQialdSzAb432dtpeJ42ovdo= github.com/ugorji/go v1.1.7/go.mod h1:kZn38zHttfInRq0xu/PH0az30d+z6vm202qpg1oXVMw= github.com/ugorji/go/codec v1.1.7 h1:2SvQaVZ1ouYrrKKwoSk2pzd4A9evlKJb9oTL+OaLUSs= github.com/ugorji/go/codec v1.1.7/go.mod h1:Ax+UKWsSmolVDwsd+7N3ZtXu+yMGCf907BLYF3GoBXY= -golang.org/x/crypto v0.0.0-20190308221718-c2843e01d9a2/go.mod h1:djNgcEr1/C05ACkg1iLfiJU5Ep61QUkGW8qpdssI0+w= -golang.org/x/crypto v0.0.0-20190325154230-a5d413f7728c/go.mod h1:djNgcEr1/C05ACkg1iLfiJU5Ep61QUkGW8qpdssI0+w= -golang.org/x/crypto v0.0.0-20191205180655-e7c4368fe9dd/go.mod h1:LzIPMQfyMNhhGPhUkYOs5KpL4U8rLKemX1yGLhDgUto= -golang.org/x/net v0.0.0-20180218175443-cbe0f9307d01/go.mod h1:mL1N/T3taQHkDXs73rZJwtUhF3w3ftmwwsq0BUmARs4= -golang.org/x/net v0.0.0-20190404232315-eb5bcb51f2a3/go.mod h1:t9HGtf8HONx5eT2rtn7q6eTqICYqUVnKs3thJo3Qplg= -golang.org/x/net v0.0.0-20200202094626-16171245cfb2/go.mod h1:z5CRVTTTmAJ677TzLLGU+0bjPO0LkuOLi4/5GtJWs/s= -golang.org/x/net v0.0.0-20200324143707-d3edc9973b7e/go.mod h1:qpuaurCH72eLCgpAm/N6yyVIVM9cpaDIP3A8BGJEC5A= -golang.org/x/sys v0.0.0-20190215142949-d0b11bdaac8a/go.mod h1:STP8DvDyc/dI5b8T5hshtkjS+E42TnysNCUPdjciGhY= -golang.org/x/sys v0.0.0-20190412213103-97732733099d/go.mod h1:h1NjWce9XRLGQEsW7wpKNCjG9DtNlClVuFLEZdDNbEs= golang.org/x/sys v0.0.0-20200116001909-b77594299b42 h1:vEOn+mP2zCOVzKckCZy6YsCtDblrpj/w7B9nxGNELpg= golang.org/x/sys v0.0.0-20200116001909-b77594299b42/go.mod h1:h1NjWce9XRLGQEsW7wpKNCjG9DtNlClVuFLEZdDNbEs= -golang.org/x/sys v0.0.0-20200323222414-85ca7c5b95cd h1:xhmwyvizuTgC2qz7ZlMluP20uW+C3Rm0FD/WLDX8884= -golang.org/x/sys v0.0.0-20200323222414-85ca7c5b95cd/go.mod h1:h1NjWce9XRLGQEsW7wpKNCjG9DtNlClVuFLEZdDNbEs= -golang.org/x/text v0.3.0/go.mod h1:NqM8EUOU14njkJ3fqMW+pc6Ldnwhi/IjpwHt7yyuwOQ= +golang.org/x/text v0.3.2 h1:tW2bmiBqwgJj/UpqtC8EpXEZVYOwU0yG4iWbprSVAcs= golang.org/x/text v0.3.2/go.mod h1:bEr9sfX3Q8Zfm5fL9x+3itogRgK3+ptLWKqgva+5dAk= golang.org/x/tools v0.0.0-20180917221912-90fa682c2a6e/go.mod h1:n7NCudcB/nEzxVGmLbDWY5pfWTLqBcC2KZ6jyYvM4mQ= +gopkg.in/check.v1 v0.0.0-20161208181325-20d25e280405 h1:yhCVgyC4o1eVCa2tZl7eS0r+SDo693bJlVdllGtEeKM= gopkg.in/check.v1 v0.0.0-20161208181325-20d25e280405/go.mod h1:Co6ibVJAznAaIkqp8huTwlJQCZ016jof/cbN4VW5Yz0= gopkg.in/yaml.v2 v2.2.2/go.mod h1:hI93XBmqTisBFMUTm0b8Fm+jr3Dg1NNxqwp+5A1VGuI= gopkg.in/yaml.v2 v2.2.8 h1:obN1ZagJSUGI0Ek/LBmuj4SNLPfIny3KsKFopxRdj10= gopkg.in/yaml.v2 v2.2.8/go.mod h1:hI93XBmqTisBFMUTm0b8Fm+jr3Dg1NNxqwp+5A1VGuI= -gopkg.in/yaml.v2 v2.3.0 h1:clyUAQHOM3G0M3f5vQj7LuJrETvjVot3Z5el9nffUtU= -gopkg.in/yaml.v2 v2.3.0/go.mod h1:hI93XBmqTisBFMUTm0b8Fm+jr3Dg1NNxqwp+5A1VGuI= diff --git a/goserver/main.go b/goserver/main.go index bddb03f..8798ff7 100644 --- a/goserver/main.go +++ b/goserver/main.go @@ -2,9 +2,6 @@ package main import ( "database/sql" - "fmt" - "net/http" - "strings" "time" "github.com/gin-gonic/gin" @@ -27,42 +24,6 @@ type Result struct { Data interface{} } -func Cors() gin.HandlerFunc { - return func(c *gin.Context) { - method := c.Request.Method //请求方法 - origin := c.Request.Header.Get("Origin") //请求头部 - var headerKeys []string // 声明请求头keys - for k, _ := range c.Request.Header { - headerKeys = append(headerKeys, k) - } - headerStr := strings.Join(headerKeys, ", ") - if headerStr != "" { - headerStr = fmt.Sprintf("access-control-allow-origin, access-control-allow-headers, %s", headerStr) - } else { - headerStr = "access-control-allow-origin, access-control-allow-headers" - } - if origin != "" { - c.Writer.Header().Set("Access-Control-Allow-Origin", "*") - c.Header("Access-Control-Allow-Origin", "*") // 这是允许访问所有域 - c.Header("Access-Control-Allow-Methods", "POST, GET, OPTIONS, PUT, DELETE,UPDATE") //服务器支持的所有跨域请求的方法,为了避免浏览次请求的多次'预检'请求 - // header的类型 - c.Header("Access-Control-Allow-Headers", "Authorization, Content-Length, X-CSRF-Token, Token,session,X_Requested_With,Accept, Origin, Host, Connection, Accept-Encoding, Accept-Language,DNT, X-CustomHeader, Keep-Alive, User-Agent, X-Requested-With, If-Modified-Since, Cache-Control, Content-Type, Pragma") - // 允许跨域设置 可以返回其他子段 - c.Header("Access-Control-Expose-Headers", "Content-Length, Access-Control-Allow-Origin, Access-Control-Allow-Headers,Cache-Control,Content-Language,Content-Type,Expires,Last-Modified,Pragma,FooBar") // 跨域关键设置 让浏览器可以解析 - c.Header("Access-Control-Max-Age", "172800") // 缓存请求信息 单位为秒 - c.Header("Access-Control-Allow-Credentials", "false") // 跨域请求是否需要带cookie信息 默认设置为true - c.Set("content-type", "application/json") // 设置返回格式是json - } - - //放行所有OPTIONS方法 - if method == "OPTIONS" { - c.JSON(http.StatusOK, "Options Request!") - } - // 处理请求 - c.Next() // 处理请求 - } -} - type ObjectQuery struct { Uid int64 Platform string diff --git a/goserver/middleware.go b/goserver/middleware.go new file mode 100644 index 0000000..3a65c73 --- /dev/null +++ b/goserver/middleware.go @@ -0,0 +1,45 @@ +package main + +import ( + "fmt" + "net/http" + "strings" + + "github.com/gin-gonic/gin" +) + +func Cors() gin.HandlerFunc { + return func(c *gin.Context) { + method := c.Request.Method //请求方法 + origin := c.Request.Header.Get("Origin") //请求头部 + var headerKeys []string // 声明请求头keys + for k := range c.Request.Header { + headerKeys = append(headerKeys, k) + } + headerStr := strings.Join(headerKeys, ", ") + if headerStr != "" { + headerStr = fmt.Sprintf("access-control-allow-origin, access-control-allow-headers, %s", headerStr) + } else { + headerStr = "access-control-allow-origin, access-control-allow-headers" + } + if origin != "" { + c.Writer.Header().Set("Access-Control-Allow-Origin", "*") + c.Header("Access-Control-Allow-Origin", "*") // 这是允许访问所有域 + c.Header("Access-Control-Allow-Methods", "POST, GET, OPTIONS, PUT, DELETE,UPDATE") //服务器支持的所有跨域请求的方法,为了避免浏览次请求的多次'预检'请求 + // header的类型 + c.Header("Access-Control-Allow-Headers", "Authorization, Content-Length, X-CSRF-Token, Token,session,X_Requested_With,Accept, Origin, Host, Connection, Accept-Encoding, Accept-Language,DNT, X-CustomHeader, Keep-Alive, User-Agent, X-Requested-With, If-Modified-Since, Cache-Control, Content-Type, Pragma") + // 允许跨域设置 可以返回其他子段 + c.Header("Access-Control-Expose-Headers", "Content-Length, Access-Control-Allow-Origin, Access-Control-Allow-Headers,Cache-Control,Content-Language,Content-Type,Expires,Last-Modified,Pragma,FooBar") // 跨域关键设置 让浏览器可以解析 + c.Header("Access-Control-Max-Age", "172800") // 缓存请求信息 单位为秒 + c.Header("Access-Control-Allow-Credentials", "false") // 跨域请求是否需要带cookie信息 默认设置为true + c.Set("content-type", "application/json") // 设置返回格式是json + } + + //放行所有OPTIONS方法 + if method == "OPTIONS" { + c.JSON(http.StatusOK, "Options Request!") + } + // 处理请求 + c.Next() // 处理请求 + } +} diff --git a/src/App.js b/src/App.js index 7a4c58e..b11d62b 100644 --- a/src/App.js +++ b/src/App.js @@ -1,30 +1,34 @@ -import Icon, { +import { MenuFoldOutlined, MenuUnfoldOutlined, - DatabaseOutlined, DatabaseFilled + DatabaseFilled } from '@ant-design/icons'; -import { Row, Col, Divider } from 'antd'; import { Button, Layout, Menu, Tabs } from 'antd'; import 'antd/dist/antd.css'; -import {Swtich, Route, Router, HashHistory, Link} from 'react-router-dom'; -import React from 'react'; +import React, {useRef} from 'react'; import './App.less'; -import DataTable from './Table'; -import ContentTable from './ContentTable'; -import DataTableTest from './TableTest'; import ChartsCount from './ChartsCount'; +import TableData from './TableData'; +import TabsRoute from './Router'; +import { Link, Route, Router, HashRouter, Switch } from 'react-router-dom'; -const { TabPane } = Tabs; -const bstyle = { width: "100px" }; +const { TabPane } = Tabs; const { Header, Content, Footer, Sider } = Layout; class App extends React.Component { - state = { - platform: "openrec", - collapsed: false, - tkey: "content_table", - }; + + constructor(props) { + super(props) + this.state = { + platform: "openrec", + collapsed: false, + tkey: "content_table", + location: null, + } + } + + toggleCollapsed = () => { this.setState({ @@ -33,90 +37,110 @@ class App extends React.Component { }; changePlatform = (p) => { - this.setState({platform: p}); - if (this.refs.tcharts && this.refs.tcharts.state.platform !== p) { - this.refs.tcharts.changePlatform(p) - } - this.refs.ctable.changePlatform(p); + // this.setState({ platform: p }); + // if (this.chartscount && this.chartscount.state.platform !== p) { + // this.chartscount.changePlatform(p) + // } + // this.tabledata.changePlatform(p); } render() { return ( - + + - + - } onClick={(e)=>{ this.changePlatform(e.key); }} > - openrec - - } onClick={(e)=>{ this.changePlatform(e.key); ; }} > - twitcasting - - } onClick={(e)=>{ this.changePlatform(e.key); }} > - twitch - + } onClick={(e) => { this.changePlatform(e.key); }} > + openrec + + } onClick={(e) => { this.changePlatform(e.key);; }} > + twitcasting + + } onClick={(e) => { this.changePlatform(e.key); }} > + twitch + - - -
- -
- - { - const { platform } = this.state; - this.setState({key: e}) + + + +
- switch (e) { - case "content_table": - if (this.refs.ctable) { - this.refs.ctable.changePlatform(platform); +
+ + + + { + const { platform } = this.state; + this.setState({ key: e }) + + switch (e) { + case "content_table": + this.props.history.push("#/data") + if (this.refs.ctable) { + this.refs.ctable.changePlatform(platform); + } + break; + case "tag_count": + this.props.history.push("#/count") + if (this.refs.tcharts) { + this.refs.tcharts.changePlatform(platform); + } + break + default: + break; } - break; - case "tag_count": - if( this.refs.tcharts ) { - this.refs.tcharts.changePlatform(platform); - } - break - default: - break; - } + + }} > + - }} > - - - - - - - - - - -
- Intimate ©2020 Created by eson -
+ - - -); + + { + return + }} > + { + return + }} > + + + + { + return + }} > + { + return + }} > + + + + + + +
+ Intimate ©2020 Created by eson +
+ + + + ); } } // ReactDOM.render(, mountNode); - - export default App; \ No newline at end of file diff --git a/src/ChartsCount.js b/src/ChartsCount.js index def9a1b..c93a7a2 100644 --- a/src/ChartsCount.js +++ b/src/ChartsCount.js @@ -82,14 +82,17 @@ function getOption(state = {}) { } class ChartsCount extends React.Component { - - state = { - option: {}, - platform: this.props.platform, - data: {}, - countkey: "count", - title: "统计数量关系", - } + + constructor(props) { + super(props) + this.state = { + option: {}, + platform: this.props.platform, + data: {}, + countkey: "count", + title: "与数量关系", + } + } changePlatform = (p) => { this.setState({ platform: p }, () => { @@ -141,7 +144,6 @@ class ChartsCount extends React.Component { option={getOption(this.state)} style={{ height: '600px', width: '100%' }} className='react_for_echarts' /> - ); } diff --git a/src/ContentTable.js b/src/ContentTable.js deleted file mode 100644 index 9329910..0000000 --- a/src/ContentTable.js +++ /dev/null @@ -1,19 +0,0 @@ -import React from 'react'; -import DataTable from './Table.js'; - -class ContentTable extends React.Component { - - changePlatform = (p) => { - this.refs.table.updatePlatform(p); - } - - render() { - // const {platform} = this.state; - return (
- -
) - } -} - -export default ContentTable; - \ No newline at end of file diff --git a/src/Router.js b/src/Router.js new file mode 100644 index 0000000..067c886 --- /dev/null +++ b/src/Router.js @@ -0,0 +1,33 @@ +import React from 'react'; +import App from './App'; +import { HashRouter, Route, Switch, BrowserRouter, Redirect } from 'react-router-dom'; +import TableData from "./TableData"; +import ChartsCount from "./ChartsCount"; +import { Link } from 'react-router-dom'; +import { Button, Layout, Menu, Tabs } from 'antd'; + +const { TabPane } = Tabs; + + +const MainRouter = () => { + + return ( + + + {/* */} + + + + + + + ) + +}; + + +export default MainRouter; \ No newline at end of file diff --git a/src/Table.js b/src/Table.js deleted file mode 100644 index cb0d838..0000000 --- a/src/Table.js +++ /dev/null @@ -1,278 +0,0 @@ -import React, { useState } from 'react'; -import { Table, Input, Select, Tag, Row, Col } from 'antd'; -import './Table.less'; -import apihost from './Var'; - - const { Option } = Select; - - - - - - - - -class DataTable extends React.Component { - - - - state = { - data: [], - platform: "openrec", - pagination: { - current: 1, - pageSize: 20, - position: ["topLeft"], - }, - loading: false, - filters: null, - sorter: null, - }; - - expandedRow = (record) => { - - const ecolumns = [ - { - title: 'uid', - dataIndex: 'Uid', - key: 'Uid', - dataField:'uid', - }, - { - title: '直播地址', - dataIndex: 'LiveUrl', - key: 'LiveUrl', - dataField: 'live_url' - }, - { - title: '直播标题', - dataIndex: 'LiveTitle', - key: 'LiveTitle', - dataField:'live_title', - }, - { - title: '近直播开始时间', - dataIndex: 'LiveStartTime', - key: 'LiveStartTime', - dataField:'live_start_time', - }, - { - title: '近直播结束时间', - dataIndex: 'LiveEndTime', - key: 'LiveEndTime', - dataField:'live_end_time', - }, - ]; - - var data = [record]; - return ; - }; - - updatePlatform(p) { - - const { pagination, sorter, filters } = this.state; - // console.log("filters", filters); // ${filters?`&filters=${filters}`:""} - // console.log("sorter", sorter); - pagination.current = 1; - this.setState({ platform: p }, () => { - this.fetchapi({ - pagination, - sorter, - filters - }); - }); - - } - - componentDidMount() { - const { platform } = this.state; - this.updatePlatform(platform); - } - - handleTableChange = (pagination, filters, sorter) => { - - this.fetchapi({ - pagination, - sorter, - filters, - }); - }; - - fetchapi = (params = {}) => { - - const { pagination, sorter, filters } = params; - const { platform, } = this.state; - this.setState({ loading: true }); - // console.log("filters", filters); // ${filters?`&filters=${filters}`:""} - // console.log("sorter", sorter); - fetch(`${apihost}/${platform}/query?page=${pagination.current}&psize=${pagination.pageSize}${sorter?`&orderfield=${sorter.column?sorter.column.dataField:""}&ordertype=${sorter.order}`:""}`, { mode: "cors" }).then((response) => { - // console.log(response); - response.json().then( - (data) => { - var result = JSON.parse(data) - this.setState({ - loading: false, - data: result.Data ? result.Data : [], - pagination: { - ...params.pagination, - total: 100000, - }, - filters: filters, - sorter: sorter - }); - } - ) - }) - }; - - render() { - - let { data, pagination, loading, sorter, filters } = this.state; - // sorter = sorter || {}; - // filters = filters || {}; - - const columns = [ - { - title: '平台', - dataIndex: 'Platform', - editable: false, - key: 'Platform', - // width: "8%", - dataField: 'platform', - }, - { - title: 'userid', - dataIndex: 'UserId', - editable: false, - key: 'UserId', - dataField: 'user_id', - // width: "7%", - }, - { - title: '名称', - dataIndex: 'UserName', - editable: false, - key: 'UserName', - dataField: 'user_name', - // width: "7%", - }, - { - title: '观众数', - dataIndex: 'Views', - editable: false, - key: 'Views', - dataField: 'views', - sorter: (a, b) => a.Views - b.Views, - sortDirections: ['descend', 'ascend'], - ellipsis: false, - // width: "7%", - }, - { - title: '标签', - dataIndex: 'Tags', - editable: false, - dataField: 'tags', - render: tags => ( - <> - { - tags != null ? - tags.map(tag => { - let color = "purple"; - if (tag.length < 3) { - color = 'green'; - } else if (tag.length < 6) { - color = 'geekblue'; - } else if (tag.length < 9) { - color = 'volcano'; - } - - return ( - - {tag} - - ); - } - - ) : null} - ) - }, - { - title: '粉丝数(关注)', - dataIndex: 'Followers', - key: 'Followers', - width: "8%", - dataField: 'followers', - sorter: (a, b) => a.Followers - b.Followers, - // sortOrder: sorter.columnKey === 'Gratuity' && sorter.order, - sortDirections: ['descend', 'ascend'], - ellipsis: false, - }, - { - title: '礼物数(币|钱)', - dataIndex: 'Gratuity', - key: 'Gratuity', - width: "8%", - dataField: 'gratuity', - // defaultSortOrder: 'ascend', - // filterMultiple: false, - // onFilter: (value, record)=>{ console.log(record, value) ;return record.Gratuity >= value;}, - sorter: (a, b) => a.Gratuity - b.Gratuity, - // sortOrder: sorter.columnKey === 'Gratuity' && sorter.order, - sortDirections: ['descend', 'ascend'], - ellipsis: false, - }, - { - title: '数据更新时间', - dataIndex: 'UpdateTime', - key: 'UpdateTime', - dataField: 'update_time', - // width: "7%", - }, - ]; - - return ( -
- -{/* -
- - - - - - - - - - - - */} - - - -
- - - - ); - } -}; - -export default DataTable; -// \ No newline at end of file diff --git a/src/TableData.js b/src/TableData.js new file mode 100644 index 0000000..5fb0b10 --- /dev/null +++ b/src/TableData.js @@ -0,0 +1,233 @@ +import React from 'react'; +import { Table, Tag } from 'antd'; +import './TableData.less'; +import apihost from './Var'; + +class TableData extends React.Component { + constructor(props) { + super(props) + this.state = { + data: [], + platform: "openrec", + pagination: { + current: 1, + pageSize: 20, + position: ["topLeft"], + }, + loading: false, + filters: null, + sorter: null, + } + } + + expandedRow = (record) => { + + const ecolumns = [ + { + title: 'uid', + dataIndex: 'Uid', + key: 'Uid', + dataField: 'uid', + }, + { + title: '直播地址', + dataIndex: 'LiveUrl', + key: 'LiveUrl', + dataField: 'live_url' + }, + { + title: '直播标题', + dataIndex: 'LiveTitle', + key: 'LiveTitle', + dataField: 'live_title', + }, + { + title: '近直播开始时间', + dataIndex: 'LiveStartTime', + key: 'LiveStartTime', + dataField: 'live_start_time', + }, + { + title: '近直播结束时间', + dataIndex: 'LiveEndTime', + key: 'LiveEndTime', + dataField: 'live_end_time', + }, + ]; + + var data = [record]; + return
; + }; + + changePlatform(p) { + const { pagination, sorter, filters } = this.state; + pagination.current = 1; + this.setState({ platform: p }, () => { + this.fetchapi({ + pagination, + sorter, + filters + }); + }); + } + + componentDidMount() { + const { platform } = this.state; + this.changePlatform(platform); + } + + handleTableChange = (pagination, filters, sorter) => { + this.fetchapi({ + pagination, + sorter, + filters, + }); + }; + + fetchapi = (params = {}) => { + + const { pagination, sorter, filters } = params; + const { platform, } = this.state; + this.setState({ loading: true }); + fetch(`${apihost}/${platform}/query?page=${pagination.current}&psize=${pagination.pageSize}${sorter ? `&orderfield=${sorter.column ? sorter.column.dataField : ""}&ordertype=${sorter.order}` : ""}`, { mode: "cors" }).then((response) => { + response.json().then( + (data) => { + var result = JSON.parse(data) + this.setState({ + loading: false, + data: result.Data ? result.Data : [], + pagination: { + ...params.pagination, + total: 100000, + }, + filters: filters, + sorter: sorter + }); + } + ) + }) + }; + + render() { + + let { data, pagination, loading } = this.state; + + const columns = [ + { + title: '平台', + dataIndex: 'Platform', + editable: false, + key: 'Platform', + // width: "8%", + dataField: 'platform', + }, + { + title: 'userid', + dataIndex: 'UserId', + editable: false, + key: 'UserId', + dataField: 'user_id', + // width: "7%", + }, + { + title: '名称', + dataIndex: 'UserName', + editable: false, + key: 'UserName', + dataField: 'user_name', + // width: "7%", + }, + { + title: '观众数', + dataIndex: 'Views', + editable: false, + key: 'Views', + dataField: 'views', + sorter: (a, b) => a.Views - b.Views, + sortDirections: ['descend', 'ascend'], + ellipsis: false, + // width: "7%", + }, + { + title: '标签', + dataIndex: 'Tags', + editable: false, + dataField: 'tags', + render: tags => ( + <> + { + tags != null ? + tags.map(tag => { + let color = "purple"; + if (tag.length < 3) { + color = 'green'; + } else if (tag.length < 6) { + color = 'geekblue'; + } else if (tag.length < 9) { + color = 'volcano'; + } + + return ( + + {tag} + + ); + } + + ) : null} + ) + }, + { + title: '粉丝数(关注)', + dataIndex: 'Followers', + key: 'Followers', + width: "8%", + dataField: 'followers', + sorter: (a, b) => a.Followers - b.Followers, + // sortOrder: sorter.columnKey === 'Gratuity' && sorter.order, + sortDirections: ['descend', 'ascend'], + ellipsis: false, + }, + { + title: '礼物数(币|钱)', + dataIndex: 'Gratuity', + key: 'Gratuity', + width: "8%", + dataField: 'gratuity', + // defaultSortOrder: 'ascend', + // filterMultiple: false, + // onFilter: (value, record)=>{ console.log(record, value) ;return record.Gratuity >= value;}, + sorter: (a, b) => a.Gratuity - b.Gratuity, + // sortOrder: sorter.columnKey === 'Gratuity' && sorter.order, + sortDirections: ['descend', 'ascend'], + ellipsis: false, + }, + { + title: '数据更新时间', + dataIndex: 'UpdateTime', + key: 'UpdateTime', + dataField: 'update_time', + // width: "7%", + }, + ]; + + return ( +
+
+ + ); + } +}; + +export default TableData; +// \ No newline at end of file diff --git a/src/Table.less b/src/TableData.less similarity index 100% rename from src/Table.less rename to src/TableData.less diff --git a/src/TableTest.js b/src/TableDataTest.js similarity index 91% rename from src/TableTest.js rename to src/TableDataTest.js index 742c387..329a487 100644 --- a/src/TableTest.js +++ b/src/TableDataTest.js @@ -1,6 +1,5 @@ -import React, { useState } from 'react'; -import { Table, Badge, Menu, Dropdown, Space } from 'antd'; -import { DownOutlined } from '@ant-design/icons'; +import React from 'react'; +import { Table } from 'antd'; diff --git a/src/Var.js b/src/Var.js index 3c9c20c..21907d0 100644 --- a/src/Var.js +++ b/src/Var.js @@ -1,5 +1,5 @@ -var apihost = "http://192.168.16.130:5500" +var apihost = "http://localhost:5500" export default apihost; \ No newline at end of file diff --git a/src/index.js b/src/index.js index f5185c1..e226e94 100644 --- a/src/index.js +++ b/src/index.js @@ -2,11 +2,13 @@ import React from 'react'; import ReactDOM from 'react-dom'; import './index.css'; import App from './App'; +import MainRouter from './Router'; import * as serviceWorker from './serviceWorker'; +import { Route } from 'react-router-dom'; ReactDOM.render( - + , document.getElementById('root') ); diff --git a/start.sh b/start.sh index 5a192f5..d0aa103 100644 --- a/start.sh +++ b/start.sh @@ -1,2 +1,2 @@ cd goserver && screen -dmS initmate_web -L ./intimate_server && cd .. -screen -dmS yarn-intimate yarn start +screen -L -dmS yarn-intimate yarn start