fix: added translation in Filter, SortBy & ColumnsSettings Component
This commit is contained in:
Shariq Ansari
parent
5567a197ca
commit
2e9a4c7a68
@ -24,7 +24,7 @@
|
||||
>
|
||||
<div class="flex items-center gap-2">
|
||||
<DragIcon class="h-3.5" />
|
||||
<div>{{ element.label }}</div>
|
||||
<div>{{ __(element.label) }}</div>
|
||||
</div>
|
||||
<div class="flex cursor-pointer items-center gap-1">
|
||||
<Button
|
||||
@ -56,7 +56,7 @@
|
||||
class="w-full !justify-start !text-gray-600"
|
||||
variant="ghost"
|
||||
@click="togglePopover()"
|
||||
label="Add Column"
|
||||
:label="__('Add Column')"
|
||||
>
|
||||
<template #prefix>
|
||||
<FeatherIcon name="plus" class="h-4" />
|
||||
@ -69,7 +69,7 @@
|
||||
class="w-full !justify-start !text-gray-600"
|
||||
variant="ghost"
|
||||
@click="reset(close)"
|
||||
label="Reset Changes"
|
||||
:label="__('Reset Changes')"
|
||||
>
|
||||
<template #prefix>
|
||||
<ReloadIcon class="h-4" />
|
||||
@ -80,7 +80,7 @@
|
||||
class="w-full !justify-start !text-gray-600"
|
||||
variant="ghost"
|
||||
@click="resetToDefault(close)"
|
||||
label="Reset to Default"
|
||||
:label="__('Reset to Default')"
|
||||
>
|
||||
<template #prefix>
|
||||
<ReloadIcon class="h-4" />
|
||||
@ -96,32 +96,32 @@
|
||||
<FormControl
|
||||
type="text"
|
||||
size="md"
|
||||
label="Label"
|
||||
:label="__('Label')"
|
||||
v-model="column.label"
|
||||
class="w-full"
|
||||
placeholder="Column Label"
|
||||
:placeholder="__('First Name')"
|
||||
/>
|
||||
<FormControl
|
||||
type="text"
|
||||
size="md"
|
||||
label="Width"
|
||||
:label="__('Width')"
|
||||
class="w-full"
|
||||
v-model="column.width"
|
||||
placeholder="Column Width"
|
||||
description="Width can be in number, pixel or rem (eg. 3, 30px, 10rem)"
|
||||
placeholder="10rem"
|
||||
:description="__('Width can be in number, pixel or rem (eg. 3, 30px, 10rem)')"
|
||||
:debounce="500"
|
||||
/>
|
||||
</div>
|
||||
<div class="flex w-full gap-2 border-t pt-2">
|
||||
<Button
|
||||
variant="subtle"
|
||||
label="Cancel"
|
||||
:label="__('Cancel')"
|
||||
class="w-full flex-1"
|
||||
@click="cancelUpdate"
|
||||
/>
|
||||
<Button
|
||||
variant="solid"
|
||||
label="Update"
|
||||
:label="__('Update')"
|
||||
class="w-full flex-1"
|
||||
@click="updateColumn(column)"
|
||||
/>
|
||||
|
||||
@ -24,14 +24,14 @@
|
||||
>
|
||||
<div class="flex items-center gap-2">
|
||||
<div class="w-13 pl-2 text-end text-base text-gray-600">
|
||||
{{ i == 0 ? 'Where' : 'And' }}
|
||||
{{ i == 0 ? __('Where') : __('And') }}
|
||||
</div>
|
||||
<div id="fieldname" class="!min-w-[140px]">
|
||||
<Autocomplete
|
||||
:value="f.field.fieldname"
|
||||
:options="filterableFields.data"
|
||||
@change="(e) => updateFilter(e, i)"
|
||||
placeholder="Filter by..."
|
||||
:placeholder="__('First Name')"
|
||||
/>
|
||||
</div>
|
||||
<div id="operator">
|
||||
@ -40,7 +40,7 @@
|
||||
v-model="f.operator"
|
||||
@change="(e) => updateOperator(e, f)"
|
||||
:options="getOperators(f.field.fieldtype, f.field.fieldname)"
|
||||
placeholder="Operator"
|
||||
placeholder="Equals"
|
||||
/>
|
||||
</div>
|
||||
<div id="value" class="!min-w-[140px]">
|
||||
@ -48,7 +48,7 @@
|
||||
:is="getValSelect(f)"
|
||||
v-model="f.value"
|
||||
@change="(v) => updateValue(v, f)"
|
||||
placeholder="Value"
|
||||
placeholder="John Doe"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
@ -58,21 +58,21 @@
|
||||
v-else
|
||||
class="mb-3 flex h-7 items-center px-3 text-sm text-gray-600"
|
||||
>
|
||||
Empty - Choose a field to filter by
|
||||
{{ __('Empty - Choose a field to filter by') }}
|
||||
</div>
|
||||
<div class="flex items-center justify-between gap-2">
|
||||
<Autocomplete
|
||||
value=""
|
||||
:options="filterableFields.data"
|
||||
@change="(e) => setfilter(e)"
|
||||
placeholder="Filter by..."
|
||||
:placeholder="__('First name')"
|
||||
>
|
||||
<template #target="{ togglePopover }">
|
||||
<Button
|
||||
class="!text-gray-600"
|
||||
variant="ghost"
|
||||
@click="togglePopover()"
|
||||
label="Add Filter"
|
||||
:label="__('Add Filter')"
|
||||
>
|
||||
<template #prefix>
|
||||
<FeatherIcon name="plus" class="h-4" />
|
||||
@ -84,7 +84,7 @@
|
||||
v-if="filters?.size"
|
||||
class="!text-gray-600"
|
||||
variant="ghost"
|
||||
label="Clear all Filter"
|
||||
:label="__('Clear all Filter')"
|
||||
@click="clearfilter(close)"
|
||||
/>
|
||||
</div>
|
||||
@ -529,71 +529,71 @@ const oppositeOperatorMap = {
|
||||
|
||||
const timespanOptions = [
|
||||
{
|
||||
label: 'Last Week',
|
||||
label: __('Last Week'),
|
||||
value: 'last week',
|
||||
},
|
||||
{
|
||||
label: 'Last Month',
|
||||
label: __('Last Month'),
|
||||
value: 'last month',
|
||||
},
|
||||
{
|
||||
label: 'Last Quarter',
|
||||
label: __('Last Quarter'),
|
||||
value: 'last quarter',
|
||||
},
|
||||
{
|
||||
label: 'Last 6 Months',
|
||||
label: __('Last 6 Months'),
|
||||
value: 'last 6 months',
|
||||
},
|
||||
{
|
||||
label: 'Last Year',
|
||||
label: __('Last Year'),
|
||||
value: 'last year',
|
||||
},
|
||||
{
|
||||
label: 'Yesterday',
|
||||
label: __('Yesterday'),
|
||||
value: 'yesterday',
|
||||
},
|
||||
{
|
||||
label: 'Today',
|
||||
label: __('Today'),
|
||||
value: 'today',
|
||||
},
|
||||
{
|
||||
label: 'Tomorrow',
|
||||
label: __('Tomorrow'),
|
||||
value: 'tomorrow',
|
||||
},
|
||||
{
|
||||
label: 'This Week',
|
||||
label: __('This Week'),
|
||||
value: 'this week',
|
||||
},
|
||||
{
|
||||
label: 'This Month',
|
||||
label: __('This Month'),
|
||||
value: 'this month',
|
||||
},
|
||||
{
|
||||
label: 'This Quarter',
|
||||
label: __('This Quarter'),
|
||||
value: 'this quarter',
|
||||
},
|
||||
{
|
||||
label: 'This Year',
|
||||
label: __('This Year'),
|
||||
value: 'this year',
|
||||
},
|
||||
{
|
||||
label: 'Next Week',
|
||||
label: __('Next Week'),
|
||||
value: 'next week',
|
||||
},
|
||||
{
|
||||
label: 'Next Month',
|
||||
label: __('Next Month'),
|
||||
value: 'next month',
|
||||
},
|
||||
{
|
||||
label: 'Next Quarter',
|
||||
label: __('Next Quarter'),
|
||||
value: 'next quarter',
|
||||
},
|
||||
{
|
||||
label: 'Next 6 Months',
|
||||
label: __('Next 6 Months'),
|
||||
value: 'next 6 months',
|
||||
},
|
||||
{
|
||||
label: 'Next Year',
|
||||
label: __('Next Year'),
|
||||
value: 'next year',
|
||||
},
|
||||
]
|
||||
|
||||
@ -33,15 +33,15 @@
|
||||
:value="sort.fieldname"
|
||||
:options="sortOptions.data"
|
||||
@change="(e) => updateSort(e, i)"
|
||||
placeholder="Sort by"
|
||||
:placeholder="__('First Name')"
|
||||
/>
|
||||
<FormControl
|
||||
class="!w-32"
|
||||
type="select"
|
||||
v-model="sort.direction"
|
||||
:options="[
|
||||
{ label: 'Ascending', value: 'asc' },
|
||||
{ label: 'Descending', value: 'desc' },
|
||||
{ label: __('Ascending'), value: 'asc' },
|
||||
{ label: __('Descending'), value: 'desc' },
|
||||
]"
|
||||
@change="
|
||||
(e) => {
|
||||
@ -49,7 +49,7 @@
|
||||
apply()
|
||||
}
|
||||
"
|
||||
placeholder="Sort by"
|
||||
:placeholder="__('Ascending')"
|
||||
/>
|
||||
<Button variant="ghost" icon="x" @click="removeSort(i)" />
|
||||
</div>
|
||||
@ -58,13 +58,13 @@
|
||||
v-else
|
||||
class="mb-3 flex h-7 items-center px-3 text-sm text-gray-600"
|
||||
>
|
||||
Empty - Choose a field to sort by
|
||||
{{ __('Empty - Choose a field to sort by') }}
|
||||
</div>
|
||||
<div class="flex items-center justify-between gap-2">
|
||||
<Autocomplete
|
||||
:options="options"
|
||||
value=""
|
||||
placeholder="Sort by"
|
||||
:placeholder="__('First Name')"
|
||||
@change="(e) => setSort(e)"
|
||||
>
|
||||
<template #target="{ togglePopover }">
|
||||
@ -72,7 +72,7 @@
|
||||
class="!text-gray-600"
|
||||
variant="ghost"
|
||||
@click="togglePopover()"
|
||||
label="Add Sort"
|
||||
:label="__('Add Sort')"
|
||||
>
|
||||
<template #prefix>
|
||||
<FeatherIcon name="plus" class="h-4" />
|
||||
@ -84,7 +84,7 @@
|
||||
v-if="sortValues?.size"
|
||||
class="!text-gray-600"
|
||||
variant="ghost"
|
||||
label="Clear Sort"
|
||||
:label="__('Clear Sort')"
|
||||
@click="clearSort(close)"
|
||||
/>
|
||||
</div>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user