diff --git a/cypress/e2e/column-number-progress.cy.js b/cypress/e2e/column-number-progress.cy.js
index 9664a7ab8..73cf21e04 100644
--- a/cypress/e2e/column-number-progress.cy.js
+++ b/cypress/e2e/column-number-progress.cy.js
@@ -27,16 +27,17 @@ describe('Test column progress', () => {
it('Insert and test rows - default values', () => {
cy.loadTable(tableTitle)
cy.createNumberProgressColumn(columnTitle, 23, true)
+ cy.createNumberProgressColumn(columnTitle, null, false)
// insert default value row
cy.get('button').contains('Create row').click()
- cy.get('.modal__content input').first().should('contain.value', '23')
+ cy.get('[data-cy="createRowModal"] input[type="number"]').first().should('contain.value', '23')
cy.get('button').contains('Save').click()
cy.get('.custom-table table tr td div progress').first().should('have.value', 23)
// insert row
cy.get('button').contains('Create row').click()
- cy.get('.modal__content input').first().clear().type('89')
+ cy.get('[data-cy="createRowModal"] input[type="number"]').last().clear().type('89')
cy.get('button').contains('Save').click()
cy.get('.custom-table table tr td div progress').last().should('have.value', 89)
})
diff --git a/src/shared/components/ncTable/partials/columnTypePartials/forms/NumberProgressForm.vue b/src/shared/components/ncTable/partials/columnTypePartials/forms/NumberProgressForm.vue
index cf4631a53..54a1c5ab7 100644
--- a/src/shared/components/ncTable/partials/columnTypePartials/forms/NumberProgressForm.vue
+++ b/src/shared/components/ncTable/partials/columnTypePartials/forms/NumberProgressForm.vue
@@ -13,7 +13,8 @@
+ max="100"
+ @input="enforceBounds">
@@ -47,6 +48,14 @@ export default {
},
methods: {
t,
+ enforceBounds(event) {
+ const value = parseInt(event.target.value)
+ if (isNaN(value)) {
+ this.mutableColumn.numberDefault = null
+ return
+ }
+ this.mutableColumn.numberDefault = Math.min(Math.max(0, value), 100)
+ },
},
}
diff --git a/src/shared/components/ncTable/partials/rowTypePartials/NumberProgressForm.vue b/src/shared/components/ncTable/partials/rowTypePartials/NumberProgressForm.vue
index 8e9c94dd6..99910e471 100644
--- a/src/shared/components/ncTable/partials/rowTypePartials/NumberProgressForm.vue
+++ b/src/shared/components/ncTable/partials/rowTypePartials/NumberProgressForm.vue
@@ -6,8 +6,9 @@
+ min="0"
+ max="100"
+ @input="enforceBounds">
@@ -41,12 +42,28 @@ export default {
if (this.column.numberDefault !== undefined) {
this.$emit('update:value', this.column.numberDefault)
return this.column.numberDefault
- } else {
- return null
}
+ return null
}
},
- set(v) { this.$emit('update:value', parseInt(v)) },
+ set(v) {
+ const parsedValue = parseInt(v)
+ const clampedValue = Math.min(Math.max(0, v), 100)
+ this.$emit('update:value', isNaN(parsedValue) ? null : parseInt(clampedValue))
+ },
+ },
+ },
+ methods: {
+ enforceBounds(event) {
+ const value = parseInt(event.target.value)
+ if (isNaN(value)) {
+ this.$emit('update:value', null)
+ event.target.value = null
+ return
+ }
+ const clampedValue = Math.min(Math.max(0, value), 100)
+ this.$emit('update:value', clampedValue)
+ event.target.value = clampedValue
},
},
}