feat: add scheduled maintenance tasks (#320)

* add scheduled maintenance tasks

* fix failing typecheck
This commit is contained in:
Hayden 2023-02-26 18:42:23 -09:00 committed by GitHub
parent 70297b9d27
commit 025521431e
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
25 changed files with 521 additions and 121 deletions

View file

@ -1,13 +1,13 @@
<template>
<div v-if="!inline" class="form-control w-full">
<label class="label">
<span class="label-text"> Date </span>
<span class="label-text"> {{ label }}</span>
</label>
<input ref="input" v-model="selected" type="date" class="input input-bordered w-full" />
</div>
<div v-else class="sm:grid sm:grid-cols-4 sm:items-start sm:gap-4">
<label class="label">
<span class="label-text"> Date </span>
<span class="label-text"> {{ label }} </span>
</label>
<input v-model="selected" type="date" class="input input-bordered col-span-3 w-full mt-2" />
</div>
@ -18,7 +18,7 @@
const props = defineProps({
modelValue: {
type: Date as () => Date | string,
type: Date as () => Date | string | null,
required: false,
default: null,
},
@ -26,6 +26,10 @@
type: Boolean,
default: false,
},
label: {
type: String,
default: "Date",
},
});
const selected = computed({

View file

@ -5,6 +5,10 @@ export function validDate(dt: Date | string | null | undefined): boolean {
// If it's a string, try to parse it
if (typeof dt === "string") {
if (dt.startsWith("0001")) {
return false;
}
const parsed = new Date(dt);
if (isNaN(parsed.getTime())) {
return false;

View file

@ -135,7 +135,8 @@ describe("user should be able to create an item and add an attachment", () => {
const { response, data } = await api.items.maintenance.create(item.id, {
name: faker.vehicle.model(),
description: faker.lorem.paragraph(1),
date: faker.date.past(1),
completedDate: faker.date.past(1),
scheduledDate: "null",
cost: faker.datatype.number(100).toString(),
});

View file

@ -59,9 +59,14 @@ export class FieldsAPI extends BaseAPI {
}
}
type MaintenanceEntryQuery = {
scheduled?: boolean;
completed?: boolean;
};
export class MaintenanceAPI extends BaseAPI {
getLog(itemId: string) {
return this.http.get<MaintenanceLog>({ url: route(`/items/${itemId}/maintenance`) });
getLog(itemId: string, q: MaintenanceEntryQuery = {}) {
return this.http.get<MaintenanceLog>({ url: route(`/items/${itemId}/maintenance`, q) });
}
create(itemId: string, data: MaintenanceEntryCreate) {

View file

@ -227,28 +227,37 @@ export interface LocationUpdate {
}
export interface MaintenanceEntry {
/** Sold */
completedDate: Date | string;
/** @example "0" */
cost: string;
date: Date | string;
description: string;
id: string;
name: string;
/** Sold */
scheduledDate: Date | string;
}
export interface MaintenanceEntryCreate {
/** Sold */
completedDate: Date | string;
/** @example "0" */
cost: string;
date: Date | string;
description: string;
name: string;
/** Sold */
scheduledDate: Date | string;
}
export interface MaintenanceEntryUpdate {
/** Sold */
completedDate: Date | string;
/** @example "0" */
cost: string;
date: Date | string;
description: string;
name: string;
/** Sold */
scheduledDate: Date | string;
}
export interface MaintenanceLog {

View file

@ -360,8 +360,8 @@
},
{
id: "log",
name: "Log",
to: `/item/${itemId.value}/log`,
name: "Maintenance",
to: `/item/${itemId.value}/maintenance`,
},
{
id: "edit",

View file

@ -10,8 +10,20 @@
const api = useUserApi();
const toast = useNotifier();
const scheduled = ref(true);
watch(
() => scheduled.value,
() => {
refreshLog();
}
);
const { data: log, refresh: refreshLog } = useAsyncData(async () => {
const { data } = await api.items.maintenance.getLog(props.item.id);
const { data } = await api.items.maintenance.getLog(props.item.id, {
scheduled: scheduled.value,
completed: !scheduled.value,
});
return data;
});
@ -48,7 +60,8 @@
id: null as string | null,
modal: false,
name: "",
date: new Date(),
completedDate: null as Date | null,
scheduledDate: null as Date | null,
description: "",
cost: "",
});
@ -60,7 +73,8 @@
function resetEntry() {
entry.id = null;
entry.name = "";
entry.date = new Date();
entry.completedDate = null;
entry.scheduledDate = null;
entry.description = "";
entry.cost = "";
}
@ -74,9 +88,10 @@
const { error } = await api.items.maintenance.create(props.item.id, {
name: entry.name,
date: entry.date,
completedDate: entry.completedDate ?? "",
scheduledDate: entry.scheduledDate ?? "",
description: entry.description,
cost: entry.cost,
cost: parseFloat(entry.cost) ? entry.cost : "0",
});
if (error) {
@ -108,10 +123,12 @@
}
function openEditDialog(e: MaintenanceEntry) {
console.log(e);
entry.modal = true;
entry.id = e.id;
entry.name = e.name;
entry.date = new Date(e.date);
entry.completedDate = new Date(e.completedDate);
entry.scheduledDate = new Date(e.scheduledDate);
entry.description = e.description;
entry.cost = e.cost;
}
@ -123,7 +140,8 @@
const { error } = await api.items.maintenance.update(props.item.id, entry.id, {
name: entry.name,
date: entry.date,
completedDate: entry.completedDate ?? "null",
scheduledDate: entry.scheduledDate ?? "null",
description: entry.description,
cost: entry.cost,
});
@ -142,10 +160,13 @@
<template>
<div v-if="log">
<BaseModal v-model="entry.modal">
<template #title> Create Entry </template>
<template #title>
{{ entry.id ? "Edit Entry" : "New Entry" }}
</template>
<form @submit.prevent="createEntry">
<FormTextField v-model="entry.name" autofocus label="Entry Name" />
<DatePicker v-model="entry.date" label="Date" />
<DatePicker v-model="entry.completedDate" label="Completed Date" />
<DatePicker v-model="entry.scheduledDate" label="Scheduled Date" />
<FormTextArea v-model="entry.description" label="Notes" />
<FormTextField v-model="entry.cost" autofocus label="Cost" />
<div class="py-2 flex justify-end">
@ -171,11 +192,19 @@
/>
</div>
<div class="flex">
<div class="btn-group">
<button class="btn btn-sm" :class="`${scheduled ? 'btn-active' : ''}`" @click="scheduled = true">
Scheduled
</button>
<button class="btn btn-sm" :class="`${scheduled ? '' : 'btn-active'}`" @click="scheduled = false">
Completed
</button>
</div>
<BaseButton class="ml-auto" size="sm" @click="newEntry()">
<template #icon>
<Icon name="mdi-post" />
<Icon name="mdi-plus" />
</template>
Log Maintenance
New
</BaseButton>
</div>
<div class="container space-y-6">
@ -185,10 +214,14 @@
{{ e.name }}
</span>
<template #description>
<div class="flex gap-2">
<div class="badge p-3">
<div class="flex flex-wrap gap-2">
<div v-if="validDate(e.completedDate)" class="badge p-3">
<Icon name="mdi-check" class="mr-2" />
<DateTime :date="e.completedDate" format="human" />
</div>
<div v-else-if="validDate(e.scheduledDate)" class="badge p-3">
<Icon name="mdi-calendar" class="mr-2" />
<DateTime :date="e.date" format="human" />
<DateTime :date="e.scheduledDate" format="human" />
</div>
<div class="tooltip tooltip-primary" data-tip="Cost">
<div class="badge badge-primary p-3">