Gleipnir/nidus-sync
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Factor upload requirements out into parent component

Browse source
This commit is contained in:
Eli Ribble 2026-04-15 17:36:33 +00:00
parent adcff5c5c8
commit f4d0ce015d
No known key found for this signature in database
2 changed files with 85 additions and 49 deletions
Download patch file Download diff file Expand all files Collapse all files

68
ts/components/TableUploadRequirements.vue
View file

@ -18,55 +18,29 @@
</tr>
</thead>
<tbody>
<tr>
<td class="required-field">City</td>
<td>The city portion of the address</td>
<td>Text</td>
<td>Visalia</td>
</tr>
<tr>
<td class="required-field">Comment</td>
<td>The condition of the pool</td>
<td>Text</td>
<td>"blue", "dry", "false pool", "green", or "murky"</td>
</tr>
<tr>
<td class="required-field">HouseNo</td>
<td>The house number portion of the address</td>
<td>Text</td>
<td>123</td>
</tr>
<tr>
<td class="required-field">State</td>
<td>The state portion of the address</td>
<td>Text</td>
<td>California</td>
</tr>
<tr>
<td class="required-field">Street</td>
<td>The street portion of the address</td>
<td>Text</td>
<td>Main St</td>
</tr>
<tr>
<td class="required-field">TargetLat</td>
<td>The latitude of the target location</td>
<td>Decimal Number</td>
<td>36.56245379</td>
</tr>
<tr>
<td class="required-field">TargetLon</td>
<td>The longitude of the target location</td>
<td>Decimal Number</td>
<td>-119.3948222</td>
</tr>
<tr>
<td class="required-field">ZIP</td>
<td>The postal code (ZIP) portion of the address</td>
<td>Text</td>
<td>93681</td>
<tr v-for="(req, index) in requirements">
<td :class="req.is_required ? 'required-field' : ''">
{{ req.field }}
</td>
<td>{{ req.description }}</td>
<td>{{ req.format }}</td>
<td>{{ req.example }}</td>
</tr>
</tbody>
</table>
</div>
</template>
<script setup lang="ts">
export interface UploadRequirement {
description: string;
example: string;
field: string;
format: string;
is_required: boolean;
}
interface Props {
requirements: UploadRequirement[];
}
const props = defineProps<Props>();
</script>

66
ts/view/configuration/UploadPoolFlyover.vue
View file

@ -4,7 +4,7 @@
<h2 class="mb-4">Upload Pool Data</h2>
<div class="card mb-4">
<TableUploadRequirements />
<TableUploadRequirements :requirements="requirements" />
</div>
<div class="card">
@ -30,10 +30,72 @@
</div>
</template>
<script setup lang="ts">
import { ref } from "vue";
import CSVUpload from "@/components/CSVUpload.vue";
import TableUploadRequirements from "@/components/TableUploadRequirements.vue";
import TableUploadRequirements, {
UploadRequirement,
} from "@/components/TableUploadRequirements.vue";
import { router } from "@/router";
const requirements = ref<UploadRequirement[]>([
{
description: "The city portion of the address",
example: "Visalia",
field: "City",
format: "Text",
is_required: true,
},
{
description: "The condition of the pool",
example: '"blue", "dry", "false pool", "green", or "murky"',
field: "Comment",
format: "Text",
is_required: true,
},
{
description: "The house number portion of the address",
example: "123",
field: "HouseNo",
format: "Text",
is_required: true,
},
{
description: "The state portion of the address",
example: "California",
field: "State",
format: "Text",
is_required: true,
},
{
description: "The street portion of the address",
example: "Main St",
field: "Street",
format: "Text",
is_required: true,
},
{
description: "The latitude of the target location",
example: "36.56245379",
field: "TargetLat",
format: "Decimal Number",
is_required: true,
},
{
description: "The longitude of the target location",
example: "-119.3948222",
field: "TargetLon",
format: "Decimal Number",
is_required: true,
},
{
description: "The postal code (ZIP) portion of the address",
example: "93681",
field: "ZIP",
format: "Text",
is_required: true,
},
]);
function onError(err: Error) {
console.error("CSV upload error", err);
}