Hugging Face's logo

Spaces:
artsmithai
/
undefined
Running

App Files Community
artsmithai commited on
Commit
74c3107
·
verified ·
1 Parent(s): f61b65b

lets add anew bom and edit a bom

Browse files
Files changed (2) hide show
  1. boms.html +80 -118
  2. locations.html +2 -2
boms.html CHANGED
@@ -6,15 +6,6 @@
6
  <title>BOMs | StockSync Pro</title>
7
  <script src="https://cdn.tailwindcss.com"></script>
8
  <script src="https://unpkg.com/feather-icons"></script>
9
- <style>
10
- .sidebar {
11
- transition: all 0.3s ease;
12
- }
13
- .bom-card:hover {
14
- transform: translateY(-3px);
15
- box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
16
- }
17
- </style>
18
  </head>
19
  <body class="bg-gray-50 font-sans text-gray-800">
20
  <div class="flex h-screen overflow-hidden">
@@ -100,151 +91,122 @@
100
  <i data-feather="plus" class="mr-2"></i> New BOM
101
  </button>
102
  <button class="px-4 py-2 border border-gray-300 rounded-lg hover:bg-gray-50 flex items-center">
103
- <i data-feather="download" class="mr-2"></i> Export
104
  </button>
105
  </div>
106
  </div>
107
 
108
- <!-- BOM Cards -->
109
  <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
110
  <!-- BOM 1 -->
111
- <div class="bg-white rounded-xl shadow-sm p-6 bom-card transition-transform">
112
- <div class="flex justify-between items-start mb-4">
113
- <div>
114
- <h3 class="text-lg font-semibold text-gray-900">Premium Widget Assembly</h3>
115
- <p class="text-sm text-gray-500">BOM-2023-001</p>
116
  </div>
117
- <span class="px-2 py-1 text-xs font-medium rounded-full bg-green-100 text-green-800">
118
- Active
119
- </span>
120
- </div>
121
- <div class="mb-4">
122
- <p class="text-sm text-gray-700 mb-2">6 Components</p>
123
- <div class="space-y-2">
124
- <div class="flex items-center text-sm">
125
- <span class="w-4 h-4 mr-2 bg-indigo-100 rounded-full flex items-center justify-center">
126
- <i data-feather="box" class="w-2 h-2 text-indigo-600"></i>
127
- </span>
128
- Premium Casing (1)
129
  </div>
130
- <div class="flex items-center text-sm">
131
- <span class="w-4 h-4 mr-2 bg-indigo-100 rounded-full flex items-center justify-center">
132
- <i data-feather="box" class="w-2 h-2 text-indigo-600"></i>
133
- </span>
134
- Circuit Board (1)
135
  </div>
136
- <div class="flex items-center text-sm">
137
- <span class="w-4 h-4 mr-2 bg-indigo-100 rounded-full flex items-center justify-center">
138
- <i data-feather="box" class="w-2 h-2 text-indigo-600"></i>
139
- </span>
140
- LCD Display (1)
141
  </div>
142
- <div class="text-xs text-gray-500 mt-1">+3 more components</div>
143
  </div>
144
- </div>
145
- <div class="flex justify-between items-center text-sm">
146
- <div class="text-gray-500">Last updated: 2 days ago</div>
147
- <div class="flex space-x-2">
148
- <button class="text-indigo-600 hover:text-indigo-900">
149
- <i data-feather="edit" class="w-4 h-4"></i>
 
150
  </button>
151
- <button class="text-gray-500 hover:text-gray-700">
152
- <i data-feather="eye" class="w-4 h-4"></i>
153
  </button>
154
  </div>
155
  </div>
156
  </div>
157
 
158
  <!-- BOM 2 -->
159
- <div class="bg-white rounded-xl shadow-sm p-6 bom-card transition-transform">
160
- <div class="flex justify-between items-start mb-4">
161
- <div>
162
- <h3 class="text-lg font-semibold text-gray-900">Basic Widget Assembly</h3>
163
- <p class="text-sm text-gray-500">BOM-2023-002</p>
164
  </div>
