Hugging Face's logo

Spaces:
AssanaliAidarkhan
/
applicationanalysis
Running

App Files Community
AssanaliAidarkhan commited on
Commit
5971b2e
·
verified ·
1 Parent(s): 6daff91

Update index.html

Browse files
Files changed (1) hide show
  1. index.html +1093 -19
index.html CHANGED
@@ -1,19 +1,1093 @@
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="ru">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>MindIA - Помощник Юридической Службы</title>
7
+ <style>
8
+ * {
9
+ margin: 0;
10
+ padding: 0;
11
+ box-sizing: border-box;
12
+ }
13
+
14
+ body {
15
+ font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
16
+ background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
17
+ min-height: 100vh;
18
+ padding: 20px;
19
+ }
20
+
21
+ .container {
22
+ max-width: 1400px;
23
+ margin: 0 auto;
24
+ background: white;
25
+ border-radius: 12px;
26
+ box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
27
+ overflow: hidden;
28
+ }
29
+
30
+ .header {
31
+ background: linear-gradient(135deg, #2c3e50 0%, #34495e 100%);
32
+ color: white;
33
+ padding: 30px;
34
+ text-align: center;
35
+ }
36
+
37
+ .header .platform-name {
38
+ font-size: 16px;
39
+ font-weight: 600;
40
+ letter-spacing: 2px;
41
+ margin-bottom: 15px;
42
+ opacity: 0.9;
43
+ }
44
+
45
+ .header h1 {
46
+ font-size: 28px;
47
+ margin-bottom: 10px;
48
+ }
49
+
50
+ .header p {
51
+ font-size: 14px;
52
+ opacity: 0.9;
53
+ }
54
+
55
+ .contact-banner {
56
+ background: #f8f9fa;
57
+ padding: 15px 30px;
58
+ border-bottom: 2px solid #e9ecef;
59
+ display: flex;
60
+ align-items: center;
61
+ justify-content: center;
62
+ gap: 20px;
63
+ flex-wrap: wrap;
64
+ }
65
+
66
+ .contact-item {
67
+ display: flex;
68
+ align-items: center;
69
+ gap: 8px;
70
+ color: #495057;
71
+ font-size: 14px;
72
+ }
73
+
74
+ .contact-item strong {
75
+ color: #2c3e50;
76
+ }
77
+
78
+ .main-content {
79
+ padding: 40px;
80
+ }
81
+
82
+ .section-title {
83
+ font-size: 22px;
84
+ font-weight: 600;
85
+ color: #2c3e50;
86
+ margin-bottom: 30px;
87
+ display: flex;
88
+ align-items: center;
89
+ gap: 10px;
90
+ }
91
+
92
+ .cards-grid {
93
+ display: grid;
94
+ grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
95
+ gap: 25px;
96
+ margin-bottom: 50px;
97
+ }
98
+
99
+ .feature-card {
100
+ background: linear-gradient(135deg, #f8f9fa 0%, #ffffff 100%);
101
+ border: 2px solid #e9ecef;
102
+ border-radius: 12px;
103
+ padding: 30px;
104
+ transition: all 0.3s;
105
+ cursor: pointer;
106
+ }
107
+
108
+ .feature-card:hover {
109
+ transform: translateY(-5px);
110
+ box-shadow: 0 10px 30px rgba(102, 126, 234, 0.2);
111
+ border-color: #667eea;
112
+ }
113
+
114
+ .feature-card .icon {
115
+ width: 60px;
116
+ height: 60px;
117
+ background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
118
+ border-radius: 12px;
119
+ display: flex;
120
+ align-items: center;
121
+ justify-content: center;
122
+ font-size: 28px;
123
+ margin-bottom: 20px;
124
+ }
125
+
126
+ .feature-card h3 {
127
+ font-size: 20px;
128
+ color: #2c3e50;
129
+ margin-bottom: 15px;
130
+ }
131
+
132
+ .feature-card p {
133
+ color: #6c757d;
134
+ line-height: 1.6;
135
+ margin-bottom: 15px;
136
+ }
137
+
138
+ .feature-card ul {
139
+ list-style: none;
140
+ margin-bottom: 20px;
141
+ }
142
+
143
+ .feature-card ul li {
144
+ padding: 5px 0;
145
+ color: #495057;
146
+ font-size: 14px;
147
+ display: flex;
148
+ align-items: flex-start;
149
+ gap: 8px;
150
+ }
151
+
152
+ .feature-card ul li:before {
153
+ content: "✓";
154
+ color: #28a745;
155
+ font-weight: bold;
156
+ }
157
+
158
+ .feature-card .btn {
159
+ display: inline-flex;
160
+ align-items: center;
161
+ gap: 8px;
162
+ padding: 10px 20px;
163
+ background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
164
+ color: white;
165
+ border: none;
166
+ border-radius: 6px;
167
+ font-size: 14px;
168
+ font-weight: 600;
169
+ cursor: pointer;
170
+ transition: all 0.3s;
171
+ }
172
+
173
+ .feature-card .btn:hover {
174
+ transform: translateX(5px);
175
+ box-shadow: 0 5px 15px rgba(102, 126, 234, 0.4);
176
+ }
177
+
178
+ .modal {
179
+ display: none;
180
+ position: fixed;
181
+ top: 0;
182
+ left: 0;
183
+ width: 100%;
184
+ height: 100%;
185
+ background: rgba(0, 0, 0, 0.6);
186
+ z-index: 1000;
187
+ align-items: center;
188
+ justify-content: center;
189
+ }
190
+
191
+ .modal.active {
192
+ display: flex;
193
+ }
194
+
195
+ .modal-content {
196
+ background: white;
197
+ border-radius: 12px;
198
+ max-width: 1000px;
199
+ width: 90%;
200
+ max-height: 90vh;
201
+ overflow-y: auto;
202
+ box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
203
+ }
204
+
205
+ .modal-header {
206
+ background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
207
+ color: white;
208
+ padding: 25px 30px;
209
+ display: flex;
210
+ justify-content: space-between;
211
+ align-items: center;
212
+ position: sticky;
213
+ top: 0;
214
+ z-index: 10;
215
+ }
216
+
217
+ .modal-header h2 {
218
+ font-size: 22px;
219
+ display: flex;
220
+ align-items: center;
221
+ gap: 10px;
222
+ }
223
+
224
+ .close-btn {
225
+ background: none;
226
+ border: none;
227
+ color: white;
228
+ font-size: 28px;
229
+ cursor: pointer;
230
+ padding: 0;
231
+ width: 30px;
232
+ height: 30px;
233
+ display: flex;
234
+ align-items: center;
235
+ justify-content: center;
236
+ }
237
+
238
+ .close-btn:hover {
239
+ opacity: 0.8;
240
+ }
241
+
242
+ .modal-body {
243
+ padding: 30px;
244
+ }
245
+
246
+ .form-group {
247
+ margin-bottom: 20px;
248
+ }
249
+
250
+ .form-group label {
251
+ display: block;
252
+ font-size: 14px;
253
+ font-weight: 600;
254
+ color: #495057;
255
+ margin-bottom: 8px;
256
+ }
257
+
258
+ .form-group input,
259
+ .form-group select,
260
+ .form-group textarea {
261
+ width: 100%;
262
+ padding: 10px 12px;
263
+ border: 1px solid #ced4da;
264
+ border-radius: 6px;
265
+ font-size: 14px;
266
+ font-family: inherit;
267
+ transition: all 0.3s;
268
+ }
269
+
270
+ .form-group textarea {
271
+ min-height: 120px;
272
+ resize: vertical;
273
+ }
274
+
275
+ .form-group input:focus,
276
+ .form-group select:focus,
277
+ .form-group textarea:focus {
278
+ outline: none;
279
+ border-color: #667eea;
280
+ box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
281
+ }
282
+
283
+ .file-upload {
284
+ border: 2px dashed #ced4da;
285
+ border-radius: 6px;
286
+ padding: 30px;
287
+ text-align: center;
288
+ cursor: pointer;
289
+ transition: all 0.3s;
290
+ }
291
+
292
+ .file-upload:hover {
293
+ border-color: #667eea;
294
+ background: #f8f9fa;
295
+ }
296
+
297
+ .file-upload input[type="file"] {
298
+ display: none;
299
+ }
300
+
301
+ .analysis-result {
302
+ background: #f8f9fa;
303
+ border-radius: 8px;
304
+ padding: 20px;
305
+ margin-top: 20px;
306
+ }
307
+
308
+ .analysis-result h4 {
309
+ color: #2c3e50;
310
+ margin-bottom: 15px;
311
+ display: flex;
312
+ align-items: center;
313
+ gap: 8px;
314
+ }
315
+
316
+ .risk-item {
317
+ background: white;
318
+ padding: 15px;
319
+ border-radius: 6px;
320
+ margin-bottom: 10px;
321
+ border-left: 4px solid #dc3545;
322
+ }
323
+
324
+ .risk-item.warning {
325
+ border-left-color: #ffc107;
326
+ }
327
+
328
+ .risk-item.info {
329
+ border-left-color: #17a2b8;
330
+ }
331
+
332
+ .risk-item h5 {
333
+ color: #2c3e50;
334
+ font-size: 16px;
335
+ margin-bottom: 5px;
336
+ }
337
+
338
+ .risk-item p {
339
+ color: #6c757d;
340
+ font-size: 14px;
341
+ margin: 0;
342
+ }
343
+
344
+ .search-results {
345
+ background: white;
346
+ border: 1px solid #e9ecef;
347
+ border-radius: 8px;
348
+ max-height: 400px;
349
+ overflow-y: auto;
350
+ margin-top: 20px;
351
+ }
352
+
353
+ .search-result-item {
354
+ padding: 15px;
355
+ border-bottom: 1px solid #e9ecef;
356
+ cursor: pointer;
357
+ transition: all 0.3s;
358
+ }
359
+
360
+ .search-result-item:hover {
361
+ background: #f8f9fa;
362
+ }
363
+
364
+ .search-result-item:last-child {
365
+ border-bottom: none;
366
+ }
367
+
368
+ .search-result-item h5 {
369
+ color: #2c3e50;
370
+ font-size: 16px;
371
+ margin-bottom: 8px;
372
+ }
373
+
374
+ .search-result-item p {
375
+ color: #6c757d;
376
+ font-size: 14px;
377
+ line-height: 1.6;
378
+ margin: 0;
379
+ }
380
+
381
+ .search-result-item .meta {
382
+ display: flex;
383
+ gap: 15px;
384
+ margin-top: 8px;
385
+ font-size: 12px;
386
+ color: #868e96;
387
+ }
388
+
389
+ .badge {
390
+ display: inline-block;
391
+ padding: 4px 8px;
392
+ border-radius: 4px;
393
+ font-size: 12px;
394
+ font-weight: 600;
395
+ }
396
+
397
+ .badge-danger {
398
+ background: #f8d7da;
399
+ color: #721c24;
400
+ }
401
+
402
+ .badge-warning {
403
+ background: #fff3cd;
404
+ color: #856404;
405
+ }
406
+
407
+ .badge-info {
408
+ background: #d1ecf1;
409
+ color: #0c5460;
410
+ }
411
+
412
+ .badge-success {
413
+ background: #d4edda;
414
+ color: #155724;
415
+ }
416
+
417
+ .action-buttons {
418
+ display: flex;
419
+ gap: 10px;
420
+ justify-content: flex-end;
421
+ margin-top: 20px;
422
+ }
423
+
424
+ .btn-primary {
425
+ padding: 12px 24px;
426
+ background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
427
+ color: white;
428
+ border: none;
429
+ border-radius: 6px;
430
+ font-weight: 600;
431
+ cursor: pointer;
432
+ transition: all 0.3s;
433
+ }
434
+
435
+ .btn-primary:hover {
436
+ transform: translateY(-2px);
437
+ box-shadow: 0 5px 15px rgba(102, 126, 234, 0.4);
438
+ }
439
+
440
+ .btn-secondary {
441
+ padding: 12px 24px;
442
+ background: #6c757d;
443
+ color: white;
444
+ border: none;
445
+ border-radius: 6px;
446
+ font-weight: 600;
447
+ cursor: pointer;
448
+ transition: all 0.3s;
449
+ }
450
+
451
+ .btn-secondary:hover {
452
+ background: #5a6268;
453
+ }
454
+
455
+ .tabs-container {
456
+ display: flex;
457
+ border-bottom: 2px solid #e9ecef;
458
+ margin-bottom: 20px;
459
+ }
460
+
461
+ .tab-button {
462
+ padding: 12px 24px;
463
+ background: none;
464
+ border: none;
465
+ border-bottom: 3px solid transparent;
466
+ color: #6c757d;
467
+ font-weight: 600;
468
+ cursor: pointer;
469
+ transition: all 0.3s;
470
+ }
471
+
472
+ .tab-button.active {
473
+ color: #667eea;
474
+ border-bottom-color: #667eea;
475
+ }
476
+
477
+ .tab-content {
478
+ display: none;
479
+ }
480
+
481
+ .tab-content.active {
482
+ display: block;
483
+ }
484
+
485
+ .letter-preview {
486
+ background: white;
487
+ border: 1px solid #e9ecef;
488
+ border-radius: 8px;
489
+ padding: 20px;
490
+ margin-top: 20px;
491
+ }
492
+
493
+ .letter-preview h4 {
494
+ color: #2c3e50;
495
+ margin-bottom: 15px;
496
+ }
497
+
498
+ .letter-preview .content {
499
+ line-height: 1.8;
500
+ color: #495057;
501
+ }
502
+
503
+ @media (max-width: 768px) {
504
+ .main-content {
505
+ padding: 20px;
506
+ }
507
+
508
+ .cards-grid {
509
+ grid-template-columns: 1fr;
510
+ }
511
+
512
+ .modal-content {
513
+ width: 95%;
514
+ }
515
+
516
+ .contact-banner {
517
+ flex-direction: column;
518
+ gap: 10px;
519
+ }
520
+ }
521
+ </style>
522
+ </head>
523
+ <body>
524
+ <div class="container">
525
+ <!-- Header -->
526
+ <div class="header">
527
+ <div class="platform-name">MindIA</div>
528
+ <h1>Помощник Юридической Службы</h1>
529
+ <p>Искусственный интеллект для автоматизации юридических процессов</p>
530
+ </div>
531
+
532
+ <!-- Contact Banner -->
533
+ <div class="contact-banner">
534
+ <div class="contact-item">
535
+ <span>👤</span>
536
+ <span><strong>Контактное лицо:</strong> Юсупова Гульфия Булатовна</span>
537
+ </div>
538
+ <div class="contact-item">
539
+ <span>💼</span>
540
+ <span>Ведущий юрисконсульт отдела правового сопровождения и исполнения судебных актов ЮС</span>
541
+ </div>
542
+ <div class="contact-item">
543
+ <span>📞</span>
544
+ <span><strong>Тел.:</strong> 62-04-57 (вн. 2311)</span>
545
+ </div>
546
+ </div>
547
+
548
+ <!-- Main Content -->
549
+ <div class="main-content">
550
+ <div class="section-title">
551
+ <span>⚙️</span> Функциональные возможности
552
+ </div>
553
+
554
+ <div class="cards-grid">
555
+ <!-- Card 1: Contracts -->
556
+ <div class="feature-card" onclick="openModal('contractsModal')">
557
+ <div class="icon">📑</div>
558
+ <h3>Анализ договоров</h3>
559
+ <p>Комплексный анализ и проверка договоров с использованием ИИ</p>
560
+ <ul>
561
+ <li>Выявление потенциальных рисков</li>
562
+ <li>Поиск ошибок и опечаток</li>
563
+ <li>Обнаружение противоречий</li>
564
+ <li>Генерация типовых договоров</li>
565
+ <li>Создание доп. соглашений</li>
566
+ </ul>
567
+ <button class="btn">
568
+ Открыть <span>→</span>
569
+ </button>
570
+ </div>
571
+
572
+ <!-- Card 2: Letters -->
573
+ <div class="feature-card" onclick="openModal('lettersModal')">
574
+ <div class="icon">✉️</div>
575
+ <h3>Обработка писем</h3>
576
+ <p>Автоматизация работы с входящей и исходящей корреспонденцией</p>
577
+ <ul>
578
+ <li>Сканирование входящих писем</li>
579
+ <li>Определение типа письма</li>
580
+ <li>Подготовка ответов</li>
581
+ <li>Создание служебных записок</li>
582
+ <li>Классификация претензий</li>
583
+ </ul>
584
+ <button class="btn">
585
+ Открыть <span>→</span>
586
+ </button>
587
+ </div>
588
+
589
+ <!-- Card 3: Legal Search -->
590
+ <div class="feature-card" onclick="openModal('searchModal')">
591
+ <div class="icon">🔍</div>
592
+ <h3>Поиск информации</h3>
593
+ <p>Быстрый поиск юридической информации и документов</p>
594
+ <ul>
595
+ <li>Судебная практика</li>
596
+ <li>Законодательные нормы</li>
597
+ <li>Нормативные акты</li>
598
+ <li>Комментарии к законам</li>
599
+ <li>Актуальная правовая база</li>
600
+ </ul>
601
+ <button class="btn">
602
+ Открыть <span>→</span>
603
+ </button>
604
+ </div>
605
+ </div>
606
+ </div>
607
+ </div>
608
+
609
+ <!-- Contracts Modal -->
610
+ <div id="contractsModal" class="modal">
611
+ <div class="modal-content">
612
+ <div class="modal-header">
613
+ <h2><span>📑</span> Анализ и генерация договоров</h2>
614
+ <button class="close-btn" onclick="closeModal('contractsModal')">×</button>
615
+ </div>
616
+ <div class="modal-body">
617
+ <div class="tabs-container">
618
+ <button class="tab-button active" onclick="switchTab('analyze', 'contractsModal')">Анализ договора</button>
619
+ <button class="tab-button" onclick="switchTab('generate', 'contractsModal')">Генерация договора</button>
620
+ </div>
621
+
622
+ <!-- Analyze Tab -->
623
+ <div id="analyze-tab" class="tab-content active">
624
+ <div class="form-group">
625
+ <label>Загрузите договор для анализа:</label>
626
+ <div class="file-upload" onclick="document.getElementById('contractFile').click()">
627
+ <input type="file" id="contractFile" accept=".pdf,.doc,.docx" onchange="handleContractUpload()">
628
+ <div style="font-size: 40px; margin-bottom: 10px;">📄</div>
629
+ <div style="font-weight: 600; margin-bottom: 5px;">Нажмите для загрузки договора</div>
630
+ <div style="font-size: 12px; color: #6c757d;">Поддерживаются форматы: PDF, DOC, DOCX</div>
631
+ </div>
632
+ </div>
633
+
634
+ <div class="form-group">
635
+ <label>Тип договора:</label>
636
+ <select>
637
+ <option value="">Выберите тип договора</option>
638
+ <option value="supply">Договор поставки</option>
639
+ <option value="service">Договор оказания услуг</option>
640
+ <option value="lease">Договор аренды</option>
641
+ <option value="employment">Трудовой договор</option>
642
+ <option value="partnership">Договор партнерства</option>
643
+ <option value="other">Другое</option>
644
+ </select>
645
+ </div>
646
+
647
+ <div class="action-buttons">
648
+ <button class="btn-secondary" onclick="closeModal('contractsModal')">Отмена</button>
649
+ <button class="btn-primary" onclick="analyzeContract()">Анализировать договор</button>
650
+ </div>
651
+
652
+ <div id="analysisResults" style="display: none;">
653
+ <div class="analysis-result">
654
+ <h4>📊 Результаты анализа</h4>
655
+
656
+ <div style="margin-bottom: 20px;">
657
+ <h5 style="color: #2c3e50; margin-bottom: 10px;">Общая информация:</h5>
658
+ <p style="color: #495057; margin-bottom: 5px;"><strong>Тип договора:</strong> Договор поставки товаров</p>
659
+ <p style="color: #495057; margin-bottom: 5px;"><strong>Дата проверки:</strong> 10 января 2026 г.</p>
660
+ <p style="color: #495057;"><strong>Статус:</strong> <span class="badge badge-warning">Требуется доработка</span></p>
661
+ </div>
662
+
663
+ <h5 style="color: #2c3e50; margin-bottom: 15px;">Выявленные риски и проблемы:</h5>
664
+
665
+ <div class="risk-item">
666
+ <h5>⚠️ Высокий риск: Отсутствие штрафных санкций</h5>
667
+ <p>В договоре не предусмотрены штрафные санкции за несвоевременную поставку товара. Рекомендуется добавить пункт с неустойкой в размере 0,1% от стоимости товара за каждый день просрочки.</p>
668
+ </div>
669
+
670
+ <div class="risk-item warning">
671
+ <h5>⚠️ Средний риск: Нечеткие сроки исполнения</h5>
672
+ <p>Пункт 3.2 содержит формулировку "в разумные сроки", что может привести к спорам. Рекомендуется указать конкретные календарные сроки.</p>
673
+ </div>
674
+
675
+ <div class="risk-item info">
676
+ <h5>ℹ️ Замечание: Опечатка в реквизитах</h5>
677
+ <p>В разделе "Реквизиты сторон" обнаружена опечатка в ИНН контрагента (11 цифр вместо 12). Проверьте корректность указанного ИНН: 77012345678.</p>
678
+ </div>
679
+
680
+ <div class="risk-item info">
681
+ <h5>ℹ️ Рекомендация: Добавить условие о форс-мажоре</h5>
682
+ <p>Рекомендуется добавить раздел о форс-мажорных обстоятельствах для защиты интересов обеих сторон в случае непредвиденных ситуаций.</p>
683
+ </div>
684
+ </div>
685
+ </div>
686
+ </div>
687
+
688
+ <!-- Generate Tab -->
689
+ <div id="generate-tab" class="tab-content">
690
+ <div class="form-group">
691
+ <label>Тип документа:</label>
692
+ <select>
693
+ <option value="">Выберите тип документа</option>
694
+ <option value="contract">Типовой договор</option>
695
+ <option value="agreement">Дополнительное соглашение</option>
696
+ <option value="amendment">Изменение к договору</option>
697
+ <option value="termination">Соглашение о расторжении</option>
698
+ </select>
699
+ </div>
700
+
701
+ <div class="form-group">
702
+ <label>Шаблон договора:</label>
703
+ <select>
704
+ <option value="">Выберите шаблон</option>
705
+ <option value="supply">Договор поставки</option>
706
+ <option value="service">Договор оказания услуг</option>
707
+ <option value="lease">Договор аренды</option>
708
+ <option value="employment">Трудовой договор</option>
709
+ <option value="nda">Соглашение о конфиденциальности</option>
710
+ </select>
711
+ </div>
712
+
713
+ <div class="form-group">
714
+ <label>Наименование контрагента:</label>
715
+ <input type="text" placeholder="ТОО 'Название компании'">
716
+ </div>
717
+
718
+ <div class="form-group">
719
+ <label>Предмет договора:</label>
720
+ <textarea placeholder="Опишите предмет договора..."></textarea>
721
+ </div>
722
+
723
+ <div class="form-group">
724
+ <label>Сумма договора (тенге):</label>
725
+ <input type="number" placeholder="0.00">
726
+ </div>
727
+
728
+ <div class="form-group">
729
+ <label>Дополнительные условия:</label>
730
+ <textarea placeholder="Укажите особые условия, которые нужно включить в договор..."></textarea>
731
+ </div>
732
+
733
+ <div class="action-buttons">
734
+ <button class="btn-secondary" onclick="closeModal('contractsModal')">Отмена</button>
735
+ <button class="btn-primary" onclick="generateContract()">Сгенерировать договор</button>
736
+ </div>
737
+ </div>
738
+ </div>
739
+ </div>
740
+ </div>
741
+
742
+ <!-- Letters Modal -->
743
+ <div id="lettersModal" class="modal">
744
+ <div class="modal-content">
745
+ <div class="modal-header">
746
+ <h2><span>✉️</span> Обработка писем и служебных записок</h2>
747
+ <button class="close-btn" onclick="closeModal('lettersModal')">×</button>
748
+ </div>
749
+ <div class="modal-body">
750
+ <div class="tabs-container">
751
+ <button class="tab-button active" onclick="switchTab('incoming', 'lettersModal')">Входящие письма</button>
752
+ <button class="tab-button" onclick="switchTab('outgoing', 'lettersModal')">Создать ответ</button>
753
+ <button class="tab-button" onclick="switchTab('memo', 'lettersModal')">Служебная записка</button>
754
+ </div>
755
+
756
+ <!-- Incoming Letters Tab -->
757
+ <div id="incoming-tab" class="tab-content active">
758
+ <div class="form-group">
759
+ <label>Загрузите входящее письмо:</label>
760
+ <div class="file-upload" onclick="document.getElementById('letterFile').click()">
761
+ <input type="file" id="letterFile" accept=".pdf,.doc,.docx,.jpg,.png" onchange="handleLetterUpload()">
762
+ <div style="font-size: 40px; margin-bottom: 10px;">📨</div>
763
+ <div style="font-weight: 600; margin-bottom: 5px;">Загрузите письмо для анализа</div>
764
+ <div style="font-size: 12px; color: #6c757d;">Поддерживаются форматы: PDF, DOC, DOCX, JPG, PNG</div>
765
+ </div>
766
+ </div>
767
+
768
+ <div class="action-buttons">
769
+ <button class="btn-secondary" onclick="closeModal('lettersModal')">Отмена</button>
770
+ <button class="btn-primary" onclick="analyzeLetter()">Проанализировать письмо</button>
771
+ </div>
772
+
773
+ <div id="letterAnalysis" style="display: none;">
774
+ <div class="analysis-result">
775
+ <h4>📋 Результаты анализа письма</h4>
776
+
777
+ <div style="margin-bottom: 20px;">
778
+ <p style="color: #495057; margin-bottom: 10px;"><strong>Тип письма:</strong> <span class="badge badge-warning">Претензия</span></p>
779
+ <p style="color: #495057; margin-bottom: 10px;"><strong>Приоритет:</strong> <span class="badge badge-danger">Высокий</span></p>
780
+ <p style="color: #495057; margin-bottom: 10px;"><strong>Срок ответа:</strong> 5 рабочих дней</p>
781
+ <p style="color: #495057;"><strong>От кого:</strong> ТОО "Компания-контрагент"</p>
782
+ </div>
783
+
784
+ <h5 style="color: #2c3e50; margin-bottom: 10px;">Краткое содержание:</h5>
785
+ <p style="color: #495057; line-height: 1.6; margin-bottom: 15px;">
786
+ Контрагент предъявляет претензию о несво��временной оплате по договору №123 от 15.10.2025.
787
+ Требует оплатить задолженность в размере 5 000 000 тенге и уплатить неустойку.
788
+ Угрожает обращением в суд при отсутствии оплаты в течение 10 дней.
789
+ </p>
790
+
791
+ <h5 style="color: #2c3e50; margin-bottom: 10px;">Рекомендуемые действия:</h5>
792
+ <ul style="list-style: none; padding-left: 0;">
793
+ <li style="padding: 8px 0; color: #495057;">✓ Проверить статус оплаты по договору №123</li>
794
+ <li style="padding: 8px 0; color: #495057;">✓ Подготовить мотивированный ответ</li>
795
+ <li style="padding: 8px 0; color: #495057;">✓ Согласовать с финансовым отделом</li>
796
+ <li style="padding: 8px 0; color: #495057;">✓ Подготовить план погашения (при наличии задолженности)</li>
797
+ </ul>
798
+ </div>
799
+ </div>
800
+ </div>
801
+
802
+ <!-- Outgoing Letters Tab -->
803
+ <div id="outgoing-tab" class="tab-content">
804
+ <div class="form-group">
805
+ <label>Тип ответного письма:</label>
806
+ <select id="responseType">
807
+ <option value="">Выберите тип письма</option>
808
+ <option value="answer">Ответ на запрос информации</option>
809
+ <option value="claim-response">Ответ на претензию</option>
810
+ <option value="clarification">Письмо-разъяснение</option>
811
+ <option value="refusal">Мотивированный отказ</option>
812
+ <option value="acceptance">Письмо-согласие</option>
813
+ </select>
814
+ </div>
815
+
816
+ <div class="form-group">
817
+ <label>Получатель:</label>
818
+ <input type="text" placeholder="Наименование организации/ФИО">
819
+ </div>
820
+
821
+ <div class="form-group">
822
+ <label>Тема письма:</label>
823
+ <input type="text" placeholder="Укажите тему письма">
824
+ </div>
825
+
826
+ <div class="form-group">
827
+ <label>Исходное письмо (для контекста):</label>
828
+ <textarea placeholder="Вставьте текст исходного письма или кратко опишите его содержание..."></textarea>
829
+ </div>
830
+
831
+ <div class="form-group">
832
+ <label>Ключевые моменты для ответа:</label>
833
+ <textarea placeholder="Укажите ключевую информацию, которую нужно включить в ответ..."></textarea>
834
+ </div>
835
+
836
+ <div class="action-buttons">
837
+ <button class="btn-secondary" onclick="closeModal('lettersModal')">Отмена</button>
838
+ <button class="btn-primary" onclick="generateResponse()">Сгенерировать ответ</button>
839
+ </div>
840
+
841
+ <div id="responsePreview" style="display: none;">
842
+ <div class="letter-preview">
843
+ <h4>Предварительный просмотр ответа:</h4>
844
+ <div class="content" id="responseContent"></div>
845
+ <div class="action-buttons" style="margin-top: 20px;">
846
+ <button class="btn-secondary">Редактировать</button>
847
+ <button class="btn-primary">Скачать документ</button>
848
+ </div>
849
+ </div>
850
+ </div>
851
+ </div>
852
+
853
+ <!-- Memo Tab -->
854
+ <div id="memo-tab" class="tab-content">
855
+ <div class="form-group">
856
+ <label>Тип служебной записки:</label>
857
+ <select>
858
+ <option value="">Выберите тип</option>
859
+ <option value="information">Информационная</option>
860
+ <option value="request">Запрос</option>
861
+ <option value="proposal">Предложение</option>
862
+ <option value="report">Отчетная</option>
863
+ </select>
864
+ </div>
865
+
866
+ <div class="form-group">
867
+ <label>Кому:</label>
868
+ <input type="text" placeholder="Должность и ФИО адресата">
869
+ </div>
870
+
871
+ <div class="form-group">
872
+ <label>Тема записки:</label>
873
+ <input type="text" placeholder="Краткая тема служебной записки">
874
+ </div>
875
+
876
+ <div class="form-group">
877
+ <label>Описание ситуации/вопроса:</label>
878
+ <textarea placeholder="Опишите ситуацию или вопрос, по которому создается служебная записка..." style="min-height: 150px;"></textarea>
879
+ </div>
880
+
881
+ <div class="form-group">
882
+ <label>Предлагаемые решения (опционально):</label>
883
+ <textarea placeholder="Укажите предлагаемые варианты решения..."></textarea>
884
+ </div>
885
+
886
+ <div class="action-buttons">
887
+ <button class="btn-secondary" onclick="closeModal('lettersModal')">Отмена</button>
888
+ <button class="btn-primary" onclick="generateMemo()">Сгенерировать записку</button>
889
+ </div>
890
+ </div>
891
+ </div>
892
+ </div>
893
+ </div>
894
+
895
+ <!-- Search Modal -->
896
+ <div id="searchModal" class="modal">
897
+ <div class="modal-content">
898
+ <div class="modal-header">
899
+ <h2><span>🔍</span> Поиск юридической информации</h2>
900
+ <button class="close-btn" onclick="closeModal('searchModal')">×</button>
901
+ </div>
902
+ <div class="modal-body">
903
+ <div class="form-group">
904
+ <label>Тип поиска:</label>
905
+ <select id="searchType">
906
+ <option value="all">Все источники</option>
907
+ <option value="court">Судебная практика</option>
908
+ <option value="laws">Законодательство</option>
909
+ <option value="regulations">Нормативные акты</option>
910
+ <option value="comments">Комментарии к законам</option>
911
+ </select>
912
+ </div>
913
+
914
+ <div class="form-group">
915
+ <label>Поисковый запрос:</label>
916
+ <textarea placeholder="Введите ваш запрос. Например: 'взыскание задолженности по договору поставки' или 'статья 350 ГК РК'" style="min-height: 80px;"></textarea>
917
+ </div>
918
+
919
+ <div class="form-group">
920
+ <label>Дополнительные фильтры:</label>
921
+ <div style="display: grid; grid-template-columns: 1fr 1fr; gap: 10px;">
922
+ <div>
923
+ <label style="font-size: 12px; font-weight: normal;">Дата с:</label>
924
+ <input type="date">
925
+ </div>
926
+ <div>
927
+ <label style="font-size: 12px; font-weight: normal;">Дата по:</label>
928
+ <input type="date">
929
+ </div>
930
+ </div>
931
+ </div>
932
+
933
+ <div class="action-buttons" style="justify-content: space-between;">
934
+ <button class="btn-secondary">Очистить</button>
935
+ <button class="btn-primary" onclick="performSearch()">Искать</button>
936
+ </div>
937
+
938
+ <div id="searchResults" style="display: none;">
939
+ <h4 style="color: #2c3e50; margin: 20px 0 15px 0;">Результаты поиска (23 найдено):</h4>
940
+ <div class="search-results">
941
+ <div class="search-result-item">
942
+ <h5>Постановление Верховного Суда РК от 15.11.2024 №2-1234-24</h5>
943
+ <p>...по делу о взыскании задолженности по договору поставки. Суд указал, что при наличии доказательств ненадлежащего исполнения обязательств поставщиком, покупатель вправе удержать...</p>
944
+ <div class="meta">
945
+ <span class="badge badge-info">Судебная практика</span>
946
+ <span>📅 15 ноября 2024</span>
947
+ <span>⚖️ Верховный Суд РК</span>
948
+ </div>
949
+ </div>
950
+
951
+ <div class="search-result-item">
952
+ <h5>Гражданский кодекс РК, Статья 350. Неустойка</h5>
953
+ <p>Неустойкой (штрафом, пеней) признается определенная законодательством или договором денежная сумма, которую должник обязан уплатить кредитору в случае неисполнения или ненадлежащего исполнения обязательства...</p>
954
+ <div class="meta">
955
+ <span class="badge badge-success">Законодательство</span>
956
+ <span>📅 Действует с 01.07.1999</span>
957
+ <span>📄 ГК РК</span>
958
+ </div>
959
+ </div>
960
+
961
+ <div class="search-result-item">
962
+ <h5>Нормативное постановление ВС РК №4 от 23.06.2023</h5>
963
+ <p>О некоторых вопросах применения законодательства о договоре поставки. Разъясняются особенности определения существенных условий договора поставки, порядок расчета неустойки...</p>
964
+ <div class="meta">
965
+ <span class="badge badge-warning">Нормативный акт</span>
966
+ <span>📅 23 июня 2023</span>
967
+ <span>⚖️ Верховный Суд РК</span>
968
+ </div>
969
+ </div>
970
+
971
+ <div class="search-result-item">
972
+ <h5>Комментарий к статье 350 ГК РК</h5>
973
+ <p>Неустойка является одним из способов обеспечения исполнения обязательств и мерой имущественной ответственности за их нарушение. В практике применения данной нормы следует учитывать...</p>
974
+ <div class="meta">
975
+ <span class="badge badge-info">Комментарий</span>
976
+ <span>📅 2024</span>
977
+ <span>👤 Басин Ю.Г.</span>
978
+ </div>
979
+ </div>
980
+ </div>
981
+ </div>
982
+ </div>
983
+ </div>
984
+ </div>
985
+
986
+ <script>
987
+ let currentModalTabs = {};
988
+
989
+ function openModal(modalId) {
990
+ document.getElementById(modalId).classList.add('active');
991
+ }
992
+
993
+ function closeModal(modalId) {
994
+ document.getElementById(modalId).classList.remove('active');
995
+ }
996
+
997
+ function switchTab(tabName, modalId) {
998
+ const modal = document.getElementById(modalId);
999
+ const buttons = modal.querySelectorAll('.tab-button');
1000
+ const contents = modal.querySelectorAll('.tab-content');
1001
+
1002
+ buttons.forEach(btn => btn.classList.remove('active'));
1003
+ contents.forEach(content => content.classList.remove('active'));
1004
+
1005
+ event.target.classList.add('active');
1006
+ document.getElementById(tabName + '-tab').classList.add('active');
1007
+ }
1008
+
1009
+ function handleContractUpload() {
1010
+ const file = document.getElementById('contractFile').files[0];
1011
+ if (file) {
1012
+ alert('Файл загружен: ' + file.name + '\n\nНажмите "Анализировать договор" для начала проверки.');
1013
+ }
1014
+ }
1015
+
1016
+ function analyzeContract() {
1017
+ document.getElementById('analysisResults').style.display = 'block';
1018
+ document.getElementById('analysisResults').scrollIntoView({ behavior: 'smooth' });
1019
+ }
1020
+
1021
+ function generateContract() {
1022
+ alert('Договор генерируется...\n\nВаш документ будет готов через несколько минут. Система создаст договор на основе выбранного шаблона и указанных параметров.');
1023
+ closeModal('contractsModal');
1024
+ }
1025
+
1026
+ function handleLetterUpload() {
1027
+ const file = document.getElementById('letterFile').files[0];
1028
+ if (file) {
1029
+ alert('Письмо загружено: ' + file.name + '\n\nНажмите "Проанализировать письмо" для начала обработки.');
1030
+ }
1031
+ }
1032
+
1033
+ function analyzeLetter() {
1034
+ document.getElementById('letterAnalysis').style.display = 'block';
1035
+ document.getElementById('letterAnalysis').scrollIntoView({ behavior: 'smooth' });
1036
+ }
1037
+
1038
+ function generateResponse() {
1039
+ const responseType = document.getElementById('responseType').value;
1040
+ if (!responseType) {
1041
+ alert('Пожалуйста, выберите тип ответного письма');
1042
+ return;
1043
+ }
1044
+
1045
+ const sampleResponse = `
1046
+ <p style="margin-bottom: 15px;"><strong>Кому:</strong> ТОО "Компания-контрагент"</p>
1047
+ <p style="margin-bottom: 15px;"><strong>От:</strong> [Ваша организация]</p>
1048
+ <p style="margin-bottom: 15px;"><strong>Дата:</strong> 10 января 2026 г.</p>
1049
+ <p style="margin-bottom: 20px;"><strong>Тема:</strong> Ответ на претензию от [дата]</p>
1050
+
1051
+ <p style="margin-bottom: 15px;">Уважаемые коллеги,</p>
1052
+
1053
+ <p style="margin-bottom: 15px;">
1054
+ Настоящим письмом сообщаем о получении Вашей претензии от [дата] относительно
1055
+ задолженности по договору №123 от 15.10.2025.
1056
+ </p>
1057
+
1058
+ <p style="margin-bottom: 15px;">
1059
+ После проверки информации установлено, что оплата по указанному договору была
1060
+ произведена платежным поручением №456 от [дата]. Копию платежного поручения
1061
+ направляем в приложении к настоящему письму.
1062
+ </p>
1063
+
1064
+ <p style="margin-bottom: 15px;">
1065
+ В связи с вышеизложенным, считаем претензию необоснованной и просим закрыть данный вопрос.
1066
+ </p>
1067
+
1068
+ <p style="margin-bottom: 20px;">С уважением,<br>[Должность, ФИО]</p>
1069
+ `;
1070
+
1071
+ document.getElementById('responseContent').innerHTML = sampleResponse;
1072
+ document.getElementById('responsePreview').style.display = 'block';
1073
+ document.getElementById('responsePreview').scrollIntoView({ behavior: 'smooth' });
1074
+ }
1075
+
1076
+ function generateMemo() {
1077
+ alert('Служебная записка генерируется...\n\nДокумент будет создан в соответствии с вашими указаниями и доступен для скачивания.');
1078
+ }
1079
+
1080
+ function performSearch() {
1081
+ document.getElementById('searchResults').style.display = 'block';
1082
+ document.getElementById('searchResults').scrollIntoView({ behavior: 'smooth' });
1083
+ }
1084
+
1085
+ // Close modal when clicking outside
1086
+ window.onclick = function(event) {
1087
+ if (event.target.classList.contains('modal')) {
1088
+ event.target.classList.remove('active');
1089
+ }
1090
+ }
1091
+ </script>
1092
+ </body>
1093
+ </html>