feat: 基本流程打通

This commit is contained in:
mozzie 2024-01-30 20:40:12 +08:00
commit 33364d76ee
37 changed files with 7962 additions and 0 deletions

3
.gitignore vendored Normal file
View File

@ -0,0 +1,3 @@
**/node_modules
**/.DS_Store
**/dist

25
apps/api/.eslintrc.js Normal file
View File

@ -0,0 +1,25 @@
module.exports = {
parser: '@typescript-eslint/parser',
parserOptions: {
project: 'tsconfig.json',
tsconfigRootDir: __dirname,
sourceType: 'module',
},
plugins: ['@typescript-eslint/eslint-plugin'],
extends: [
'plugin:@typescript-eslint/recommended',
'plugin:prettier/recommended',
],
root: true,
env: {
node: true,
jest: true,
},
ignorePatterns: ['.eslintrc.js'],
rules: {
'@typescript-eslint/interface-name-prefix': 'off',
'@typescript-eslint/explicit-function-return-type': 'off',
'@typescript-eslint/explicit-module-boundary-types': 'off',
'@typescript-eslint/no-explicit-any': 'off',
},
};

35
apps/api/.gitignore vendored Normal file
View File

@ -0,0 +1,35 @@
# compiled output
/dist
/node_modules
# Logs
logs
*.log
npm-debug.log*
pnpm-debug.log*
yarn-debug.log*
yarn-error.log*
lerna-debug.log*
# OS
.DS_Store
# Tests
/coverage
/.nyc_output
# IDEs and editors
/.idea
.project
.classpath
.c9/
*.launch
.settings/
*.sublime-workspace
# IDE - VSCode
.vscode/*
!.vscode/settings.json
!.vscode/tasks.json
!.vscode/launch.json
!.vscode/extensions.json

4
apps/api/.prettierrc Normal file
View File

@ -0,0 +1,4 @@
{
"singleQuote": true,
"trailingComma": "all"
}

73
apps/api/README.md Normal file
View File

@ -0,0 +1,73 @@
<p align="center">
<a href="http://nestjs.com/" target="blank"><img src="https://nestjs.com/img/logo-small.svg" width="200" alt="Nest Logo" /></a>
</p>
[circleci-image]: https://img.shields.io/circleci/build/github/nestjs/nest/master?token=abc123def456
[circleci-url]: https://circleci.com/gh/nestjs/nest
<p align="center">A progressive <a href="http://nodejs.org" target="_blank">Node.js</a> framework for building efficient and scalable server-side applications.</p>
<p align="center">
<a href="https://www.npmjs.com/~nestjscore" target="_blank"><img src="https://img.shields.io/npm/v/@nestjs/core.svg" alt="NPM Version" /></a>
<a href="https://www.npmjs.com/~nestjscore" target="_blank"><img src="https://img.shields.io/npm/l/@nestjs/core.svg" alt="Package License" /></a>
<a href="https://www.npmjs.com/~nestjscore" target="_blank"><img src="https://img.shields.io/npm/dm/@nestjs/common.svg" alt="NPM Downloads" /></a>
<a href="https://circleci.com/gh/nestjs/nest" target="_blank"><img src="https://img.shields.io/circleci/build/github/nestjs/nest/master" alt="CircleCI" /></a>
<a href="https://coveralls.io/github/nestjs/nest?branch=master" target="_blank"><img src="https://coveralls.io/repos/github/nestjs/nest/badge.svg?branch=master#9" alt="Coverage" /></a>
<a href="https://discord.gg/G7Qnnhy" target="_blank"><img src="https://img.shields.io/badge/discord-online-brightgreen.svg" alt="Discord"/></a>
<a href="https://opencollective.com/nest#backer" target="_blank"><img src="https://opencollective.com/nest/backers/badge.svg" alt="Backers on Open Collective" /></a>
<a href="https://opencollective.com/nest#sponsor" target="_blank"><img src="https://opencollective.com/nest/sponsors/badge.svg" alt="Sponsors on Open Collective" /></a>
<a href="https://paypal.me/kamilmysliwiec" target="_blank"><img src="https://img.shields.io/badge/Donate-PayPal-ff3f59.svg"/></a>
<a href="https://opencollective.com/nest#sponsor" target="_blank"><img src="https://img.shields.io/badge/Support%20us-Open%20Collective-41B883.svg" alt="Support us"></a>
<a href="https://twitter.com/nestframework" target="_blank"><img src="https://img.shields.io/twitter/follow/nestframework.svg?style=social&label=Follow"></a>
</p>
<!--[![Backers on Open Collective](https://opencollective.com/nest/backers/badge.svg)](https://opencollective.com/nest#backer)
[![Sponsors on Open Collective](https://opencollective.com/nest/sponsors/badge.svg)](https://opencollective.com/nest#sponsor)-->
## Description
[Nest](https://github.com/nestjs/nest) framework TypeScript starter repository.
## Installation
```bash
$ pnpm install
```
## Running the app
```bash
# development
$ pnpm run start
# watch mode
$ pnpm run start:dev
# production mode
$ pnpm run start:prod
```
## Test
```bash
# unit tests
$ pnpm run test
# e2e tests
$ pnpm run test:e2e
# test coverage
$ pnpm run test:cov
```
## Support
Nest is an MIT-licensed open source project. It can grow thanks to the sponsors and support by the amazing backers. If you'd like to join them, please [read more here](https://docs.nestjs.com/support).
## Stay in touch
- Author - [Kamil Myśliwiec](https://kamilmysliwiec.com)
- Website - [https://nestjs.com](https://nestjs.com/)
- Twitter - [@nestframework](https://twitter.com/nestframework)
## License
Nest is [MIT licensed](LICENSE).

8
apps/api/nest-cli.json Normal file
View File

@ -0,0 +1,8 @@
{
"$schema": "https://json.schemastore.org/nest-cli",
"collection": "@nestjs/schematics",
"sourceRoot": "src",
"compilerOptions": {
"deleteOutDir": true
}
}

72
apps/api/package.json Normal file
View File

@ -0,0 +1,72 @@
{
"name": "@prome/api",
"version": "0.0.1",
"description": "",
"author": "",
"private": true,
"license": "UNLICENSED",
"scripts": {
"build": "nest build",
"format": "prettier --write \"src/**/*.ts\" \"test/**/*.ts\"",
"start": "nest start",
"start:dev": "nest start --watch",
"start:debug": "nest start --debug --watch",
"start:prod": "node dist/main",
"lint": "eslint \"{src,apps,libs,test}/**/*.ts\" --fix",
"test": "jest",
"test:watch": "jest --watch",
"test:cov": "jest --coverage",
"test:debug": "node --inspect-brk -r tsconfig-paths/register -r ts-node/register node_modules/.bin/jest --runInBand",
"test:e2e": "jest --config ./test/jest-e2e.json"
},
"dependencies": {
"@nestjs/common": "^10.0.0",
"@nestjs/core": "^10.0.0",
"@nestjs/platform-express": "^10.0.0",
"@nestjs/typeorm": "^10.0.1",
"mysql2": "3.8.0",
"reflect-metadata": "^0.1.13",
"rxjs": "^7.8.1",
"typeorm": "^0.3.20"
},
"devDependencies": {
"@nestjs/cli": "^10.0.0",
"@nestjs/schematics": "^10.0.0",
"@nestjs/testing": "^10.0.0",
"@types/express": "^4.17.17",
"@types/jest": "^29.5.2",
"@types/node": "^20.3.1",
"@types/supertest": "^6.0.0",
"@typescript-eslint/eslint-plugin": "^6.0.0",
"@typescript-eslint/parser": "^6.0.0",
"eslint": "^8.42.0",
"eslint-config-prettier": "^9.0.0",
"eslint-plugin-prettier": "^5.0.0",
"jest": "^29.5.0",
"prettier": "^3.0.0",
"source-map-support": "^0.5.21",
"supertest": "^6.3.3",
"ts-jest": "^29.1.0",
"ts-loader": "^9.4.3",
"ts-node": "^10.9.1",
"tsconfig-paths": "^4.2.0",
"typescript": "^5.1.3"
},
"jest": {
"moduleFileExtensions": [
"js",
"json",
"ts"
],
"rootDir": "src",
"testRegex": ".*\\.spec\\.ts$",
"transform": {
"^.+\\.(t|j)s$": "ts-jest"
},
"collectCoverageFrom": [
"**/*.(t|j)s"
],
"coverageDirectory": "../coverage",
"testEnvironment": "node"
}
}