165
- <span class="px-2 py-1 text-xs font-medium rounded-full bg-green-100 text-green-800">
166
- Active
167
- </span>
168
- </div>
169
- <div class="mb-4">
170
- <p class="text-sm text-gray-700 mb-2">4 Components</p>
171
- <div class="space-y-2">
172
- <div class="flex items-center text-sm">
173
- <span class="w-4 h-4 mr-2 bg-indigo-100 rounded-full flex items-center justify-center">
174
- <i data-feather="box" class="w-2 h-2 text-indigo-600"></i>
175
- </span>
176
- Basic Casing (1)
177
  </div>
178
- <div class="flex items-center text-sm">
179
- <span class="w-4 h-4 mr-2 bg-indigo-100 rounded-full flex items-center justify-center">
180
- <i data-feather="box" class="w-2 h-2 text-indigo-600"></i>
181
- </span>
182
- Circuit Board (1)
183
  </div>
184
- <div class="flex items-center text-sm">
185
- <span class="w-4 h-4 mr-2 bg-indigo-100 rounded-full flex items-center justify-center">
186
- <i data-feather="box" class="w-2 h-2 text-indigo-600"></i>
187
- </span>
188
- Power Adapter (1)
189
  </div>
190
  </div>
191
- </div>
192
- <div class="flex justify-between items-center text-sm">
193
- <div class="text-gray-500">Last updated: 1 week ago</div>
194
- <div class="flex space-x-2">
195
- <button class="text-indigo-600 hover:text-indigo-900">
196
- <i data-feather="edit" class="w-4 h-4"></i>
197
  </button>
198
- <button class="text-gray-500 hover:text-gray-700">
199
- <i data-feather="eye" class="w-4 h-4"></i>
 
 
 
200
  </button>
201
  </div>
202
  </div>
203
  </div>
204
 
205
  <!-- BOM 3 -->
206
- <div class="bg-white rounded-xl shadow-sm p-6 bom-card transition-transform">
207
- <div class="flex justify-between items-start mb-4">
208
- <div>
209
- <h3 class="text-lg font-semibold text-gray-900">Deluxe Widget Assembly</h3>
210
- <p class="text-sm text-gray-500">BOM-2023-003</p>
211
  </div>
212
- <span class="px-2 py-1 text-xs font-medium rounded-full bg-yellow-100 text-yellow-800">
213
- Draft
214
- </span>
215
- </div>
216
- <div class="mb-4">
217
- <p class="text-sm text-gray-700 mb-2">8 Components</p>
218
- <div class="space-y-2">
219
- <div class="flex items-center text-sm">
220
- <span class="w-4 h-4 mr-2 bg-indigo-100 rounded-full flex items-center justify-center">
221
- <i data-feather="box" class="w-2 h-2 text-indigo-600"></i>
222
- </span>
223
- Aluminum Casing (1)
224
  </div>
225
- <div class="flex items-center text-sm">
226
- <span class="w-4 h-4 mr-2 bg-indigo-100 rounded-full flex items-center justify-center">
227
- <i data-feather="box" class="w-2 h-2 text-indigo-600"></i>
228
- </span>
229
- Premium Circuit Board (1)
230
  </div>
231
- <div class="flex items-center text-sm">
232
- <span class="w-4 h-4 mr-2 bg-indigo-100 rounded-full flex items-center justify-center">
233
- <i data-feather="box" class="w-2 h-2 text-indigo-600"></i>
234
- </span>
235
- Touchscreen Display (1)
236
  </div>
237
- <div class="text-xs text-gray-500 mt-1">+5 more components</div>
238
  </div>
239
- </div>
240
- <div class="flex justify-between items-center text-sm">
241
- <div class="text-gray-500">Last updated: 3 days ago</div>
242
- <div class="flex space-x-2">
243
- <button class="text-indigo-600 hover:text-indigo-900">
244
- <i data-feather="edit" class="w-4 h-4"></i>
 
