fix: (#704) Confirmation buttons

This commit is contained in:
jamesread
2025-11-10 13:21:54 +00:00
parent 3967b91cf0
commit 52ff504a9d

View File

@@ -8,6 +8,14 @@
<template v-if="actionArguments.length > 0"> <template v-if="actionArguments.length > 0">
<template v-for="arg in actionArguments" :key="arg.name" class="argument-group"> <template v-for="arg in actionArguments" :key="arg.name" class="argument-group">
<div v-if="arg.type === 'confirmation'">
<label :for="arg.name">
{{ formatLabel(arg.title) }}
</label>
<input :id="arg.name" :name="arg.name" type="checkbox" :checked="getArgumentValue(arg)"
@input="handleInput(arg, $event)" @change="handleChange(arg, $event)" />
</div>
<template v-else>
<label :for="arg.name"> <label :for="arg.name">
{{ formatLabel(arg.title) }} {{ formatLabel(arg.title) }}
</label> </label>
@@ -31,6 +39,7 @@
:rows="arg.type === 'raw_string_multiline' ? 5 : undefined" :rows="arg.type === 'raw_string_multiline' ? 5 : undefined"
:step="arg.type === 'datetime' ? 1 : undefined" :pattern="getPattern(arg)" :required="arg.required" :step="arg.type === 'datetime' ? 1 : undefined" :pattern="getPattern(arg)" :required="arg.required"
@input="handleInput(arg, $event)" @change="handleChange(arg, $event)" /> @input="handleInput(arg, $event)" @change="handleChange(arg, $event)" />
</template>
<span class="argument-description" v-html="arg.description"></span> <span class="argument-description" v-html="arg.description"></span>
</template> </template>
@@ -96,18 +105,27 @@ async function setup() {
// Initialize values from query params or defaults // Initialize values from query params or defaults
actionArguments.value.forEach(arg => { actionArguments.value.forEach(arg => {
const paramValue = getQueryParamValue(arg.name)
argValues.value[arg.name] = paramValue !== null ? paramValue : arg.defaultValue || ''
if (arg.type === 'confirmation') { if (arg.type === 'confirmation') {
hasConfirmation.value = true hasConfirmation.value = true
const paramValue = getQueryParamValue(arg.name)
let checkedValue = false
if (paramValue !== null) {
checkedValue = paramValue === '1' || paramValue === 'true' || paramValue === true
} else if (arg.defaultValue !== undefined && arg.defaultValue !== '') {
checkedValue = arg.defaultValue === '1' || arg.defaultValue === 'true' || arg.defaultValue === true
}
argValues.value[arg.name] = checkedValue
confirmationChecked.value = checkedValue
} else {
const paramValue = getQueryParamValue(arg.name)
argValues.value[arg.name] = paramValue !== null ? paramValue : arg.defaultValue || ''
} }
}) })
// Run initial validation on all fields after DOM is updated // Run initial validation on all fields after DOM is updated
await nextTick() await nextTick()
for (const arg of actionArguments.value) { for (const arg of actionArguments.value) {
if (arg.type && !arg.type.startsWith('regex:') && arg.type !== 'select' && arg.type !== '') { if (arg.type && !arg.type.startsWith('regex:') && arg.type !== 'select' && arg.type !== '' && arg.type !== 'confirmation') {
await validateArgument(arg, argValues.value[arg.name]) await validateArgument(arg, argValues.value[arg.name])
} }
} }
@@ -143,6 +161,10 @@ function getInputType(arg) {
return undefined return undefined
} }
if (arg.type === 'confirmation') {
return 'checkbox'
}
if (arg.type === 'ascii_identifier') { if (arg.type === 'ascii_identifier') {
return 'text' return 'text'
} }
@@ -158,8 +180,8 @@ function getPattern(arg) {
} }
function getArgumentValue(arg) { function getArgumentValue(arg) {
if (arg.type === 'checkbox') { if (arg.type === 'checkbox' || arg.type === 'confirmation') {
return argValues.value[arg.name] === '1' || argValues.value[arg.name] === true return argValues.value[arg.name] === '1' || argValues.value[arg.name] === true || argValues.value[arg.name] === 'true'
} }
return argValues.value[arg.name] || '' return argValues.value[arg.name] || ''
} }
@@ -240,7 +262,7 @@ function getArgumentValues() {
for (const arg of actionArguments.value) { for (const arg of actionArguments.value) {
let value = argValues.value[arg.name] || '' let value = argValues.value[arg.name] || ''
if (arg.type === 'checkbox') { if (arg.type === 'checkbox' || arg.type === 'confirmation') {
value = value ? '1' : '0' value = value ? '1' : '0'
} }