View File

@ -0,0 +1,18 @@
import { Body, Controller, Get, Param, Post } from '@nestjs/common';
import { AppService } from './app.service';
import { Danmu } from './danmu/danmu.entity';
@Controller('/api')
export class AppController {
constructor(private readonly appService: AppService) {}
@Post('/top')
async top(): Promise<Danmu[]> {
return await this.appService.top();
}
@Get('/msg_content/:user_id')
async msgContent(@Param('user_id') user_id: string) {
return await this.appService.msgContent(user_id);
}
}

View File

@ -0,0 +1,25 @@
import { Module } from '@nestjs/common';
import { AppController } from './app.controller';
import { AppService } from './app.service';
import { TypeOrmModule } from '@nestjs/typeorm';
import { Danmu } from './danmu/danmu.entity';
@Module({
imports: [
TypeOrmModule.forRoot({
type: 'mysql',
host: 'sh-cdb-qlkmuvd2.sql.tencentcdb.com',
port: 63982,
username: 'root',
password: 'cr654654.',
database: 'demo',
entities: [__dirname + '/**/*.entity{.ts,.js}'],
// synchronize: true,
timezone: 'Asia/Shanghai', // 这里设置了时区
}),
TypeOrmModule.forFeature([Danmu]),
],
controllers: [AppController],
providers: [AppService],
})
export class AppModule {}

