-
Notifications
You must be signed in to change notification settings - Fork 27
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
汪航洋
committed
Nov 10, 2023
1 parent
901f917
commit 55f8931
Showing
5 changed files
with
287 additions
and
31 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,27 +1,18 @@ | ||
| # React + TypeScript + Vite | ||
| # GOST V3 API Manage | ||
|
|
||
| This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules. | ||
| 官方的 web-ui 还没完成，先弄个简单的用一下，好过在 postMan 上捣腾； | ||
| 纯前端的项目，部署在`github-pages`上, 放心[试用](https://blog.whyoop.com/gost-ui/); | ||
|
|
||
| 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 | ||
| 1. 启动 API 服务 | ||
|
|
||
| ## Expanding the ESLint configuration | ||
| > `gost -api :18080` 或者 `gost -api admin:123456@:18080` | ||
| If you are developing a production application, we recommend updating the configuration to enable type aware lint rules: | ||
| 2. 打开 web 端管理地址 [点击打开](https://blog.whyoop.com/gost-ui/) | ||
|
|
||
| - Configure the top-level `parserOptions` property like this: | ||
| - API 地址 `http://IP:PORT`， 如果配置了`pathPrefix`，加上`pathPrefix`路径； | ||
| - (如果有) 填写 用户，密码; | ||
| - 点击 `连接` 按钮; | ||
|
|
||
| ```js | ||
| 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 | ||
| 3. 管理面板，动态管理GOST |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,97 @@ | ||
| import { useContext, useEffect, useState } from "react"; | ||
| import { Button, Popconfirm, Space, Table } from "antd"; | ||
| import Ctx from "../uitls/ctx"; | ||
| import * as API from "../api"; | ||
| import JsonForm from "../components/Forms/Json"; | ||
| import { ChainConfig } from "../api/types"; | ||
|
|
||
| type Props = { | ||
| name: string; | ||
| title: string; | ||
| api: any; | ||
| keyName?: string; | ||
| }; | ||
| const PublicPage: React.FC<Props> = (props) => { | ||
| const { name, title, api, keyName = "name" } = props; | ||
| const { gostConfig } = useContext(Ctx); | ||
| const dataList = (gostConfig as any)?.[name] || []; | ||
|
|
||
| const addService = async (servic: any) => { | ||
| const data = JSON.parse(servic); | ||
| await api.post(data); | ||
| }; | ||
|
|
||
| const updateService = async (id: string, servic: any) => { | ||
| const data = JSON.parse(servic); | ||
| await api.put(id, data); | ||
| }; | ||
|
|
||
| const deleteService = async (servic: any) => { | ||
| await api.delete(servic.name); | ||
| }; | ||
|
|
||
| return ( | ||
| <div> | ||
| <Table | ||
| size="small" | ||
| dataSource={dataList} | ||
| columns={[ | ||
| { title: keyName, dataIndex: keyName, width: 100 }, | ||
| { | ||
| title: "详情", | ||
| ellipsis: true, | ||
| render: (value, record, index) => { | ||
| return JSON.stringify(record) | ||
| }, | ||
| }, | ||
| { | ||
| title: "操作", | ||
| width: 120, | ||
| render: (value, record, index) => { | ||
| return ( | ||
| <Space size={"small"}> | ||
| <JsonForm | ||
| layoutType="ModalForm" | ||
| trigger={ | ||
| <Button type="link" size={"small"}> | ||
| 修改 | ||
| </Button> | ||
| } | ||
| initialValues={{ value: JSON.stringify(record, null, 4) }} | ||
| onFinish={async (values: any) => { | ||
| const { value } = values; | ||
| await updateService(record.name, value); | ||
| return true; | ||
| }} | ||
| ></JsonForm> | ||
| <Popconfirm | ||
| title="警告" | ||
| description="确定要删除吗？" | ||
| onConfirm={() => deleteService(record)} | ||
| > | ||
| <Button type="link" size={"small"}> | ||
| 删除 | ||
| </Button> | ||
| </Popconfirm> | ||
| </Space> | ||
| ); | ||
| }, | ||
| }, | ||
| ]} | ||
| ></Table> | ||
| <div> | ||
| <JsonForm | ||
| title={`添加 ${title || ''}`} | ||
| layoutType="ModalForm" | ||
| trigger={<Button>新增</Button>} | ||
| onFinish={async (values: any) => { | ||
| const { value } = values; | ||
| await addService(value); | ||
| return true; | ||
| }} | ||
| ></JsonForm> | ||
| </div> | ||
| </div> | ||
| ); | ||
| }; | ||
| export default PublicPage; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,59 @@ | ||
| export default { | ||
| Services: [ | ||
| { | ||
| label: "端口转发", | ||
| cli: "-L tcp://:80/:8080", | ||
| json: ` | ||
| { | ||
| "name": "service-0", | ||
| "addr": ":80", | ||
| "handler": { | ||
| "type": "tcp" | ||
| }, | ||
| "listener": { | ||
| "type": "tcp" | ||
| }, | ||
| "forwarder": { | ||
| "nodes": [ | ||
| { | ||
| "name": "target-0", | ||
| "addr": ":8080" | ||
| } | ||
| ] | ||
| } | ||
| }`, | ||
| }, | ||
| { | ||
| label: "代理转发", | ||
| cli: "-L socks5://:1080 -F socks5://xxx.com:1080", | ||
| json: ` | ||
| { | ||
| "name": "service-0", | ||
| "addr": ":1080", | ||
| "handler": { | ||
| "type": "socks5", | ||
| "chain": "chain-0" | ||
| }, | ||
| "listener": { | ||
| "type": "tcp" | ||
| } | ||
| }`, | ||
| }, | ||
| { | ||
| label: "代理转发", | ||
| }, | ||
| ], | ||
| Authers: [ | ||
| { | ||
| label: "默认模板", | ||
| json: ` | ||
| { | ||
| "name": "auther-0", | ||
| "auths": [ | ||
| { "username": "user1", "password": "pass1" }, | ||
| { "username": "user2", "password": "pass2" }, | ||
| ], | ||
| }`, | ||
| }, | ||
| ], | ||
| }; |