Merge feat/dataviz-llmage: add llmage module stat cards

- Create stats.py with get_llmage_stats() helper function
- Add 4 stat widgets: stat_total_models, stat_today_calls, stat_today_amount, stat_catelog_count
- Update index.ui to display stat cards row above navigation cards
- Register get_llmage_stats in load_llmage()

llmage/init.py

@@ -32,6 +32,7 @@ from .accounting import (
 	get_failed_accounting_records,
 	llm_accoung_failed
 )
+from .stats import get_llmage_stats
 
 from .asyncinference import (
 	get_asynctask_status,
@@ -63,6 +64,7 @@ def load_llmage():
 	env.get_llms_by_catelog_to_customer = get_llms_by_catelog_to_customer
 	env.backup_accounted_llmusage = backup_accounted_llmusage
 	env.get_failed_accounting_records = get_failed_accounting_records
+	env.get_llmage_stats = get_llmage_stats
 	rf = RegisterFunction()
 	rf.register('jimeng_auth_headers', jimeng_auth_headers)
 

llmage/stats.py

@@ -0,0 +1,69 @@
+from sqlor.dbpools import get_sor_context
+from appPublic.timeUtils import curDateString, timestampstr
+from datetime import datetime, timedelta
+from appPublic.log import debug, exception
+
+async def get_llmage_stats(request):
+    """Get llmage module statistics"""
+    env = request._run_ns
+    userorgid = await env.get_userorgid()
+    today = curDateString()
+    tomorrow = (datetime.now() + timedelta(days=1)).strftime('%Y-%m-%d')
+    
+    stats = {
+        'total_models': 0,
+        'today_usage_count': 0,
+        'today_amount': 0,
+        'catelog_count': 0
+    }
+    
+    async with get_sor_context(env, 'llmage') as sor:
+        # Total enabled models
+        sql_models = """
+            SELECT COUNT(DISTINCT id) as cnt FROM llm
+            WHERE enabled_date <= ${today}$
+                AND expired_date > ${today}$
+        """
+        recs = await sor.sqlExe(sql_models, {'today': today})
+        if recs:
+            stats['total_models'] = int(recs[0].cnt or 0)
+        
+        # Today's usage count
+        sql_usage = """
+            SELECT COUNT(*) as cnt FROM llmusage
+            WHERE userorgid = ${userorgid}$
+                AND use_date >= ${today}$
+                AND use_date < ${tomorrow}$
+        """
+        recs = await sor.sqlExe(sql_usage, {
+            'userorgid': userorgid,
+            'today': today,
+            'tomorrow': tomorrow
+        })
+        if recs:
+            stats['today_usage_count'] = int(recs[0].cnt or 0)
+        
+        # Today's total amount
+        sql_amount = """
+            SELECT COALESCE(SUM(amount), 0) as total FROM llmusage
+            WHERE userorgid = ${userorgid}$
+                AND use_date >= ${today}$
+                AND use_date < ${tomorrow}$
+        """
+        recs = await sor.sqlExe(sql_amount, {
+            'userorgid': userorgid,
+            'today': today,
+            'tomorrow': tomorrow
+        })
+        if recs:
+            stats['today_amount'] = float(recs[0].total or 0)
+        
+        # Catalog count
+        sql_catelog = """
+            SELECT COUNT(*) as cnt FROM llmcatelog
+        """
+        recs = await sor.sqlExe(sql_catelog, {})
+        if recs:
+            stats['catelog_count'] = int(recs[0].cnt or 0)
+    
+    return stats

wwwroot/index.ui

@@ -3,31 +3,88 @@
     "options": {
         "width": "100%",
         "height": "100%",
-        "padding": "20px",
+        "padding": "0"
-        "spacing": 16
     },
     "subwidgets": [
         {
-            "widgettype": "Title2",
+            "widgettype": "HBox",
             "options": {
-                "text": "LLM 模型管理",
+                "width": "100%",
-                "halign": "left"
+                "alignItems": "center",
-            }
+                "marginBottom": "24px"
+            },
+            "subwidgets": [
+                {
+                    "widgettype": "Title2",
+                    "options": {
+                        "text": "LLM 模型管理",
+                        "color": "#F1F5F9",
+                        "fontWeight": "700"
+                    }
+                },
+                {
+                    "widgettype": "Filler"
+                },
+                {
+                    "widgettype": "Text",
+                    "options": {
+                        "text": "模型配置、目录分类与调用监控",
+                        "fontSize": "14px",
+                        "color": "#64748B"
+                    }
+                }
+            ]
         },
         {
             "widgettype": "ResponsableBox",
             "options": {
                 "gap": "16px",
-                "minWidth": "250px"
+                "minWidth": "200px",
+                "marginBottom": "24px"
+            },
+            "subwidgets": [
+                {
+                    "widgettype": "urlwidget",
+                    "options": {
+                        "url": "{{entire_url('/llmage/stat_total_models.ui')}}"
+                    }
+                },
+                {
+                    "widgettype": "urlwidget",
+                    "options": {
+                        "url": "{{entire_url('/llmage/stat_today_calls.ui')}}"
+                    }
+                },
+                {
+                    "widgettype": "urlwidget",
+                    "options": {
+                        "url": "{{entire_url('/llmage/stat_today_amount.ui')}}"
+                    }
+                },
+                {
+                    "widgettype": "urlwidget",
+                    "options": {
+                        "url": "{{entire_url('/llmage/stat_catelog_count.ui')}}"
+                    }
+                }
+            ]
+        },
+        {
+            "widgettype": "ResponsableBox",
+            "options": {
+                "gap": "16px",
+                "minWidth": "250px",
+                "marginBottom": "24px"
             },
             "subwidgets": [
                 {
                     "widgettype": "VBox",
                     "options": {
-                        "bgcolor": "#1e3a5f",
+                        "bgcolor": "#1E293B",
                         "padding": "24px",
-                        "cursor": "pointer",
+                        "borderRadius": "12px",
-                        "borderRadius": "8px"
+                        "border": "1px solid #334155",
+                        "cursor": "pointer"
                     },
                     "binds": [
                         {
@@ -45,25 +102,27 @@
                         {
                             "widgettype": "Svg",
                             "options": {
-                                "svg": "<svg width=\"40\" height=\"40\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#90caf9\" stroke-width=\"2\"><path d=\"M3 7v10a2 2 0 002 2h14a2 2 0 002-2V9a2 2 0 00-2-2h-6l-2-2H5a2 2 0 00-2 2z\"/></svg>",
+                                "svg": "<svg width=\"36\" height=\"36\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#90caf9\" stroke-width=\"1.5\"><path d=\"M3 7v10a2 2 0 002 2h14a2 2 0 002-2V9a2 2 0 00-2-2h-6l-2-2H5a2 2 0 00-2 2z\"/></svg>",
-                                "width": "40px",
+                                "width": "36px",
-                                "height": "40px"
+                                "height": "36px",
+                                "marginBottom": "16px"
                             }
                         },
                         {
                             "widgettype": "Title4",
                             "options": {
                                 "text": "模型类型管理",
-                                "color": "#ffffff",
+                                "color": "#F1F5F9",
-                                "marginTop": "12px"
+                                "fontWeight": "600",
+                                "marginBottom": "8px"
                             }
                         },
                         {
                             "widgettype": "Text",
                             "options": {
-                                "text": "管理模型的分类和类型",
+                                "text": "管理模型的分类目录和类型定义",
-                                "color": "#90caf9",
+                                "fontSize": "14px",
-                                "fontSize": "14px"
+                                "color": "#94A3B8"
                             }
                         }
                     ]
@@ -71,10 +130,11 @@
                 {
                     "widgettype": "VBox",
                     "options": {
-                        "bgcolor": "#1e3a5f",
+                        "bgcolor": "#1E293B",
                         "padding": "24px",
-                        "cursor": "pointer",
+                        "borderRadius": "12px",
-                        "borderRadius": "8px"
+                        "border": "1px solid #334155",
+                        "cursor": "pointer"
                     },
                     "binds": [
                         {
@@ -92,25 +152,27 @@
                         {
                             "widgettype": "Svg",
                             "options": {
-                                "svg": "<svg width=\"40\" height=\"40\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#4caf50\" stroke-width=\"2\"><path d=\"M9.75 3.104v5.714a2.25 2.25 0 01-.659 1.591L5 14.5M9.75 3.104c-.251.023-.501.05-.75.082m.75-.082a24.301 24.301 0 014.5 0m0 0v5.714c0 .597.237 1.17.659 1.591L19.8 15.3M14.25 3.104c.251.023.501.05.75.082M19.8 15.3l-1.57.393A9.065 9.065 0 0112 15.75c-2.062 0-4.024-.614-5.67-1.757l-1.57-.393m15.04 0L12 21 5.25 13.893\"/></svg>",
+                                "svg": "<svg width=\"36\" height=\"36\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#4caf50\" stroke-width=\"1.5\"><path d=\"M9.75 3.104v5.714a2.25 2.25 0 01-.659 1.591L5 14.5M9.75 3.104c-.251.023-.501.05-.75.082m.75-.082a24.301 24.301 0 014.5 0m0 0v5.714c0 .597.237 1.17.659 1.591L19.8 15.3M14.25 3.104c.251.023.501.05.75.082M19.8 15.3l-1.57.393A9.065 9.065 0 0112 15.75c-2.062 0-4.024-.614-5.67-1.757l-1.57-.393m15.04 0L12 21 5.25 13.893\"/></svg>",
-                                "width": "40px",
+                                "width": "36px",
-                                "height": "40px"
+                                "height": "36px",
+                                "marginBottom": "16px"
                             }
                         },
                         {
                             "widgettype": "Title4",
                             "options": {
-                                "text": "模型管理",
+                                "text": "模型配置",
-                                "color": "#ffffff",
+                                "color": "#F1F5F9",
-                                "marginTop": "12px"
+                                "fontWeight": "600",
+                                "marginBottom": "8px"
                             }
                         },
                         {
                             "widgettype": "Text",
                             "options": {
-                                "text": "管理 LLM 模型配置",
+                                "text": "管理 LLM 模型的API配置与供应商映射",
-                                "color": "#4caf50",
+                                "fontSize": "14px",
-                                "fontSize": "14px"
+                                "color": "#94A3B8"
                             }
                         }
                     ]
@@ -118,10 +180,11 @@
                 {
                     "widgettype": "VBox",
                     "options": {
-                        "bgcolor": "#1e3a5f",
+                        "bgcolor": "#1E293B",
                         "padding": "24px",
-                        "cursor": "pointer",
+                        "borderRadius": "12px",
-                        "borderRadius": "8px"
+                        "border": "1px solid #334155",
+                        "cursor": "pointer"
                     },
                     "binds": [
                         {
@@ -139,25 +202,27 @@
                         {
                             "widgettype": "Svg",
                             "options": {
-                                "svg": "<svg width=\"40\" height=\"40\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#ef5350\" stroke-width=\"2\"><path d=\"M12 9v3.75m-9.303 3.376c-.866 1.5.217 3.374 1.948 3.374h14.71c1.73 0 2.813-1.874 1.948-3.374L13.949 3.378c-.866-1.5-3.032-1.5-3.898 0L2.697 16.126zM12 15.75h.007v.008H12v-.008z\"/></svg>",
+                                "svg": "<svg width=\"36\" height=\"36\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#EF4444\" stroke-width=\"1.5\"><path d=\"M12 9v3.75m-9.303 3.376c-.866 1.5.217 3.374 1.948 3.374h14.71c1.73 0 2.813-1.874 1.948-3.374L13.949 3.378c-.866-1.5-3.032-1.5-3.898 0L2.697 16.126zM12 15.75h.007v.008H12v-.008z\"/></svg>",
-                                "width": "40px",
+                                "width": "36px",
-                                "height": "40px"
+                                "height": "36px",
+                                "marginBottom": "16px"
                             }
                         },
                         {
                             "widgettype": "Title4",
                             "options": {
                                 "text": "记账失败记录",
-                                "color": "#ffffff",
+                                "color": "#F1F5F9",
-                                "marginTop": "12px"
+                                "fontWeight": "600",
+                                "marginBottom": "8px"
                             }
                         },
                         {
                             "widgettype": "Text",
                             "options": {
-                                "text": "查看和检索记账失败的记录",
+                                "text": "查看和检索调用计费失败记录",
-                                "color": "#ef5350",
+                                "fontSize": "14px",
-                                "fontSize": "14px"
+                                "color": "#94A3B8"
                             }
                         }
                     ]

wwwroot/stat_catelog_count.ui

@@ -0,0 +1,53 @@
+{% set stats = get_llmage_stats(request) %}
+{
+    "widgettype": "VBox",
+    "options": {
+        "bgcolor": "#1E293B",
+        "padding": "20px",
+        "borderRadius": "12px",
+        "border": "1px solid #334155",
+        "flex": "1",
+        "minHeight": "110px"
+    },
+    "subwidgets": [
+        {
+            "widgettype": "HBox",
+            "options": {
+                "alignItems": "center",
+                "marginBottom": "12px"
+            },
+            "subwidgets": [
+                {
+                    "widgettype": "Svg",
+                    "options": {
+                        "svg": "<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#8B5CF6\" stroke-width=\"2\"><path d=\"M3.75 6A2.25 2.25 0 016 3.75h2.25A2.25 2.25 0 0110.5 6v2.25a2.25 2.25 0 01-2.25 2.25H6a2.25 2.25 0 01-2.25-2.25V6zM3.75 15.75A2.25 2.25 0 016 13.5h2.25a2.25 2.25 0 012.25 2.25V18a2.25 2.25 0 01-2.25 2.25H6A2.25 2.25 0 013.75 18v-2.25zM13.5 6a2.25 2.25 0 012.25-2.25H18A2.25 2.25 0 0120.25 6v2.25A2.25 2.25 0 0118 10.5h-2.25a2.25 2.25 0 01-2.25-2.25V6zM13.5 15.75a2.25 2.25 0 012.25-2.25H18a2.25 2.25 0 012.25 2.25V18A2.25 2.25 0 0118 20.25h-2.25A2.25 2.25 0 0113.5 18v-2.25z\"/></svg>",
+                        "width": "24px",
+                        "height": "24px"
+                    }
+                },
+                {
+                    "widgettype": "Filler"
+                }
+            ]
+        },
+        {
+            "widgettype": "Text",
+            "options": {
+                "text": "{{stats.catelog_count}}",
+                "fontSize": "32px",
+                "fontWeight": "700",
+                "color": "#F1F5F9",
+                "lineHeight": "1.1"
+            }
+        },
+        {
+            "widgettype": "Text",
+            "options": {
+                "text": "模型分类",
+                "fontSize": "14px",
+                "color": "#94A3B8",
+                "marginTop": "4px"
+            }
+        }
+    ]
+}

wwwroot/stat_today_amount.ui

@@ -0,0 +1,53 @@
+{% set stats = get_llmage_stats(request) %}
+{
+    "widgettype": "VBox",
+    "options": {
+        "bgcolor": "#1E293B",
+        "padding": "20px",
+        "borderRadius": "12px",
+        "border": "1px solid #334155",
+        "flex": "1",
+        "minHeight": "110px"
+    },
+    "subwidgets": [
+        {
+            "widgettype": "HBox",
+            "options": {
+                "alignItems": "center",
+                "marginBottom": "12px"
+            },
+            "subwidgets": [
+                {
+                    "widgettype": "Svg",
+                    "options": {
+                        "svg": "<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#F59E0B\" stroke-width=\"2\"><path d=\"M12 6v12m-3-2.818l.879.659c1.171.879 3.07.879 4.242 0 1.172-.879 1.172-2.303 0-3.182C13.536 12.219 12.768 12 12 12c-.725 0-1.45-.22-2.003-.659-1.106-.879-1.106-2.303 0-3.182s2.9-.879 4.006 0l.415.33M21 12a9 9 0 11-18 0 9 9 0 0118 0z\"/></svg>",
+                        "width": "24px",
+                        "height": "24px"
+                    }
+                },
+                {
+                    "widgettype": "Filler"
+                }
+            ]
+        },
+        {
+            "widgettype": "Text",
+            "options": {
+                "text": "¥{{'%.2f' % stats.today_amount}}",
+                "fontSize": "32px",
+                "fontWeight": "700",
+                "color": "#F1F5F9",
+                "lineHeight": "1.1"
+            }
+        },
+        {
+            "widgettype": "Text",
+            "options": {
+                "text": "今日消费",
+                "fontSize": "14px",
+                "color": "#94A3B8",
+                "marginTop": "4px"
+            }
+        }
+    ]
+}

wwwroot/stat_today_calls.ui

@@ -0,0 +1,53 @@
+{% set stats = get_llmage_stats(request) %}
+{
+    "widgettype": "VBox",
+    "options": {
+        "bgcolor": "#1E293B",
+        "padding": "20px",
+        "borderRadius": "12px",
+        "border": "1px solid #334155",
+        "flex": "1",
+        "minHeight": "110px"
+    },
+    "subwidgets": [
+        {
+            "widgettype": "HBox",
+            "options": {
+                "alignItems": "center",
+                "marginBottom": "12px"
+            },
+            "subwidgets": [
+                {
+                    "widgettype": "Svg",
+                    "options": {
+                        "svg": "<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#22C55E\" stroke-width=\"2\"><path d=\"M7.5 21L3 16.5m0 0L7.5 12M12 9v7.5m0 0l4.5-4.5M12 9l4.5 4.5m0 0L12 16.5\"/><path d=\"M21 12h-4.5M12 3v4.5m0 0L7.5 12\"/></svg>",
+                        "width": "24px",
+                        "height": "24px"
+                    }
+                },
+                {
+                    "widgettype": "Filler"
+                }
+            ]
+        },
+        {
+            "widgettype": "Text",
+            "options": {
+                "text": "{{stats.today_usage_count}}",
+                "fontSize": "32px",
+                "fontWeight": "700",
+                "color": "#F1F5F9",
+                "lineHeight": "1.1"
+            }
+        },
+        {
+            "widgettype": "Text",
+            "options": {
+                "text": "今日调用",
+                "fontSize": "14px",
+                "color": "#94A3B8",
+                "marginTop": "4px"
+            }
+        }
+    ]
+}

wwwroot/stat_total_models.ui

@@ -0,0 +1,53 @@
+{% set stats = get_llmage_stats(request) %}
+{
+    "widgettype": "VBox",
+    "options": {
+        "bgcolor": "#1E293B",
+        "padding": "20px",
+        "borderRadius": "12px",
+        "border": "1px solid #334155",
+        "flex": "1",
+        "minHeight": "110px"
+    },
+    "subwidgets": [
+        {
+            "widgettype": "HBox",
+            "options": {
+                "alignItems": "center",
+                "marginBottom": "12px"
+            },
+            "subwidgets": [
+                {
+                    "widgettype": "Svg",
+                    "options": {
+                        "svg": "<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#3B82F6\" stroke-width=\"2\"><path d=\"M9.813 15.904L9 18.75l-.813-2.846a4.5 4.5 0 00-3.09-3.09L2.25 12l2.846-.813a4.5 4.5 0 003.09-3.09L9 5.25l.813 2.846a4.5 4.5 0 003.09 3.09L15.75 12l-2.846.813a4.5 4.5 0 00-3.09 3.09zM18.259 8.715L18 9.75l-.259-1.035a3.375 3.375 0 00-2.455-2.456L14.25 6l1.036-.259a3.375 3.375 0 002.455-2.456L18 2.25l.259 1.035a3.375 3.375 0 002.455 2.456L21.75 6l-1.036.259a3.375 3.375 0 00-2.455 2.456zM16.894 20.567L16.5 21.75l-.394-1.183a2.25 2.25 0 00-1.423-1.423L13.5 18.75l1.183-.394a2.25 2.25 0 001.423-1.423l.394-1.183.394 1.183a2.25 2.25 0 001.423 1.423l1.183.394-1.183.394a2.25 2.25 0 00-1.423 1.423z\"/></svg>",
+                        "width": "24px",
+                        "height": "24px"
+                    }
+                },
+                {
+                    "widgettype": "Filler"
+                }
+            ]
+        },
+        {
+            "widgettype": "Text",
+            "options": {
+                "text": "{{stats.total_models}}",
+                "fontSize": "32px",
+                "fontWeight": "700",
+                "color": "#F1F5F9",
+                "lineHeight": "1.1"
+            }
+        },
+        {
+            "widgettype": "Text",
+            "options": {
+                "text": "可用模型数",
+                "fontSize": "14px",
+                "color": "#94A3B8",
+                "marginTop": "4px"
+            }
+        }
+    ]
+}