adminforth 1.6.2-next.6 → 1.6.2-next.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -16,7 +16,7 @@
16
16
  aria-describedby="helper-text-explanation"
17
17
  class="inline-flex bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-0 focus:ring-lightPrimary focus:border-lightPrimary dark:focus:ring-darkPrimary dark:focus:border-darkPrimary
18
18
  blue-500 focus:border-blue-500 block w-20 p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white translate-y-0"
19
- :class="{'rounded-l-md': !$slots.prefix, 'rounded-r-md': !$slots.suffix}"
19
+ :class="{'rounded-l-md': !$slots.prefix, 'rounded-r-md': !$slots.suffix, 'w-full': fullWidth}"
20
20
  >
21
21
 
22
22
 
@@ -33,6 +33,7 @@
33
33
 
34
34
  const props = defineProps({
35
35
  type: String,
36
+ fullWidth: Boolean,
36
37
  modelValue: String,
37
38
  })
38
39
 
@@ -53,13 +53,14 @@
53
53
  :modelValue="filtersStore.filters.find(f => f.field === c.name && f.operator === 'in')?.value || []"
54
54
  />
55
55
 
56
- <input
57
- v-else-if="[ 'string', 'text' ].includes(c.type)"
58
- type="text" class="w-full py-1 px-2 border border-gray-300 rounded-md dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500"
59
- :placeholder="$t('Search')"
60
- @input="setFilterItem({ column: c, operator: 'ilike', value: $event.target.value || undefined })"
61
- :value="getFilterItem({ column: c, operator: 'ilike' })"
62
- >
56
+ <Input
57
+ v-else-if="[ 'string', 'text' ].includes(c.type)"
58
+ type="text"
59
+ full-width
60
+ :placeholder="$t('Search')"
61
+ @update:modelValue="setFilterItem({ column: c, operator: 'ilike', value: $event || undefined })"
62
+ :modelValue="getFilterItem({ column: c, operator: 'ilike' })"
63
+ />
63
64
 
64
65
  <CustomDateRangePicker
65
66
  v-else-if="['datetime'].includes(c.type)"
@@ -70,13 +71,14 @@
70
71
  @update:valueEnd="setFilterItem({ column: c, operator: 'lte', value: $event || undefined })"
71
72
  />
72
73
 
73
- <input
74
- v-else-if="[ 'date', 'time' ].includes(c.type)"
75
- type="text" class="w-full py-1 px-2 border border-gray-300 rounded-md"
76
- :placeholder="$t('Search datetime')"
77
- @input="setFilterItem({ column: c, operator: 'ilike', value: $event.target.value || undefined })"
78
- :value="getFilterItem({ column: c, operator: 'ilike' })"
79
- >
74
+ <Input
75
+ v-else-if="[ 'date', 'time' ].includes(c.type)"
76
+ type="text"
77
+ full-width
78
+ :placeholder="$t('Search datetime')"
79
+ @update:modelValue="setFilterItem({ column: c, operator: 'ilike', value: $event || undefined })"
80
+ :modelValue="getFilterItem({ column: c, operator: 'ilike' })"
81
+ />
80
82
 
81
83
  <CustomRangePicker
82
84
  v-else-if="['integer', 'decimal', 'float'].includes(c.type) && c.allowMinMaxQuery"
@@ -89,20 +91,20 @@
89
91
  />
90
92
 
91
93
  <div v-else-if="['integer', 'decimal', 'float'].includes(c.type)" class="flex gap-2">
92
- <input
93
- type="number" aria-describedby="helper-text-explanation"
94
- class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-20 p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500"
95
- :placeholder="$t('From')"
96
- @input="setFilterItem({ column: c, operator: 'gte', value: $event.target.value || undefined })"
97
- :value="getFilterItem({ column: c, operator: 'gte' })"
98
- >
99
- <input
100
- type="number" aria-describedby="helper-text-explanation"
101
- class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-20 p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500"
102
- :placeholder="$t('To')"
103
- @input="setFilterItem({ column: c, operator: 'lte', value: $event.target.value || undefined})"
104
- :value="getFilterItem({ column: c, operator: 'lte' })"
105
- >
94
+ <Input
95
+ type="number"
96
+ aria-describedby="helper-text-explanation"
97
+ :placeholder="$t('From')"
98
+ @update:modelValue="setFilterItem({ column: c, operator: 'gte', value: $event || undefined })"
99
+ :modelValue="getFilterItem({ column: c, operator: 'gte' })"
100
+ />
101
+ <Input
102
+ type="number"
103
+ aria-describedby="helper-text-explanation"
104
+ :placeholder="$t('To')"
105
+ @update:modelValue="setFilterItem({ column: c, operator: 'lte', value: $event|| undefined })"
106
+ :modelValue="getFilterItem({ column: c, operator: 'lte' })"
107
+ />
106
108
  </div>
107
109
 
108
110
  </li>
@@ -132,6 +134,7 @@ import { useRouter } from 'vue-router';
132
134
  import { computedAsync } from '@vueuse/core'
133
135
  import CustomRangePicker from "@/components/CustomRangePicker.vue";
134
136
  import { useFiltersStore } from '@/stores/filters';
137
+ import Input from '@/afcl/Input.vue';
135
138
  import Select from '@/afcl/Select.vue';
136
139
 
137
140
  const filtersStore = useFiltersStore();
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "adminforth",
3
- "version": "1.6.2-next.6",
3
+ "version": "1.6.2-next.7",
4
4
  "description": "OpenSource Vue3 powered forth-generation admin panel",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.js",