malik-AI commited on
Commit
b0953ce
·
verified ·
1 Parent(s): 442f755

analyze it and create a quick demo of it: First Name Last Name Property Address Property City Property State Property Zip Mailing Address Mailing City Mailing State Mailing Zip Phone1 Type1 Phone2

Browse files

Noriko Tagawa 10205 Long Rifle Dr Fort Worth TX 76108 10150 Torre Ave Apt 345 Cupertino CA 76108 4082612870 Landline 2188656854
Robert Brissie 844 Ember Ln Mesquite TX 75149 142 Moonlight Dr Plano TX 75149 7709063767 Mobile 7709959342
Joel Garcia 610 Edelweiss Dr Grand Prairie TX 75052 10348 Bancroft Ln Frisco TX 75052 4693484887 Mobile
Steven Driscoll 619 Twilight Trl Richardson TX 75080 900 N Lindale Ln Richardson TX 75080 4695692245 Mobile 9722350123
Robert Ellis 1009 Hay Stack Ct Little Elm TX 75068 37471 Harvest Dr Murrieta CA 75068 6263391489 Landline 9516918559
Manuel Valdez 605 Greencove Dr Garland TX 75040 701 Tearose Dr Garland TX 75040 9724855971 Landline 2142903072
Jae Yeol Park 1253 Spanish Moss Dr Aubrey TX 76227 300 Flax Ln San Ramon CA 76227 9256488242 Landline 4088282776
Nancy Worrell 625 Greenleaf Dr Richardson TX 75080 823 Westwood Dr Richardson TX 75080 9728976338 Mobile 9727838084
Merly Binua 1412 High Plains Dr Mesquite TX 75149 11906 Leisure Dr Dallas TX 75149 2142999697 Landline 9722796516
Bijaya Shakya 3704 Forest Ct Grand Prairie TX 75052 3704 Sunrise Ranch Rd Southlake TX 75052 4692746531 Mobile 4692358759
Joseph Albano 3501 Clover Meadow Dr Garland TX 75043 11700 Preston Rd Dallas TX 75043 2147894506 Mobile 2145777270
Randolph King 627 Dumont Dr Richardson TX 75080 4748 Old Bent Tree Ln Apt 707 Dallas TX 75080 2147247661 Mobile 9722355730
Leonard Thomas 908 Spring Brook Dr Allen TX 75002 1011 Hampshire Ln Ste 200 Richardson TX 75002 2146908353 Mobile
Khang Nguyen 710 Carriagehouse Ln Garland TX 75040 1301 Ropers Way Haslet TX 75040 2604465560 Mobile 2148428555
Shubhada Dhoble 1013 Mesa Verde Allen TX 75002 7000 Canyonbrook Dr Plano TX 75002 9724238546 Landline 2147646932
Hailu Feleke 4602 Spinnaker Cv Garland TX 75043 4306 Godwit Ln Garland TX 75043 2144043257 Mobile 2142650509
Jv Jardin 1015 Jardin Dr Mesquite TX 75149 PO Box 851025 Richardson TX 75149 2147338889 Landline 2127531141
Sourabh Sinha 2704 Safe Harbor Dr The Colony TX 75056 14944 Holly Tree Ln Frisco TX 75056 9729539819 Mobile 2144413970
Chun Zhu 921 Thistle Cir Allen TX 75002 1547 Eddington Pl San Jose CA 75002 4053347368 Mobile 7654636962

Files changed (3) hide show
  1. components/navbar.js +2 -3
  2. property-dashboard.html +193 -0
  3. style.css +50 -1
