Patrick Toal
deb6a0b8ed
Some checks failed
Build BAB Application Deployment Artifact / build (push) Failing after 2m7s
86 lines
1.7 KiB
Vue
86 lines
1.7 KiB
Vue
<template>
|
|
<div class="q-pa-md">
|
|
<q-table
|
|
:rows="tasks"
|
|
:columns="columns"
|
|
row-key="$id"
|
|
no-data-label="I didn't find anything for you"
|
|
no-results-label="The filter didn't uncover any results"
|
|
>
|
|
<template v-slot:top>
|
|
<q-btn
|
|
color="primary"
|
|
:disable="loading"
|
|
label="New Task"
|
|
to="/task/new"
|
|
/>
|
|
<q-btn
|
|
v-if="tasks.length !== 0"
|
|
class="q-ml-sm"
|
|
color="primary"
|
|
:disable="loading"
|
|
label="Delete task(s)"
|
|
@click="deleteTask"
|
|
/>
|
|
<q-space />
|
|
<q-input
|
|
borderless
|
|
dense
|
|
debounce="300"
|
|
color="primary"
|
|
v-model="filter"
|
|
>
|
|
<template v-slot:append>
|
|
<q-icon name="search" />
|
|
</template>
|
|
</q-input>
|
|
</template>
|
|
</q-table>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import { defineProps, ref } from 'vue';
|
|
import { useTaskStore, Task } from 'src/stores/task';
|
|
import type { QTableProps } from 'quasar';
|
|
|
|
const loading = ref(false); // Placeholder
|
|
const columns = <QTableProps['columns']>[
|
|
{
|
|
name: 'title',
|
|
required: true,
|
|
label: 'Title',
|
|
align: 'left',
|
|
field: 'title',
|
|
sortable: true,
|
|
},
|
|
{
|
|
name: 'description',
|
|
align: 'left',
|
|
label: 'Description',
|
|
field: 'description',
|
|
sortable: false,
|
|
},
|
|
{
|
|
name: 'status',
|
|
align: 'left',
|
|
label: 'Status',
|
|
field: 'status',
|
|
sortable: true,
|
|
},
|
|
];
|
|
|
|
const props = defineProps<{ tasks: Task[] }>();
|
|
const taskStore = useTaskStore();
|
|
taskStore.fetchTaskTags();
|
|
taskStore.fetchSkillTags();
|
|
|
|
function newTask() {
|
|
return;
|
|
}
|
|
function deleteTask() {
|
|
return;
|
|
}
|
|
const filter = ref('');
|
|
</script>
|