View File

@ -0,0 +1,47 @@
import { Injectable } from '@nestjs/common';
import { InjectRepository } from '@nestjs/typeorm';
import { Danmu } from './danmu/danmu.entity';
import { MoreThan, Repository } from 'typeorm';
@Injectable()
export class AppService {
constructor(
@InjectRepository(Danmu)
private readonly danmuRepository: Repository<Danmu>,
) {}
async top(): Promise<Danmu[]> {
const data = await this.danmuRepository
.createQueryBuilder('danmu')
.select([
'user_id',
'MAX(CAST(danmu.user_level AS UNSIGNED)) as user_level',
'MAX(danmu.user_nickName) as user_nickName',
'MAX(danmu.user_fans_club_level) as user_fans_club_level',
'MAX(danmu.user_isAdmin) as user_isAdmin',
'MAX(danmu.user_is_super_admin) as user_is_super_admin',
])
.where('CAST(danmu.user_level AS UNSIGNED) > :level', { level: 20 })
.groupBy('user_id')
.orderBy('user_level', 'DESC')
.getRawMany();
for (const item of data) {
const { user_id } = item;
const msg_contents = await this.danmuRepository.find({
select: ['msg_content'],
where: { user_id },
});
item.msg_contents = msg_contents;
}
return data;
}
async msgContent(user_id) {
const data = await this.danmuRepository.find({
select: ['msg_content'],
where: { user_id },
});
return data;
}
}

View File

@ -0,0 +1,61 @@
import {
Column,
CreateDateColumn,
Entity,
PrimaryGeneratedColumn,
UpdateDateColumn,
} from 'typeorm';
@Entity()
export class Danmu {
@PrimaryGeneratedColumn()
id: number;
@Column('varchar')
user_id: string;
@Column('text')
user_nickName: string;
@Column('varchar')
user_avatar: string;
@Column('varchar')
user_gender: string;
@Column('tinyint')
user_isAdmin: number;
@Column('tinyint')
user_is_super_admin: number;
@Column('varchar')
user_level: string;
@Column('varchar')
user_fans_club_level: string;
@Column('varchar')
user_fans_club_name: string;
@Column('varchar')
user_follower_count: string;
@Column('varchar')
user_display_id: string;
@Column('tinyint')
isGift: number;
@Column('varchar')
gift_id: string;
@Column('varchar')
gift_number: string;
@Column('text')
msg_content: string;
@Column('varchar')
create_time: string;
}

