Public-Mirror/metacubexd
1
0
Fork 0
mirror of https://github.com/MetaCubeX/metacubexd.git synced 2024-12-26 19:24:12 +08:00
Code Issues Projects Releases Wiki Activity

feat: proxy point && delay (#15)

Browse Source
This commit is contained in:
Zephyruso 2023-08-29 12:28:52 +08:00 committed by GitHub
parent 7bfb3fcfd9
commit 341cdd0113
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 64 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

74
src/pages/Proxies.tsx
View File

@ -1,24 +1,43 @@
import { For, createSignal, onMount } from 'solid-js'
import { twMerge } from 'tailwind-merge'
import { useRequest } from '~/signals'
import type { Proxy, ProxyProvider } from '~/types'
export const Proxies = () => {
const request = useRequest()
const [proxies, setProxies] = createSignal<Proxy[]>([])
const [delayMap, setDelayMap] = createSignal<Record<string, number>>({})
const [proxyProviders, setProxyProviders] = createSignal<ProxyProvider[]>([])
const renderDelay = (proxyname: string) => {
const delay = delayMap()[proxyname]
if (typeof delay !== 'number' || delay === 0) {
return ''
}
return <span>{delay}ms</span>
}
onMount(async () => {
const { providers } = await request
.get('providers/proxies')
.json<{ providers: Record<string, ProxyProvider> }>()
const delay = delayMap()
Object.values(providers).forEach((provider) => {
provider.proxies.forEach((proxy) => {
delay[proxy.name] = proxy.history[proxy.history.length - 1]?.delay
})
})
setDelayMap(delay)
setProxyProviders(Object.values(providers))
const { proxies } = await request
.get('proxies')
.json<{ proxies: Record<string, Proxy> }>()
setProxies(Object.values(proxies))
const { providers } = await request
.get('providers/proxies')
.json<{ providers: Record<string, ProxyProvider> }>()
setProxyProviders(Object.values(providers))
})
return (
@ -26,11 +45,30 @@ export const Proxies = () => {
<div>
<h1 class="pb-4 text-lg font-semibold">Proxies</h1>
<div class="grid grid-cols-2 gap-2 sm:grid-cols-4">
<div class="grid grid-cols-1 gap-2 sm:grid-cols-1">
<For each={proxies()}>
{(proxy) => (
<div class="card card-bordered card-compact border-secondary p-4">
{proxy.name}
<div class="collapse collapse-arrow border-secondary bg-base-200 p-4">
<input type="checkbox" />
<div class="collapse-title text-xl font-medium">
{proxy.name} {proxy.type}
</div>
<div class="collapse-content grid grid-cols-1 gap-2 sm:grid-cols-3 lg:grid-cols-5">
<For each={proxy.all}>
{(proxyPoint) => (
<div
class={twMerge(
proxy.now === proxyPoint
? 'border-primary bg-success-content text-success'
: 'border-secondary',
'card card-bordered card-compact m-1 flex-row justify-between p-4',
)}
>
{proxyPoint} {renderDelay(proxyPoint)}
</div>
)}
</For>
</div>
</div>
)}
</For>
@ -40,12 +78,26 @@ export const Proxies = () => {
<div>
<h1 class="pb-4 text-lg font-semibold">Proxy Providers</h1>
<div class="grid grid-cols-2 gap-2 sm:grid-cols-4">
<div class="grid grid-cols-1 gap-2 sm:grid-cols-1">
<For each={proxyProviders()}>
{(proxy) => (
<div class="card card-bordered card-compact border-secondary p-4">
<div class="collapse-arrow collapse border-secondary bg-base-200 p-4">
<input type="checkbox" />
<div class="collapse-title text-xl font-medium">
{proxy.name}
</div>
<div class="collapse-content grid grid grid-cols-1 gap-2 sm:grid-cols-3 lg:grid-cols-5">
<For each={proxy.proxies}>
{(proxyPoint) => (
<div
class={`card card-bordered card-compact m-1 flex-row justify-between border-secondary p-4`}
>
{proxyPoint.name} {renderDelay(proxyPoint.name)}
</div>
)}
</For>
</div>
</div>
)}
</For>
</div>