Add support panel UI, search filters, and money thousand separators.

Co-authored-by: Cursor <cursoragent@cursor.com>

src/pages/ServerPanelPage.vue

@@ -2,7 +2,7 @@
 import { computed, onMounted, ref } from 'vue'
 import { useRouter } from 'vue-router'
 import { message } from 'ant-design-vue'
-import { ArrowRightOutlined, CloudServerOutlined } from '@ant-design/icons-vue'
+import { ArrowRightOutlined, CloudServerOutlined, SearchOutlined } from '@ant-design/icons-vue'
 import api from '@/api/http'
 
 type ExpiryLevel = 'dedicated' | 'healthy' | 'warning' | 'critical' | 'unknown'
@@ -27,10 +27,28 @@ type TenantRow = {
 const router = useRouter()
 const loadingList = ref(false)
 const tenants = ref<TenantRow[]>([])
+const q = ref('')
+
+const filteredTenants = computed(() => {
+  const term = q.value.trim().toLowerCase()
+  if (!term) return tenants.value
+  return tenants.value.filter((t) => {
+    const blob = [
+      t.nameFa,
+      t.domain,
+      t.slug,
+      t.server?.serverName || '',
+      t.server?.expiryLabel || '',
+    ]
+      .join(' ')
+      .toLowerCase()
+    return blob.includes(term)
+  })
+})
 
 const groupedTenants = computed(() => ({
-  hamkar: tenants.value.filter((t) => t.product === 'hamkar'),
-  khanegi: tenants.value.filter((t) => t.product === 'khanegi'),
+  hamkar: filteredTenants.value.filter((t) => t.product === 'hamkar'),
+  khanegi: filteredTenants.value.filter((t) => t.product === 'khanegi'),
 }))
 
 function toneClass(level?: ExpiryLevel) {
@@ -65,11 +83,23 @@ onMounted(loadTenants)
       <div style="flex: 1">
         <h1 class="page-title">پنل سرور</h1>
         <p class="page-sub">
-          هر نسخه می‌تواند چند سرور داشته باشد — وضعیت، شارژ و هشدار نزدیک پایان اعتبار
+          هر نسخه می‌تواند چند سرور داشته باشد — وضعیت، شارژ و هشدار نزدیک پایان اعتبار ·
+          {{ filteredTenants.length }} مورد
         </p>
       </div>
     </div>
 
+    <div class="toolbar">
+      <a-input
+        v-model:value="q"
+        allow-clear
+        placeholder="جستجو نام، دامنه، slug یا نام سرور"
+        style="flex: 1; min-width: 180px"
+      >
+        <template #prefix><SearchOutlined /></template>
+      </a-input>
+    </div>
+
     <div class="legend">
       <span class="chip dedicated">اختصاصی</span>
       <span class="chip healthy">اعتبار کافی — سبز</span>