matt
/
opnform-host-nginx
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

ESC-240: Fix null pointer exception in SelectInput getOptionName method

This commit is contained in:
Julien Nahum 2024-08-07 17:14:00 +02:00
parent 797c1ceab5
commit 2f0f87267f
2 changed files with 27 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

42
client/components/forms/SelectInput.vue
View File

@ -101,7 +101,7 @@
</template> </template>
<script> <script>
import {inputProps, useFormInput} from './useFormInput.js' import { inputProps, useFormInput } from './useFormInput.js'
import InputWrapper from './components/InputWrapper.vue' import InputWrapper from './components/InputWrapper.vue'
/** /**
@ -109,21 +109,21 @@ import InputWrapper from './components/InputWrapper.vue'
*/ */
export default { export default {
name: 'SelectInput', name: 'SelectInput',
components: {InputWrapper}, components: { InputWrapper },
props: { props: {
...inputProps, ...inputProps,
options: {type: Array, required: true}, options: { type: Array, required: true },
optionKey: {type: String, default: 'value'}, optionKey: { type: String, default: 'value' },
emitKey: {type: String, default: 'value'}, emitKey: { type: String, default: 'value' },
displayKey: {type: String, default: 'name'}, displayKey: { type: String, default: 'name' },
loading: {type: Boolean, default: false}, loading: { type: Boolean, default: false },
multiple: {type: Boolean, default: false}, multiple: { type: Boolean, default: false },
searchable: {type: Boolean, default: false}, searchable: { type: Boolean, default: false },
clearable: {type: Boolean, default: false}, clearable: { type: Boolean, default: false },
allowCreation: {type: Boolean, default: false}, allowCreation: { type: Boolean, default: false },
dropdownClass: {type: String, default: 'w-full'}, dropdownClass: { type: String, default: 'w-full' },
remote: {type: Function, default: null} remote: { type: Function, default: null }
}, },
setup(props, context) { setup(props, context) {
return { return {
@ -156,17 +156,19 @@ export default {
}, },
methods: { methods: {
getOptionName(val) { getOptionName(val) {
if (val == null) return ''
const option = this.finalOptions.find((optionCandidate) => { const option = this.finalOptions.find((optionCandidate) => {
return optionCandidate[this.optionKey] === val || return optionCandidate && optionCandidate[this.optionKey] === val ||
(typeof val === 'object' && optionCandidate[this.optionKey] === val[this.optionKey]) (typeof val === 'object' && val && optionCandidate && optionCandidate[this.optionKey] === val[this.optionKey])
}) })
if (option) return option[this.displayKey] if (option && option[this.displayKey] !== undefined) {
return null return option[this.displayKey]
}
return val.toString() // Convert to string to ensure it's not null
}, },
getOptionNames(values) { getOptionNames(values) {
return values.map(val => { if (!Array.isArray(values)) return []
return this.getOptionName(val) return values.map(val => this.getOptionName(val)).filter(Boolean)
})
}, },
updateModelValue(newValues) { updateModelValue(newValues) {
if (newValues === null) newValues = [] if (newValues === null) newValues = []

5
client/nuxt.config.ts
View File

@ -60,6 +60,11 @@ export default defineNuxtConfig({
project: "opnform-vue", project: "opnform-vue",
}), }),
], ],
server: {
hmr: {
clientPort: 3000
}
}
}, },
tailwindcss: { tailwindcss: {
cssPath: ['~/scss/app.scss'] cssPath: ['~/scss/app.scss']