8
apps/api/src/main.ts Normal file
View File

@ -0,0 +1,8 @@
import { NestFactory } from '@nestjs/core';
import { AppModule } from './app.module';
async function bootstrap() {
const app = await NestFactory.create(AppModule);
await app.listen(3000);
}
bootstrap();

View File

@ -0,0 +1,24 @@
import { Test, TestingModule } from '@nestjs/testing';
import { INestApplication } from '@nestjs/common';
import * as request from 'supertest';
import { AppModule } from './../src/app.module';
describe('AppController (e2e)', () => {
let app: INestApplication;
beforeEach(async () => {
const moduleFixture: TestingModule = await Test.createTestingModule({
imports: [AppModule],
}).compile();
app = moduleFixture.createNestApplication();
await app.init();
});
it('/ (GET)', () => {
return request(app.getHttpServer())
.get('/')
.expect(200)
.expect('Hello World!');
});
});

View File

@ -0,0 +1,9 @@
{
"moduleFileExtensions": ["js", "json", "ts"],
"rootDir": ".",
"testEnvironment": "node",
"testRegex": ".e2e-spec.ts$",
"transform": {
"^.+\\.(t|j)s$": "ts-jest"
}
}

View File

@ -0,0 +1,4 @@
{
"extends": "./tsconfig.json",
"exclude": ["node_modules", "test", "dist", "**/*spec.ts"]
}

21
apps/api/tsconfig.json Normal file
View File

@ -0,0 +1,21 @@
{
"compilerOptions": {
"module": "commonjs",
"declaration": true,
"removeComments": true,
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"allowSyntheticDefaultImports": true,
"target": "ES2021",
"sourceMap": true,
"outDir": "./dist",
"baseUrl": "./",
"incremental": true,
"skipLibCheck": true,
"strictNullChecks": false,
"noImplicitAny": false,
"strictBindCallApply": false,
"forceConsistentCasingInFileNames": false,
"noFallthroughCasesInSwitch": false
}
}

34
apps/demo/app.js Normal file
View File

@ -0,0 +1,34 @@
import { WebSocketServer } from "ws";
import { pool, insert } from "./crud.js";
const getTime = () => `[${new Date().toLocaleTimeString()}]`;
const wss = new WebSocketServer({ port: 9527 });
wss.on("connection", function connection(ws) {
console.log("客户端连接成功");
ws.on("message", function message(data) {
let message = JSON.parse(data.toString());
console.log(message);
switch (message.action) {
case "message":
console.log(
getTime(),
message.message.user_nickName + ":" + message.message.msg_content
);
insert(pool, { ...message.message, create_time: getTime() });
break;
case "join":
console.log(
getTime(),
message.message.user_nickName + ":" + message.message.msg_content
);
break;
}
wss.clients.forEach((cen) => {
cen.send(JSON.stringify(message));
});
});
});
console.log("打开-> http://127.0.0.1:9527");

11
apps/demo/client.js Normal file
View File

@ -0,0 +1,11 @@
window.onDouyinServer = function () {
new Barrage()
}
console.clear()
console.log(`[${new Date().toLocaleTimeString()}]`, '正在载入JS,请稍后..')
console.log(`[${new Date().toLocaleTimeString()}]`, '如需删除直播画面,请在控制台输入: removeVideoLayer()')
var scriptElement = document.createElement('script')
scriptElement.src = 'http://127.0.0.1:5500/apps/demo/index.js?t=' + Math.random()
document.body.appendChild(scriptElement)
removeVideoLayer()

65
apps/demo/crud.js Normal file
View File

