@svadmin/lite 0.26.0 → 0.30.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (109) hide show
  1. package/dist/components/LiteAbacPolicyMatrix.svelte +128 -0
  2. package/dist/components/LiteAbacPolicyMatrix.svelte.d.ts +16 -0
  3. package/dist/components/LiteAnnouncementBanner.svelte +88 -0
  4. package/dist/components/LiteAnnouncementBanner.svelte.d.ts +12 -0
  5. package/dist/components/LiteApiPlayground.svelte +103 -0
  6. package/dist/components/LiteApiPlayground.svelte.d.ts +10 -0
  7. package/dist/components/LiteApprovalChainBuilder.svelte +120 -0
  8. package/dist/components/LiteApprovalChainBuilder.svelte.d.ts +15 -0
  9. package/dist/components/LiteAsyncExportModal.svelte +113 -0
  10. package/dist/components/LiteAsyncExportModal.svelte.d.ts +14 -0
  11. package/dist/components/LiteAuditTrailInspector.svelte +166 -0
  12. package/dist/components/LiteAuditTrailInspector.svelte.d.ts +23 -0
  13. package/dist/components/LiteBillingInvoiceDrawer.svelte +100 -0
  14. package/dist/components/LiteBillingInvoiceDrawer.svelte.d.ts +16 -0
  15. package/dist/components/LiteChartAnnotationOverlay.svelte +101 -0
  16. package/dist/components/LiteChartAnnotationOverlay.svelte.d.ts +16 -0
  17. package/dist/components/LiteColumnMappingTable.svelte +105 -0
  18. package/dist/components/LiteColumnMappingTable.svelte.d.ts +14 -0
  19. package/dist/components/LiteContextMenu.svelte +114 -0
  20. package/dist/components/LiteContextMenu.svelte.d.ts +18 -0
  21. package/dist/components/LiteDashboardGridLayout.svelte +108 -0
  22. package/dist/components/LiteDashboardGridLayout.svelte.d.ts +16 -0
  23. package/dist/components/LiteDashboardLayoutStorage.svelte +88 -0
  24. package/dist/components/LiteDashboardLayoutStorage.svelte.d.ts +16 -0
  25. package/dist/components/LiteDataImportDropzone.svelte +89 -0
  26. package/dist/components/LiteDataImportDropzone.svelte.d.ts +10 -0
  27. package/dist/components/LiteDataLineageGraph.svelte +100 -0
  28. package/dist/components/LiteDataLineageGraph.svelte.d.ts +15 -0
  29. package/dist/components/LiteDataMaskPolicyEngine.svelte +131 -0
  30. package/dist/components/LiteDataMaskPolicyEngine.svelte.d.ts +16 -0
  31. package/dist/components/LiteDataScreenContainer.svelte +34 -0
  32. package/dist/components/LiteDataScreenContainer.svelte.d.ts +9 -0
  33. package/dist/components/LiteDualApprovalGate.svelte +58 -0
  34. package/dist/components/LiteDualApprovalGate.svelte.d.ts +11 -0
  35. package/dist/components/LiteElectronicSealStamp.svelte +56 -0
  36. package/dist/components/LiteElectronicSealStamp.svelte.d.ts +9 -0
  37. package/dist/components/LiteEnvVariableEditor.svelte +114 -0
  38. package/dist/components/LiteEnvVariableEditor.svelte.d.ts +15 -0
  39. package/dist/components/LiteFormulaField.svelte +44 -0
  40. package/dist/components/LiteFormulaField.svelte.d.ts +11 -0
  41. package/dist/components/LiteGeoScatterMap.svelte +117 -0
  42. package/dist/components/LiteGeoScatterMap.svelte.d.ts +16 -0
  43. package/dist/components/LiteHmacSignatureCalculator.svelte +84 -0
  44. package/dist/components/LiteHmacSignatureCalculator.svelte.d.ts +10 -0
  45. package/dist/components/LiteImportPreviewValidator.svelte +136 -0
  46. package/dist/components/LiteImportPreviewValidator.svelte.d.ts +16 -0
  47. package/dist/components/LiteJsonViewer.svelte +88 -0
  48. package/dist/components/LiteJsonViewer.svelte.d.ts +9 -0
  49. package/dist/components/LiteKeyboardShortcutsModal.svelte +56 -0
  50. package/dist/components/LiteKeyboardShortcutsModal.svelte.d.ts +13 -0
  51. package/dist/components/LiteKpiCard.svelte +169 -0
  52. package/dist/components/LiteKpiCard.svelte.d.ts +25 -0
  53. package/dist/components/LiteLiveStreamLogViewer.svelte +84 -0
  54. package/dist/components/LiteLiveStreamLogViewer.svelte.d.ts +14 -0
  55. package/dist/components/LiteOmnibarCommandPalette.svelte +111 -0
  56. package/dist/components/LiteOmnibarCommandPalette.svelte.d.ts +15 -0
  57. package/dist/components/LitePeriodComparisonCard.svelte +60 -0
  58. package/dist/components/LitePeriodComparisonCard.svelte.d.ts +11 -0
  59. package/dist/components/LitePermissionSimulator.svelte +90 -0
  60. package/dist/components/LitePermissionSimulator.svelte.d.ts +14 -0
  61. package/dist/components/LitePivotMatrix.svelte +138 -0
  62. package/dist/components/LitePivotMatrix.svelte.d.ts +18 -0
  63. package/dist/components/LitePlanUsageQuotaBar.svelte +96 -0
  64. package/dist/components/LitePlanUsageQuotaBar.svelte.d.ts +15 -0
  65. package/dist/components/LiteQueryAiExplainer.svelte +85 -0
  66. package/dist/components/LiteQueryAiExplainer.svelte.d.ts +10 -0
  67. package/dist/components/LiteResultPage.svelte +135 -0
  68. package/dist/components/LiteResultPage.svelte.d.ts +17 -0
  69. package/dist/components/LiteScheduledJobManager.svelte +116 -0
  70. package/dist/components/LiteScheduledJobManager.svelte.d.ts +16 -0
  71. package/dist/components/LiteScreenAntiLeakGuard.svelte +56 -0
  72. package/dist/components/LiteScreenAntiLeakGuard.svelte.d.ts +8 -0
  73. package/dist/components/LiteSecureDataExporter.svelte +101 -0
  74. package/dist/components/LiteSecureDataExporter.svelte.d.ts +12 -0
  75. package/dist/components/LiteSensitiveDataMask.svelte +34 -2
  76. package/dist/components/LiteSensitiveDataMask.svelte.d.ts +1 -2
  77. package/dist/components/LiteSqlConsole.svelte +128 -0
  78. package/dist/components/LiteSqlConsole.svelte.d.ts +16 -0
  79. package/dist/components/LiteStepWizard.svelte +98 -0
  80. package/dist/components/LiteStepWizard.svelte.d.ts +16 -0
  81. package/dist/components/LiteSystemCapacityForecastCard.svelte +88 -0
  82. package/dist/components/LiteSystemCapacityForecastCard.svelte.d.ts +11 -0
  83. package/dist/components/LiteSystemHealthCheckDashboard.svelte +142 -0
  84. package/dist/components/LiteSystemHealthCheckDashboard.svelte.d.ts +18 -0
  85. package/dist/components/LiteTableAggregationFooter.svelte +76 -0
  86. package/dist/components/LiteTableAggregationFooter.svelte.d.ts +14 -0
  87. package/dist/components/LiteTenantContextSwitcher.svelte +173 -0
  88. package/dist/components/LiteTenantContextSwitcher.svelte.d.ts +27 -0
  89. package/dist/components/LiteTenantQuotasMatrix.svelte +117 -0
  90. package/dist/components/LiteTenantQuotasMatrix.svelte.d.ts +17 -0
  91. package/dist/components/LiteTextDiffViewer.svelte +111 -0
  92. package/dist/components/LiteTextDiffViewer.svelte.d.ts +10 -0
  93. package/dist/components/LiteThreadedCommentDrawer.svelte +60 -0
  94. package/dist/components/LiteThreadedCommentDrawer.svelte.d.ts +15 -0
  95. package/dist/components/LiteTierFeatureComparison.svelte +97 -0
  96. package/dist/components/LiteTierFeatureComparison.svelte.d.ts +18 -0
  97. package/dist/components/LiteUnsavedChangesGuard.svelte +53 -0
  98. package/dist/components/LiteUnsavedChangesGuard.svelte.d.ts +10 -0
  99. package/dist/components/LiteWatermarkContainer.svelte +58 -0
  100. package/dist/components/LiteWatermarkContainer.svelte.d.ts +9 -0
  101. package/dist/components/LiteWebhookSimulator.svelte +120 -0
  102. package/dist/components/LiteWebhookSimulator.svelte.d.ts +11 -0
  103. package/dist/components/LiteWorkflowNodeInspector.svelte +79 -0
  104. package/dist/components/LiteWorkflowNodeInspector.svelte.d.ts +11 -0
  105. package/dist/components/LiteWorkflowStepper.svelte +56 -0
  106. package/dist/components/LiteWorkflowStepper.svelte.d.ts +14 -0
  107. package/dist/index.d.ts +57 -0
  108. package/dist/index.js +61 -0
  109. package/package.json +2 -2
