xinyin025/new-api
1
0
Fork 0
mirror of https://github.com/linux-do/new-api.git synced 2025-09-18 00:16:37 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

synced with upstream

Browse Source 
Signed-off-by: wozulong <>
This commit is contained in:
wozulong 2024-03-20 13:52:10 +08:00
commit e4753e7411
51 changed files with 6184 additions and 6130 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
Midjourney.md
View File

@ -2,9 +2,7 @@
**简介**:Midjourney Proxy API文档 **简介**:Midjourney Proxy API文档
## 模型价格设置（在设置-运营设置-模型固定价格设置中设置） ## 模型列表
### 模型列表
### midjourney-proxy支持 ### midjourney-proxy支持
@ -27,6 +25,7 @@
- mj_pan (平移) - mj_pan (平移)
- swap_face (换脸) - swap_face (换脸)
## 模型价格设置（在设置-运营设置-模型固定价格设置中设置）
```json ```json
{ {
"mj_imagine": 0.1, "mj_imagine": 0.1,
@ -46,6 +45,7 @@
"swap_face": 0.05 "swap_face": 0.05
} }
``` ```
其中mj_inpaint和mj_custom_zoom的价格设置为0，是因为这两个模型需要搭配mj_modal使用，所以价格由mj_modal决定。
## 渠道设置 ## 渠道设置
@ -56,12 +56,12 @@
部署Midjourney-Proxy，并配置好midjourney账号等（强烈建议设置密钥），[项目地址](https://github.com/novicezk/midjourney-proxy) 部署Midjourney-Proxy，并配置好midjourney账号等（强烈建议设置密钥），[项目地址](https://github.com/novicezk/midjourney-proxy)
2. 在渠道管理中添加渠道，渠道类型选择**Midjourney Proxy**，如果是plus版本选择**Midjourney Proxy Plus** 2. 在渠道管理中添加渠道，渠道类型选择**Midjourney Proxy**，如果是plus版本选择**Midjourney Proxy Plus**
，模型选择midjourney，如果有换脸模型，可以选择swap_face ，模型请参考上方模型列表
3. 地址填写midjourney-proxy部署的地址，例如：http://localhost:8080 3. 地址填写midjourney-proxy部署的地址，例如：http://localhost:8080
4. 密钥填写midjourney-proxy的密钥，如果没有设置密钥，可以随便填 4. 密钥填写midjourney-proxy的密钥，如果没有设置密钥，可以随便填
### 对接上游new api ### 对接上游new api
1. 在渠道管理中添加渠道，渠道类型选择**Midjourney Proxy Plus**，模型选择midjourney，如果有换脸模型，可以选择swap_face 1. 在渠道管理中添加渠道，渠道类型选择**Midjourney Proxy Plus**，模型请参考上方模型列表
2. 地址填写上游new api的地址，例如：http://localhost:3000 2. 地址填写上游new api的地址，例如：http://localhost:3000
3. 密钥填写上游new api的密钥 3. 密钥填写上游new api的密钥

10
README.md
View File

@ -18,7 +18,7 @@
此分叉版本的主要变更如下： 此分叉版本的主要变更如下：
1. 全新的UI界面（部分界面还待更新） 1. 全新的UI界面（部分界面还待更新）
2. 添加[Midjourney-Proxy(Plus)](https://github.com/novicezk/midjourney-proxy)接口的支持 2. 添加[Midjourney-Proxy(Plus)](https://github.com/novicezk/midjourney-proxy)接口的支持，[对接文档](Midjourney.md)，支持的接口如下：
+ [x] /mj/submit/imagine + [x] /mj/submit/imagine
+ [x] /mj/submit/change + [x] /mj/submit/change
+ [x] /mj/submit/blend + [x] /mj/submit/blend
@ -54,7 +54,7 @@
2. 智谱glm-4v，glm-4v识图 2. 智谱glm-4v，glm-4v识图
3. Anthropic Claude 3 (claude-3-opus-20240229, claude-3-sonnet-20240229) 3. Anthropic Claude 3 (claude-3-opus-20240229, claude-3-sonnet-20240229)
4. [Ollama](https://github.com/ollama/ollama?tab=readme-ov-file)，添加渠道时，密钥可以随便填写，默认的请求地址是[http://localhost:11434](http://localhost:11434)，如果需要修改请在渠道中修改 4. [Ollama](https://github.com/ollama/ollama?tab=readme-ov-file)，添加渠道时，密钥可以随便填写，默认的请求地址是[http://localhost:11434](http://localhost:11434)，如果需要修改请在渠道中修改
5. [Midjourney-Proxy(Plus)](https://github.com/novicezk/midjourney-proxy)接口 5. [Midjourney-Proxy(Plus)](https://github.com/novicezk/midjourney-proxy)接口，[对接文档](Midjourney.md)
您可以在渠道中添加自定义模型gpt-4-gizmo-*，此模型并非OpenAI官方模型，而是第三方模型，使用官方key无法调用。 您可以在渠道中添加自定义模型gpt-4-gizmo-*，此模型并非OpenAI官方模型，而是第三方模型，使用官方key无法调用。
@ -98,6 +98,12 @@ docker run --name new-api -d --restart always -p 3000:3000 -e SQL_DSN="root:1234
![image](https://github.com/Calcium-Ion/new-api/assets/61247483/5b3228e8-2556-44f7-97d6-4f8d8ee6effa) ![image](https://github.com/Calcium-Ion/new-api/assets/61247483/5b3228e8-2556-44f7-97d6-4f8d8ee6effa)
![image](https://github.com/Calcium-Ion/new-api/assets/61247483/af9a07ee-5101-4b3d-8bd9-ae21a4fd7e9e) ![image](https://github.com/Calcium-Ion/new-api/assets/61247483/af9a07ee-5101-4b3d-8bd9-ae21a4fd7e9e)
## 相关项目
- [One API](https://github.com/songquanpeng/one-api)：原版项目
- [Midjourney-Proxy](https://github.com/novicezk/midjourney-proxy)：Midjourney接口支持
- [chatnio](https://github.com/Deeptrain-Community/chatnio)：下一代 AI 一站式 B/C 端解决方案
- [neko-api-key-tool](https://github.com/Calcium-Ion/neko-api-key-tool)：用key查询使用额度
## Star History ## Star History
[![Star History Chart](https://api.star-history.com/svg?repos=Calcium-Ion/new-api&type=Date)](https://star-history.com/#Calcium-Ion/new-api&Date) [![Star History Chart](https://api.star-history.com/svg?repos=Calcium-Ion/new-api&type=Date)](https://star-history.com/#Calcium-Ion/new-api&Date)

2
common/constants.go
View File

@ -215,6 +215,7 @@ const (
ChannelTypeGemini = 24 ChannelTypeGemini = 24
ChannelTypeMoonshot = 25 ChannelTypeMoonshot = 25
ChannelTypeZhipu_v4 = 26 ChannelTypeZhipu_v4 = 26
ChannelTypePerplexity = 27
) )
var ChannelBaseURLs = []string{ var ChannelBaseURLs = []string{
@ -245,4 +246,5 @@ var ChannelBaseURLs = []string{
"https://generativelanguage.googleapis.com", //24 "https://generativelanguage.googleapis.com", //24
"https://api.moonshot.cn", //25 "https://api.moonshot.cn", //25
"https://open.bigmodel.cn", //26 "https://open.bigmodel.cn", //26
"https://api.perplexity.ai", //27
} }

2
common/image.go
View File

@ -5,7 +5,7 @@ import (
"encoding/base64" "encoding/base64"
"errors" "errors"
"fmt" "fmt"
"github.com/chai2010/webp" "golang.org/x/image/webp"
"image" "image"
"io" "io"
"net/http" "net/http"

9
common/model-ratio.go
View File

@ -13,7 +13,7 @@ import (
// TODO: when a new api is enabled, check the pricing here // TODO: when a new api is enabled, check the pricing here
// 1 === $0.002 / 1K tokens // 1 === $0.002 / 1K tokens
// 1 === ￥0.014 / 1k tokens // 1 === ￥0.014 / 1k tokens
var ModelRatio = map[string]float64{ var DefaultModelRatio = map[string]float64{
//"midjourney": 50, //"midjourney": 50,
"gpt-4-gizmo-*": 15, "gpt-4-gizmo-*": 15,
"gpt-4": 15, "gpt-4": 15,
@ -115,6 +115,7 @@ var DefaultModelPrice = map[string]float64{
} }
var ModelPrice = map[string]float64{} var ModelPrice = map[string]float64{}
var ModelRatio = map[string]float64{}
func ModelPrice2JSONString() string { func ModelPrice2JSONString() string {
if len(ModelPrice) == 0 { if len(ModelPrice) == 0 {
@ -150,6 +151,9 @@ func GetModelPrice(name string, printErr bool) float64 {
} }
func ModelRatio2JSONString() string { func ModelRatio2JSONString() string {
if len(ModelRatio) == 0 {
ModelRatio = DefaultModelRatio
}
jsonBytes, err := json.Marshal(ModelRatio) jsonBytes, err := json.Marshal(ModelRatio)
if err != nil { if err != nil {
SysError("error marshalling model ratio: " + err.Error()) SysError("error marshalling model ratio: " + err.Error())
@ -163,6 +167,9 @@ func UpdateModelRatioByJSONString(jsonStr string) error {
} }
func GetModelRatio(name string) float64 { func GetModelRatio(name string) float64 {
if len(ModelRatio) == 0 {
ModelRatio = DefaultModelRatio
}
if strings.HasPrefix(name, "gpt-4-gizmo") { if strings.HasPrefix(name, "gpt-4-gizmo") {
name = "gpt-4-gizmo-*" name = "gpt-4-gizmo-*"
} }

2
constant/midjourney.go
View File

@ -1,5 +1,7 @@
package constant package constant
var MjNotifyEnabled = false
const ( const (
MjErrorUnknown = 5 MjErrorUnknown = 5
MjRequestError = 4 MjRequestError = 4

15
controller/log.go
View File

@ -10,9 +10,13 @@ import (
func GetAllLogs(c *gin.Context) { func GetAllLogs(c *gin.Context) {
p, _ := strconv.Atoi(c.Query("p")) p, _ := strconv.Atoi(c.Query("p"))
pageSize, _ := strconv.Atoi(c.Query("page_size"))
if p < 0 { if p < 0 {
p = 0 p = 0
} }
if pageSize < 0 {
pageSize = common.ItemsPerPage
}
logType, _ := strconv.Atoi(c.Query("type")) logType, _ := strconv.Atoi(c.Query("type"))
startTimestamp, _ := strconv.ParseInt(c.Query("start_timestamp"), 10, 64) startTimestamp, _ := strconv.ParseInt(c.Query("start_timestamp"), 10, 64)
endTimestamp, _ := strconv.ParseInt(c.Query("end_timestamp"), 10, 64) endTimestamp, _ := strconv.ParseInt(c.Query("end_timestamp"), 10, 64)
@ -20,7 +24,7 @@ func GetAllLogs(c *gin.Context) {
tokenName := c.Query("token_name") tokenName := c.Query("token_name")
modelName := c.Query("model_name") modelName := c.Query("model_name")
channel, _ := strconv.Atoi(c.Query("channel")) channel, _ := strconv.Atoi(c.Query("channel"))
logs, err := model.GetAllLogs(logType, startTimestamp, endTimestamp, modelName, username, tokenName, p*common.ItemsPerPage, common.ItemsPerPage, channel) logs, err := model.GetAllLogs(logType, startTimestamp, endTimestamp, modelName, username, tokenName, p*pageSize, pageSize, channel)
if err != nil { if err != nil {
c.JSON(http.StatusOK, gin.H{ c.JSON(http.StatusOK, gin.H{
"success": false, "success": false,
@ -38,16 +42,23 @@ func GetAllLogs(c *gin.Context) {
func GetUserLogs(c *gin.Context) { func GetUserLogs(c *gin.Context) {
p, _ := strconv.Atoi(c.Query("p")) p, _ := strconv.Atoi(c.Query("p"))
pageSize, _ := strconv.Atoi(c.Query("page_size"))
if p < 0 { if p < 0 {
p = 0 p = 0
} }
if pageSize < 0 {
pageSize = common.ItemsPerPage
}
if pageSize > 100 {
pageSize = 100
}
userId := c.GetInt("id") userId := c.GetInt("id")
logType, _ := strconv.Atoi(c.Query("type")) logType, _ := strconv.Atoi(c.Query("type"))
startTimestamp, _ := strconv.ParseInt(c.Query("start_timestamp"), 10, 64) startTimestamp, _ := strconv.ParseInt(c.Query("start_timestamp"), 10, 64)
endTimestamp, _ := strconv.ParseInt(c.Query("end_timestamp"), 10, 64) endTimestamp, _ := strconv.ParseInt(c.Query("end_timestamp"), 10, 64)
tokenName := c.Query("token_name") tokenName := c.Query("token_name")
modelName := c.Query("model_name") modelName := c.Query("model_name")
logs, err := model.GetUserLogs(userId, logType, startTimestamp, endTimestamp, modelName, tokenName, p*common.ItemsPerPage, common.ItemsPerPage) logs, err := model.GetUserLogs(userId, logType, startTimestamp, endTimestamp, modelName, tokenName, p*pageSize, pageSize)
if err != nil { if err != nil {
c.JSON(http.StatusOK, gin.H{ c.JSON(http.StatusOK, gin.H{
"success": false, "success": false,

2
controller/misc.go
View File

@ -5,6 +5,7 @@ import (
"fmt" "fmt"
"net/http" "net/http"
"one-api/common" "one-api/common"
"one-api/constant"
"one-api/model" "one-api/model"
"strings" "strings"
@ -61,6 +62,7 @@ func GetStatus(c *gin.Context) {
"data_export_default_time": common.DataExportDefaultTime, "data_export_default_time": common.DataExportDefaultTime,
"default_collapse_sidebar": common.DefaultCollapseSidebar, "default_collapse_sidebar": common.DefaultCollapseSidebar,
"enable_online_topup": common.PayAddress != "" && common.EpayId != "" && common.EpayKey != "", "enable_online_topup": common.PayAddress != "" && common.EpayId != "" && common.EpayKey != "",
"mj_notify_enabled": constant.MjNotifyEnabled,
}, },
}) })
return return

14
go.mod
View File

@ -4,13 +4,12 @@ module one-api
go 1.18 go 1.18
require ( require (
github.com/chai2010/webp v1.1.1
github.com/gin-contrib/cors v1.4.0 github.com/gin-contrib/cors v1.4.0
github.com/gin-contrib/gzip v0.0.6 github.com/gin-contrib/gzip v0.0.6
github.com/gin-contrib/sessions v0.0.5 github.com/gin-contrib/sessions v0.0.5
github.com/gin-contrib/static v0.0.1 github.com/gin-contrib/static v0.0.1
github.com/gin-gonic/gin v1.9.1 github.com/gin-gonic/gin v1.9.1
github.com/go-playground/validator/v10 v10.16.0 github.com/go-playground/validator/v10 v10.19.0
github.com/go-redis/redis/v8 v8.11.5 github.com/go-redis/redis/v8 v8.11.5
github.com/golang-jwt/jwt v3.2.2+incompatible github.com/golang-jwt/jwt v3.2.2+incompatible
github.com/google/uuid v1.3.0 github.com/google/uuid v1.3.0
@ -19,7 +18,8 @@ require (
github.com/samber/lo v1.38.1 github.com/samber/lo v1.38.1
github.com/shirou/gopsutil v3.21.11+incompatible github.com/shirou/gopsutil v3.21.11+incompatible
github.com/star-horizon/go-epay v0.0.0-20230204124159-fa2e2293fdc2 github.com/star-horizon/go-epay v0.0.0-20230204124159-fa2e2293fdc2
golang.org/x/crypto v0.17.0 golang.org/x/crypto v0.21.0
golang.org/x/image v0.15.0
gorm.io/driver/mysql v1.4.3 gorm.io/driver/mysql v1.4.3
gorm.io/driver/postgres v1.5.2 gorm.io/driver/postgres v1.5.2
gorm.io/driver/sqlite v1.4.3 gorm.io/driver/sqlite v1.4.3
@ -32,7 +32,7 @@ require (
github.com/chenzhuoyu/base64x v0.0.0-20221115062448-fe3a3abad311 // indirect github.com/chenzhuoyu/base64x v0.0.0-20221115062448-fe3a3abad311 // indirect
github.com/dgryski/go-rendezvous v0.0.0-20200823014737-9f7001d12a5f // indirect github.com/dgryski/go-rendezvous v0.0.0-20200823014737-9f7001d12a5f // indirect
github.com/dlclark/regexp2 v1.10.0 // indirect github.com/dlclark/regexp2 v1.10.0 // indirect
github.com/gabriel-vasile/mimetype v1.4.2 // indirect github.com/gabriel-vasile/mimetype v1.4.3 // indirect
github.com/gin-contrib/sse v0.1.0 // indirect github.com/gin-contrib/sse v0.1.0 // indirect
github.com/go-ole/go-ole v1.2.6 // indirect github.com/go-ole/go-ole v1.2.6 // indirect
github.com/go-playground/locales v0.14.1 // indirect github.com/go-playground/locales v0.14.1 // indirect
@ -50,7 +50,7 @@ require (
github.com/jinzhu/now v1.1.5 // indirect github.com/jinzhu/now v1.1.5 // indirect
github.com/json-iterator/go v1.1.12 // indirect github.com/json-iterator/go v1.1.12 // indirect
github.com/klauspost/cpuid/v2 v2.2.4 // indirect github.com/klauspost/cpuid/v2 v2.2.4 // indirect
github.com/leodido/go-urn v1.2.4 // indirect github.com/leodido/go-urn v1.4.0 // indirect
github.com/mattn/go-isatty v0.0.20 // indirect github.com/mattn/go-isatty v0.0.20 // indirect
github.com/mattn/go-sqlite3 v2.0.3+incompatible // indirect github.com/mattn/go-sqlite3 v2.0.3+incompatible // indirect
github.com/mitchellh/mapstructure v1.5.0 // indirect github.com/mitchellh/mapstructure v1.5.0 // indirect
@ -64,9 +64,9 @@ require (
github.com/yusufpapurcu/wmi v1.2.3 // indirect github.com/yusufpapurcu/wmi v1.2.3 // indirect
golang.org/x/arch v0.3.0 // indirect golang.org/x/arch v0.3.0 // indirect
golang.org/x/exp v0.0.0-20220303212507-bbda1eaf7a17 // indirect golang.org/x/exp v0.0.0-20220303212507-bbda1eaf7a17 // indirect
golang.org/x/net v0.17.0 // indirect golang.org/x/net v0.21.0 // indirect
golang.org/x/sync v0.1.0 // indirect golang.org/x/sync v0.1.0 // indirect
golang.org/x/sys v0.15.0 // indirect golang.org/x/sys v0.18.0 // indirect
golang.org/x/text v0.14.0 // indirect golang.org/x/text v0.14.0 // indirect
google.golang.org/protobuf v1.30.0 // indirect google.golang.org/protobuf v1.30.0 // indirect
gopkg.in/yaml.v3 v3.0.1 // indirect gopkg.in/yaml.v3 v3.0.1 // indirect

29
go.sum
View File

@ -3,8 +3,6 @@ github.com/bytedance/sonic v1.9.1 h1:6iJ6NqdoxCDr6mbY8h18oSO+cShGSMRGCEo7F2h0x8s
github.com/bytedance/sonic v1.9.1/go.mod h1:i736AoUSYt75HyZLoJW9ERYxcy6eaN6h4BZXU064P/U= github.com/bytedance/sonic v1.9.1/go.mod h1:i736AoUSYt75HyZLoJW9ERYxcy6eaN6h4BZXU064P/U=
github.com/cespare/xxhash/v2 v2.1.2 h1:YRXhKfTDauu4ajMg1TPgFO5jnlC2HCbmLXMcTG5cbYE= github.com/cespare/xxhash/v2 v2.1.2 h1:YRXhKfTDauu4ajMg1TPgFO5jnlC2HCbmLXMcTG5cbYE=
github.com/cespare/xxhash/v2 v2.1.2/go.mod h1:VGX0DQ3Q6kWi7AoAeZDth3/j3BFtOZR5XLFGgcrjCOs= github.com/cespare/xxhash/v2 v2.1.2/go.mod h1:VGX0DQ3Q6kWi7AoAeZDth3/j3BFtOZR5XLFGgcrjCOs=
github.com/chai2010/webp v1.1.1 h1:jTRmEccAJ4MGrhFOrPMpNGIJ/eybIgwKpcACsrTEapk=
github.com/chai2010/webp v1.1.1/go.mod h1:0XVwvZWdjjdxpUEIf7b9g9VkHFnInUSYujwqTLEuldU=
github.com/chenzhuoyu/base64x v0.0.0-20211019084208-fb5309c8db06/go.mod h1:DH46F32mSOjUmXrMHnKwZdA8wcEefY7UVqBKYGjpdQY= github.com/chenzhuoyu/base64x v0.0.0-20211019084208-fb5309c8db06/go.mod h1:DH46F32mSOjUmXrMHnKwZdA8wcEefY7UVqBKYGjpdQY=
github.com/chenzhuoyu/base64x v0.0.0-20221115062448-fe3a3abad311 h1:qSGYFH7+jGhDF8vLC+iwCD4WpbV1EBDSzWkJODFLams= github.com/chenzhuoyu/base64x v0.0.0-20221115062448-fe3a3abad311 h1:qSGYFH7+jGhDF8vLC+iwCD4WpbV1EBDSzWkJODFLams=
github.com/chenzhuoyu/base64x v0.0.0-20221115062448-fe3a3abad311/go.mod h1:b583jCggY9gE99b6G5LEC39OIiVsWj+R97kbl5odCEk= github.com/chenzhuoyu/base64x v0.0.0-20221115062448-fe3a3abad311/go.mod h1:b583jCggY9gE99b6G5LEC39OIiVsWj+R97kbl5odCEk=
@ -19,6 +17,8 @@ github.com/dlclark/regexp2 v1.10.0/go.mod h1:DHkYz0B9wPfa6wondMfaivmHpzrQ3v9q8cn
github.com/fsnotify/fsnotify v1.4.9 h1:hsms1Qyu0jgnwNXIxa+/V/PDsU6CfLf6CNO8H7IWoS4= github.com/fsnotify/fsnotify v1.4.9 h1:hsms1Qyu0jgnwNXIxa+/V/PDsU6CfLf6CNO8H7IWoS4=
github.com/gabriel-vasile/mimetype v1.4.2 h1:w5qFW6JKBz9Y393Y4q372O9A7cUSequkh1Q7OhCmWKU= github.com/gabriel-vasile/mimetype v1.4.2 h1:w5qFW6JKBz9Y393Y4q372O9A7cUSequkh1Q7OhCmWKU=
github.com/gabriel-vasile/mimetype v1.4.2/go.mod h1:zApsH/mKG4w07erKIaJPFiX0Tsq9BFQgN3qGY5GnNgA= github.com/gabriel-vasile/mimetype v1.4.2/go.mod h1:zApsH/mKG4w07erKIaJPFiX0Tsq9BFQgN3qGY5GnNgA=
github.com/gabriel-vasile/mimetype v1.4.3 h1:in2uUcidCuFcDKtdcBxlR0rJ1+fsokWf+uqxgUFjbI0=
github.com/gabriel-vasile/mimetype v1.4.3/go.mod h1:d8uq/6HKRL6CGdk+aubisF/M5GcPfT7nKyLpA0lbSSk=
github.com/gin-contrib/cors v1.4.0 h1:oJ6gwtUl3lqV0WEIwM/LxPF1QZ5qe2lGWdY2+bz7y0g= github.com/gin-contrib/cors v1.4.0 h1:oJ6gwtUl3lqV0WEIwM/LxPF1QZ5qe2lGWdY2+bz7y0g=
github.com/gin-contrib/cors v1.4.0/go.mod h1:bs9pNM0x/UsmHPBWT2xZz9ROh8xYjYkiURUfmBoMlcs= github.com/gin-contrib/cors v1.4.0/go.mod h1:bs9pNM0x/UsmHPBWT2xZz9ROh8xYjYkiURUfmBoMlcs=
github.com/gin-contrib/gzip v0.0.6 h1:NjcunTcGAj5CO1gn4N8jHOSIeRFHIbn51z6K+xaN4d4= github.com/gin-contrib/gzip v0.0.6 h1:NjcunTcGAj5CO1gn4N8jHOSIeRFHIbn51z6K+xaN4d4=
@ -37,6 +37,7 @@ github.com/go-ole/go-ole v1.2.6 h1:/Fpf6oFPoeFik9ty7siob0G6Ke8QvQEuVcuChpwXzpY=
github.com/go-ole/go-ole v1.2.6/go.mod h1:pprOEPIfldk/42T2oK7lQ4v4JSDwmV0As9GaiUsvbm0= github.com/go-ole/go-ole v1.2.6/go.mod h1:pprOEPIfldk/42T2oK7lQ4v4JSDwmV0As9GaiUsvbm0=
github.com/go-playground/assert/v2 v2.0.1/go.mod h1:VDjEfimB/XKnb+ZQfWdccd7VUvScMdVu0Titje2rxJ4= github.com/go-playground/assert/v2 v2.0.1/go.mod h1:VDjEfimB/XKnb+ZQfWdccd7VUvScMdVu0Titje2rxJ4=
github.com/go-playground/assert/v2 v2.2.0 h1:JvknZsQTYeFEAhQwI4qEt9cyV5ONwRHC+lYKSsYSR8s= github.com/go-playground/assert/v2 v2.2.0 h1:JvknZsQTYeFEAhQwI4qEt9cyV5ONwRHC+lYKSsYSR8s=
github.com/go-playground/assert/v2 v2.2.0/go.mod h1:VDjEfimB/XKnb+ZQfWdccd7VUvScMdVu0Titje2rxJ4=
github.com/go-playground/locales v0.13.0/go.mod h1:taPMhCMXrRLJO55olJkUXHZBHCxTMfnGwq/HNwmWNS8= github.com/go-playground/locales v0.13.0/go.mod h1:taPMhCMXrRLJO55olJkUXHZBHCxTMfnGwq/HNwmWNS8=
github.com/go-playground/locales v0.14.0/go.mod h1:sawfccIbzZTqEDETgFXqTho0QybSa7l++s0DH+LDiLs= github.com/go-playground/locales v0.14.0/go.mod h1:sawfccIbzZTqEDETgFXqTho0QybSa7l++s0DH+LDiLs=
github.com/go-playground/locales v0.14.1 h1:EWaQ/wswjilfKLTECiXz7Rh+3BjFhfDFKv/oXslEjJA= github.com/go-playground/locales v0.14.1 h1:EWaQ/wswjilfKLTECiXz7Rh+3BjFhfDFKv/oXslEjJA=
@ -47,10 +48,10 @@ github.com/go-playground/universal-translator v0.18.1 h1:Bcnm0ZwsGyWbCzImXv+pAJn
github.com/go-playground/universal-translator v0.18.1/go.mod h1:xekY+UJKNuX9WP91TpwSH2VMlDf28Uj24BCp08ZFTUY= github.com/go-playground/universal-translator v0.18.1/go.mod h1:xekY+UJKNuX9WP91TpwSH2VMlDf28Uj24BCp08ZFTUY=
github.com/go-playground/validator/v10 v10.2.0/go.mod h1:uOYAAleCW8F/7oMFd6aG0GOhaH6EGOAJShg8Id5JGkI= github.com/go-playground/validator/v10 v10.2.0/go.mod h1:uOYAAleCW8F/7oMFd6aG0GOhaH6EGOAJShg8Id5JGkI=
github.com/go-playground/validator/v10 v10.10.0/go.mod h1:74x4gJWsvQexRdW8Pn3dXSGrTK4nAUsbPlLADvpJkos= github.com/go-playground/validator/v10 v10.10.0/go.mod h1:74x4gJWsvQexRdW8Pn3dXSGrTK4nAUsbPlLADvpJkos=
github.com/go-playground/validator/v10 v10.14.0 h1:vgvQWe3XCz3gIeFDm/HnTIbj6UGmg/+t63MyGU2n5js=
github.com/go-playground/validator/v10 v10.14.0/go.mod h1:9iXMNT7sEkjXb0I+enO7QXmzG6QCsPWY4zveKFVRSyU=
github.com/go-playground/validator/v10 v10.16.0 h1:x+plE831WK4vaKHO/jpgUGsvLKIqRRkz6M78GuJAfGE= github.com/go-playground/validator/v10 v10.16.0 h1:x+plE831WK4vaKHO/jpgUGsvLKIqRRkz6M78GuJAfGE=
github.com/go-playground/validator/v10 v10.16.0/go.mod h1:9iXMNT7sEkjXb0I+enO7QXmzG6QCsPWY4zveKFVRSyU= github.com/go-playground/validator/v10 v10.16.0/go.mod h1:9iXMNT7sEkjXb0I+enO7QXmzG6QCsPWY4zveKFVRSyU=
github.com/go-playground/validator/v10 v10.19.0 h1:ol+5Fu+cSq9JD7SoSqe04GMI92cbn0+wvQ3bZ8b/AU4=
github.com/go-playground/validator/v10 v10.19.0/go.mod h1:dbuPbCMFw/DrkbEynArYaCwl3amGuJotoKCe95atGMM=
github.com/go-redis/redis/v8 v8.11.5 h1:AcZZR7igkdvfVmQTPnu9WE37LRrO/YrBH5zWyjDC0oI= github.com/go-redis/redis/v8 v8.11.5 h1:AcZZR7igkdvfVmQTPnu9WE37LRrO/YrBH5zWyjDC0oI=
github.com/go-redis/redis/v8 v8.11.5/go.mod h1:gREzHqY1hg6oD9ngVRbLStwAWKhA0FEgq8Jd4h5lpwo= github.com/go-redis/redis/v8 v8.11.5/go.mod h1:gREzHqY1hg6oD9ngVRbLStwAWKhA0FEgq8Jd4h5lpwo=
github.com/go-sql-driver/mysql v1.6.0 h1:BCTh4TKNUYmOmMUcQ3IipzF5prigylS7XXjEkfCHuOE= github.com/go-sql-driver/mysql v1.6.0 h1:BCTh4TKNUYmOmMUcQ3IipzF5prigylS7XXjEkfCHuOE=
@ -79,8 +80,6 @@ github.com/jackc/pgpassfile v1.0.0 h1:/6Hmqy13Ss2zCq62VdNG8tM1wchn8zjSGOBJ6icpsI
github.com/jackc/pgpassfile v1.0.0/go.mod h1:CEx0iS5ambNFdcRtxPj5JhEz+xB6uRky5eyVu/W2HEg= github.com/jackc/pgpassfile v1.0.0/go.mod h1:CEx0iS5ambNFdcRtxPj5JhEz+xB6uRky5eyVu/W2HEg=
github.com/jackc/pgservicefile v0.0.0-20221227161230-091c0ba34f0a h1:bbPeKD0xmW/Y25WS6cokEszi5g+S0QxI/d45PkRi7Nk= github.com/jackc/pgservicefile v0.0.0-20221227161230-091c0ba34f0a h1:bbPeKD0xmW/Y25WS6cokEszi5g+S0QxI/d45PkRi7Nk=
github.com/jackc/pgservicefile v0.0.0-20221227161230-091c0ba34f0a/go.mod h1:5TJZWKEWniPve33vlWYSoGYefn3gLQRzjfDlhSJ9ZKM= github.com/jackc/pgservicefile v0.0.0-20221227161230-091c0ba34f0a/go.mod h1:5TJZWKEWniPve33vlWYSoGYefn3gLQRzjfDlhSJ9ZKM=
github.com/jackc/pgx/v5 v5.3.1 h1:Fcr8QJ1ZeLi5zsPZqQeUZhNhxfkkKBOgJuYkJHoBOtU=
github.com/jackc/pgx/v5 v5.3.1/go.mod h1:t3JDKnCBlYIc0ewLF0Q7B8MXmoIaBOZj/ic7iHozM/8=
github.com/jackc/pgx/v5 v5.5.1 h1:5I9etrGkLrN+2XPCsi6XLlV5DITbSL/xBZdmAxFcXPI= github.com/jackc/pgx/v5 v5.5.1 h1:5I9etrGkLrN+2XPCsi6XLlV5DITbSL/xBZdmAxFcXPI=
github.com/jackc/pgx/v5 v5.5.1/go.mod h1:Ig06C2Vu0t5qXC60W8sqIthScaEnFvojjj9dSljmHRA= github.com/jackc/pgx/v5 v5.5.1/go.mod h1:Ig06C2Vu0t5qXC60W8sqIthScaEnFvojjj9dSljmHRA=
github.com/jackc/puddle/v2 v2.2.1 h1:RhxXJtFG022u4ibrCSMSiu5aOq1i77R3OHKNJj77OAk= github.com/jackc/puddle/v2 v2.2.1 h1:RhxXJtFG022u4ibrCSMSiu5aOq1i77R3OHKNJj77OAk=
@ -108,10 +107,10 @@ github.com/leodido/go-urn v1.2.0/go.mod h1:+8+nEpDfqqsY+g338gtMEUOtuK+4dEMhiQEgx
github.com/leodido/go-urn v1.2.1/go.mod h1:zt4jvISO2HfUBqxjfIshjdMTYS56ZS/qv49ictyFfxY= github.com/leodido/go-urn v1.2.1/go.mod h1:zt4jvISO2HfUBqxjfIshjdMTYS56ZS/qv49ictyFfxY=
github.com/leodido/go-urn v1.2.4 h1:XlAE/cm/ms7TE/VMVoduSpNBoyc2dOxHs5MZSwAN63Q= github.com/leodido/go-urn v1.2.4 h1:XlAE/cm/ms7TE/VMVoduSpNBoyc2dOxHs5MZSwAN63Q=
github.com/leodido/go-urn v1.2.4/go.mod h1:7ZrI8mTSeBSHl/UaRyKQW1qZeMgak41ANeCNaVckg+4= github.com/leodido/go-urn v1.2.4/go.mod h1:7ZrI8mTSeBSHl/UaRyKQW1qZeMgak41ANeCNaVckg+4=
github.com/leodido/go-urn v1.4.0 h1:WT9HwE9SGECu3lg4d/dIA+jxlljEa1/ffXKmRjqdmIQ=
github.com/leodido/go-urn v1.4.0/go.mod h1:bvxc+MVxLKB4z00jd1z+Dvzr47oO32F/QSNjSBOlFxI=
github.com/mattn/go-isatty v0.0.12/go.mod h1:cbi8OIDigv2wuxKPP5vlRcQ1OAZbq2CE4Kysco4FUpU= github.com/mattn/go-isatty v0.0.12/go.mod h1:cbi8OIDigv2wuxKPP5vlRcQ1OAZbq2CE4Kysco4FUpU=
github.com/mattn/go-isatty v0.0.14/go.mod h1:7GGIvUiUoEMVVmxf/4nioHXj79iQHKdU27kJ6hsGG94= github.com/mattn/go-isatty v0.0.14/go.mod h1:7GGIvUiUoEMVVmxf/4nioHXj79iQHKdU27kJ6hsGG94=
github.com/mattn/go-isatty v0.0.19 h1:JITubQf0MOLdlGRuRq+jtsDlekdYPia9ZFsB8h/APPA=
github.com/mattn/go-isatty v0.0.19/go.mod h1:W+V8PltTTMOvKvAeJH7IuucS94S2C6jfK/D7dTCTo3Y=
github.com/mattn/go-isatty v0.0.20 h1:xfD0iDuEKnDkl03q4limB+vH+GxLEtL/jb4xVJSWWEY= github.com/mattn/go-isatty v0.0.20 h1:xfD0iDuEKnDkl03q4limB+vH+GxLEtL/jb4xVJSWWEY=
github.com/mattn/go-isatty v0.0.20/go.mod h1:W+V8PltTTMOvKvAeJH7IuucS94S2C6jfK/D7dTCTo3Y= github.com/mattn/go-isatty v0.0.20/go.mod h1:W+V8PltTTMOvKvAeJH7IuucS94S2C6jfK/D7dTCTo3Y=
github.com/mattn/go-sqlite3 v1.14.15/go.mod h1:2eHXhiwb8IkHr+BDWZGa96P6+rkvnG63S2DGjv9HUNg= github.com/mattn/go-sqlite3 v1.14.15/go.mod h1:2eHXhiwb8IkHr+BDWZGa96P6+rkvnG63S2DGjv9HUNg=
@ -176,15 +175,19 @@ golang.org/x/arch v0.0.0-20210923205945-b76863e36670/go.mod h1:5om86z9Hs0C8fWVUu
golang.org/x/arch v0.3.0 h1:02VY4/ZcO/gBOH6PUaoiptASxtXU10jazRCP865E97k= golang.org/x/arch v0.3.0 h1:02VY4/ZcO/gBOH6PUaoiptASxtXU10jazRCP865E97k=
golang.org/x/arch v0.3.0/go.mod h1:5om86z9Hs0C8fWVUuoMHwpExlXzs5Tkyp9hOrfG7pp8= golang.org/x/arch v0.3.0/go.mod h1:5om86z9Hs0C8fWVUuoMHwpExlXzs5Tkyp9hOrfG7pp8=
golang.org/x/crypto v0.0.0-20210711020723-a769d52b0f97/go.mod h1:GvvjBRRGRdwPK5ydBHafDWAxML/pGHZbMvKqRZ5+Abc= golang.org/x/crypto v0.0.0-20210711020723-a769d52b0f97/go.mod h1:GvvjBRRGRdwPK5ydBHafDWAxML/pGHZbMvKqRZ5+Abc=
golang.org/x/crypto v0.14.0 h1:wBqGXzWJW6m1XrIKlAH0Hs1JJ7+9KBwnIO8v66Q9cHc=
golang.org/x/crypto v0.14.0/go.mod h1:MVFd36DqK4CsrnJYDkBA3VC4m2GkXAM0PvzMCn4JQf4=
golang.org/x/crypto v0.17.0 h1:r8bRNjWL3GshPW3gkd+RpvzWrZAwPS49OmTGZ/uhM4k= golang.org/x/crypto v0.17.0 h1:r8bRNjWL3GshPW3gkd+RpvzWrZAwPS49OmTGZ/uhM4k=
golang.org/x/crypto v0.17.0/go.mod h1:gCAAfMLgwOJRpTjQ2zCCt2OcSfYMTeZVSRtQlPC7Nq4= golang.org/x/crypto v0.17.0/go.mod h1:gCAAfMLgwOJRpTjQ2zCCt2OcSfYMTeZVSRtQlPC7Nq4=
golang.org/x/crypto v0.21.0 h1:X31++rzVUdKhX5sWmSOFZxx8UW/ldWx55cbf08iNAMA=
golang.org/x/crypto v0.21.0/go.mod h1:0BP7YvVV9gBbVKyeTG0Gyn+gZm94bibOW5BjDEYAOMs=
golang.org/x/exp v0.0.0-20220303212507-bbda1eaf7a17 h1:3MTrJm4PyNL9NBqvYDSj3DHl46qQakyfqfWo4jgfaEM= golang.org/x/exp v0.0.0-20220303212507-bbda1eaf7a17 h1:3MTrJm4PyNL9NBqvYDSj3DHl46qQakyfqfWo4jgfaEM=
golang.org/x/exp v0.0.0-20220303212507-bbda1eaf7a17/go.mod h1:lgLbSvA5ygNOMpwM/9anMpWVlVJ7Z+cHWq/eFuinpGE= golang.org/x/exp v0.0.0-20220303212507-bbda1eaf7a17/go.mod h1:lgLbSvA5ygNOMpwM/9anMpWVlVJ7Z+cHWq/eFuinpGE=
golang.org/x/image v0.15.0 h1:kOELfmgrmJlw4Cdb7g/QGuB3CvDrXbqEIww/pNtNBm8=
golang.org/x/image v0.15.0/go.mod h1:HUYqC05R2ZcZ3ejNQsIHQDQiwWM4JBqmm6MKANTp4LE=
golang.org/x/net v0.0.0-20210226172049-e18ecbb05110/go.mod h1:m0MpNAwzfU5UDzcl9v0D8zg8gWTRqZa9RBIspLL5mdg= golang.org/x/net v0.0.0-20210226172049-e18ecbb05110/go.mod h1:m0MpNAwzfU5UDzcl9v0D8zg8gWTRqZa9RBIspLL5mdg=
golang.org/x/net v0.17.0 h1:pVaXccu2ozPjCXewfr1S7xza/zcXTity9cCdXQYSjIM= golang.org/x/net v0.17.0 h1:pVaXccu2ozPjCXewfr1S7xza/zcXTity9cCdXQYSjIM=
golang.org/x/net v0.17.0/go.mod h1:NxSsAGuq816PNPmqtQdLE42eU2Fs7NoRIZrHJAlaCOE= golang.org/x/net v0.17.0/go.mod h1:NxSsAGuq816PNPmqtQdLE42eU2Fs7NoRIZrHJAlaCOE=
golang.org/x/net v0.21.0 h1:AQyQV4dYCvJ7vGmJyKki9+PBdyvhkSd8EIx/qb0AYv4=
golang.org/x/net v0.21.0/go.mod h1:bIjVDfnllIU7BJ2DNgfnXvpSvtn8VRwhlsaeUTyUS44=
golang.org/x/sync v0.1.0 h1:wsuoTGHzEhffawBOhz5CYhcrV4IdKZbEyZjBMuTp12o= golang.org/x/sync v0.1.0 h1:wsuoTGHzEhffawBOhz5CYhcrV4IdKZbEyZjBMuTp12o=
golang.org/x/sync v0.1.0/go.mod h1:RxMgew5VJxzue5/jJTE5uejpjVlOe/izrB70Jof72aM= golang.org/x/sync v0.1.0/go.mod h1:RxMgew5VJxzue5/jJTE5uejpjVlOe/izrB70Jof72aM=
golang.org/x/sys v0.0.0-20190916202348-b4ddaad3f8a3/go.mod h1:h1NjWce9XRLGQEsW7wpKNCjG9DtNlClVuFLEZdDNbEs= golang.org/x/sys v0.0.0-20190916202348-b4ddaad3f8a3/go.mod h1:h1NjWce9XRLGQEsW7wpKNCjG9DtNlClVuFLEZdDNbEs=
@ -197,16 +200,14 @@ golang.org/x/sys v0.0.0-20220704084225-05e143d24a9e/go.mod h1:oPkhp1MJrh7nUepCBc
golang.org/x/sys v0.6.0/go.mod h1:oPkhp1MJrh7nUepCBck5+mAzfO9JrbApNNgaTdGDITg= golang.org/x/sys v0.6.0/go.mod h1:oPkhp1MJrh7nUepCBck5+mAzfO9JrbApNNgaTdGDITg=
golang.org/x/sys v0.8.0/go.mod h1:oPkhp1MJrh7nUepCBck5+mAzfO9JrbApNNgaTdGDITg= golang.org/x/sys v0.8.0/go.mod h1:oPkhp1MJrh7nUepCBck5+mAzfO9JrbApNNgaTdGDITg=
golang.org/x/sys v0.11.0/go.mod h1:oPkhp1MJrh7nUepCBck5+mAzfO9JrbApNNgaTdGDITg= golang.org/x/sys v0.11.0/go.mod h1:oPkhp1MJrh7nUepCBck5+mAzfO9JrbApNNgaTdGDITg=
golang.org/x/sys v0.13.0 h1:Af8nKPmuFypiUBjVoU9V20FiaFXOcuZI21p0ycVYYGE=
golang.org/x/sys v0.13.0/go.mod h1:oPkhp1MJrh7nUepCBck5+mAzfO9JrbApNNgaTdGDITg=
golang.org/x/sys v0.15.0 h1:h48lPFYpsTvQJZF4EKyI4aLHaev3CxivZmv7yZig9pc= golang.org/x/sys v0.15.0 h1:h48lPFYpsTvQJZF4EKyI4aLHaev3CxivZmv7yZig9pc=
golang.org/x/sys v0.15.0/go.mod h1:/VUhepiaJMQUp4+oa/7Zr1D23ma6VTLIYjOOTFZPUcA= golang.org/x/sys v0.15.0/go.mod h1:/VUhepiaJMQUp4+oa/7Zr1D23ma6VTLIYjOOTFZPUcA=
golang.org/x/sys v0.18.0 h1:DBdB3niSjOA/O0blCZBqDefyWNYveAYMNF1Wum0DYQ4=
golang.org/x/sys v0.18.0/go.mod h1:/VUhepiaJMQUp4+oa/7Zr1D23ma6VTLIYjOOTFZPUcA=
golang.org/x/term v0.0.0-20201126162022-7de9c90e9dd1/go.mod h1:bj7SfCRtBDWHUb9snDiAeCFNEtKQo2Wmx5Cou7ajbmo= golang.org/x/term v0.0.0-20201126162022-7de9c90e9dd1/go.mod h1:bj7SfCRtBDWHUb9snDiAeCFNEtKQo2Wmx5Cou7ajbmo=
golang.org/x/text v0.3.2/go.mod h1:bEr9sfX3Q8Zfm5fL9x+3itogRgK3+ptLWKqgva+5dAk= golang.org/x/text v0.3.2/go.mod h1:bEr9sfX3Q8Zfm5fL9x+3itogRgK3+ptLWKqgva+5dAk=
golang.org/x/text v0.3.3/go.mod h1:5Zoc/QRtKVWzQhOtBMvqHzDpF6irO9z98xDceosuGiQ= golang.org/x/text v0.3.3/go.mod h1:5Zoc/QRtKVWzQhOtBMvqHzDpF6irO9z98xDceosuGiQ=
golang.org/x/text v0.3.6/go.mod h1:5Zoc/QRtKVWzQhOtBMvqHzDpF6irO9z98xDceosuGiQ= golang.org/x/text v0.3.6/go.mod h1:5Zoc/QRtKVWzQhOtBMvqHzDpF6irO9z98xDceosuGiQ=
golang.org/x/text v0.13.0 h1:ablQoSUd0tRdKxZewP80B+BaqeKJuVhuRxj/dkrun3k=
golang.org/x/text v0.13.0/go.mod h1:TvPlkZtksWOMsz7fbANvkp4WM8x/WCo/om8BMLbz+aE=
golang.org/x/text v0.14.0 h1:ScX5w1eTa3QqT8oi6+ziP7dTV1S2+ALU0bI+0zXKWiQ= golang.org/x/text v0.14.0 h1:ScX5w1eTa3QqT8oi6+ziP7dTV1S2+ALU0bI+0zXKWiQ=
golang.org/x/text v0.14.0/go.mod h1:18ZOQIKpY8NJVqYksKHtTdi31H5itFRjB5/qKTNYzSU= golang.org/x/text v0.14.0/go.mod h1:18ZOQIKpY8NJVqYksKHtTdi31H5itFRjB5/qKTNYzSU=
golang.org/x/tools v0.0.0-20180917221912-90fa682c2a6e/go.mod h1:n7NCudcB/nEzxVGmLbDWY5pfWTLqBcC2KZ6jyYvM4mQ= golang.org/x/tools v0.0.0-20180917221912-90fa682c2a6e/go.mod h1:n7NCudcB/nEzxVGmLbDWY5pfWTLqBcC2KZ6jyYvM4mQ=

3
middleware/distributor.go
View File

@ -155,6 +155,9 @@ func Distribute() func(c *gin.Context) {
if channel.AutoBan != nil && *channel.AutoBan == 0 { if channel.AutoBan != nil && *channel.AutoBan == 0 {
ban = false ban = false
} }
if nil != channel.OpenAIOrganization {
c.Set("channel_organization", *channel.OpenAIOrganization)
}
c.Set("auto_ban", ban) c.Set("auto_ban", ban)
c.Set("model_mapping", channel.GetModelMapping()) c.Set("model_mapping", channel.GetModelMapping())
c.Request.Header.Set("Authorization", fmt.Sprintf("Bearer %s", channel.Key)) c.Request.Header.Set("Authorization", fmt.Sprintf("Bearer %s", channel.Key))

12
model/midjourney.go
View File

@ -4,18 +4,18 @@ type Midjourney struct {
Id int `json:"id"` Id int `json:"id"`
Code int `json:"code"` Code int `json:"code"`
UserId int `json:"user_id" gorm:"index"` UserId int `json:"user_id" gorm:"index"`
Action string `json:"action"` Action string `json:"action" gorm:"type:varchar(40);index"`
MjId string `json:"mj_id" gorm:"index"` MjId string `json:"mj_id" gorm:"index"`
Prompt string `json:"prompt"` Prompt string `json:"prompt"`
PromptEn string `json:"prompt_en"` PromptEn string `json:"prompt_en"`
Description string `json:"description"` Description string `json:"description"`
State string `json:"state"` State string `json:"state"`
SubmitTime int64 `json:"submit_time"` SubmitTime int64 `json:"submit_time" gorm:"index"`
StartTime int64 `json:"start_time"` StartTime int64 `json:"start_time" gorm:"index"`
FinishTime int64 `json:"finish_time"` FinishTime int64 `json:"finish_time" gorm:"index"`
ImageUrl string `json:"image_url"` ImageUrl string `json:"image_url"`
Status string `json:"status"` Status string `json:"status" gorm:"type:varchar(20);index"`
Progress string `json:"progress"` Progress string `json:"progress" gorm:"type:varchar(30);index"`
FailReason string `json:"fail_reason"` FailReason string `json:"fail_reason"`
ChannelId int `json:"channel_id"` ChannelId int `json:"channel_id"`
Quota int `json:"quota"` Quota int `json:"quota"`

4
model/option.go
View File

@ -2,6 +2,7 @@ package model
import ( import (
"one-api/common" "one-api/common"
"one-api/constant"
"strconv" "strconv"
"strings" "strings"
"time" "time"
@ -91,6 +92,7 @@ func InitOptionMap() {
common.OptionMap["DataExportInterval"] = strconv.Itoa(common.DataExportInterval) common.OptionMap["DataExportInterval"] = strconv.Itoa(common.DataExportInterval)
common.OptionMap["DataExportDefaultTime"] = common.DataExportDefaultTime common.OptionMap["DataExportDefaultTime"] = common.DataExportDefaultTime
common.OptionMap["DefaultCollapseSidebar"] = strconv.FormatBool(common.DefaultCollapseSidebar) common.OptionMap["DefaultCollapseSidebar"] = strconv.FormatBool(common.DefaultCollapseSidebar)
common.OptionMap["MjNotifyEnabled"] = strconv.FormatBool(constant.MjNotifyEnabled)
common.OptionMapRWMutex.Unlock() common.OptionMapRWMutex.Unlock()
loadOptionsFromDatabase() loadOptionsFromDatabase()
@ -186,6 +188,8 @@ func updateOptionMap(key string, value string) (err error) {
common.DataExportEnabled = boolValue common.DataExportEnabled = boolValue
case "DefaultCollapseSidebar": case "DefaultCollapseSidebar":
common.DefaultCollapseSidebar = boolValue common.DefaultCollapseSidebar = boolValue
case "MjNotifyEnabled":
constant.MjNotifyEnabled = boolValue
} }
} }
switch key { switch key {

3
relay/channel/openai/adaptor.go
View File

@ -49,6 +49,9 @@ func (a *Adaptor) SetupRequestHeader(c *gin.Context, req *http.Request, info *re
req.Header.Set("api-key", info.ApiKey) req.Header.Set("api-key", info.ApiKey)
return nil return nil
} }
if info.ChannelType == common.ChannelTypeOpenAI && "" != info.Organization {
req.Header.Set("OpenAI-Organization", info.Organization)
}
req.Header.Set("Authorization", "Bearer "+info.ApiKey) req.Header.Set("Authorization", "Bearer "+info.ApiKey)
//if info.ChannelType == common.ChannelTypeOpenRouter { //if info.ChannelType == common.ChannelTypeOpenRouter {
// req.Header.Set("HTTP-Referer", "https://github.com/songquanpeng/one-api") // req.Header.Set("HTTP-Referer", "https://github.com/songquanpeng/one-api")

63
relay/channel/perplexity/adaptor.go Normal file
View File

@ -0,0 +1,63 @@
package perplexity
import (
"errors"
"fmt"
"github.com/gin-gonic/gin"
"io"
"net/http"
"one-api/dto"
"one-api/relay/channel"
"one-api/relay/channel/openai"
relaycommon "one-api/relay/common"
"one-api/service"
)
type Adaptor struct {
}
func (a *Adaptor) Init(info *relaycommon.RelayInfo, request dto.GeneralOpenAIRequest) {
}
func (a *Adaptor) GetRequestURL(info *relaycommon.RelayInfo) (string, error) {
return fmt.Sprintf("%s/chat/completions", info.BaseUrl), nil
}
func (a *Adaptor) SetupRequestHeader(c *gin.Context, req *http.Request, info *relaycommon.RelayInfo) error {
channel.SetupApiRequestHeader(info, c, req)
req.Header.Set("Authorization", "Bearer "+info.ApiKey)
return nil
}
func (a *Adaptor) ConvertRequest(c *gin.Context, relayMode int, request *dto.GeneralOpenAIRequest) (any, error) {
if request == nil {
return nil, errors.New("request is nil")
}
if request.TopP >= 1 {
request.TopP = 0.99
}
return requestOpenAI2Perplexity(*request), nil
}
func (a *Adaptor) DoRequest(c *gin.Context, info *relaycommon.RelayInfo, requestBody io.Reader) (*http.Response, error) {
return channel.DoApiRequest(a, c, info, requestBody)
}
func (a *Adaptor) DoResponse(c *gin.Context, resp *http.Response, info *relaycommon.RelayInfo) (usage *dto.Usage, err *dto.OpenAIErrorWithStatusCode) {
if info.IsStream {
var responseText string
err, responseText = openai.OpenaiStreamHandler(c, resp, info.RelayMode)
usage = service.ResponseText2Usage(responseText, info.UpstreamModelName, info.PromptTokens)
} else {
err, usage = openai.OpenaiHandler(c, resp, info.PromptTokens, info.UpstreamModelName)
}
return
}
func (a *Adaptor) GetModelList() []string {
return ModelList
}
func (a *Adaptor) GetChannelName() string {
return ChannelName
}

7
relay/channel/perplexity/constants.go Normal file
View File

@ -0,0 +1,7 @@
package perplexity
var ModelList = []string{
"sonar-small-chat", "sonar-small-online", "sonar-medium-chat", "sonar-medium-online", "mistral-7b-instruct", "mixtral-8x7b-instruct",
}
var ChannelName = "perplexity"

21
relay/channel/perplexity/relay-perplexity.go Normal file
View File

@ -0,0 +1,21 @@
package perplexity
import "one-api/dto"
func requestOpenAI2Perplexity(request dto.GeneralOpenAIRequest) *dto.GeneralOpenAIRequest {
messages := make([]dto.Message, 0, len(request.Messages))
for _, message := range request.Messages {
messages = append(messages, dto.Message{
Role: message.Role,
Content: message.Content,
})
}
return &dto.GeneralOpenAIRequest{
Model: request.Model,
Stream: request.Stream,
Messages: messages,
Temperature: request.Temperature,
TopP: request.TopP,
MaxTokens: request.MaxTokens,
}
}

3
relay/channel/zhipu/adaptor.go
View File

@ -36,6 +36,9 @@ func (a *Adaptor) ConvertRequest(c *gin.Context, relayMode int, request *dto.Gen
if request == nil { if request == nil {
return nil, errors.New("request is nil") return nil, errors.New("request is nil")
} }
if request.TopP >= 1 {
request.TopP = 0.99
}
return requestOpenAI2Zhipu(*request), nil return requestOpenAI2Zhipu(*request), nil
} }

3
relay/channel/zhipu_4v/adaptor.go
View File

@ -34,6 +34,9 @@ func (a *Adaptor) ConvertRequest(c *gin.Context, relayMode int, request *dto.Gen
if request == nil { if request == nil {
return nil, errors.New("request is nil") return nil, errors.New("request is nil")
} }
if request.TopP >= 1 {
request.TopP = 0.99
}
return requestOpenAI2Zhipu(*request), nil return requestOpenAI2Zhipu(*request), nil
} }

2
relay/common/relay_info.go
View File

@ -24,6 +24,7 @@ type RelayInfo struct {
ApiVersion string ApiVersion string
PromptTokens int PromptTokens int
ApiKey string ApiKey string
Organization string
BaseUrl string BaseUrl string
} }
@ -52,6 +53,7 @@ func GenRelayInfo(c *gin.Context) *RelayInfo {
ApiType: apiType, ApiType: apiType,
ApiVersion: c.GetString("api_version"), ApiVersion: c.GetString("api_version"),
ApiKey: strings.TrimPrefix(c.Request.Header.Get("Authorization"), "Bearer "), ApiKey: strings.TrimPrefix(c.Request.Header.Get("Authorization"), "Bearer "),
Organization: c.GetString("channel_organization"),
} }
if info.BaseUrl == "" { if info.BaseUrl == "" {
info.BaseUrl = common.ChannelBaseURLs[channelType] info.BaseUrl = common.ChannelBaseURLs[channelType]

6
relay/constant/api_type.go
View File

@ -16,6 +16,8 @@ const (
APITypeTencent APITypeTencent
APITypeGemini APITypeGemini
APITypeZhipu_v4 APITypeZhipu_v4
APITypeOllama
APITypePerplexity
APITypeDummy // this one is only for count, do not add any channel after this APITypeDummy // this one is only for count, do not add any channel after this
) )
@ -43,6 +45,10 @@ func ChannelType2APIType(channelType int) int {
apiType = APITypeGemini apiType = APITypeGemini
case common.ChannelTypeZhipu_v4: case common.ChannelTypeZhipu_v4:
apiType = APITypeZhipu_v4 apiType = APITypeZhipu_v4
case common.ChannelTypeOllama:
apiType = APITypeOllama
case common.ChannelTypePerplexity:
apiType = APITypePerplexity
} }
return apiType return apiType
} }

18
relay/relay-mj.go
View File

@ -266,24 +266,6 @@ func RelayMidjourneyTaskImageSeed(c *gin.Context) *dto.MidjourneyResponse {
if err != nil { if err != nil {
return &midjResponseWithStatus.Response return &midjResponseWithStatus.Response
} }
//defer func(ctx context.Context) {
// err := model.PostConsumeTokenQuota(tokenId, userQuota, quota, 0, true)
// if err != nil {
// common.SysError("error consuming token remain quota: " + err.Error())
// }
// err = model.CacheUpdateUserQuota(userId)
// if err != nil {
// common.SysError("error update user quota cache: " + err.Error())
// }
// if quota != 0 {
// tokenName := c.GetString("token_name")
// logContent := fmt.Sprintf("模型固定价格 %.2f，分组倍率 %.2f，操作 %s", modelPrice, groupRatio, midjRequest.Action)
// model.RecordConsumeLog(ctx, userId, channelId, 0, 0, modelName, tokenName, quota, logContent, tokenId, userQuota, 0, false)
// model.UpdateUserUsedQuotaAndRequestCount(userId, quota)
// channelId := c.GetInt("channel_id")
// model.UpdateChannelUsedQuota(channelId, quota)
// }
//}(c.Request.Context())
midjResponse := &midjResponseWithStatus.Response midjResponse := &midjResponseWithStatus.Response
c.Writer.WriteHeader(midjResponseWithStatus.StatusCode) c.Writer.WriteHeader(midjResponseWithStatus.StatusCode)
respBody, err := json.Marshal(midjResponse) respBody, err := json.Marshal(midjResponse)

6
relay/relay_adaptor.go
View File

@ -6,8 +6,10 @@ import (
"one-api/relay/channel/baidu" "one-api/relay/channel/baidu"
"one-api/relay/channel/claude" "one-api/relay/channel/claude"
"one-api/relay/channel/gemini" "one-api/relay/channel/gemini"
"one-api/relay/channel/ollama"
"one-api/relay/channel/openai" "one-api/relay/channel/openai"
"one-api/relay/channel/palm" "one-api/relay/channel/palm"
"one-api/relay/channel/perplexity"
"one-api/relay/channel/tencent" "one-api/relay/channel/tencent"
"one-api/relay/channel/xunfei" "one-api/relay/channel/xunfei"
"one-api/relay/channel/zhipu" "one-api/relay/channel/zhipu"
@ -39,6 +41,10 @@ func GetAdaptor(apiType int) channel.Adaptor {
return &zhipu.Adaptor{} return &zhipu.Adaptor{}
case constant.APITypeZhipu_v4: case constant.APITypeZhipu_v4:
return &zhipu_4v.Adaptor{} return &zhipu_4v.Adaptor{}
case constant.APITypeOllama:
return &ollama.Adaptor{}
case constant.APITypePerplexity:
return &perplexity.Adaptor{}
} }
return nil return nil
} }

15
service/midjourney.go
View File

@ -7,6 +7,7 @@ import (
"io" "io"
"log" "log"
"net/http" "net/http"
"one-api/common"
"one-api/constant" "one-api/constant"
"one-api/dto" "one-api/dto"
relayconstant "one-api/relay/constant" relayconstant "one-api/relay/constant"
@ -158,14 +159,19 @@ func DoMidjourneyHttpRequest(c *gin.Context, timeout time.Duration, fullRequestU
//requestBody = c.Request.Body //requestBody = c.Request.Body
// read request body to json, delete accountFilter and notifyHook // read request body to json, delete accountFilter and notifyHook
var mapResult map[string]interface{} var mapResult map[string]interface{}
// if get request, no need to read request body
if c.Request.Method != "GET" {
err := json.NewDecoder(c.Request.Body).Decode(&mapResult) err := json.NewDecoder(c.Request.Body).Decode(&mapResult)
if err != nil { if err != nil {
return MidjourneyErrorWithStatusCodeWrapper(constant.MjErrorUnknown, "read_request_body_failed", http.StatusInternalServerError), nullBytes, err return MidjourneyErrorWithStatusCodeWrapper(constant.MjErrorUnknown, "read_request_body_failed", http.StatusInternalServerError), nullBytes, err
} }
delete(mapResult, "accountFilter") delete(mapResult, "accountFilter")
if !constant.MjNotifyEnabled {
delete(mapResult, "notifyHook") delete(mapResult, "notifyHook")
}
//req, err := http.NewRequest(c.Request.Method, fullRequestURL, requestBody) //req, err := http.NewRequest(c.Request.Method, fullRequestURL, requestBody)
// make new request with mapResult // make new request with mapResult
}
reqBody, err := json.Marshal(mapResult) reqBody, err := json.Marshal(mapResult)
if err != nil { if err != nil {
return MidjourneyErrorWithStatusCodeWrapper(constant.MjErrorUnknown, "marshal_request_body_failed", http.StatusInternalServerError), nullBytes, err return MidjourneyErrorWithStatusCodeWrapper(constant.MjErrorUnknown, "marshal_request_body_failed", http.StatusInternalServerError), nullBytes, err
@ -183,6 +189,7 @@ func DoMidjourneyHttpRequest(c *gin.Context, timeout time.Duration, fullRequestU
defer cancel() defer cancel()
resp, err := GetHttpClient().Do(req) resp, err := GetHttpClient().Do(req)
if err != nil { if err != nil {
common.SysError("do request failed: " + err.Error())
return MidjourneyErrorWithStatusCodeWrapper(constant.MjErrorUnknown, "do_request_failed", http.StatusInternalServerError), nullBytes, err return MidjourneyErrorWithStatusCodeWrapper(constant.MjErrorUnknown, "do_request_failed", http.StatusInternalServerError), nullBytes, err
} }
statusCode := resp.StatusCode statusCode := resp.StatusCode
@ -207,12 +214,16 @@ func DoMidjourneyHttpRequest(c *gin.Context, timeout time.Duration, fullRequestU
if err != nil { if err != nil {
return MidjourneyErrorWithStatusCodeWrapper(constant.MjErrorUnknown, "close_response_body_failed", statusCode), responseBody, err return MidjourneyErrorWithStatusCodeWrapper(constant.MjErrorUnknown, "close_response_body_failed", statusCode), responseBody, err
} }
respStr := string(responseBody)
log.Printf("responseBody: %s", respStr)
if respStr == "" {
return MidjourneyErrorWithStatusCodeWrapper(constant.MjErrorUnknown, "empty_response_body", statusCode), responseBody, nil
} else {
err = json.Unmarshal(responseBody, &midjResponse) err = json.Unmarshal(responseBody, &midjResponse)
log.Printf("responseBody: %s", string(responseBody))
if err != nil { if err != nil {
return MidjourneyErrorWithStatusCodeWrapper(constant.MjErrorUnknown, "unmarshal_response_body_failed", statusCode), responseBody, err return MidjourneyErrorWithStatusCodeWrapper(constant.MjErrorUnknown, "unmarshal_response_body_failed", statusCode), responseBody, err
} }
}
//log.Printf("midjResponse: %v", midjResponse) //log.Printf("midjResponse: %v", midjResponse)
//for k, v := range resp.Header { //for k, v := range resp.Header {
// c.Writer.Header().Set(k, v[0]) // c.Writer.Header().Set(k, v[0])

2
web/package.json
View File

@ -49,7 +49,7 @@
] ]
}, },
"devDependencies": { "devDependencies": {
"prettier": "^2.7.1", "prettier": "2.8.8",
"typescript": "4.4.2" "typescript": "4.4.2"
}, },
"prettier": { "prettier": {

58
web/src/App.js
View File

@ -8,13 +8,12 @@ import LoginForm from './components/LoginForm';
import NotFound from './pages/NotFound'; import NotFound from './pages/NotFound';
import Setting from './pages/Setting'; import Setting from './pages/Setting';
import EditUser from './pages/User/EditUser'; import EditUser from './pages/User/EditUser';
import { API, getLogo, getSystemName, showError, showNotice } from './helpers'; import { getLogo, getSystemName } from './helpers';
import PasswordResetForm from './components/PasswordResetForm'; import PasswordResetForm from './components/PasswordResetForm';
import GitHubOAuth from './components/GitHubOAuth'; import GitHubOAuth from './components/GitHubOAuth';
import LinuxDoOAuth from "./components/LinuxDoOAuth"; import LinuxDoOAuth from "./components/LinuxDoOAuth";
import PasswordResetConfirm from './components/PasswordResetConfirm'; import PasswordResetConfirm from './components/PasswordResetConfirm';
import { UserContext } from './context/User'; import { UserContext } from './context/User';
import { StatusContext } from './context/Status';
import Channel from './pages/Channel'; import Channel from './pages/Channel';
import Token from './pages/Token'; import Token from './pages/Token';
import EditChannel from './pages/Channel/EditChannel'; import EditChannel from './pages/Channel/EditChannel';
@ -22,12 +21,13 @@ import Redemption from './pages/Redemption';
import TopUp from './pages/TopUp'; import TopUp from './pages/TopUp';
import Log from './pages/Log'; import Log from './pages/Log';
import Chat from './pages/Chat'; import Chat from './pages/Chat';
import {Layout} from "@douyinfe/semi-ui"; import { Layout } from '@douyinfe/semi-ui';
import Midjourney from "./pages/Midjourney"; import Midjourney from './pages/Midjourney';
import Detail from "./pages/Detail"; import Detail from './pages/Detail';
const Home = lazy(() => import('./pages/Home')); const Home = lazy(() => import('./pages/Home'));
const About = lazy(() => import('./pages/About')); const About = lazy(() => import('./pages/About'));
function App() { function App() {
const [userState, userDispatch] = useContext(UserContext); const [userState, userDispatch] = useContext(UserContext);
// const [statusState, statusDispatch] = useContext(StatusContext); // const [statusState, statusDispatch] = useContext(StatusContext);
@ -48,7 +48,7 @@ function App() {
} }
let logo = getLogo(); let logo = getLogo();
if (logo) { if (logo) {
let linkElement = document.querySelector("link[rel~='icon']"); let linkElement = document.querySelector('link[rel~=\'icon\']');
if (linkElement) { if (linkElement) {
linkElement.href = logo; linkElement.href = logo;
} }
@ -60,7 +60,7 @@ function App() {
<Layout.Content> <Layout.Content>
<Routes> <Routes>
<Route <Route
path='/' path="/"
element={ element={
<Suspense fallback={<Loading></Loading>}> <Suspense fallback={<Loading></Loading>}>
<Home /> <Home />
@ -68,7 +68,7 @@ function App() {
} }
/> />
<Route <Route
path='/channel' path="/channel"
element={ element={
<PrivateRoute> <PrivateRoute>
<Channel /> <Channel />
@ -76,7 +76,7 @@ function App() {
} }
/> />
<Route <Route
path='/channel/edit/:id' path="/channel/edit/:id"
element={ element={
<Suspense fallback={<Loading></Loading>}> <Suspense fallback={<Loading></Loading>}>
<EditChannel /> <EditChannel />
@ -84,7 +84,7 @@ function App() {
} }
/> />
<Route <Route
path='/channel/add' path="/channel/add"
element={ element={
<Suspense fallback={<Loading></Loading>}> <Suspense fallback={<Loading></Loading>}>
<EditChannel /> <EditChannel />
@ -92,7 +92,7 @@ function App() {
} }
/> />
<Route <Route
path='/token' path="/token"
element={ element={
<PrivateRoute> <PrivateRoute>
<Token /> <Token />
@ -100,7 +100,7 @@ function App() {
} }
/> />
<Route <Route
path='/redemption' path="/redemption"
element={ element={
<PrivateRoute> <PrivateRoute>
<Redemption /> <Redemption />
@ -108,7 +108,7 @@ function App() {
} }
/> />
<Route <Route
path='/user' path="/user"
element={ element={
<PrivateRoute> <PrivateRoute>
<User /> <User />
@ -116,7 +116,7 @@ function App() {
} }
/> />
<Route <Route
path='/user/edit/:id' path="/user/edit/:id"
element={ element={
<Suspense fallback={<Loading></Loading>}> <Suspense fallback={<Loading></Loading>}>
<EditUser /> <EditUser />
@ -124,7 +124,7 @@ function App() {
} }
/> />
<Route <Route
path='/user/edit' path="/user/edit"
element={ element={
<Suspense fallback={<Loading></Loading>}> <Suspense fallback={<Loading></Loading>}>
<EditUser /> <EditUser />
@ -132,7 +132,7 @@ function App() {
} }
/> />
<Route <Route
path='/user/reset' path="/user/reset"
element={ element={
<Suspense fallback={<Loading></Loading>}> <Suspense fallback={<Loading></Loading>}>
<PasswordResetConfirm /> <PasswordResetConfirm />
@ -140,7 +140,7 @@ function App() {
} }
/> />
<Route <Route
path='/login' path="/login"
element={ element={
<Suspense fallback={<Loading></Loading>}> <Suspense fallback={<Loading></Loading>}>
<LoginForm /> <LoginForm />
@ -148,7 +148,7 @@ function App() {
} }
/> />
<Route <Route
path='/register' path="/register"
element={ element={
<Suspense fallback={<Loading></Loading>}> <Suspense fallback={<Loading></Loading>}>
<RegisterForm /> <RegisterForm />
@ -156,7 +156,7 @@ function App() {
} }
/> />
<Route <Route
path='/reset' path="/reset"
element={ element={
<Suspense fallback={<Loading></Loading>}> <Suspense fallback={<Loading></Loading>}>
<PasswordResetForm /> <PasswordResetForm />
@ -164,7 +164,7 @@ function App() {
} }
/> />
<Route <Route
path='/oauth/github' path="/oauth/github"
element={ element={
<Suspense fallback={<Loading></Loading>}> <Suspense fallback={<Loading></Loading>}>
<GitHubOAuth /> <GitHubOAuth />
@ -172,7 +172,7 @@ function App() {
} }
/> />
<Route <Route
path='/oauth/linuxdo' path="/oauth/linuxdo"
element={ element={
<Suspense fallback={<Loading></Loading>}> <Suspense fallback={<Loading></Loading>}>
<LinuxDoOAuth /> <LinuxDoOAuth />
@ -180,7 +180,7 @@ function App() {
} }
/> />
<Route <Route
path='/setting' path="/setting"
element={ element={
<PrivateRoute> <PrivateRoute>
<Suspense fallback={<Loading></Loading>}> <Suspense fallback={<Loading></Loading>}>
@ -190,7 +190,7 @@ function App() {
} }
/> />
<Route <Route
path='/topup' path="/topup"
element={ element={
<PrivateRoute> <PrivateRoute>
<Suspense fallback={<Loading></Loading>}> <Suspense fallback={<Loading></Loading>}>
@ -200,7 +200,7 @@ function App() {
} }
/> />
<Route <Route
path='/log' path="/log"
element={ element={
<PrivateRoute> <PrivateRoute>
<Log /> <Log />
@ -208,7 +208,7 @@ function App() {
} }
/> />
<Route <Route
path='/detail' path="/detail"
element={ element={
<PrivateRoute> <PrivateRoute>
<Detail /> <Detail />
@ -216,7 +216,7 @@ function App() {
} }
/> />
<Route <Route
path='/midjourney' path="/midjourney"
element={ element={
<PrivateRoute> <PrivateRoute>
<Midjourney /> <Midjourney />
@ -224,7 +224,7 @@ function App() {
} }
/> />
<Route <Route
path='/about' path="/about"
element={ element={
<Suspense fallback={<Loading></Loading>}> <Suspense fallback={<Loading></Loading>}>
<About /> <About />
@ -232,14 +232,14 @@ function App() {
} }
/> />
<Route <Route
path='/chat' path="/chat"
element={ element={
<Suspense fallback={<Loading></Loading>}> <Suspense fallback={<Loading></Loading>}>
<Chat /> <Chat />
</Suspense> </Suspense>
} }
/> />
<Route path='*' element={ <Route path="*" element={
<NotFound /> <NotFound />
} /> } />
</Routes> </Routes>

281
web/src/components/ChannelsTable.js
View File

@ -1,32 +1,24 @@
import React, { useEffect, useState } from 'react'; import React, { useEffect, useState } from 'react';
import { import { API, isMobile, shouldShowPrompt, showError, showInfo, showSuccess, timestamp2string } from '../helpers';
API,
isMobile,
shouldShowPrompt,
showError,
showInfo,
showSuccess,
timestamp2string
} from '../helpers';
import { CHANNEL_OPTIONS, ITEMS_PER_PAGE } from '../constants'; import { CHANNEL_OPTIONS, ITEMS_PER_PAGE } from '../constants';
import {renderGroup, renderNumber, renderNumberWithPoint, renderQuota, renderQuotaWithPrompt} from '../helpers/render'; import { renderGroup, renderNumberWithPoint, renderQuota } from '../helpers/render';
import { import {
Avatar,
Tag,
Table,
Button, Button,
Popover, Dropdown,
Form, Form,
Modal, InputNumber,
Popconfirm, Popconfirm,
Space, Space,
Tooltip, SplitButtonGroup,
Switch, Switch,
Typography, InputNumber, Dropdown, SplitButtonGroup Table,
} from "@douyinfe/semi-ui"; Tag,
import EditChannel from "../pages/Channel/EditChannel"; Tooltip,
import {IconTreeTriangleDown} from "@douyinfe/semi-icons"; Typography
} from '@douyinfe/semi-ui';
import EditChannel from '../pages/Channel/EditChannel';
import { IconTreeTriangleDown } from '@douyinfe/semi-icons';
function renderTimestamp(timestamp) { function renderTimestamp(timestamp) {
return ( return (
@ -40,34 +32,13 @@ let type2label = undefined;
function renderType(type) { function renderType(type) {
if (!type2label) { if (!type2label) {
type2label = new Map; type2label = new Map();
for (let i = 0; i < CHANNEL_OPTIONS.length; i++) { for (let i = 0; i < CHANNEL_OPTIONS.length; i++) {
type2label[CHANNEL_OPTIONS[i].value] = CHANNEL_OPTIONS[i]; type2label[CHANNEL_OPTIONS[i].value] = CHANNEL_OPTIONS[i];
} }
type2label[0] = { value: 0, text: '未知类型', color: 'grey' }; type2label[0] = { value: 0, text: '未知类型', color: 'grey' };
} }
return <Tag size='large' color={type2label[type]?.color}>{type2label[type]?.text}</Tag>; return <Tag size="large" color={type2label[type]?.color}>{type2label[type]?.text}</Tag>;
}
function renderBalance(type, balance) {
switch (type) {
case 1: // OpenAI
return <span>${balance.toFixed(2)}</span>;
case 4: // CloseAI
return <span>¥{balance.toFixed(2)}</span>;
case 8: // 自定义
return <span>${balance.toFixed(2)}</span>;
case 5: // OpenAI-SB
return <span>¥{(balance / 10000).toFixed(2)}</span>;
case 10: // AI Proxy
return <span>{renderNumber(balance)}</span>;
case 12: // API2GPT
return <span>¥{balance.toFixed(2)}</span>;
case 13: // AIGC2D
return <span>{renderNumber(balance)}</span>;
default:
return <span>不支持</span>;
}
} }
const ChannelsTable = () => { const ChannelsTable = () => {
@ -79,11 +50,11 @@ const ChannelsTable = () => {
// }, // },
{ {
title: 'ID', title: 'ID',
dataIndex: 'id', dataIndex: 'id'
}, },
{ {
title: '名称', title: '名称',
dataIndex: 'name', dataIndex: 'name'
}, },
{ {
title: '分组', title: '分组',
@ -94,13 +65,13 @@ const ChannelsTable = () => {
<Space spacing={2}> <Space spacing={2}>
{ {
text.split(',').map((item, index) => { text.split(',').map((item, index) => {
return (renderGroup(item)) return (renderGroup(item));
}) })
} }
</Space> </Space>
</div> </div>
); );
}, }
}, },
{ {
title: '类型', title: '类型',
@ -111,7 +82,7 @@ const ChannelsTable = () => {
{renderType(text)} {renderType(text)}
</div> </div>
); );
}, }
}, },
{ {
title: '状态', title: '状态',
@ -122,7 +93,7 @@ const ChannelsTable = () => {
{renderStatus(text)} {renderStatus(text)}
</div> </div>
); );
}, }
}, },
{ {
title: '响应时间', title: '响应时间',
@ -133,7 +104,7 @@ const ChannelsTable = () => {
{renderResponseTime(text)} {renderResponseTime(text)}
</div> </div>
); );
}, }
}, },
{ {
title: '已用/剩余', title: '已用/剩余',
@ -143,15 +114,17 @@ const ChannelsTable = () => {
<div> <div>
<Space spacing={1}> <Space spacing={1}>
<Tooltip content={'已用额度'}> <Tooltip content={'已用额度'}>
<Tag color='white' type='ghost' size='large'>{renderQuota(record.used_quota)}</Tag> <Tag color="white" type="ghost" size="large">{renderQuota(record.used_quota)}</Tag>
</Tooltip> </Tooltip>
<Tooltip content={'剩余额度' + record.balance + '，点击更新'}> <Tooltip content={'剩余额度' + record.balance + '，点击更新'}>
<Tag color='white' type='ghost' size='large' onClick={() => {updateChannelBalance(record)}}>${renderNumberWithPoint(record.balance)}</Tag> <Tag color="white" type="ghost" size="large" onClick={() => {
updateChannelBalance(record);
}}>${renderNumberWithPoint(record.balance)}</Tag>
</Tooltip> </Tooltip>
</Space> </Space>
</div> </div>
); );
}, }
}, },
{ {
title: '优先级', title: '优先级',
@ -161,16 +134,18 @@ const ChannelsTable = () => {
<div> <div>
<InputNumber <InputNumber
style={{ width: 70 }} style={{ width: 70 }}
name='priority' name="priority"
onChange={value => { onBlur={e => {
manageChannel(record.id, 'priority', record, value); manageChannel(record.id, 'priority', record, e.target.value);
}} }}
keepFocus={true}
innerButtons
defaultValue={record.priority} defaultValue={record.priority}
min={-999} min={-999}
/> />
</div> </div>
); );
}, }
}, },
{ {
title: '权重', title: '权重',
@ -180,16 +155,18 @@ const ChannelsTable = () => {
<div> <div>
<InputNumber <InputNumber
style={{ width: 70 }} style={{ width: 70 }}
name='weight' name="weight"
onChange={value => { onBlur={e => {
manageChannel(record.id, 'weight', record, value); manageChannel(record.id, 'weight', record, e.target.value);
}} }}
keepFocus={true}
innerButtons
defaultValue={record.weight} defaultValue={record.weight}
min={0} min={0}
/> />
</div> </div>
); );
}, }
}, },
{ {
title: '', title: '',
@ -197,7 +174,9 @@ const ChannelsTable = () => {
render: (text, record, index) => ( render: (text, record, index) => (
<div> <div>
<SplitButtonGroup style={{ marginRight: 1 }} aria-label="测试操作项目组"> <SplitButtonGroup style={{ marginRight: 1 }} aria-label="测试操作项目组">
<Button theme="light" onClick={()=>{testChannel(record, '')}}>测试</Button> <Button theme="light" onClick={() => {
testChannel(record, '');
}}>测试</Button>
<Dropdown trigger="click" position="bottomRight" menu={record.test_models} <Dropdown trigger="click" position="bottomRight" menu={record.test_models}
> >
<Button style={{ padding: '8px 4px' }} type="primary" icon={<IconTreeTriangleDown />}></Button> <Button style={{ padding: '8px 4px' }} type="primary" icon={<IconTreeTriangleDown />}></Button>
@ -214,23 +193,23 @@ const ChannelsTable = () => {
() => { () => {
removeRecord(record.id); removeRecord(record.id);
} }
) );
}} }}
> >
<Button theme='light' type='danger' style={{marginRight: 1}}>删除</Button> <Button theme="light" type="danger" style={{ marginRight: 1 }}>删除</Button>
</Popconfirm> </Popconfirm>
{ {
record.status === 1 ? record.status === 1 ?
<Button theme='light' type='warning' style={{marginRight: 1}} onClick={ <Button theme="light" type="warning" style={{ marginRight: 1 }} onClick={
async () => { async () => {
manageChannel( manageChannel(
record.id, record.id,
'disable', 'disable',
record record
) );
} }
}>禁用</Button> : }>禁用</Button> :
<Button theme='light' type='secondary' style={{marginRight: 1}} onClick={ <Button theme="light" type="secondary" style={{ marginRight: 1 }} onClick={
async () => { async () => {
manageChannel( manageChannel(
record.id, record.id,
@ -240,15 +219,15 @@ const ChannelsTable = () => {
} }
}>启用</Button> }>启用</Button>
} }
<Button theme='light' type='tertiary' style={{marginRight: 1}} onClick={ <Button theme="light" type="tertiary" style={{ marginRight: 1 }} onClick={
() => { () => {
setEditingChannel(record); setEditingChannel(record);
setShowEdit(true); setShowEdit(true);
} }
}>编辑</Button> }>编辑</Button>
</div> </div>
), )
}, }
]; ];
const [channels, setChannels] = useState([]); const [channels, setChannels] = useState([]);
@ -261,13 +240,13 @@ const ChannelsTable = () => {
const [searching, setSearching] = useState(false); const [searching, setSearching] = useState(false);
const [updatingBalance, setUpdatingBalance] = useState(false); const [updatingBalance, setUpdatingBalance] = useState(false);
const [pageSize, setPageSize] = useState(ITEMS_PER_PAGE); const [pageSize, setPageSize] = useState(ITEMS_PER_PAGE);
const [showPrompt, setShowPrompt] = useState(shouldShowPrompt("channel-test")); const [showPrompt, setShowPrompt] = useState(shouldShowPrompt('channel-test'));
const [channelCount, setChannelCount] = useState(pageSize); const [channelCount, setChannelCount] = useState(pageSize);
const [groupOptions, setGroupOptions] = useState([]); const [groupOptions, setGroupOptions] = useState([]);
const [showEdit, setShowEdit] = useState(false); const [showEdit, setShowEdit] = useState(false);
const [enableBatchDelete, setEnableBatchDelete] = useState(false); const [enableBatchDelete, setEnableBatchDelete] = useState(false);
const [editingChannel, setEditingChannel] = useState({ const [editingChannel, setEditingChannel] = useState({
id: undefined, id: undefined
}); });
const [selectedChannels, setSelectedChannels] = useState([]); const [selectedChannels, setSelectedChannels] = useState([]);
@ -286,17 +265,17 @@ const ChannelsTable = () => {
const setChannelFormat = (channels) => { const setChannelFormat = (channels) => {
for (let i = 0; i < channels.length; i++) { for (let i = 0; i < channels.length; i++) {
channels[i].key = '' + channels[i].id; channels[i].key = '' + channels[i].id;
let test_models = [] let test_models = [];
channels[i].models.split(',').forEach((item, index) => { channels[i].models.split(',').forEach((item, index) => {
test_models.push({ test_models.push({
node: 'item', node: 'item',
name: item, name: item,
onClick: () => { onClick: () => {
testChannel(channels[i], item) testChannel(channels[i], item);
} }
}) });
}) });
channels[i].test_models = test_models channels[i].test_models = test_models;
} }
// data.key = '' + data.id // data.key = '' + data.id
setChannels(channels); setChannels(channels);
@ -305,7 +284,7 @@ const ChannelsTable = () => {
} else { } else {
setChannelCount(channels.length); setChannelCount(channels.length);
} }
} };
const loadChannels = async (startIdx, pageSize, idSort) => { const loadChannels = async (startIdx, pageSize, idSort) => {
setLoading(true); setLoading(true);
@ -332,8 +311,10 @@ const ChannelsTable = () => {
useEffect(() => { useEffect(() => {
// console.log('default effect') // console.log('default effect')
const localIdSort = localStorage.getItem('id-sort') === 'true'; const localIdSort = localStorage.getItem('id-sort') === 'true';
setIdSort(localIdSort) const localPageSize = parseInt(localStorage.getItem('page-size')) || ITEMS_PER_PAGE;
loadChannels(0, pageSize, localIdSort) setIdSort(localIdSort);
setPageSize(localPageSize);
loadChannels(0, localPageSize, localIdSort)
.then() .then()
.catch((reason) => { .catch((reason) => {
showError(reason); showError(reason);
@ -341,16 +322,6 @@ const ChannelsTable = () => {
fetchGroups().then(); fetchGroups().then();
}, []); }, []);
// useEffect(() => {
// console.log('search effect')
// searchChannels()
// }, [searchGroup]);
// useEffect(() => {
// localStorage.setItem('id-sort', idSort + '');
// refresh()
// }, [idSort]);
const manageChannel = async (id, action, record, value) => { const manageChannel = async (id, action, record, value) => {
let data = { id }; let data = { id };
let res; let res;
@ -403,22 +374,22 @@ const ChannelsTable = () => {
const renderStatus = (status) => { const renderStatus = (status) => {
switch (status) { switch (status) {
case 1: case 1:
return <Tag size='large' color='green'>已启用</Tag>; return <Tag size="large" color="green">已启用</Tag>;
case 2: case 2:
return ( return (
<Tag size='large' color='yellow'> <Tag size="large" color="yellow">
已禁用 已禁用
</Tag> </Tag>
); );
case 3: case 3:
return ( return (
<Tag size='large' color='yellow'> <Tag size="large" color="yellow">
自动禁用 自动禁用
</Tag> </Tag>
); );
default: default:
return ( return (
<Tag size='large' color='grey'> <Tag size="large" color="grey">
未知状态 未知状态
</Tag> </Tag>
); );
@ -429,15 +400,15 @@ const ChannelsTable = () => {
let time = responseTime / 1000; let time = responseTime / 1000;
time = time.toFixed(2) + ' 秒'; time = time.toFixed(2) + ' 秒';
if (responseTime === 0) { if (responseTime === 0) {
return <Tag size='large' color='grey'>未测试</Tag>; return <Tag size="large" color="grey">未测试</Tag>;
} else if (responseTime <= 1000) { } else if (responseTime <= 1000) {
return <Tag size='large' color='green'>{time}</Tag>; return <Tag size="large" color="green">{time}</Tag>;
} else if (responseTime <= 3000) { } else if (responseTime <= 3000) {
return <Tag size='large' color='lime'>{time}</Tag>; return <Tag size="large" color="lime">{time}</Tag>;
} else if (responseTime <= 5000) { } else if (responseTime <= 5000) {
return <Tag size='large' color='yellow'>{time}</Tag>; return <Tag size="large" color="yellow">{time}</Tag>;
} else { } else {
return <Tag size='large' color='red'>{time}</Tag>; return <Tag size="large" color="red">{time}</Tag>;
} }
}; };
@ -536,7 +507,7 @@ const ChannelsTable = () => {
showError(message); showError(message);
} }
setLoading(false); setLoading(false);
} };
const fixChannelsAbilities = async () => { const fixChannelsAbilities = async () => {
const res = await API.post(`/api/channel/fix`); const res = await API.post(`/api/channel/fix`);
@ -547,28 +518,6 @@ const ChannelsTable = () => {
} else { } else {
showError(message); showError(message);
} }
}
const sortChannel = (key) => {
if (channels.length === 0) return;
setLoading(true);
let sortedChannels = [...channels];
if (typeof sortedChannels[0][key] === 'string') {
sortedChannels.sort((a, b) => {
return ('' + a[key]).localeCompare(b[key]);
});
} else {
sortedChannels.sort((a, b) => {
if (a[key] === b[key]) return 0;
if (a[key] > b[key]) return -1;
if (a[key] < b[key]) return 1;
});
}
if (sortedChannels[0].id === channels[0].id) {
sortedChannels.reverse();
}
setChannels(sortedChannels);
setLoading(false);
}; };
let pageData = channels.slice((activePage - 1) * pageSize, activePage * pageSize); let pageData = channels.slice((activePage - 1) * pageSize, activePage * pageSize);
@ -583,13 +532,14 @@ const ChannelsTable = () => {
}; };
const handlePageSizeChange = async (size) => { const handlePageSizeChange = async (size) => {
setPageSize(size) localStorage.setItem('page-size', size + '');
setActivePage(1) setPageSize(size);
setActivePage(1);
loadChannels(0, size, idSort) loadChannels(0, size, idSort)
.then() .then()
.catch((reason) => { .catch((reason) => {
showError(reason); showError(reason);
}) });
}; };
const fetchGroups = async () => { const fetchGroups = async () => {
@ -599,7 +549,7 @@ const ChannelsTable = () => {
// res.data.data.unshift('all'); // res.data.data.unshift('all');
setGroupOptions(res.data.data.map((group) => ({ setGroupOptions(res.data.data.map((group) => ({
label: group, label: group,
value: group, value: group
}))); })));
} catch (error) { } catch (error) {
showError(error.message); showError(error.message);
@ -608,14 +558,14 @@ const ChannelsTable = () => {
const closeEdit = () => { const closeEdit = () => {
setShowEdit(false); setShowEdit(false);
} };
const handleRow = (record, index) => { const handleRow = (record, index) => {
if (record.status !== 1) { if (record.status !== 1) {
return { return {
style: { style: {
background: 'var(--semi-color-disabled-border)', background: 'var(--semi-color-disabled-border)'
}, }
}; };
} else { } else {
return {}; return {};
@ -626,34 +576,36 @@ const ChannelsTable = () => {
return ( return (
<> <>
<EditChannel refresh={refresh} visible={showEdit} handleClose={closeEdit} editingChannel={editingChannel} /> <EditChannel refresh={refresh} visible={showEdit} handleClose={closeEdit} editingChannel={editingChannel} />
<Form onSubmit={() => {searchChannels(searchKeyword, searchGroup, searchModel)}} labelPosition='left'> <Form onSubmit={() => {
searchChannels(searchKeyword, searchGroup, searchModel);
}} labelPosition="left">
<div style={{ display: 'flex' }}> <div style={{ display: 'flex' }}>
<Space> <Space>
<Form.Input <Form.Input
field='search_keyword' field="search_keyword"
label='搜索渠道关键词' label="搜索渠道关键词"
placeholder='ID，名称和密钥 ...' placeholder="ID，名称和密钥 ..."
value={searchKeyword} value={searchKeyword}
loading={searching} loading={searching}
onChange={(v) => { onChange={(v) => {
setSearchKeyword(v.trim()) setSearchKeyword(v.trim());
}} }}
/> />
<Form.Input <Form.Input
field='search_model' field="search_model"
label='模型' label="模型"
placeholder='模型关键字' placeholder="模型关键字"
value={searchModel} value={searchModel}
loading={searching} loading={searching}
onChange={(v) => { onChange={(v) => {
setSearchModel(v.trim()) setSearchModel(v.trim());
}} }}
/> />
<Form.Select field="group" label='分组' optionList={groupOptions} onChange={(v) => { <Form.Select field="group" label="分组" optionList={groupOptions} onChange={(v) => {
setSearchGroup(v) setSearchGroup(v);
searchChannels(searchKeyword, v, searchModel) searchChannels(searchKeyword, v, searchModel);
}} /> }} />
<Button label='查询' type="primary" htmlType="submit" className="btn-margin-right" <Button label="查询" type="primary" htmlType="submit" className="btn-margin-right"
style={{ marginRight: 8 }}>查询</Button> style={{ marginRight: 8 }}>查询</Button>
</Space> </Space>
</div> </div>
@ -662,14 +614,14 @@ const ChannelsTable = () => {
<Space> <Space>
<Space> <Space>
<Typography.Text strong>使用ID排序</Typography.Text> <Typography.Text strong>使用ID排序</Typography.Text>
<Switch checked={idSort} label='使用ID排序' uncheckedText="关" aria-label="是否用ID排序" onChange={(v) => { <Switch checked={idSort} label="使用ID排序" uncheckedText="关" aria-label="是否用ID排序" onChange={(v) => {
localStorage.setItem('id-sort', v + '') localStorage.setItem('id-sort', v + '');
setIdSort(v) setIdSort(v);
loadChannels(0, pageSize, v) loadChannels(0, pageSize, v)
.then() .then()
.catch((reason) => { .catch((reason) => {
showError(reason); showError(reason);
}) });
}}></Switch> }}></Switch>
</Space> </Space>
</Space> </Space>
@ -683,26 +635,32 @@ const ChannelsTable = () => {
showSizeChanger: true, showSizeChanger: true,
formatPageText: (page) => '', formatPageText: (page) => '',
onPageSizeChange: (size) => { onPageSizeChange: (size) => {
handlePageSizeChange(size).then() handlePageSizeChange(size).then();
}, },
onPageChange: handlePageChange, onPageChange: handlePageChange
}} loading={loading} onRow={handleRow} rowSelection={ }} loading={loading} onRow={handleRow} rowSelection={
enableBatchDelete ? enableBatchDelete ?
{ {
onChange: (selectedRowKeys, selectedRows) => { onChange: (selectedRowKeys, selectedRows) => {
// console.log(`selectedRowKeys: ${selectedRowKeys}`, 'selectedRows: ', selectedRows); // console.log(`selectedRowKeys: ${selectedRowKeys}`, 'selectedRows: ', selectedRows);
setSelectedChannels(selectedRows); setSelectedChannels(selectedRows);
}, }
} : null } : null
} /> } />
<div style={{display: isMobile()?'':'flex', marginTop: isMobile()?0:-45, zIndex: 999, position: 'relative', pointerEvents: 'none'}}> <div style={{
display: isMobile() ? '' : 'flex',
marginTop: isMobile() ? 0 : -45,
zIndex: 999,
position: 'relative',
pointerEvents: 'none'
}}>
<Space style={{ pointerEvents: 'auto', marginTop: isMobile() ? 0 : 45 }}> <Space style={{ pointerEvents: 'auto', marginTop: isMobile() ? 0 : 45 }}>
<Button theme='light' type='primary' style={{marginRight: 8}} onClick={ <Button theme="light" type="primary" style={{ marginRight: 8 }} onClick={
() => { () => {
setEditingChannel({ setEditingChannel({
id: undefined, id: undefined
}); });
setShowEdit(true) setShowEdit(true);
} }
}>添加渠道</Button> }>添加渠道</Button>
<Popconfirm <Popconfirm
@ -711,14 +669,14 @@ const ChannelsTable = () => {
onConfirm={testAllChannels} onConfirm={testAllChannels}
position={isMobile() ? 'top' : 'top'} position={isMobile() ? 'top' : 'top'}
> >
<Button theme='light' type='warning' style={{marginRight: 8}}>测试所有通道</Button> <Button theme="light" type="warning" style={{ marginRight: 8 }}>测试所有通道</Button>
</Popconfirm> </Popconfirm>
<Popconfirm <Popconfirm
title="确定？" title="确定？"
okType={'secondary'} okType={'secondary'}
onConfirm={updateAllChannelsBalance} onConfirm={updateAllChannelsBalance}
> >
<Button theme='light' type='secondary' style={{marginRight: 8}}>更新所有已启用通道余额</Button> <Button theme="light" type="secondary" style={{ marginRight: 8 }}>更新所有已启用通道余额</Button>
</Popconfirm> </Popconfirm>
<Popconfirm <Popconfirm
title="确定是否要删除禁用通道？" title="确定是否要删除禁用通道？"
@ -726,10 +684,10 @@ const ChannelsTable = () => {
okType={'danger'} okType={'danger'}
onConfirm={deleteAllDisabledChannels} onConfirm={deleteAllDisabledChannels}
> >
<Button theme='light' type='danger' style={{marginRight: 8}}>删除禁用通道</Button> <Button theme="light" type="danger" style={{ marginRight: 8 }}>删除禁用通道</Button>
</Popconfirm> </Popconfirm>
<Button theme='light' type='primary' style={{marginRight: 8}} onClick={refresh}>刷新</Button> <Button theme="light" type="primary" style={{ marginRight: 8 }} onClick={refresh}>刷新</Button>
</Space> </Space>
{/*<div style={{width: '100%', pointerEvents: 'none', position: 'absolute'}}>*/} {/*<div style={{width: '100%', pointerEvents: 'none', position: 'absolute'}}>*/}
@ -738,8 +696,8 @@ const ChannelsTable = () => {
<div style={{ marginTop: 20 }}> <div style={{ marginTop: 20 }}>
<Space> <Space>
<Typography.Text strong>开启批量删除</Typography.Text> <Typography.Text strong>开启批量删除</Typography.Text>
<Switch label='开启批量删除' uncheckedText="关" aria-label="是否开启批量删除" onChange={(v) => { <Switch label="开启批量删除" uncheckedText="关" aria-label="是否开启批量删除" onChange={(v) => {
setEnableBatchDelete(v) setEnableBatchDelete(v);
}}></Switch> }}></Switch>
<Popconfirm <Popconfirm
title="确定是否要删除所选通道？" title="确定是否要删除所选通道？"
@ -749,7 +707,8 @@ const ChannelsTable = () => {
disabled={!enableBatchDelete} disabled={!enableBatchDelete}
position={'top'} position={'top'}
> >
<Button disabled={!enableBatchDelete} theme='light' type='danger' style={{marginRight: 8}}>删除所选通道</Button> <Button disabled={!enableBatchDelete} theme="light" type="danger"
style={{ marginRight: 8 }}>删除所选通道</Button>
</Popconfirm> </Popconfirm>
<Popconfirm <Popconfirm
title="确定是否要修复数据库一致性？" title="确定是否要修复数据库一致性？"
@ -758,7 +717,7 @@ const ChannelsTable = () => {
onConfirm={fixChannelsAbilities} onConfirm={fixChannelsAbilities}
position={'top'} position={'top'}
> >
<Button theme='light' type='secondary' style={{marginRight: 8}}>修复数据库一致性</Button> <Button theme="light" type="secondary" style={{ marginRight: 8 }}>修复数据库一致性</Button>
</Popconfirm> </Popconfirm>
</Space> </Space>
</div> </div>

16
web/src/components/Footer.js
View File

@ -1,7 +1,7 @@
import React, { useEffect, useState } from 'react'; import React, { useEffect, useState } from 'react';
import { getFooterHTML, getSystemName } from '../helpers'; import { getFooterHTML, getSystemName } from '../helpers';
import {Layout} from "@douyinfe/semi-ui"; import { Layout } from '@douyinfe/semi-ui';
const Footer = () => { const Footer = () => {
const systemName = getSystemName(); const systemName = getSystemName();
@ -32,27 +32,27 @@ const Footer = () => {
<Layout.Content style={{ textAlign: 'center' }}> <Layout.Content style={{ textAlign: 'center' }}>
{footer ? ( {footer ? (
<div <div
className='custom-footer' className="custom-footer"
dangerouslySetInnerHTML={{ __html: footer }} dangerouslySetInnerHTML={{ __html: footer }}
></div> ></div>
) : ( ) : (
<div className='custom-footer'> <div className="custom-footer">
<a <a
href='https://github.com/Calcium-Ion/new-api' href="https://github.com/Calcium-Ion/new-api"
target='_blank' target="_blank" rel="noreferrer"
> >
New API {process.env.REACT_APP_VERSION}{' '} New API {process.env.REACT_APP_VERSION}{' '}
</a> </a>
由{' '} 由{' '}
<a href='https://github.com/Calcium-Ion' target='_blank'> <a href="https://github.com/Calcium-Ion" target="_blank" rel="noreferrer">
Calcium-Ion Calcium-Ion
</a>{' '} </a>{' '}
开发，基于{' '} 开发，基于{' '}
<a href='https://github.com/songquanpeng/one-api' target='_blank'> <a href="https://github.com/songquanpeng/one-api" target="_blank" rel="noreferrer">
One API v0.5.4 One API v0.5.4
</a>{' '} </a>{' '}
，本项目根据{' '} ，本项目根据{' '}
<a href='https://opensource.org/licenses/mit-license.php'> <a href="https://opensource.org/licenses/mit-license.php">
MIT 许可证 MIT 许可证
</a>{' '} </a>{' '}
授权 授权

2
web/src/components/GitHubOAuth.js
View File

@ -58,7 +58,7 @@ const GitHubOAuth = () => {
return ( return (
<Segment style={{ minHeight: '300px' }}> <Segment style={{ minHeight: '300px' }}>
<Dimmer active inverted> <Dimmer active inverted>
<Loader size='large'>{prompt}</Loader> <Loader size="large">{prompt}</Loader>
</Dimmer> </Dimmer>
</Segment> </Segment>
); );

26
web/src/components/HeaderBar.js
View File

@ -1,19 +1,15 @@
import React, {useContext, useEffect, useRef, useState} from 'react'; import React, { useContext, useEffect, useState } from 'react';
import { Link, useNavigate } from 'react-router-dom'; import { Link, useNavigate } from 'react-router-dom';
import { UserContext } from '../context/User'; import { UserContext } from '../context/User';
import {API, getLogo, getSystemName, isAdmin, isMobile, showSuccess} from '../helpers'; import { API, getLogo, getSystemName, showSuccess } from '../helpers';
import '../index.css'; import '../index.css';
import fireworks from 'react-fireworks'; import fireworks from 'react-fireworks';
import { import { IconHelpCircle, IconKey, IconUser } from '@douyinfe/semi-icons';
IconKey, import { Avatar, Dropdown, Layout, Nav, Switch } from '@douyinfe/semi-ui';
IconUser, import { stringToColor } from '../helpers/render';
IconHelpCircle
} from '@douyinfe/semi-icons';
import {Nav, Avatar, Dropdown, Layout, Switch} from '@douyinfe/semi-ui';
import {stringToColor} from "../helpers/render";
// HeaderBar Buttons // HeaderBar Buttons
let headerButtons = [ let headerButtons = [
@ -22,7 +18,7 @@ let headerButtons = [
itemKey: 'about', itemKey: 'about',
to: '/about', to: '/about',
icon: <IconHelpCircle /> icon: <IconHelpCircle />
}, }
]; ];
if (localStorage.getItem('chat_link')) { if (localStorage.getItem('chat_link')) {
@ -56,7 +52,7 @@ const HeaderBar = () => {
} }
const handleNewYearClick = () => { const handleNewYearClick = () => {
fireworks.init("root",{}); fireworks.init('root', {});
fireworks.start(); fireworks.start();
setTimeout(() => { setTimeout(() => {
fireworks.stop(); fireworks.stop();
@ -95,13 +91,13 @@ const HeaderBar = () => {
// bodyStyle={{ height: 100 }} // bodyStyle={{ height: 100 }}
renderWrapper={({ itemElement, isSubNav, isInSubNav, props }) => { renderWrapper={({ itemElement, isSubNav, isInSubNav, props }) => {
const routerMap = { const routerMap = {
about: "/about", about: '/about',
login: "/login", login: '/login',
register: "/register", register: '/register'
}; };
return ( return (
<Link <Link
style={{textDecoration: "none"}} style={{ textDecoration: 'none' }}
to={routerMap[props.itemKey]} to={routerMap[props.itemKey]}
> >
{itemElement} {itemElement}

2
web/src/components/Loading.js
View File

@ -1,5 +1,5 @@
import React from 'react'; import React from 'react';
import { Segment, Dimmer, Loader } from 'semantic-ui-react'; import { Dimmer, Loader, Segment } from 'semantic-ui-react';
const Loading = ({ prompt: name = 'page' }) => { const Loading = ({ prompt: name = 'page' }) => {
return ( return (

42
web/src/components/LoginForm.js
View File

@ -1,12 +1,12 @@
import React, { useContext, useEffect, useState } from 'react'; import React, { useContext, useEffect, useState } from 'react';
import { Link, useNavigate, useSearchParams } from 'react-router-dom'; import { Link, useNavigate, useSearchParams } from 'react-router-dom';
import { UserContext } from '../context/User'; import { UserContext } from '../context/User';
import { API, getLogo, isMobile, showError, showInfo, showSuccess, showWarning } from '../helpers'; import { API, getLogo, showError, showInfo, showSuccess } from '../helpers';
import { onGitHubOAuthClicked, onLinuxDoOAuthClicked } from './utils'; import { onGitHubOAuthClicked, onLinuxDoOAuthClicked } from './utils';
import Turnstile from "react-turnstile"; import Turnstile from 'react-turnstile';
import { Layout, Card, Image, Form, Button, Divider, Modal, Icon } from '@douyinfe/semi-ui'; import { Button, Card, Divider, Form, Icon, Layout, Modal } from '@douyinfe/semi-ui';
import Title from "@douyinfe/semi-ui/lib/es/typography/title"; import Title from '@douyinfe/semi-ui/lib/es/typography/title';
import Text from "@douyinfe/semi-ui/lib/es/typography/text"; import Text from '@douyinfe/semi-ui/lib/es/typography/text';
import TelegramLoginButton from 'react-telegram-login'; import TelegramLoginButton from 'react-telegram-login';
import { IconGithubLogo } from '@douyinfe/semi-icons'; import { IconGithubLogo } from '@douyinfe/semi-icons';
@ -105,7 +105,7 @@ const LoginForm = () => {
// 添加Telegram登录处理函数 // 添加Telegram登录处理函数
const onTelegramLoginClicked = async (response) => { const onTelegramLoginClicked = async (response) => {
const fields = ["id", "first_name", "last_name", "username", "photo_url", "auth_date", "hash", "lang"]; const fields = ['id', 'first_name', 'last_name', 'username', 'photo_url', 'auth_date', 'hash', 'lang'];
const params = {}; const params = {};
fields.forEach((field) => { fields.forEach((field) => {
if (response[field]) { if (response[field]) {
@ -130,7 +130,7 @@ const LoginForm = () => {
<Layout.Header> <Layout.Header>
</Layout.Header> </Layout.Header>
<Layout.Content> <Layout.Content>
<div style={{ justifyContent: 'center', display: "flex", marginTop: 120 }}> <div style={{ justifyContent: 'center', display: 'flex', marginTop: 120 }}>
<div style={{ width: 500 }}> <div style={{ width: 500 }}>
<Card> <Card>
<Title heading={2} style={{ textAlign: 'center' }}> <Title heading={2} style={{ textAlign: 'center' }}>
@ -140,41 +140,41 @@ const LoginForm = () => {
<Form.Input <Form.Input
field={'username'} field={'username'}
label={'用户名'} label={'用户名'}
placeholder='用户名' placeholder="用户名"
name='username' name="username"
onChange={(value) => handleChange('username', value)} onChange={(value) => handleChange('username', value)}
/> />
<Form.Input <Form.Input
field={'password'} field={'password'}
label={'密码'} label={'密码'}
placeholder='密码' placeholder="密码"
name='password' name="password"
type='password' type="password"
onChange={(value) => handleChange('password', value)} onChange={(value) => handleChange('password', value)}
/> />
<Button theme='solid' style={{ width: '100%' }} type={'primary'} size='large' <Button theme="solid" style={{ width: '100%' }} type={'primary'} size="large"
htmlType={'submit'} onClick={handleSubmit}> htmlType={'submit'} onClick={handleSubmit}>
登录 登录
</Button> </Button>
</Form> </Form>
<div style={{ display: 'flex', justifyContent: 'space-between', marginTop: 20 }}> <div style={{ display: 'flex', justifyContent: 'space-between', marginTop: 20 }}>
<Text> <Text>
没有账号请先 <Link to='/register'>注册账号</Link> 没有账号请先 <Link to="/register">注册账号</Link>
</Text> </Text>
<Text> <Text>
忘记密码 <Link to='/reset'>点击重置</Link> 忘记密码 <Link to="/reset">点击重置</Link>
</Text> </Text>
</div> </div>
{status.github_oauth || status.linuxdo_oauth || status.wechat_login || status.telegram_oauth ? ( {status.github_oauth || status.linuxdo_oauth || status.wechat_login || status.telegram_oauth ? (
<> <>
<Divider margin='12px' align='center'> <Divider margin="12px" align="center">
第三方登录 第三方登录
</Divider> </Divider>
<div style={{ display: 'flex', justifyContent: 'center', marginTop: 20 }}> <div style={{ display: 'flex', justifyContent: 'center', marginTop: 20 }}>
{status.github_oauth ? ( {status.github_oauth ? (
<Button <Button
type='primary' type="primary"
icon={<IconGithubLogo />} icon={<IconGithubLogo />}
onClick={() => onGitHubOAuthClicked(status.github_client_id)} onClick={() => onGitHubOAuthClicked(status.github_client_id)}
/> />
@ -183,7 +183,7 @@ const LoginForm = () => {
)} )}
{status.linuxdo_oauth ? ( {status.linuxdo_oauth ? (
<Button <Button
type='primary' type="primary"
icon={<LinuxDoIcon />} icon={<LinuxDoIcon />}
style={{color: '#000'}} style={{color: '#000'}}
onClick={() => onLinuxDoOAuthClicked(status.linuxdo_client_id)} onClick={() => onLinuxDoOAuthClicked(status.linuxdo_client_id)}
@ -193,7 +193,7 @@ const LoginForm = () => {
)} )}
{status.wechat_login ? ( {status.wechat_login ? (
<Button <Button
type='primary' type="primary"
style={{ color: 'rgba(var(--semi-green-5), 1)' }} style={{ color: 'rgba(var(--semi-green-5), 1)' }}
icon={<Icon svg={<WeChatIcon />} />} icon={<Icon svg={<WeChatIcon />} />}
onClick={onWeChatLoginClicked} onClick={onWeChatLoginClicked}
@ -230,10 +230,10 @@ const LoginForm = () => {
微信扫码关注公众号，输入「验证码」获取验证码（三分钟内有效） 微信扫码关注公众号，输入「验证码」获取验证码（三分钟内有效）
</p> </p>
</div> </div>
<Form size='large'> <Form size="large">
<Form.Input <Form.Input
field={'wechat_verification_code'} field={'wechat_verification_code'}
placeholder='验证码' placeholder="验证码"
label={'验证码'} label={'验证码'}
value={inputs.wechat_verification_code} value={inputs.wechat_verification_code}
onChange={(value) => handleChange('wechat_verification_code', value)} onChange={(value) => handleChange('wechat_verification_code', value)}

390
web/src/components/LogsTable.js
View File

@ -1,232 +1,139 @@
import React, { useEffect, useState } from 'react'; import React, { useEffect, useState } from 'react';
import {Label} from 'semantic-ui-react';
import { API, copy, isAdmin, showError, showSuccess, timestamp2string } from '../helpers'; import { API, copy, isAdmin, showError, showSuccess, timestamp2string } from '../helpers';
import {Table, Avatar, Tag, Form, Button, Layout, Select, Popover, Modal, Spin, Space} from '@douyinfe/semi-ui'; import { Avatar, Button, Form, Layout, Modal, Select, Space, Spin, Table, Tag } from '@douyinfe/semi-ui';
import { ITEMS_PER_PAGE } from '../constants'; import { ITEMS_PER_PAGE } from '../constants';
import { renderNumber, renderQuota, stringToColor } from '../helpers/render'; import { renderNumber, renderQuota, stringToColor } from '../helpers/render';
import { import Paragraph from '@douyinfe/semi-ui/lib/es/typography/paragraph';
IconAt,
IconHistogram,
IconGift,
IconKey,
IconUser,
IconLayers,
IconSetting,
IconCreditCard,
IconSemiLogo,
IconHome,
IconMore
} from '@douyinfe/semi-icons';
import Paragraph from "@douyinfe/semi-ui/lib/es/typography/paragraph";
const { Header } = Layout; const { Header } = Layout;
function renderTimestamp(timestamp) { function renderTimestamp(timestamp) {
return ( return (<>
<>
{timestamp2string(timestamp)} {timestamp2string(timestamp)}
</> </>);
);
} }
const MODE_OPTIONS = [ const MODE_OPTIONS = [{ key: 'all', text: '全部用户', value: 'all' }, { key: 'self', text: '当前用户', value: 'self' }];
{key: 'all', text: '全部用户', value: 'all'},
{key: 'self', text: '当前用户', value: 'self'}
];
const colors = ['amber', 'blue', 'cyan', 'green', 'grey', 'indigo', const colors = ['amber', 'blue', 'cyan', 'green', 'grey', 'indigo', 'light-blue', 'lime', 'orange', 'pink', 'purple', 'red', 'teal', 'violet', 'yellow'];
'light-blue', 'lime', 'orange', 'pink',
'purple', 'red', 'teal', 'violet', 'yellow'
]
function renderType(type) { function renderType(type) {
switch (type) { switch (type) {
case 1: case 1:
return <Tag color='cyan' size='large'> 充值 </Tag>; return <Tag color="cyan" size="large"> 充值 </Tag>;
case 2: case 2:
return <Tag color='lime' size='large'> 消费 </Tag>; return <Tag color="lime" size="large"> 消费 </Tag>;
case 3: case 3:
return <Tag color='orange' size='large'> 管理 </Tag>; return <Tag color="orange" size="large"> 管理 </Tag>;
case 4: case 4:
return <Tag color='purple' size='large'> 系统 </Tag>; return <Tag color="purple" size="large"> 系统 </Tag>;
default: default:
return <Tag color='black' size='large'> 未知 </Tag>; return <Tag color="black" size="large"> 未知 </Tag>;
} }
} }
function renderIsStream(bool) { function renderIsStream(bool) {
if (bool) { if (bool) {
return <Tag color='blue' size='large'>流</Tag>; return <Tag color="blue" size="large">流</Tag>;
} else { } else {
return <Tag color='purple' size='large'>非流</Tag>; return <Tag color="purple" size="large">非流</Tag>;
} }
} }
function renderUseTime(type) { function renderUseTime(type) {
const time = parseInt(type); const time = parseInt(type);
if (time < 101) { if (time < 101) {
return <Tag color='green' size='large'> {time} s </Tag>; return <Tag color="green" size="large"> {time} s </Tag>;
} else if (time < 300) { } else if (time < 300) {
return <Tag color='orange' size='large'> {time} s </Tag>; return <Tag color="orange" size="large"> {time} s </Tag>;
} else { } else {
return <Tag color='red' size='large'> {time} s </Tag>; return <Tag color="red" size="large"> {time} s </Tag>;
} }
} }
const LogsTable = () => { const LogsTable = () => {
const columns = [ const columns = [{
{ title: '时间', dataIndex: 'timestamp2string'
title: '时间', }, {
dataIndex: 'timestamp2string',
},
{
title: '渠道', title: '渠道',
dataIndex: 'channel', dataIndex: 'channel',
className: isAdmin() ? 'tableShow' : 'tableHiddle', className: isAdmin() ? 'tableShow' : 'tableHiddle',
render: (text, record, index) => { render: (text, record, index) => {
return ( return (isAdminUser ? record.type === 0 || record.type === 2 ? <div>
isAdminUser ? {<Tag color={colors[parseInt(text) % colors.length]} size="large"> {text} </Tag>}
record.type === 0 || record.type === 2 ? </div> : <></> : <></>);
<div> }
{<Tag color={colors[parseInt(text) % colors.length]} size='large'> {text} </Tag>} }, {
</div>
:
<></>
:
<></>
);
},
},
{
title: '用户', title: '用户',
dataIndex: 'username', dataIndex: 'username',
className: isAdmin() ? 'tableShow' : 'tableHiddle', className: isAdmin() ? 'tableShow' : 'tableHiddle',
render: (text, record, index) => { render: (text, record, index) => {
return ( return (isAdminUser ? <div>
isAdminUser ?
<div>
<Avatar size="small" color={stringToColor(text)} style={{ marginRight: 4 }} <Avatar size="small" color={stringToColor(text)} style={{ marginRight: 4 }}
onClick={() => showUserInfo(record.user_id)}> onClick={() => showUserInfo(record.user_id)}>
{typeof text === 'string' && text.slice(0, 1)} {typeof text === 'string' && text.slice(0, 1)}
</Avatar> </Avatar>
{text} {text}
</div> </div> : <></>);
: }
<></> }, {
); title: '令牌', dataIndex: 'token_name', render: (text, record, index) => {
}, return (record.type === 0 || record.type === 2 ? <div>
}, <Tag color="grey" size="large" onClick={() => {
{ copyText(text);
title: '令牌',
dataIndex: 'token_name',
render: (text, record, index) => {
return (
record.type === 0 || record.type === 2 ?
<div>
<Tag color='grey' size='large' onClick={() => {
copyText(text)
}}> {text} </Tag> }}> {text} </Tag>
</div> </div> : <></>);
: }
<></> }, {
); title: '类型', dataIndex: 'type', render: (text, record, index) => {
}, return (<div>
},
{
title: '类型',
dataIndex: 'type',
render: (text, record, index) => {
return (
<div>
{renderType(text)} {renderType(text)}
</div> </div>);
); }
}, }, {
}, title: '模型', dataIndex: 'model_name', render: (text, record, index) => {
{ return (record.type === 0 || record.type === 2 ? <div>
title: '模型', <Tag color={stringToColor(text)} size="large" onClick={() => {
dataIndex: 'model_name', copyText(text);
render: (text, record, index) => {
return (
record.type === 0 || record.type === 2 ?
<div>
<Tag color={stringToColor(text)} size='large' onClick={() => {
copyText(text)
}}> {text} </Tag> }}> {text} </Tag>
</div> </div> : <></>);
: }
<></> }, {
); title: '用时', dataIndex: 'use_time', render: (text, record, index) => {
}, return (<div>
},
{
title: '用时',
dataIndex: 'use_time',
render: (text, record, index) => {
return (
<div>
<Space> <Space>
{renderUseTime(text)} {renderUseTime(text)}
{renderIsStream(record.is_stream)} {renderIsStream(record.is_stream)}
</Space> </Space>
</div> </div>);
);
},
},
{
title: '提示',
dataIndex: 'prompt_tokens',
render: (text, record, index) => {
return (
record.type === 0 || record.type === 2 ?
<div>
{<span> {text} </span>}
</div>
:
<></>
);
},
},
{
title: '补全',
dataIndex: 'completion_tokens',
render: (text, record, index) => {
return (
parseInt(text) > 0 && (record.type === 0 || record.type === 2) ?
<div>
{<span> {text} </span>}
</div>
:
<></>
);
},
},
{
title: '花费',
dataIndex: 'quota',
render: (text, record, index) => {
return (
record.type === 0 || record.type === 2 ?
<div>
{
renderQuota(text, 6)
} }
</div> }, {
: title: '提示', dataIndex: 'prompt_tokens', render: (text, record, index) => {
<></> return (record.type === 0 || record.type === 2 ? <div>
); {<span> {text} </span>}
</div> : <></>);
} }
}, }, {
{ title: '补全', dataIndex: 'completion_tokens', render: (text, record, index) => {
title: '详情', return (parseInt(text) > 0 && (record.type === 0 || record.type === 2) ? <div>
dataIndex: 'content', {<span> {text} </span>}
render: (text, record, index) => { </div> : <></>);
return <Paragraph ellipsis={{ rows: 2, showTooltip: { type: 'popover', opts: { style: { width: 240 } } } }} style={{ maxWidth: 240}}> }
}, {
title: '花费', dataIndex: 'quota', render: (text, record, index) => {
return (record.type === 0 || record.type === 2 ? <div>
{renderQuota(text, 6)}
</div> : <></>);
}
}, {
title: '详情', dataIndex: 'content', render: (text, record, index) => {
return <Paragraph ellipsis={{ rows: 2, showTooltip: { type: 'popover', opts: { style: { width: 240 } } } }}
style={{ maxWidth: 240 }}>
{text} {text}
</Paragraph> </Paragraph>;
} }
} }];
];
const [logs, setLogs] = useState([]); const [logs, setLogs] = useState([]);
const [showStat, setShowStat] = useState(false); const [showStat, setShowStat] = useState(false);
@ -234,6 +141,7 @@ const LogsTable = () => {
const [loadingStat, setLoadingStat] = useState(false); const [loadingStat, setLoadingStat] = useState(false);
const [activePage, setActivePage] = useState(1); const [activePage, setActivePage] = useState(1);
const [logCount, setLogCount] = useState(ITEMS_PER_PAGE); const [logCount, setLogCount] = useState(ITEMS_PER_PAGE);
const [pageSize, setPageSize] = useState(ITEMS_PER_PAGE);
const [searchKeyword, setSearchKeyword] = useState(''); const [searchKeyword, setSearchKeyword] = useState('');
const [searching, setSearching] = useState(false); const [searching, setSearching] = useState(false);
const [logType, setLogType] = useState(0); const [logType, setLogType] = useState(0);
@ -251,8 +159,7 @@ const LogsTable = () => {
const { username, token_name, model_name, start_timestamp, end_timestamp, channel } = inputs; const { username, token_name, model_name, start_timestamp, end_timestamp, channel } = inputs;
const [stat, setStat] = useState({ const [stat, setStat] = useState({
quota: 0, quota: 0, token: 0
token: 0
}); });
const handleInputChange = (value, name) => { const handleInputChange = (value, name) => {
@ -302,15 +209,13 @@ const LogsTable = () => {
const { success, message, data } = res.data; const { success, message, data } = res.data;
if (success) { if (success) {
Modal.info({ Modal.info({
title: '用户信息', title: '用户信息', content: <div style={{ padding: 12 }}>
content: <div style={{padding: 12}}>
<p>用户名: {data.username}</p> <p>用户名: {data.username}</p>
<p>余额: {renderQuota(data.quota)}</p> <p>余额: {renderQuota(data.quota)}</p>
<p>已用额度：{renderQuota(data.used_quota)}</p> <p>已用额度：{renderQuota(data.used_quota)}</p>
<p>请求次数：{renderNumber(data.request_count)}</p> <p>请求次数：{renderNumber(data.request_count)}</p>
</div>, </div>, centered: true
centered: true, });
})
} else { } else {
showError(message); showError(message);
} }
@ -325,18 +230,18 @@ const LogsTable = () => {
setLogs(logs); setLogs(logs);
setLogCount(logs.length + ITEMS_PER_PAGE); setLogCount(logs.length + ITEMS_PER_PAGE);
// console.log(logCount); // console.log(logCount);
} };
const loadLogs = async (startIdx) => { const loadLogs = async (startIdx, pageSize, logType = 0) => {
setLoading(true); setLoading(true);
let url = ''; let url = '';
let localStartTimestamp = Date.parse(start_timestamp) / 1000; let localStartTimestamp = Date.parse(start_timestamp) / 1000;
let localEndTimestamp = Date.parse(end_timestamp) / 1000; let localEndTimestamp = Date.parse(end_timestamp) / 1000;
if (isAdminUser) { if (isAdminUser) {
url = `/api/log/?p=${startIdx}&type=${logType}&username=${username}&token_name=${token_name}&model_name=${model_name}&start_timestamp=${localStartTimestamp}&end_timestamp=${localEndTimestamp}&channel=${channel}`; url = `/api/log/?p=${startIdx}&page_size=${pageSize}&type=${logType}&username=${username}&token_name=${token_name}&model_name=${model_name}&start_timestamp=${localStartTimestamp}&end_timestamp=${localEndTimestamp}&channel=${channel}`;
} else { } else {
url = `/api/log/self/?p=${startIdx}&type=${logType}&token_name=${token_name}&model_name=${model_name}&start_timestamp=${localStartTimestamp}&end_timestamp=${localEndTimestamp}`; url = `/api/log/self/?p=${startIdx}&page_size=${pageSize}&type=${logType}&token_name=${token_name}&model_name=${model_name}&start_timestamp=${localStartTimestamp}&end_timestamp=${localEndTimestamp}`;
} }
const res = await API.get(url); const res = await API.get(url);
const { success, message, data } = res.data; const { success, message, data } = res.data;
@ -345,7 +250,7 @@ const LogsTable = () => {
setLogsFormat(data); setLogsFormat(data);
} else { } else {
let newLogs = [...logs]; let newLogs = [...logs];
newLogs.splice(startIdx * ITEMS_PER_PAGE, data.length, ...data); newLogs.splice(startIdx * pageSize, data.length, ...data);
setLogsFormat(newLogs); setLogsFormat(newLogs);
} }
} else { } else {
@ -354,21 +259,32 @@ const LogsTable = () => {
setLoading(false); setLoading(false);
}; };
const pageData = logs.slice((activePage - 1) * ITEMS_PER_PAGE, activePage * ITEMS_PER_PAGE); const pageData = logs.slice((activePage - 1) * pageSize, activePage * pageSize);
const handlePageChange = page => { const handlePageChange = page => {
setActivePage(page); setActivePage(page);
if (page === Math.ceil(logs.length / ITEMS_PER_PAGE) + 1) { if (page === Math.ceil(logs.length / pageSize) + 1) {
// In this case we have to load more data and then append them. // In this case we have to load more data and then append them.
loadLogs(page - 1).then(r => { loadLogs(page - 1, pageSize, logType).then(r => {
}); });
} }
}; };
const refresh = async () => { const handlePageSizeChange = async (size) => {
localStorage.setItem('page-size', size + '');
setPageSize(size);
setActivePage(1);
loadLogs(0, size)
.then()
.catch((reason) => {
showError(reason);
});
};
const refresh = async (localLogType) => {
// setLoading(true); // setLoading(true);
setActivePage(1); setActivePage(1);
await loadLogs(0); await loadLogs(0, pageSize, localLogType);
}; };
const copyText = async (text) => { const copyText = async (text) => {
@ -378,16 +294,23 @@ const LogsTable = () => {
// setSearchKeyword(text); // setSearchKeyword(text);
Modal.error({ title: '无法复制到剪贴板，请手动复制', content: text }); Modal.error({ title: '无法复制到剪贴板，请手动复制', content: text });
} }
} };
useEffect(() => { useEffect(() => {
refresh().then(); // console.log('default effect')
}, [logType]); const localPageSize = parseInt(localStorage.getItem('page-size')) || ITEMS_PER_PAGE;
setPageSize(localPageSize);
loadLogs(0, localPageSize)
.then()
.catch((reason) => {
showError(reason);
});
}, []);
const searchLogs = async () => { const searchLogs = async () => {
if (searchKeyword === '') { if (searchKeyword === '') {
// if keyword is blank, load files instead. // if keyword is blank, load files instead.
await loadLogs(0); await loadLogs(0, pageSize);
setActivePage(1); setActivePage(1);
return; return;
} }
@ -403,90 +326,66 @@ const LogsTable = () => {
setSearching(false); setSearching(false);
}; };
const handleKeywordChange = async (e, {value}) => { return (<>
setSearchKeyword(value.trim());
};
const sortLog = (key) => {
if (logs.length === 0) return;
setLoading(true);
let sortedLogs = [...logs];
if (typeof sortedLogs[0][key] === 'string') {
sortedLogs.sort((a, b) => {
return ('' + a[key]).localeCompare(b[key]);
});
} else {
sortedLogs.sort((a, b) => {
if (a[key] === b[key]) return 0;
if (a[key] > b[key]) return -1;
if (a[key] < b[key]) return 1;
});
}
if (sortedLogs[0].id === logs[0].id) {
sortedLogs.reverse();
}
setLogs(sortedLogs);
setLoading(false);
};
return (
<>
<Layout> <Layout>
<Header> <Header>
<Spin spinning={loadingStat}> <Spin spinning={loadingStat}>
<h3>使用明细（总消耗额度： <h3>使用明细（总消耗额度：
<span onClick={handleEyeClick} style={{cursor: 'pointer', color: 'gray'}}>{showStat?renderQuota(stat.quota):"点击查看"}</span> <span onClick={handleEyeClick} style={{
cursor: 'pointer', color: 'gray'
}}>{showStat ? renderQuota(stat.quota) : '点击查看'}</span>
） ）
</h3> </h3>
</Spin> </Spin>
</Header> </Header>
<Form layout='horizontal' style={{marginTop: 10}}> <Form layout="horizontal" style={{ marginTop: 10 }}>
<> <>
<Form.Input field="token_name" label='令牌名称' style={{width: 176}} value={token_name} <Form.Input field="token_name" label="令牌名称" style={{ width: 176 }} value={token_name}
placeholder={'可选值'} name='token_name' placeholder={'可选值'} name="token_name"
onChange={value => handleInputChange(value, 'token_name')} /> onChange={value => handleInputChange(value, 'token_name')} />
<Form.Input field="model_name" label='模型名称' style={{width: 176}} value={model_name} <Form.Input field="model_name" label="模型名称" style={{ width: 176 }} value={model_name}
placeholder='可选值' placeholder="可选值"
name='model_name' name="model_name"
onChange={value => handleInputChange(value, 'model_name')} /> onChange={value => handleInputChange(value, 'model_name')} />
<Form.DatePicker field="start_timestamp" label='起始时间' style={{width: 272}} <Form.DatePicker field="start_timestamp" label="起始时间" style={{ width: 272 }}
initValue={start_timestamp} initValue={start_timestamp}
value={start_timestamp} type='dateTime' value={start_timestamp} type="dateTime"
name='start_timestamp' name="start_timestamp"
onChange={value => handleInputChange(value, 'start_timestamp')} /> onChange={value => handleInputChange(value, 'start_timestamp')} />
<Form.DatePicker field="end_timestamp" fluid label='结束时间' style={{width: 272}} <Form.DatePicker field="end_timestamp" fluid label="结束时间" style={{ width: 272 }}
initValue={end_timestamp} initValue={end_timestamp}
value={end_timestamp} type='dateTime' value={end_timestamp} type="dateTime"
name='end_timestamp' name="end_timestamp"
onChange={value => handleInputChange(value, 'end_timestamp')} /> onChange={value => handleInputChange(value, 'end_timestamp')} />
{ {isAdminUser && <>
isAdminUser && <> <Form.Input field="channel" label="渠道 ID" style={{ width: 176 }} value={channel}
<Form.Input field="channel" label='渠道 ID' style={{width: 176}} value={channel} placeholder="可选值" name="channel"
placeholder='可选值' name='channel'
onChange={value => handleInputChange(value, 'channel')} /> onChange={value => handleInputChange(value, 'channel')} />
<Form.Input field="username" label='用户名称' style={{width: 176}} value={username} <Form.Input field="username" label="用户名称" style={{ width: 176 }} value={username}
placeholder={'可选值'} name='username' placeholder={'可选值'} name="username"
onChange={value => handleInputChange(value, 'username')} /> onChange={value => handleInputChange(value, 'username')} />
</> </>}
}
<Form.Section> <Form.Section>
<Button label='查询' type="primary" htmlType="submit" className="btn-margin-right" <Button label="查询" type="primary" htmlType="submit" className="btn-margin-right"
onClick={refresh} loading={loading}>查询</Button> onClick={refresh} loading={loading}>查询</Button>
</Form.Section> </Form.Section>
</> </>
</Form> </Form>
<Table style={{ marginTop: 5 }} columns={columns} dataSource={pageData} pagination={{ <Table style={{ marginTop: 5 }} columns={columns} dataSource={pageData} pagination={{
currentPage: activePage, currentPage: activePage,
pageSize: ITEMS_PER_PAGE, pageSize: pageSize,
total: logCount, total: logCount,
pageSizeOpts: [10, 20, 50, 100], pageSizeOpts: [10, 20, 50, 100],
onPageChange: handlePageChange, showSizeChanger: true,
onPageSizeChange: (size) => {
handlePageSizeChange(size).then();
},
onPageChange: handlePageChange
}} /> }} />
<Select defaultValue="0" style={{width: 120}} onChange={ <Select defaultValue="0" style={{ width: 120 }} onChange={(value) => {
(value) => {
setLogType(parseInt(value)); setLogType(parseInt(value));
} refresh(parseInt(value)).then();
}> }}>
<Select.Option value="0">全部</Select.Option> <Select.Option value="0">全部</Select.Option>
<Select.Option value="1">充值</Select.Option> <Select.Option value="1">充值</Select.Option>
<Select.Option value="2">消费</Select.Option> <Select.Option value="2">消费</Select.Option>
@ -494,8 +393,7 @@ const LogsTable = () => {
<Select.Option value="4">系统</Select.Option> <Select.Option value="4">系统</Select.Option>
</Select> </Select>
</Layout> </Layout>
</> </>);
);
}; };
export default LogsTable; export default LogsTable;

138
web/src/components/MjLogsTable.js
View File

@ -1,62 +1,49 @@
import React, { useEffect, useState } from 'react'; import React, { useEffect, useState } from 'react';
import { API, copy, isAdmin, showError, showSuccess, timestamp2string } from '../helpers'; import { API, copy, isAdmin, showError, showSuccess, timestamp2string } from '../helpers';
import { import { Banner, Button, Form, ImagePreview, Layout, Modal, Progress, Table, Tag, Typography } from '@douyinfe/semi-ui';
Table,
Avatar,
Tag,
Form,
Button,
Layout,
Select,
Popover,
Modal,
ImagePreview,
Typography, Progress
} from '@douyinfe/semi-ui';
import { ITEMS_PER_PAGE } from '../constants'; import { ITEMS_PER_PAGE } from '../constants';
import {renderNumber, renderQuota, stringToColor} from '../helpers/render';
const colors = ['amber', 'blue', 'cyan', 'green', 'grey', 'indigo', const colors = ['amber', 'blue', 'cyan', 'green', 'grey', 'indigo',
'light-blue', 'lime', 'orange', 'pink', 'light-blue', 'lime', 'orange', 'pink',
'purple', 'red', 'teal', 'violet', 'yellow' 'purple', 'red', 'teal', 'violet', 'yellow'
] ];
function renderType(type) { function renderType(type) {
switch (type) { switch (type) {
case 'IMAGINE': case 'IMAGINE':
return <Tag color="blue" size='large'>绘图</Tag>; return <Tag color="blue" size="large">绘图</Tag>;
case 'UPSCALE': case 'UPSCALE':
return <Tag color="orange" size='large'>放大</Tag>; return <Tag color="orange" size="large">放大</Tag>;
case 'VARIATION': case 'VARIATION':
return <Tag color="purple" size='large'>变换</Tag>; return <Tag color="purple" size="large">变换</Tag>;
case 'HIGH_VARIATION': case 'HIGH_VARIATION':
return <Tag color="purple" size='large'>强变换</Tag>; return <Tag color="purple" size="large">强变换</Tag>;
case 'LOW_VARIATION': case 'LOW_VARIATION':
return <Tag color="purple" size='large'>弱变换</Tag>; return <Tag color="purple" size="large">弱变换</Tag>;
case 'PAN': case 'PAN':
return <Tag color="cyan" size='large'>平移</Tag>; return <Tag color="cyan" size="large">平移</Tag>;
case 'DESCRIBE': case 'DESCRIBE':
return <Tag color="yellow" size='large'>图生文</Tag>; return <Tag color="yellow" size="large">图生文</Tag>;
case 'BLEND': case 'BLEND':
return <Tag color="lime" size='large'>图混合</Tag>; return <Tag color="lime" size="large">图混合</Tag>;
case 'SHORTEN': case 'SHORTEN':
return <Tag color="pink" size='large'>缩词</Tag>; return <Tag color="pink" size="large">缩词</Tag>;
case 'REROLL': case 'REROLL':
return <Tag color="indigo" size='large'>重绘</Tag>; return <Tag color="indigo" size="large">重绘</Tag>;
case 'INPAINT': case 'INPAINT':
return <Tag color="violet" size='large'>局部重绘-提交</Tag>; return <Tag color="violet" size="large">局部重绘-提交</Tag>;
case 'ZOOM': case 'ZOOM':
return <Tag color="teal" size='large'>变焦</Tag>; return <Tag color="teal" size="large">变焦</Tag>;
case 'CUSTOM_ZOOM': case 'CUSTOM_ZOOM':
return <Tag color="teal" size='large'>自定义变焦-提交</Tag>; return <Tag color="teal" size="large">自定义变焦-提交</Tag>;
case 'MODAL': case 'MODAL':
return <Tag color="green" size='large'>窗口处理</Tag>; return <Tag color="green" size="large">窗口处理</Tag>;
case 'SWAP_FACE': case 'SWAP_FACE':
return <Tag color="light-green" size='large'>换脸</Tag>; return <Tag color="light-green" size="large">换脸</Tag>;
default: default:
return <Tag color="white" size='large'>未知</Tag>; return <Tag color="white" size="large">未知</Tag>;
} }
} }
@ -64,15 +51,15 @@ function renderType(type) {
function renderCode(code) { function renderCode(code) {
switch (code) { switch (code) {
case 1: case 1:
return <Tag color="green" size='large'>已提交</Tag>; return <Tag color="green" size="large">已提交</Tag>;
case 21: case 21:
return <Tag color="lime" size='large'>等待中</Tag>; return <Tag color="lime" size="large">等待中</Tag>;
case 22: case 22:
return <Tag color="orange" size='large'>重复提交</Tag>; return <Tag color="orange" size="large">重复提交</Tag>;
case 0: case 0:
return <Tag color="yellow" size='large'>未提交</Tag>; return <Tag color="yellow" size="large">未提交</Tag>;
default: default:
return <Tag color="white" size='large'>未知</Tag>; return <Tag color="white" size="large">未知</Tag>;
} }
} }
@ -81,19 +68,19 @@ function renderStatus(type) {
// Ensure all cases are string literals by adding quotes. // Ensure all cases are string literals by adding quotes.
switch (type) { switch (type) {
case 'SUCCESS': case 'SUCCESS':
return <Tag color="green" size='large'>成功</Tag>; return <Tag color="green" size="large">成功</Tag>;
case 'NOT_START': case 'NOT_START':
return <Tag color="grey" size='large'>未启动</Tag>; return <Tag color="grey" size="large">未启动</Tag>;
case 'SUBMITTED': case 'SUBMITTED':
return <Tag color="yellow" size='large'>队列中</Tag>; return <Tag color="yellow" size="large">队列中</Tag>;
case 'IN_PROGRESS': case 'IN_PROGRESS':
return <Tag color="blue" size='large'>执行中</Tag>; return <Tag color="blue" size="large">执行中</Tag>;
case 'FAILURE': case 'FAILURE':
return <Tag color="red" size='large'>失败</Tag>; return <Tag color="red" size="large">失败</Tag>;
case 'MODAL': case 'MODAL':
return <Tag color="yellow" size='large'>窗口等待</Tag>; return <Tag color="yellow" size="large">窗口等待</Tag>;
default: default:
return <Tag color="white" size='large'>未知</Tag>; return <Tag color="white" size="large">未知</Tag>;
} }
} }
@ -124,7 +111,7 @@ const LogsTable = () => {
{renderTimestamp(text / 1000)} {renderTimestamp(text / 1000)}
</div> </div>
); );
}, }
}, },
{ {
title: '渠道', title: '渠道',
@ -134,13 +121,13 @@ const LogsTable = () => {
return ( return (
<div> <div>
<Tag color={colors[parseInt(text) % colors.length]} size='large' onClick={() => { <Tag color={colors[parseInt(text) % colors.length]} size="large" onClick={() => {
copyText(text); // 假设copyText是用于文本复制的函数 copyText(text); // 假设copyText是用于文本复制的函数
}}> {text} </Tag> }}> {text} </Tag>
</div> </div>
); );
}, }
}, },
{ {
title: '类型', title: '类型',
@ -151,7 +138,7 @@ const LogsTable = () => {
{renderType(text)} {renderType(text)}
</div> </div>
); );
}, }
}, },
{ {
title: '任务ID', title: '任务ID',
@ -162,7 +149,7 @@ const LogsTable = () => {
{text} {text}
</div> </div>
); );
}, }
}, },
{ {
title: '提交结果', title: '提交结果',
@ -174,7 +161,7 @@ const LogsTable = () => {
{renderCode(text)} {renderCode(text)}
</div> </div>
); );
}, }
}, },
{ {
title: '任务状态', title: '任务状态',
@ -186,7 +173,7 @@ const LogsTable = () => {
{renderStatus(text)} {renderStatus(text)}
</div> </div>
); );
}, }
}, },
{ {
title: '进度', title: '进度',
@ -196,12 +183,13 @@ const LogsTable = () => {
<div> <div>
{ {
// 转换例如100%为数字100，如果text未定义，返回0 // 转换例如100%为数字100，如果text未定义，返回0
<Progress stroke={record.status === "FAILURE"?"var(--semi-color-warning)":null} percent={text ? parseInt(text.replace('%', '')) : 0} showInfo={true} <Progress stroke={record.status === 'FAILURE' ? 'var(--semi-color-warning)' : null}
percent={text ? parseInt(text.replace('%', '')) : 0} showInfo={true}
aria-label="drawing progress" /> aria-label="drawing progress" />
} }
</div> </div>
); );
}, }
}, },
{ {
title: '结果图片', title: '结果图片',
@ -301,6 +289,7 @@ const LogsTable = () => {
const [logType, setLogType] = useState(0); const [logType, setLogType] = useState(0);
const isAdminUser = isAdmin(); const isAdminUser = isAdmin();
const [isModalOpenurl, setIsModalOpenurl] = useState(false); const [isModalOpenurl, setIsModalOpenurl] = useState(false);
const [showBanner, setShowBanner] = useState(false);
// 定义模态框图片URL的状态和更新函数 // 定义模态框图片URL的状态和更新函数
const [modalImageUrl, setModalImageUrl] = useState(''); const [modalImageUrl, setModalImageUrl] = useState('');
@ -310,7 +299,7 @@ const LogsTable = () => {
channel_id: '', channel_id: '',
mj_id: '', mj_id: '',
start_timestamp: timestamp2string(now.getTime() / 1000 - 2592000), start_timestamp: timestamp2string(now.getTime() / 1000 - 2592000),
end_timestamp: timestamp2string(now.getTime() / 1000 + 3600), end_timestamp: timestamp2string(now.getTime() / 1000 + 3600)
}); });
const { channel_id, mj_id, start_timestamp, end_timestamp } = inputs; const { channel_id, mj_id, start_timestamp, end_timestamp } = inputs;
@ -333,7 +322,7 @@ const LogsTable = () => {
setLogs(logs); setLogs(logs);
setLogCount(logs.length + ITEMS_PER_PAGE); setLogCount(logs.length + ITEMS_PER_PAGE);
// console.log(logCount); // console.log(logCount);
} };
const loadLogs = async (startIdx) => { const loadLogs = async (startIdx) => {
setLoading(true); setLoading(true);
@ -386,39 +375,50 @@ const LogsTable = () => {
// setSearchKeyword(text); // setSearchKeyword(text);
Modal.error({ title: '无法复制到剪贴板，请手动复制', content: text }); Modal.error({ title: '无法复制到剪贴板，请手动复制', content: text });
} }
} };
useEffect(() => { useEffect(() => {
refresh().then(); refresh().then();
}, [logType]); }, [logType]);
useEffect(() => {
const mjNotifyEnabled = localStorage.getItem('mj_notify_enabled');
if (mjNotifyEnabled !== 'true') {
setShowBanner(true);
}
}, []);
return ( return (
<> <>
<Layout> <Layout>
<Form layout='horizontal' style={{marginTop: 10}}> {isAdminUser && showBanner ? <Banner
type="info"
description="当前未开启Midjourney回调，部分项目可能无法获得绘图结果，可在运营设置中开启。"
/> : <></>
}
<Form layout="horizontal" style={{ marginTop: 10 }}>
<> <>
<Form.Input field="channel_id" label='渠道 ID' style={{width: 176}} value={channel_id} <Form.Input field="channel_id" label="渠道 ID" style={{ width: 176 }} value={channel_id}
placeholder={'可选值'} name='channel_id' placeholder={'可选值'} name="channel_id"
onChange={value => handleInputChange(value, 'channel_id')} /> onChange={value => handleInputChange(value, 'channel_id')} />
<Form.Input field="mj_id" label='任务 ID' style={{width: 176}} value={mj_id} <Form.Input field="mj_id" label="任务 ID" style={{ width: 176 }} value={mj_id}
placeholder='可选值' placeholder="可选值"
name='mj_id' name="mj_id"
onChange={value => handleInputChange(value, 'mj_id')} /> onChange={value => handleInputChange(value, 'mj_id')} />
<Form.DatePicker field="start_timestamp" label='起始时间' style={{width: 272}} <Form.DatePicker field="start_timestamp" label="起始时间" style={{ width: 272 }}
initValue={start_timestamp} initValue={start_timestamp}
value={start_timestamp} type='dateTime' value={start_timestamp} type="dateTime"
name='start_timestamp' name="start_timestamp"
onChange={value => handleInputChange(value, 'start_timestamp')} /> onChange={value => handleInputChange(value, 'start_timestamp')} />
<Form.DatePicker field="end_timestamp" fluid label='结束时间' style={{width: 272}} <Form.DatePicker field="end_timestamp" fluid label="结束时间" style={{ width: 272 }}
initValue={end_timestamp} initValue={end_timestamp}
value={end_timestamp} type='dateTime' value={end_timestamp} type="dateTime"
name='end_timestamp' name="end_timestamp"
onChange={value => handleInputChange(value, 'end_timestamp')} /> onChange={value => handleInputChange(value, 'end_timestamp')} />
<Form.Section> <Form.Section>
<Button label='查询' type="primary" htmlType="submit" className="btn-margin-right" <Button label="查询" type="primary" htmlType="submit" className="btn-margin-right"
onClick={refresh}>查询</Button> onClick={refresh}>查询</Button>
</Form.Section> </Form.Section>
</> </>
@ -428,7 +428,7 @@ const LogsTable = () => {
pageSize: ITEMS_PER_PAGE, pageSize: ITEMS_PER_PAGE,
total: logCount, total: logCount,
pageSizeOpts: [10, 20, 50, 100], pageSizeOpts: [10, 20, 50, 100],
onPageChange: handlePageChange, onPageChange: handlePageChange
}} loading={loading} /> }} loading={loading} />
<Modal <Modal
visible={isModalOpen} visible={isModalOpen}

251
web/src/components/OperationSetting.js
View File

@ -23,6 +23,7 @@ const OperationSetting = () => {
LogConsumeEnabled: '', LogConsumeEnabled: '',
DisplayInCurrencyEnabled: '', DisplayInCurrencyEnabled: '',
DisplayTokenStatEnabled: '', DisplayTokenStatEnabled: '',
MjNotifyEnabled: '',
DrawingEnabled: '', DrawingEnabled: '',
DataExportEnabled: '', DataExportEnabled: '',
DataExportDefaultTime: 'hour', DataExportDefaultTime: 'hour',
@ -69,7 +70,7 @@ const OperationSetting = () => {
if (key === 'DefaultCollapseSidebar') { if (key === 'DefaultCollapseSidebar') {
value = inputs[key] === 'true' ? 'false' : 'true'; value = inputs[key] === 'true' ? 'false' : 'true';
} }
console.log(key, value) console.log(key, value);
const res = await API.put('/api/option/', { const res = await API.put('/api/option/', {
key, key,
value value
@ -87,6 +88,8 @@ const OperationSetting = () => {
if (name.endsWith('Enabled') || name === 'DataExportInterval' || name === 'DataExportDefaultTime' || name === 'DefaultCollapseSidebar') { if (name.endsWith('Enabled') || name === 'DataExportInterval' || name === 'DataExportDefaultTime' || name === 'DefaultCollapseSidebar') {
if (name === 'DataExportDefaultTime') { if (name === 'DataExportDefaultTime') {
localStorage.setItem('data_export_default_time', value); localStorage.setItem('data_export_default_time', value);
} else if (name === 'MjNotifyEnabled') {
localStorage.setItem('mj_notify_enabled', value);
} }
await updateOption(name, value); await updateOption(name, value);
} else { } else {
@ -175,103 +178,115 @@ const OperationSetting = () => {
<Grid columns={1}> <Grid columns={1}>
<Grid.Column> <Grid.Column>
<Form loading={loading}> <Form loading={loading}>
<Header as='h3'> <Header as="h3">
通用设置 通用设置
</Header> </Header>
<Form.Group widths={4}> <Form.Group widths={4}>
<Form.Input <Form.Input
label='充值链接' label="充值链接"
name='TopUpLink' name="TopUpLink"
onChange={handleInputChange} onChange={handleInputChange}
autoComplete='new-password' autoComplete="new-password"
value={inputs.TopUpLink} value={inputs.TopUpLink}
type='link' type="link"
placeholder='例如发卡网站的购买链接' placeholder="例如发卡网站的购买链接"
/> />
<Form.Input <Form.Input
label='默认聊天页面链接' label="默认聊天页面链接"
name='ChatLink' name="ChatLink"
onChange={handleInputChange} onChange={handleInputChange}
autoComplete='new-password' autoComplete="new-password"
value={inputs.ChatLink} value={inputs.ChatLink}
type='link' type="link"
placeholder='例如 ChatGPT Next Web 的部署地址' placeholder="例如 ChatGPT Next Web 的部署地址"
/> />
<Form.Input <Form.Input
label='聊天页面2链接' label="聊天页面2链接"
name='ChatLink2' name="ChatLink2"
onChange={handleInputChange} onChange={handleInputChange}
autoComplete='new-password' autoComplete="new-password"
value={inputs.ChatLink2} value={inputs.ChatLink2}
type='link' type="link"
placeholder='例如 ChatGPT Web & Midjourney 的部署地址' placeholder="例如 ChatGPT Web & Midjourney 的部署地址"
/> />
<Form.Input <Form.Input
label='单位美元额度' label="单位美元额度"
name='QuotaPerUnit' name="QuotaPerUnit"
onChange={handleInputChange} onChange={handleInputChange}
autoComplete='new-password' autoComplete="new-password"
value={inputs.QuotaPerUnit} value={inputs.QuotaPerUnit}
type='number' type="number"
step='0.01' step="0.01"
placeholder='一单位货币能兑换的额度' placeholder="一单位货币能兑换的额度"
/> />
<Form.Input <Form.Input
label='失败重试次数' label="失败重试次数"
name='RetryTimes' name="RetryTimes"
type={'number'} type={'number'}
step='1' step="1"
min='0' min="0"
onChange={handleInputChange} onChange={handleInputChange}
autoComplete='new-password' autoComplete="new-password"
value={inputs.RetryTimes} value={inputs.RetryTimes}
placeholder='失败重试次数' placeholder="失败重试次数"
/> />
</Form.Group> </Form.Group>
<Form.Group inline> <Form.Group inline>
<Form.Checkbox <Form.Checkbox
checked={inputs.DisplayInCurrencyEnabled === 'true'} checked={inputs.DisplayInCurrencyEnabled === 'true'}
label='以货币形式显示额度' label="以货币形式显示额度"
name='DisplayInCurrencyEnabled' name="DisplayInCurrencyEnabled"
onChange={handleInputChange} onChange={handleInputChange}
/> />
<Form.Checkbox <Form.Checkbox
checked={inputs.DisplayTokenStatEnabled === 'true'} checked={inputs.DisplayTokenStatEnabled === 'true'}
label='Billing 相关 API 显示令牌额度而非用户额度' label="Billing 相关 API 显示令牌额度而非用户额度"
name='DisplayTokenStatEnabled' name="DisplayTokenStatEnabled"
onChange={handleInputChange}
/>
<Form.Checkbox
checked={inputs.DrawingEnabled === 'true'}
label='启用绘图功能'
name='DrawingEnabled'
onChange={handleInputChange} onChange={handleInputChange}
/> />
<Form.Checkbox <Form.Checkbox
checked={inputs.DefaultCollapseSidebar === 'true'} checked={inputs.DefaultCollapseSidebar === 'true'}
label='默认折叠侧边栏' label="默认折叠侧边栏"
name='DefaultCollapseSidebar' name="DefaultCollapseSidebar"
onChange={handleInputChange} onChange={handleInputChange}
/> />
</Form.Group> </Form.Group>
<Form.Button onClick={() => { <Form.Button onClick={() => {
submitConfig('general').then(); submitConfig('general').then();
}}>保存通用设置</Form.Button><Divider/> }}>保存通用设置</Form.Button>
<Header as='h3'> <Divider />
<Header as="h3">
绘图设置
</Header>
<Form.Group inline>
<Form.Checkbox
checked={inputs.DrawingEnabled === 'true'}
label="启用绘图功能"
name="DrawingEnabled"
onChange={handleInputChange}
/>
<Form.Checkbox
checked={inputs.MjNotifyEnabled === 'true'}
label="允许回调（会泄露服务器ip地址）"
name="MjNotifyEnabled"
onChange={handleInputChange}
/>
</Form.Group>
<Divider />
<Header as="h3">
日志设置 日志设置
</Header> </Header>
<Form.Group inline> <Form.Group inline>
<Form.Checkbox <Form.Checkbox
checked={inputs.LogConsumeEnabled === 'true'} checked={inputs.LogConsumeEnabled === 'true'}
label='启用额度消费日志记录' label="启用额度消费日志记录"
name='LogConsumeEnabled' name="LogConsumeEnabled"
onChange={handleInputChange} onChange={handleInputChange}
/> />
</Form.Group> </Form.Group>
<Form.Group widths={4}> <Form.Group widths={4}>
<Form.Input label='目标时间' value={historyTimestamp} type='datetime-local' <Form.Input label="目标时间" value={historyTimestamp} type="datetime-local"
name='history_timestamp' name="history_timestamp"
onChange={(e, { name, value }) => { onChange={(e, { name, value }) => {
setHistoryTimestamp(value); setHistoryTimestamp(value);
}} /> }} />
@ -280,74 +295,74 @@ const OperationSetting = () => {
deleteHistoryLogs().then(); deleteHistoryLogs().then();
}}>清理历史日志</Form.Button> }}>清理历史日志</Form.Button>
<Divider /> <Divider />
<Header as='h3'> <Header as="h3">
数据看板 数据看板
</Header> </Header>
<Form.Checkbox <Form.Checkbox
checked={inputs.DataExportEnabled === 'true'} checked={inputs.DataExportEnabled === 'true'}
label='启用数据看板（实验性）' label="启用数据看板（实验性）"
name='DataExportEnabled' name="DataExportEnabled"
onChange={handleInputChange} onChange={handleInputChange}
/> />
<Form.Group> <Form.Group>
<Form.Input <Form.Input
label='数据看板更新间隔（分钟，设置过短会影响数据库性能）' label="数据看板更新间隔（分钟，设置过短会影响数据库性能）"
name='DataExportInterval' name="DataExportInterval"
type={'number'} type={'number'}
step='1' step="1"
min='1' min="1"
onChange={handleInputChange} onChange={handleInputChange}
autoComplete='new-password' autoComplete="new-password"
value={inputs.DataExportInterval} value={inputs.DataExportInterval}
placeholder='数据看板更新间隔（分钟，设置过短会影响数据库性能）' placeholder="数据看板更新间隔（分钟，设置过短会影响数据库性能）"
/> />
<Form.Select <Form.Select
label='数据看板默认时间粒度（仅修改展示粒度，统计精确到小时）' label="数据看板默认时间粒度（仅修改展示粒度，统计精确到小时）"
options={timeOptions} options={timeOptions}
name='DataExportDefaultTime' name="DataExportDefaultTime"
onChange={handleInputChange} onChange={handleInputChange}
autoComplete='new-password' autoComplete="new-password"
value={inputs.DataExportDefaultTime} value={inputs.DataExportDefaultTime}
placeholder='数据看板默认时间粒度' placeholder="数据看板默认时间粒度"
/> />
</Form.Group> </Form.Group>
<Divider /> <Divider />
<Header as='h3'> <Header as="h3">
监控设置 监控设置
</Header> </Header>
<Form.Group widths={3}> <Form.Group widths={3}>
<Form.Input <Form.Input
label='最长响应时间' label="最长响应时间"
name='ChannelDisableThreshold' name="ChannelDisableThreshold"
onChange={handleInputChange} onChange={handleInputChange}
autoComplete='new-password' autoComplete="new-password"
value={inputs.ChannelDisableThreshold} value={inputs.ChannelDisableThreshold}
type='number' type="number"
min='0' min="0"
placeholder='单位秒，当运行通道全部测试时，超过此时间将自动禁用通道' placeholder="单位秒，当运行通道全部测试时，超过此时间将自动禁用通道"
/> />
<Form.Input <Form.Input
label='额度提醒阈值' label="额度提醒阈值"
name='QuotaRemindThreshold' name="QuotaRemindThreshold"
onChange={handleInputChange} onChange={handleInputChange}
autoComplete='new-password' autoComplete="new-password"
value={inputs.QuotaRemindThreshold} value={inputs.QuotaRemindThreshold}
type='number' type="number"
min='0' min="0"
placeholder='低于此额度时将发送邮件提醒用户' placeholder="低于此额度时将发送邮件提醒用户"
/> />
</Form.Group> </Form.Group>
<Form.Group inline> <Form.Group inline>
<Form.Checkbox <Form.Checkbox
checked={inputs.AutomaticDisableChannelEnabled === 'true'} checked={inputs.AutomaticDisableChannelEnabled === 'true'}
label='失败时自动禁用通道' label="失败时自动禁用通道"
name='AutomaticDisableChannelEnabled' name="AutomaticDisableChannelEnabled"
onChange={handleInputChange} onChange={handleInputChange}
/> />
<Form.Checkbox <Form.Checkbox
checked={inputs.AutomaticEnableChannelEnabled === 'true'} checked={inputs.AutomaticEnableChannelEnabled === 'true'}
label='成功时自动启用通道' label="成功时自动启用通道"
name='AutomaticEnableChannelEnabled' name="AutomaticEnableChannelEnabled"
onChange={handleInputChange} onChange={handleInputChange}
/> />
</Form.Group> </Form.Group>
@ -355,89 +370,89 @@ const OperationSetting = () => {
submitConfig('monitor').then(); submitConfig('monitor').then();
}}>保存监控设置</Form.Button> }}>保存监控设置</Form.Button>
<Divider /> <Divider />
<Header as='h3'> <Header as="h3">
额度设置 额度设置
</Header> </Header>
<Form.Group widths={4}> <Form.Group widths={4}>
<Form.Input <Form.Input
label='新用户初始额度' label="新用户初始额度"
name='QuotaForNewUser' name="QuotaForNewUser"
onChange={handleInputChange} onChange={handleInputChange}
autoComplete='new-password' autoComplete="new-password"
value={inputs.QuotaForNewUser} value={inputs.QuotaForNewUser}
type='number' type="number"
min='0' min="0"
placeholder='例如：100' placeholder="例如：100"
/> />
<Form.Input <Form.Input
label='请求预扣费额度' label="请求预扣费额度"
name='PreConsumedQuota' name="PreConsumedQuota"
onChange={handleInputChange} onChange={handleInputChange}
autoComplete='new-password' autoComplete="new-password"
value={inputs.PreConsumedQuota} value={inputs.PreConsumedQuota}
type='number' type="number"
min='0' min="0"
placeholder='请求结束后多退少补' placeholder="请求结束后多退少补"
/> />
<Form.Input <Form.Input
label='邀请新用户奖励额度' label="邀请新用户奖励额度"
name='QuotaForInviter' name="QuotaForInviter"
onChange={handleInputChange} onChange={handleInputChange}
autoComplete='new-password' autoComplete="new-password"
value={inputs.QuotaForInviter} value={inputs.QuotaForInviter}
type='number' type="number"
min='0' min="0"
placeholder='例如：2000' placeholder="例如：2000"
/> />
<Form.Input <Form.Input
label='新用户使用邀请码奖励额度' label="新用户使用邀请码奖励额度"
name='QuotaForInvitee' name="QuotaForInvitee"
onChange={handleInputChange} onChange={handleInputChange}
autoComplete='new-password' autoComplete="new-password"
value={inputs.QuotaForInvitee} value={inputs.QuotaForInvitee}
type='number' type="number"
min='0' min="0"
placeholder='例如：1000' placeholder="例如：1000"
/> />
</Form.Group> </Form.Group>
<Form.Button onClick={() => { <Form.Button onClick={() => {
submitConfig('quota').then(); submitConfig('quota').then();
}}>保存额度设置</Form.Button> }}>保存额度设置</Form.Button>
<Divider /> <Divider />
<Header as='h3'> <Header as="h3">
倍率设置 倍率设置
</Header> </Header>
<Form.Group widths='equal'> <Form.Group widths="equal">
<Form.TextArea <Form.TextArea
label='模型固定价格（一次调用消耗多少刀，优先级大于模型倍率）' label="模型固定价格（一次调用消耗多少刀，优先级大于模型倍率）"
name='ModelPrice' name="ModelPrice"
onChange={handleInputChange} onChange={handleInputChange}
style={{ minHeight: 250, fontFamily: 'JetBrains Mono, Consolas' }} style={{ minHeight: 250, fontFamily: 'JetBrains Mono, Consolas' }}
autoComplete='new-password' autoComplete="new-password"
value={inputs.ModelPrice} value={inputs.ModelPrice}
placeholder='为一个 JSON 文本，键为模型名称，值为一次调用消耗多少刀，比如 "gpt-4-gizmo-*": 0.1，一次消耗0.1刀' placeholder='为一个 JSON 文本，键为模型名称，值为一次调用消耗多少刀，比如 "gpt-4-gizmo-*": 0.1，一次消耗0.1刀'
/> />
</Form.Group> </Form.Group>
<Form.Group widths='equal'> <Form.Group widths="equal">
<Form.TextArea <Form.TextArea
label='模型倍率' label="模型倍率"
name='ModelRatio' name="ModelRatio"
onChange={handleInputChange} onChange={handleInputChange}
style={{ minHeight: 250, fontFamily: 'JetBrains Mono, Consolas' }} style={{ minHeight: 250, fontFamily: 'JetBrains Mono, Consolas' }}
autoComplete='new-password' autoComplete="new-password"
value={inputs.ModelRatio} value={inputs.ModelRatio}
placeholder='为一个 JSON 文本，键为模型名称，值为倍率' placeholder="为一个 JSON 文本，键为模型名称，值为倍率"
/> />
</Form.Group> </Form.Group>
<Form.Group widths='equal'> <Form.Group widths="equal">
<Form.TextArea <Form.TextArea
label='分组倍率' label="分组倍率"
name='GroupRatio' name="GroupRatio"
onChange={handleInputChange} onChange={handleInputChange}
style={{ minHeight: 250, fontFamily: 'JetBrains Mono, Consolas' }} style={{ minHeight: 250, fontFamily: 'JetBrains Mono, Consolas' }}
autoComplete='new-password' autoComplete="new-password"
value={inputs.GroupRatio} value={inputs.GroupRatio}
placeholder='为一个 JSON 文本，键为分组名称，值为倍率' placeholder="为一个 JSON 文本，键为分组名称，值为倍率"
/> />
</Form.Group> </Form.Group>
<Form.Button onClick={() => { <Form.Button onClick={() => {

37
web/src/components/OtherSetting.js
View File

@ -1,5 +1,5 @@
import React, { useEffect, useRef, useState } from 'react'; import React, { useEffect, useRef, useState } from 'react';
import { Col, Row , Form, Button, Banner } from '@douyinfe/semi-ui'; import { Banner, Button, Col, Form, Row } from '@douyinfe/semi-ui';
import { API, showError, showSuccess } from '../helpers'; import { API, showError, showSuccess } from '../helpers';
import { marked } from 'marked'; import { marked } from 'marked';
@ -57,8 +57,8 @@ const OtherSetting = () => {
await updateOption('Notice', inputs.Notice); await updateOption('Notice', inputs.Notice);
showSuccess('公告已更新'); showSuccess('公告已更新');
} catch (error) { } catch (error) {
console.error("公告更新失败", error); console.error('公告更新失败', error);
showError("公告更新失败") showError('公告更新失败');
} finally { } finally {
setLoadingInput((loadingInput) => ({ ...loadingInput, Notice: false })); setLoadingInput((loadingInput) => ({ ...loadingInput, Notice: false }));
} }
@ -72,8 +72,8 @@ const OtherSetting = () => {
await updateOption('SystemName', inputs.SystemName); await updateOption('SystemName', inputs.SystemName);
showSuccess('系统名称已更新'); showSuccess('系统名称已更新');
} catch (error) { } catch (error) {
console.error("系统名称更新失败", error); console.error('系统名称更新失败', error);
showError("系统名称更新失败") showError('系统名称更新失败');
} finally { } finally {
setLoadingInput((loadingInput) => ({ ...loadingInput, SystemName: false })); setLoadingInput((loadingInput) => ({ ...loadingInput, SystemName: false }));
} }
@ -86,8 +86,8 @@ const OtherSetting = () => {
await updateOption('Logo', inputs.Logo); await updateOption('Logo', inputs.Logo);
showSuccess('Logo 已更新'); showSuccess('Logo 已更新');
} catch (error) { } catch (error) {
console.error("Logo 更新失败", error); console.error('Logo 更新失败', error);
showError("Logo 更新失败") showError('Logo 更新失败');
} finally { } finally {
setLoadingInput((loadingInput) => ({ ...loadingInput, Logo: false })); setLoadingInput((loadingInput) => ({ ...loadingInput, Logo: false }));
} }
@ -99,8 +99,8 @@ const OtherSetting = () => {
await updateOption(key, inputs[key]); await updateOption(key, inputs[key]);
showSuccess('首页内容已更新'); showSuccess('首页内容已更新');
} catch (error) { } catch (error) {
console.error("首页内容更新失败", error); console.error('首页内容更新失败', error);
showError("首页内容更新失败") showError('首页内容更新失败');
} finally { } finally {
setLoadingInput((loadingInput) => ({ ...loadingInput, HomePageContent: false })); setLoadingInput((loadingInput) => ({ ...loadingInput, HomePageContent: false }));
} }
@ -112,8 +112,8 @@ const OtherSetting = () => {
await updateOption('About', inputs.About); await updateOption('About', inputs.About);
showSuccess('关于内容已更新'); showSuccess('关于内容已更新');
} catch (error) { } catch (error) {
console.error("关于内容更新失败", error); console.error('关于内容更新失败', error);
showError("关于内容更新失败"); showError('关于内容更新失败');
} finally { } finally {
setLoadingInput((loadingInput) => ({ ...loadingInput, About: false })); setLoadingInput((loadingInput) => ({ ...loadingInput, About: false }));
} }
@ -125,16 +125,14 @@ const OtherSetting = () => {
await updateOption('Footer', inputs.Footer); await updateOption('Footer', inputs.Footer);
showSuccess('页脚内容已更新'); showSuccess('页脚内容已更新');
} catch (error) { } catch (error) {
console.error("页脚内容更新失败", error); console.error('页脚内容更新失败', error);
showError("页脚内容更新失败"); showError('页脚内容更新失败');
} finally { } finally {
setLoadingInput((loadingInput) => ({ ...loadingInput, Footer: false })); setLoadingInput((loadingInput) => ({ ...loadingInput, Footer: false }));
} }
}; };
const openGitHubRelease = () => { const openGitHubRelease = () => {
window.location = window.location =
'https://github.com/songquanpeng/one-api/releases/latest'; 'https://github.com/songquanpeng/one-api/releases/latest';
@ -182,7 +180,8 @@ const OtherSetting = () => {
<Row> <Row>
<Col span={24}> <Col span={24}>
{/* 通用设置 */} {/* 通用设置 */}
<Form values={inputs} getFormApi={formAPI => formAPISettingGeneral.current = formAPI} style={{marginBottom: 15}}> <Form values={inputs} getFormApi={formAPI => formAPISettingGeneral.current = formAPI}
style={{ marginBottom: 15 }}>
<Form.Section text={'通用设置'}> <Form.Section text={'通用设置'}>
<Form.TextArea <Form.TextArea
label={'公告'} label={'公告'}
@ -196,7 +195,8 @@ const OtherSetting = () => {
</Form.Section> </Form.Section>
</Form> </Form>
{/* 个性化设置 */} {/* 个性化设置 */}
<Form values={inputs} getFormApi={formAPI => formAPIPersonalization.current = formAPI} style={{marginBottom: 15}}> <Form values={inputs} getFormApi={formAPI => formAPIPersonalization.current = formAPI}
style={{ marginBottom: 15 }}>
<Form.Section text={'个性化设置'}> <Form.Section text={'个性化设置'}>
<Form.Input <Form.Input
label={'系统名称'} label={'系统名称'}
@ -220,7 +220,8 @@ const OtherSetting = () => {
style={{ fontFamily: 'JetBrains Mono, Consolas' }} style={{ fontFamily: 'JetBrains Mono, Consolas' }}
autosize={{ minRows: 6, maxRows: 12 }} autosize={{ minRows: 6, maxRows: 12 }}
/> />
<Button onClick={() => submitOption('HomePageContent')} loading={loadingInput['HomePageContent']}>设置首页内容</Button> <Button onClick={() => submitOption('HomePageContent')}
loading={loadingInput['HomePageContent']}>设置首页内容</Button>
<Form.TextArea <Form.TextArea
label={'关于'} label={'关于'}
placeholder={'在此输入新的关于内容，支持 Markdown & HTML 代码。如果输入的是一个链接，则会使用该链接作为 iframe 的 src 属性，这允许你设置任意网页作为关于页面。'} placeholder={'在此输入新的关于内容，支持 Markdown & HTML 代码。如果输入的是一个链接，则会使用该链接作为 iframe 的 src 属性，这允许你设置任意网页作为关于页面。'}

36
web/src/components/PasswordResetConfirm.js
View File

@ -1,12 +1,12 @@
import React, { useEffect, useState } from 'react'; import React, { useEffect, useState } from 'react';
import { Button, Form, Grid, Header, Image, Segment } from 'semantic-ui-react'; import { Button, Form, Grid, Header, Image, Segment } from 'semantic-ui-react';
import { API, copy, showError, showInfo, showNotice, showSuccess } from '../helpers'; import { API, copy, showError, showNotice } from '../helpers';
import { useSearchParams } from 'react-router-dom'; import { useSearchParams } from 'react-router-dom';
const PasswordResetConfirm = () => { const PasswordResetConfirm = () => {
const [inputs, setInputs] = useState({ const [inputs, setInputs] = useState({
email: '', email: '',
token: '', token: ''
}); });
const { email, token } = inputs; const { email, token } = inputs;
@ -23,7 +23,7 @@ const PasswordResetConfirm = () => {
let email = searchParams.get('email'); let email = searchParams.get('email');
setInputs({ setInputs({
token, token,
email, email
}); });
}, []); }, []);
@ -46,7 +46,7 @@ const PasswordResetConfirm = () => {
setLoading(true); setLoading(true);
const res = await API.post(`/api/user/reset`, { const res = await API.post(`/api/user/reset`, {
email, email,
token, token
}); });
const { success, message } = res.data; const { success, message } = res.data;
if (success) { if (success) {
@ -61,29 +61,29 @@ const PasswordResetConfirm = () => {
} }
return ( return (
<Grid textAlign='center' style={{ marginTop: '48px' }}> <Grid textAlign="center" style={{ marginTop: '48px' }}>
<Grid.Column style={{ maxWidth: 450 }}> <Grid.Column style={{ maxWidth: 450 }}>
<Header as='h2' color='' textAlign='center'> <Header as="h2" color="" textAlign="center">
<Image src='/logo.png' /> 密码重置确认 <Image src="/logo.png" /> 密码重置确认
</Header> </Header>
<Form size='large'> <Form size="large">
<Segment> <Segment>
<Form.Input <Form.Input
fluid fluid
icon='mail' icon="mail"
iconPosition='left' iconPosition="left"
placeholder='邮箱地址' placeholder="邮箱地址"
name='email' name="email"
value={email} value={email}
readOnly readOnly
/> />
{newPassword && ( {newPassword && (
<Form.Input <Form.Input
fluid fluid
icon='lock' icon="lock"
iconPosition='left' iconPosition="left"
placeholder='新密码' placeholder="新密码"
name='newPassword' name="newPassword"
value={newPassword} value={newPassword}
readOnly readOnly
onClick={(e) => { onClick={(e) => {
@ -94,9 +94,9 @@ const PasswordResetConfirm = () => {
/> />
)} )}
<Button <Button
color='green' color="green"
fluid fluid
size='large' size="large"
onClick={handleSubmit} onClick={handleSubmit}
loading={loading} loading={loading}
disabled={disableButton} disabled={disableButton}

20
web/src/components/PasswordResetForm.js
View File

@ -56,19 +56,19 @@ const PasswordResetForm = () => {
} }
return ( return (
<Grid textAlign='center' style={{ marginTop: '48px' }}> <Grid textAlign="center" style={{ marginTop: '48px' }}>
<Grid.Column style={{ maxWidth: 450 }}> <Grid.Column style={{ maxWidth: 450 }}>
<Header as='h2' color='' textAlign='center'> <Header as="h2" color="" textAlign="center">
<Image src='/logo.png' /> 密码重置 <Image src="/logo.png" /> 密码重置
</Header> </Header>
<Form size='large'> <Form size="large">
<Segment> <Segment>
<Form.Input <Form.Input
fluid fluid
icon='mail' icon="mail"
iconPosition='left' iconPosition="left"
placeholder='邮箱地址' placeholder="邮箱地址"
name='email' name="email"
value={email} value={email}
onChange={handleChange} onChange={handleChange}
/> />
@ -83,9 +83,9 @@ const PasswordResetForm = () => {
<></> <></>
)} )}
<Button <Button
color='green' color="green"
fluid fluid
size='large' size="large"
onClick={handleSubmit} onClick={handleSubmit}
loading={loading} loading={loading}
disabled={disableButton} disabled={disableButton}

93
web/src/components/PersonalSetting.js
View File

@ -1,26 +1,25 @@
import React, { useContext, useEffect, useState } from 'react'; import React, { useContext, useEffect, useState } from 'react';
import {Link, useNavigate} from 'react-router-dom'; import { useNavigate } from 'react-router-dom';
import {API, copy, isRoot, showError, showInfo, showNotice, showSuccess} from '../helpers'; import { API, copy, isRoot, showError, showInfo, showSuccess } from '../helpers';
import Turnstile from 'react-turnstile'; import Turnstile from 'react-turnstile';
import { UserContext } from '../context/User'; import { UserContext } from '../context/User';
import { onGitHubOAuthClicked, onLinuxDoOAuthClicked } from './utils'; import { onGitHubOAuthClicked, onLinuxDoOAuthClicked } from './utils';
import { import {
Avatar, Banner, Avatar,
Banner,
Button, Button,
Card, Card,
Descriptions, Descriptions,
Divider, Image, Image,
Input, InputNumber, Input,
InputNumber,
Layout, Layout,
Modal, Modal,
Space, Space,
Tag, Tag,
Typography Typography
} from "@douyinfe/semi-ui"; } from '@douyinfe/semi-ui';
import {getQuotaPerUnit, renderQuota, renderQuotaWithPrompt, stringToColor} from "../helpers/render"; import { getQuotaPerUnit, renderQuota, renderQuotaWithPrompt, stringToColor } from '../helpers/render';
import EditToken from "../pages/Token/EditToken";
import EditUser from "../pages/User/EditUser";
import passwordResetConfirm from "./PasswordResetConfirm";
import TelegramLoginButton from 'react-telegram-login'; import TelegramLoginButton from 'react-telegram-login';
const PersonalSetting = () => { const PersonalSetting = () => {
@ -33,7 +32,7 @@ const PersonalSetting = () => {
email: '', email: '',
self_account_deletion_confirmation: '', self_account_deletion_confirmation: '',
set_new_password: '', set_new_password: '',
set_new_password_confirmation: '', set_new_password_confirmation: ''
}); });
const [status, setStatus] = useState({}); const [status, setStatus] = useState({});
const [showChangePasswordModal, setShowChangePasswordModal] = useState(false); const [showChangePasswordModal, setShowChangePasswordModal] = useState(false);
@ -46,8 +45,8 @@ const PersonalSetting = () => {
const [loading, setLoading] = useState(false); const [loading, setLoading] = useState(false);
const [disableButton, setDisableButton] = useState(false); const [disableButton, setDisableButton] = useState(false);
const [countdown, setCountdown] = useState(30); const [countdown, setCountdown] = useState(30);
const [affLink, setAffLink] = useState(""); const [affLink, setAffLink] = useState('');
const [systemToken, setSystemToken] = useState(""); const [systemToken, setSystemToken] = useState('');
const [models, setModels] = useState([]); const [models, setModels] = useState([]);
const [openTransfer, setOpenTransfer] = useState(false); const [openTransfer, setOpenTransfer] = useState(false);
const [transferAmount, setTransferAmount] = useState(0); const [transferAmount, setTransferAmount] = useState(0);
@ -70,12 +69,12 @@ const PersonalSetting = () => {
} }
getUserData().then( getUserData().then(
(res) => { (res) => {
console.log(userState) console.log(userState);
} }
); );
loadModels().then(); loadModels().then();
getAffLink().then(); getAffLink().then();
setTransferAmount(getQuotaPerUnit()) setTransferAmount(getQuotaPerUnit());
}, []); }, []);
useEffect(() => { useEffect(() => {
@ -126,18 +125,18 @@ const PersonalSetting = () => {
} else { } else {
showError(message); showError(message);
} }
} };
const loadModels = async () => { const loadModels = async () => {
let res = await API.get(`/api/user/models`); let res = await API.get(`/api/user/models`);
const { success, message, data } = res.data; const { success, message, data } = res.data;
if (success) { if (success) {
setModels(data); setModels(data);
console.log(data) console.log(data);
} else { } else {
showError(message); showError(message);
} }
} };
const handleAffLinkClick = async (e) => { const handleAffLinkClick = async (e) => {
e.target.select(); e.target.select();
@ -276,11 +275,11 @@ const PersonalSetting = () => {
} else { } else {
return 'null'; return 'null';
} }
} };
const handleCancel = () => { const handleCancel = () => {
setOpenTransfer(false); setOpenTransfer(false);
} };
const copyText = async (text) => { const copyText = async (text) => {
if (await copy(text)) { if (await copy(text)) {
@ -289,7 +288,7 @@ const PersonalSetting = () => {
// setSearchKeyword(text); // setSearchKeyword(text);
Modal.error({ title: '无法复制到剪贴板，请手动复制', content: text }); Modal.error({ title: '无法复制到剪贴板，请手动复制', content: text });
} }
} };
return ( return (
<div> <div>
@ -311,7 +310,8 @@ const PersonalSetting = () => {
<div style={{ marginTop: 20 }}> <div style={{ marginTop: 20 }}>
<Typography.Text>{`划转额度${renderQuotaWithPrompt(transferAmount)} 最低` + renderQuota(getQuotaPerUnit())}</Typography.Text> <Typography.Text>{`划转额度${renderQuotaWithPrompt(transferAmount)} 最低` + renderQuota(getQuotaPerUnit())}</Typography.Text>
<div> <div>
<InputNumber min={0} style={{marginTop: 5}} value={transferAmount} onChange={(value)=>setTransferAmount(value)} disabled={false}></InputNumber> <InputNumber min={0} style={{ marginTop: 5 }} value={transferAmount}
onChange={(value) => setTransferAmount(value)} disabled={false}></InputNumber>
</div> </div>
</div> </div>
</Modal> </Modal>
@ -348,7 +348,7 @@ const PersonalSetting = () => {
<Space wrap> <Space wrap>
{models.map((model) => ( {models.map((model) => (
<Tag key={model} color="cyan" onClick={() => { <Tag key={model} color="cyan" onClick={() => {
copyText(model) copyText(model);
}}> }}>
{model} {model}
</Tag> </Tag>
@ -379,9 +379,11 @@ const PersonalSetting = () => {
renderQuota(userState?.user?.aff_quota) renderQuota(userState?.user?.aff_quota)
} }
</span> </span>
<Button type={'secondary'} onClick={()=>setOpenTransfer(true)} size={'small'} style={{marginLeft: 10}}>划转</Button> <Button type={'secondary'} onClick={() => setOpenTransfer(true)} size={'small'}
style={{ marginLeft: 10 }}>划转</Button>
</Descriptions.Item> </Descriptions.Item>
<Descriptions.Item itemKey="总收益">{renderQuota(userState?.user?.aff_history_quota)}</Descriptions.Item> <Descriptions.Item
itemKey="总收益">{renderQuota(userState?.user?.aff_history_quota)}</Descriptions.Item>
<Descriptions.Item itemKey="邀请人数">{userState?.user?.aff_count}</Descriptions.Item> <Descriptions.Item itemKey="邀请人数">{userState?.user?.aff_count}</Descriptions.Item>
</Descriptions> </Descriptions>
</div> </div>
@ -398,7 +400,9 @@ const PersonalSetting = () => {
></Input> ></Input>
</div> </div>
<div> <div>
<Button onClick={()=>{setShowEmailBindModal(true)}}>{ <Button onClick={() => {
setShowEmailBindModal(true);
}}>{
userState.user && userState.user.email !== '' ? '修改绑定' : '绑定邮箱' userState.user && userState.user.email !== '' ? '修改绑定' : '绑定邮箱'
}</Button> }</Button>
</div> </div>
@ -433,7 +437,9 @@ const PersonalSetting = () => {
</div> </div>
<div> <div>
<Button <Button
onClick={() => {onGitHubOAuthClicked(status.github_client_id)}} onClick={() => {
onGitHubOAuthClicked(status.github_client_id);
}}
disabled={(userState.user && userState.user.github_id !== '') || !status.github_oauth} disabled={(userState.user && userState.user.github_id !== '') || !status.github_oauth}
> >
{ {
@ -454,7 +460,9 @@ const PersonalSetting = () => {
</div> </div>
<div> <div>
<Button <Button
onClick={() => {onLinuxDoOAuthClicked(status.linuxdo_client_id)}} onClick={() => {
onLinuxDoOAuthClicked(status.linuxdo_client_id);
}}
disabled={(userState.user && userState.user.linuxdo_id !== '') || !status.linuxdo_oauth} disabled={(userState.user && userState.user.linuxdo_id !== '') || !status.linuxdo_oauth}
> >
{ {
@ -477,7 +485,8 @@ const PersonalSetting = () => {
<div> <div>
{status.telegram_oauth ? {status.telegram_oauth ?
userState.user.telegram_id !== '' ? <Button disabled={true}>已绑定</Button> userState.user.telegram_id !== '' ? <Button disabled={true}>已绑定</Button>
: <TelegramLoginButton dataAuthUrl="/api/oauth/telegram/bind" botName={status.telegram_bot_name} /> : <TelegramLoginButton dataAuthUrl="/api/oauth/telegram/bind"
botName={status.telegram_bot_name}/>
: <Button disabled={true}>未启用</Button> : <Button disabled={true}>未启用</Button>
} }
</div> </div>
@ -527,12 +536,12 @@ const PersonalSetting = () => {
</p> </p>
</div> </div>
<Input <Input
placeholder='验证码' placeholder="验证码"
name='wechat_verification_code' name="wechat_verification_code"
value={inputs.wechat_verification_code} value={inputs.wechat_verification_code}
onChange={(v) => handleInputChange('wechat_verification_code', v)} onChange={(v) => handleInputChange('wechat_verification_code', v)}
/> />
<Button color='' fluid size='large' onClick={bindWeChat}> <Button color="" fluid size="large" onClick={bindWeChat}>
绑定 绑定
</Button> </Button>
</Modal> </Modal>
@ -551,10 +560,10 @@ const PersonalSetting = () => {
<div style={{marginTop: 20, display: 'flex', justifyContent: 'space-between'}}> <div style={{marginTop: 20, display: 'flex', justifyContent: 'space-between'}}>
<Input <Input
fluid fluid
placeholder='输入邮箱地址' placeholder="输入邮箱地址"
onChange={(value) => handleInputChange('email', value)} onChange={(value) => handleInputChange('email', value)}
name='email' name="email"
type='email' type="email"
/> />
<Button onClick={sendVerificationCode} <Button onClick={sendVerificationCode}
disabled={disableButton || loading}> disabled={disableButton || loading}>
@ -564,8 +573,8 @@ const PersonalSetting = () => {
<div style={{marginTop: 10}}> <div style={{marginTop: 10}}>
<Input <Input
fluid fluid
placeholder='验证码' placeholder="验证码"
name='email_verification_code' name="email_verification_code"
value={inputs.email_verification_code} value={inputs.email_verification_code}
onChange={(value) => handleInputChange('email_verification_code', value)} onChange={(value) => handleInputChange('email_verification_code', value)}
/> />
@ -598,7 +607,7 @@ const PersonalSetting = () => {
<div style={{ marginTop: 20 }}> <div style={{ marginTop: 20 }}>
<Input <Input
placeholder={`输入你的账户名 ${userState?.user?.username} 以确认删除`} placeholder={`输入你的账户名 ${userState?.user?.username} 以确认删除`}
name='self_account_deletion_confirmation' name="self_account_deletion_confirmation"
value={inputs.self_account_deletion_confirmation} value={inputs.self_account_deletion_confirmation}
onChange={(value) => handleInputChange('self_account_deletion_confirmation', value)} onChange={(value) => handleInputChange('self_account_deletion_confirmation', value)}
/> />
@ -623,15 +632,15 @@ const PersonalSetting = () => {
> >
<div style={{ marginTop: 20 }}> <div style={{ marginTop: 20 }}>
<Input <Input
name='set_new_password' name="set_new_password"
placeholder='新密码' placeholder="新密码"
value={inputs.set_new_password} value={inputs.set_new_password}
onChange={(value) => handleInputChange('set_new_password', value)} onChange={(value) => handleInputChange('set_new_password', value)}
/> />
<Input <Input
style={{ marginTop: 20 }} style={{ marginTop: 20 }}
name='set_new_password_confirmation' name="set_new_password_confirmation"
placeholder='确认新密码' placeholder="确认新密码"
value={inputs.set_new_password_confirmation} value={inputs.set_new_password_confirmation}
onChange={(value) => handleInputChange('set_new_password_confirmation', value)} onChange={(value) => handleInputChange('set_new_password_confirmation', value)}
/> />

2
web/src/components/PrivateRoute.js
View File

@ -5,7 +5,7 @@ import { history } from '../helpers';
function PrivateRoute({ children }) { function PrivateRoute({ children }) {
if (!localStorage.getItem('user')) { if (!localStorage.getItem('user')) {
return <Navigate to='/login' state={{ from: history.location }} />; return <Navigate to="/login" state={{ from: history.location }} />;
} }
return children; return children;
} }

84
web/src/components/RedemptionsTable.js
View File

@ -1,10 +1,10 @@
import React, { useEffect, useState } from 'react'; import React, { useEffect, useState } from 'react';
import {API, copy, showError, showInfo, showSuccess, showWarning, timestamp2string} from '../helpers'; import { API, copy, showError, showSuccess, timestamp2string } from '../helpers';
import { ITEMS_PER_PAGE } from '../constants'; import { ITEMS_PER_PAGE } from '../constants';
import { renderQuota } from '../helpers/render'; import { renderQuota } from '../helpers/render';
import {Button, Modal, Popconfirm, Popover, Table, Tag, Form} from "@douyinfe/semi-ui"; import { Button, Form, Modal, Popconfirm, Popover, Table, Tag } from '@douyinfe/semi-ui';
import EditRedemption from "../pages/Redemption/EditRedemption"; import EditRedemption from '../pages/Redemption/EditRedemption';
function renderTimestamp(timestamp) { function renderTimestamp(timestamp) {
return ( return (
@ -17,13 +17,13 @@ function renderTimestamp(timestamp) {
function renderStatus(status) { function renderStatus(status) {
switch (status) { switch (status) {
case 1: case 1:
return <Tag color='green' size='large'>未使用</Tag>; return <Tag color="green" size="large">未使用</Tag>;
case 2: case 2:
return <Tag color='red' size='large'> 已禁用 </Tag>; return <Tag color="red" size="large"> 已禁用 </Tag>;
case 3: case 3:
return <Tag color='grey' size='large'> 已使用 </Tag>; return <Tag color="grey" size="large"> 已使用 </Tag>;
default: default:
return <Tag color='black' size='large'> 未知状态 </Tag>; return <Tag color="black" size="large"> 未知状态 </Tag>;
} }
} }
@ -31,11 +31,11 @@ const RedemptionsTable = () => {
const columns = [ const columns = [
{ {
title: 'ID', title: 'ID',
dataIndex: 'id', dataIndex: 'id'
}, },
{ {
title: '名称', title: '名称',
dataIndex: 'name', dataIndex: 'name'
}, },
{ {
title: '状态', title: '状态',
@ -47,7 +47,7 @@ const RedemptionsTable = () => {
{renderStatus(text)} {renderStatus(text)}
</div> </div>
); );
}, }
}, },
{ {
title: '额度', title: '额度',
@ -58,7 +58,7 @@ const RedemptionsTable = () => {
{renderQuota(parseInt(text))} {renderQuota(parseInt(text))}
</div> </div>
); );
}, }
}, },
{ {
title: '创建时间', title: '创建时间',
@ -69,7 +69,7 @@ const RedemptionsTable = () => {
{renderTimestamp(text)} {renderTimestamp(text)}
</div> </div>
); );
}, }
}, },
{ {
title: '兑换人ID', title: '兑换人ID',
@ -80,7 +80,7 @@ const RedemptionsTable = () => {
{text === 0 ? '无' : text} {text === 0 ? '无' : text}
</div> </div>
); );
}, }
}, },
{ {
title: '', title: '',
@ -94,11 +94,11 @@ const RedemptionsTable = () => {
style={{ padding: 20 }} style={{ padding: 20 }}
position="top" position="top"
> >
<Button theme='light' type='tertiary' style={{marginRight: 1}}>查看</Button> <Button theme="light" type="tertiary" style={{ marginRight: 1 }}>查看</Button>
</Popover> </Popover>
<Button theme='light' type='secondary' style={{marginRight: 1}} <Button theme="light" type="secondary" style={{ marginRight: 1 }}
onClick={async (text) => { onClick={async (text) => {
await copyText(record.key) await copyText(record.key);
}} }}
>复制</Button> >复制</Button>
<Popconfirm <Popconfirm
@ -111,23 +111,23 @@ const RedemptionsTable = () => {
() => { () => {
removeRecord(record.key); removeRecord(record.key);
} }
) );
}} }}
> >
<Button theme='light' type='danger' style={{marginRight: 1}}>删除</Button> <Button theme="light" type="danger" style={{ marginRight: 1 }}>删除</Button>
</Popconfirm> </Popconfirm>
{ {
record.status === 1 ? record.status === 1 ?
<Button theme='light' type='warning' style={{marginRight: 1}} onClick={ <Button theme="light" type="warning" style={{ marginRight: 1 }} onClick={
async () => { async () => {
manageRedemption( manageRedemption(
record.id, record.id,
'disable', 'disable',
record record
) );
} }
}>禁用</Button> : }>禁用</Button> :
<Button theme='light' type='secondary' style={{marginRight: 1}} onClick={ <Button theme="light" type="secondary" style={{ marginRight: 1 }} onClick={
async () => { async () => {
manageRedemption( manageRedemption(
record.id, record.id,
@ -137,15 +137,15 @@ const RedemptionsTable = () => {
} }
} disabled={record.status === 3}>启用</Button> } disabled={record.status === 3}>启用</Button>
} }
<Button theme='light' type='tertiary' style={{marginRight: 1}} onClick={ <Button theme="light" type="tertiary" style={{ marginRight: 1 }} onClick={
() => { () => {
setEditingRedemption(record); setEditingRedemption(record);
setShowEdit(true); setShowEdit(true);
} }
} disabled={record.status !== 1}>编辑</Button> } disabled={record.status !== 1}>编辑</Button>
</div> </div>
), )
}, }
]; ];
const [redemptions, setRedemptions] = useState([]); const [redemptions, setRedemptions] = useState([]);
@ -156,13 +156,13 @@ const RedemptionsTable = () => {
const [tokenCount, setTokenCount] = useState(ITEMS_PER_PAGE); const [tokenCount, setTokenCount] = useState(ITEMS_PER_PAGE);
const [selectedKeys, setSelectedKeys] = useState([]); const [selectedKeys, setSelectedKeys] = useState([]);
const [editingRedemption, setEditingRedemption] = useState({ const [editingRedemption, setEditingRedemption] = useState({
id: undefined, id: undefined
}); });
const [showEdit, setShowEdit] = useState(false); const [showEdit, setShowEdit] = useState(false);
const closeEdit = () => { const closeEdit = () => {
setShowEdit(false); setShowEdit(false);
} };
// const setCount = (data) => { // const setCount = (data) => {
// if (data.length >= (activePage) * ITEMS_PER_PAGE) { // if (data.length >= (activePage) * ITEMS_PER_PAGE) {
@ -183,7 +183,7 @@ const RedemptionsTable = () => {
} else { } else {
setTokenCount(redeptions.length); setTokenCount(redeptions.length);
} }
} };
const loadRedemptions = async (startIdx) => { const loadRedemptions = async (startIdx) => {
const res = await API.get(`/api/redemption/?p=${startIdx}`); const res = await API.get(`/api/redemption/?p=${startIdx}`);
@ -221,7 +221,7 @@ const RedemptionsTable = () => {
// setSearchKeyword(text); // setSearchKeyword(text);
Modal.error({ title: '无法复制到剪贴板，请手动复制', content: text }); Modal.error({ title: '无法复制到剪贴板，请手动复制', content: text });
} }
} };
const onPaginationChange = (e, { activePage }) => { const onPaginationChange = (e, { activePage }) => {
(async () => { (async () => {
@ -332,15 +332,15 @@ const RedemptionsTable = () => {
}, },
onChange: (selectedRowKeys, selectedRows) => { onChange: (selectedRowKeys, selectedRows) => {
setSelectedKeys(selectedRows); setSelectedKeys(selectedRows);
}, }
}; };
const handleRow = (record, index) => { const handleRow = (record, index) => {
if (record.status !== 1) { if (record.status !== 1) {
return { return {
style: { style: {
background: 'var(--semi-color-disabled-border)', background: 'var(--semi-color-disabled-border)'
}, }
}; };
} else { } else {
return {}; return {};
@ -353,11 +353,11 @@ const RedemptionsTable = () => {
handleClose={closeEdit}></EditRedemption> handleClose={closeEdit}></EditRedemption>
<Form onSubmit={searchRedemptions}> <Form onSubmit={searchRedemptions}>
<Form.Input <Form.Input
label='搜索关键字' label="搜索关键字"
field='keyword' field="keyword"
icon='search' icon="search"
iconPosition='left' iconPosition="left"
placeholder='关键字(id或者名称)' placeholder="关键字(id或者名称)"
value={searchKeyword} value={searchKeyword}
loading={searching} loading={searching}
onChange={handleKeywordChange} onChange={handleKeywordChange}
@ -375,26 +375,26 @@ const RedemptionsTable = () => {
// setPageSize(size); // setPageSize(size);
// setActivePage(1); // setActivePage(1);
// }, // },
onPageChange: handlePageChange, onPageChange: handlePageChange
}} loading={loading} rowSelection={rowSelection} onRow={handleRow}> }} loading={loading} rowSelection={rowSelection} onRow={handleRow}>
</Table> </Table>
<Button theme='light' type='primary' style={{marginRight: 8}} onClick={ <Button theme="light" type="primary" style={{ marginRight: 8 }} onClick={
() => { () => {
setEditingRedemption({ setEditingRedemption({
id: undefined, id: undefined
}); });
setShowEdit(true); setShowEdit(true);
} }
}>添加兑换码</Button> }>添加兑换码</Button>
<Button label='复制所选兑换码' type="warning" onClick={ <Button label="复制所选兑换码" type="warning" onClick={
async () => { async () => {
if (selectedKeys.length === 0) { if (selectedKeys.length === 0) {
showError('请至少选择一个兑换码！'); showError('请至少选择一个兑换码！');
return; return;
} }
let keys = ""; let keys = '';
for (let i = 0; i < selectedKeys.length; i++) { for (let i = 0; i < selectedKeys.length; i++) {
keys += selectedKeys[i].name + " " + selectedKeys[i].key + "\n"; keys += selectedKeys[i].name + ' ' + selectedKeys[i].key + '\n';
} }
await copyText(keys); await copyText(keys);
} }

58
web/src/components/RegisterForm.js
View File

@ -98,49 +98,49 @@ const RegisterForm = () => {
}; };
return ( return (
<Grid textAlign='center' style={{ marginTop: '48px' }}> <Grid textAlign="center" style={{ marginTop: '48px' }}>
<Grid.Column style={{ maxWidth: 450 }}> <Grid.Column style={{ maxWidth: 450 }}>
<Header as='h2' color='' textAlign='center'> <Header as="h2" color="" textAlign="center">
<Image src={logo} /> 新用户注册 <Image src={logo} /> 新用户注册
</Header> </Header>
<Form size='large'> <Form size="large">
<Segment> <Segment>
<Form.Input <Form.Input
fluid fluid
icon='user' icon="user"
iconPosition='left' iconPosition="left"
placeholder='输入用户名，最长 12 位' placeholder="输入用户名，最长 12 位"
onChange={handleChange} onChange={handleChange}
name='username' name="username"
/> />
<Form.Input <Form.Input
fluid fluid
icon='lock' icon="lock"
iconPosition='left' iconPosition="left"
placeholder='输入密码，最短 8 位，最长 20 位' placeholder="输入密码，最短 8 位，最长 20 位"
onChange={handleChange} onChange={handleChange}
name='password' name="password"
type='password' type="password"
/> />
<Form.Input <Form.Input
fluid fluid
icon='lock' icon="lock"
iconPosition='left' iconPosition="left"
placeholder='输入密码，最短 8 位，最长 20 位' placeholder="输入密码，最短 8 位，最长 20 位"
onChange={handleChange} onChange={handleChange}
name='password2' name="password2"
type='password' type="password"
/> />
{showEmailVerification ? ( {showEmailVerification ? (
<> <>
<Form.Input <Form.Input
fluid fluid
icon='mail' icon="mail"
iconPosition='left' iconPosition="left"
placeholder='输入邮箱地址' placeholder="输入邮箱地址"
onChange={handleChange} onChange={handleChange}
name='email' name="email"
type='email' type="email"
action={ action={
<Button onClick={sendVerificationCode} disabled={loading}> <Button onClick={sendVerificationCode} disabled={loading}>
获取验证码 获取验证码
@ -149,11 +149,11 @@ const RegisterForm = () => {
/> />
<Form.Input <Form.Input
fluid fluid
icon='lock' icon="lock"
iconPosition='left' iconPosition="left"
placeholder='输入验证码' placeholder="输入验证码"
onChange={handleChange} onChange={handleChange}
name='verification_code' name="verification_code"
/> />
</> </>
) : ( ) : (
@ -170,9 +170,9 @@ const RegisterForm = () => {
<></> <></>
)} )}
<Button <Button
color='green' color="green"
fluid fluid
size='large' size="large"
onClick={handleSubmit} onClick={handleSubmit}
loading={loading} loading={loading}
> >
@ -182,7 +182,7 @@ const RegisterForm = () => {
</Form> </Form>
<Message> <Message>
已有账户？ 已有账户？
<Link to='/login' className='btn btn-link'> <Link to="/login" className="btn btn-link">
点击登录 点击登录
</Link> </Link>
</Message> </Message>

75
web/src/components/SiderBar.js
View File

@ -1,25 +1,25 @@
import React, { useContext, useEffect, useLayoutEffect, useMemo, useState } from 'react'; import React, { useContext, useEffect, useMemo, useState } from 'react';
import { Link, useNavigate } from 'react-router-dom'; import { Link, useNavigate } from 'react-router-dom';
import { UserContext } from '../context/User'; import { UserContext } from '../context/User';
import { StatusContext } from '../context/Status'; import { StatusContext } from '../context/Status';
import { API, getLogo, getSystemName, isAdmin, isMobile, showError, showSuccess } from '../helpers'; import { API, getLogo, getSystemName, isAdmin, isMobile, showError } from '../helpers';
import '../index.css'; import '../index.css';
import { import {
IconCalendarClock, IconCalendarClock,
IconHistogram, IconComment,
IconCreditCard,
IconGift, IconGift,
IconHistogram,
IconHome,
IconImage,
IconKey, IconKey,
IconUser,
IconLayers, IconLayers,
IconSetting, IconSetting,
IconCreditCard, IconUser
IconComment,
IconHome,
IconImage
} from '@douyinfe/semi-icons'; } from '@douyinfe/semi-icons';
import {Nav, Avatar, Dropdown, Layout} from '@douyinfe/semi-ui'; import { Layout, Nav } from '@douyinfe/semi-ui';
// HeaderBar Buttons // HeaderBar Buttons
@ -34,6 +34,21 @@ const SiderBar = () => {
const logo = getLogo(); const logo = getLogo();
const [isCollapsed, setIsCollapsed] = useState(defaultIsCollapsed); const [isCollapsed, setIsCollapsed] = useState(defaultIsCollapsed);
const routerMap = {
home: '/',
channel: '/channel',
token: '/token',
redemption: '/redemption',
topup: '/topup',
user: '/user',
log: '/log',
midjourney: '/midjourney',
setting: '/setting',
about: '/about',
chat: '/chat',
detail: '/detail'
};
const headerButtons = useMemo(() => [ const headerButtons = useMemo(() => [
{ {
text: '首页', text: '首页',
@ -46,14 +61,14 @@ const SiderBar = () => {
itemKey: 'channel', itemKey: 'channel',
to: '/channel', to: '/channel',
icon: <IconLayers />, icon: <IconLayers />,
className: isAdmin()?'semi-navigation-item-normal':'tableHiddle', className: isAdmin() ? 'semi-navigation-item-normal' : 'tableHiddle'
}, },
{ {
text: '聊天', text: '聊天',
itemKey: 'chat', itemKey: 'chat',
to: '/chat', to: '/chat',
icon: <IconComment />, icon: <IconComment />,
className: localStorage.getItem('chat_link')?'semi-navigation-item-normal':'tableHiddle', className: localStorage.getItem('chat_link') ? 'semi-navigation-item-normal' : 'tableHiddle'
}, },
{ {
text: '令牌', text: '令牌',
@ -66,7 +81,7 @@ const SiderBar = () => {
itemKey: 'redemption', itemKey: 'redemption',
to: '/redemption', to: '/redemption',
icon: <IconGift />, icon: <IconGift />,
className: isAdmin()?'semi-navigation-item-normal':'tableHiddle', className: isAdmin() ? 'semi-navigation-item-normal' : 'tableHiddle'
}, },
{ {
text: '钱包', text: '钱包',
@ -79,7 +94,7 @@ const SiderBar = () => {
itemKey: 'user', itemKey: 'user',
to: '/user', to: '/user',
icon: <IconUser />, icon: <IconUser />,
className: isAdmin()?'semi-navigation-item-normal':'tableHiddle', className: isAdmin() ? 'semi-navigation-item-normal' : 'tableHiddle'
}, },
{ {
text: '日志', text: '日志',
@ -92,21 +107,21 @@ const SiderBar = () => {
itemKey: 'detail', itemKey: 'detail',
to: '/detail', to: '/detail',
icon: <IconCalendarClock />, icon: <IconCalendarClock />,
className: localStorage.getItem('enable_data_export') === 'true'?'semi-navigation-item-normal':'tableHiddle', className: localStorage.getItem('enable_data_export') === 'true' ? 'semi-navigation-item-normal' : 'tableHiddle'
}, },
{ {
text: '绘图', text: '绘图',
itemKey: 'midjourney', itemKey: 'midjourney',
to: '/midjourney', to: '/midjourney',
icon: <IconImage />, icon: <IconImage />,
className: localStorage.getItem('enable_drawing') === 'true'?'semi-navigation-item-normal':'tableHiddle', className: localStorage.getItem('enable_drawing') === 'true' ? 'semi-navigation-item-normal' : 'tableHiddle'
}, },
{ {
text: '设置', text: '设置',
itemKey: 'setting', itemKey: 'setting',
to: '/setting', to: '/setting',
icon: <IconSetting /> icon: <IconSetting />
}, }
// { // {
// text: '关于', // text: '关于',
// itemKey: 'about', // itemKey: 'about',
@ -130,6 +145,7 @@ const SiderBar = () => {
localStorage.setItem('enable_data_export', data.enable_data_export); localStorage.setItem('enable_data_export', data.enable_data_export);
localStorage.setItem('data_export_default_time', data.data_export_default_time); localStorage.setItem('data_export_default_time', data.data_export_default_time);
localStorage.setItem('default_collapse_sidebar', data.default_collapse_sidebar); localStorage.setItem('default_collapse_sidebar', data.default_collapse_sidebar);
localStorage.setItem('mj_notify_enabled', data.mj_notify_enabled);
if (data.chat_link) { if (data.chat_link) {
localStorage.setItem('chat_link', data.chat_link); localStorage.setItem('chat_link', data.chat_link);
} else { } else {
@ -149,7 +165,12 @@ const SiderBar = () => {
loadStatus().then(() => { loadStatus().then(() => {
setIsCollapsed(isMobile() || localStorage.getItem('default_collapse_sidebar') === 'true'); setIsCollapsed(isMobile() || localStorage.getItem('default_collapse_sidebar') === 'true');
}); });
},[]) let localKey = window.location.pathname.split('/')[1]
if (localKey === '') {
localKey = 'home'
}
setSelectedKeys([localKey]);
}, []);
return ( return (
<> <>
@ -165,23 +186,9 @@ const SiderBar = () => {
}} }}
selectedKeys={selectedKeys} selectedKeys={selectedKeys}
renderWrapper={({ itemElement, isSubNav, isInSubNav, props }) => { renderWrapper={({ itemElement, isSubNav, isInSubNav, props }) => {
const routerMap = {
home: "/",
channel: "/channel",
token: "/token",
redemption: "/redemption",
topup: "/topup",
user: "/user",
log: "/log",
midjourney: "/midjourney",
setting: "/setting",
about: "/about",
chat: "/chat",
detail: "/detail",
};
return ( return (
<Link <Link
style={{textDecoration: "none"}} style={{ textDecoration: 'none' }}
to={routerMap[props.itemKey]} to={routerMap[props.itemKey]}
> >
{itemElement} {itemElement}
@ -193,8 +200,8 @@ const SiderBar = () => {
setSelectedKeys([key.itemKey]); setSelectedKeys([key.itemKey]);
}} }}
header={{ header={{
logo: <img src={logo} alt='logo' style={{marginRight: '0.75em'}}/>, logo: <img src={logo} alt="logo" style={{ marginRight: '0.75em' }} />,
text: systemName, text: systemName
}} }}
// footer={{ // footer={{
// text: '© 2021 NekoAPI', // text: '© 2021 NekoAPI',

270
web/src/components/SystemSetting.js
View File

@ -1,5 +1,5 @@
import React, { useEffect, useState } from 'react'; import React, { useEffect, useState } from 'react';
import { Button, Divider, Form, Grid, Header, Modal, Message } from 'semantic-ui-react'; import { Button, Divider, Form, Grid, Header, Message, Modal } from 'semantic-ui-react';
import { API, removeTrailingSlash, showError, verifyJSON } from '../helpers'; import { API, removeTrailingSlash, showError, verifyJSON } from '../helpers';
const SystemSetting = () => { const SystemSetting = () => {
@ -41,7 +41,7 @@ const SystemSetting = () => {
// telegram login // telegram login
TelegramOAuthEnabled: '', TelegramOAuthEnabled: '',
TelegramBotToken: '', TelegramBotToken: '',
TelegramBotName: '', TelegramBotName: ''
}); });
const [originInputs, setOriginInputs] = useState({}); const [originInputs, setOriginInputs] = useState({});
let [loading, setLoading] = useState(false); let [loading, setLoading] = useState(false);
@ -159,7 +159,7 @@ const SystemSetting = () => {
const submitPayAddress = async () => { const submitPayAddress = async () => {
if (inputs.ServerAddress === '') { if (inputs.ServerAddress === '') {
showError('请先填写服务器地址'); showError('请先填写服务器地址');
return return;
} }
if (originInputs['TopupGroupRatio'] !== inputs.TopupGroupRatio) { if (originInputs['TopupGroupRatio'] !== inputs.TopupGroupRatio) {
if (!verifyJSON(inputs.TopupGroupRatio)) { if (!verifyJSON(inputs.TopupGroupRatio)) {
@ -176,7 +176,7 @@ const SystemSetting = () => {
if (inputs.EpayKey !== '') { if (inputs.EpayKey !== '') {
await updateOption('EpayKey', inputs.EpayKey); await updateOption('EpayKey', inputs.EpayKey);
} }
await updateOption('Price', "" + inputs.Price); await updateOption('Price', '' + inputs.Price);
}; };
const submitSMTP = async () => { const submitSMTP = async () => {
@ -285,27 +285,27 @@ const SystemSetting = () => {
setRestrictedDomainInput(''); setRestrictedDomainInput('');
setInputs({ setInputs({
...inputs, ...inputs,
EmailDomainWhitelist: [...localDomainList, restrictedDomainInput], EmailDomainWhitelist: [...localDomainList, restrictedDomainInput]
}); });
setEmailDomainWhitelist([...EmailDomainWhitelist, { setEmailDomainWhitelist([...EmailDomainWhitelist, {
key: restrictedDomainInput, key: restrictedDomainInput,
text: restrictedDomainInput, text: restrictedDomainInput,
value: restrictedDomainInput, value: restrictedDomainInput
}]); }]);
} }
} };
return ( return (
<Grid columns={1}> <Grid columns={1}>
<Grid.Column> <Grid.Column>
<Form loading={loading}> <Form loading={loading}>
<Header as='h3'>通用设置</Header> <Header as="h3">通用设置</Header>
<Form.Group widths='equal'> <Form.Group widths="equal">
<Form.Input <Form.Input
label='服务器地址' label="服务器地址"
placeholder='例如：https://yourdomain.com' placeholder="例如：https://yourdomain.com"
value={inputs.ServerAddress} value={inputs.ServerAddress}
name='ServerAddress' name="ServerAddress"
onChange={handleInputChange} onChange={handleInputChange}
/> />
</Form.Group> </Form.Group>
@ -313,77 +313,77 @@ const SystemSetting = () => {
更新服务器地址 更新服务器地址
</Form.Button> </Form.Button>
<Divider /> <Divider />
<Header as='h3'>支付设置（当前仅支持易支付接口，默认使用上方服务器地址作为回调地址！）</Header> <Header as="h3">支付设置（当前仅支持易支付接口，默认使用上方服务器地址作为回调地址！）</Header>
<Form.Group widths='equal'> <Form.Group widths="equal">
<Form.Input <Form.Input
label='支付地址，不填写则不启用在线支付' label="支付地址，不填写则不启用在线支付"
placeholder='例如：https://yourdomain.com' placeholder="例如：https://yourdomain.com"
value={inputs.PayAddress} value={inputs.PayAddress}
name='PayAddress' name="PayAddress"
onChange={handleInputChange} onChange={handleInputChange}
/> />
<Form.Input <Form.Input
label='易支付商户ID' label="易支付商户ID"
placeholder='例如：0001' placeholder="例如：0001"
value={inputs.EpayId} value={inputs.EpayId}
name='EpayId' name="EpayId"
onChange={handleInputChange} onChange={handleInputChange}
/> />
<Form.Input <Form.Input
label='易支付商户密钥' label="易支付商户密钥"
placeholder='例如：dejhfueqhujasjmndbjkqaw' placeholder="例如：dejhfueqhujasjmndbjkqaw"
value={inputs.EpayKey} value={inputs.EpayKey}
name='EpayKey' name="EpayKey"
onChange={handleInputChange} onChange={handleInputChange}
/> />
</Form.Group> </Form.Group>
<Form.Group widths='equal'> <Form.Group widths="equal">
<Form.Input <Form.Input
label='回调地址，不填写则使用上方服务器地址作为回调地址' label="回调地址，不填写则使用上方服务器地址作为回调地址"
placeholder='例如：https://yourdomain.com' placeholder="例如：https://yourdomain.com"
value={inputs.CustomCallbackAddress} value={inputs.CustomCallbackAddress}
name='CustomCallbackAddress' name="CustomCallbackAddress"
onChange={handleInputChange} onChange={handleInputChange}
/> />
<Form.Input <Form.Input
label='充值价格（x元/美金）' label="充值价格（x元/美金）"
placeholder='例如：7，就是7元/美金' placeholder="例如：7，就是7元/美金"
value={inputs.Price} value={inputs.Price}
name='Price' name="Price"
min={0} min={0}
onChange={handleInputChange} onChange={handleInputChange}
/> />
<Form.Input <Form.Input
label='最低充值数量' label="最低充值数量"
placeholder='例如：2，就是最低充值2$' placeholder="例如：2，就是最低充值2$"
value={inputs.MinTopUp} value={inputs.MinTopUp}
name='MinTopUp' name="MinTopUp"
min={1} min={1}
onChange={handleInputChange} onChange={handleInputChange}
/> />
</Form.Group> </Form.Group>
<Form.Group widths='equal'> <Form.Group widths="equal">
<Form.TextArea <Form.TextArea
label='充值分组倍率' label="充值分组倍率"
name='TopupGroupRatio' name="TopupGroupRatio"
onChange={handleInputChange} onChange={handleInputChange}
style={{ minHeight: 250, fontFamily: 'JetBrains Mono, Consolas' }} style={{ minHeight: 250, fontFamily: 'JetBrains Mono, Consolas' }}
autoComplete='new-password' autoComplete="new-password"
value={inputs.TopupGroupRatio} value={inputs.TopupGroupRatio}
placeholder='为一个 JSON 文本，键为组名称，值为倍率' placeholder="为一个 JSON 文本，键为组名称，值为倍率"
/> />
</Form.Group> </Form.Group>
<Form.Button onClick={submitPayAddress}> <Form.Button onClick={submitPayAddress}>
更新支付设置 更新支付设置
</Form.Button> </Form.Button>
<Divider /> <Divider />
<Header as='h3'>配置登录注册</Header> <Header as="h3">配置登录注册</Header>
<Form.Group inline> <Form.Group inline>
<Form.Checkbox <Form.Checkbox
checked={inputs.PasswordLoginEnabled === 'true'} checked={inputs.PasswordLoginEnabled === 'true'}
label='允许通过密码进行登录' label="允许通过密码进行登录"
name='PasswordLoginEnabled' name="PasswordLoginEnabled"
onChange={handleInputChange} onChange={handleInputChange}
/> />
{ {
@ -401,7 +401,7 @@ const SystemSetting = () => {
<Modal.Actions> <Modal.Actions>
<Button onClick={() => setShowPasswordWarningModal(false)}>取消</Button> <Button onClick={() => setShowPasswordWarningModal(false)}>取消</Button>
<Button <Button
color='yellow' color="yellow"
onClick={async () => { onClick={async () => {
setShowPasswordWarningModal(false); setShowPasswordWarningModal(false);
await updateOption('PasswordLoginEnabled', 'false'); await updateOption('PasswordLoginEnabled', 'false');
@ -414,20 +414,20 @@ const SystemSetting = () => {
} }
<Form.Checkbox <Form.Checkbox
checked={inputs.PasswordRegisterEnabled === 'true'} checked={inputs.PasswordRegisterEnabled === 'true'}
label='允许通过密码进行注册' label="允许通过密码进行注册"
name='PasswordRegisterEnabled' name="PasswordRegisterEnabled"
onChange={handleInputChange} onChange={handleInputChange}
/> />
<Form.Checkbox <Form.Checkbox
checked={inputs.EmailVerificationEnabled === 'true'} checked={inputs.EmailVerificationEnabled === 'true'}
label='通过密码注册时需要进行邮箱验证' label="通过密码注册时需要进行邮箱验证"
name='EmailVerificationEnabled' name="EmailVerificationEnabled"
onChange={handleInputChange} onChange={handleInputChange}
/> />
<Form.Checkbox <Form.Checkbox
checked={inputs.GitHubOAuthEnabled === 'true'} checked={inputs.GitHubOAuthEnabled === 'true'}
label='允许通过 GitHub 账户登录 & 注册' label="允许通过 GitHub 账户登录 & 注册"
name='GitHubOAuthEnabled' name="GitHubOAuthEnabled"
onChange={handleInputChange} onChange={handleInputChange}
/> />
<Form.Checkbox <Form.Checkbox
@ -438,62 +438,62 @@ const SystemSetting = () => {
/> />
<Form.Checkbox <Form.Checkbox
checked={inputs.WeChatAuthEnabled === 'true'} checked={inputs.WeChatAuthEnabled === 'true'}
label='允许通过微信登录 & 注册' label="允许通过微信登录 & 注册"
name='WeChatAuthEnabled' name="WeChatAuthEnabled"
onChange={handleInputChange} onChange={handleInputChange}
/> />
<Form.Checkbox <Form.Checkbox
checked={inputs.TelegramOAuthEnabled === 'true'} checked={inputs.TelegramOAuthEnabled === 'true'}
label='允许通过 Telegram 进行登录' label="允许通过 Telegram 进行登录"
name='TelegramOAuthEnabled' name="TelegramOAuthEnabled"
onChange={handleInputChange} onChange={handleInputChange}
/> />
</Form.Group> </Form.Group>
<Form.Group inline> <Form.Group inline>
<Form.Checkbox <Form.Checkbox
checked={inputs.RegisterEnabled === 'true'} checked={inputs.RegisterEnabled === 'true'}
label='允许新用户注册（此项为否时，新用户将无法以任何方式进行注册）' label="允许新用户注册（此项为否时，新用户将无法以任何方式进行注册）"
name='RegisterEnabled' name="RegisterEnabled"
onChange={handleInputChange} onChange={handleInputChange}
/> />
<Form.Checkbox <Form.Checkbox
checked={inputs.TurnstileCheckEnabled === 'true'} checked={inputs.TurnstileCheckEnabled === 'true'}
label='启用 Turnstile 用户校验' label="启用 Turnstile 用户校验"
name='TurnstileCheckEnabled' name="TurnstileCheckEnabled"
onChange={handleInputChange} onChange={handleInputChange}
/> />
</Form.Group> </Form.Group>
<Divider /> <Divider />
<Header as='h3'> <Header as="h3">
配置邮箱域名白名单 配置邮箱域名白名单
<Header.Subheader>用以防止恶意用户利用临时邮箱批量注册</Header.Subheader> <Header.Subheader>用以防止恶意用户利用临时邮箱批量注册</Header.Subheader>
</Header> </Header>
<Form.Group widths={3}> <Form.Group widths={3}>
<Form.Checkbox <Form.Checkbox
label='启用邮箱域名白名单' label="启用邮箱域名白名单"
name='EmailDomainRestrictionEnabled' name="EmailDomainRestrictionEnabled"
onChange={handleInputChange} onChange={handleInputChange}
checked={inputs.EmailDomainRestrictionEnabled === 'true'} checked={inputs.EmailDomainRestrictionEnabled === 'true'}
/> />
</Form.Group> </Form.Group>
<Form.Group widths={2}> <Form.Group widths={2}>
<Form.Dropdown <Form.Dropdown
label='允许的邮箱域名' label="允许的邮箱域名"
placeholder='允许的邮箱域名' placeholder="允许的邮箱域名"
name='EmailDomainWhitelist' name="EmailDomainWhitelist"
required required
fluid fluid
multiple multiple
selection selection
onChange={handleInputChange} onChange={handleInputChange}
value={inputs.EmailDomainWhitelist} value={inputs.EmailDomainWhitelist}
autoComplete='new-password' autoComplete="new-password"
options={EmailDomainWhitelist} options={EmailDomainWhitelist}
/> />
<Form.Input <Form.Input
label='添加新的允许的邮箱域名' label="添加新的允许的邮箱域名"
action={ action={
<Button type='button' onClick={() => { <Button type="button" onClick={() => {
submitNewRestrictedDomain(); submitNewRestrictedDomain();
}}>填入</Button> }}>填入</Button>
} }
@ -502,8 +502,8 @@ const SystemSetting = () => {
submitNewRestrictedDomain(); submitNewRestrictedDomain();
} }
}} }}
autoComplete='new-password' autoComplete="new-password"
placeholder='输入新的允许的邮箱域名' placeholder="输入新的允许的邮箱域名"
value={restrictedDomainInput} value={restrictedDomainInput}
onChange={(e, { value }) => { onChange={(e, { value }) => {
setRestrictedDomainInput(value); setRestrictedDomainInput(value);
@ -512,62 +512,62 @@ const SystemSetting = () => {
</Form.Group> </Form.Group>
<Form.Button onClick={submitEmailDomainWhitelist}>保存邮箱域名白名单设置</Form.Button> <Form.Button onClick={submitEmailDomainWhitelist}>保存邮箱域名白名单设置</Form.Button>
<Divider /> <Divider />
<Header as='h3'> <Header as="h3">
配置 SMTP 配置 SMTP
<Header.Subheader>用以支持系统的邮件发送</Header.Subheader> <Header.Subheader>用以支持系统的邮件发送</Header.Subheader>
</Header> </Header>
<Form.Group widths={3}> <Form.Group widths={3}>
<Form.Input <Form.Input
label='SMTP 服务器地址' label="SMTP 服务器地址"
name='SMTPServer' name="SMTPServer"
onChange={handleInputChange} onChange={handleInputChange}
autoComplete='new-password' autoComplete="new-password"
value={inputs.SMTPServer} value={inputs.SMTPServer}
placeholder='例如：smtp.qq.com' placeholder="例如：smtp.qq.com"
/> />
<Form.Input <Form.Input
label='SMTP 端口' label="SMTP 端口"
name='SMTPPort' name="SMTPPort"
onChange={handleInputChange} onChange={handleInputChange}
autoComplete='new-password' autoComplete="new-password"
value={inputs.SMTPPort} value={inputs.SMTPPort}
placeholder='默认: 587' placeholder="默认: 587"
/> />
<Form.Input <Form.Input
label='SMTP 账户' label="SMTP 账户"
name='SMTPAccount' name="SMTPAccount"
onChange={handleInputChange} onChange={handleInputChange}
autoComplete='new-password' autoComplete="new-password"
value={inputs.SMTPAccount} value={inputs.SMTPAccount}
placeholder='通常是邮箱地址' placeholder="通常是邮箱地址"
/> />
</Form.Group> </Form.Group>
<Form.Group widths={3}> <Form.Group widths={3}>
<Form.Input <Form.Input
label='SMTP 发送者邮箱' label="SMTP 发送者邮箱"
name='SMTPFrom' name="SMTPFrom"
onChange={handleInputChange} onChange={handleInputChange}
autoComplete='new-password' autoComplete="new-password"
value={inputs.SMTPFrom} value={inputs.SMTPFrom}
placeholder='通常和邮箱地址保持一致' placeholder="通常和邮箱地址保持一致"
/> />
<Form.Input <Form.Input
label='SMTP 访问凭证' label="SMTP 访问凭证"
name='SMTPToken' name="SMTPToken"
onChange={handleInputChange} onChange={handleInputChange}
type='password' type="password"
autoComplete='new-password' autoComplete="new-password"
checked={inputs.RegisterEnabled === 'true'} checked={inputs.RegisterEnabled === 'true'}
placeholder='敏感信息不会发送到前端显示' placeholder="敏感信息不会发送到前端显示"
/> />
</Form.Group> </Form.Group>
<Form.Button onClick={submitSMTP}>保存 SMTP 设置</Form.Button> <Form.Button onClick={submitSMTP}>保存 SMTP 设置</Form.Button>
<Divider /> <Divider />
<Header as='h3'> <Header as="h3">
配置 GitHub OAuth App 配置 GitHub OAuth App
<Header.Subheader> <Header.Subheader>
用以支持通过 GitHub 进行登录注册， 用以支持通过 GitHub 进行登录注册，
<a href='https://github.com/settings/developers' target='_blank'> <a href="https://github.com/settings/developers" target="_blank" rel="noreferrer">
点击此处 点击此处
</a> </a>
管理你的 GitHub OAuth App 管理你的 GitHub OAuth App
@ -580,21 +580,21 @@ const SystemSetting = () => {
</Message> </Message>
<Form.Group widths={3}> <Form.Group widths={3}>
<Form.Input <Form.Input
label='GitHub Client ID' label="GitHub Client ID"
name='GitHubClientId' name="GitHubClientId"
onChange={handleInputChange} onChange={handleInputChange}
autoComplete='new-password' autoComplete="new-password"
value={inputs.GitHubClientId} value={inputs.GitHubClientId}
placeholder='输入你注册的 GitHub OAuth APP 的 ID' placeholder="输入你注册的 GitHub OAuth APP 的 ID"
/> />
<Form.Input <Form.Input
label='GitHub Client Secret' label="GitHub Client Secret"
name='GitHubClientSecret' name="GitHubClientSecret"
onChange={handleInputChange} onChange={handleInputChange}
type='password' type="password"
autoComplete='new-password' autoComplete="new-password"
value={inputs.GitHubClientSecret} value={inputs.GitHubClientSecret}
placeholder='敏感信息不会发送到前端显示' placeholder="敏感信息不会发送到前端显示"
/> />
</Form.Group> </Form.Group>
<Form.Button onClick={submitGitHubOAuth}> <Form.Button onClick={submitGitHubOAuth}>
@ -605,7 +605,7 @@ const SystemSetting = () => {
配置 LINUX DO Oauth 配置 LINUX DO Oauth
<Header.Subheader> <Header.Subheader>
用以支持通过 LINUX DO 进行登录注册， 用以支持通过 LINUX DO 进行登录注册，
<a href='https://connect.linux.do' target='_blank'> <a href='https://connect.linux.do' target='_blank' rel="noreferrer">
点击此处 点击此处
</a> </a>
管理你的 LINUX DO OAuth 管理你的 LINUX DO OAuth
@ -639,13 +639,13 @@ const SystemSetting = () => {
保存 LINUX DO OAuth 设置 保存 LINUX DO OAuth 设置
</Form.Button> </Form.Button>
<Divider /> <Divider />
<Header as='h3'> <Header as="h3">
配置 WeChat Server 配置 WeChat Server
<Header.Subheader> <Header.Subheader>
用以支持通过微信进行登录注册， 用以支持通过微信进行登录注册，
<a <a
href='https://github.com/songquanpeng/wechat-server' href="https://github.com/songquanpeng/wechat-server"
target='_blank' target="_blank" rel="noreferrer"
> >
点击此处 点击此处
</a> </a>
@ -654,61 +654,61 @@ const SystemSetting = () => {
</Header> </Header>
<Form.Group widths={3}> <Form.Group widths={3}>
<Form.Input <Form.Input
label='WeChat Server 服务器地址' label="WeChat Server 服务器地址"
name='WeChatServerAddress' name="WeChatServerAddress"
placeholder='例如：https://yourdomain.com' placeholder="例如：https://yourdomain.com"
onChange={handleInputChange} onChange={handleInputChange}
autoComplete='new-password' autoComplete="new-password"
value={inputs.WeChatServerAddress} value={inputs.WeChatServerAddress}
/> />
<Form.Input <Form.Input
label='WeChat Server 访问凭证' label="WeChat Server 访问凭证"
name='WeChatServerToken' name="WeChatServerToken"
type='password' type="password"
onChange={handleInputChange} onChange={handleInputChange}
autoComplete='new-password' autoComplete="new-password"
value={inputs.WeChatServerToken} value={inputs.WeChatServerToken}
placeholder='敏感信息不会发送到前端显示' placeholder="敏感信息不会发送到前端显示"
/> />
<Form.Input <Form.Input
label='微信公众号二维码图片链接' label="微信公众号二维码图片链接"
name='WeChatAccountQRCodeImageURL' name="WeChatAccountQRCodeImageURL"
onChange={handleInputChange} onChange={handleInputChange}
autoComplete='new-password' autoComplete="new-password"
value={inputs.WeChatAccountQRCodeImageURL} value={inputs.WeChatAccountQRCodeImageURL}
placeholder='输入一个图片链接' placeholder="输入一个图片链接"
/> />
</Form.Group> </Form.Group>
<Form.Button onClick={submitWeChat}> <Form.Button onClick={submitWeChat}>
保存 WeChat Server 设置 保存 WeChat Server 设置
</Form.Button> </Form.Button>
<Divider /> <Divider />
<Header as='h3'>配置 Telegram 登录</Header> <Header as="h3">配置 Telegram 登录</Header>
<Form.Group inline> <Form.Group inline>
<Form.Input <Form.Input
label='Telegram Bot Token' label="Telegram Bot Token"
name='TelegramBotToken' name="TelegramBotToken"
onChange={handleInputChange} onChange={handleInputChange}
value={inputs.TelegramBotToken} value={inputs.TelegramBotToken}
placeholder='输入你的 Telegram Bot Token' placeholder="输入你的 Telegram Bot Token"
/> />
<Form.Input <Form.Input
label='Telegram Bot 名称' label="Telegram Bot 名称"
name='TelegramBotName' name="TelegramBotName"
onChange={handleInputChange} onChange={handleInputChange}
value={inputs.TelegramBotName} value={inputs.TelegramBotName}
placeholder='输入你的 Telegram Bot 名称' placeholder="输入你的 Telegram Bot 名称"
/> />
</Form.Group> </Form.Group>
<Form.Button onClick={submitTelegramSettings}> <Form.Button onClick={submitTelegramSettings}>
保存 Telegram 登录设置 保存 Telegram 登录设置
</Form.Button> </Form.Button>
<Divider /> <Divider />
<Header as='h3'> <Header as="h3">
配置 Turnstile 配置 Turnstile
<Header.Subheader> <Header.Subheader>
用以支持用户校验， 用以支持用户校验，
<a href='https://dash.cloudflare.com/' target='_blank'> <a href="https://dash.cloudflare.com/" target="_blank" rel="noreferrer">
点击此处 点击此处
</a> </a>
管理你的 Turnstile Sites，推荐选择 Invisible Widget Type 管理你的 Turnstile Sites，推荐选择 Invisible Widget Type
@ -716,21 +716,21 @@ const SystemSetting = () => {
</Header> </Header>
<Form.Group widths={3}> <Form.Group widths={3}>
<Form.Input <Form.Input
label='Turnstile Site Key' label="Turnstile Site Key"
name='TurnstileSiteKey' name="TurnstileSiteKey"
onChange={handleInputChange} onChange={handleInputChange}
autoComplete='new-password' autoComplete="new-password"
value={inputs.TurnstileSiteKey} value={inputs.TurnstileSiteKey}
placeholder='输入你注册的 Turnstile Site Key' placeholder="输入你注册的 Turnstile Site Key"
/> />
<Form.Input <Form.Input
label='Turnstile Secret Key' label="Turnstile Secret Key"
name='TurnstileSecretKey' name="TurnstileSecretKey"
onChange={handleInputChange} onChange={handleInputChange}
type='password' type="password"
autoComplete='new-password' autoComplete="new-password"
value={inputs.TurnstileSecretKey} value={inputs.TurnstileSecretKey}
placeholder='敏感信息不会发送到前端显示' placeholder="敏感信息不会发送到前端显示"
/> />
</Form.Group> </Form.Group>
<Form.Button onClick={submitTurnstile}> <Form.Button onClick={submitTurnstile}>

176
web/src/components/TokensTable.js
View File

@ -1,34 +1,22 @@
import React, { useEffect, useState } from 'react'; import React, { useEffect, useState } from 'react';
import {API, copy, isAdmin, showError, showSuccess, showWarning, timestamp2string} from '../helpers'; import { API, copy, showError, showSuccess, timestamp2string } from '../helpers';
import { ITEMS_PER_PAGE } from '../constants'; import { ITEMS_PER_PAGE } from '../constants';
import {renderQuota, stringToColor} from '../helpers/render'; import { renderQuota } from '../helpers/render';
import { import { Button, Dropdown, Form, Modal, Popconfirm, Popover, SplitButtonGroup, Table, Tag } from '@douyinfe/semi-ui';
Avatar,
Tag, import { IconTreeTriangleDown } from '@douyinfe/semi-icons';
Table, import EditToken from '../pages/Token/EditToken';
Button,
Popover,
Form,
Modal,
Popconfirm,
SplitButtonGroup,
Dropdown
} from "@douyinfe/semi-ui";
import {
IconTreeTriangleDown,
} from '@douyinfe/semi-icons';
import EditToken from "../pages/Token/EditToken";
const COPY_OPTIONS = [ const COPY_OPTIONS = [
{ key: 'next', text: 'ChatGPT Next Web', value: 'next' }, { key: 'next', text: 'ChatGPT Next Web', value: 'next' },
{ key: 'ama', text: 'ChatGPT Web & Midjourney', value: 'ama' }, { key: 'ama', text: 'ChatGPT Web & Midjourney', value: 'ama' },
{key: 'opencat', text: 'OpenCat', value: 'opencat'}, { key: 'opencat', text: 'OpenCat', value: 'opencat' }
]; ];
const OPEN_LINK_OPTIONS = [ const OPEN_LINK_OPTIONS = [
{ key: 'ama', text: 'ChatGPT Web & Midjourney', value: 'ama' }, { key: 'ama', text: 'ChatGPT Web & Midjourney', value: 'ama' },
{key: 'opencat', text: 'OpenCat', value: 'opencat'}, { key: 'opencat', text: 'OpenCat', value: 'opencat' }
]; ];
function renderTimestamp(timestamp) { function renderTimestamp(timestamp) {
@ -43,34 +31,42 @@ function renderStatus(status, model_limits_enabled = false) {
switch (status) { switch (status) {
case 1: case 1:
if (model_limits_enabled) { if (model_limits_enabled) {
return <Tag color='green' size='large'>已启用：限制模型</Tag>; return <Tag color="green" size="large">已启用：限制模型</Tag>;
} else { } else {
return <Tag color='green' size='large'>已启用</Tag>; return <Tag color="green" size="large">已启用</Tag>;
} }
case 2: case 2:
return <Tag color='red' size='large'> 已禁用 </Tag>; return <Tag color="red" size="large"> 已禁用 </Tag>;
case 3: case 3:
return <Tag color='yellow' size='large'> 已过期 </Tag>; return <Tag color="yellow" size="large"> 已过期 </Tag>;
case 4: case 4:
return <Tag color='grey' size='large'> 已耗尽 </Tag>; return <Tag color="grey" size="large"> 已耗尽 </Tag>;
default: default:
return <Tag color='black' size='large'> 未知状态 </Tag>; return <Tag color="black" size="large"> 未知状态 </Tag>;
} }
} }
const TokensTable = () => { const TokensTable = () => {
const link_menu = [ const link_menu = [
{node: 'item', key: 'next', name: 'ChatGPT Next Web', onClick: () => {onOpenLink('next')}}, {
node: 'item', key: 'next', name: 'ChatGPT Next Web', onClick: () => {
onOpenLink('next');
}
},
{ node: 'item', key: 'ama', name: 'AMA 问天', value: 'ama' }, { node: 'item', key: 'ama', name: 'AMA 问天', value: 'ama' },
{node: 'item', key: 'next-mj', name: 'ChatGPT Web & Midjourney', value: 'next-mj', onClick: () => {onOpenLink('next-mj')}}, {
{node: 'item', key: 'opencat', name: 'OpenCat', value: 'opencat'}, node: 'item', key: 'next-mj', name: 'ChatGPT Web & Midjourney', value: 'next-mj', onClick: () => {
onOpenLink('next-mj');
}
},
{ node: 'item', key: 'opencat', name: 'OpenCat', value: 'opencat' }
]; ];
const columns = [ const columns = [
{ {
title: '名称', title: '名称',
dataIndex: 'name', dataIndex: 'name'
}, },
{ {
title: '状态', title: '状态',
@ -82,7 +78,7 @@ const TokensTable = () => {
{renderStatus(text, record.model_limits_enabled)} {renderStatus(text, record.model_limits_enabled)}
</div> </div>
); );
}, }
}, },
{ {
title: '已用额度', title: '已用额度',
@ -93,7 +89,7 @@ const TokensTable = () => {
{renderQuota(parseInt(text))} {renderQuota(parseInt(text))}
</div> </div>
); );
}, }
}, },
{ {
title: '剩余额度', title: '剩余额度',
@ -101,10 +97,11 @@ const TokensTable = () => {
render: (text, record, index) => { render: (text, record, index) => {
return ( return (
<div> <div>
{record.unlimited_quota ? <Tag size={'large'} color={'white'}>无限制</Tag> : <Tag size={'large'} color={'light-blue'}>{renderQuota(parseInt(text))}</Tag>} {record.unlimited_quota ? <Tag size={'large'} color={'white'}>无限制</Tag> :
<Tag size={'large'} color={'light-blue'}>{renderQuota(parseInt(text))}</Tag>}
</div> </div>
); );
}, }
}, },
{ {
title: '创建时间', title: '创建时间',
@ -115,7 +112,7 @@ const TokensTable = () => {
{renderTimestamp(text)} {renderTimestamp(text)}
</div> </div>
); );
}, }
}, },
{ {
title: '过期时间', title: '过期时间',
@ -123,10 +120,10 @@ const TokensTable = () => {
render: (text, record, index) => { render: (text, record, index) => {
return ( return (
<div> <div>
{record.expired_time === -1 ? "永不过期" : renderTimestamp(text)} {record.expired_time === -1 ? '永不过期' : renderTimestamp(text)}
</div> </div>
); );
}, }
}, },
{ {
title: '', title: '',
@ -140,25 +137,52 @@ const TokensTable = () => {
style={{ padding: 20 }} style={{ padding: 20 }}
position="top" position="top"
> >
<Button theme='light' type='tertiary' style={{marginRight: 1}}>查看</Button> <Button theme="light" type="tertiary" style={{ marginRight: 1 }}>查看</Button>
</Popover> </Popover>
<Button theme='light' type='secondary' style={{marginRight: 1}} <Button theme="light" type="secondary" style={{ marginRight: 1 }}
onClick={async (text) => { onClick={async (text) => {
await copyText('sk-' + record.key) await copyText('sk-' + record.key);
}} }}
>复制</Button> >复制</Button>
<SplitButtonGroup style={{ marginRight: 1 }} aria-label="项目操作按钮组"> <SplitButtonGroup style={{ marginRight: 1 }} aria-label="项目操作按钮组">
<Button theme="light" style={{ color: 'rgba(var(--semi-teal-7), 1)' }} onClick={()=>{onOpenLink('next', record.key)}}>聊天</Button> <Button theme="light" style={{ color: 'rgba(var(--semi-teal-7), 1)' }} onClick={() => {
onOpenLink('next', record.key);
}}>聊天</Button>
<Dropdown trigger="click" position="bottomRight" menu={ <Dropdown trigger="click" position="bottomRight" menu={
[ [
{node: 'item', key: 'next', disabled: !localStorage.getItem('chat_link'), name: 'ChatGPT Next Web', onClick: () => {onOpenLink('next', record.key)}}, {
{node: 'item', key: 'next-mj', disabled: !localStorage.getItem('chat_link2'), name: 'ChatGPT Web & Midjourney', onClick: () => {onOpenLink('next-mj', record.key)}}, node: 'item',
{node: 'item', key: 'ama', name: 'AMA 问天（BotGem）', onClick: () => {onOpenLink('ama', record.key)}}, key: 'next',
{node: 'item', key: 'opencat', name: 'OpenCat', onClick: () => {onOpenLink('opencat', record.key)}}, disabled: !localStorage.getItem('chat_link'),
name: 'ChatGPT Next Web',
onClick: () => {
onOpenLink('next', record.key);
}
},
{
node: 'item',
key: 'next-mj',
disabled: !localStorage.getItem('chat_link2'),
name: 'ChatGPT Web & Midjourney',
onClick: () => {
onOpenLink('next-mj', record.key);
}
},
{
node: 'item', key: 'ama', name: 'AMA 问天（BotGem）', onClick: () => {
onOpenLink('ama', record.key);
}
},
{
node: 'item', key: 'opencat', name: 'OpenCat', onClick: () => {
onOpenLink('opencat', record.key);
}
}
] ]
} }
> >
<Button style={ { padding: '8px 4px', color: 'rgba(var(--semi-teal-7), 1)' }} type="primary" icon={<IconTreeTriangleDown />}></Button> <Button style={{ padding: '8px 4px', color: 'rgba(var(--semi-teal-7), 1)' }} type="primary"
icon={<IconTreeTriangleDown />}></Button>
</Dropdown> </Dropdown>
</SplitButtonGroup> </SplitButtonGroup>
<Popconfirm <Popconfirm
@ -171,23 +195,23 @@ const TokensTable = () => {
() => { () => {
removeRecord(record.key); removeRecord(record.key);
} }
) );
}} }}
> >
<Button theme='light' type='danger' style={{marginRight: 1}}>删除</Button> <Button theme="light" type="danger" style={{ marginRight: 1 }}>删除</Button>
</Popconfirm> </Popconfirm>
{ {
record.status === 1 ? record.status === 1 ?
<Button theme='light' type='warning' style={{marginRight: 1}} onClick={ <Button theme="light" type="warning" style={{ marginRight: 1 }} onClick={
async () => { async () => {
manageToken( manageToken(
record.id, record.id,
'disable', 'disable',
record record
) );
} }
}>禁用</Button> : }>禁用</Button> :
<Button theme='light' type='secondary' style={{marginRight: 1}} onClick={ <Button theme="light" type="secondary" style={{ marginRight: 1 }} onClick={
async () => { async () => {
manageToken( manageToken(
record.id, record.id,
@ -197,15 +221,15 @@ const TokensTable = () => {
} }
}>启用</Button> }>启用</Button>
} }
<Button theme='light' type='tertiary' style={{marginRight: 1}} onClick={ <Button theme="light" type="tertiary" style={{ marginRight: 1 }} onClick={
() => { () => {
setEditingToken(record); setEditingToken(record);
setShowEdit(true); setShowEdit(true);
} }
}>编辑</Button> }>编辑</Button>
</div> </div>
), )
}, }
]; ];
const [pageSize, setPageSize] = useState(ITEMS_PER_PAGE); const [pageSize, setPageSize] = useState(ITEMS_PER_PAGE);
@ -221,17 +245,17 @@ const TokensTable = () => {
const [showTopUpModal, setShowTopUpModal] = useState(false); const [showTopUpModal, setShowTopUpModal] = useState(false);
const [targetTokenIdx, setTargetTokenIdx] = useState(0); const [targetTokenIdx, setTargetTokenIdx] = useState(0);
const [editingToken, setEditingToken] = useState({ const [editingToken, setEditingToken] = useState({
id: undefined, id: undefined
}); });
const closeEdit = () => { const closeEdit = () => {
setShowEdit(false); setShowEdit(false);
setTimeout(() => { setTimeout(() => {
setEditingToken({ setEditingToken({
id: undefined, id: undefined
}); });
}, 500); }, 500);
} };
const setTokensFormat = (tokens) => { const setTokensFormat = (tokens) => {
setTokens(tokens); setTokens(tokens);
@ -240,7 +264,7 @@ const TokensTable = () => {
} else { } else {
setTokenCount(tokens.length); setTokenCount(tokens.length);
} }
} };
let pageData = tokens.slice((activePage - 1) * pageSize, activePage * pageSize); let pageData = tokens.slice((activePage - 1) * pageSize, activePage * pageSize);
const loadTokens = async (startIdx) => { const loadTokens = async (startIdx) => {
@ -325,7 +349,7 @@ const TokensTable = () => {
// setSearchKeyword(text); // setSearchKeyword(text);
Modal.error({ title: '无法复制到剪贴板，请手动复制', content: text }); Modal.error({ title: '无法复制到剪贴板，请手动复制', content: text });
} }
} };
const onOpenLink = async (type, key) => { const onOpenLink = async (type, key) => {
let status = localStorage.getItem('status'); let status = localStorage.getItem('status');
@ -358,14 +382,14 @@ const TokensTable = () => {
break; break;
default: default:
if (!chatLink) { if (!chatLink) {
showError('管理员未设置聊天链接') showError('管理员未设置聊天链接');
return; return;
} }
url = defaultUrl; url = defaultUrl;
} }
window.open(url, '_blank'); window.open(url, '_blank');
} };
useEffect(() => { useEffect(() => {
loadTokens(0) loadTokens(0)
@ -481,15 +505,15 @@ const TokensTable = () => {
}, },
onChange: (selectedRowKeys, selectedRows) => { onChange: (selectedRowKeys, selectedRows) => {
setSelectedKeys(selectedRows); setSelectedKeys(selectedRows);
}, }
}; };
const handleRow = (record, index) => { const handleRow = (record, index) => {
if (record.status !== 1) { if (record.status !== 1) {
return { return {
style: { style: {
background: 'var(--semi-color-disabled-border)', background: 'var(--semi-color-disabled-border)'
}, }
}; };
} else { } else {
return {}; return {};
@ -499,24 +523,24 @@ const TokensTable = () => {
return ( return (
<> <>
<EditToken refresh={refresh} editingToken={editingToken} visiable={showEdit} handleClose={closeEdit}></EditToken> <EditToken refresh={refresh} editingToken={editingToken} visiable={showEdit} handleClose={closeEdit}></EditToken>
<Form layout='horizontal' style={{marginTop: 10}} labelPosition={'left'}> <Form layout="horizontal" style={{ marginTop: 10 }} labelPosition={'left'}>
<Form.Input <Form.Input
field="keyword" field="keyword"
label='搜索关键字' label="搜索关键字"
placeholder='令牌名称' placeholder="令牌名称"
value={searchKeyword} value={searchKeyword}
loading={searching} loading={searching}
onChange={handleKeywordChange} onChange={handleKeywordChange}
/> />
<Form.Input <Form.Input
field="token" field="token"
label='Key' label="Key"
placeholder='密钥' placeholder="密钥"
value={searchToken} value={searchToken}
loading={searching} loading={searching}
onChange={handleSearchTokenChange} onChange={handleSearchTokenChange}
/> />
<Button label='查询' type="primary" htmlType="submit" className="btn-margin-right" <Button label="查询" type="primary" htmlType="submit" className="btn-margin-right"
onClick={searchTokens} style={{ marginRight: 8 }}>查询</Button> onClick={searchTokens} style={{ marginRight: 8 }}>查询</Button>
</Form> </Form>
@ -531,26 +555,26 @@ const TokensTable = () => {
setPageSize(size); setPageSize(size);
setActivePage(1); setActivePage(1);
}, },
onPageChange: handlePageChange, onPageChange: handlePageChange
}} loading={loading} rowSelection={rowSelection} onRow={handleRow}> }} loading={loading} rowSelection={rowSelection} onRow={handleRow}>
</Table> </Table>
<Button theme='light' type='primary' style={{marginRight: 8}} onClick={ <Button theme="light" type="primary" style={{ marginRight: 8 }} onClick={
() => { () => {
setEditingToken({ setEditingToken({
id: undefined, id: undefined
}); });
setShowEdit(true); setShowEdit(true);
} }
}>添加令牌</Button> }>添加令牌</Button>
<Button label='复制所选令牌' type="warning" onClick={ <Button label="复制所选令牌" type="warning" onClick={
async () => { async () => {
if (selectedKeys.length === 0) { if (selectedKeys.length === 0) {
showError('请至少选择一个令牌！'); showError('请至少选择一个令牌！');
return; return;
} }
let keys = ""; let keys = '';
for (let i = 0; i < selectedKeys.length; i++) { for (let i = 0; i < selectedKeys.length; i++) {
keys += selectedKeys[i].name + " sk-" + selectedKeys[i].key + "\n"; keys += selectedKeys[i].name + ' sk-' + selectedKeys[i].key + '\n';
} }
await copyText(keys); await copyText(keys);
} }

101
web/src/components/UsersTable.js
View File

@ -1,47 +1,47 @@
import React, { useEffect, useState } from 'react'; import React, { useEffect, useState } from 'react';
import {API, isAdmin, showError, showSuccess} from '../helpers'; import { API, showError, showSuccess } from '../helpers';
import {Button, Modal, Popconfirm, Popover, Table, Tag, Form, Tooltip, Space} from "@douyinfe/semi-ui"; import { Button, Form, Popconfirm, Space, Table, Tag, Tooltip } from '@douyinfe/semi-ui';
import { ITEMS_PER_PAGE } from '../constants'; import { ITEMS_PER_PAGE } from '../constants';
import {renderGroup, renderNumber, renderQuota, renderText, stringToColor} from '../helpers/render'; import { renderGroup, renderNumber, renderQuota } from '../helpers/render';
import AddUser from "../pages/User/AddUser"; import AddUser from '../pages/User/AddUser';
import EditUser from "../pages/User/EditUser"; import EditUser from '../pages/User/EditUser';
function renderRole(role) { function renderRole(role) {
switch (role) { switch (role) {
case 1: case 1:
return <Tag size='large'>普通用户</Tag>; return <Tag size="large">普通用户</Tag>;
case 10: case 10:
return <Tag color='yellow' size='large'>管理员</Tag>; return <Tag color="yellow" size="large">管理员</Tag>;
case 100: case 100:
return <Tag color='orange' size='large'>超级管理员</Tag>; return <Tag color="orange" size="large">超级管理员</Tag>;
default: default:
return <Tag color='red' size='large'>未知身份</Tag>; return <Tag color="red" size="large">未知身份</Tag>;
} }
} }
const UsersTable = () => { const UsersTable = () => {
const columns = [{ const columns = [{
title: 'ID', dataIndex: 'id', title: 'ID', dataIndex: 'id'
}, { }, {
title: '用户名', dataIndex: 'username', title: '用户名', dataIndex: 'username'
}, { }, {
title: '分组', dataIndex: 'group', render: (text, record, index) => { title: '分组', dataIndex: 'group', render: (text, record, index) => {
return (<div> return (<div>
{renderGroup(text)} {renderGroup(text)}
</div>); </div>);
}, }
}, { }, {
title: '统计信息', dataIndex: 'info', render: (text, record, index) => { title: '统计信息', dataIndex: 'info', render: (text, record, index) => {
return (<div> return (<div>
<Space spacing={1}> <Space spacing={1}>
<Tooltip content={'剩余额度'}> <Tooltip content={'剩余额度'}>
<Tag color='white' size='large'>{renderQuota(record.quota)}</Tag> <Tag color="white" size="large">{renderQuota(record.quota)}</Tag>
</Tooltip> </Tooltip>
<Tooltip content={'已用额度'}> <Tooltip content={'已用额度'}>
<Tag color='white' size='large'>{renderQuota(record.used_quota)}</Tag> <Tag color="white" size="large">{renderQuota(record.used_quota)}</Tag>
</Tooltip> </Tooltip>
<Tooltip content={'调用次数'}> <Tooltip content={'调用次数'}>
<Tag color='white' size='large'>{renderNumber(record.request_count)}</Tag> <Tag color="white" size="large">{renderNumber(record.request_count)}</Tag>
</Tooltip> </Tooltip>
</Space> </Space>
</div>); </div>);
@ -51,14 +51,14 @@ const UsersTable = () => {
return (<div> return (<div>
<Space spacing={1}> <Space spacing={1}>
<Tooltip content={'邀请人数'}> <Tooltip content={'邀请人数'}>
<Tag color='white' size='large'>{renderNumber(record.aff_count)}</Tag> <Tag color="white" size="large">{renderNumber(record.aff_count)}</Tag>
</Tooltip> </Tooltip>
<Tooltip content={'邀请总收益'}> <Tooltip content={'邀请总收益'}>
<Tag color='white' size='large'>{renderQuota(record.aff_history_quota)}</Tag> <Tag color="white" size="large">{renderQuota(record.aff_history_quota)}</Tag>
</Tooltip> </Tooltip>
<Tooltip content={'邀请人ID'}> <Tooltip content={'邀请人ID'}>
{record.inviter_id === 0 ? <Tag color='white' size='large'>无</Tag> : {record.inviter_id === 0 ? <Tag color="white" size="large">无</Tag> :
<Tag color='white' size='large'>{record.inviter_id}</Tag>} <Tag color="white" size="large">{record.inviter_id}</Tag>}
</Tooltip> </Tooltip>
</Space> </Space>
</div>); </div>);
@ -68,13 +68,13 @@ const UsersTable = () => {
return (<div> return (<div>
{renderRole(text)} {renderRole(text)}
</div>); </div>);
}, }
}, { }, {
title: '状态', dataIndex: 'status', render: (text, record, index) => { title: '状态', dataIndex: 'status', render: (text, record, index) => {
return (<div> return (<div>
{record.DeletedAt !== null? <Tag color='red'>已注销</Tag> : renderStatus(text)} {record.DeletedAt !== null ? <Tag color="red">已注销</Tag> : renderStatus(text)}
</div>); </div>);
}, }
}, { }, {
title: '', dataIndex: 'operate', render: (text, record, index) => (<div> title: '', dataIndex: 'operate', render: (text, record, index) => (<div>
{ {
@ -84,28 +84,28 @@ const UsersTable = () => {
title="确定？" title="确定？"
okType={'warning'} okType={'warning'}
onConfirm={() => { onConfirm={() => {
manageUser(record.username, 'promote', record) manageUser(record.username, 'promote', record);
}} }}
> >
<Button theme='light' type='warning' style={{marginRight: 1}}>提升</Button> <Button theme="light" type="warning" style={{ marginRight: 1 }}>提升</Button>
</Popconfirm> </Popconfirm>
<Popconfirm <Popconfirm
title="确定？" title="确定？"
okType={'warning'} okType={'warning'}
onConfirm={() => { onConfirm={() => {
manageUser(record.username, 'demote', record) manageUser(record.username, 'demote', record);
}} }}
> >
<Button theme='light' type='secondary' style={{marginRight: 1}}>降级</Button> <Button theme="light" type="secondary" style={{ marginRight: 1 }}>降级</Button>
</Popconfirm> </Popconfirm>
{record.status === 1 ? {record.status === 1 ?
<Button theme='light' type='warning' style={{marginRight: 1}} onClick={async () => { <Button theme="light" type="warning" style={{ marginRight: 1 }} onClick={async () => {
manageUser(record.username, 'disable', record) manageUser(record.username, 'disable', record);
}}>禁用</Button> : }}>禁用</Button> :
<Button theme='light' type='secondary' style={{marginRight: 1}} onClick={async () => { <Button theme="light" type="secondary" style={{ marginRight: 1 }} onClick={async () => {
manageUser(record.username, 'enable', record); manageUser(record.username, 'enable', record);
}} disabled={record.status === 3}>启用</Button>} }} disabled={record.status === 3}>启用</Button>}
<Button theme='light' type='tertiary' style={{marginRight: 1}} onClick={() => { <Button theme="light" type="tertiary" style={{ marginRight: 1 }} onClick={() => {
setEditingUser(record); setEditingUser(record);
setShowEditUser(true); setShowEditUser(true);
}}>编辑</Button> }}>编辑</Button>
@ -120,13 +120,13 @@ const UsersTable = () => {
onConfirm={() => { onConfirm={() => {
manageUser(record.username, 'delete', record).then(() => { manageUser(record.username, 'delete', record).then(() => {
removeRecord(record.id); removeRecord(record.id);
}) });
}} }}
> >
<Button theme='light' type='danger' style={{marginRight: 1}}>删除</Button> <Button theme="light" type="danger" style={{ marginRight: 1 }}>删除</Button>
</Popconfirm> </Popconfirm>
</div>), </div>)
},]; }];
const [users, setUsers] = useState([]); const [users, setUsers] = useState([]);
const [loading, setLoading] = useState(true); const [loading, setLoading] = useState(true);
@ -137,7 +137,7 @@ const UsersTable = () => {
const [showAddUser, setShowAddUser] = useState(false); const [showAddUser, setShowAddUser] = useState(false);
const [showEditUser, setShowEditUser] = useState(false); const [showEditUser, setShowEditUser] = useState(false);
const [editingUser, setEditingUser] = useState({ const [editingUser, setEditingUser] = useState({
id: undefined, id: undefined
}); });
const setCount = (data) => { const setCount = (data) => {
@ -146,7 +146,7 @@ const UsersTable = () => {
} else { } else {
setUserCount(data.length); setUserCount(data.length);
} }
} };
const removeRecord = key => { const removeRecord = key => {
console.log(key); console.log(key);
@ -222,13 +222,13 @@ const UsersTable = () => {
const renderStatus = (status) => { const renderStatus = (status) => {
switch (status) { switch (status) {
case 1: case 1:
return <Tag size='large'>已激活</Tag>; return <Tag size="large">已激活</Tag>;
case 2: case 2:
return (<Tag size='large' color='red'> return (<Tag size="large" color="red">
已封禁 已封禁
</Tag>); </Tag>);
default: default:
return (<Tag size='large' color='grey'> return (<Tag size="large" color="grey">
未知状态 未知状态
</Tag>); </Tag>);
} }
@ -284,14 +284,14 @@ const UsersTable = () => {
const closeAddUser = () => { const closeAddUser = () => {
setShowAddUser(false); setShowAddUser(false);
} };
const closeEditUser = () => { const closeEditUser = () => {
setShowEditUser(false); setShowEditUser(false);
setEditingUser({ setEditingUser({
id: undefined, id: undefined
}); });
} };
const refresh = async () => { const refresh = async () => {
if (searchKeyword === '') { if (searchKeyword === '') {
@ -304,14 +304,15 @@ const UsersTable = () => {
return ( return (
<> <>
<AddUser refresh={refresh} visible={showAddUser} handleClose={closeAddUser}></AddUser> <AddUser refresh={refresh} visible={showAddUser} handleClose={closeAddUser}></AddUser>
<EditUser refresh={refresh} visible={showEditUser} handleClose={closeEditUser} editingUser={editingUser}></EditUser> <EditUser refresh={refresh} visible={showEditUser} handleClose={closeEditUser}
editingUser={editingUser}></EditUser>
<Form onSubmit={searchUsers}> <Form onSubmit={searchUsers}>
<Form.Input <Form.Input
label='搜索关键字' label="搜索关键字"
icon='search' icon="search"
field='keyword' field="keyword"
iconPosition='left' iconPosition="left"
placeholder='搜索用户的 ID，用户名，显示名称，以及邮箱地址 ...' placeholder="搜索用户的 ID，用户名，显示名称，以及邮箱地址 ..."
value={searchKeyword} value={searchKeyword}
loading={searching} loading={searching}
onChange={value => handleKeywordChange(value)} onChange={value => handleKeywordChange(value)}
@ -323,9 +324,9 @@ const UsersTable = () => {
pageSize: ITEMS_PER_PAGE, pageSize: ITEMS_PER_PAGE,
total: userCount, total: userCount,
pageSizeOpts: [10, 20, 50, 100], pageSizeOpts: [10, 20, 50, 100],
onPageChange: handlePageChange, onPageChange: handlePageChange
}} loading={loading} /> }} loading={loading} />
<Button theme='light' type='primary' style={{marginRight: 8}} onClick={ <Button theme="light" type="primary" style={{ marginRight: 8 }} onClick={
() => { () => {
setShowAddUser(true); setShowAddUser(true);
} }

12
web/src/components/WeChatIcon.js
View File

@ -3,14 +3,14 @@ import { Icon } from '@douyinfe/semi-ui';
const WeChatIcon = () => { const WeChatIcon = () => {
function CustomIcon() { function CustomIcon() {
return <svg t='1709714447384' className='icon' viewBox='0 0 1024 1024' version='1.1' return <svg t="1709714447384" className="icon" viewBox="0 0 1024 1024" version="1.1"
xmlns='http://www.w3.org/2000/svg' p-id='5091' width='16' height='16'> xmlns="http://www.w3.org/2000/svg" p-id="5091" width="16" height="16">
<path <path
d='M690.1 377.4c5.9 0 11.8 0.2 17.6 0.5-24.4-128.7-158.3-227.1-319.9-227.1C209 150.8 64 271.4 64 420.2c0 81.1 43.6 154.2 111.9 203.6 5.5 3.9 9.1 10.3 9.1 17.6 0 2.4-0.5 4.6-1.1 6.9-5.5 20.3-14.2 52.8-14.6 54.3-0.7 2.6-1.7 5.2-1.7 7.9 0 5.9 4.8 10.8 10.8 10.8 2.3 0 4.2-0.9 6.2-2l70.9-40.9c5.3-3.1 11-5 17.2-5 3.2 0 6.4 0.5 9.5 1.4 33.1 9.5 68.8 14.8 105.7 14.8 6 0 11.9-0.1 17.8-0.4-7.1-21-10.9-43.1-10.9-66 0-135.8 132.2-245.8 295.3-245.8z m-194.3-86.5c23.8 0 43.2 19.3 43.2 43.1s-19.3 43.1-43.2 43.1c-23.8 0-43.2-19.3-43.2-43.1s19.4-43.1 43.2-43.1z m-215.9 86.2c-23.8 0-43.2-19.3-43.2-43.1s19.3-43.1 43.2-43.1 43.2 19.3 43.2 43.1-19.4 43.1-43.2 43.1z' d="M690.1 377.4c5.9 0 11.8 0.2 17.6 0.5-24.4-128.7-158.3-227.1-319.9-227.1C209 150.8 64 271.4 64 420.2c0 81.1 43.6 154.2 111.9 203.6 5.5 3.9 9.1 10.3 9.1 17.6 0 2.4-0.5 4.6-1.1 6.9-5.5 20.3-14.2 52.8-14.6 54.3-0.7 2.6-1.7 5.2-1.7 7.9 0 5.9 4.8 10.8 10.8 10.8 2.3 0 4.2-0.9 6.2-2l70.9-40.9c5.3-3.1 11-5 17.2-5 3.2 0 6.4 0.5 9.5 1.4 33.1 9.5 68.8 14.8 105.7 14.8 6 0 11.9-0.1 17.8-0.4-7.1-21-10.9-43.1-10.9-66 0-135.8 132.2-245.8 295.3-245.8z m-194.3-86.5c23.8 0 43.2 19.3 43.2 43.1s-19.3 43.1-43.2 43.1c-23.8 0-43.2-19.3-43.2-43.1s19.4-43.1 43.2-43.1z m-215.9 86.2c-23.8 0-43.2-19.3-43.2-43.1s19.3-43.1 43.2-43.1 43.2 19.3 43.2 43.1-19.4 43.1-43.2 43.1z"
p-id='5092'></path> p-id="5092"></path>
<path <path
d='M866.7 792.7c56.9-41.2 93.2-102 93.2-169.7 0-124-120.8-224.5-269.9-224.5-149 0-269.9 100.5-269.9 224.5S540.9 847.5 690 847.5c30.8 0 60.6-4.4 88.1-12.3 2.6-0.8 5.2-1.2 7.9-1.2 5.2 0 9.9 1.6 14.3 4.1l59.1 34c1.7 1 3.3 1.7 5.2 1.7 2.4 0 4.7-0.9 6.4-2.6 1.7-1.7 2.6-4 2.6-6.4 0-2.2-0.9-4.4-1.4-6.6-0.3-1.2-7.6-28.3-12.2-45.3-0.5-1.9-0.9-3.8-0.9-5.7 0.1-5.9 3.1-11.2 7.6-14.5zM600.2 587.2c-19.9 0-36-16.1-36-35.9 0-19.8 16.1-35.9 36-35.9s36 16.1 36 35.9c0 19.8-16.2 35.9-36 35.9z m179.9 0c-19.9 0-36-16.1-36-35.9 0-19.8 16.1-35.9 36-35.9s36 16.1 36 35.9c-0.1 19.8-16.2 35.9-36 35.9z' d="M866.7 792.7c56.9-41.2 93.2-102 93.2-169.7 0-124-120.8-224.5-269.9-224.5-149 0-269.9 100.5-269.9 224.5S540.9 847.5 690 847.5c30.8 0 60.6-4.4 88.1-12.3 2.6-0.8 5.2-1.2 7.9-1.2 5.2 0 9.9 1.6 14.3 4.1l59.1 34c1.7 1 3.3 1.7 5.2 1.7 2.4 0 4.7-0.9 6.4-2.6 1.7-1.7 2.6-4 2.6-6.4 0-2.2-0.9-4.4-1.4-6.6-0.3-1.2-7.6-28.3-12.2-45.3-0.5-1.9-0.9-3.8-0.9-5.7 0.1-5.9 3.1-11.2 7.6-14.5zM600.2 587.2c-19.9 0-36-16.1-36-35.9 0-19.8 16.1-35.9 36-35.9s36 16.1 36 35.9c0 19.8-16.2 35.9-36 35.9z m179.9 0c-19.9 0-36-16.1-36-35.9 0-19.8 16.1-35.9 36-35.9s36 16.1 36 35.9c-0.1 19.8-16.2 35.9-36 35.9z"
p-id='5093'></path> p-id="5093"></path>
</svg>; </svg>;
} }

44
web/src/pages/Redemption/EditRedemption.js
View File

@ -1,17 +1,17 @@
import React, { useEffect, useState } from 'react'; import React, { useEffect, useState } from 'react';
import { useParams, useNavigate } from 'react-router-dom'; import { useNavigate, useParams } from 'react-router-dom';
import { API, downloadTextAsFile, isMobile, showError, showSuccess } from '../../helpers'; import { API, downloadTextAsFile, isMobile, showError, showSuccess } from '../../helpers';
import { renderQuota, renderQuotaWithPrompt } from '../../helpers/render'; import { renderQuotaWithPrompt } from '../../helpers/render';
import {SideSheet, Space, Spin, Button, Input, Typography, AutoComplete, Modal} from "@douyinfe/semi-ui"; import { AutoComplete, Button, Input, Modal, SideSheet, Space, Spin, Typography } from '@douyinfe/semi-ui';
import Title from "@douyinfe/semi-ui/lib/es/typography/title"; import Title from '@douyinfe/semi-ui/lib/es/typography/title';
import {Divider} from "semantic-ui-react"; import { Divider } from 'semantic-ui-react';
const EditRedemption = (props) => { const EditRedemption = (props) => {
const isEdit = props.editingRedemption.id !== undefined; const isEdit = props.editingRedemption.id !== undefined;
const [loading, setLoading] = useState(isEdit); const [loading, setLoading] = useState(isEdit);
const params = useParams(); const params = useParams();
const navigate = useNavigate() const navigate = useNavigate();
const originInputs = { const originInputs = {
name: '', name: '',
quota: 100000, quota: 100000,
@ -22,7 +22,7 @@ const EditRedemption = (props) => {
const handleCancel = () => { const handleCancel = () => {
props.handleClose(); props.handleClose();
} };
const handleInputChange = (name, value) => { const handleInputChange = (name, value) => {
setInputs((inputs) => ({ ...inputs, [name]: value })); setInputs((inputs) => ({ ...inputs, [name]: value }));
@ -82,9 +82,9 @@ const EditRedemption = (props) => {
showError(message); showError(message);
} }
if (!isEdit && data) { if (!isEdit && data) {
let text = ""; let text = '';
for (let i = 0; i < data.length; i++) { for (let i = 0; i < data.length; i++) {
text += data[i] + "\n"; text += data[i] + '\n';
} }
// downloadTextAsFile(text, `${inputs.name}.txt`); // downloadTextAsFile(text, `${inputs.name}.txt`);
Modal.confirm({ Modal.confirm({
@ -114,8 +114,8 @@ const EditRedemption = (props) => {
footer={ footer={
<div style={{ display: 'flex', justifyContent: 'flex-end' }}> <div style={{ display: 'flex', justifyContent: 'flex-end' }}>
<Space> <Space>
<Button theme='solid' size={'large'} onClick={submit}>提交</Button> <Button theme="solid" size={'large'} onClick={submit}>提交</Button>
<Button theme='solid' size={'large'} type={'tertiary'} onClick={handleCancel}>取消</Button> <Button theme="solid" size={'large'} type={'tertiary'} onClick={handleCancel}>取消</Button>
</Space> </Space>
</div> </div>
} }
@ -126,12 +126,12 @@ const EditRedemption = (props) => {
<Spin spinning={loading}> <Spin spinning={loading}>
<Input <Input
style={{ marginTop: 20 }} style={{ marginTop: 20 }}
label='名称' label="名称"
name='name' name="name"
placeholder={'请输入名称'} placeholder={'请输入名称'}
onChange={value => handleInputChange('name', value)} onChange={value => handleInputChange('name', value)}
value={name} value={name}
autoComplete='new-password' autoComplete="new-password"
required={!isEdit} required={!isEdit}
/> />
<Divider /> <Divider />
@ -140,12 +140,12 @@ const EditRedemption = (props) => {
</div> </div>
<AutoComplete <AutoComplete
style={{ marginTop: 8 }} style={{ marginTop: 8 }}
name='quota' name="quota"
placeholder={'请输入额度'} placeholder={'请输入额度'}
onChange={(value) => handleInputChange('quota', value)} onChange={(value) => handleInputChange('quota', value)}
value={quota} value={quota}
autoComplete='new-password' autoComplete="new-password"
type='number' type="number"
position={'bottom'} position={'bottom'}
data={[ data={[
{ value: 500000, label: '1$' }, { value: 500000, label: '1$' },
@ -153,7 +153,7 @@ const EditRedemption = (props) => {
{ value: 25000000, label: '50$' }, { value: 25000000, label: '50$' },
{ value: 50000000, label: '100$' }, { value: 50000000, label: '100$' },
{ value: 250000000, label: '500$' }, { value: 250000000, label: '500$' },
{value: 500000000, label: '1000$'}, { value: 500000000, label: '1000$' }
]} ]}
/> />
{ {
@ -162,13 +162,13 @@ const EditRedemption = (props) => {
<Typography.Text>生成数量</Typography.Text> <Typography.Text>生成数量</Typography.Text>
<Input <Input
style={{ marginTop: 8 }} style={{ marginTop: 8 }}
label='生成数量' label="生成数量"
name='count' name="count"
placeholder={'请输入生成数量'} placeholder={'请输入生成数量'}
onChange={value => handleInputChange('count', value)} onChange={value => handleInputChange('count', value)}
value={count} value={count}
autoComplete='new-password' autoComplete="new-password"
type='number' type="number"
/> />
</> </>
} }

75
web/src/pages/Token/EditToken.js
View File

@ -1,22 +1,22 @@
import React, {useEffect, useRef, useState} from 'react'; import React, { useEffect, useState } from 'react';
import {useParams, useNavigate} from 'react-router-dom'; import { useNavigate } from 'react-router-dom';
import { API, isMobile, showError, showSuccess, timestamp2string } from '../../helpers'; import { API, isMobile, showError, showSuccess, timestamp2string } from '../../helpers';
import {renderQuota, renderQuotaWithPrompt} from '../../helpers/render'; import { renderQuotaWithPrompt } from '../../helpers/render';
import { import {
Layout, AutoComplete,
SideSheet, Banner,
Button, Button,
Checkbox,
DatePicker,
Input,
Select,
SideSheet,
Space, Space,
Spin, Spin,
Banner, Typography
Input, } from '@douyinfe/semi-ui';
DatePicker, import Title from '@douyinfe/semi-ui/lib/es/typography/title';
AutoComplete, import { Divider } from 'semantic-ui-react';
Typography,
Checkbox, Select
} from "@douyinfe/semi-ui";
import Title from "@douyinfe/semi-ui/lib/es/typography/title";
import {Divider} from "semantic-ui-react";
const EditToken = (props) => { const EditToken = (props) => {
const [isEdit, setIsEdit] = useState(false); const [isEdit, setIsEdit] = useState(false);
@ -27,7 +27,7 @@ const EditToken = (props) => {
expired_time: -1, expired_time: -1,
unlimited_quota: false, unlimited_quota: false,
model_limits_enabled: false, model_limits_enabled: false,
model_limits: [], model_limits: []
}; };
const [inputs, setInputs] = useState(originInputs); const [inputs, setInputs] = useState(originInputs);
const { name, remain_quota, expired_time, unlimited_quota, model_limits_enabled, model_limits } = inputs; const { name, remain_quota, expired_time, unlimited_quota, model_limits_enabled, model_limits } = inputs;
@ -39,7 +39,7 @@ const EditToken = (props) => {
}; };
const handleCancel = () => { const handleCancel = () => {
props.handleClose(); props.handleClose();
} };
const setExpiredTime = (month, day, hour, minute) => { const setExpiredTime = (month, day, hour, minute) => {
let now = new Date(); let now = new Date();
let timestamp = now.getTime() / 1000; let timestamp = now.getTime() / 1000;
@ -71,7 +71,7 @@ const EditToken = (props) => {
} else { } else {
showError(message); showError(message);
} }
} };
const loadToken = async () => { const loadToken = async () => {
setLoading(true); setLoading(true);
@ -200,7 +200,6 @@ const EditToken = (props) => {
}; };
return ( return (
<> <>
<SideSheet <SideSheet
@ -212,8 +211,8 @@ const EditToken = (props) => {
footer={ footer={
<div style={{ display: 'flex', justifyContent: 'flex-end' }}> <div style={{ display: 'flex', justifyContent: 'flex-end' }}>
<Space> <Space>
<Button theme='solid' size={'large'} onClick={submit}>提交</Button> <Button theme="solid" size={'large'} onClick={submit}>提交</Button>
<Button theme='solid' size={'large'} type={'tertiary'} onClick={handleCancel}>取消</Button> <Button theme="solid" size={'large'} type={'tertiary'} onClick={handleCancel}>取消</Button>
</Space> </Space>
</div> </div>
} }
@ -224,23 +223,23 @@ const EditToken = (props) => {
<Spin spinning={loading}> <Spin spinning={loading}>
<Input <Input
style={{ marginTop: 20 }} style={{ marginTop: 20 }}
label='名称' label="名称"
name='name' name="name"
placeholder={'请输入名称'} placeholder={'请输入名称'}
onChange={(value) => handleInputChange('name', value)} onChange={(value) => handleInputChange('name', value)}
value={name} value={name}
autoComplete='new-password' autoComplete="new-password"
required={!isEdit} required={!isEdit}
/> />
<Divider /> <Divider />
<DatePicker <DatePicker
label='过期时间' label="过期时间"
name='expired_time' name="expired_time"
placeholder={'请选择过期时间'} placeholder={'请选择过期时间'}
onChange={(value) => handleInputChange('expired_time', value)} onChange={(value) => handleInputChange('expired_time', value)}
value={expired_time} value={expired_time}
autoComplete='new-password' autoComplete="new-password"
type='dateTime' type="dateTime"
/> />
<div style={{ marginTop: 20 }}> <div style={{ marginTop: 20 }}>
<Space> <Space>
@ -267,12 +266,12 @@ const EditToken = (props) => {
</div> </div>
<AutoComplete <AutoComplete
style={{ marginTop: 8 }} style={{ marginTop: 8 }}
name='remain_quota' name="remain_quota"
placeholder={'请输入额度'} placeholder={'请输入额度'}
onChange={(value) => handleInputChange('remain_quota', value)} onChange={(value) => handleInputChange('remain_quota', value)}
value={remain_quota} value={remain_quota}
autoComplete='new-password' autoComplete="new-password"
type='number' type="number"
// position={'top'} // position={'top'}
data={[ data={[
{ value: 500000, label: '1$' }, { value: 500000, label: '1$' },
@ -280,7 +279,7 @@ const EditToken = (props) => {
{ value: 25000000, label: '50$' }, { value: 25000000, label: '50$' },
{ value: 50000000, label: '100$' }, { value: 50000000, label: '100$' },
{ value: 250000000, label: '500$' }, { value: 250000000, label: '500$' },
{value: 500000000, label: '1000$'}, { value: 500000000, label: '1000$' }
]} ]}
disabled={unlimited_quota} disabled={unlimited_quota}
/> />
@ -292,18 +291,18 @@ const EditToken = (props) => {
</div> </div>
<AutoComplete <AutoComplete
style={{ marginTop: 8 }} style={{ marginTop: 8 }}
label='数量' label="数量"
placeholder={'请选择或输入创建令牌的数量'} placeholder={'请选择或输入创建令牌的数量'}
onChange={(value) => handleTokenCountChange(value)} onChange={(value) => handleTokenCountChange(value)}
onSelect={(value) => handleTokenCountChange(value)} onSelect={(value) => handleTokenCountChange(value)}
value={tokenCount.toString()} value={tokenCount.toString()}
autoComplete='off' autoComplete="off"
type='number' type="number"
data={[ data={[
{ value: 10, label: '10个' }, { value: 10, label: '10个' },
{ value: 20, label: '20个' }, { value: 20, label: '20个' },
{ value: 30, label: '30个' }, { value: 30, label: '30个' },
{ value: 100, label: '100个' }, { value: 100, label: '100个' }
]} ]}
disabled={unlimited_quota} disabled={unlimited_quota}
/> />
@ -319,7 +318,7 @@ const EditToken = (props) => {
<div style={{ marginTop: 10, display: 'flex' }}> <div style={{ marginTop: 10, display: 'flex' }}>
<Space> <Space>
<Checkbox <Checkbox
name='model_limits_enabled' name="model_limits_enabled"
checked={model_limits_enabled} checked={model_limits_enabled}
onChange={(e) => handleInputChange('model_limits_enabled', e.target.checked)} onChange={(e) => handleInputChange('model_limits_enabled', e.target.checked)}
> >
@ -331,7 +330,7 @@ const EditToken = (props) => {
<Select <Select
style={{ marginTop: 8 }} style={{ marginTop: 8 }}
placeholder={'请选择该渠道所支持的模型'} placeholder={'请选择该渠道所支持的模型'}
name='models' name="models"
required required
multiple multiple
selection selection
@ -339,7 +338,7 @@ const EditToken = (props) => {
handleInputChange('model_limits', value); handleInputChange('model_limits', value);
}} }}
value={inputs.model_limits} value={inputs.model_limits}
autoComplete='new-password' autoComplete="new-password"
optionList={models} optionList={models}
disabled={!model_limits_enabled} disabled={!model_limits_enabled}
/> />

12
web/src/pages/User/AddUser.js
View File

@ -1,13 +1,13 @@
import React, { useState } from 'react'; import React, { useState } from 'react';
import { API, isMobile, showError, showSuccess } from '../../helpers'; import { API, isMobile, showError, showSuccess } from '../../helpers';
import Title from "@douyinfe/semi-ui/lib/es/typography/title"; import Title from '@douyinfe/semi-ui/lib/es/typography/title';
import {Button, SideSheet, Space, Input, Spin} from "@douyinfe/semi-ui"; import { Button, Input, SideSheet, Space, Spin } from '@douyinfe/semi-ui';
const AddUser = (props) => { const AddUser = (props) => {
const originInputs = { const originInputs = {
username: '', username: '',
display_name: '', display_name: '',
password: '', password: ''
}; };
const [inputs, setInputs] = useState(originInputs); const [inputs, setInputs] = useState(originInputs);
const [loading, setLoading] = useState(false); const [loading, setLoading] = useState(false);
@ -35,7 +35,7 @@ const AddUser = (props) => {
const handleCancel = () => { const handleCancel = () => {
props.handleClose(); props.handleClose();
} };
return ( return (
<> <>
@ -48,8 +48,8 @@ const AddUser = (props) => {
footer={ footer={
<div style={{ display: 'flex', justifyContent: 'flex-end' }}> <div style={{ display: 'flex', justifyContent: 'flex-end' }}>
<Space> <Space>
<Button theme='solid' size={'large'} onClick={submit}>提交</Button> <Button theme="solid" size={'large'} onClick={submit}>提交</Button>
<Button theme='solid' size={'large'} type={'tertiary'} onClick={handleCancel}>取消</Button> <Button theme="solid" size={'large'} type={'tertiary'} onClick={handleCancel}>取消</Button>
</Space> </Space>
</div> </div>
} }

66
web/src/pages/User/EditUser.js
View File

@ -1,9 +1,9 @@
import React, { useEffect, useState } from 'react'; import React, { useEffect, useState } from 'react';
import { useParams, useNavigate } from 'react-router-dom'; import { useNavigate } from 'react-router-dom';
import { API, isMobile, showError, showSuccess } from '../../helpers'; import { API, isMobile, showError, showSuccess } from '../../helpers';
import { renderQuota, renderQuotaWithPrompt } from '../../helpers/render'; import { renderQuotaWithPrompt } from '../../helpers/render';
import Title from "@douyinfe/semi-ui/lib/es/typography/title"; import Title from '@douyinfe/semi-ui/lib/es/typography/title';
import { SideSheet, Space, Button, Spin, Input, Typography, Select, Divider } from "@douyinfe/semi-ui"; import { Button, Divider, Input, Select, SideSheet, Space, Spin, Typography } from '@douyinfe/semi-ui';
const EditUser = (props) => { const EditUser = (props) => {
const userId = props.editingUser.id; const userId = props.editingUser.id;
@ -30,7 +30,7 @@ const EditUser = (props) => {
let res = await API.get(`/api/group/`); let res = await API.get(`/api/group/`);
setGroupOptions(res.data.data.map((group) => ({ setGroupOptions(res.data.data.map((group) => ({
label: group, label: group,
value: group, value: group
}))); })));
} catch (error) { } catch (error) {
showError(error.message); showError(error.message);
@ -39,7 +39,7 @@ const EditUser = (props) => {
const navigate = useNavigate(); const navigate = useNavigate();
const handleCancel = () => { const handleCancel = () => {
props.handleClose(); props.handleClose();
} };
const loadUser = async () => { const loadUser = async () => {
setLoading(true); setLoading(true);
let res = undefined; let res = undefined;
@ -99,8 +99,8 @@ const EditUser = (props) => {
footer={ footer={
<div style={{ display: 'flex', justifyContent: 'flex-end' }}> <div style={{ display: 'flex', justifyContent: 'flex-end' }}>
<Space> <Space>
<Button theme='solid' size={'large'} onClick={submit}>提交</Button> <Button theme="solid" size={'large'} onClick={submit}>提交</Button>
<Button theme='solid' size={'large'} type={'tertiary'} onClick={handleCancel}>取消</Button> <Button theme="solid" size={'large'} type={'tertiary'} onClick={handleCancel}>取消</Button>
</Space> </Space>
</div> </div>
} }
@ -113,35 +113,35 @@ const EditUser = (props) => {
<Typography.Text>用户名</Typography.Text> <Typography.Text>用户名</Typography.Text>
</div> </div>
<Input <Input
label='用户名' label="用户名"
name='username' name="username"
placeholder={'请输入新的用户名'} placeholder={'请输入新的用户名'}
onChange={value => handleInputChange('username', value)} onChange={value => handleInputChange('username', value)}
value={username} value={username}
autoComplete='new-password' autoComplete="new-password"
/> />
<div style={{ marginTop: 20 }}> <div style={{ marginTop: 20 }}>
<Typography.Text>密码</Typography.Text> <Typography.Text>密码</Typography.Text>
</div> </div>
<Input <Input
label='密码' label="密码"
name='password' name="password"
type={'password'} type={'password'}
placeholder={'请输入新的密码，最短 8 位'} placeholder={'请输入新的密码，最短 8 位'}
onChange={value => handleInputChange('password', value)} onChange={value => handleInputChange('password', value)}
value={password} value={password}
autoComplete='new-password' autoComplete="new-password"
/> />
<div style={{ marginTop: 20 }}> <div style={{ marginTop: 20 }}>
<Typography.Text>显示名称</Typography.Text> <Typography.Text>显示名称</Typography.Text>
</div> </div>
<Input <Input
label='显示名称' label="显示名称"
name='display_name' name="display_name"
placeholder={'请输入新的显示名称'} placeholder={'请输入新的显示名称'}
onChange={value => handleInputChange('display_name', value)} onChange={value => handleInputChange('display_name', value)}
value={display_name} value={display_name}
autoComplete='new-password' autoComplete="new-password"
/> />
{ {
userId && <> userId && <>
@ -150,7 +150,7 @@ const EditUser = (props) => {
</div> </div>
<Select <Select
placeholder={'请选择分组'} placeholder={'请选择分组'}
name='group' name="group"
fluid fluid
search search
selection selection
@ -158,19 +158,19 @@ const EditUser = (props) => {
additionLabel={'请在系统设置页面编辑分组倍率以添加新的分组：'} additionLabel={'请在系统设置页面编辑分组倍率以添加新的分组：'}
onChange={value => handleInputChange('group', value)} onChange={value => handleInputChange('group', value)}
value={inputs.group} value={inputs.group}
autoComplete='new-password' autoComplete="new-password"
optionList={groupOptions} optionList={groupOptions}
/> />
<div style={{ marginTop: 20 }}> <div style={{ marginTop: 20 }}>
<Typography.Text>{`剩余额度${renderQuotaWithPrompt(quota)}`}</Typography.Text> <Typography.Text>{`剩余额度${renderQuotaWithPrompt(quota)}`}</Typography.Text>
</div> </div>
<Input <Input
name='quota' name="quota"
placeholder={'请输入新的剩余额度'} placeholder={'请输入新的剩余额度'}
onChange={value => handleInputChange('quota', value)} onChange={value => handleInputChange('quota', value)}
value={quota} value={quota}
type={'number'} type={'number'}
autoComplete='new-password' autoComplete="new-password"
/> />
</> </>
} }
@ -179,10 +179,10 @@ const EditUser = (props) => {
<Typography.Text>已绑定的 GitHub 账户</Typography.Text> <Typography.Text>已绑定的 GitHub 账户</Typography.Text>
</div> </div>
<Input <Input
name='github_id' name="github_id"
value={github_id} value={github_id}
autoComplete='new-password' autoComplete="new-password"
placeholder='此项只读，需要用户通过个人设置页面的相关绑定按钮进行绑定，不可直接修改' placeholder="此项只读，需要用户通过个人设置页面的相关绑定按钮进行绑定，不可直接修改"
readonly readonly
/> />
<div style={{ marginTop: 20 }}> <div style={{ marginTop: 20 }}>
@ -199,30 +199,30 @@ const EditUser = (props) => {
<Typography.Text>已绑定的微信账户</Typography.Text> <Typography.Text>已绑定的微信账户</Typography.Text>
</div> </div>
<Input <Input
name='wechat_id' name="wechat_id"
value={wechat_id} value={wechat_id}
autoComplete='new-password' autoComplete="new-password"
placeholder='此项只读，需要用户通过个人设置页面的相关绑定按钮进行绑定，不可直接修改' placeholder="此项只读，需要用户通过个人设置页面的相关绑定按钮进行绑定，不可直接修改"
readonly readonly
/> />
<div style={{ marginTop: 20 }}> <div style={{ marginTop: 20 }}>
<Typography.Text>已绑定的 Telegram 账户</Typography.Text> <Typography.Text>已绑定的 Telegram 账户</Typography.Text>
</div> </div>
<Input <Input
name='telegram_id' name="telegram_id"
value={telegram_id} value={telegram_id}
autoComplete='new-password' autoComplete="new-password"
placeholder='此项只读，需要用户通过个人设置页面的相关绑定按钮进行绑定，不可直接修改' placeholder="此项只读，需要用户通过个人设置页面的相关绑定按钮进行绑定，不可直接修改"
readonly readonly
/> />
<div style={{ marginTop: 20 }}> <div style={{ marginTop: 20 }}>
<Typography.Text>已绑定的邮箱账户</Typography.Text> <Typography.Text>已绑定的邮箱账户</Typography.Text>
</div> </div>
<Input <Input
name='email' name="email"
value={email} value={email}
autoComplete='new-password' autoComplete="new-password"
placeholder='此项只读，需要用户通过个人设置页面的相关绑定按钮进行绑定，不可直接修改' placeholder="此项只读，需要用户通过个人设置页面的相关绑定按钮进行绑定，不可直接修改"
readonly readonly
/> />
</Spin> </Spin>