@ -0,0 +1,65 @@
import mysql from "mysql2/promise";
import * as sanitizeHtml from 'sanitize-html';
export const pool = mysql.createPool({
connectionLimit: 10, // 连接池允许的最大连接数
host: "sh-cdb-qlkmuvd2.sql.tencentcdb.com",
port: 63982,
user: "root",
password: "cr654654.",
database: "demo",
waitForConnections: true,
maxIdle: 10, // max idle connections, the default value is the same as `connectionLimit`
idleTimeout: 60000, // idle connections timeout, in milliseconds, the default value 60000
queueLimit: 0,
enableKeepAlive: true,
keepAliveInitialDelay: 0,
});
export const insert = async (pool, data) => {
const {
msg_content,
user_id,
user_nickName,
user_avatar,
user_gender,
user_isAdmin,
user_is_super_admin,
user_level,
user_fans_club_level,
user_fans_club_name,
user_follower_count,
user_display_id,
isGift,
gift_id,
gift_number,
create_time,
} = data;
try {
const [rows, fields] = await pool.execute(
"INSERT INTO danmu(msg_content,user_id,user_nickName,user_avatar,user_gender,user_isAdmin,user_is_super_admin,user_level,user_fans_club_level,user_fans_club_name,user_follower_count,user_display_id,isGift,gift_id,gift_number,create_time) VALUES(?,?,?,?,?,?,?,?,?,?,?,?,?,?,?,?)",
[
msg_content ?? "",
user_id ?? "",
user_nickName ?? "",
user_avatar ?? "",
user_gender ?? "",
user_isAdmin ?? false,
user_is_super_admin ?? false,
user_level ?? "",
user_fans_club_level ?? "",
user_fans_club_name ?? "",
user_follower_count ?? "",
user_display_id ?? "",
isGift ?? false,
gift_id ?? "",
gift_number ?? "",
create_time ?? "",
]
);
console.log("Insert successful:", rows);
} catch (error) {
console.error("Error in insertion:", error);
}
};

194
apps/demo/index.js Normal file
View File

@ -0,0 +1,194 @@
const Barrage = class {
wsurl = "ws://localhost:9527"
timer = null
timeinterval = 10 * 1000 // 断线重连轮询间隔
propsId = null
chatDom = null
roomJoinDom = null
ws = null
observer = null
chatObserverrom = null
option = {}
event = {}
eventRegirst = {}
constructor(option = { message: true }) {
this.option = option
let { link, removePlay } = option
if (link) {
this.wsurl = link
}
if (removePlay) {
document.querySelector('.basicPlayer').remove()
}
this.propsId = Object.keys(document.querySelector('.webcast-chatroom___list'))[1]
this.chatDom = document.querySelector('.webcast-chatroom___items').children[0]
this.roomJoinDom = document.querySelector('.webcast-chatroom___bottom-message')
this.ws = new WebSocket(this.wsurl)
this.ws.onclose = this.wsClose
this.ws.onopen = () => {
this.openWs()
}
}
// 消息事件 , join, message
on(e, cb) {
this.eventRegirst[e] = true
this.event[e] = cb
}
openWs() {
console.log(`[${new Date().toLocaleTimeString()}]`, '服务已经连接成功!')
clearInterval(this.timer)
this.runServer()
}
wsClose() {
console.log('服务器断开')
if (this.timer !== null) {
return
}
this.observer && this.observer.disconnect();
this.chatObserverrom && this.chatObserverrom.disconnect();
this.timer = setInterval(() => {
console.log('正在等待服务器启动..')
this.ws = new WebSocket(wsurl);
console.log('状态 ->', this.ws.readyState)
setTimeout(() => {
if (this.ws.readyState === 1) {
openWs()
}
}, 2000)
}, this.timeinterval)
}
runServer() {
let _this = this
if (this.option.join) {
this.observer = new MutationObserver((mutationsList) => {
for (let mutation of mutationsList) {
if (mutation.type === 'childList' && mutation.addedNodes.length) {
let dom = mutation.addedNodes[0]
let user = dom[this.propsId].children.props.message.payload.user
let msg = {
...this.getUser(user),
... { msg_content: `${user.nickname} 来了` }
}
if (this.eventRegirst.join) {
this.event['join'](msg)
}
this.ws.send(JSON.stringify({ action: 'join', message: msg }));
}
}
});
this.observer.observe(this.roomJoinDom, { childList: true });
}
this.chatObserverrom = new MutationObserver((mutationsList, observer) => {
for (let mutation of mutationsList) {
if (mutation.type === 'childList' && mutation.addedNodes.length) {
let b = mutation.addedNodes[0]
if (b[this.propsId].children.props.message) {
let message = this.messageParse(b)
if (message) {
if (this.eventRegirst.message) {
this.event['join'](message)
}
if (_this.option.message === false && !message.isGift) {
return
}
this.ws.send(JSON.stringify({ action: 'message', message: message }));
}
}
}
}
});
this.chatObserverrom.observe(this.chatDom, { childList: true });
}
getUser(user) {
if (!user) {
return
}
let msg = {
user_id: user.id,
user_nickName: user.nickname,
user_avatar: user.avatar_thumb.url_list[0],
user_gender: user.gender === 1 ? '男' : '女',
user_isAdmin: user.user_attr.is_admin,
user_is_super_admin: user.user_attr.is_super_admin,
user_level: user.pay_grade.level,
user_fans_club_level: user.fans_club?.data.level ?? '',
user_fans_club_name: user.fans_club?.data.club_name ?? '',
user_follower_count: user.follow_info.follower_count,
user_display_id: user.display_id
}
return msg
}
getLevel(arr, type) {
if (!arr || arr.length === 0) {
return 0
}
let item = arr.find(i => {
return i.imageType === type
})
if (item) {
return parseInt(item.content.level)
} else {
return 0
}
}
messageParse(dom) {
if (!dom[this.propsId].children.props.message) {
return null
}
let msg = dom[this.propsId].children.props.message.payload
let result = {
repeatCount: null,
gift_id: null,
gift_name: null,
gift_number: null,
gift_image: null,
gift_diamondCount: null,
gift_describe: null,
}
console.log('msg.user', msg.user)
result = Object.assign(result, this.getUser(msg.user))
switch (msg.common.method) {
case 'WebcastGiftMessage':
result = Object.assign(result, {
// repeatCount: parseInt(),
msg_content: msg.common.describe,
isGift: true,
gift_id: msg.gift.id,
gift_name: msg.gift.name,
// gift_number: parseInt(msg.comboCount),
gift_number: parseInt(msg.repeatCount),
// gift_image: msg.gift.icon.urlListList[0],
gift_diamondCount: msg.gift.diamondCount,
gift_describe: msg.gift.describe,
})
break
case 'WebcastChatMessage':
result = Object.assign(result, {
isGift: false,
msg_content: msg.content
})
break
default:
result = Object.assign(result, {
isGift: false,
msg_content: msg.content
})
break
}
return result
}
}
if (window.onDouyinServer) {
window.onDouyinServer()
}
window.removeVideoLayer = function () {
document.querySelector('.basicPlayer').remove()
console.log('删除画面成功,不影响弹幕信息接收')
}

