diff --git a/app/src/modules/insights/routes/panel-configuration.vue b/app/src/modules/insights/routes/panel-configuration.vue
index 8ce3f0696f..cf0c26eda6 100644
--- a/app/src/modules/insights/routes/panel-configuration.vue
+++ b/app/src/modules/insights/routes/panel-configuration.vue
@@ -40,7 +40,7 @@
diff --git a/app/src/panels/metric/index.ts b/app/src/panels/metric/index.ts
index 8de6e6dd06..608849a026 100644
--- a/app/src/panels/metric/index.ts
+++ b/app/src/panels/metric/index.ts
@@ -17,20 +17,6 @@ export default definePanel({
width: 'half',
},
},
- {
- field: 'field',
- type: 'string',
- name: '$t:panels.metric.field',
- meta: {
- interface: 'system-field',
- options: {
- collectionField: 'collection',
- typeAllowList: ['integer', 'bigInteger', 'float', 'decimal'],
- allowPrimaryKey: true,
- },
- width: 'half',
- },
- },
{
field: 'function',
type: 'string',
@@ -64,15 +50,66 @@ export default definePanel({
},
},
},
+ {
+ field: 'field',
+ type: 'string',
+ name: '$t:panels.metric.field',
+ meta: {
+ interface: 'system-field',
+ options: {
+ collectionField: 'collection',
+ typeAllowList: ['integer', 'bigInteger', 'float', 'decimal'],
+ allowPrimaryKey: true,
+ },
+ width: 'half',
+ },
+ },
{
field: 'limit',
type: 'integer',
name: '$t:limit',
+ schema: {
+ default_value: 100,
+ },
meta: {
interface: 'input',
width: 'half',
},
},
+ {
+ field: 'sortField',
+ type: 'string',
+ name: '$t:sort_field',
+ meta: {
+ interface: 'system-field',
+ options: {
+ collectionField: 'collection',
+ allowPrimaryKey: true,
+ },
+ width: 'half',
+ },
+ },
+ {
+ field: 'sortDirection',
+ type: 'string',
+ name: '$t:sort_direction',
+ meta: {
+ interface: 'select-dropdown',
+ options: {
+ choices: [
+ {
+ text: '$t:sort_asc',
+ value: 'asc',
+ },
+ {
+ text: '$t:sort_desc',
+ value: 'desc',
+ },
+ ],
+ },
+ width: 'half',
+ },
+ },
{
field: 'filter',
type: 'json',
diff --git a/app/src/panels/metric/metric.vue b/app/src/panels/metric/metric.vue
index 7b1b693af2..c09d40480b 100644
--- a/app/src/panels/metric/metric.vue
+++ b/app/src/panels/metric/metric.vue
@@ -44,6 +44,8 @@ export default defineComponent({
loading.value = true;
try {
+ const sort =
+ props.options.sortField && `${props.options.sortDirection === 'desc' ? '-' : ''}${props.options.sortField}`;
const res = await api.get(`/items/${props.options.collection}`, {
params: {
aggregate: {
@@ -52,6 +54,8 @@ export default defineComponent({
},
},
filter: props.options.filter,
+ sort: sort,
+ limit: props.options.limit ?? 100,
},
});