fix: harden real backend workflows and channel connections

src/apps/admin/AdminPhoneSegmentsPage.tsx

@@ -1,5 +1,5 @@
 import { useEffect, useMemo, useState } from 'react';
-import { Plus, Search } from 'lucide-react';
+import { Plus, RadioTower, Search, Smartphone } from 'lucide-react';
 import { Breadcrumb, Button, Input, Modal, Select, Table, type TableColumn } from '@/components/ui';
 import { adminApi, type DictionaryItem } from '@/api/adminApi';
 
@@ -53,6 +53,11 @@ export function AdminPhoneSegmentsPage() {
     [keyword, segments],
   );
 
+  const filteredRules = useMemo(
+    () => rules.filter((rule) => [rule.carrier, rule.pattern, rule.remark].some((value) => String(value ?? '').includes(keyword))),
+    [keyword, rules],
+  );
+
   function createSegment() {
     adminApi.createPhoneSegment({ prefix, carrier, province, city })
       .then(() => {
@@ -101,12 +106,44 @@ export function AdminPhoneSegmentsPage() {
       </div>
       {error ? <p className="form-error">{error}</p> : null}
 
-      <div className="surface admin-system-toolbar">
-        <Input onChange={(event) => setKeyword(event.target.value)} placeholder="搜索手机号段、运营商、省份或城市" prefix={<Search size={16} />} value={keyword} />
-        <div className="segmented-control">
-          <button className={activeTab === 'segments' ? 'is-active' : ''} onClick={() => setActiveTab('segments')} type="button">手机号段</button>
-          <button className={activeTab === 'rules' ? 'is-active' : ''} onClick={() => setActiveTab('rules')} type="button">运营商区分规则</button>
-        </div>
+      <div className="phone-segment-overview">
+        <section>
+          <span><Smartphone size={20} /></span>
+          <div>
+            <strong>{segments.length}</strong>
+            <p>手机号段记录</p>
+          </div>
+        </section>
+        <section>
+          <span><RadioTower size={20} /></span>
+          <div>
+            <strong>{rules.length}</strong>
+            <p>运营商区分规则</p>
+          </div>
+        </section>
+      </div>
+
+      <div className="surface phone-segment-tabs">
+        <button className={activeTab === 'segments' ? 'is-active' : ''} onClick={() => setActiveTab('segments')} type="button">
+          <Smartphone size={18} />
+          <span>
+            <strong>手机号段</strong>
+            <small>按号码前 7 位维护省份与城市</small>
+          </span>
+          <em>{segments.length}</em>
+        </button>
+        <button className={activeTab === 'rules' ? 'is-active' : ''} onClick={() => setActiveTab('rules')} type="button">
+          <RadioTower size={18} />
+          <span>
+            <strong>运营商区分规则</strong>
+            <small>按前缀正则识别移动、联通、电信</small>
+          </span>
+          <em>{rules.length}</em>
+        </button>
+      </div>
+
+      <div className="surface admin-system-toolbar phone-segment-toolbar">
+        <Input onChange={(event) => setKeyword(event.target.value)} placeholder={activeTab === 'segments' ? '搜索手机号段、运营商、省份或城市' : '搜索运营商、正则或备注'} prefix={<Search size={16} />} value={keyword} />
         <Button icon={<Plus size={16} />} onClick={() => activeTab === 'segments' ? setCreating(true) : setCreatingRule(true)}>
           {activeTab === 'segments' ? '新增号段' : '新增规则'}
         </Button>
@@ -115,7 +152,7 @@ export function AdminPhoneSegmentsPage() {
       <div className="surface admin-system-table-card">
         {activeTab === 'segments'
           ? <Table columns={columns} data={filteredSegments} emptyText="暂无手机号段" rowKey="id" />
-          : <Table columns={ruleColumns} data={rules} emptyText="暂无运营商区分规则" rowKey="id" />}
+          : <Table columns={ruleColumns} data={filteredRules} emptyText="暂无运营商区分规则" rowKey="id" />}
       </div>
 
       <Modal