18
apps/demo/package.json Normal file
View File

@ -0,0 +1,18 @@
{
"name": "@prome/demo",
"version": "1.0.0",
"description": "",
"main": "index.js",
"type": "module",
"scripts": {
"dev": "node ./app.js"
},
"keywords": [],
"author": "",
"license": "ISC",
"dependencies": {
"ws": "^8.16.0",
"mysql2": "3.8.0",
"sanitize-html":"2.11.0"
}
}

18
apps/viewer/.eslintrc.cjs Normal file
View File

@ -0,0 +1,18 @@
module.exports = {
root: true,
env: { browser: true, es2020: true },
extends: [
'eslint:recommended',
'plugin:@typescript-eslint/recommended',
'plugin:react-hooks/recommended',
],
ignorePatterns: ['dist', '.eslintrc.cjs'],
parser: '@typescript-eslint/parser',
plugins: ['react-refresh'],
rules: {
'react-refresh/only-export-components': [
'warn',
{ allowConstantExport: true },
],
},
}

24
apps/viewer/.gitignore vendored Normal file
View File

@ -0,0 +1,24 @@
# Logs
logs
*.log
npm-debug.log*
yarn-debug.log*
yarn-error.log*
pnpm-debug.log*
lerna-debug.log*
node_modules
dist
dist-ssr
*.local
# Editor directories and files
.vscode/*
!.vscode/extensions.json
.idea
.DS_Store
*.suo
*.ntvs*
*.njsproj
*.sln
*.sw?

30
apps/viewer/README.md Normal file
View File

@ -0,0 +1,30 @@
# React + TypeScript + Vite
This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.
Currently, two official plugins are available:
- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react/README.md) uses [Babel](https://babeljs.io/) for Fast Refresh
- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh
## Expanding the ESLint configuration
If you are developing a production application, we recommend updating the configuration to enable type aware lint rules:
- Configure the top-level `parserOptions` property like this:
```js
export default {
// other rules...
parserOptions: {
ecmaVersion: 'latest',
sourceType: 'module',
project: ['./tsconfig.json', './tsconfig.node.json'],
tsconfigRootDir: __dirname,
},
}
```
- Replace `plugin:@typescript-eslint/recommended` to `plugin:@typescript-eslint/recommended-type-checked` or `plugin:@typescript-eslint/strict-type-checked`
- Optionally add `plugin:@typescript-eslint/stylistic-type-checked`
- Install [eslint-plugin-react](https://github.com/jsx-eslint/eslint-plugin-react) and add `plugin:react/recommended` & `plugin:react/jsx-runtime` to the `extends` list

13
apps/viewer/index.html Normal file
View File

@ -0,0 +1,13 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Vite + React + TS</title>
</head>
<body>
<div id="root"></div>
<script type="module" src="/src/main.tsx"></script>
</body>
</html>

30
apps/viewer/package.json Normal file
View File

@ -0,0 +1,30 @@
{
"name": "@prome/viewer",
"private": true,
"version": "0.0.0",
"type": "module",
"scripts": {
"dev": "vite",
"build": "tsc && vite build",
"lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
"preview": "vite preview"
},
"dependencies": {
"antd": "^5.13.3",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"axios":"1.6.7"
},
"devDependencies": {
"@types/react": "^18.2.43",
"@types/react-dom": "^18.2.17",
"@typescript-eslint/eslint-plugin": "^6.14.0",
"@typescript-eslint/parser": "^6.14.0",
"@vitejs/plugin-react": "^4.2.1",
"eslint": "^8.55.0",
"eslint-plugin-react-hooks": "^4.6.0",
"eslint-plugin-react-refresh": "^0.4.5",
"typescript": "^5.2.2",
"vite": "^5.0.8"
}
}

View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="31.88" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 257"><defs><linearGradient id="IconifyId1813088fe1fbc01fb466" x1="-.828%" x2="57.636%" y1="7.652%" y2="78.411%"><stop offset="0%" stop-color="#41D1FF"></stop><stop offset="100%" stop-color="#BD34FE"></stop></linearGradient><linearGradient id="IconifyId1813088fe1fbc01fb467" x1="43.376%" x2="50.316%" y1="2.242%" y2="89.03%"><stop offset="0%" stop-color="#FFEA83"></stop><stop offset="8.333%" stop-color="#FFDD35"></stop><stop offset="100%" stop-color="#FFA800"></stop></linearGradient></defs><path fill="url(#IconifyId1813088fe1fbc01fb466)" d="M255.153 37.938L134.897 252.976c-2.483 4.44-8.862 4.466-11.382.048L.875 37.958c-2.746-4.814 1.371-10.646 6.827-9.67l120.385 21.517a6.537 6.537 0 0 0 2.322-.004l117.867-21.483c5.438-.991 9.574 4.796 6.877 9.62Z"></path><path fill="url(#IconifyId1813088fe1fbc01fb467)" d="M185.432.063L96.44 17.501a3.268 3.268 0 0 0-2.634 3.014l-5.474 92.456a3.268 3.268 0 0 0 3.997 3.378l24.777-5.718c2.318-.535 4.413 1.507 3.936 3.838l-7.361 36.047c-.495 2.426 1.782 4.5 4.151 3.78l15.304-4.649c2.372-.72 4.652 1.36 4.15 3.788l-11.698 56.621c-.732 3.542 3.979 5.473 5.943 2.437l1.313-2.028l72.516-144.72c1.215-2.423-.88-5.186-3.54-4.672l-25.505 4.922c-2.396.462-4.435-1.77-3.759-4.114l16.646-57.705c.677-2.35-1.37-4.583-3.769-4.113Z"></path></svg>

After

Width:  |  Height:  |  Size: 1.5 KiB

11
apps/viewer/src/App.tsx Normal file
View File

@ -0,0 +1,11 @@
import { Dashboard } from "./Dashboard";
function App() {
return (
<>
<Dashboard />
</>
);
}
export default App;

View File

@ -0,0 +1,66 @@
import { useState, useEffect } from "react";
import { Table, Button, Space } from "antd";
import axios from "axios";
export const Dashboard = () => {
const [dataSource, setDatasource] = useState<[]>([]);
useEffect(() => {
const fetchData = async () => {
const { data } = await axios.post("/api/top");
if (data)
setDatasource(
data.map((i: any) => ({
...i,
key: i.user_id,
nickName: i.user_nickName,
user_level: i.user_level,
user_fans_club_level: i.user_fans_club_level,
}))
);
};
fetchData();
}, []);
const columns = [
{
title: "昵称",
dataIndex: "nickName",
key: "nickName",
},
{
title: "身份",
key: "base",
render: (record) => {
return (
<Space>
<span>{record.user_isAdmin == 1 ? "管" : ""}</span>
<span>{record.user_is_super_admin == 1 ? "超" : ""}</span>
</Space>
);
},
},
{
title: "抖音级别",
dataIndex: "user_level",
key: "user_level",
},
{
title: "粉丝团级别",
dataIndex: "user_fans_club_level",
key: "user_fans_club_level",
},
{
title: "听大哥的话",
key: "msg_content",
render: (record) => {
return record.msg_contents.map((item) => {
const { msg_content } = item;
return <div>{msg_content}</div>;
});
},
},
];
return <Table dataSource={dataSource} columns={columns}></Table>;
};

5
apps/viewer/src/main.tsx Normal file
View File

@ -0,0 +1,5 @@
import React from "react";
import ReactDOM from "react-dom/client";
import App from "./App.tsx";
ReactDOM.createRoot(document.getElementById("root")!).render(<App />);

1
apps/viewer/src/vite-env.d.ts vendored Normal file
View File

@ -0,0 +1 @@
/// <reference types="vite/client" />

25
apps/viewer/tsconfig.json Normal file
View File

@ -0,0 +1,25 @@
{
"compilerOptions": {
"target": "ES2020",
"useDefineForClassFields": true,
"lib": ["ES2020", "DOM", "DOM.Iterable"],
"module": "ESNext",
"skipLibCheck": true,
/* Bundler mode */
"moduleResolution": "bundler",
"allowImportingTsExtensions": true,
"resolveJsonModule": true,
"isolatedModules": true,
"noEmit": true,
"jsx": "react-jsx",
/* Linting */
"strict": true,
"noUnusedLocals": true,
"noUnusedParameters": true,
"noFallthroughCasesInSwitch": true
},
"include": ["src"],
"references": [{ "path": "./tsconfig.node.json" }]
}

View File

@ -0,0 +1,10 @@
{
"compilerOptions": {
"composite": true,
"skipLibCheck": true,
"module": "ESNext",
"moduleResolution": "bundler",
"allowSyntheticDefaultImports": true
},
"include": ["vite.config.ts"]
}

View File

@ -0,0 +1,12 @@
import { defineConfig } from "vite";
import react from "@vitejs/plugin-react";
// https://vitejs.dev/config/
export default defineConfig({
plugins: [react()],
server: {
proxy: {
"/api": "http://localhost:3000",
},
},
});

15
package.json Normal file
View File

@ -0,0 +1,15 @@
{
"name": "@prome/",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"dev:demo": "pnpm run --filter @prome/demo dev",
"dev:api": "pnpm run --filter @prome/api start:dev",
"dev:viewer":"pnpm run --filter @prome/viewer dev"
},
"keywords": [],
"author": "",
"license": "ISC"
}

6937
pnpm-lock.yaml Normal file

File diff suppressed because it is too large Load Diff

5
pnpm-workspace.yaml Normal file
View File

@ -0,0 +1,5 @@
packages:
# 基础库级别在 packages/
- "packages/*"
# 应用级别在 apps/
- "apps/**"