crud编辑添加表单增加disabled属性,增加系统参数页面

This commit is contained in:
2025-02-14 17:18:36 +08:00
parent 82a5000678
commit 8ea7581113
13 changed files with 872 additions and 76 deletions

View File

@@ -1,9 +1,20 @@
<template>
<!-- drawer -->
<template v-if="modalConfig.component === 'drawer'">
<el-drawer v-model="modalVisible" :append-to-body="true" v-bind="modalConfig.drawer" @close="handleCloseModal">
<el-drawer
v-model="modalVisible"
:append-to-body="true"
v-bind="modalConfig.drawer"
@close="handleCloseModal"
>
<!-- 表单 -->
<el-form ref="formRef" label-width="auto" v-bind="modalConfig.form" :model="formData" :rules="formRules">
<el-form
ref="formRef"
label-width="auto"
v-bind="modalConfig.form"
:model="formData"
:rules="formRules"
>
<el-row :gutter="20">
<template v-for="item in formItems" :key="item.prop">
<el-col v-show="!item.hidden" v-bind="item.col">
@@ -12,7 +23,12 @@
<template v-if="item.tips" #label>
<span>
{{ item.label }}
<el-tooltip placement="bottom" effect="light" :content="item.tips" :raw-content="true">
<el-tooltip
placement="bottom"
effect="light"
:content="item.tips"
:raw-content="true"
>
<el-icon style="vertical-align: -0.15em" size="16">
<QuestionFilled />
</el-icon>
@@ -76,7 +92,12 @@
</template>
<!-- 自定义 -->
<template v-else-if="item.type === 'custom'">
<slot :name="item.slotName ?? item.prop" :prop="item.prop" :formData="formData" :attrs="item.attrs" />
<slot
:name="item.slotName ?? item.prop"
:prop="item.prop"
:formData="formData"
:attrs="item.attrs"
/>
</template>
</el-form-item>
</el-col>
@@ -97,13 +118,26 @@
</template>
<!-- dialog -->
<template v-else>
<el-dialog v-model="modalVisible" :align-center="true" :append-to-body="true" width="70vw"
v-bind="modalConfig.dialog" style="padding-right: 0" @close="handleCloseModal">
<el-dialog
v-model="modalVisible"
:align-center="true"
:append-to-body="true"
width="70vw"
v-bind="modalConfig.dialog"
style="padding-right: 0"
@close="handleCloseModal"
>
<!-- 滚动 -->
<el-scrollbar max-height="60vh">
<!-- 表单 -->
<el-form ref="formRef" label-width="auto" v-bind="modalConfig.form"
style="padding-right: var(--el-dialog-padding-primary)" :model="formData" :rules="formRules">
<el-form
ref="formRef"
label-width="auto"
v-bind="modalConfig.form"
style="padding-right: var(--el-dialog-padding-primary)"
:model="formData"
:rules="formRules"
>
<el-row :gutter="20">
<template v-for="item in formItems" :key="item.prop">
<el-col v-show="!item.hidden" v-bind="item.col">
@@ -112,7 +146,12 @@
<template v-if="item.tips" #label>
<span>
{{ item.label }}
<el-tooltip placement="bottom" effect="light" :content="item.tips" :raw-content="true">
<el-tooltip
placement="bottom"
effect="light"
:content="item.tips"
:raw-content="true"
>
<el-icon style="vertical-align: -0.15em" size="16">
<QuestionFilled />
</el-icon>
@@ -121,7 +160,11 @@
</template>
<!-- Input 输入框 -->
<template v-if="item.type === 'input' || item.type === undefined">
<el-input v-model="formData[item.prop]" v-bind="item.attrs" />
<el-input
v-model="formData[item.prop]"
v-bind="item.attrs"
:disabled="item.disabled"
/>
</template>
<!-- textarea 输入框 -->
<template v-if="item.type === 'textarea'">
@@ -179,8 +222,12 @@
</template>
<!-- 自定义 -->
<template v-else-if="item.type === 'custom'">
<slot :name="item.slotName ?? item.prop" :prop="item.prop" :formData="formData"
:attrs="item.attrs" />
<slot
:name="item.slotName ?? item.prop"
:prop="item.prop"
:formData="formData"
:attrs="item.attrs"
/>
</template>
</el-form-item>
</el-col>
@@ -213,7 +260,6 @@ const props = defineProps<{
const emit = defineEmits<{
submitClick: [];
}>();
console.log(props.modalConfig, '全部')
const pk = props.modalConfig.pk ?? "id";
const modalVisible = ref(false);
const formRef = ref<FormInstance>();