|
|
@ -39,7 +39,7 @@ watch( |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<template #overlay> |
|
|
|
<template #overlay> |
|
|
|
<div class="bg-gray-50 shadow p-2 menu-filter-dropdown min-w-[400px]"> |
|
|
|
<div class="bg-gray-50 shadow p-2 menu-filter-dropdown min-w-[400px]"> |
|
|
|
<div class="sort-grid" @click.stop> |
|
|
|
<div v-if="sorts?.length" class="sort-grid mb-2" @click.stop> |
|
|
|
<template v-for="(sort, i) in sorts || []" :key="i"> |
|
|
|
<template v-for="(sort, i) in sorts || []" :key="i"> |
|
|
|
<!-- <v-icon :key="`${i}icon`" class="nc-sort-item-remove-btn" small @click.stop="deleteSort(sort)"> mdi-close-box </v-icon> --> |
|
|
|
<!-- <v-icon :key="`${i}icon`" class="nc-sort-item-remove-btn" small @click.stop="deleteSort(sort)"> mdi-close-box </v-icon> --> |
|
|
|
<MdiDeleteIcon |
|
|
|
<MdiDeleteIcon |
|
|
@ -55,17 +55,14 @@ watch( |
|
|
|
@update:model-value="saveOrUpdate(sort, i)" |
|
|
|
@update:model-value="saveOrUpdate(sort, i)" |
|
|
|
/> |
|
|
|
/> |
|
|
|
<a-select |
|
|
|
<a-select |
|
|
|
size="small" |
|
|
|
|
|
|
|
v-model:value="sort.direction" |
|
|
|
v-model:value="sort.direction" |
|
|
|
|
|
|
|
size="small" |
|
|
|
class="flex-shrink-1 flex-grow-0 caption nc-sort-dir-select" |
|
|
|
class="flex-shrink-1 flex-grow-0 caption nc-sort-dir-select" |
|
|
|
:items="[ |
|
|
|
:items="[ |
|
|
|
{ text: 'asc', value: 'asc' }, |
|
|
|
{ text: 'asc', value: 'asc' }, |
|
|
|
{ text: 'desc', value: 'desc' }, |
|
|
|
{ text: 'desc', value: 'desc' }, |
|
|
|
]" |
|
|
|
]" |
|
|
|
:label="$t('labels.operation')" |
|
|
|
:label="$t('labels.operation')" |
|
|
|
density="compact" |
|
|
|
|
|
|
|
variant="solo" |
|
|
|
|
|
|
|
hide-details |
|
|
|
|
|
|
|
@click.stop |
|
|
|
@click.stop |
|
|
|
@update:model-value="saveOrUpdate(sort, i)" |
|
|
|
@update:model-value="saveOrUpdate(sort, i)" |
|
|
|
/> |
|
|
|
/> |
|
|
@ -75,7 +72,7 @@ watch( |
|
|
|
<!-- </v-select> --> |
|
|
|
<!-- </v-select> --> |
|
|
|
</template> |
|
|
|
</template> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<a-button size="small" class="text-grey text-capitalize text-sm my-3" @click.stop="addSort"> |
|
|
|
<a-button size="small" class="text-xs text-grey text-capitalize " @click.stop="addSort"> |
|
|
|
<div class="flex gap-1 align-center"> |
|
|
|
<div class="flex gap-1 align-center"> |
|
|
|
<MdiAddIcon /> |
|
|
|
<MdiAddIcon /> |
|
|
|
<!-- Add Sort Option --> |
|
|
|
<!-- Add Sort Option --> |
|
|
@ -94,4 +91,8 @@ watch( |
|
|
|
column-gap: 6px; |
|
|
|
column-gap: 6px; |
|
|
|
row-gap: 6px; |
|
|
|
row-gap: 6px; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
:deep(.ant-btn, .ant-select, .ant-input, ::placeholder) { |
|
|
|
|
|
|
|
@apply "!text-xs"; |
|
|
|
|
|
|
|
} |
|
|
|
</style> |
|
|
|
</style> |
|
|
|