From ddb8dfe9c55f9c6176898518bdf561ddd54f8779 Mon Sep 17 00:00:00 2001
From: Zephyruso <176294927+Zephyruso@users.noreply.github.com>
Date: Mon, 16 Dec 2024 15:16:51 +0800
Subject: [PATCH] fix: proxy group style & regex ip label

---
 README.md                                |  4 +++-
 public/CNAME                             |  2 +-
 src/components/proxies/LatencyTag.vue    |  2 +-
 src/components/proxies/ProxyNodeCard.vue | 30 +++++++++++-------------
 src/components/proxies/ProxyPreview.vue  |  2 +-
 src/helper/index.ts                      |  8 ++++++-
 6 files changed, 27 insertions(+), 21 deletions(-)

diff --git a/README.md b/README.md
index 7d478982..18f10f6a 100644
--- a/README.md
+++ b/README.md
@@ -1,6 +1,8 @@
 # zashboard
 
-http://b.zash.run.place
+1. For localhost|127.0.0.1: https://board.zash.run.place
+2. For others like router in LAN: http://board.zash.run.place
+
 ![alt text](image-1.png)
 
 ## Tips
diff --git a/public/CNAME b/public/CNAME
index d7ce77f0..d1eb3c39 100644
--- a/public/CNAME
+++ b/public/CNAME
@@ -1 +1 @@
-b.zash.run.place
\ No newline at end of file
+board.zash.run.place
\ No newline at end of file
diff --git a/src/components/proxies/LatencyTag.vue b/src/components/proxies/LatencyTag.vue
index 770f6d50..d0a97307 100644
--- a/src/components/proxies/LatencyTag.vue
+++ b/src/components/proxies/LatencyTag.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="badge flex w-8 items-center justify-center shadow-sm">
+  <div class="badge flex w-8 items-center justify-center border-none">
     <div
       :class="twMerge('text-xs', color)"
       ref="latencyRef"
diff --git a/src/components/proxies/ProxyNodeCard.vue b/src/components/proxies/ProxyNodeCard.vue
index 3523957a..77dc8ceb 100644
--- a/src/components/proxies/ProxyNodeCard.vue
+++ b/src/components/proxies/ProxyNodeCard.vue
@@ -3,7 +3,7 @@
     ref="cardRef"
     :class="
       twMerge(
-        'flex min-h-9 cursor-pointer flex-wrap items-center justify-end gap-1 rounded-md bg-base-200 p-2 shadow',
+        'flex min-h-9 cursor-pointer flex-wrap items-center justify-end gap-1 rounded-md bg-base-200 p-2',
         active ? 'bg-primary text-primary-content' : 'sm:hover:bg-base-300',
         isTruncated && 'tooltip tooltip-bottom',
       )
@@ -56,6 +56,7 @@
 <script setup lang="ts">
 import { proxyLatencyTest, proxyMap } from '@/store/proxies'
 import { truncateProxyName, twoColumnNodeForMobile } from '@/store/settings'
+import { debounce } from 'lodash'
 import { twMerge } from 'tailwind-merge'
 import { computed, nextTick, onMounted, onUnmounted, ref } from 'vue'
 import LatencyTag from './LatencyTag.vue'
@@ -71,13 +72,13 @@ const cardRef = ref<HTMLDivElement | null>(null)
 const isTruncated = ref(false)
 let intersectionObserver: IntersectionObserver | null = null
 let resizeObserver: ResizeObserver | null = null
-const checkTruncation = () => {
+const checkTruncation = debounce(() => {
   if (nameRef.value && cardRef.value) {
     const { scrollWidth, clientWidth } = nameRef.value
 
     isTruncated.value = scrollWidth > clientWidth
   }
-}
+}, 1000)
 
 const observeResize = () => {
   if (nameRef.value) {
@@ -86,12 +87,6 @@ const observeResize = () => {
   }
 }
 
-const unobserveResize = () => {
-  if (resizeObserver && nameRef.value) {
-    resizeObserver.unobserve(nameRef.value)
-  }
-}
-
 onMounted(() => {
   if (cardRef.value) {
     if (truncateProxyName.value) {
@@ -101,13 +96,16 @@ onMounted(() => {
     }
     intersectionObserver = new IntersectionObserver((entries) => {
       entries.forEach((entry) => {
-        showContent.value = entry.isIntersecting
-        if (truncateProxyName.value) {
-          if (showContent.value) {
-            nextTick(observeResize)
-          } else {
-            unobserveResize()
-          }
+        if (entry.isIntersecting) {
+          showContent.value = true
+          nextTick(() => {
+            if (cardRef.value) {
+              intersectionObserver?.unobserve(cardRef.value)
+            }
+            intersectionObserver?.disconnect()
+            intersectionObserver = null
+            observeResize()
+          })
         }
       })
     })
diff --git a/src/components/proxies/ProxyPreview.vue b/src/components/proxies/ProxyPreview.vue
index 4a629e44..9dabea05 100644
--- a/src/components/proxies/ProxyPreview.vue
+++ b/src/components/proxies/ProxyPreview.vue
@@ -6,7 +6,7 @@
     <div
       v-for="node in nodesLatency"
       :key="node.name"
-      class="flex h-4 w-4 items-center justify-center rounded-full shadow"
+      class="flex h-4 w-4 items-center justify-center rounded-full"
       :class="getBgColor(node.latency)"
     >
       <div
diff --git a/src/helper/index.ts b/src/helper/index.ts
index b4d821ce..5661c8fb 100644
--- a/src/helper/index.ts
+++ b/src/helper/index.ts
@@ -70,7 +70,13 @@ export const getIPLabelFromMap = (ip: string) => {
   const isIPv6 = ip.includes(':')
 
   for (const key in sourceIPLabelMap.value) {
-    if (ip === key || (isIPv6 && ip.endsWith(key))) {
+    if (key.startsWith('/')) {
+      const regex = new RegExp(key, 'i')
+
+      if (regex.test(ip)) {
+        return sourceIPLabelMap.value[key]
+      }
+    } else if (ip === key || (isIPv6 && ip.endsWith(key))) {
       return sourceIPLabelMap.value[key]
     }
   }