57 lines
991 B
Vue
57 lines
991 B
Vue
<template>
|
|
<span>
|
|
<!-- eslint-disable vue/no-v-html -->
|
|
<span v-html="props.label"></span>
|
|
|
|
<span
|
|
v-if="isAsc() || isDesc()"
|
|
class="text-black-50"
|
|
>
|
|
<i
|
|
v-if="isAsc()"
|
|
class="ms-1 fa-solid fa-sort-up"
|
|
></i>
|
|
<i
|
|
v-if="isDesc()"
|
|
class="ms-1 fa-solid fa-sort-down"
|
|
></i>
|
|
</span>
|
|
</span>
|
|
</template>
|
|
|
|
<script setup>
|
|
const props = defineProps({
|
|
currentOrder: {
|
|
type: [String, null],
|
|
required: true,
|
|
},
|
|
currentSort: {
|
|
type: [String, null],
|
|
required: true,
|
|
},
|
|
order: {
|
|
type: [String, null],
|
|
required: true,
|
|
},
|
|
sort: {
|
|
type: [String, null],
|
|
required: true,
|
|
},
|
|
label: {
|
|
type: [String, null],
|
|
required: true,
|
|
},
|
|
})
|
|
|
|
const isActive = () => {
|
|
return props.currentOrder === props.order
|
|
}
|
|
|
|
const isAsc = () => {
|
|
return isActive() && props.currentSort === 'asc'
|
|
}
|
|
|
|
const isDesc = () => {
|
|
return isActive() && props.currentSort === 'desc'
|
|
}
|
|
</script>
|