mirror of
https://github.com/MetaCubeX/metacubexd.git
synced 2024-11-10 05:15:35 +08:00
feat: render protocl and udp
This commit is contained in:
parent
6db7ceddac
commit
44df379fd6
@ -39,7 +39,7 @@ const Collapse: ParentComponent<Props> = (props) => {
|
||||
<div
|
||||
class={twMerge(
|
||||
getCollapseContentClassName(),
|
||||
'collapse-content grid grid-cols-1 gap-2 transition-opacity duration-1000 sm:grid-cols-3 lg:grid-cols-5',
|
||||
'collapse-content grid grid-cols-1 gap-2 overflow-hidden transition-opacity duration-1000 sm:grid-cols-2 md:grid-cols-3 xl:grid-cols-4 2xl:grid-cols-5',
|
||||
)}
|
||||
>
|
||||
{content}
|
||||
|
@ -1,3 +1,4 @@
|
||||
import { createMemo } from 'solid-js'
|
||||
import { twMerge } from 'tailwind-merge'
|
||||
import { useProxies } from '~/signals/proxies'
|
||||
|
||||
@ -7,17 +8,24 @@ export default (props: {
|
||||
onClick?: () => void
|
||||
}) => {
|
||||
const { proxyName, isSelected, onClick } = props
|
||||
const { delayMap } = useProxies()
|
||||
const { delayMap, proxyNodeMap } = useProxies()
|
||||
const proxyNode = createMemo(() => proxyNodeMap()[proxyName])
|
||||
const Delay = (proxyname: string) => {
|
||||
const delay = delayMap()[proxyname]
|
||||
let textClassName = 'text-green-500'
|
||||
|
||||
if (typeof delay !== 'number' || delay === 0) {
|
||||
return ''
|
||||
}
|
||||
|
||||
return <span>{delay}ms</span>
|
||||
if (delay > 500) {
|
||||
textClassName = 'text-red-500'
|
||||
} else if (delay > 200) {
|
||||
textClassName = 'text-yellow-500'
|
||||
}
|
||||
|
||||
return <span class={textClassName}>{delay}ms</span>
|
||||
}
|
||||
console.log(proxyName)
|
||||
|
||||
return (
|
||||
<div
|
||||
@ -26,13 +34,19 @@ export default (props: {
|
||||
? 'border-primary bg-success-content text-success'
|
||||
: 'border-secondary',
|
||||
onClick && 'cursor-pointer',
|
||||
'card card-bordered tooltip tooltip-bottom card-compact flex flex-row justify-between gap-2 p-4',
|
||||
'card card-bordered tooltip tooltip-bottom card-compact gap-2 p-4',
|
||||
)}
|
||||
onClick={() => onClick?.()}
|
||||
data-tip={proxyName}
|
||||
>
|
||||
<span class="truncate">{proxyName}</span>
|
||||
<span>{Delay(proxyName)}</span>
|
||||
<div class="flex truncate">{proxyName}</div>
|
||||
<div class="flex flex-row">
|
||||
<div class="flex flex-1 truncate">
|
||||
{proxyNode().type}
|
||||
{proxyNode().udp ? ' :: udp' : ''}
|
||||
</div>
|
||||
<div>{Delay(proxyName)}</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
@ -1,12 +1,16 @@
|
||||
import { createSignal } from 'solid-js'
|
||||
import { useRequest } from '~/signals'
|
||||
import type { Proxy, ProxyProvider } from '~/types'
|
||||
import type { Proxy, ProxyNode, ProxyProvider } from '~/types'
|
||||
|
||||
// these signals should be global state
|
||||
const [proxies, setProxies] = createSignal<Proxy[]>([])
|
||||
const [delayMap, setDelayMap] = createSignal<Record<string, number>>({})
|
||||
const [proxyProviders, setProxyProviders] = createSignal<ProxyProvider[]>([])
|
||||
|
||||
const [delayMap, setDelayMap] = createSignal<Record<string, number>>({})
|
||||
const [proxyNodeMap, setProxyNodeMap] = createSignal<Record<string, ProxyNode>>(
|
||||
{},
|
||||
)
|
||||
|
||||
export function useProxies() {
|
||||
const request = useRequest()
|
||||
|
||||
@ -18,6 +22,7 @@ export function useProxies() {
|
||||
|
||||
Object.values(providers).forEach((provider) => {
|
||||
provider.proxies.forEach((proxy) => {
|
||||
setProxyNodeMap({ ...proxyNodeMap(), [proxy.name]: proxy })
|
||||
delay[proxy.name] = proxy.history[proxy.history.length - 1]?.delay
|
||||
})
|
||||
})
|
||||
@ -73,6 +78,7 @@ export function useProxies() {
|
||||
proxies,
|
||||
proxyProviders,
|
||||
delayTestByProxyGroupName,
|
||||
proxyNodeMap,
|
||||
delayMap,
|
||||
updateProxy,
|
||||
setProxiesByProxyName,
|
||||
|
30
src/types.d.ts
vendored
30
src/types.d.ts
vendored
@ -21,22 +21,24 @@ export type Proxy = {
|
||||
now: string
|
||||
}
|
||||
|
||||
export type ProxyNode = {
|
||||
alive: boolean
|
||||
type: string
|
||||
name: string
|
||||
tfo: boolean
|
||||
udp: boolean
|
||||
xudp: boolean
|
||||
id: string
|
||||
extra: Record<string, unknown>
|
||||
history: {
|
||||
time: string
|
||||
delay: number
|
||||
}[]
|
||||
}
|
||||
|
||||
export type ProxyProvider = {
|
||||
name: string
|
||||
proxies: {
|
||||
alive: boolean
|
||||
type: string
|
||||
name: string
|
||||
tfo: boolean
|
||||
udp: boolean
|
||||
xudp: boolean
|
||||
id: string
|
||||
extra: Record<string, unknown>
|
||||
history: {
|
||||
time: string
|
||||
delay: number
|
||||
}[]
|
||||
}[]
|
||||
proxies: ProxyNode[]
|
||||
testUrl: string
|
||||
updatedAt: string
|
||||
vehicleType: string
|
||||
|
Loading…
Reference in New Issue
Block a user