245
  </button>
246
- <button class="text-gray-500 hover:text-gray-700">
247
- <i data-feather="eye" class="w-4 h-4"></i>
248
  </button>
249
  </div>
250
  </div>
 
6
  <title>BOMs | StockSync Pro</title>
7
  <script src="https://cdn.tailwindcss.com"></script>
8
  <script src="https://unpkg.com/feather-icons"></script>
 
 
 
 
 
 
 
 
 
9
  </head>
10
  <body class="bg-gray-50 font-sans text-gray-800">
11
  <div class="flex h-screen overflow-hidden">
 
91
  <i data-feather="plus" class="mr-2"></i> New BOM
92
  </button>
93
  <button class="px-4 py-2 border border-gray-300 rounded-lg hover:bg-gray-50 flex items-center">
94
+ <i data-feather="refresh-cw" class="mr-2"></i> Refresh
95
  </button>
96
  </div>
97
  </div>
98
 
99
+ <!-- BOM List -->
100
  <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
101
  <!-- BOM 1 -->
102
+ <div class="bg-white rounded-xl shadow-sm overflow-hidden hover:shadow-md transition-shadow duration-300">
103
+ <div class="p-6">
104
+ <div class="flex justify-between items-start mb-2">
105
+ <h3 class="text-xl font-bold">Premium Widget Assembly</h3>
106
+ <span class="px-3 py-1 bg-green-100 text-green-800 text-xs font-medium rounded-full">Active</span>
107
  </div>
108
+ <p class="text-gray-600 mb-4">Complete assembly for flagship product</p>
109
+
110
+ <div class="space-y-3">
111
+ <div class="flex justify-between text-sm">
112
+ <span class="text-gray-500">Revision:</span>
113
+ <span class="font-medium">3.2</span>
 
 
 
 
 
 
114
  </div>
115
+ <div class="flex justify-between text-sm">
116
+ <span class="text-gray-500">Components:</span>
117
+ <span class="font-medium">14</span>
 
 
118
  </div>
119
+ <div class="flex justify-between text-sm">
120
+ <span class="text-gray-500">Last Updated:</span>
121
+ <span class="font-medium">2024-02-15</span>
 
 
122
  </div>
 
123
  </div>
124
+
125
+ <div class="mt-4 flex justify-between">
126
+ <button class="px-3 py-1 bg-indigo-600 text-white text-sm rounded-lg hover:bg-indigo-700">
127
+ View
128
+ </button>
129
+ <button class="px-3 py-1 border border-gray-300 text-gray-700 text-sm rounded-lg hover:bg-gray-50">
130
+ Edit
131
  </button>
132
+ <button class="px-3 py-1 bg-green-600 text-white text-sm rounded-lg hover:bg-green-700">
133
+ Create WO
134
  </button>
135
  </div>
136
  </div>
137
  </div>
138
 
139
  <!-- BOM 2 -->
140
+ <div class="bg-white rounded-xl shadow-sm overflow-hidden hover:shadow-md transition-shadow duration-300">
141
+ <div class="p-6">
142
+ <div class="flex justify-between items-start mb-2">
143
+ <h3 class="text-xl font-bold">Basic Widget Kit</h3>
144
+ <span class="px-3 py-1 bg-blue-100 text-blue-800 text-xs font-medium rounded-full">Draft</span>
145
  </div>
146
+ <p class="text-gray-600 mb-4">Entry-level product assembly</p>
147
+
148
+ <div class="space-y-3">
149
+ <div class="flex justify-between text-sm">
150
+ <span class="text-gray-500">Revision:</span>
151
+ <span class="font-medium">1.0</span>
 
 
 
 
 
 
152
  </div>
153
+ <div class="flex justify-between text-sm">
154
+ <span class="text-gray-500">Components:</span>
155
+ <span class="font-medium">8</span>
 
 
156
  </div>
157
+ <div class="flex justify-between text-sm">
158
+ <span class="text-gray-500">Last Updated:</span>
159
+ <span class="font-medium">2024-01-28</span>
 
 
160
  </div>