components/navbar.js CHANGED
@@ -102,15 +102,14 @@ class CustomNavbar extends HTMLElement {
102
  <a href="/" class="logo">
103
  <i class="fas fa-chart-pie"></i> NASKSOFT
104
  </a>
105
-
106
  <div class="nav-links">
107
  <a href="/">Home</a>
108
  <a href="dashboard.html">Dashboard</a>
 
109
  <a href="upload.html">Upload Data</a>
110
  <a href="about.html">About</a>
111
  </div>
112
-
113
- <div class="auth-buttons">
114
  <a href="#" class="btn btn-outline">Login</a>
115
  <a href="#" class="btn btn-primary">Sign Up</a>
116
  </div>
 
102
  <a href="/" class="logo">
103
  <i class="fas fa-chart-pie"></i> NASKSOFT
104
  </a>
 
105
  <div class="nav-links">
106
  <a href="/">Home</a>
107
  <a href="dashboard.html">Dashboard</a>
108
+ <a href="property-dashboard.html">Property Data</a>
109
  <a href="upload.html">Upload Data</a>
110
  <a href="about.html">About</a>
111
  </div>
112
+ <div class="auth-buttons">
 
113
  <a href="#" class="btn btn-outline">Login</a>
114
  <a href="#" class="btn btn-primary">Sign Up</a>
115
  </div>
property-dashboard.html ADDED
@@ -0,0 +1,193 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>Property Owners Dashboard | NASKSOFT</title>
7
+ <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
8
+ <link rel="stylesheet" href="style.css">
9
+ </head>
10
+ <body>
11
+ <custom-navbar></custom-navbar>
12
+
13
+ <main class="dashboard">
14
+ <div class="container">
15
+ <div class="dashboard-header">
16
+ <h1>Property Owners Dashboard</h1>
17
+ <div class="dashboard-actions">
18
+ <button class="btn btn-outline"><i class="fas fa-filter"></i> Filters</button>
19
+ <button class="btn btn-primary"><i class="fas fa-download"></i> Export</button>
20
+ </div>
21
+ </div>
22
+
23
+ <div class="stats-grid">
24
+ <div class="stat-card">
25
+ <h3>Total Owners</h3>
26
+ <div class="stat-value">19</div>
27
+ </div>
28
+ <div class="stat-card">
29
+ <h3>Texas Properties</h3>
30
+ <div class="stat-value">19</div>
31
+ </div>
32
+ <div class="stat-card">
33
+ <h3>California Owners</h3>
34
+ <div class="stat-value">4</div>
35
+ </div>
36
+ <div class="stat-card">
37
+ <h3>Mobile Contacts</h3>
38
+ <div class="stat-value">11</div>
39
+ </div>
40
+ </div>
41
+
42
+ <div class="dashboard-grid">
43
+ <div class="dashboard-card wide">
44
+ <div class="card-header">
45
+ <h3>Property Locations</h3>
46
+ <div class="card-actions">
47
+ <button class="btn-icon"><i class="fas fa-map"></i></button>
48
+ </div>
49
+ </div>
50
+ <div id="map" style="height: 400px; margin-top: 1rem; background: #eee; border-radius: 8px; display: flex; align-items: center; justify-content: center;">
51
+ <p>Map visualization would appear here</p>
52
+ </div>
53
+ </div>
54
+
55
+ <div class="dashboard-card">
56
+ <h3>Phone Types</h3>
57
+ <div class="chart-container">
58
+ <canvas id="phoneChart"></canvas>
59
+ </div>
60
+ </div>
61
+
62
+ <div class="dashboard-card">
63
+ <h3>Cities Distribution</h3>
64
+ <div class="chart-container">
65
+ <canvas id="cityChart"></canvas>
66
+ </div>
67
+ </div>
68
+
69
+ <div class="dashboard-card wide">
70
+ <h3>Owner Details</h3>
71
+ <div class="data-table">
72
+ <table>
73
+ <thead>
74
+ <tr>
75
+ <th>Name</th>
76
+ <th>Property Address</th>
77
+ <th>City</th>
78
+ <th>State</th>
79
+ <th>Phone</th>
80
+ <th>Type</th>
81
+ </tr>
82
+ </thead>
83
+ <tbody>
84
+ <tr>
85
+ <td>Noriko Tagawa</td>
86
+ <td>10205 Long Rifle Dr</td>
87
+ <td>Fort Worth</td>
88
+ <td>TX</td>
89
+ <td>408-261-2870</td>
90
+ <td>Landline</td>
91
+ </tr>
92
+ <tr>
93
+ <td>Robert Brissie</td>
94
+ <td>844 Ember Ln</td>
95
+ <td>Mesquite</td>
96
+ <td>TX</td>
97
+ <td>770-906-3767</td>
98
+ <td>Mobile</td>
99
+ </tr>
100
+ <tr>
101
+ <td>Joel Garcia</td>
102
+ <td>610 Edelweiss Dr</td>
103
+ <td>Grand Prairie</td>
104
+ <td>TX</td>
105
+ <td>469-348-4887</td>
106
+ <td>Mobile</td>
107
+ </tr>
108
+ <tr>
109
+ <td>Steven Driscoll</td>
110
+ <td>619 Twilight Trl</td>
111
+ <td>Richardson</td>
112
+ <td>TX</td>
113
+ <td>469-569-2245</td>
114
+ <td>Mobile</td>
115
+ </tr>
116
+ </tbody>
117
+ </table>
118
+ </div>
119
+ </div>
120
+ </div>
121
+ </div>
122
+ </main>
123
+
124
+ <custom-footer></custom-footer>
125
+
126
+ <script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
127
+ <script src="components/navbar.js"></script>
128
+ <script src="components/footer.js"></script>
129
+ <script>
130
+ document.addEventListener('DOMContentLoaded', function() {
131
+ // Phone Type Chart
132
+ const phoneCtx = document.getElementById('phoneChart').getContext('2d');
133
+ const phoneChart = new Chart(phoneCtx, {
134
+ type: 'doughnut',
135
+ data: {
136
+ labels: ['Mobile', 'Landline'],
137
+ datasets: [{
138
+ data: [11, 8],
139
+ backgroundColor: [
140
+ 'rgba(54, 162, 235, 0.7)',
141
+ 'rgba(255, 99, 132, 0.7)'
142
+ ],
143
+ borderColor: [
144
+ 'rgba(54, 162, 235, 1)',
145
+ 'rgba(255, 99, 132, 1)'
146
+ ],
147
+ borderWidth: 1
148
+ }]
149
+ },
150
+ options: {
151
+ responsive: true,
152
+ maintainAspectRatio: false,
153
+ plugins: {
154
+ legend: {
155
+ position: 'bottom'
156
+ }
157
+ }
158
+ }
159
+ });
160
+
161
+ // City Distribution Chart
162
+ const cityCtx = document.getElementById('cityChart').getContext('2d');
163
+ const cityChart = new Chart(cityCtx, {
164
+ type: 'bar',
165
+ data: {
166
+ labels: ['Garland', 'Richardson', 'Mesquite', 'Grand Prairie', 'Others'],
167
+ datasets: [{
168
+ label: 'Properties',
169
+ data: [4, 4, 3, 2, 6],
170
+ backgroundColor: 'rgba(75, 192, 192, 0.7)',
171
+ borderColor: 'rgba(75, 192, 192, 1)',
172
+ borderWidth: 1
173
+ }]
174
+ },
175
+ options: {
176
+ responsive: true,
177
+ maintainAspectRatio: false,
178
+ plugins: {
179
+ legend: {
180
+ display: false
181
+ }
182
+ },
183
+ scales: {
184
+ y: {
185
+ beginAtZero: true
186
+ }
187
+ }
188
+ }
189
+ });
190
+ });
191
+ </script>
192
+ </body>
193
+ </html>
style.css CHANGED
@@ -344,11 +344,60 @@ a:hover {
344
  box-shadow: var(--shadow-md);
345
  transform: translateY(-5px);
346
  }
347
-
348
  .dashboard-card.wide {
349
  grid-column: span 2;
350
  }
351
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
352
  .chart-container {
353
  height: 300px;
354
  margin-top: 1rem;
 
344
  box-shadow: var(--shadow-md);
345
  transform: translateY(-5px);
346
  }
 
347
  .dashboard-card.wide {
348
  grid-column: span 2;
349
  }
350
 
351
+ .stats-grid {
352
+ display: grid;
353
+ grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
354
+ gap: 1.5rem;
355
+ margin-bottom: 2rem;
356
+ }
357
+
358
+ .stat-card {
359
+ background: white;
360
+ padding: 1.5rem;
361
+ border-radius: 12px;
362
+ box-shadow: var(--shadow-sm);
363
+ }
364
+
365
+ .stat-card h3 {
366
+ font-size: 1rem;
367
+ color: var(--text-light);
368
+ margin-bottom: 0.5rem;
369
+ }
370
+
371
+ .stat-value {
372
+ font-size: 2rem;
373
+ font-weight: 700;
374
+ color: var(--primary-color);
375
+ }
376
+
377
+ .card-header {
378
+ display: flex;
379
+ justify-content: space-between;
380
+ align-items: center;
381
+ margin-bottom: 1rem;
382
+ }
383
+
384
+ .card-actions {
385
+ display: flex;
386
+ gap: 0.5rem;
387
+ }
388
+
389
+ .btn-icon {
390
+ background: none;
391
+ border: none;
392
+ color: var(--text-light);
393
+ font-size: 1rem;
394
+ cursor: pointer;
395
+ transition: var(--transition);
396
+ }
397
+
398
+ .btn-icon:hover {
399
+ color: var(--primary-color);
400
+ }
401
  .chart-container {
402
  height: 300px;
403
  margin-top: 1rem;