82 lines
1.9 KiB
Vue
82 lines
1.9 KiB
Vue
<script setup lang="ts">
|
|
import { QTableProps } from 'quasar';
|
|
import KebabAction from 'components/shared/KebabAction.vue';
|
|
|
|
const props = withDefaults(
|
|
defineProps<{
|
|
rows: QTableProps['rows'];
|
|
columns: QTableProps['columns'];
|
|
flat?: boolean;
|
|
bordered?: boolean;
|
|
grid?: boolean;
|
|
hideHeader?: boolean;
|
|
buttomDownload?: boolean;
|
|
}>(),
|
|
{
|
|
row: () => [],
|
|
column: () => [],
|
|
flat: false,
|
|
bordered: false,
|
|
grid: false,
|
|
hideHeader: false,
|
|
buttomDownload: false,
|
|
},
|
|
);
|
|
</script>
|
|
|
|
<template>
|
|
<q-table v-bind="props" class="full-height">
|
|
<template v-slot:header="props">
|
|
<q-tr
|
|
:style="`background-color:hsla(var(--info-bg) / 0.07) `"
|
|
:props="props"
|
|
>
|
|
<q-th v-for="col in props.cols" :key="col.name" :props="props">
|
|
<span v-if="col.label === 'nameEmployee'">
|
|
{{ $t('fullname') }}
|
|
</span>
|
|
|
|
<span v-if="col.label !== ''">
|
|
{{ $t(col.label) }}
|
|
</span>
|
|
</q-th>
|
|
</q-tr>
|
|
</template>
|
|
|
|
<template v-slot:body-cell-action="props">
|
|
<q-td class="text-center">
|
|
<q-btn
|
|
icon="mdi-eye-outline"
|
|
size="sm"
|
|
dense
|
|
round
|
|
flat
|
|
@click.stop="$emit('view', props.row.index)"
|
|
/>
|
|
|
|
<q-btn
|
|
v-if="buttomDownload"
|
|
icon="mdi-download-outline"
|
|
size="sm"
|
|
dense
|
|
round
|
|
flat
|
|
@click.stop="$emit('download', props.row)"
|
|
/>
|
|
|
|
<KebabAction
|
|
:id-name="props.row.code"
|
|
:status="props.row.status"
|
|
@view="$emit('view', props.row)"
|
|
@edit="$emit('edit', props.row)"
|
|
@delete="$emit('delete', props.row)"
|
|
@change-status="$emit('toggleStatus', props.row)"
|
|
/>
|
|
</q-td>
|
|
|
|
<slot name="dialog" :index="props.rowIndex" :row="props.row"></slot>
|
|
</template>
|
|
</q-table>
|
|
</template>
|
|
|
|
<style lang="less" scoped></style>
|