161
  </div>
162
+
163
+ <div class="mt-4 flex justify-between">
164
+ <button class="px-3 py-1 bg-indigo-600 text-white text-sm rounded-lg hover:bg-indigo-700">
165
+ View
 
 
166
  </button>
167
+ <button class="px-3 py-1 border border-gray-300 text-gray-700 text-sm rounded-lg hover:bg-gray-50">
168
+ Edit
169
+ </button>
170
+ <button class="px-3 py-1 bg-gray-300 text-gray-600 text-sm rounded-lg cursor-not-allowed" disabled>
171
+ Create WO
172
  </button>
173
  </div>
174
  </div>
175
  </div>
176
 
177
  <!-- BOM 3 -->
178
+ <div class="bg-white rounded-xl shadow-sm overflow-hidden hover:shadow-md transition-shadow duration-300">
179
+ <div class="p-6">
180
+ <div class="flex justify-between items-start mb-2">
181
+ <h3 class="text-xl font-bold">Power Module</h3>
182
+ <span class="px-3 py-1 bg-yellow-100 text-yellow-800 text-xs font-medium rounded-full">Pending Review</span>
183
  </div>
184
+ <p class="text-gray-600 mb-4">Power supply and regulation</p>
185
+
186
+ <div class="space-y-3">
187
+ <div class="flex justify-between text-sm">
188
+ <span class="text-gray-500">Revision:</span>
189
+ <span class="font-medium">2.1</span>
 
 
 
 
 
 
190
  </div>
191
+ <div class="flex justify-between text-sm">
192
+ <span class="text-gray-500">Components:</span>
193
+ <span class="font-medium">11</span>
 
 
194
  </div>
195
+ <div class="flex justify-between text-sm">
196
+ <span class="text-gray-500">Last Updated:</span>
197
+ <span class="font-medium">2024-02-10</span>
 
 
198
  </div>
 
199
  </div>
200
+
201
+ <div class="mt-4 flex justify-between">
202
+ <button class="px-3 py-1 bg-indigo-600 text-white text-sm rounded-lg hover:bg-indigo-700">
203
+ View
204
+ </button>
205
+ <button class="px-3 py-1 border border-gray-300 text-gray-700 text-sm rounded-lg hover:bg-gray-50">
206
+ Edit
207
  </button>
208
+ <button class="px-3 py-1 bg-gray-300 text-gray-600 text-sm rounded-lg cursor-not-allowed" disabled>
209
+ Create WO
210
  </button>
211
  </div>
212
  </div>
locations.html CHANGED
@@ -43,10 +43,10 @@
43
  </div>
44
  <div class="mb-6">
45
  <p class="text-xs uppercase text-indigo-300 mb-2">Manufacturing</p>
46
- <a href="#" class="flex items-center py-2 px-3 text-indigo-200 hover:bg-indigo-700 hover:text-white rounded-lg mb-2">
47
  <i data-feather="layers" class="mr-3"></i> BOMs
48
  </a>
49
- <a href="#" class="flex items-center py-2 px-3 text-indigo-200 hover:bg-indigo-700 hover:text-white rounded-lg">
50
  <i data-feather="clipboard" class="mr-3"></i> Work Orders
51
  </a>
52
  </div>
 
43
  </div>
44
  <div class="mb-6">
45
  <p class="text-xs uppercase text-indigo-300 mb-2">Manufacturing</p>
46
+ <a href="boms.html" class="flex items-center py-2 px-3 text-indigo-200 hover:bg-indigo-700 hover:text-white rounded-lg mb-2">
47
  <i data-feather="layers" class="mr-3"></i> BOMs
48
  </a>
49
+ <a href="#" class="flex items-center py-2 px-3 text-indigo-200 hover:bg-indigo-700 hover:text-white rounded-lg">
50
  <i data-feather="clipboard" class="mr-3"></i> Work Orders
51
  </a>
52
  </div>