@svadmin/lite 0.27.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.
- package/dist/components/LiteAbacPolicyMatrix.svelte +128 -0
- package/dist/components/LiteAbacPolicyMatrix.svelte.d.ts +16 -0
- package/dist/components/LiteApiPlayground.svelte +103 -0
- package/dist/components/LiteApiPlayground.svelte.d.ts +10 -0
- package/dist/components/LiteApprovalChainBuilder.svelte +120 -0
- package/dist/components/LiteApprovalChainBuilder.svelte.d.ts +15 -0
- package/dist/components/LiteAuditTrailInspector.svelte +166 -0
- package/dist/components/LiteAuditTrailInspector.svelte.d.ts +23 -0
- package/dist/components/LiteBillingInvoiceDrawer.svelte +100 -0
- package/dist/components/LiteBillingInvoiceDrawer.svelte.d.ts +16 -0
- package/dist/components/LiteChartAnnotationOverlay.svelte +101 -0
- package/dist/components/LiteChartAnnotationOverlay.svelte.d.ts +16 -0
- package/dist/components/LiteColumnMappingTable.svelte +105 -0
- package/dist/components/LiteColumnMappingTable.svelte.d.ts +14 -0
- package/dist/components/LiteDashboardGridLayout.svelte +108 -0
- package/dist/components/LiteDashboardGridLayout.svelte.d.ts +16 -0
- package/dist/components/LiteDashboardLayoutStorage.svelte +88 -0
- package/dist/components/LiteDashboardLayoutStorage.svelte.d.ts +16 -0
- package/dist/components/LiteDataImportDropzone.svelte +89 -0
- package/dist/components/LiteDataImportDropzone.svelte.d.ts +10 -0
- package/dist/components/LiteDataLineageGraph.svelte +100 -0
- package/dist/components/LiteDataLineageGraph.svelte.d.ts +15 -0
- package/dist/components/LiteDataMaskPolicyEngine.svelte +131 -0
- package/dist/components/LiteDataMaskPolicyEngine.svelte.d.ts +16 -0
- package/dist/components/LiteDataScreenContainer.svelte +34 -0
- package/dist/components/LiteDataScreenContainer.svelte.d.ts +9 -0
- package/dist/components/LiteElectronicSealStamp.svelte +56 -0
- package/dist/components/LiteElectronicSealStamp.svelte.d.ts +9 -0
- package/dist/components/LiteEnvVariableEditor.svelte +114 -0
- package/dist/components/LiteEnvVariableEditor.svelte.d.ts +15 -0
- package/dist/components/LiteFormulaField.svelte +44 -0
- package/dist/components/LiteFormulaField.svelte.d.ts +11 -0
- package/dist/components/LiteGeoScatterMap.svelte +117 -0
- package/dist/components/LiteGeoScatterMap.svelte.d.ts +16 -0
- package/dist/components/LiteHmacSignatureCalculator.svelte +84 -0
- package/dist/components/LiteHmacSignatureCalculator.svelte.d.ts +10 -0
- package/dist/components/LiteImportPreviewValidator.svelte +136 -0
- package/dist/components/LiteImportPreviewValidator.svelte.d.ts +16 -0
- package/dist/components/LiteLiveStreamLogViewer.svelte +84 -0
- package/dist/components/LiteLiveStreamLogViewer.svelte.d.ts +14 -0
- package/dist/components/LiteOmnibarCommandPalette.svelte +111 -0
- package/dist/components/LiteOmnibarCommandPalette.svelte.d.ts +15 -0
- package/dist/components/LitePeriodComparisonCard.svelte +60 -0
- package/dist/components/LitePeriodComparisonCard.svelte.d.ts +11 -0
- package/dist/components/LitePermissionSimulator.svelte +90 -0
- package/dist/components/LitePermissionSimulator.svelte.d.ts +14 -0
- package/dist/components/LitePivotMatrix.svelte +138 -0
- package/dist/components/LitePivotMatrix.svelte.d.ts +18 -0
- package/dist/components/LitePlanUsageQuotaBar.svelte +96 -0
- package/dist/components/LitePlanUsageQuotaBar.svelte.d.ts +15 -0
- package/dist/components/LiteQueryAiExplainer.svelte +85 -0
- package/dist/components/LiteQueryAiExplainer.svelte.d.ts +10 -0
- package/dist/components/LiteScheduledJobManager.svelte +116 -0
- package/dist/components/LiteScheduledJobManager.svelte.d.ts +16 -0
- package/dist/components/LiteScreenAntiLeakGuard.svelte +56 -0
- package/dist/components/LiteScreenAntiLeakGuard.svelte.d.ts +8 -0
- package/dist/components/LiteSecureDataExporter.svelte +101 -0
- package/dist/components/LiteSecureDataExporter.svelte.d.ts +12 -0
- package/dist/components/LiteSqlConsole.svelte +128 -0
- package/dist/components/LiteSqlConsole.svelte.d.ts +16 -0
- package/dist/components/LiteSystemCapacityForecastCard.svelte +88 -0
- package/dist/components/LiteSystemCapacityForecastCard.svelte.d.ts +11 -0
- package/dist/components/LiteSystemHealthCheckDashboard.svelte +142 -0
- package/dist/components/LiteSystemHealthCheckDashboard.svelte.d.ts +18 -0
- package/dist/components/LiteTableAggregationFooter.svelte +76 -0
- package/dist/components/LiteTableAggregationFooter.svelte.d.ts +14 -0
- package/dist/components/LiteTenantContextSwitcher.svelte +173 -0
- package/dist/components/LiteTenantContextSwitcher.svelte.d.ts +27 -0
- package/dist/components/LiteTenantQuotasMatrix.svelte +117 -0
- package/dist/components/LiteTenantQuotasMatrix.svelte.d.ts +17 -0
- package/dist/components/LiteThreadedCommentDrawer.svelte +60 -0
- package/dist/components/LiteThreadedCommentDrawer.svelte.d.ts +15 -0
- package/dist/components/LiteTierFeatureComparison.svelte +97 -0
- package/dist/components/LiteTierFeatureComparison.svelte.d.ts +18 -0
- package/dist/components/LiteWebhookSimulator.svelte +120 -0
- package/dist/components/LiteWebhookSimulator.svelte.d.ts +11 -0
- package/dist/components/LiteWorkflowNodeInspector.svelte +79 -0
- package/dist/components/LiteWorkflowNodeInspector.svelte.d.ts +11 -0
- package/dist/index.d.ts +40 -0
- package/dist/index.js +47 -0
- package/package.json +2 -2
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
export interface TenantRole {
|
|
2
|
+
id: string;
|
|
3
|
+
name: string;
|
|
4
|
+
isPrimary?: boolean;
|
|
5
|
+
}
|
|
6
|
+
export interface TenantItem {
|
|
7
|
+
id: string;
|
|
8
|
+
name: string;
|
|
9
|
+
code?: string;
|
|
10
|
+
type?: 'group' | 'subsidiary' | 'division' | 'store' | 'workspace';
|
|
11
|
+
logo?: string;
|
|
12
|
+
tier?: 'free' | 'pro' | 'enterprise';
|
|
13
|
+
roles?: (TenantRole | string)[];
|
|
14
|
+
status?: 'active' | 'suspended' | 'trial';
|
|
15
|
+
memberCount?: number;
|
|
16
|
+
description?: string;
|
|
17
|
+
parentId?: string;
|
|
18
|
+
}
|
|
19
|
+
interface Props {
|
|
20
|
+
currentTenantId?: string;
|
|
21
|
+
tenants?: TenantItem[];
|
|
22
|
+
userRole?: string;
|
|
23
|
+
class?: string;
|
|
24
|
+
}
|
|
25
|
+
declare const LiteTenantContextSwitcher: import("svelte").Component<Props, {}, "">;
|
|
26
|
+
type LiteTenantContextSwitcher = ReturnType<typeof LiteTenantContextSwitcher>;
|
|
27
|
+
export default LiteTenantContextSwitcher;
|
|
@@ -0,0 +1,117 @@
|
|
|
1
|
+
<script lang="ts">
|
|
2
|
+
interface QuotaItem {
|
|
3
|
+
id: string;
|
|
4
|
+
resourceName: string;
|
|
5
|
+
used: number;
|
|
6
|
+
limit: number;
|
|
7
|
+
unit: string;
|
|
8
|
+
status?: 'normal' | 'warning' | 'exhausted';
|
|
9
|
+
}
|
|
10
|
+
|
|
11
|
+
interface Props {
|
|
12
|
+
tenantName?: string;
|
|
13
|
+
tierName?: string;
|
|
14
|
+
quotas?: QuotaItem[];
|
|
15
|
+
class?: string;
|
|
16
|
+
}
|
|
17
|
+
|
|
18
|
+
let {
|
|
19
|
+
tenantName = '上海创智多租户研发中心',
|
|
20
|
+
tierName = '旗舰尊享版 (Enterprise Tier)',
|
|
21
|
+
quotas = [
|
|
22
|
+
{ id: 'q1', resourceName: 'API 请求吞吐', used: 840000, limit: 1000000, unit: 'req/天', status: 'normal' },
|
|
23
|
+
{ id: 'q2', resourceName: '分布式对象存储', used: 480, limit: 500, unit: 'GB', status: 'warning' },
|
|
24
|
+
{ id: 'q3', resourceName: '组织席位数', used: 120, limit: 120, unit: '席位', status: 'exhausted' },
|
|
25
|
+
{ id: 'q4', resourceName: 'AI 智能算力点', used: 3200, limit: 10000, unit: '点', status: 'normal' }
|
|
26
|
+
],
|
|
27
|
+
class: className = '',
|
|
28
|
+
}: Props = $props();
|
|
29
|
+
|
|
30
|
+
function calcPct(u: number, l: number): number {
|
|
31
|
+
if (l <= 0) return 0;
|
|
32
|
+
return Math.min(100, Math.round((u / l) * 100));
|
|
33
|
+
}
|
|
34
|
+
</script>
|
|
35
|
+
|
|
36
|
+
<div
|
|
37
|
+
class="lite-tenant-quotas {className}"
|
|
38
|
+
data-svadmin-component="LiteTenantQuotasMatrix"
|
|
39
|
+
role="region"
|
|
40
|
+
aria-label="Tenant Quotas Matrix"
|
|
41
|
+
>
|
|
42
|
+
<header class="lite-quotas-header">
|
|
43
|
+
<div>
|
|
44
|
+
<h4 class="lite-quotas-tenant">{tenantName}</h4>
|
|
45
|
+
<span class="lite-quotas-tier">{tierName}</span>
|
|
46
|
+
</div>
|
|
47
|
+
</header>
|
|
48
|
+
|
|
49
|
+
<div class="lite-quotas-grid">
|
|
50
|
+
{#each quotas as q (q.id)}
|
|
51
|
+
{@const pct = calcPct(q.used, q.limit)}
|
|
52
|
+
<div class="lite-quota-card">
|
|
53
|
+
<div class="lite-card-top">
|
|
54
|
+
<span class="lite-card-name">{q.resourceName}</span>
|
|
55
|
+
<span class="lite-card-usage">{q.used.toLocaleString()} / {q.limit.toLocaleString()} {q.unit}</span>
|
|
56
|
+
</div>
|
|
57
|
+
<div class="lite-card-track">
|
|
58
|
+
<div
|
|
59
|
+
class="lite-card-bar"
|
|
60
|
+
class:lite-bar-warn={pct >= 85 && pct < 100}
|
|
61
|
+
class:lite-bar-danger={pct >= 100}
|
|
62
|
+
style="width: {pct}%;"
|
|
63
|
+
></div>
|
|
64
|
+
</div>
|
|
65
|
+
<div class="lite-card-bottom">
|
|
66
|
+
<span class="lite-card-pct">{pct}% 已用</span>
|
|
67
|
+
{#if pct >= 100}
|
|
68
|
+
<span class="lite-card-state text-danger">已达硬配额上限</span>
|
|
69
|
+
{:else if pct >= 85}
|
|
70
|
+
<span class="lite-card-state text-warn">接近用量预警线</span>
|
|
71
|
+
{:else}
|
|
72
|
+
<span class="lite-card-state text-ok">配额容量充裕</span>
|
|
73
|
+
{/if}
|
|
74
|
+
</div>
|
|
75
|
+
</div>
|
|
76
|
+
{/each}
|
|
77
|
+
</div>
|
|
78
|
+
</div>
|
|
79
|
+
|
|
80
|
+
<style>
|
|
81
|
+
.lite-tenant-quotas {
|
|
82
|
+
border: 1px solid #e5e6eb;
|
|
83
|
+
border-radius: 6px;
|
|
84
|
+
background: #ffffff;
|
|
85
|
+
font-size: 12px;
|
|
86
|
+
overflow: hidden;
|
|
87
|
+
}
|
|
88
|
+
.lite-quotas-header {
|
|
89
|
+
padding: 10px 14px;
|
|
90
|
+
background: #f7f8fa;
|
|
91
|
+
border-bottom: 1px solid #e5e6eb;
|
|
92
|
+
}
|
|
93
|
+
.lite-quotas-tenant { margin: 0; font-size: 13px; font-weight: 600; color: #1d2129; }
|
|
94
|
+
.lite-quotas-tier { font-size: 11px; color: #165dff; font-weight: 500; display: block; margin-top: 2px; }
|
|
95
|
+
.lite-quotas-grid { padding: 12px 14px; overflow: hidden; }
|
|
96
|
+
.lite-quotas-grid .lite-quota-card { float: left; width: calc(50% - 6px); margin: 0 12px 12px 0; box-sizing: border-box; }
|
|
97
|
+
.lite-quotas-grid .lite-quota-card:nth-child(2n) { margin-right: 0; }
|
|
98
|
+
@media (max-width: 640px) { .lite-quotas-grid .lite-quota-card { float: none; width: 100%; margin-right: 0; } }
|
|
99
|
+
.lite-quota-card {
|
|
100
|
+
border: 1px solid #f2f3f5;
|
|
101
|
+
border-radius: 4px;
|
|
102
|
+
padding: 10px;
|
|
103
|
+
background: #fafbfc;
|
|
104
|
+
}
|
|
105
|
+
.lite-card-top { display: flex; justify-content: space-between; margin-bottom: 6px; font-size: 11px; }
|
|
106
|
+
.lite-card-name { font-weight: 600; color: #1d2129; }
|
|
107
|
+
.lite-card-usage { font-family: monospace; color: #4e5969; }
|
|
108
|
+
.lite-card-track { height: 6px; background: #e5e6eb; border-radius: 3px; overflow: hidden; margin-bottom: 6px; }
|
|
109
|
+
.lite-card-bar { height: 100%; background: #165dff; border-radius: 3px; }
|
|
110
|
+
.lite-bar-warn { background: #ff7d00; }
|
|
111
|
+
.lite-bar-danger { background: #f53f3f; }
|
|
112
|
+
.lite-card-bottom { display: flex; justify-content: space-between; font-size: 10px; }
|
|
113
|
+
.lite-card-pct { font-family: monospace; font-weight: 600; color: #1d2129; }
|
|
114
|
+
.text-danger { color: #f53f3f; font-weight: 600; }
|
|
115
|
+
.text-warn { color: #ff7d00; font-weight: 600; }
|
|
116
|
+
.text-ok { color: #00b42a; }
|
|
117
|
+
</style>
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
interface QuotaItem {
|
|
2
|
+
id: string;
|
|
3
|
+
resourceName: string;
|
|
4
|
+
used: number;
|
|
5
|
+
limit: number;
|
|
6
|
+
unit: string;
|
|
7
|
+
status?: 'normal' | 'warning' | 'exhausted';
|
|
8
|
+
}
|
|
9
|
+
interface Props {
|
|
10
|
+
tenantName?: string;
|
|
11
|
+
tierName?: string;
|
|
12
|
+
quotas?: QuotaItem[];
|
|
13
|
+
class?: string;
|
|
14
|
+
}
|
|
15
|
+
declare const LiteTenantQuotasMatrix: import("svelte").Component<Props, {}, "">;
|
|
16
|
+
type LiteTenantQuotasMatrix = ReturnType<typeof LiteTenantQuotasMatrix>;
|
|
17
|
+
export default LiteTenantQuotasMatrix;
|
|
@@ -0,0 +1,60 @@
|
|
|
1
|
+
<script lang="ts">
|
|
2
|
+
export interface LiteComment {
|
|
3
|
+
id: string;
|
|
4
|
+
author: string;
|
|
5
|
+
content: string;
|
|
6
|
+
createdAt: string;
|
|
7
|
+
}
|
|
8
|
+
|
|
9
|
+
interface Props {
|
|
10
|
+
comments?: LiteComment[];
|
|
11
|
+
title?: string;
|
|
12
|
+
action?: string;
|
|
13
|
+
class?: string;
|
|
14
|
+
}
|
|
15
|
+
|
|
16
|
+
let {
|
|
17
|
+
comments = [],
|
|
18
|
+
title = 'Comments',
|
|
19
|
+
action = '/comments/create',
|
|
20
|
+
class: className = '',
|
|
21
|
+
}: Props = $props();
|
|
22
|
+
</script>
|
|
23
|
+
|
|
24
|
+
<div
|
|
25
|
+
class="lite-comment-box {className}"
|
|
26
|
+
data-svadmin-component="LiteThreadedCommentDrawer"
|
|
27
|
+
>
|
|
28
|
+
<h4 class="lite-comment-title">{title}</h4>
|
|
29
|
+
<ul class="lite-comment-list">
|
|
30
|
+
{#each comments as c (c.id)}
|
|
31
|
+
<li class="lite-comment-item">
|
|
32
|
+
<div class="lite-comment-head">
|
|
33
|
+
<span class="lite-comment-author">{c.author}</span>
|
|
34
|
+
<span class="lite-comment-time">{c.createdAt}</span>
|
|
35
|
+
</div>
|
|
36
|
+
<p class="lite-comment-content">{c.content}</p>
|
|
37
|
+
</li>
|
|
38
|
+
{/each}
|
|
39
|
+
</ul>
|
|
40
|
+
|
|
41
|
+
<form {action} method="POST" class="lite-comment-form">
|
|
42
|
+
<textarea name="content" required placeholder="Leave a reply..." class="lite-comment-input"></textarea>
|
|
43
|
+
<button type="submit" class="lite-comment-btn">Submit Reply</button>
|
|
44
|
+
</form>
|
|
45
|
+
</div>
|
|
46
|
+
|
|
47
|
+
<style>
|
|
48
|
+
.lite-comment-box { border: 1px solid #e5e6eb; border-radius: 8px; background: #ffffff; padding: 16px; font-size: 12px; }
|
|
49
|
+
.lite-comment-title { font-size: 14px; font-weight: 600; margin: 0 0 12px 0; color: #1d2129; }
|
|
50
|
+
.lite-comment-list { list-style: none; margin: 0 0 16px 0; padding: 0; }
|
|
51
|
+
.lite-comment-item { border-bottom: 1px solid #f2f3f5; padding: 8px 0; }
|
|
52
|
+
.lite-comment-head { display: flex; justify-content: space-between; margin-bottom: 4px; }
|
|
53
|
+
.lite-comment-author { font-weight: 600; color: #1d2129; }
|
|
54
|
+
.lite-comment-time { color: #86909c; font-size: 11px; }
|
|
55
|
+
.lite-comment-content { margin: 0; color: #4e5969; }
|
|
56
|
+
.lite-comment-form { display: flex; flex-direction: column; }
|
|
57
|
+
.lite-comment-form > * + * { margin-top: 8px; }
|
|
58
|
+
.lite-comment-input { height: 60px; border: 1px solid #e5e6eb; border-radius: 4px; padding: 6px 10px; font-size: 12px; }
|
|
59
|
+
.lite-comment-btn { height: 32px; background: #165dff; color: #fff; border: none; border-radius: 4px; font-size: 12px; font-weight: 600; cursor: pointer; }
|
|
60
|
+
</style>
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
export interface LiteComment {
|
|
2
|
+
id: string;
|
|
3
|
+
author: string;
|
|
4
|
+
content: string;
|
|
5
|
+
createdAt: string;
|
|
6
|
+
}
|
|
7
|
+
interface Props {
|
|
8
|
+
comments?: LiteComment[];
|
|
9
|
+
title?: string;
|
|
10
|
+
action?: string;
|
|
11
|
+
class?: string;
|
|
12
|
+
}
|
|
13
|
+
declare const LiteThreadedCommentDrawer: import("svelte").Component<Props, {}, "">;
|
|
14
|
+
type LiteThreadedCommentDrawer = ReturnType<typeof LiteThreadedCommentDrawer>;
|
|
15
|
+
export default LiteThreadedCommentDrawer;
|
|
@@ -0,0 +1,97 @@
|
|
|
1
|
+
<script lang="ts">
|
|
2
|
+
interface Tier {
|
|
3
|
+
key: string;
|
|
4
|
+
name: string;
|
|
5
|
+
price: string;
|
|
6
|
+
isCurrent?: boolean;
|
|
7
|
+
}
|
|
8
|
+
|
|
9
|
+
interface Feature {
|
|
10
|
+
name: string;
|
|
11
|
+
values: Record<string, boolean | string>;
|
|
12
|
+
}
|
|
13
|
+
|
|
14
|
+
interface Props {
|
|
15
|
+
tiers?: Tier[];
|
|
16
|
+
features?: Feature[];
|
|
17
|
+
class?: string;
|
|
18
|
+
}
|
|
19
|
+
|
|
20
|
+
let {
|
|
21
|
+
tiers = [
|
|
22
|
+
{ key: 'starter', name: 'Starter', price: '$29/mo', isCurrent: true },
|
|
23
|
+
{ key: 'pro', name: 'Pro', price: '$99/mo' },
|
|
24
|
+
],
|
|
25
|
+
features = [
|
|
26
|
+
{ name: 'Multi-tenant', values: { starter: true, pro: true } },
|
|
27
|
+
{ name: 'Seats', values: { starter: '5', pro: '50' } },
|
|
28
|
+
{ name: 'Dedicated support', values: { starter: false, pro: true } },
|
|
29
|
+
],
|
|
30
|
+
class: className = '',
|
|
31
|
+
}: Props = $props();
|
|
32
|
+
</script>
|
|
33
|
+
|
|
34
|
+
<div
|
|
35
|
+
class="lite-tier-comparison {className}"
|
|
36
|
+
data-svadmin-component="LiteTierFeatureComparison"
|
|
37
|
+
role="region"
|
|
38
|
+
aria-label="Tier Feature Comparison"
|
|
39
|
+
>
|
|
40
|
+
<table class="lite-tier-table">
|
|
41
|
+
<thead>
|
|
42
|
+
<tr>
|
|
43
|
+
<th class="lite-tier-feat-th">功能特性</th>
|
|
44
|
+
{#each tiers as t (t.key)}
|
|
45
|
+
<th class="lite-tier-th">
|
|
46
|
+
<span class="lite-tier-name">{t.name}</span>
|
|
47
|
+
<span class="lite-tier-price">{t.price}</span>
|
|
48
|
+
{#if t.isCurrent}
|
|
49
|
+
<span class="lite-tier-current">当前套餐</span>
|
|
50
|
+
{/if}
|
|
51
|
+
</th>
|
|
52
|
+
{/each}
|
|
53
|
+
</tr>
|
|
54
|
+
</thead>
|
|
55
|
+
<tbody>
|
|
56
|
+
{#each features as feat (feat.name)}
|
|
57
|
+
<tr>
|
|
58
|
+
<td class="lite-tier-feat-td">{feat.name}</td>
|
|
59
|
+
{#each tiers as t (t.key)}
|
|
60
|
+
{@const val = feat.values[t.key]}
|
|
61
|
+
<td class="lite-tier-val-td">
|
|
62
|
+
{#if val === true}
|
|
63
|
+
<span class="lite-check">✓</span>
|
|
64
|
+
{:else if val === false}
|
|
65
|
+
<span class="lite-dash">—</span>
|
|
66
|
+
{:else}
|
|
67
|
+
<span class="lite-val-text">{val}</span>
|
|
68
|
+
{/if}
|
|
69
|
+
</td>
|
|
70
|
+
{/each}
|
|
71
|
+
</tr>
|
|
72
|
+
{/each}
|
|
73
|
+
</tbody>
|
|
74
|
+
</table>
|
|
75
|
+
</div>
|
|
76
|
+
|
|
77
|
+
<style>
|
|
78
|
+
.lite-tier-comparison {
|
|
79
|
+
border: 1px solid #e5e6eb;
|
|
80
|
+
border-radius: 6px;
|
|
81
|
+
background: #ffffff;
|
|
82
|
+
overflow-x: auto;
|
|
83
|
+
font-size: 12px;
|
|
84
|
+
}
|
|
85
|
+
.lite-tier-table { width: 100%; border-collapse: collapse; }
|
|
86
|
+
.lite-tier-table th, .lite-tier-table td { padding: 8px 12px; border-bottom: 1px solid #e5e6eb; }
|
|
87
|
+
.lite-tier-feat-th { text-align: left; color: #4e5969; font-weight: 600; width: 40%; }
|
|
88
|
+
.lite-tier-th { text-align: center; background: #f7f8fa; width: 30%; }
|
|
89
|
+
.lite-tier-name { display: block; font-weight: 700; color: #1d2129; }
|
|
90
|
+
.lite-tier-price { display: block; font-family: monospace; color: #165dff; font-weight: 600; margin-top: 2px; }
|
|
91
|
+
.lite-tier-current { display: inline-block; font-size: 10px; background: #e5e6eb; color: #4e5969; padding: 1px 6px; border-radius: 3px; margin-top: 4px; }
|
|
92
|
+
.lite-tier-feat-td { color: #1d2129; font-weight: 500; }
|
|
93
|
+
.lite-tier-val-td { text-align: center; }
|
|
94
|
+
.lite-check { color: #00b42a; font-weight: 700; }
|
|
95
|
+
.lite-dash { color: #86909c; }
|
|
96
|
+
.lite-val-text { font-family: monospace; font-weight: 600; color: #1d2129; }
|
|
97
|
+
</style>
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
interface Tier {
|
|
2
|
+
key: string;
|
|
3
|
+
name: string;
|
|
4
|
+
price: string;
|
|
5
|
+
isCurrent?: boolean;
|
|
6
|
+
}
|
|
7
|
+
interface Feature {
|
|
8
|
+
name: string;
|
|
9
|
+
values: Record<string, boolean | string>;
|
|
10
|
+
}
|
|
11
|
+
interface Props {
|
|
12
|
+
tiers?: Tier[];
|
|
13
|
+
features?: Feature[];
|
|
14
|
+
class?: string;
|
|
15
|
+
}
|
|
16
|
+
declare const LiteTierFeatureComparison: import("svelte").Component<Props, {}, "">;
|
|
17
|
+
type LiteTierFeatureComparison = ReturnType<typeof LiteTierFeatureComparison>;
|
|
18
|
+
export default LiteTierFeatureComparison;
|
|
@@ -0,0 +1,120 @@
|
|
|
1
|
+
<script lang="ts">
|
|
2
|
+
interface Props {
|
|
3
|
+
endpoint?: string;
|
|
4
|
+
eventType?: string;
|
|
5
|
+
payload?: string | Record<string, unknown>;
|
|
6
|
+
statusCode?: number;
|
|
7
|
+
durationMs?: number;
|
|
8
|
+
class?: string;
|
|
9
|
+
}
|
|
10
|
+
|
|
11
|
+
let {
|
|
12
|
+
endpoint = 'https://api.example.com/webhooks',
|
|
13
|
+
eventType = 'order.payment_succeeded',
|
|
14
|
+
payload = { event: 'order.payment_succeeded', amount: 99.5 },
|
|
15
|
+
statusCode = 200,
|
|
16
|
+
durationMs = 85,
|
|
17
|
+
class: className = '',
|
|
18
|
+
}: Props = $props();
|
|
19
|
+
|
|
20
|
+
const formattedPayload = $derived.by(() => {
|
|
21
|
+
if (typeof payload === 'string') return payload;
|
|
22
|
+
try {
|
|
23
|
+
return JSON.stringify(payload, null, 2);
|
|
24
|
+
} catch {
|
|
25
|
+
return String(payload);
|
|
26
|
+
}
|
|
27
|
+
});
|
|
28
|
+
</script>
|
|
29
|
+
|
|
30
|
+
<div
|
|
31
|
+
class="lite-webhook-simulator {className}"
|
|
32
|
+
data-svadmin-component="LiteWebhookSimulator"
|
|
33
|
+
role="region"
|
|
34
|
+
aria-label="Webhook Simulator"
|
|
35
|
+
>
|
|
36
|
+
<header class="lite-webhook-header">
|
|
37
|
+
<span class="lite-webhook-title">Webhook 投递模拟器 (SSR)</span>
|
|
38
|
+
<span class="lite-webhook-badge">模拟沙箱</span>
|
|
39
|
+
</header>
|
|
40
|
+
|
|
41
|
+
<div class="lite-webhook-body">
|
|
42
|
+
<div class="lite-webhook-field">
|
|
43
|
+
<span class="lite-field-label">事件类型:</span>
|
|
44
|
+
<code class="lite-field-val">{eventType}</code>
|
|
45
|
+
</div>
|
|
46
|
+
<div class="lite-webhook-field">
|
|
47
|
+
<span class="lite-field-label">接收端点:</span>
|
|
48
|
+
<code class="lite-field-val">{endpoint}</code>
|
|
49
|
+
</div>
|
|
50
|
+
|
|
51
|
+
<div class="lite-webhook-payload">
|
|
52
|
+
<span class="lite-field-label">请求载荷 (JSON):</span>
|
|
53
|
+
<pre class="lite-payload-code"><code>{formattedPayload}</code></pre>
|
|
54
|
+
</div>
|
|
55
|
+
|
|
56
|
+
{#if statusCode}
|
|
57
|
+
<div class="lite-webhook-result" class:lite-res-ok={statusCode >= 200 && statusCode < 300}>
|
|
58
|
+
<span>HTTP {statusCode} {statusCode === 200 ? 'OK' : ''}</span>
|
|
59
|
+
{#if durationMs}
|
|
60
|
+
<span class="lite-res-time">{durationMs}ms</span>
|
|
61
|
+
{/if}
|
|
62
|
+
</div>
|
|
63
|
+
{/if}
|
|
64
|
+
</div>
|
|
65
|
+
</div>
|
|
66
|
+
|
|
67
|
+
<style>
|
|
68
|
+
.lite-webhook-simulator {
|
|
69
|
+
border: 1px solid #e5e6eb;
|
|
70
|
+
border-radius: 6px;
|
|
71
|
+
background: #ffffff;
|
|
72
|
+
font-size: 12px;
|
|
73
|
+
overflow: hidden;
|
|
74
|
+
}
|
|
75
|
+
.lite-webhook-header {
|
|
76
|
+
display: flex;
|
|
77
|
+
justify-content: space-between;
|
|
78
|
+
align-items: center;
|
|
79
|
+
padding: 8px 12px;
|
|
80
|
+
background: #f7f8fa;
|
|
81
|
+
border-bottom: 1px solid #e5e6eb;
|
|
82
|
+
}
|
|
83
|
+
.lite-webhook-title { font-weight: 600; color: #1d2129; }
|
|
84
|
+
.lite-webhook-badge { font-size: 10px; background: #e8f3ff; color: #165dff; padding: 1px 6px; border-radius: 3px; font-mono: true; }
|
|
85
|
+
.lite-webhook-body { padding: 12px; space-y: 8px; }
|
|
86
|
+
.lite-webhook-field { display: flex; align-items: baseline; margin-bottom: 6px; font-family: monospace; }
|
|
87
|
+
.lite-webhook-field > * + * { margin-left: 8px; }
|
|
88
|
+
.lite-field-label { color: #86909c; min-width: 70px; font-sans: true; }
|
|
89
|
+
.lite-field-val { color: #1d2129; word-break: break-all; }
|
|
90
|
+
.lite-webhook-payload { margin-top: 8px; }
|
|
91
|
+
.lite-payload-code {
|
|
92
|
+
margin: 4px 0 0;
|
|
93
|
+
padding: 8px;
|
|
94
|
+
background: #f7f8fa;
|
|
95
|
+
border: 1px solid #e5e6eb;
|
|
96
|
+
border-radius: 4px;
|
|
97
|
+
font-family: monospace;
|
|
98
|
+
font-size: 11px;
|
|
99
|
+
color: #1d2129;
|
|
100
|
+
white-space: pre-wrap;
|
|
101
|
+
max-height: 160px;
|
|
102
|
+
overflow: auto;
|
|
103
|
+
}
|
|
104
|
+
.lite-webhook-result {
|
|
105
|
+
margin-top: 10px;
|
|
106
|
+
padding: 6px 10px;
|
|
107
|
+
border-radius: 4px;
|
|
108
|
+
font-family: monospace;
|
|
109
|
+
font-weight: 600;
|
|
110
|
+
display: flex;
|
|
111
|
+
justify-content: space-between;
|
|
112
|
+
background: #ffece8;
|
|
113
|
+
color: #f53f3f;
|
|
114
|
+
}
|
|
115
|
+
.lite-webhook-result.lite-res-ok {
|
|
116
|
+
background: #e8ffea;
|
|
117
|
+
color: #00b42a;
|
|
118
|
+
}
|
|
119
|
+
.lite-res-time { font-weight: normal; opacity: 0.8; }
|
|
120
|
+
</style>
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
interface Props {
|
|
2
|
+
endpoint?: string;
|
|
3
|
+
eventType?: string;
|
|
4
|
+
payload?: string | Record<string, unknown>;
|
|
5
|
+
statusCode?: number;
|
|
6
|
+
durationMs?: number;
|
|
7
|
+
class?: string;
|
|
8
|
+
}
|
|
9
|
+
declare const LiteWebhookSimulator: import("svelte").Component<Props, {}, "">;
|
|
10
|
+
type LiteWebhookSimulator = ReturnType<typeof LiteWebhookSimulator>;
|
|
11
|
+
export default LiteWebhookSimulator;
|
|
@@ -0,0 +1,79 @@
|
|
|
1
|
+
<script lang="ts">
|
|
2
|
+
interface Props {
|
|
3
|
+
title?: string;
|
|
4
|
+
nodeName?: string;
|
|
5
|
+
nodeType?: string;
|
|
6
|
+
approverRole?: string;
|
|
7
|
+
approvalMode?: string;
|
|
8
|
+
class?: string;
|
|
9
|
+
}
|
|
10
|
+
|
|
11
|
+
let {
|
|
12
|
+
title = '流程节点属性检查器 (SSR 静态面板)',
|
|
13
|
+
nodeName = '部门主管审批节点',
|
|
14
|
+
nodeType = '审批节点',
|
|
15
|
+
approverRole = '直属部门经理',
|
|
16
|
+
approvalMode = '会签 (全员同意)',
|
|
17
|
+
class: className = '',
|
|
18
|
+
}: Props = $props();
|
|
19
|
+
</script>
|
|
20
|
+
|
|
21
|
+
<div
|
|
22
|
+
class="lite-node-inspector {className}"
|
|
23
|
+
data-svadmin-component="LiteWorkflowNodeInspector"
|
|
24
|
+
role="region"
|
|
25
|
+
aria-label="Workflow Node Inspector"
|
|
26
|
+
>
|
|
27
|
+
<header class="lite-insp-header">
|
|
28
|
+
<span class="lite-insp-icon">⚙️</span>
|
|
29
|
+
<h4 class="lite-insp-title">{title}</h4>
|
|
30
|
+
</header>
|
|
31
|
+
|
|
32
|
+
<div class="lite-insp-body">
|
|
33
|
+
<div class="lite-prop-row">
|
|
34
|
+
<span class="lite-prop-label">节点名称:</span>
|
|
35
|
+
<span class="lite-prop-val">{nodeName}</span>
|
|
36
|
+
</div>
|
|
37
|
+
<div class="lite-prop-row">
|
|
38
|
+
<span class="lite-prop-label">节点类型:</span>
|
|
39
|
+
<span class="lite-prop-val">{nodeType}</span>
|
|
40
|
+
</div>
|
|
41
|
+
<div class="lite-prop-row">
|
|
42
|
+
<span class="lite-prop-label">审批角色:</span>
|
|
43
|
+
<span class="lite-prop-val">{approverRole}</span>
|
|
44
|
+
</div>
|
|
45
|
+
<div class="lite-prop-row">
|
|
46
|
+
<span class="lite-prop-label">流转模式:</span>
|
|
47
|
+
<span class="lite-prop-val">{approvalMode}</span>
|
|
48
|
+
</div>
|
|
49
|
+
</div>
|
|
50
|
+
</div>
|
|
51
|
+
|
|
52
|
+
<style>
|
|
53
|
+
.lite-node-inspector {
|
|
54
|
+
border: 1px solid #e5e6eb;
|
|
55
|
+
border-radius: 6px;
|
|
56
|
+
background: #ffffff;
|
|
57
|
+
font-size: 12px;
|
|
58
|
+
overflow: hidden;
|
|
59
|
+
}
|
|
60
|
+
.lite-insp-header {
|
|
61
|
+
display: flex;
|
|
62
|
+
align-items: center;
|
|
63
|
+
padding: 10px 14px;
|
|
64
|
+
background: #f7f8fa;
|
|
65
|
+
border-bottom: 1px solid #e5e6eb;
|
|
66
|
+
}
|
|
67
|
+
.lite-insp-icon { font-size: 14px; margin-right: 6px; }
|
|
68
|
+
.lite-insp-title { margin: 0; font-size: 13px; font-weight: 600; color: #1d2129; }
|
|
69
|
+
.lite-insp-body { padding: 12px 14px; }
|
|
70
|
+
.lite-prop-row {
|
|
71
|
+
display: flex;
|
|
72
|
+
justify-content: space-between;
|
|
73
|
+
padding: 6px 0;
|
|
74
|
+
border-bottom: 1px dashed #f2f3f5;
|
|
75
|
+
}
|
|
76
|
+
.lite-prop-row:last-child { border-bottom: none; }
|
|
77
|
+
.lite-prop-label { color: #86909c; }
|
|
78
|
+
.lite-prop-val { font-weight: 500; color: #1d2129; }
|
|
79
|
+
</style>
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
interface Props {
|
|
2
|
+
title?: string;
|
|
3
|
+
nodeName?: string;
|
|
4
|
+
nodeType?: string;
|
|
5
|
+
approverRole?: string;
|
|
6
|
+
approvalMode?: string;
|
|
7
|
+
class?: string;
|
|
8
|
+
}
|
|
9
|
+
declare const LiteWorkflowNodeInspector: import("svelte").Component<Props, {}, "">;
|
|
10
|
+
type LiteWorkflowNodeInspector = ReturnType<typeof LiteWorkflowNodeInspector>;
|
|
11
|
+
export default LiteWorkflowNodeInspector;
|
package/dist/index.d.ts
CHANGED
|
@@ -142,6 +142,46 @@ export { default as LiteKeyboardShortcutsModal } from './components/LiteKeyboard
|
|
|
142
142
|
export type { LiteStepItem } from './components/LiteStepWizard.svelte';
|
|
143
143
|
export type { LiteWorkflowNode } from './components/LiteWorkflowStepper.svelte';
|
|
144
144
|
export type { LiteShortcutItem } from './components/LiteKeyboardShortcutsModal.svelte';
|
|
145
|
+
export { default as LiteFormulaField } from './components/LiteFormulaField.svelte';
|
|
146
|
+
export { default as LiteDataScreenContainer } from './components/LiteDataScreenContainer.svelte';
|
|
147
|
+
export { default as LiteThreadedCommentDrawer } from './components/LiteThreadedCommentDrawer.svelte';
|
|
148
|
+
export type { LiteComment } from './components/LiteThreadedCommentDrawer.svelte';
|
|
149
|
+
export { default as LiteWebhookSimulator } from './components/LiteWebhookSimulator.svelte';
|
|
150
|
+
export { default as LiteHmacSignatureCalculator } from './components/LiteHmacSignatureCalculator.svelte';
|
|
151
|
+
export { default as LiteApiPlayground } from './components/LiteApiPlayground.svelte';
|
|
152
|
+
export { default as LitePlanUsageQuotaBar } from './components/LitePlanUsageQuotaBar.svelte';
|
|
153
|
+
export { default as LiteTierFeatureComparison } from './components/LiteTierFeatureComparison.svelte';
|
|
154
|
+
export { default as LiteBillingInvoiceDrawer } from './components/LiteBillingInvoiceDrawer.svelte';
|
|
155
|
+
export { default as LiteSqlConsole } from './components/LiteSqlConsole.svelte';
|
|
156
|
+
export { default as LiteEnvVariableEditor } from './components/LiteEnvVariableEditor.svelte';
|
|
157
|
+
export { default as LiteScheduledJobManager } from './components/LiteScheduledJobManager.svelte';
|
|
158
|
+
export { default as LiteTenantQuotasMatrix } from './components/LiteTenantQuotasMatrix.svelte';
|
|
159
|
+
export { default as LiteTableAggregationFooter } from './components/LiteTableAggregationFooter.svelte';
|
|
160
|
+
export { default as LiteSecureDataExporter } from './components/LiteSecureDataExporter.svelte';
|
|
161
|
+
export { default as LiteDataImportDropzone } from './components/LiteDataImportDropzone.svelte';
|
|
162
|
+
export { default as LiteColumnMappingTable } from './components/LiteColumnMappingTable.svelte';
|
|
163
|
+
export { default as LiteImportPreviewValidator } from './components/LiteImportPreviewValidator.svelte';
|
|
164
|
+
export { default as LiteApprovalChainBuilder } from './components/LiteApprovalChainBuilder.svelte';
|
|
165
|
+
export { default as LitePeriodComparisonCard } from './components/LitePeriodComparisonCard.svelte';
|
|
166
|
+
export { default as LitePivotMatrix } from './components/LitePivotMatrix.svelte';
|
|
167
|
+
export { default as LiteGeoScatterMap } from './components/LiteGeoScatterMap.svelte';
|
|
168
|
+
export { default as LiteDataMaskPolicyEngine } from './components/LiteDataMaskPolicyEngine.svelte';
|
|
169
|
+
export { default as LiteSystemHealthCheckDashboard } from './components/LiteSystemHealthCheckDashboard.svelte';
|
|
170
|
+
export { default as LiteQueryAiExplainer } from './components/LiteQueryAiExplainer.svelte';
|
|
171
|
+
export { default as LiteScreenAntiLeakGuard } from './components/LiteScreenAntiLeakGuard.svelte';
|
|
172
|
+
export { default as LiteDataLineageGraph } from './components/LiteDataLineageGraph.svelte';
|
|
173
|
+
export { default as LiteLiveStreamLogViewer } from './components/LiteLiveStreamLogViewer.svelte';
|
|
174
|
+
export { default as LiteElectronicSealStamp } from './components/LiteElectronicSealStamp.svelte';
|
|
175
|
+
export { default as LiteSystemCapacityForecastCard } from './components/LiteSystemCapacityForecastCard.svelte';
|
|
176
|
+
export { default as LiteTenantContextSwitcher } from './components/LiteTenantContextSwitcher.svelte';
|
|
177
|
+
export { default as LiteOmnibarCommandPalette } from './components/LiteOmnibarCommandPalette.svelte';
|
|
178
|
+
export { default as LiteAuditTrailInspector } from './components/LiteAuditTrailInspector.svelte';
|
|
179
|
+
export { default as LiteDashboardGridLayout } from './components/LiteDashboardGridLayout.svelte';
|
|
180
|
+
export { default as LiteDashboardLayoutStorage } from './components/LiteDashboardLayoutStorage.svelte';
|
|
181
|
+
export { default as LiteChartAnnotationOverlay } from './components/LiteChartAnnotationOverlay.svelte';
|
|
182
|
+
export { default as LiteAbacPolicyMatrix } from './components/LiteAbacPolicyMatrix.svelte';
|
|
183
|
+
export { default as LitePermissionSimulator } from './components/LitePermissionSimulator.svelte';
|
|
184
|
+
export { default as LiteWorkflowNodeInspector } from './components/LiteWorkflowNodeInspector.svelte';
|
|
145
185
|
export { configureMarkdownRenderer, escapeHtml, renderInlineMarkdown, renderMarkdown, renderRichContent, sanitizeRichTextHtml, } from './rich-content';
|
|
146
186
|
export type { MarkdownRenderOptions } from './rich-content';
|
|
147
187
|
export * from './components/compatibility/index';
|