@@ -0,0 +1,111 @@
1
+ <script lang="ts">
2
+ export interface CommandPaletteItem {
3
+ id: string;
4
+ title: string;
5
+ category?: string;
6
+ description?: string;
7
+ shortcut?: string;
8
+ }
9
+
10
+ interface Props {
11
+ placeholder?: string;
12
+ items?: CommandPaletteItem[];
13
+ class?: string;
14
+ }
15
+
16
+ let {
17
+ placeholder = '全局快捷命令面板 (SSR 静态列表)',
18
+ items = [
19
+ { id: 'nav-dashboard', title: '运营与财务仪表盘', category: '系统导航', shortcut: 'G D' },
20
+ { id: 'act-new-order', title: '新建采购审批流', category: '快捷操作', shortcut: '⌘ N' },
21
+ { id: 'res-order-88', title: '订单 #ORD-2026-9882', category: '业务实体' },
22
+ ],
23
+ class: className = '',
24
+ }: Props = $props();
25
+ </script>
26
+
27
+ <div
28
+ class="lite-omnibar-box {className}"
29
+ data-svadmin-component="LiteOmnibarCommandPalette"
30
+ role="region"
31
+ aria-label="Global Omnibar Command Palette"
32
+ >
33
+ <div class="lite-omnibar-input">
34
+ <span class="lite-search-icon">🔍</span>
35
+ <span class="lite-input-mock">{placeholder}</span>
36
+ <span class="lite-kbd-hint">⌘K</span>
37
+ </div>
38
+
39
+ <div class="lite-omnibar-list">
40
+ <div class="lite-items-header">默认常用指令与导航直达 (SSR 静态降级):</div>
41
+ {#each items as item (item.id)}
42
+ <div class="lite-cmd-row">
43
+ <div class="lite-cmd-main">
44
+ <span class="lite-cmd-title">{item.title}</span>
45
+ {#if item.category}
46
+ <span class="lite-cmd-cat">{item.category}</span>
47
+ {/if}
48
+ </div>
49
+ {#if item.shortcut}
50
+ <span class="lite-cmd-shortcut">{item.shortcut}</span>
51
+ {/if}
52
+ </div>
53
+ {/each}
54
+ </div>
55
+ </div>
56
+
57
+ <style>
58
+ .lite-omnibar-box {
59
+ border: 1px solid #e5e6eb;
60
+ border-radius: 6px;
61
+ background: #ffffff;
62
+ font-size: 12px;
63
+ overflow: hidden;
64
+ }
65
+ .lite-omnibar-input {
66
+ display: flex;
67
+ align-items: center;
68
+ padding: 10px 12px;
69
+ background: #f7f8fa;
70
+ border-bottom: 1px solid #e5e6eb;
71
+ }
72
+ .lite-search-icon { font-size: 12px; margin-right: 8px; }
73
+ .lite-input-mock { flex: 1; color: #86909c; font-size: 12px; margin-right: 8px; }
74
+ .lite-kbd-hint {
75
+ font-size: 10px;
76
+ font-family: monospace;
77
+ background: #ffffff;
78
+ border: 1px solid #e5e6eb;
79
+ padding: 2px 4px;
80
+ border-radius: 3px;
81
+ color: #4e5969;
82
+ }
83
+ .lite-omnibar-list { padding: 8px 12px; }
84
+ .lite-items-header { font-size: 11px; color: #86909c; margin-bottom: 6px; }
85
+ .lite-cmd-row {
86
+ display: flex;
87
+ justify-content: space-between;
88
+ align-items: center;
89
+ padding: 6px 0;
90
+ border-bottom: 1px dashed #f2f3f5;
91
+ }
92
+ .lite-cmd-row:last-child { border-bottom: none; }
93
+ .lite-cmd-main { display: flex; align-items: center; }
94
+ .lite-cmd-title { font-weight: 500; color: #1d2129; margin-right: 6px; }
95
+ .lite-cmd-cat {
96
+ font-size: 10px;
97
+ color: #86909c;
98
+ background: #f2f3f5;
99
+ padding: 1px 4px;
100
+ border-radius: 2px;
101
+ }
102
+ .lite-cmd-shortcut {
103
+ font-size: 10px;
104
+ font-family: monospace;
105
+ background: #f7f8fa;
106
+ border: 1px solid #e5e6eb;
107
+ padding: 1px 4px;
108
+ border-radius: 2px;
109
+ color: #4e5969;
110
+ }
111
+ </style>
@@ -0,0 +1,15 @@
1
+ export interface CommandPaletteItem {
2
+ id: string;
3
+ title: string;
4
+ category?: string;
5
+ description?: string;
6
+ shortcut?: string;
7
+ }
8
+ interface Props {
9
+ placeholder?: string;
10
+ items?: CommandPaletteItem[];
11
+ class?: string;
12
+ }
13
+ declare const LiteOmnibarCommandPalette: import("svelte").Component<Props, {}, "">;
14
+ type LiteOmnibarCommandPalette = ReturnType<typeof LiteOmnibarCommandPalette>;
15
+ export default LiteOmnibarCommandPalette;
@@ -0,0 +1,60 @@
1
+ <script lang="ts">
2
+ interface Props {
3
+ title?: string;
4
+ currentValue?: string | number;
5
+ priorValue?: string | number;
6
+ deltaPercentage?: number;
7
+ periodLabel?: string;
8
+ class?: string;
9
+ }
10
+
11
+ let {
12
+ title = '月度营收环比对比',
13
+ currentValue = '¥ 1,280,000',
14
+ priorValue = '¥ 1,120,000',
15
+ deltaPercentage = 14.28,
16
+ periodLabel = '较上月 (2026-10)',
17
+ class: className = '',
18
+ }: Props = $props();
19
+
20
+ const isUp = $derived(deltaPercentage >= 0);
21
+ </script>
22
+
23
+ <div
24
+ class="lite-period-card {className}"
25
+ data-svadmin-component="LitePeriodComparisonCard"
26
+ role="region"
27
+ aria-label="Period Comparison Card"
28
+ >
29
+ <div class="lite-period-header">
30
+ <span class="lite-period-title">{title}</span>
31
+ <span class="lite-period-badge" class:lite-badge-up={isUp} class:lite-badge-down={!isUp}>
32
+ {isUp ? '↑ +' : '↓ '}{deltaPercentage}%
33
+ </span>
34
+ </div>
35
+
36
+ <div class="lite-period-body">
37
+ <div class="lite-val-current">{currentValue}</div>
38
+ <div class="lite-val-prior">
39
+ 基期数值: <span class="font-mono">{priorValue}</span> ({periodLabel})
40
+ </div>
41
+ </div>
42
+ </div>
43
+
44
+ <style>
45
+ .lite-period-card {
46
+ border: 1px solid #e5e6eb;
47
+ border-radius: 6px;
48
+ background: #ffffff;
49
+ padding: 12px 14px;
50
+ font-size: 12px;
51
+ }
52
+ .lite-period-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 6px; }
53
+ .lite-period-title { font-weight: 500; color: #4e5969; font-size: 11px; }
54
+ .lite-period-badge { font-size: 11px; font-weight: 700; font-family: monospace; padding: 2px 6px; border-radius: 3px; }
55
+ .lite-badge-up { color: #00b42a; background: #e8ffea; }
56
+ .lite-badge-down { color: #f53f3f; background: #ffece8; }
57
+ .lite-val-current { font-size: 20px; font-weight: 700; color: #1d2129; margin-bottom: 4px; }
58
+ .lite-val-prior { font-size: 11px; color: #86909c; }
59
+ .font-mono { font-family: monospace; color: #4e5969; }
60
+ </style>
@@ -0,0 +1,11 @@
1
+ interface Props {
2
+ title?: string;
3
+ currentValue?: string | number;
4
+ priorValue?: string | number;
5
+ deltaPercentage?: number;
6
+ periodLabel?: string;
7
+ class?: string;
8
+ }
9
+ declare const LitePeriodComparisonCard: import("svelte").Component<Props, {}, "">;
10
+ type LitePeriodComparisonCard = ReturnType<typeof LitePeriodComparisonCard>;
11
+ export default LitePeriodComparisonCard;
@@ -0,0 +1,90 @@
1
+ <script lang="ts">
2
+ export interface SimulationUser {
3
+ id: string;
4
+ name: string;
5
+ department: string;
6
+ securityClearance: string;
7
+ }
8
+
9
+ interface Props {
10
+ title?: string;
11
+ users?: SimulationUser[];
12
+ class?: string;
13
+ }
14
+
15
+ let {
16
+ title = '权限模拟沙箱 (SSR 静态列表)',
17
+ users = [
18
+ { id: 'u1', name: '李思远 (财务主管)', department: '财务结算中心', securityClearance: 'L3' },
19
+ { id: 'u2', name: '王小磊 (开发人员)', department: '技术工程部', securityClearance: 'L1' },
20
+ { id: 'u3', name: '赵宏 (合规安全总监)', department: '信息安全合规处', securityClearance: 'L4' },
21
+ ],
22
+ class: className = '',
23
+ }: Props = $props();
24
+ </script>
25
+
26
+ <div
27
+ class="lite-perm-simulator {className}"
28
+ data-svadmin-component="LitePermissionSimulator"
29
+ role="region"
30
+ aria-label="Permission Simulator"
31
+ >
32
+ <header class="lite-sim-header">
33
+ <div class="lite-sim-title-row">
34
+ <span class="lite-sim-icon">👤</span>
35
+ <h4 class="lite-sim-title">{title}</h4>
36
+ </div>
37
+ <span class="lite-sim-count">可模拟 {users.length} 个角色身份</span>
38
+ </header>
39
+
40
+ <div class="lite-sim-body">
41
+ <div class="lite-sim-users">
42
+ {#each users as u (u.id)}
43
+ <div class="lite-user-card">
44
+ <div class="lite-user-top">
45
+ <span class="lite-user-name">{u.name}</span>
46
+ <span class="lite-user-level font-mono">[{u.securityClearance}]</span>
47
+ </div>
48
+ <div class="lite-user-dept">{u.department}</div>
49
+ </div>
50
+ {/each}
51
+ </div>
52
+ </div>
53
+ </div>
54
+
55
+ <style>
56
+ .lite-perm-simulator {
57
+ border: 1px solid #e5e6eb;
58
+ border-radius: 6px;
59
+ background: #ffffff;
60
+ font-size: 12px;
61
+ overflow: hidden;
62
+ }
63
+ .lite-sim-header {
64
+ display: flex;
65
+ justify-content: space-between;
66
+ align-items: center;
67
+ padding: 10px 14px;
68
+ background: #f7f8fa;
69
+ border-bottom: 1px solid #e5e6eb;
70
+ }
71
+ .lite-sim-title-row { display: flex; align-items: center; }
72
+ .lite-sim-icon { font-size: 14px; margin-right: 6px; }
73
+ .lite-sim-title { margin: 0; font-size: 13px; font-weight: 600; color: #1d2129; }
74
+ .lite-sim-count { font-size: 11px; color: #86909c; }
75
+ .lite-sim-body { padding: 12px 14px; }
76
+ .lite-sim-users { display: flex; flex-direction: column; }
77
+ .lite-user-card {
78
+ border: 1px solid #f2f3f5;
79
+ background: #fafafa;
80
+ border-radius: 4px;
81
+ padding: 8px 10px;
82
+ margin-bottom: 6px;
83
+ }
84
+ .lite-user-card:last-child { margin-bottom: 0; }
85
+ .lite-user-top { display: flex; justify-content: space-between; align-items: center; }
86
+ .lite-user-name { font-weight: 600; color: #1d2129; }
87
+ .lite-user-level { font-size: 10px; color: #165dff; font-weight: 600; }
88
+ .font-mono { font-family: monospace; }
89
+ .lite-user-dept { font-size: 11px; color: #86909c; margin-top: 2px; }
90
+ </style>
@@ -0,0 +1,14 @@
1
+ export interface SimulationUser {
2
+ id: string;
3
+ name: string;
4
+ department: string;
5
+ securityClearance: string;
6
+ }
7
+ interface Props {
8
+ title?: string;
9
+ users?: SimulationUser[];
10
+ class?: string;
11
+ }
12
+ declare const LitePermissionSimulator: import("svelte").Component<Props, {}, "">;
13
+ type LitePermissionSimulator = ReturnType<typeof LitePermissionSimulator>;
14
+ export default LitePermissionSimulator;
@@ -0,0 +1,138 @@
1
+ <script lang="ts">
2
+ interface Props {
3
+ title?: string;
4
+ rowDimensionLabel?: string;
5
+ colDimensionLabel?: string;
6
+ measureLabel?: string;
7
+ cols?: string[];
8
+ rows?: { name: string; cells: (number | string)[]; total: number | string }[];
9
+ grandTotals?: (number | string)[];
10
+ grandTotalAll?: number | string;
11
+ class?: string;
12
+ }
13
+
14
+ let {
15
+ title = '多维交叉透视分析矩阵',
16
+ rowDimensionLabel = '区域 / 部门',
17
+ colDimensionLabel = '季度',
18
+ measureLabel = '销售额 (SUM)',
19
+ cols = ['2026 Q1', '2026 Q2', '2026 Q3', '2026 Q4'],
20
+ rows = [
21
+ { name: '华东大区 / 软件业务部', cells: ['¥ 1,280,000', '¥ 1,540,000', '¥ 1,120,000', '¥ 1,350,000'], total: '¥ 5,290,000' },
22
+ { name: '华南大区 / 跨境电商部', cells: ['¥ 950,000', '¥ 1,020,000', '¥ 1,480,000', '¥ 1,890,000'], total: '¥ 5,340,000' },
23
+ { name: '华北大区 / 政府业务线', cells: ['¥ 820,000', '¥ 780,000', '¥ 910,000', '¥ 1,320,000'], total: '¥ 3,830,000' }
24
+ ],
25
+ grandTotals = ['¥ 3,050,000', '¥ 3,340,000', '¥ 3,510,000', '¥ 4,560,000'],
26
+ grandTotalAll = '¥ 14,460,000',
27
+ class: className = '',
28
+ }: Props = $props();
29
+ </script>
30
+
31
+ <div
32
+ class="lite-pivot-matrix {className}"
33
+ data-svadmin-component="LitePivotMatrix"
34
+ role="region"
35
+ aria-label="Pivot Matrix"
36
+ >
37
+ <header class="lite-pivot-header">
38
+ <div class="lite-pivot-title-wrap">
39
+ <h4 class="lite-pivot-title">{title}</h4>
40
+ <span class="lite-pivot-meta">行: {rowDimensionLabel} ✕ 列: {colDimensionLabel}</span>
41
+ </div>
42
+ <span class="lite-pivot-measure">{measureLabel}</span>
43
+ </header>
44
+
45
+ <div class="lite-pivot-table-wrap">
46
+ <table class="lite-pivot-table">
47
+ <thead>
48
+ <tr>
49
+ <th class="lite-th-rowdim">{rowDimensionLabel}</th>
50
+ {#each cols as col (col)}
51
+ <th class="lite-th-coldim">{col}</th>
52
+ {/each}
53
+ <th class="lite-th-rowtotal">行汇总</th>
54
+ </tr>
55
+ </thead>
56
+ <tbody>
57
+ {#each rows as row (row.name)}
58
+ <tr>
59
+ <td class="lite-td-rowname">{row.name}</td>
60
+ {#each row.cells as cell, idx (idx)}
61
+ <td class="lite-td-cell">{cell}</td>
62
+ {/each}
63
+ <td class="lite-td-rowtotal">{row.total}</td>
64
+ </tr>
65
+ {/each}
66
+ </tbody>
67
+ <tfoot>
68
+ <tr class="lite-tr-grandtotal">
69
+ <td class="lite-td-grandlabel">列汇总</td>
70
+ {#each grandTotals as gTotal, idx (idx)}
71
+ <td class="lite-td-coltotal">{gTotal}</td>
72
+ {/each}
73
+ <td class="lite-td-grandall">{grandTotalAll}</td>
74
+ </tr>
75
+ </tfoot>
76
+ </table>
77
+ </div>
78
+ </div>
79
+
80
+ <style>
81
+ .lite-pivot-matrix {
82
+ border: 1px solid #e5e6eb;
83
+ border-radius: 6px;
84
+ background: #ffffff;
85
+ font-size: 12px;
86
+ overflow: hidden;
87
+ }
88
+ .lite-pivot-header {
89
+ display: flex;
90
+ justify-content: space-between;
91
+ align-items: center;
92
+ padding: 10px 14px;
93
+ background: #f7f8fa;
94
+ border-bottom: 1px solid #e5e6eb;
95
+ }
96
+ .lite-pivot-title-wrap { display: block; }
97
+ .lite-pivot-title { margin: 0; font-size: 13px; font-weight: 600; color: #1d2129; }
98
+ .lite-pivot-meta { font-size: 11px; color: #86909c; display: block; margin-top: 2px; }
99
+ .lite-pivot-measure {
100
+ font-size: 11px;
101
+ font-weight: 600;
102
+ color: #165dff;
103
+ background: #e8f3ff;
104
+ padding: 2px 8px;
105
+ border-radius: 4px;
106
+ }
107
+ .lite-pivot-table-wrap { overflow-x: auto; }
108
+ .lite-pivot-table { width: 100%; border-collapse: collapse; text-align: left; font-size: 11px; }
109
+ .lite-pivot-table th {
110
+ padding: 8px 12px;
111
+ background: #f2f3f5;
112
+ border-bottom: 1px solid #e5e6eb;
113
+ border-right: 1px solid #e5e6eb;
114
+ color: #4e5969;
115
+ font-weight: 600;
116
+ }
117
+ .lite-th-coldim, .lite-th-rowtotal, .lite-td-cell, .lite-td-rowtotal, .lite-td-coltotal, .lite-td-grandall {
118
+ text-align: right;
119
+ }
120
+ .lite-th-rowtotal { background: #e8f3ff; color: #165dff; }
121
+ .lite-pivot-table td {
122
+ padding: 8px 12px;
123
+ border-bottom: 1px solid #f2f3f5;
124
+ border-right: 1px solid #f2f3f5;
125
+ color: #1d2129;
126
+ }
127
+ .lite-td-rowname { font-weight: 600; background: #fafbfc; }
128
+ .lite-td-cell { font-family: monospace; }
129
+ .lite-td-rowtotal { font-family: monospace; font-weight: 600; background: #fafbfc; }
130
+ .lite-tr-grandtotal td {
131
+ border-top: 2px solid #e5e6eb;
132
+ background: #f7f8fa;
133
+ font-weight: 700;
134
+ }
135
+ .lite-td-grandlabel { color: #1d2129; }
136
+ .lite-td-coltotal { font-family: monospace; }
137
+ .lite-td-grandall { font-family: monospace; color: #165dff; font-size: 12px; }
138
+ </style>
@@ -0,0 +1,18 @@
1
+ interface Props {
2
+ title?: string;
3
+ rowDimensionLabel?: string;
4
+ colDimensionLabel?: string;
5
+ measureLabel?: string;
6
+ cols?: string[];
7
+ rows?: {
8
+ name: string;
9
+ cells: (number | string)[];
10
+ total: number | string;
11
+ }[];
12
+ grandTotals?: (number | string)[];
13
+ grandTotalAll?: number | string;
14
+ class?: string;
15
+ }
16
+ declare const LitePivotMatrix: import("svelte").Component<Props, {}, "">;
17
+ type LitePivotMatrix = ReturnType<typeof LitePivotMatrix>;
18
+ export default LitePivotMatrix;
@@ -0,0 +1,96 @@
1
+ <script lang="ts">
2
+ interface Quota {
3
+ label: string;
4
+ current: number;
5
+ limit: number;
6
+ unit?: string;
7
+ }
8
+
9
+ interface Props {
10
+ planName?: string;
11
+ quotas?: Quota[];
12
+ resetDateText?: string;
13
+ class?: string;
14
+ }
15
+
16
+ let {
17
+ planName = 'Enterprise Scale',
18
+ quotas = [
19
+ { label: 'API Requests', current: 75000, limit: 100000, unit: 'req' },
20
+ { label: 'Storage', current: 18, limit: 20, unit: 'GB' },
21
+ ],
22
+ resetDateText = '2026-12-01',
23
+ class: className = '',
24
+ }: Props = $props();
25
+
26
+ function calcPct(current: number, limit: number): number {
27
+ if (limit <= 0) return 0;
28
+ return Math.max(0, Math.min(100, Math.round((current / limit) * 100)));
29
+ }
30
+ </script>
31
+
32
+ <div
33
+ class="lite-plan-quota {className}"
34
+ data-svadmin-component="LitePlanUsageQuotaBar"
35
+ role="region"
36
+ aria-label="Plan Usage Quotas"
37
+ >
38
+ <header class="lite-quota-header">
39
+ <div>
40
+ <h4 class="lite-quota-title">{planName}</h4>
41
+ {#if resetDateText}
42
+ <span class="lite-quota-reset">重置周期: {resetDateText}</span>
43
+ {/if}
44
+ </div>
45
+ </header>
46
+
47
+ <div class="lite-quota-body">
48
+ {#each quotas as q (q.label)}
49
+ {@const pct = calcPct(q.current, q.limit)}
50
+ <div class="lite-quota-item">
51
+ <div class="lite-quota-labels">
52
+ <span class="lite-quota-name">{q.label}</span>
53
+ <span class="lite-quota-values">{q.current} / {q.limit} {q.unit ?? ''} ({pct}%)</span>
54
+ </div>
55
+ <div class="lite-quota-track">
56
+ <div
57
+ class="lite-quota-bar"
58
+ class:lite-bar-warn={pct >= 80 && pct < 95}
59
+ class:lite-bar-danger={pct >= 95}
60
+ style="width: {pct}%;"
61
+ ></div>
62
+ </div>
63
+ </div>
64
+ {/each}
65
+ </div>
66
+ </div>
67
+
68
+ <style>
69
+ .lite-plan-quota {
70
+ border: 1px solid #e5e6eb;
71
+ border-radius: 6px;
72
+ background: #ffffff;
73
+ font-size: 12px;
74
+ overflow: hidden;
75
+ }
76
+ .lite-quota-header {
77
+ display: flex;
78
+ justify-content: space-between;
79
+ align-items: center;
80
+ padding: 10px 14px;
81
+ background: #f7f8fa;
82
+ border-bottom: 1px solid #e5e6eb;
83
+ }
84
+ .lite-quota-title { margin: 0; font-size: 13px; font-weight: 600; color: #1d2129; }
85
+ .lite-quota-reset { font-size: 11px; color: #86909c; font-family: monospace; display: block; margin-top: 2px; }
86
+ .lite-quota-body { padding: 12px 14px; }
87
+ .lite-quota-item { margin-bottom: 10px; }
88
+ .lite-quota-item:last-child { margin-bottom: 0; }
89
+ .lite-quota-labels { display: flex; justify-content: space-between; margin-bottom: 4px; font-size: 11px; font-family: monospace; }
90
+ .lite-quota-name { font-weight: 500; color: #4e5969; font-family: sans-serif; }
91
+ .lite-quota-values { color: #1d2129; font-weight: 600; }
92
+ .lite-quota-track { height: 6px; background: #f2f3f5; border-radius: 3px; overflow: hidden; }
93
+ .lite-quota-bar { height: 100%; background: #165dff; border-radius: 3px; }
94
+ .lite-bar-warn { background: #ff7d00; }
95
+ .lite-bar-danger { background: #f53f3f; }
96
+ </style>
@@ -0,0 +1,15 @@
1
+ interface Quota {
2
+ label: string;
3
+ current: number;
4
+ limit: number;
5
+ unit?: string;
6
+ }
7
+ interface Props {
8
+ planName?: string;
9
+ quotas?: Quota[];
10
+ resetDateText?: string;
11
+ class?: string;
12
+ }
13
+ declare const LitePlanUsageQuotaBar: import("svelte").Component<Props, {}, "">;
14
+ type LitePlanUsageQuotaBar = ReturnType<typeof LitePlanUsageQuotaBar>;
15
+ export default LitePlanUsageQuotaBar;
@@ -0,0 +1,85 @@
1
+ <script lang="ts">
2
+ interface Props {
3
+ title?: string;
4
+ queryText?: string;
5
+ contextName?: string;
6
+ explanation?: string;
7
+ class?: string;
8
+ }
9
+
10
+ let {
11
+ title = 'AI 规则语义解释卡片',
12
+ queryText = "WHERE region = 'East' AND amount >= 50000",
13
+ contextName = '大额核销清单',
14
+ explanation = '该查询用于筛选属于华东大区且结算金额不低于 5 万元的所有合规单据。',
15
+ class: className = '',
16
+ }: Props = $props();
17
+ </script>
18
+
19
+ <div
20
+ class="lite-query-explainer {className}"
21
+ data-svadmin-component="LiteQueryAiExplainer"
22
+ role="region"
23
+ aria-label="Query AI Explainer"
24
+ >
25
+ <header class="lite-explainer-header">
26
+ <div class="lite-explainer-title-wrap">
27
+ <span class="lite-explainer-icon">✨</span>
28
+ <h4 class="lite-explainer-title">{title}</h4>
29
+ <span class="lite-explainer-ctx">({contextName})</span>
30
+ </div>
31
+ </header>
32
+
33
+ <div class="lite-explainer-body">
34
+ <div class="lite-query-code">
35
+ <code>{queryText}</code>
36
+ </div>
37
+
38
+ <div class="lite-explanation-box">
39
+ <div class="lite-explanation-title">业务通俗口径解释:</div>
40
+ <div class="lite-explanation-content">{explanation}</div>
41
+ </div>
42
+ </div>
43
+ </div>
44
+
45
+ <style>
46
+ .lite-query-explainer {
47
+ border: 1px solid #e5e6eb;
48
+ border-radius: 6px;
49
+ background: #ffffff;
50
+ font-size: 12px;
51
+ overflow: hidden;
52
+ }
53
+ .lite-explainer-header {
54
+ display: flex;
55
+ justify-content: space-between;
56
+ align-items: center;
57
+ padding: 10px 14px;
58
+ background: #f7f8fa;
59
+ border-bottom: 1px solid #e5e6eb;
60
+ }
61
+ .lite-explainer-title-wrap { display: flex; align-items: center; }
62
+ .lite-explainer-title-wrap > * + * { margin-left: 6px; }
63
+ .lite-explainer-icon { color: #165dff; font-size: 12px; }
64
+ .lite-explainer-title { margin: 0; font-size: 13px; font-weight: 600; color: #1d2129; }
65
+ .lite-explainer-ctx { font-size: 11px; color: #86909c; }
66
+ .lite-explainer-body { padding: 12px 14px; }
67
+ .lite-query-code {
68
+ background: #f2f3f5;
69
+ padding: 8px 12px;
70
+ border-radius: 4px;
71
+ font-family: monospace;
72
+ font-size: 11px;
73
+ color: #1d2129;
74
+ margin-bottom: 10px;
75
+ overflow-x: auto;
76
+ }
77
+ .lite-explanation-box {
78
+ background: #e8f3ff;
79
+ border: 1px solid #bedaff;
80
+ border-radius: 6px;
81
+ padding: 10px 12px;
82
+ }
83
+ .lite-explanation-title { font-weight: 600; color: #165dff; font-size: 11px; margin-bottom: 4px; }
84
+ .lite-explanation-content { color: #1d2129; line-height: 1.5; font-size: 12px; }
85
+ </style>
@@ -0,0 +1,10 @@
1
+ interface Props {
2
+ title?: string;
3
+ queryText?: string;
4
+ contextName?: string;
5
+ explanation?: string;
6
+ class?: string;
7
+ }
8
+ declare const LiteQueryAiExplainer: import("svelte").Component<Props, {}, "">;
9
+ type LiteQueryAiExplainer = ReturnType<typeof LiteQueryAiExplainer>;
10
+ export default LiteQueryAiExplainer;