forked from verdnatura/salix-front
56 lines
1.2 KiB
Vue
56 lines
1.2 KiB
Vue
<script setup>
|
|
defineProps({
|
|
columns: {
|
|
type: Array,
|
|
required: true,
|
|
},
|
|
row: {
|
|
type: Object,
|
|
default: null,
|
|
},
|
|
});
|
|
|
|
function stopEventPropagation(event) {
|
|
event.preventDefault();
|
|
event.stopPropagation();
|
|
}
|
|
</script>
|
|
<template>
|
|
<slot name="beforeChip" :row="row"></slot>
|
|
<span
|
|
v-for="col of columns"
|
|
:key="col.name"
|
|
@click="stopEventPropagation"
|
|
class="cursor-text"
|
|
>
|
|
<QChip
|
|
v-if="col.chip.condition(row[col.name], row)"
|
|
:title="col.label"
|
|
:class="[
|
|
col.chip.color
|
|
? col.chip.color(row)
|
|
: !col.chip.icon && 'bg-chip-secondary',
|
|
col.chip.icon && 'q-px-none',
|
|
]"
|
|
dense
|
|
square
|
|
>
|
|
<span v-if="!col.chip.icon">{{ row[col.name] }}</span>
|
|
<QIcon v-else :name="col.chip.icon" color="primary-light" />
|
|
</QChip>
|
|
</span>
|
|
<slot name="afterChip" :row="row"></slot>
|
|
</template>
|
|
<style lang="scss">
|
|
.bg-chip-secondary {
|
|
background-color: var(--vn-page-color);
|
|
color: var(--vn-text-color);
|
|
}
|
|
|
|
.cursor-text {
|
|
pointer-events: all;
|
|
cursor: text;
|
|
user-select: all;
|
|
}
|
|
</style>
|