Cleanup linting messages. Also, break some things

This commit is contained in:
2024-05-04 12:08:16 -04:00
parent c92f737612
commit fa4d83e42d
13 changed files with 196 additions and 174 deletions

View File

@@ -1,23 +1,26 @@
<template>
<q-card v-for="boat in boats" :key="boat.id" flat class="mobile-card">
<q-card-section>
<q-img :src="boat.imgSrc" :fit="'scale-down'">
<div class="row absolute-top">
<div class="col text-h6 text-left">{{ boat.name }}</div>
<div class="col text-right">{{ boat.class }}</div>
</div>
</q-img>
</q-card-section>
<div v-if="boats">
<q-card v-for="boat in boats" :key="boat.id" flat class="mobile-card">
<q-card-section>
<q-img :src="boat.imgSrc" :fit="'scale-down'">
<div class="row absolute-top">
<div class="col text-h6 text-left">{{ boat.name }}</div>
<div class="col text-right">{{ boat.class }}</div>
</div>
</q-img>
</q-card-section>
<q-separator />
<q-separator />
<q-card-actions align="evenly">
<q-btn flat>Info</q-btn>
<q-btn flat>Book</q-btn>
<q-btn flat>Check-Out</q-btn>
<q-btn flat>Check-In</q-btn>
</q-card-actions>
</q-card>
<q-card-actions align="evenly">
<q-btn flat>Info</q-btn>
<q-btn flat>Book</q-btn>
<q-btn flat>Check-Out</q-btn>
<q-btn flat>Check-In</q-btn>
</q-card-actions>
</q-card>
</div>
<div v-else><q-card>Sorry, no boats to show you!</q-card></div>
</template>
<script setup lang="ts">

View File

@@ -133,7 +133,7 @@
<q-separator />
<q-list dense>
<q-item
v-for="col in props.cols.filter((col) => col.name !== 'desc')"
v-for="col in props.cols.filter((col:Boat) => col.name !== 'desc')"
:key="col.name"
>
<q-item-section>
@@ -215,10 +215,8 @@
import { computed, defineProps, ref } from 'vue';
import { useTaskStore, Task, SkillTag, TaskTag } from 'src/stores/task';
import { QTableProps, date, useQuasar } from 'quasar';
import { useBoatStore } from 'src/stores/boat';
import { useRouter } from 'vue-router';
import { Boat, useBoatStore } from 'src/stores/boat';
const router = useRouter();
const selected = ref([]);
const loading = ref(false); // Placeholder
const fabShow = ref(false);
@@ -266,7 +264,7 @@ const columns = <QTableProps['columns']>[
align: 'left',
label: 'Boat',
field: (row) =>
useBoatStore().boats.find((boat) => boat.$id === row.boat)?.name,
useBoatStore().boats.value.find((boat) => boat.$id === row.boat)?.name,
sortable: true,
},
{
@@ -301,44 +299,51 @@ const columns = <QTableProps['columns']>[
{ name: 'actions', align: 'center', label: 'Actions', field: '$id' },
];
const props = defineProps<{ tasks: Task[] }>();
defineProps<{ tasks: Task[] }>();
const taskStore = useTaskStore();
const $q = useQuasar();
const searchFilter = ref({
interface SearchObject {
title: string;
skillTags: SkillTag[];
taskTags: TaskTag[];
}
const searchFilter = ref<SearchObject>({
title: '',
skillTags: <SkillTag[]>[],
taskTags: <TaskTag[]>[],
skillTags: [],
taskTags: [],
});
const skillTagOptions = ref<SkillTag[]>(taskStore.skillTags);
const taskTagOptions = ref<TaskTag[]>(taskStore.taskTags);
function onRowClick(evt: Event, row: Task) {
router.push({ name: 'edit-task', params: { id: row.$id } });
}
// function onRowClick(evt: Event, row: Task) {
// router.push({ name: 'edit-task', params: { id: row.$id } });
// }
// TODO: Implement server side search
const filterRows = computed(
() => (rows: readonly Task[], terms: any, cols: any, cellValueFn: any) => {
let result = rows;
result = rows.filter((row) =>
terms.title
? row.title.toLowerCase().includes(terms.title.toLowerCase())
: true
);
result = result.filter((row) =>
terms.skillTags && terms.skillTags.length > 0
? row.required_skills.some((req_skill) =>
terms.skillTags.map((t) => t.$id).includes(req_skill)
)
: true
);
result = result.filter((row) =>
terms.taskTags && terms.taskTags.length > 0
? row.tags.some((tag) => terms.taskTags.map((t) => t.$id).includes(tag))
: true
);
return result;
() => (rows: readonly Task[], terms: SearchObject) => {
return rows
.filter((row) =>
terms.title
? row.title.toLowerCase().includes(terms.title.toLowerCase())
: true
)
.filter((row) =>
terms.skillTags && terms.skillTags.length > 0
? row.required_skills.some((req_skill) =>
terms.skillTags.map((t) => t.$id).includes(req_skill)
)
: true
)
.filter((row) =>
terms.taskTags && terms.taskTags.length > 0
? row.tags.some((tag) =>
terms.taskTags.map((t) => t.$id).includes(tag)
)
: true
);
}
);