oys/bab-app
1
0
Fork 0
Code Issues 29 Pull Requests Actions Packages Projects 1 Releases 2 Wiki Activity

Densify table
All checks were successful
Build BAB Application Deployment Artifact / build (push) Successful in 2m9s
Details

Browse Source
This commit is contained in:
Patrick Toal
2024-04-07 10:43:38 -04:00
parent 299ede4aa9
commit 5d9dbb0653
1 changed files with 5 additions and 28 deletions
Download Patch File Download Diff File Expand all files Collapse all files

33
src/components/task/TaskTableComponent.vue
View File

@@ -1,8 +1,9 @@
<template> <template>
<div class="q-pa-md"> <div class="q-pa-sm">
<q-table <q-table
:rows="tasks" :rows="tasks"
:columns="columns" :columns="columns"
dense
row-key="$id" row-key="$id"
no-data-label="I didn't find anything for you" no-data-label="I didn't find anything for you"
no-results-label="The filter didn't uncover any results" no-results-label="The filter didn't uncover any results"
@@ -25,13 +26,7 @@
@click="deleteTasks" @click="deleteTasks"
/> />
<q-space /> <q-space />
<q-input <q-input borderless debounce="300" color="primary" v-model="filter">
borderless
dense
debounce="300"
color="primary"
v-model="filter"
>
<template v-slot:append> <template v-slot:append>
<q-icon name="search" /> <q-icon name="search" />
</template> </template>
@@ -40,9 +35,8 @@
<template v-slot:header="props"> <template v-slot:header="props">
<q-tr :props="props"> <q-tr :props="props">
<q-th key="desc" auto-width> <q-th key="desc" auto-width>
<q-checkbox v-model="props.selected"></q-checkbox> <q-checkbox dense v-model="props.selected"></q-checkbox>
</q-th> </q-th>
<q-th auto-width />
<q-th v-for="col in props.cols" :key="col.name" :props="props"> <q-th v-for="col in props.cols" :key="col.name" :props="props">
{{ col.label }} {{ col.label }}
</q-th> </q-th>
@@ -52,17 +46,7 @@
<template v-slot:body="props"> <template v-slot:body="props">
<q-tr :props="props"> <q-tr :props="props">
<q-td key="desc" auto-width> <q-td key="desc" auto-width>
<q-checkbox v-model="props.selected"></q-checkbox> <q-checkbox dense v-model="props.selected"></q-checkbox>
</q-td>
<q-td auto-width>
<q-btn
size="sm"
color="primary"
round
dense
@click="props.expand = !props.expand"
:icon="props.expand ? 'remove' : 'add'"
/>
</q-td> </q-td>
<q-td v-for="col in props.cols" :key="col.name" :props="props"> <q-td v-for="col in props.cols" :key="col.name" :props="props">
<div v-if="col.name == 'skills'" class="q-gutter-sm"> <div v-if="col.name == 'skills'" class="q-gutter-sm">
@@ -90,13 +74,6 @@
</div> </div>
</q-td> </q-td>
</q-tr> </q-tr>
<q-tr v-show="props.expand" :props="props">
<q-td auto-width />
<q-td auto-width />
<q-td colspan="100%">
<div class="text-left">{{ props.row.description }}<br /></div>
</q-td>
</q-tr>
</template> </template>
</q-table> </q-table>
</div> </div>