Hugging Face's logo

Spaces:
WebashalarForML
/
ImageDataExtractor2
Runtime error

App Files Community
WebashalarForML commited on
Commit
e658d9c
·
verified ·
1 Parent(s): 6fac153

Upload 2 files

Browse files
Files changed (2) hide show
  1. templates/index.html +186 -185
  2. templates/result.html +264 -264
templates/index.html CHANGED
@@ -1,185 +1,186 @@
1
- <!DOCTYPE html>
2
- <html lang="en">
3
-
4
- <head>
5
- <meta charset="UTF-8">
6
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
7
- <title>File Upload and Process</title>
8
- <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
9
- <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css">
10
- <style>
11
- body {
12
- background-color: #1d2329;
13
- color: #e0e0e0;
14
- font-family: 'Arial', sans-serif;
15
- }
16
-
17
- .container {
18
- margin-top: 50px;
19
- }
20
-
21
- .card {
22
- background-color: #2a2f36;
23
- border: none;
24
- border-radius: 10px;
25
- box-shadow: 0 4px 8px rgba(0, 0, 0, 0.5);
26
- }
27
-
28
- .card-header {
29
- background-color: #3a4149;
30
- color: white;
31
- border-top-left-radius: 10px;
32
- border-top-right-radius: 10px;
33
- }
34
-
35
- .btn-primary,
36
- .btn-success,
37
- .btn-info {
38
- border-radius: 50px;
39
- padding: 10px;
40
- width: 100%;
41
- }
42
-
43
- .btn-primary {
44
- background-color: #007bff;
45
- border: none;
46
- }
47
-
48
- .btn-success {
49
- background-color: #28a745;
50
- border: none;
51
- }
52
-
53
- .btn-info {
54
- background-color: #17a2b8;
55
- border: none;
56
- }
57
-
58
- .uploaded-file {
59
- margin-top: 15px;
60
- display: flex;
61
- align-items: center;
62
- }
63
-
64
- .uploaded-file span {
65
- font-size: 16px;
66
- margin-left: 10px;
67
- color: #e0e0e0;
68
- }
69
-
70
- .remove-file {
71
- cursor: pointer;
72
- color: #dc3545;
73
- margin-left: 10px;
74
- }
75
-
76
- .form-control-file {
77
- border-radius: 50px;
78
- border: 2px solid #4e5d6c;
79
- padding: 10px;
80
- background-color: #3a4149;
81
- color: #e0e0e0;
82
- font-size: 16px;
83
- }
84
-
85
- .form-control {
86
- border-radius: 50px;
87
- background-color: #3a4149;
88
- color: #e0e0e0;
89
- border: 2px solid #4e5d6c;
90
- }
91
-
92
- .mt-3 {
93
- margin-top: 20px !important;
94
- }
95
-
96
- .card-footer {
97
- text-align: center;
98
- border-top: 1px solid #4e5d6c;
99
- padding: 15px;
100
- }
101
-
102
- .custom-file-upload {
103
- border: 1px solid #4e5d6c;
104
- display: inline-block;
105
- padding: 6px 12px;
106
- cursor: pointer;
107
- border-radius: 50px;
108
- background-color: #3a4149;
109
- color: #e0e0e0;
110
- }
111
-
112
- .custom-file-upload input[type="file"] {
113
- display: none;
114
- }
115
-
116
- .form-group {
117
- margin-top: 20px;
118
- }
119
-
120
- #loadingSpinner {
121
- display: none;
122
- margin-top: 20px;
123
- }
124
- </style>
125
- </head>
126
-
127
- <body>
128
- <div class="container">
129
- <div class="row justify-content-center">
130
- <div class="col-md-8">
131
- <div class="card">
132
- <div class="card-header text-center">
133
- <h2>Upload and Process Files</h2>
134
- </div>
135
- <div class="card-body">
136
- <form id="uploadForm" action="{{ url_for('upload_file') }}" method="post"
137
- enctype="multipart/form-data">
138
- <h4 class="text-center">Upload Images</h4>
139
- <input type="file" name="files" multiple class="form-control-file" required>
140
- <button type="submit" class="btn btn-primary mt-3">Upload</button>
141
- </form>
142
-
143
- {% if uploaded_files %}
144
- <h4 class="mt-4">Uploaded Files:</h4>
145
- <ul class="list-group">
146
- {% for file in uploaded_files %}
147
- <li class="list-group-item d-flex justify-content-between align-items-center"
148
- style="background-color: #3a4149; color: #e0e0e0;">
149
- {{ file }}
150
- <a href="/remove_file" class="remove-file" title="Remove File">&times;</a>
151
- </li>
152
- {% endfor %}
153
- </ul>
154
- {% endif %}
155
-
156
- <form id="processForm" method="post" action="/process" class="mt-3">
157
- <button id="processBtn" type="submit" class="btn btn-success">Process All Files</button>
158
- </form>
159
-
160
- <div id="loadingSpinner" class="text-center">
161
- <div class="spinner-border text-primary" role="status">
162
- <span class="sr-only">Processing...</span>
163
- </div>
164
- </div>
165
- </div>
166
- <div class="card-footer">
167
- <small>&copy; 2024 | Webashalar Pvt. Ltd.</small>
168
- </div>
169
- </div>
170
- </div>
171
- </div>
172
- </div>
173
-
174
- <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"></script>
175
- <script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.5.4/dist/umd/popper.min.js"></script>
176
- <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>
177
-
178
- <script>
179
- document.getElementById("processForm").addEventListener("submit", function(event) {
180
- document.getElementById("loadingSpinner").style.display = "block";
181
- document.getElementById("processBtn").style.display = "none";
182
- });
183
- </script>
184
- </body>
185
- </html>
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+
4
+ <head>
5
+ <meta charset="UTF-8">
6
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
7
+ <title>File Upload and Process</title>
8
+ <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
9
+ <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css">
10
+ <style>
11
+ body {
12
+ background-color: #1d2329;
13
+ color: #e0e0e0;
14
+ font-family: 'Arial', sans-serif;
15
+ }
16
+
17
+ .container {
18
+ margin-top: 50px;
19
+ }
20
+
21
+ .card {
22
+ background-color: #2a2f36;
23
+ border: none;
24
+ border-radius: 10px;
25
+ box-shadow: 0 4px 8px rgba(0, 0, 0, 0.5);
26
+ }
27
+
28
+ .card-header {
29
+ background-color: #3a4149;
30
+ color: white;
31
+ border-top-left-radius: 10px;
32
+ border-top-right-radius: 10px;
33
+ }
34
+
35
+ .btn-primary,
36
+ .btn-success,
37
+ .btn-info {
38
+ border-radius: 50px;
39
+ padding: 10px;
40
+ width: 100%;
41
+ }
42
+
43
+ .btn-primary {
44
+ background-color: #007bff;
45
+ border: none;
46
+ }
47
+
48
+ .btn-success {
49
+ background-color: #28a745;
50
+ border: none;
51
+ }
52
+
53
+ .btn-info {
54
+ background-color: #17a2b8;
55
+ border: none;
56
+ }
57
+
58
+ .uploaded-file {
59
+ margin-top: 15px;
60
+ display: flex;
61
+ align-items: center;
62
+ }
63
+
64
+ .uploaded-file span {
65
+ font-size: 16px;
66
+ margin-left: 10px;
67
+ color: #e0e0e0;
68
+ }
69
+
70
+ .remove-file {
71
+ cursor: pointer;
72
+ color: #dc3545;
73
+ margin-left: 10px;
74
+ }
75
+
76
+ .form-control-file {
77
+ border-radius: 50px;
78
+ border: 2px solid #4e5d6c;
79
+ padding: 10px;
80
+ background-color: #3a4149;
81
+ color: #e0e0e0;
82
+ font-size: 16px;
83
+ }
84
+
85
+ .form-control {
86
+ border-radius: 50px;
87
+ background-color: #3a4149;
88
+ color: #e0e0e0;
89
+ border: 2px solid #4e5d6c;
90
+ }
91
+
92
+ .mt-3 {
93
+ margin-top: 20px !important;
94
+ }
95
+
96
+ .card-footer {
97
+ text-align: center;
98
+ border-top: 1px solid #4e5d6c;
99
+ padding: 15px;
100
+ }
101
+
102
+ .custom-file-upload {
103
+ border: 1px solid #4e5d6c;
104
+ display: inline-block;
105
+ padding: 6px 12px;
106
+ cursor: pointer;
107
+ border-radius: 50px;
108
+ background-color: #3a4149;
109
+ color: #e0e0e0;
110
+ }
111
+
112
+ .custom-file-upload input[type="file"] {
113
+ display: none;
114
+ }
115
+
116
+ .form-group {
117
+ margin-top: 20px;
118
+ }
119
+
120
+ #loadingSpinner {
121
+ display: none;
122
+ margin-top: 20px;
123
+ }
124
+ </style>
125
+ </head>
126
+
127
+ <body>
128
+ <div class="container">
129
+ <div class="row justify-content-center">
130
+ <div class="col-md-8">
131
+ <div class="card">
132
+ <div class="card-header text-center">
133
+ <h2>Upload and Process Files</h2>
134
+ </div>
135
+ <div class="card-body">
136
+ <form id="uploadForm" action="{{ url_for('upload_file') }}" method="post"
137
+ enctype="multipart/form-data">
138
+ <h4 class="text-center">Upload Images</h4>
139
+ <input type="file" name="files" multiple class="form-control-file" required>
140
+ <button type="submit" class="btn btn-primary mt-3">Upload</button>
141
+ </form>
142
+
143
+ {% if uploaded_files %}
144
+ <h4 class="mt-4">Uploaded Files:</h4>
145
+ <ul class="list-group">
146
+ {% for file in uploaded_files %}
147
+ <li class="list-group-item d-flex justify-content-between align-items-center"
148
+ style="background-color: #3a4149; color: #e0e0e0;">
149
+ {{ file }}
150
+ <a href="/remove_file" class="remove-file" title="Remove File">&times;</a>
151
+ </li>
152
+ {% endfor %}
153
+ </ul>
154
+ {% endif %}
155
+
156
+ <form id="processForm" method="post" action="/process" class="mt-3">
157
+ <button id="processBtn" type="submit" class="btn btn-success">Process All Files</button>
158
+ </form>
159
+
160
+ <div id="loadingSpinner" class="text-center">
161
+ <div class="spinner-border text-primary" role="status">
162
+ <span class="sr-only">Processing...</span>
163
+ </div>
164
+ </div>
165
+ </div>
166
+ <div class="card-footer">
167
+ <small>&copy; 2024 | Webashalar Pvt. Ltd.</small>
168
+ </div>
169
+ </div>
170
+ </div>
171
+ </div>
172
+ </div>
173
+
174
+ <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"></script>
175
+ <script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.5.4/dist/umd/popper.min.js"></script>
176
+ <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>
177
+
178
+ <script>
179
+ document.getElementById("processForm").addEventListener("submit", function(event) {
180
+ document.getElementById("loadingSpinner").style.display = "block";
181
+ document.getElementById("processBtn").style.display = "none";
182
+ });
183
+ </script>
184
+ </body>
185
+
186
+ </html>
templates/result.html CHANGED
@@ -1,264 +1,264 @@
1
- <!DOCTYPE html>
2
- <html lang="en">
3
-
4
- <head>
5
- <meta charset="UTF-8">
6
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
7
- <title>Processed Data</title>
8
- <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
9
- <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css">
10
- <style>
11
- body {
12
- background-color: #1d2329;
13
- color: #e0e0e0;
14
- font-family: 'Arial', sans-serif;
15
- }
16
-
17
- .container {
18
- display: flex;
19
- flex-direction: row;
20
- height: 100vh;
21
- margin-top: 20px;
22
- }
23
-
24
- .left-side {
25
- flex: 1;
26
- padding: 20px;
27
- overflow-y: auto;
28
- border: none;
29
- border-radius: 10px;
30
- }
31
-
32
- .right-side {
33
- flex: 1;
34
- padding: 20px;
35
- background-color: #1d2c38;
36
- border-left: 1px solid #4e5d6c;
37
- border-radius: 10px;
38
- display: flex;
39
- justify-content: center;
40
- align-items: center;
41
- }
42
-
43
- .card {
44
- background-color: #2a2f36;
45
- border: none;
46
- border-radius: 10px;
47
- box-shadow: 0 4px 8px rgba(0, 0, 0, 0.5);
48
- margin-bottom: 20px;
49
- }
50
-
51
- .card-header {
52
- background-color: #28a745;
53
- color: white;
54
- border-top-left-radius: 10px;
55
- border-top-right-radius: 10px;
56
- }
57
-
58
- .list-group-item {
59
- border: none;
60
- background-color: #3a4149;
61
- color: #e0e0e0;
62
- padding: 10px;
63
- }
64
-
65
- iframe {
66
- width: 100%;
67
- height: 100%;
68
- border: none;
69
- border-radius: 12px;
70
- }
71
-
72
- .list-group-item strong {
73
- color: #e0e0e0;
74
- }
75
-
76
- h2 {
77
- margin-bottom: 20px;
78
- color: #e0e0e0;
79
- }
80
-
81
- h3 {
82
- margin-top: 10px;
83
- margin-bottom: 10px;
84
- font-size: 1.25rem;
85
- color: #28a745;
86
- }
87
-
88
- pre {
89
- background-color: #3a4149;
90
- padding: 10px;
91
- border-radius: 5px;
92
- font-size: 1rem;
93
- color: #e0e0e0;
94
- overflow-x: auto;
95
- }
96
-
97
- .card-footer {
98
- text-align: center;
99
- border-top: 1px solid #4e5d6c;
100
- padding: 15px;
101
- }
102
-
103
- .no-pdf-message {
104
- text-align: center;
105
- font-size: 1.25rem;
106
- color: #6c757d;
107
- }
108
-
109
- @keyframes pulse {
110
- 0% {
111
- transform: scale(1);
112
- }
113
-
114
- 50% {
115
- transform: scale(1.2);
116
- }
117
-
118
- 100% {
119
- transform: scale(1);
120
- }
121
- }
122
-
123
- .emoji {
124
- font-size: 2rem;
125
- animation: pulse 1s infinite;
126
- display: inline-block;
127
- margin-right: 10px;
128
- }
129
-
130
- .emoji-high {
131
- color: #28a745;
132
- }
133
-
134
- .emoji-medium {
135
- color: #ffc107;
136
- }
137
-
138
- .emoji-low {
139
- color: #dc3545;
140
- }
141
-
142
- a {
143
- color: #007bff;
144
- }
145
- </style>
146
-
147
- </head>
148
-
149
- <body>
150
- <div class="container">
151
- <div class="left-side">
152
- <div class="card">
153
- <div class="card-header text-center">
154
- <h3>Model</h3>
155
- <h2>Extracted Details</h2>
156
- </div>
157
- <div class="card-body">
158
- <ul class="list-group mb-3">
159
- <li class="list-group-item">
160
- <strong>Extracted Data:</strong>
161
- {% for filename, text in data.extracted_text.items() %}
162
- <h3>{{ filename }}:</h3>
163
- <img src="{{ Img[filename] }}" alt="Processed Image" class="img-fluid mb-3"
164
- style="max-width: 100%; height: auto;" />
165
- <strong>Text:</strong>
166
- <p>{{ text }}</p>
167
- {% endfor %}
168
- </li>
169
- <li class="list-group-item">
170
- <strong>Name:</strong>
171
- {% if data.name is iterable and data.name is not string %}
172
- <ul>
173
- {% for value in data.name %}
174
- <li>{{ value }}<br></li>
175
- {% endfor %}
176
- </ul>
177
- {% else %}
178
- <p>{{ data.name }}</p>
179
- {% endif %}
180
- </li>
181
- <li class="list-group-item">
182
- <strong>Designation:</strong>
183
- {% if data.Designation is iterable and data.Designation is not string %}
184
- <ul>
185
- {% for value in data.Designation %}
186
- <li>{{ value }}<br></li>
187
- {% endfor %}
188
- </ul>
189
- {% else %}
190
- <p>{{ data.Designation }}</p>
191
- {% endif %}
192
- </li>
193
- <li class="list-group-item">
194
- <strong>Contact Number:</strong>
195
- {% if data.contact_number is iterable and data.contact_number is not string %}
196
- <ul>
197
- {% for value in data.contact_number %}
198
- <li>{{ value }}<br></li>
199
- {% endfor %}
200
- </ul>
201
- {% else %}
202
- <p>{{ data.contact_number }}</p>
203
- {% endif %}
204
- </li>
205
- <li class="list-group-item">
206
- <strong>Email:</strong>
207
- {% if data.email is iterable and data.email is not string %}
208
- <ul>
209
- {% for value in data.email %}
210
- <li>{{ value }}<br></li>
211
- {% endfor %}
212
- </ul>
213
- {% else %}
214
- <p>{{ data.email }}</p>
215
- {% endif %}
216
- </li>
217
- <li class="list-group-item">
218
- <strong>Address:</strong>
219
- {% if data.Location is iterable and data.Location is not string %}
220
- <ul>
221
- {% for value in data.Location %}
222
- <li>{{ value }}<br></li>
223
- {% endfor %}
224
- </ul>
225
- {% else %}
226
- <p>{{ data.Location }}</p>
227
- {% endif %}
228
- </li>
229
- <li class="list-group-item">
230
- <strong>Links:</strong>
231
- {% if data.Link is iterable and data.Link is not string %}
232
- <ul>
233
- {% for value in data.Link %}
234
- <li>{{ value }}<br></li>
235
- {% endfor %}
236
- </ul>
237
- {% else %}
238
- <p>{{ data.Link }}</p>
239
- {% endif %}
240
- </li>
241
- <li class="list-group-item">
242
- <strong>Organisation:</strong>
243
- {% if data.Company is iterable and data.Company is not string %}
244
- <ul>
245
- {% for value in data.Company %}
246
- <li>{{ value }}<br></li>
247
- {% endfor %}
248
- </ul>
249
- {% else %}
250
- <p>{{ data.Company }}</p>
251
- {% endif %}
252
- </li>
253
- </ul>
254
- <a href="{{ url_for('index') }}">
255
- <button type="button" class="btn btn-primary">Back to Upload</button>
256
- </a>
257
- </div>
258
- </div>
259
- <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"></script>
260
- <script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.5.4/dist/umd/popper.min.js"></script>
261
- <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>
262
- </body>
263
-
264
- </html>
 
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+
4
+ <head>
5
+ <meta charset="UTF-8">
6
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
7
+ <title>Processed Data</title>
8
+ <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
9
+ <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css">
10
+ <style>
11
+ body {
12
+ background-color: #1d2329;
13
+ color: #e0e0e0;
14
+ font-family: 'Arial', sans-serif;
15
+ }
16
+
17
+ .container {
18
+ display: flex;
19
+ flex-direction: row;
20
+ height: 100vh;
21
+ margin-top: 20px;
22
+ }
23
+
24
+ .left-side {
25
+ flex: 1;
26
+ padding: 20px;
27
+ overflow-y: auto;
28
+ border: none;
29
+ border-radius: 10px;
30
+ }
31
+
32
+ .right-side {
33
+ flex: 1;
34
+ padding: 20px;
35
+ background-color: #1d2c38;
36
+ border-left: 1px solid #4e5d6c;
37
+ border-radius: 10px;
38
+ display: flex;
39
+ justify-content: center;
40
+ align-items: center;
41
+ }
42
+
43
+ .card {
44
+ background-color: #2a2f36;
45
+ border: none;
46
+ border-radius: 10px;
47
+ box-shadow: 0 4px 8px rgba(0, 0, 0, 0.5);
48
+ margin-bottom: 20px;
49
+ }
50
+
51
+ .card-header {
52
+ background-color: #28a745;
53
+ color: white;
54
+ border-top-left-radius: 10px;
55
+ border-top-right-radius: 10px;
56
+ }
57
+
58
+ .list-group-item {
59
+ border: none;
60
+ background-color: #3a4149;
61
+ color: #e0e0e0;
62
+ padding: 10px;
63
+ }
64
+
65
+ iframe {
66
+ width: 100%;
67
+ height: 100%;
68
+ border: none;
69
+ border-radius: 12px;
70
+ }
71
+
72
+ .list-group-item strong {
73
+ color: #e0e0e0;
74
+ }
75
+
76
+ h2 {
77
+ margin-bottom: 20px;
78
+ color: #e0e0e0;
79
+ }
80
+
81
+ h3 {
82
+ margin-top: 10px;
83
+ margin-bottom: 10px;
84
+ font-size: 1.25rem;
85
+ color: #28a745;
86
+ }
87
+
88
+ pre {
89
+ background-color: #3a4149;
90
+ padding: 10px;
91
+ border-radius: 5px;
92
+ font-size: 1rem;
93
+ color: #e0e0e0;
94
+ overflow-x: auto;
95
+ }
96
+
97
+ .card-footer {
98
+ text-align: center;
99
+ border-top: 1px solid #4e5d6c;
100
+ padding: 15px;
101
+ }
102
+
103
+ .no-pdf-message {
104
+ text-align: center;
105
+ font-size: 1.25rem;
106
+ color: #6c757d;
107
+ }
108
+
109
+ @keyframes pulse {
110
+ 0% {
111
+ transform: scale(1);
112
+ }
113
+
114
+ 50% {
115
+ transform: scale(1.2);
116
+ }
117
+
118
+ 100% {
119
+ transform: scale(1);
120
+ }
121
+ }
122
+
123
+ .emoji {
124
+ font-size: 2rem;
125
+ animation: pulse 1s infinite;
126
+ display: inline-block;
127
+ margin-right: 10px;
128
+ }
129
+
130
+ .emoji-high {
131
+ color: #28a745;
132
+ }
133
+
134
+ .emoji-medium {
135
+ color: #ffc107;
136
+ }
137
+
138
+ .emoji-low {
139
+ color: #dc3545;
140
+ }
141
+
142
+ a {
143
+ color: #007bff;
144
+ }
145
+ </style>
146
+
147
+ </head>
148
+
149
+ <body>
150
+ <div class="container">
151
+ <div class="left-side">
152
+ <div class="card">
153
+ <div class="card-header text-center">
154
+ <h3>Model</h3>
155
+ <h2>Extracted Details</h2>
156
+ </div>
157
+ <div class="card-body">
158
+ <ul class="list-group mb-3">
159
+ <li class="list-group-item">
160
+ <strong>Extracted Data:</strong>
161
+ {% for filename, text in data.extracted_text.items() %}
162
+ <h3>{{ filename }}:</h3>
163
+ <img src="{{ Img[filename] }}" alt="Processed Image" class="img-fluid mb-3"
164
+ style="max-width: 100%; height: auto;" />
165
+ <strong>Text:</strong>
166
+ <p>{{ text }}</p>
167
+ {% endfor %}
168
+ </li>
169
+ <li class="list-group-item">
170
+ <strong>Name:</strong>
171
+ {% if data.name is iterable and data.name is not string %}
172
+ <ul>
173
+ {% for value in data.name %}
174
+ <li>{{ value }}<br></li>
175
+ {% endfor %}
176
+ </ul>
177
+ {% else %}
178
+ <p>{{ data.name }}</p>
179
+ {% endif %}
180
+ </li>
181
+ <li class="list-group-item">
182
+ <strong>Designation:</strong>
183
+ {% if data.Designation is iterable and data.Designation is not string %}
184
+ <ul>
185
+ {% for value in data.Designation %}
186
+ <li>{{ value }}<br></li>
187
+ {% endfor %}
188
+ </ul>
189
+ {% else %}
190
+ <p>{{ data.Designation }}</p>
191
+ {% endif %}
192
+ </li>
193
+ <li class="list-group-item">
194
+ <strong>Contact Number:</strong>
195
+ {% if data.contact_number is iterable and data.contact_number is not string %}
196
+ <ul>
197
+ {% for value in data.contact_number %}
198
+ <li>{{ value }}<br></li>
199
+ {% endfor %}
200
+ </ul>
201
+ {% else %}
202
+ <p>{{ data.contact_number }}</p>
203
+ {% endif %}
204
+ </li>
205
+ <li class="list-group-item">
206
+ <strong>Email:</strong>
207
+ {% if data.email is iterable and data.email is not string %}
208
+ <ul>
209
+ {% for value in data.email %}
210
+ <li>{{ value }}<br></li>
211
+ {% endfor %}
212
+ </ul>
213
+ {% else %}
214
+ <p>{{ data.email }}</p>
215
+ {% endif %}
216
+ </li>
217
+ <li class="list-group-item">
218
+ <strong>Address:</strong>
219
+ {% if data.Location is iterable and data.Location is not string %}
220
+ <ul>
221
+ {% for value in data.Location %}
222
+ <li>{{ value }}<br></li>
223
+ {% endfor %}
224
+ </ul>
225
+ {% else %}
226
+ <p>{{ data.Location }}</p>
227
+ {% endif %}
228
+ </li>
229
+ <li class="list-group-item">
230
+ <strong>Links:</strong>
231
+ {% if data.Link is iterable and data.Link is not string %}
232
+ <ul>
233
+ {% for value in data.Link %}
234
+ <li>{{ value }}<br></li>
235
+ {% endfor %}
236
+ </ul>
237
+ {% else %}
238
+ <p>{{ data.Link }}</p>
239
+ {% endif %}
240
+ </li>
241
+ <li class="list-group-item">
242
+ <strong>Organisation:</strong>
243
+ {% if data.Company is iterable and data.Company is not string %}
244
+ <ul>
245
+ {% for value in data.Company %}
246
+ <li>{{ value }}<br></li>
247
+ {% endfor %}
248
+ </ul>
249
+ {% else %}
250
+ <p>{{ data.Company }}</p>
251
+ {% endif %}
252
+ </li>
253
+ </ul>
254
+ <a href="{{ url_for('index') }}">
255
+ <button type="button" class="btn btn-primary">Back to Upload</button>
256
+ </a>
257
+ </div>
258
+ </div>
259
+ <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"></script>
260
+ <script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.5.4/dist/umd/popper.min.js"></script>
261
+ <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>
262
+ </body>
263
+
264
+ </html>