Hugging Face's logo

Spaces:
echo3700
/
ai-echo
Running

App Files Community
echo3700 commited on
Commit
46b7cfe
·
verified ·
1 Parent(s): d5c1589

Add 3 files

Browse files
Files changed (3) hide show
  1. README.md +7 -5
  2. index.html +1044 -19
  3. prompts.txt +2 -0
README.md CHANGED
@@ -1,10 +1,12 @@
1
  ---
2
- title: Ai Echo
3
- emoji: 🔥
4
- colorFrom: green
5
- colorTo: green
6
  sdk: static
7
  pinned: false
 
 
8
  ---
9
 
10
- Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
 
1
  ---
2
+ title: ai-echo
3
+ emoji: 🐳
4
+ colorFrom: yellow
5
+ colorTo: purple
6
  sdk: static
7
  pinned: false
8
+ tags:
9
+ - deepsite
10
  ---
11
 
12
+ Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
index.html CHANGED
@@ -1,19 +1,1044 @@
1
- <!doctype html>
2
- <html>
3
- <head>
4
- <meta charset="utf-8" />
5
- <meta name="viewport" content="width=device-width" />
6
- <title>My static Space</title>
7
- <link rel="stylesheet" href="style.css" />
8
- </head>
9
- <body>
10
- <div class="card">
11
- <h1>Welcome to your static Space!</h1>
12
- <p>You can modify this app directly by editing <i>index.html</i> in the Files and versions tab.</p>
13
- <p>
14
- Also don't forget to check the
15
- <a href="https://huggingface.co/docs/hub/spaces" target="_blank">Spaces documentation</a>.
16
- </p>
17
- </div>
18
- </body>
19
- </html>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="zh-CN">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>江阴市人民医院 - 24小时无人超声自助诊疗室</title>
7
+ <script src="https://cdn.tailwindcss.com"></script>
8
+ <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
9
+ <style>
10
+ @keyframes pulse {
11
+ 0%, 100% { opacity: 1; }
12
+ 50% { opacity: 0.5; }
13
+ }
14
+ .pulse-animation {
15
+ animation: pulse 2s infinite;
16
+ }
17
+ .gradient-bg {
18
+ background: linear-gradient(135deg, #1e3a8a 0%, #3b82f6 100%);
19
+ }
20
+ .scan-area {
21
+ position: relative;
22
+ overflow: hidden;
23
+ }
24
+ .scan-area::before {
25
+ content: '';
26
+ position: absolute;
27
+ top: 0;
28
+ left: 0;
29
+ width: 100%;
30
+ height: 3px;
31
+ background: linear-gradient(90deg, transparent, #3b82f6, transparent);
32
+ animation: scan 3s linear infinite;
33
+ }
34
+ @keyframes scan {
35
+ 0% { top: 0; }
36
+ 100% { top: 100%; }
37
+ }
38
+ .modal {
39
+ transition: all 0.3s ease;
40
+ }
41
+ .modal-enter {
42
+ opacity: 0;
43
+ transform: scale(0.9);
44
+ }
45
+ .modal-enter-active {
46
+ opacity: 1;
47
+ transform: scale(1);
48
+ }
49
+ .modal-exit {
50
+ opacity: 1;
51
+ transform: scale(1);
52
+ }
53
+ .modal-exit-active {
54
+ opacity: 0;
55
+ transform: scale(0.9);
56
+ }
57
+ #previewImage {
58
+ max-height: 300px;
59
+ max-width: 100%;
60
+ }
61
+ #videoElement {
62
+ width: 100%;
63
+ height: auto;
64
+ background-color: #000;
65
+ }
66
+ #canvas {
67
+ display: none;
68
+ }
69
+ </style>
70
+ </head>
71
+ <body class="bg-gray-100 font-sans">
72
+ <!-- Header -->
73
+ <header class="gradient-bg text-white shadow-lg">
74
+ <div class="container mx-auto px-4 py-6">
75
+ <div class="flex justify-between items-center">
76
+ <div class="flex items-center space-x-4">
77
+ <i class="fas fa-hospital text-3xl"></i>
78
+ <div>
79
+ <h1 class="text-2xl font-bold">江阴市人民医院</h1>
80
+ <p class="text-sm opacity-80">24小时无人超声自助诊疗室</p>
81
+ </div>
82
+ </div>
83
+ <div class="hidden md:flex items-center space-x-6">
84
+ <a href="#services" class="hover:text-blue-200 transition">服务项目</a>
85
+ <a href="#process" class="hover:text-blue-200 transition">就诊流程</a>
86
+ <a href="#contact" class="hover:text-blue-200 transition">联系我们</a>
87
+ </div>
88
+ <button class="md:hidden text-2xl" id="mobile-menu-button">
89
+ <i class="fas fa-bars"></i>
90
+ </button>
91
+ </div>
92
+ </div>
93
+ </header>
94
+
95
+ <!-- Mobile Menu -->
96
+ <div class="md:hidden bg-white shadow-lg hidden" id="mobile-menu">
97
+ <div class="container mx-auto px-4 py-2 flex flex-col space-y-3">
98
+ <a href="#services" class="py-2 border-b border-gray-100">服务项目</a>
99
+ <a href="#process" class="py-2 border-b border-gray-100">就诊流程</a>
100
+ <a href="#contact" class="py-2">联系我们</a>
101
+ </div>
102
+ </div>
103
+
104
+ <!-- Hero Section -->
105
+ <section class="gradient-bg text-white py-16">
106
+ <div class="container mx-auto px-4 flex flex-col md:flex-row items-center">
107
+ <div class="md:w-1/2 mb-10 md:mb-0">
108
+ <h2 class="text-4xl font-bold mb-4">智能超声 自助诊疗</h2>
109
+ <p class="text-xl mb-6">24小时全天候服务，AI辅助诊断，专业医师远程指导</p>
110
+ <div class="flex flex-col sm:flex-row space-y-4 sm:space-y-0 sm:space-x-4">
111
+ <button class="bg-white text-blue-600 px-6 py-3 rounded-lg font-semibold hover:bg-blue-50 transition" id="start-btn">
112
+ 开始自助诊疗 <i class="fas fa-arrow-right ml-2"></i>
113
+ </button>
114
+ <button class="border border-white text-white px-6 py-3 rounded-lg font-semibold hover:bg-white hover:text-blue-600 transition" id="video-btn">
115
+ 观看操作视频 <i class="fas fa-play-circle ml-2"></i>
116
+ </button>
117
+ </div>
118
+ </div>
119
+ <div class="md:w-1/2 flex justify-center">
120
+ <div class="relative w-64 h-64 bg-white bg-opacity-20 rounded-lg flex items-center justify-center scan-area">
121
+ <div class="text-center p-4">
122
+ <i class="fas fa-qrcode text-6xl mb-4"></i>
123
+ <p class="text-sm">请扫描二维码上传检查资料</p>
124
+ </div>
125
+ </div>
126
+ </div>
127
+ </div>
128
+ </section>
129
+
130
+ <!-- Services Section -->
131
+ <section id="services" class="py-16 bg-white">
132
+ <div class="container mx-auto px-4">
133
+ <h2 class="text-3xl font-bold text-center mb-12">服务项目</h2>
134
+ <div class="grid md:grid-cols-3 gap-8">
135
+ <div class="bg-gray-50 p-6 rounded-lg shadow-sm hover:shadow-md transition">
136
+ <div class="text-blue-600 text-4xl mb-4">
137
+ <i class="fas fa-heartbeat"></i>
138
+ </div>
139
+ <h3 class="text-xl font-semibold mb-2">心脏超声检查</h3>
140
+ <p class="text-gray-600">包括心脏结构、功能评估，瓣膜活动情况，心包积液等检查项目</p>
141
+ </div>
142
+ <div class="bg-gray-50 p-6 rounded-lg shadow-sm hover:shadow-md transition">
143
+ <div class="text-blue-600 text-4xl mb-4">
144
+ <i class="fas fa-baby"></i>
145
+ </div>
146
+ <h3 class="text-xl font-semibold mb-2">腹部超声检查</h3>
147
+ <p class="text-gray-600">肝、胆、胰、脾、肾等腹部器官的形态学检查与功能评估</p>
148
+ </div>
149
+ <div class="bg-gray-50 p-6 rounded-lg shadow-sm hover:shadow-md transition">
150
+ <div class="text-blue-600 text-4xl mb-4">
151
+ <i class="fas fa-venus"></i>
152
+ </div>
153
+ <h3 class="text-xl font-semibold mb-2">妇科超声检查</h3>
154
+ <p class="text-gray-600">子宫、附件等妇科器官的常规检查与疾病筛查</p>
155
+ </div>
156
+ <div class="bg-gray-50 p-6 rounded-lg shadow-sm hover:shadow-md transition">
157
+ <div class="text-blue-600 text-4xl mb-4">
158
+ <i class="fas fa-procedures"></i>
159
+ </div>
160
+ <h3 class="text-xl font-semibold mb-2">甲状腺超声检查</h3>
161
+ <p class="text-gray-600">甲状腺形态、大小、血流及结节等病变的检查评估</p>
162
+ </div>
163
+ <div class="bg-gray-50 p-6 rounded-lg shadow-sm hover:shadow-md transition">
164
+ <div class="text-blue-600 text-4xl mb-4">
165
+ <i class="fas fa-vial"></i>
166
+ </div>
167
+ <h3 class="text-xl font-semibold mb-2">血管超声检查</h3>
168
+ <p class="text-gray-600">颈部血管、四肢血管等血管系统的结构与血流动力学检查</p>
169
+ </div>
170
+ <div class="bg-gray-50 p-6 rounded-lg shadow-sm hover:shadow-md transition">
171
+ <div class="text-blue-600 text-4xl mb-4">
172
+ <i class="fas fa-user-md"></i>
173
+ </div>
174
+ <h3 class="text-xl font-semibold mb-2">远程专家会诊</h3>
175
+ <p class="text-gray-600">疑难病例可申请三甲医院专家远程会诊服务</p>
176
+ </div>
177
+ </div>
178
+ </div>
179
+ </section>
180
+
181
+ <!-- Process Section -->
182
+ <section id="process" class="py-16 bg-gray-50">
183
+ <div class="container mx-auto px-4">
184
+ <h2 class="text-3xl font-bold text-center mb-12">就诊流程</h2>
185
+ <div class="relative">
186
+ <!-- Timeline line -->
187
+ <div class="hidden md:block absolute left-1/2 h-full w-1 bg-blue-200 transform -translate-x-1/2"></div>
188
+
189
+ <!-- Timeline items -->
190
+ <div class="space-y-8 md:space-y-0">
191
+ <!-- Step 1 -->
192
+ <div class="relative md:flex justify-center mb-8">
193
+ <div class="md:w-5/12 md:pr-8 md:text-right">
194
+ <div class="p-6 bg-white rounded-lg shadow-sm">
195
+ <h3 class="text-xl font-semibold text-blue-600 mb-2">1. 扫码预约</h3>
196
+ <p class="text-gray-600">扫描二维码上传个人信息和病史资料，完成预约登记</p>
197
+ </div>
198
+ </div>
199
+ <div class="hidden md:flex items-center justify-center md:w-2/12">
200
+ <div class="w-12 h-12 rounded-full bg-blue-600 text-white flex items-center justify-center text-xl font-bold">
201
+ 1
202
+ </div>
203
+ </div>
204
+ <div class="md:w-5/12"></div>
205
+ </div>
206
+
207
+ <!-- Step 2 -->
208
+ <div class="relative md:flex justify-center mb-8">
209
+ <div class="md:w-5/12"></div>
210
+ <div class="hidden md:flex items-center justify-center md:w-2/12">
211
+ <div class="w-12 h-12 rounded-full bg-blue-600 text-white flex items-center justify-center text-xl font-bold">
212
+ 2
213
+ </div>
214
+ </div>
215
+ <div class="md:w-5/12 md:pl-8">
216
+ <div class="p-6 bg-white rounded-lg shadow-sm">
217
+ <h3 class="text-xl font-semibold text-blue-600 mb-2">2. 自助检查</h3>
218
+ <p class="text-gray-600">按照语音和屏幕提示完成超声检查操作</p>
219
+ </div>
220
+ </div>
221
+ </div>
222
+
223
+ <!-- Step 3 -->
224
+ <div class="relative md:flex justify-center mb-8">
225
+ <div class="md:w-5/12 md:pr-8 md:text-right">
226
+ <div class="p-6 bg-white rounded-lg shadow-sm">
227
+ <h3 class="text-xl font-semibold text-blue-600 mb-2">3. AI初步诊断</h3>
228
+ <p class="text-gray-600">系统自动生成初步诊断报告，供医师参考</p>
229
+ </div>
230
+ </div>
231
+ <div class="hidden md:flex items-center justify-center md:w-2/12">
232
+ <div class="w-12 h-12 rounded-full bg-blue-600 text-white flex items-center justify-center text-xl font-bold">
233
+ 3
234
+ </div>
235
+ </div>
236
+ <div class="md:w-5/12"></div>
237
+ </div>
238
+
239
+ <!-- Step 4 -->
240
+ <div class="relative md:flex justify-center">
241
+ <div class="md:w-5/12"></div>
242
+ <div class="hidden md:flex items-center justify-center md:w-2/12">
243
+ <div class="w-12 h-12 rounded-full bg-blue-600 text-white flex items-center justify-center text-xl font-bold">
244
+ 4
245
+ </div>
246
+ </div>
247
+ <div class="md:w-5/12 md:pl-8">
248
+ <div class="p-6 bg-white rounded-lg shadow-sm">
249
+ <h3 class="text-xl font-semibold text-blue-600 mb-2">4. 获取报告</h3>
250
+ <p class="text-gray-600">医师审核后生成正式报告，可打印或电子版发送</p>
251
+ </div>
252
+ </div>
253
+ </div>
254
+ </div>
255
+ </div>
256
+ </div>
257
+ </section>
258
+
259
+ <!-- Features Section -->
260
+ <section class="py-16 bg-white">
261
+ <div class="container mx-auto px-4">
262
+ <h2 class="text-3xl font-bold text-center mb-12">技术优势</h2>
263
+ <div class="grid md:grid-cols-2 lg:grid-cols-4 gap-8">
264
+ <div class="text-center p-6">
265
+ <div class="w-20 h-20 bg-blue-100 rounded-full flex items-center justify-center mx-auto mb-4">
266
+ <i class="fas fa-robot text-blue-600 text-3xl"></i>
267
+ </div>
268
+ <h3 class="text-xl font-semibold mb-2">AI辅助诊断</h3>
269
+ <p class="text-gray-600">基于深度学习的智能分析系统，辅助医师提高诊断准确性</p>
270
+ </div>
271
+ <div class="text-center p-6">
272
+ <div class="w-20 h-20 bg-blue-100 rounded-full flex items-center justify-center mx-auto mb-4">
273
+ <i class="fas fa-cloud text-blue-600 text-3xl"></i>
274
+ </div>
275
+ <h3 class="text-xl font-semibold mb-2">云端存储</h3>
276
+ <p class="text-gray-600">所有检查数据安全存储在云端，随时可查</p>
277
+ </div>
278
+ <div class="text-center p-6">
279
+ <div class="w-20 h-20 bg-blue-100 rounded-full flex items-center justify-center mx-auto mb-4">
280
+ <i class="fas fa-shield-alt text-blue-600 text-3xl"></i>
281
+ </div>
282
+ <h3 class="text-xl font-semibold mb-2">隐私保护</h3>
283
+ <p class="text-gray-600">严格遵循医疗数据隐私保护规范，确保信息安全</p>
284
+ </div>
285
+ <div class="text-center p-6">
286
+ <div class="w-20 h-20 bg-blue-100 rounded-full flex items-center justify-center mx-auto mb-4">
287
+ <i class="fas fa-headset text-blue-600 text-3xl"></i>
288
+ </div>
289
+ <h3 class="text-xl font-semibold mb-2">远程指导</h3>
290
+ <p class="text-gray-600">实时视频连线专业医师，获取操作指导和诊断建议</p>
291
+ </div>
292
+ </div>
293
+ </div>
294
+ </section>
295
+
296
+ <!-- Contact Section -->
297
+ <section id="contact" class="py-16 bg-gray-50">
298
+ <div class="container mx-auto px-4">
299
+ <h2 class="text-3xl font-bold text-center mb-12">联系我们</h2>
300
+ <div class="max-w-4xl mx-auto bg-white rounded-lg shadow-sm overflow-hidden">
301
+ <div class="md:flex">
302
+ <div class="md:w-1/2 p-8">
303
+ <h3 class="text-xl font-semibold mb-4">江阴市人民医院超声科心超室</h3>
304
+ <div class="space-y-4">
305
+ <div class="flex items-start">
306
+ <i class="fas fa-map-marker-alt text-blue-600 mt-1 mr-3"></i>
307
+ <div>
308
+ <h4 class="font-medium">地址</h4>
309
+ <p class="text-gray-600">江苏省江阴市人民医院超声科心超室</p>
310
+ </div>
311
+ </div>
312
+ <div class="flex items-start">
313
+ <i class="fas fa-user-md text-blue-600 mt-1 mr-3"></i>
314
+ <div>
315
+ <h4 class="font-medium">联系人</h4>
316
+ <p class="text-gray-600">高春恒 主任医师</p>
317
+ </div>
318
+ </div>
319
+ <div class="flex items-start">
320
+ <i class="fas fa-phone-alt text-blue-600 mt-1 mr-3"></i>
321
+ <div>
322
+ <h4 class="font-medium">电话</h4>
323
+ <p class="text-gray-600">18921233382</p>
324
+ </div>
325
+ </div>
326
+ <div class="flex items-start">
327
+ <i class="fas fa-clock text-blue-600 mt-1 mr-3"></i>
328
+ <div>
329
+ <h4 class="font-medium">服务时间</h4>
330
+ <p class="text-gray-600">24小时全天候服务</p>
331
+ </div>
332
+ </div>
333
+ </div>
334
+ </div>
335
+ <div class="md:w-1/2 bg-gray-100 p-8 flex flex-col items-center justify-center">
336
+ <div class="text-center mb-6">
337
+ <i class="fas fa-qrcode text-6xl text-blue-600 mb-4"></i>
338
+ <p class="text-gray-600">扫描二维码上传检查资料</p>
339
+ </div>
340
+ <div class="w-full max-w-xs">
341
+ <form id="contact-form">
342
+ <div class="mb-4">
343
+ <input type="text" placeholder="您的姓名" class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500" id="contact-name">
344
+ </div>
345
+ <div class="mb-4">
346
+ <input type="email" placeholder="电子邮箱" class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500" id="contact-email">
347
+ </div>
348
+ <div class="mb-4">
349
+ <textarea placeholder="留言内容" rows="3" class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500" id="contact-message"></textarea>
350
+ </div>
351
+ <button type="submit" class="w-full bg-blue-600 text-white px-6 py-2 rounded-lg font-semibold hover:bg-blue-700 transition">
352
+ 发送留言 <i class="fas fa-paper-plane ml-2"></i>
353
+ </button>
354
+ </form>
355
+ </div>
356
+ </div>
357
+ </div>
358
+ </div>
359
+ </div>
360
+ </section>
361
+
362
+ <!-- Footer -->
363
+ <footer class="bg-gray-800 text-white py-8">
364
+ <div class="container mx-auto px-4">
365
+ <div class="md:flex justify-between items-center">
366
+ <div class="mb-6 md:mb-0">
367
+ <div class="flex items-center space-x-2">
368
+ <i class="fas fa-hospital text-2xl"></i>
369
+ <span class="text-xl font-semibold">江阴市人民医院</span>
370
+ </div>
371
+ <p class="text-gray-400 mt-2">24小时无人超声自��诊疗室</p>
372
+ </div>
373
+ <div class="grid grid-cols-2 md:grid-cols-3 gap-8">
374
+ <div>
375
+ <h4 class="text-lg font-semibold mb-4">快速链接</h4>
376
+ <ul class="space-y-2">
377
+ <li><a href="#services" class="text-gray-400 hover:text-white transition">服务项目</a></li>
378
+ <li><a href="#process" class="text-gray-400 hover:text-white transition">就诊流程</a></li>
379
+ <li><a href="#contact" class="text-gray-400 hover:text-white transition">联系我们</a></li>
380
+ </ul>
381
+ </div>
382
+ <div>
383
+ <h4 class="text-lg font-semibold mb-4">关于我们</h4>
384
+ <ul class="space-y-2">
385
+ <li><a href="#" class="text-gray-400 hover:text-white transition">医院简介</a></li>
386
+ <li><a href="#" class="text-gray-400 hover:text-white transition">医师团队</a></li>
387
+ <li><a href="#" class="text-gray-400 hover:text-white transition">设备介绍</a></li>
388
+ </ul>
389
+ </div>
390
+ <div class="col-span-2 md:col-span-1">
391
+ <h4 class="text-lg font-semibold mb-4">关注我们</h4>
392
+ <div class="flex space-x-4">
393
+ <a href="#" class="w-10 h-10 bg-gray-700 rounded-full flex items-center justify-center hover:bg-blue-600 transition">
394
+ <i class="fab fa-weixin"></i>
395
+ </a>
396
+ <a href="#" class="w-10 h-10 bg-gray-700 rounded-full flex items-center justify-center hover:bg-red-600 transition">
397
+ <i class="fab fa-weibo"></i>
398
+ </a>
399
+ <a href="#" class="w-10 h-10 bg-gray-700 rounded-full flex items-center justify-center hover:bg-blue-400 transition">
400
+ <i class="fab fa-twitter"></i>
401
+ </a>
402
+ </div>
403
+ </div>
404
+ </div>
405
+ </div>
406
+ <div class="border-t border-gray-700 mt-8 pt-6 text-center text-gray-400">
407
+ <p>© 2023 江阴市人民医院. 版权所有.</p>
408
+ </div>
409
+ </div>
410
+ </footer>
411
+
412
+ <!-- Login Modal -->
413
+ <div class="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50 hidden" id="login-modal">
414
+ <div class="bg-white rounded-lg w-full max-w-md overflow-hidden">
415
+ <div class="p-6">
416
+ <div class="flex justify-between items-center mb-6">
417
+ <h3 class="text-2xl font-bold text-gray-800">用户登录</h3>
418
+ <button id="close-modal" class="text-gray-500 hover:text-gray-700">
419
+ <i class="fas fa-times"></i>
420
+ </button>
421
+ </div>
422
+ <form id="login-form">
423
+ <div class="mb-4">
424
+ <label class="block text-gray-700 mb-2" for="username">用户名</label>
425
+ <input type="text" id="username" class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500" required>
426
+ </div>
427
+ <div class="mb-6">
428
+ <label class="block text-gray-700 mb-2" for="password">密码</label>
429
+ <input type="password" id="password" class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500" required>
430
+ </div>
431
+ <button type="submit" class="w-full bg-blue-600 text-white px-6 py-2 rounded-lg font-semibold hover:bg-blue-700 transition mb-4">
432
+ 登录 <i class="fas fa-sign-in-alt ml-2"></i>
433
+ </button>
434
+ <div class="text-center">
435
+ <p class="text-gray-600">没有账号? <a href="#" class="text-blue-600 hover:underline" id="register-link">立即注册</a></p>
436
+ </div>
437
+ </form>
438
+ </div>
439
+ <div class="bg-gray-100 px-6 py-4 flex justify-center">
440
+ <div class="text-center">
441
+ <p class="text-gray-600 mb-2">或使用以下方式登录</p>
442
+ <div class="flex justify-center space-x-4">
443
+ <button class="w-10 h-10 bg-red-500 text-white rounded-full flex items-center justify-center">
444
+ <i class="fab fa-google"></i>
445
+ </button>
446
+ <button class="w-10 h-10 bg-blue-500 text-white rounded-full flex items-center justify-center">
447
+ <i class="fab fa-facebook-f"></i>
448
+ </button>
449
+ <button class="w-10 h-10 bg-black text-white rounded-full flex items-center justify-center">
450
+ <i class="fab fa-apple"></i>
451
+ </button>
452
+ </div>
453
+ </div>
454
+ </div>
455
+ </div>
456
+ </div>
457
+
458
+ <!-- Register Modal -->
459
+ <div class="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50 hidden" id="register-modal">
460
+ <div class="bg-white rounded-lg w-full max-w-md overflow-hidden">
461
+ <div class="p-6">
462
+ <div class="flex justify-between items-center mb-6">
463
+ <h3 class="text-2xl font-bold text-gray-800">用户注册</h3>
464
+ <button id="close-register-modal" class="text-gray-500 hover:text-gray-700">
465
+ <i class="fas fa-times"></i>
466
+ </button>
467
+ </div>
468
+ <form id="register-form">
469
+ <div class="mb-4">
470
+ <label class="block text-gray-700 mb-2" for="reg-name">姓名</label>
471
+ <input type="text" id="reg-name" class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500" required>
472
+ </div>
473
+ <div class="mb-4">
474
+ <label class="block text-gray-700 mb-2" for="reg-phone">手机号码</label>
475
+ <input type="tel" id="reg-phone" class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500" required>
476
+ </div>
477
+ <div class="mb-4">
478
+ <label class="block text-gray-700 mb-2" for="reg-id">身份证号</label>
479
+ <input type="text" id="reg-id" class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500" required>
480
+ </div>
481
+ <div class="mb-4">
482
+ <label class="block text-gray-700 mb-2" for="reg-username">用户名</label>
483
+ <input type="text" id="reg-username" class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500" required>
484
+ </div>
485
+ <div class="mb-6">
486
+ <label class="block text-gray-700 mb-2" for="reg-password">密码</label>
487
+ <input type="password" id="reg-password" class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500" required>
488
+ </div>
489
+ <button type="submit" class="w-full bg-blue-600 text-white px-6 py-2 rounded-lg font-semibold hover:bg-blue-700 transition mb-4">
490
+ 注册 <i class="fas fa-user-plus ml-2"></i>
491
+ </button>
492
+ <div class="text-center">
493
+ <p class="text-gray-600">已有账号? <a href="#" class="text-blue-600 hover:underline" id="login-link">立即登录</a></p>
494
+ </div>
495
+ </form>
496
+ </div>
497
+ </div>
498
+ </div>
499
+
500
+ <!-- Video Modal -->
501
+ <div class="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50 hidden" id="video-modal">
502
+ <div class="bg-white rounded-lg w-full max-w-4xl overflow-hidden">
503
+ <div class="p-4">
504
+ <div class="flex justify-between items-center mb-4">
505
+ <h3 class="text-xl font-bold text-gray-800">操作视频指南</h3>
506
+ <button id="close-video-modal" class="text-gray-500 hover:text-gray-700">
507
+ <i class="fas fa-times"></i>
508
+ </button>
509
+ </div>
510
+ <div class="aspect-w-16 aspect-h-9">
511
+ <video controls class="w-full">
512
+ <source src="https://example.com/video.mp4" type="video/mp4">
513
+ 您的浏览器不支持视频播放。
514
+ </video>
515
+ </div>
516
+ <div class="mt-4">
517
+ <h4 class="font-semibold mb-2">操作步骤说明:</h4>
518
+ <ol class="list-decimal pl-5 space-y-2">
519
+ <li>扫描二维码或输入患者ID登录系统</li>
520
+ <li>选择需要进行的超声检查项目</li>
521
+ <li>按照屏幕提示正确放置超声探头</li>
522
+ <li>系统将自动采集图像并进行分析</li>
523
+ <li>查看AI生成的初步诊断报告</li>
524
+ <li>如有需要可申请远程专家会诊</li>
525
+ </ol>
526
+ </div>
527
+ </div>
528
+ </div>
529
+ </div>
530
+
531
+ <!-- Scan Modal -->
532
+ <div class="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50 hidden" id="scan-modal">
533
+ <div class="bg-white rounded-lg w-full max-w-md overflow-hidden">
534
+ <div class="p-6">
535
+ <div class="flex justify-between items-center mb-6">
536
+ <h3 class="text-2xl font-bold text-gray-800">扫描上传</h3>
537
+ <button id="close-scan-modal" class="text-gray-500 hover:text-gray-700">
538
+ <i class="fas fa-times"></i>
539
+ </button>
540
+ </div>
541
+ <div class="text-center mb-6">
542
+ <div class="relative w-64 h-64 mx-auto bg-gray-100 rounded-lg flex items-center justify-center scan-area">
543
+ <div id="camera-view" class="w-full h-full flex items-center justify-center">
544
+ <video id="videoElement" autoplay playsinline></video>
545
+ <canvas id="canvas"></canvas>
546
+ </div>
547
+ <div id="scan-instructions" class="absolute inset-0 flex flex-col items-center justify-center p-4 text-center">
548
+ <i class="fas fa-qrcode text-6xl mb-4 text-blue-600"></i>
549
+ <p class="text-gray-700">请将二维码置于框内扫描</p>
550
+ <p class="text-sm text-gray-500 mt-2">或选择图片上传</p>
551
+ </div>
552
+ </div>
553
+ </div>
554
+ <div class="flex flex-col space-y-4">
555
+ <button id="start-scan-btn" class="w-full bg-blue-600 text-white px-6 py-2 rounded-lg font-semibold hover:bg-blue-700 transition">
556
+ 开始扫描 <i class="fas fa-camera ml-2"></i>
557
+ </button>
558
+ <button id="upload-btn" class="w-full border border-blue-600 text-blue-600 px-6 py-2 rounded-lg font-semibold hover:bg-blue-50 transition">
559
+ 上传图片 <i class="fas fa-upload ml-2"></i>
560
+ </button>
561
+ <input type="file" id="file-input" accept="image/*" class="hidden">
562
+ </div>
563
+ </div>
564
+ </div>
565
+ </div>
566
+
567
+ <!-- Diagnosis Modal -->
568
+ <div class="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50 hidden" id="diagnosis-modal">
569
+ <div class="bg-white rounded-lg w-full max-w-4xl overflow-hidden">
570
+ <div class="p-6">
571
+ <div class="flex justify-between items-center mb-6">
572
+ <h3 class="text-2xl font-bold text-gray-800">超声诊断报告</h3>
573
+ <button id="close-diagnosis-modal" class="text-gray-500 hover:text-gray-700">
574
+ <i class="fas fa-times"></i>
575
+ </button>
576
+ </div>
577
+ <div class="grid md:grid-cols-2 gap-6">
578
+ <div>
579
+ <h4 class="font-semibold mb-2">患者信息</h4>
580
+ <div class="bg-gray-50 p-4 rounded-lg">
581
+ <div class="grid grid-cols-2 gap-4">
582
+ <div>
583
+ <p class="text-sm text-gray-500">姓名</p>
584
+ <p class="font-medium" id="patient-name">张三</p>
585
+ </div>
586
+ <div>
587
+ <p class="text-sm text-gray-500">性别</p>
588
+ <p class="font-medium" id="patient-gender">男</p>
589
+ </div>
590
+ <div>
591
+ <p class="text-sm text-gray-500">年龄</p>
592
+ <p class="font-medium" id="patient-age">45岁</p>
593
+ </div>
594
+ <div>
595
+ <p class="text-sm text-gray-500">检查日期</p>
596
+ <p class="font-medium" id="exam-date">2023-06-15</p>
597
+ </div>
598
+ <div class="col-span-2">
599
+ <p class="text-sm text-gray-500">检查项目</p>
600
+ <p class="font-medium" id="exam-type">心脏超声检查</p>
601
+ </div>
602
+ </div>
603
+ </div>
604
+
605
+ <h4 class="font-semibold mb-2 mt-4">超声图像</h4>
606
+ <div class="bg-gray-50 p-4 rounded-lg flex justify-center">
607
+ <img id="previewImage" src="https://via.placeholder.com/300x200?text=超声图像" alt="超声图像" class="rounded">
608
+ </div>
609
+ </div>
610
+ <div>
611
+ <h4 class="font-semibold mb-2">检查结果</h4>
612
+ <div class="bg-gray-50 p-4 rounded-lg h-64 overflow-y-auto">
613
+ <div id="diagnosis-result">
614
+ <p><strong>超声所见:</strong></p>
615
+ <p>1. 各房室大小正常范围</p>
616
+ <p>2. 室间隔与左室后壁厚度正常，运动协调</p>
617
+ <p>3. 各瓣膜形态、结构及启闭未见明显异常</p>
618
+ <p>4. 主动脉及肺动脉内径正常</p>
619
+ <p>5. 心包腔内未见明显液性暗区</p>
620
+ <p>6. CDFI: 各瓣膜区未见明显异常血流信号</p>
621
+ <br>
622
+ <p><strong>超声提示:</strong></p>
623
+ <p>心脏超声检查未见明显异常</p>
624
+ </div>
625
+ </div>
626
+
627
+ <h4 class="font-semibold mb-2 mt-4">AI分析</h4>
628
+ <div class="bg-blue-50 p-4 rounded-lg">
629
+ <div class="flex items-start">
630
+ <i class="fas fa-robot text-blue-600 mt-1 mr-3"></i>
631
+ <div>
632
+ <p class="text-sm text-gray-700">AI系统分析认为本次检查结果在正常范围内，可信度评分: <span class="font-bold text-blue-600">92%</span>。建议定期复查。</p>
633
+ </div>
634
+ </div>
635
+ </div>
636
+
637
+ <div class="mt-6 flex flex-col sm:flex-row space-y-3 sm:space-y-0 sm:space-x-3">
638
+ <button class="flex-1 bg-blue-600 text-white px-4 py-2 rounded-lg font-semibold hover:bg-blue-700 transition">
639
+ <i class="fas fa-print mr-2"></i> 打印报告
640
+ </button>
641
+ <button class="flex-1 border border-blue-600 text-blue-600 px-4 py-2 rounded-lg font-semibold hover:bg-blue-50 transition">
642
+ <i class="fas fa-share-alt mr-2"></i> 分享报告
643
+ </button>
644
+ <button class="flex-1 bg-green-600 text-white px-4 py-2 rounded-lg font-semibold hover:bg-green-700 transition" id="consult-btn">
645
+ <i class="fas fa-user-md mr-2"></i> 专家会诊
646
+ </button>
647
+ </div>
648
+ </div>
649
+ </div>
650
+ </div>
651
+ </div>
652
+ </div>
653
+
654
+ <!-- Consultation Modal -->
655
+ <div class="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50 hidden" id="consultation-modal">
656
+ <div class="bg-white rounded-lg w-full max-w-4xl overflow-hidden">
657
+ <div class="p-6">
658
+ <div class="flex justify-between items-center mb-6">
659
+ <h3 class="text-2xl font-bold text-gray-800">远程专家会诊</h3>
660
+ <button id="close-consultation-modal" class="text-gray-500 hover:text-gray-700">
661
+ <i class="fas fa-times"></i>
662
+ </button>
663
+ </div>
664
+ <div class="grid md:grid-cols-2 gap-6">
665
+ <div>
666
+ <h4 class="font-semibold mb-2">会诊专家</h4>
667
+ <div class="space-y-4">
668
+ <div class="flex items-center p-4 border border-gray-200 rounded-lg hover:border-blue-500 transition cursor-pointer">
669
+ <img src="https://via.placeholder.com/60x60?text=专家" alt="专家" class="w-12 h-12 rounded-full mr-4">
670
+ <div>
671
+ <p class="font-semibold">高春恒 主任医师</p>
672
+ <p class="text-sm text-gray-600">江阴市人民医院超声科</p>
673
+ <p class="text-xs text-blue-600">心血管超声诊断专家</p>
674
+ </div>
675
+ </div>
676
+ <div class="flex items-center p-4 border border-gray-200 rounded-lg hover:border-blue-500 transition cursor-pointer">
677
+ <img src="https://via.placeholder.com/60x60?text=专家" alt="专家" class="w-12 h-12 rounded-full mr-4">
678
+ <div>
679
+ <p class="font-semibold">李华 副主任医师</p>
680
+ <p class="text-sm text-gray-600">上海中山医院超声科</p>
681
+ <p class="text-xs text-blue-600">腹部超声诊断专家</p>
682
+ </div>
683
+ </div>
684
+ <div class="flex items-center p-4 border border-gray-200 rounded-lg hover:border-blue-500 transition cursor-pointer">
685
+ <img src="https://via.placeholder.com/60x60?text=专家" alt="专家" class="w-12 h-12 rounded-full mr-4">
686
+ <div>
687
+ <p class="font-semibold">王芳 主任医师</p>
688
+ <p class="text-sm text-gray-600">北京协和医院超声科</p>
689
+ <p class="text-xs text-blue-600">妇科超声诊断专家</p>
690
+ </div>
691
+ </div>
692
+ </div>
693
+ </div>
694
+ <div>
695
+ <h4 class="font-semibold mb-2">会诊信息</h4>
696
+ <div class="bg-gray-50 p-4 rounded-lg mb-4">
697
+ <div class="mb-4">
698
+ <label class="block text-gray-700 mb-2">会诊类型</label>
699
+ <select class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500">
700
+ <option>实时视频会诊</option>
701
+ <option>影像资料会诊</option>
702
+ <option>综合会诊</option>
703
+ </select>
704
+ </div>
705
+ <div class="mb-4">
706
+ <label class="block text-gray-700 mb-2">病情描述</label>
707
+ <textarea rows="3" class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500" placeholder="请详细描述您的症状和需求..."></textarea>
708
+ </div>
709
+ <div>
710
+ <label class="block text-gray-700 mb-2">上传补充资料</label>
711
+ <div class="border-2 border-dashed border-gray-300 rounded-lg p-4 text-center">
712
+ <i class="fas fa-cloud-upload-alt text-3xl text-gray-400 mb-2"></i>
713
+ <p class="text-sm text-gray-500">拖放文件到此处或点击选择</p>
714
+ <input type="file" class="hidden">
715
+ </div>
716
+ </div>
717
+ </div>
718
+ <button class="w-full bg-blue-600 text-white px-6 py-3 rounded-lg font-semibold hover:bg-blue-700 transition">
719
+ 提交会诊申请 <i class="fas fa-paper-plane ml-2"></i>
720
+ </button>
721
+ </div>
722
+ </div>
723
+ </div>
724
+ </div>
725
+ </div>
726
+
727
+ <!-- Emergency Contact Banner -->
728
+ <div class="fixed bottom-4 right-4 z-40">
729
+ <div class="bg-red-600 text-white px-4 py-2 rounded-lg shadow-lg flex items-center pulse-animation">
730
+ <i class="fas fa-phone-alt mr-2"></i>
731
+ <span>紧急联系: 18921233382</span>
732
+ </div>
733
+ </div>
734
+
735
+ <script>
736
+ // 模拟后端数据存储
737
+ const backend = {
738
+ users: [
739
+ { username: 'user1', password: 'pass1', name: '张三', gender: '男', age: 45 },
740
+ { username: 'user2', password: 'pass2', name: '李四', gender: '女', age: 32 }
741
+ ],
742
+ exams: [
743
+ {
744
+ id: 1,
745
+ patientId: 'user1',
746
+ type: '心脏超声检查',
747
+ date: '2023-06-15',
748
+ image: 'https://via.placeholder.com/300x200?text=心脏超声',
749
+ result: `
750
+ <p><strong>超声所见:</strong></p>
751
+ <p>1. 各房室大小正常范围</p>
752
+ <p>2. 室间隔与左室后壁厚度正常，运动协调</p>
753
+ <p>3. 各瓣膜形态、结构及启闭未见明显异常</p>
754
+ <p>4. 主动脉及肺动脉内径正常</p>
755
+ <p>5. 心包腔内未见明显液性暗区</p>
756
+ <p>6. CDFI: 各瓣膜区未见明显异常血流信号</p>
757
+ <br>
758
+ <p><strong>超声提示:</strong></p>
759
+ <p>心脏超声检查未见明显异常</p>
760
+ `,
761
+ aiScore: 92
762
+ },
763
+ {
764
+ id: 2,
765
+ patientId: 'user2',
766
+ type: '腹部超声检查',
767
+ date: '2023-06-10',
768
+ image: 'https://via.placeholder.com/300x200?text=腹部超声',
769
+ result: `
770
+ <p><strong>超声所见:</strong></p>
771
+ <p>1. 肝脏大小形态正常，包膜光滑，实质回声均匀</p>
772
+ <p>2. 胆囊大小正常，壁不厚，内未见明显异常回声</p>
773
+ <p>3. 胰腺形态正常，主胰管无扩张</p>
774
+ <p>4. 脾脏大小正常，实质回声均匀</p>
775
+ <p>5. 双肾大小形态正常，集合系统无分离</p>
776
+ <br>
777
+ <p><strong>超声提示:</strong></p>
778
+ <p>腹部超声检查未见明显���常</p>
779
+ `,
780
+ aiScore: 88
781
+ }
782
+ ]
783
+ };
784
+
785
+ // 当前用户状态
786
+ let currentUser = null;
787
+
788
+ // DOM元素
789
+ const elements = {
790
+ mobileMenuButton: document.getElementById('mobile-menu-button'),
791
+ mobileMenu: document.getElementById('mobile-menu'),
792
+ startBtn: document.getElementById('start-btn'),
793
+ videoBtn: document.getElementById('video-btn'),
794
+ loginModal: document.getElementById('login-modal'),
795
+ closeModal: document.getElementById('close-modal'),
796
+ loginForm: document.getElementById('login-form'),
797
+ registerModal: document.getElementById('register-modal'),
798
+ closeRegisterModal: document.getElementById('close-register-modal'),
799
+ registerForm: document.getElementById('register-form'),
800
+ registerLink: document.getElementById('register-link'),
801
+ loginLink: document.getElementById('login-link'),
802
+ videoModal: document.getElementById('video-modal'),
803
+ closeVideoModal: document.getElementById('close-video-modal'),
804
+ scanModal: document.getElementById('scan-modal'),
805
+ closeScanModal: document.getElementById('close-scan-modal'),
806
+ startScanBtn: document.getElementById('start-scan-btn'),
807
+ uploadBtn: document.getElementById('upload-btn'),
808
+ fileInput: document.getElementById('file-input'),
809
+ cameraView: document.getElementById('camera-view'),
810
+ scanInstructions: document.getElementById('scan-instructions'),
811
+ videoElement: document.getElementById('videoElement'),
812
+ canvas: document.getElementById('canvas'),
813
+ diagnosisModal: document.getElementById('diagnosis-modal'),
814
+ closeDiagnosisModal: document.getElementById('close-diagnosis-modal'),
815
+ patientName: document.getElementById('patient-name'),
816
+ patientGender: document.getElementById('patient-gender'),
817
+ patientAge: document.getElementById('patient-age'),
818
+ examDate: document.getElementById('exam-date'),
819
+ examType: document.getElementById('exam-type'),
820
+ previewImage: document.getElementById('previewImage'),
821
+ diagnosisResult: document.getElementById('diagnosis-result'),
822
+ consultBtn: document.getElementById('consult-btn'),
823
+ consultationModal: document.getElementById('consultation-modal'),
824
+ closeConsultationModal: document.getElementById('close-consultation-modal'),
825
+ contactForm: document.getElementById('contact-form')
826
+ };
827
+
828
+ // 事件监听器
829
+ elements.mobileMenuButton.addEventListener('click', toggleMobileMenu);
830
+ elements.startBtn.addEventListener('click', startDiagnosis);
831
+ elements.videoBtn.addEventListener('click', showVideoModal);
832
+ elements.closeModal.addEventListener('click', () => elements.loginModal.classList.add('hidden'));
833
+ elements.closeRegisterModal.addEventListener('click', () => elements.registerModal.classList.add('hidden'));
834
+ elements.closeVideoModal.addEventListener('click', () => elements.videoModal.classList.add('hidden'));
835
+ elements.closeScanModal.addEventListener('click', closeScanModal);
836
+ elements.closeDiagnosisModal.addEventListener('click', () => elements.diagnosisModal.classList.add('hidden'));
837
+ elements.closeConsultationModal.addEventListener('click', () => elements.consultationModal.classList.add('hidden'));
838
+ elements.registerLink.addEventListener('click', (e) => {
839
+ e.preventDefault();
840
+ elements.loginModal.classList.add('hidden');
841
+ elements.registerModal.classList.remove('hidden');
842
+ });
843
+ elements.loginLink.addEventListener('click', (e) => {
844
+ e.preventDefault();
845
+ elements.registerModal.classList.add('hidden');
846
+ elements.loginModal.classList.remove('hidden');
847
+ });
848
+ elements.loginForm.addEventListener('submit', handleLogin);
849
+ elements.registerForm.addEventListener('submit', handleRegister);
850
+ elements.startScanBtn.addEventListener('click', startScan);
851
+ elements.uploadBtn.addEventListener('click', () => elements.fileInput.click());
852
+ elements.fileInput.addEventListener('change', handleFileUpload);
853
+ elements.consultBtn.addEventListener('click', () => {
854
+ elements.diagnosisModal.classList.add('hidden');
855
+ elements.consultationModal.classList.remove('hidden');
856
+ });
857
+ elements.contactForm.addEventListener('submit', handleContactForm);
858
+
859
+ // 平滑滚动
860
+ document.querySelectorAll('a[href^="#"]').forEach(anchor => {
861
+ anchor.addEventListener('click', function(e) {
862
+ e.preventDefault();
863
+ const targetId = this.getAttribute('href');
864
+ if (targetId === '#') return;
865
+
866
+ const targetElement = document.querySelector(targetId);
867
+ if (targetElement) {
868
+ targetElement.scrollIntoView({
869
+ behavior: 'smooth'
870
+ });
871
+ }
872
+ });
873
+ });
874
+
875
+ // 点击外部关闭模态框
876
+ [elements.loginModal, elements.registerModal, elements.videoModal, elements.scanModal, elements.diagnosisModal, elements.consultationModal].forEach(modal => {
877
+ modal.addEventListener('click', function(e) {
878
+ if (e.target === modal) {
879
+ modal.classList.add('hidden');
880
+ if (modal === elements.scanModal) {
881
+ closeScanModal();
882
+ }
883
+ }
884
+ });
885
+ });
886
+
887
+ // 函数定义
888
+ function toggleMobileMenu() {
889
+ elements.mobileMenu.classList.toggle('hidden');
890
+ }
891
+
892
+ function startDiagnosis() {
893
+ if (!currentUser) {
894
+ elements.loginModal.classList.remove('hidden');
895
+ } else {
896
+ // 模拟获取用户最近的检查
897
+ const userExam = backend.exams.find(exam => exam.patientId === currentUser.username);
898
+ if (userExam) {
899
+ showDiagnosisReport(userExam);
900
+ } else {
901
+ elements.scanModal.classList.remove('hidden');
902
+ }
903
+ }
904
+ }
905
+
906
+ function showVideoModal() {
907
+ elements.videoModal.classList.remove('hidden');
908
+ }
909
+
910
+ function showDiagnosisReport(exam) {
911
+ elements.patientName.textContent = currentUser.name;
912
+ elements.patientGender.textContent = currentUser.gender;
913
+ elements.patientAge.textContent = currentUser.age + '岁';
914
+ elements.examDate.textContent = exam.date;
915
+ elements.examType.textContent = exam.type;
916
+ elements.previewImage.src = exam.image;
917
+ elements.diagnosisResult.innerHTML = exam.result;
918
+ elements.diagnosisModal.classList.remove('hidden');
919
+ }
920
+
921
+ function handleLogin(e) {
922
+ e.preventDefault();
923
+ const username = document.getElementById('username').value;
924
+ const password = document.getElementById('password').value;
925
+
926
+ // 模拟后端验证
927
+ const user = backend.users.find(u => u.username === username && u.password === password);
928
+ if (user) {
929
+ currentUser = user;
930
+ elements.loginModal.classList.add('hidden');
931
+ alert('登录成功！');
932
+ startDiagnosis();
933
+ } else {
934
+ alert('用户名或密码错误！');
935
+ }
936
+ }
937
+
938
+ function handleRegister(e) {
939
+ e.preventDefault();
940
+ const name = document.getElementById('reg-name').value;
941
+ const phone = document.getElementById('reg-phone').value;
942
+ const id = document.getElementById('reg-id').value;
943
+ const username = document.getElementById('reg-username').value;
944
+ const password = document.getElementById('reg-password').value;
945
+
946
+ // 模拟后端注册
947
+ backend.users.push({
948
+ username,
949
+ password,
950
+ name,
951
+ gender: '未知',
952
+ age: 0
953
+ });
954
+
955
+ alert('注册成功！请登录');
956
+ elements.registerModal.classList.add('hidden');
957
+ elements.loginModal.classList.remove('hidden');
958
+ }
959
+
960
+ function startScan() {
961
+ elements.scanInstructions.classList.add('hidden');
962
+ elements.cameraView.classList.remove('hidden');
963
+
964
+ // 模拟摄像头访问
965
+ if (navigator.mediaDevices && navigator.mediaDevices.getUserMedia) {
966
+ navigator.mediaDevices.getUserMedia({ video: { facingMode: 'environment' } })
967
+ .then(function(stream) {
968
+ elements.videoElement.srcObject = stream;
969
+ // 模拟二维码扫描
970
+ setTimeout(() => {
971
+ simulateQRScan();
972
+ }, 2000);
973
+ })
974
+ .catch(function(err) {
975
+ console.error('无法访问摄像头:', err);
976
+ alert('无法访问摄像头，请检查权限设置或尝试上传图片');
977
+ elements.scanInstructions.classList.remove('hidden');
978
+ elements.cameraView.classList.add('hidden');
979
+ });
980
+ } else {
981
+ alert('您的设备不支持摄像头访问，请尝试上传图片');
982
+ elements.scanInstructions.classList.remove('hidden');
983
+ elements.cameraView.classList.add('hidden');
984
+ }
985
+ }
986
+
987
+ function simulateQRScan() {
988
+ // 模拟扫描到二维码
989
+ const userExam = backend.exams.find(exam => exam.patientId === (currentUser ? currentUser.username : 'user1'));
990
+ if (userExam) {
991
+ closeScanModal();
992
+ showDiagnosisReport(userExam);
993
+ } else {
994
+ alert('未找到匹配的检查记录');
995
+ closeScanModal();
996
+ }
997
+ }
998
+
999
+ function closeScanModal() {
1000
+ if (elements.videoElement.srcObject) {
1001
+ elements.videoElement.srcObject.getTracks().forEach(track => track.stop());
1002
+ elements.videoElement.srcObject = null;
1003
+ }
1004
+ elements.scanModal.classList.add('hidden');
1005
+ elements.scanInstructions.classList.remove('hidden');
1006
+ elements.cameraView.classList.add('hidden');
1007
+ }
1008
+
1009
+ function handleFileUpload(e) {
1010
+ const file = e.target.files[0];
1011
+ if (file) {
1012
+ const reader = new FileReader();
1013
+ reader.onload = function(event) {
1014
+ elements.previewImage.src = event.target.result;
1015
+ closeScanModal();
1016
+
1017
+ // 模拟上传后获取诊断报告
1018
+ const userExam = backend.exams.find(exam => exam.patientId === (currentUser ? currentUser.username : 'user1'));
1019
+ if (userExam) {
1020
+ showDiagnosisReport(userExam);
1021
+ }
1022
+ };
1023
+ reader.readAsDataURL(file);
1024
+ }
1025
+ }
1026
+
1027
+ function handleContactForm(e) {
1028
+ e.preventDefault();
1029
+ const name = document.getElementById('contact-name').value;
1030
+ const email = document.getElementById('contact-email').value;
1031
+ const message = document.getElementById('contact-message').value;
1032
+
1033
+ // 模拟表单提交
1034
+ alert(`感谢您的留言，${name}！我们会尽快回复您。`);
1035
+ elements.contactForm.reset();
1036
+ }
1037
+
1038
+ // 初始化
1039
+ document.addEventListener('DOMContentLoaded', () => {
1040
+ // 可以在这里添加初始化逻辑
1041
+ });
1042
+ </script>
1043
+ <p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=echo3700/ai-echo" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
1044
+ </html>
prompts.txt ADDED
@@ -0,0 +1,2 @@
 
 
 
1
+ 帮我创建一个24小时无人超声自助诊断与治疗工作室，要求前后端均能实现，地址联系方式为:江阴市人民医院超声科心超室，高春恒，18921233382，二维码设为上传
2
+ 帮我创建一个24小时无人超声自助诊断与治疗工作室，要求前后端均能实现