fix: dynamics form default value style

This commit is contained in:
wangdan-fit2cloud 2024-12-30 16:38:26 +08:00
parent 62fe32195f
commit 046aa2aed0
6 changed files with 87 additions and 39 deletions

View File

@ -26,16 +26,15 @@
</el-select>
</el-form-item>
<el-form-item
class="defaultValueItem"
:required="formValue.required"
prop="default_value"
label="默认值"
:rules="formValue.required ? [{ required: true, message: '默认值 为必填属性' }] : []"
>
<template #label>
<div class="flex-between">
默认值
<el-checkbox v-model="formValue.show_default_value" label="显示默认值" />
</div>
</template>
<div class="defaultValueCheckbox">
<el-checkbox v-model="formValue.show_default_value" label="显示默认值" />
</div>
<el-date-picker
v-model="formValue.default_value"
:type="formValue.type"
@ -115,4 +114,13 @@ onBeforeMount(() => {
}
})
</script>
<style lang="scss"></style>
<style lang="scss" scoped>
.defaultValueItem {
position: relative;
.defaultValueCheckbox {
position: absolute;
right: 0;
top: -35px;
}
}
</style>

View File

@ -1,11 +1,14 @@
<template>
<el-form-item :required="formValue.required" prop="default_value" :rules="[default_value_rule]">
<template #label>
<div class="flex-between">
默认值
<el-checkbox v-model="formValue.show_default_value" label="显示默认值" />
</div>
</template>
<el-form-item
class="defaultValueItem"
label="默认值"
:required="formValue.required"
prop="default_value"
:rules="[default_value_rule]"
>
<div class="defaultValueCheckbox">
<el-checkbox v-model="formValue.show_default_value" label="显示默认值" />
</div>
<JsonInput ref="jsonInputRef" v-model="formValue.default_value"> </JsonInput>
</el-form-item>
</template>
@ -66,4 +69,13 @@ onMounted(() => {
}
})
</script>
<style lang="scss"></style>
<style lang="scss" scoped>
.defaultValueItem {
position: relative;
.defaultValueCheckbox {
position: absolute;
right: 0;
top: -35px;
}
}
</style>

View File

@ -46,16 +46,15 @@
</el-row>
</el-form-item>
<el-form-item
class="defaultValueItem"
label="默认值"
:required="formValue.required"
prop="default_value"
:rules="formValue.required ? [{ required: true, message: '默认值 为必填属性' }] : []"
>
<template #label>
<div class="flex-between">
默认值
<el-checkbox v-model="formValue.show_default_value" label="显示默认值" />
</div>
</template>
<div class="defaultValueCheckbox">
<el-checkbox v-model="formValue.show_default_value" label="显示默认值" />
</div>
<el-select
class="m-2"
multiple
@ -130,6 +129,14 @@ onMounted(() => {
})
</script>
<style lang="scss" scoped>
.defaultValueItem {
position: relative;
.defaultValueCheckbox {
position: absolute;
right: 0;
top: -35px;
}
}
:deep(.el-form-item__label) {
display: block;
}

View File

@ -47,16 +47,15 @@
</el-row>
</el-form-item>
<el-form-item
class="defaultValueItem"
label="默认值"
:required="formValue.required"
prop="default_value"
:rules="formValue.required ? [{ required: true, message: '默认值 为必填属性' }] : []"
>
<template #label>
<div class="flex-between">
默认值
<el-checkbox v-model="formValue.show_default_value" label="显示默认值" />
</div>
</template>
<div class="defaultValueCheckbox">
<el-checkbox v-model="formValue.show_default_value" label="显示默认值" />
</div>
<RadioCard
:form-field="formField"
v-model="formValue.default_value"
@ -123,6 +122,14 @@ onMounted(() => {
})
</script>
<style lang="scss" scoped>
.defaultValueItem {
position: relative;
.defaultValueCheckbox {
position: absolute;
right: 0;
top: -35px;
}
}
:deep(.el-form-item__label) {
display: block;
}

View File

@ -47,17 +47,15 @@
</el-row>
</el-form-item>
<el-form-item
class="defaultValueItem"
label="默认值"
:required="formValue.required"
prop="default_value"
:rules="formValue.required ? [{ required: true, message: '默认值 为必填属性' }] : []"
>
<template #label>
<div class="flex-between">
默认值
<el-checkbox v-model="formValue.show_default_value" label="显示默认值" />
</div>
</template>
<div class="defaultValueCheckbox">
<el-checkbox v-model="formValue.show_default_value" label="显示默认值" />
</div>
<RadioRow
:form-field="formField"
v-model="formValue.default_value"
@ -124,6 +122,14 @@ onMounted(() => {
})
</script>
<style lang="scss" scoped>
.defaultValueItem {
position: relative;
.defaultValueCheckbox {
position: absolute;
right: 0;
top: -35px;
}
}
:deep(.el-form-item__label) {
display: block;
}

View File

@ -47,16 +47,16 @@
</el-row>
</el-form-item>
<el-form-item
class="defaultValueItem"
:required="formValue.required"
prop="default_value"
label="默认值"
:rules="formValue.required ? [{ required: true, message: '默认值 为必填属性' }] : []"
>
<template #label>
<div class="flex-between">
默认值
<el-checkbox v-model="formValue.show_default_value" label="显示默认值" />
</div>
</template>
<div class="defaultValueCheckbox">
<el-checkbox v-model="formValue.show_default_value" label="显示默认值" />
</div>
<el-select v-model="formValue.default_value" :teleported="false" popper-class="default-select">
<el-option
v-for="(option, index) in formValue.option_list"
@ -123,6 +123,14 @@ onMounted(() => {
})
</script>
<style lang="scss" scoped>
.defaultValueItem {
position: relative;
.defaultValueCheckbox {
position: absolute;
right: 0;
top: -35px;
}
}
:deep(.el-form-item__label) {
display: block;
}