zhuchaowe/maxkb
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: dynamics form default value style

Browse Source
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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
ui/src/components/dynamics-form/constructor/items/DatePickerConstructor.vue
View File

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

28
ui/src/components/dynamics-form/constructor/items/JsonInputConstructor.vue
View File

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

19
ui/src/components/dynamics-form/constructor/items/MultiSelectConstructor.vue
View File

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

19
ui/src/components/dynamics-form/constructor/items/RadioCardConstructor.vue
View File

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

18
ui/src/components/dynamics-form/constructor/items/RadioRowConstructor.vue
View File

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

20
ui/src/components/dynamics-form/constructor/items/SingleSelectConstructor.vue
View File

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