Repository navigation
Expand file tree
/
Copy pathindex.html
More file actions
196 lines (196 loc) · 7.35 KB
/
Copy pathindex.html
File metadata and controls
196 lines (196 loc) · 7.35 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
<!doctype html>
<html lang="zh-CN">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width,initial-scale=1" />
<meta name="theme-color" content="#245743" />
<meta
name="description"
content="探索 SaaS 工作台案例资产：从标准业务主干到场景变体，查阅角色、对象、流程、页面、扩展点及关联参考实现与项目材料。"
/>
<title>ByteFolk · 工作台案例资产库</title>
<link rel="stylesheet" href="catalog/catalog.css" />
</head>
<body class="asset-library">
<header class="site-header">
<a class="brand" href="/" aria-label="ByteFolk 工作台案例资产库首页"
><span class="brand-mark">B<span>·</span></span
><span
>ByteFolk<span class="brand-divider">/</span
><small>工作台案例资产库</small></span
></a
>
<nav class="header-links" aria-label="网站导航">
<a href="docs/case-standard.md">资产规范</a
><a
href="https://github.com/bytefolk/workbench-examples"
target="_blank"
rel="noreferrer"
>GitHub <span aria-hidden="true">↗</span></a
>
</nav>
</header>
<main>
<section class="hero" aria-labelledby="page-title">
<div>
<div class="eyebrow"><span></span> WORKBENCH ASSET LIBRARY</div>
<h1 id="page-title">选一个业务主干，<span>延伸你的工作台。</span></h1>
<p>
标准主干定义共性，场景变体承载适配，参考实现与项目案例提供可查阅的材料。
</p>
</div>
<a class="button secondary hero-contribute" href="CONTRIBUTING.md"
>沉淀一份新资产 <span aria-hidden="true">↗</span></a
>
</section>
<section class="layer-section" aria-label="服务层">
<div id="service-models" class="service-models" aria-busy="true">
<div class="loading-panel" role="status">正在加载案例资产…</div>
</div>
</section>
<div id="catalog-error" class="catalog-error" role="alert" hidden>
<div>
<strong>资产目录暂时无法加载</strong>
<p id="error-message"></p>
</div>
<button id="retry" type="button">
重新加载 <span aria-hidden="true">↻</span>
</button>
</div>
<section
id="inventory"
class="inventory"
aria-label="当前服务层资产统计"
hidden
></section>
<div id="catalog-content" class="catalog-layout" hidden>
<aside class="category-panel" aria-labelledby="category-heading">
<div class="category-heading">
<h2 id="category-heading">
<span id="category-layer">SaaS</span> 业务分类
</h2>
<span id="domain-total" class="count-pill"></span>
</div>
<label class="group-selector"
><span>业务族</span
><select id="group-select" aria-label="筛选业务族"></select></label
><label class="search-box category-search"
><svg viewBox="0 0 24 24" aria-hidden="true">
<circle cx="10.5" cy="10.5" r="6.5"></circle>
<path d="m16 16 4 4"></path></svg
><input
id="domain-search"
type="search"
placeholder="查找分类，如 CRM、MES"
aria-label="查找子类"
/></label>
<div id="domains" class="domain-list" aria-label="业务分类导航"></div>
<p id="no-domains" class="no-domains" hidden>
没有匹配的分类，换个关键词试试。
</p>
<div class="category-footer">
<span></span>先选业务族，再进入具体分类
</div>
</aside>
<section class="results" aria-labelledby="results-title">
<div class="results-heading">
<div>
<nav
id="breadcrumb"
class="breadcrumb"
aria-label="当前分类"
></nav>
<h2 id="results-title">全部 SaaS 资产</h2>
<p id="domain-description"></p>
</div>
<span id="results-count" class="results-count"></span>
</div>
<div
class="asset-tabs"
id="asset-tabs"
role="tablist"
aria-label="资产类型"
></div>
<div class="results-toolbar">
<label class="search-box case-search"
><svg viewBox="0 0 24 24" aria-hidden="true">
<circle cx="10.5" cy="10.5" r="6.5"></circle>
<path d="m16 16 4 4"></path></svg
><input
id="search"
type="search"
placeholder="搜索主干、变体、行业或关键词…"
aria-label="搜索案例资产" /></label
><select id="industry-select" aria-label="筛选行业"></select>
</div>
<div class="results-context">
<p id="type-description"></p>
<span
id="summary"
class="catalog-summary"
aria-live="polite"
></span>
</div>
<div id="asset-results" role="tabpanel" tabindex="0">
<div id="cases" class="case-grid"></div>
<div id="empty" class="empty-state" hidden>
<div class="empty-symbol" aria-hidden="true">
<svg viewBox="0 0 48 48">
<path d="M8 14h12l4 5h16v20H8z" />
<path d="M8 24h32M21 30h6" />
</svg>
</div>
<span class="eyebrow">ROOM FOR THE NEXT IDEA</span>
<h3 id="empty-title">资产待沉淀</h3>
<p id="empty-description"></p>
<div class="empty-actions">
<button
id="clear-filter"
type="button"
class="button secondary"
hidden
>
清除检索条件</button
><a class="button primary" href="CONTRIBUTING.md"
>参与资产沉淀 <span aria-hidden="true">↗</span></a
>
</div>
</div>
</div>
<div class="catalog-note">
<svg viewBox="0 0 20 20" aria-hidden="true">
<path d="m10 2 6 3v5c0 4-6 7-6 7s-6-3-6-7V5z" />
<path d="m7 9 2 2 4-4" />
</svg>
<p>
全部分类、业务规格与关联材料均可直接浏览。运行入口的接入条件，以各实现说明为准。
</p>
</div>
</section>
</div>
<footer class="site-footer">
<span>BYTEFOLK <span>/</span> WORKBENCH ASSETS</span>
<p>让每一次实践，成为下一次的起点。</p>
<a href="CONTRIBUTING.md"
>贡献案例资产 <span aria-hidden="true">↗</span></a
>
</footer>
</main>
<dialog
id="asset-detail"
class="asset-detail"
aria-labelledby="detail-title"
>
<button
class="detail-close"
type="button"
data-close-detail
aria-label="关闭资产详情"
>
×
</button>
<div id="detail-content"></div>
</dialog>
<script type="module" src="catalog/app.mjs"></script>
</body>
</html>