解决表单动态 hidden 无法提交问题

This commit is contained in:
神仙都没用 2023-12-20 11:20:23 +08:00
parent 43fdb3034b
commit e46264437c
7 changed files with 82 additions and 24 deletions

View File

@ -9,7 +9,7 @@
"lint:eslint": "eslint \"./src/**/*.{vue,ts,tsx}\" --fix"
},
"dependencies": {
"@cool-vue/crud": "^7.0.10",
"@cool-vue/crud": "^7.0.11",
"@element-plus/icons-vue": "^2.1.0",
"@vueuse/core": "^10.4.0",
"@wangeditor/editor": "^5.1.23",

View File

@ -1,6 +1,6 @@
{
"name": "@cool-vue/crud",
"version": "7.0.10",
"version": "7.0.11",
"private": false,
"main": "./dist/index.umd.min.js",
"typings": "types/index.d.ts",

View File

@ -51,9 +51,11 @@ export function useTabs({ config, Form }: { config: ClForm.Config; Form: Vue.Ref
config.items.forEach(deep);
}
if (name) {
set(name);
}
}
}
// 获取参数
function get() {

View File

@ -357,7 +357,8 @@ export default defineComponent({
label={e.label}
prop={e.prop}
rules={isDisabled ? null : e.rules}
v-show={inGroup}
required={e._hidden ? false : e.required}
v-show={inGroup && !e._hidden}
/>,
e.props,
{
@ -432,11 +433,6 @@ export default defineComponent({
)
: null;
// 隐藏
if (e._hidden) {
return null;
}
// 行内
if (props.inline) {
return FormItem;

View File

@ -1,7 +1,8 @@
import { useCrud } from "@cool-vue/crud";
import { isString } from "lodash-es";
import { computed, defineComponent, isRef, PropType, Ref, ref, watch } from "vue";
import { isEmpty, isString } from "lodash-es";
import { computed, defineComponent, isRef, type PropType, type Ref, ref, watch } from "vue";
import { parsePx } from "/@/cool/utils";
import { Dict } from "/$/dict/types";
export default defineComponent({
name: "cl-select",
@ -24,7 +25,11 @@ export default defineComponent({
width: {
type: [String, Number],
default: "auto"
}
},
// 是否树形
tree: Boolean,
// 是否返回选中层级下的所有值
allLevelsId: Boolean
},
emits: ["update:modelValue", "change"],
@ -41,9 +46,37 @@ export default defineComponent({
return (isRef(props.options) ? props.options.value : props.options) || [];
});
// 获取值
function getValue(val: any): any | any[] {
if (props.allLevelsId) {
const ids: any[] = [];
// 获取所有的值
function deep(arr: Dict.Item[], f: boolean) {
arr.forEach((e) => {
const f2 = e[props.valueKey] == val;
if (f || f2) {
ids.push(e[props.valueKey]);
}
if (e.children) {
deep(e.children, f || f2);
}
});
}
deep(list.value, false);
return isEmpty(ids) ? undefined : ids;
} else {
return val === "" ? undefined : val;
}
}
// 值改变
function onChange(val: string) {
const v = val === "" ? undefined : val;
function onChange(val: any) {
const v = getValue(val);
emit("update:modelValue", v);
emit("change", v);
@ -64,15 +97,40 @@ export default defineComponent({
);
return () => {
return (
// 样式
const style = {
width: parsePx(props.width)
};
// 占位符
const placeholder = props.prop ? "选择搜索" : "请选择";
// 树形下拉框
const TreeSelect = (
<el-tree-select
v-model={value.value}
clearable
filterable
placeholder={placeholder}
data={list.value}
props={{
label: props.labelKey,
value: props.valueKey
}}
style={style}
onChange={onChange}
/>
);
// 普通下拉框
const Select = (
<el-select
v-model={value.value}
clearable
filterable
placeholder={placeholder}
style={style}
onChange={onChange}
style={{
width: parsePx(props.width)
}}
>
{list.value?.map((e) => {
return isString(e) ? (
@ -87,6 +145,8 @@ export default defineComponent({
})}
</el-select>
);
return props.tree ? TreeSelect : Select;
};
}
});

View File

@ -22,7 +22,7 @@ import { useCool } from "/@/cool";
import { isObject, merge } from "lodash-es";
const props = defineProps({
modelValue: String,
modelValue: null,
options: Object,
height: {
type: [String, Number],
@ -65,7 +65,7 @@ function setContent(value: string = "") {
if (isObject(value)) {
value = JSON.stringify(value);
} else {
value = value.toString();
value = (value || "").toString();
}
if (value != getContent()) {

View File

@ -344,10 +344,10 @@
"@babel/helper-validator-identifier" "^7.22.20"
to-fast-properties "^2.0.0"
"@cool-vue/crud@^7.0.10":
version "7.0.10"
resolved "https://registry.yarnpkg.com/@cool-vue/crud/-/crud-7.0.10.tgz#b4448414b43b8bfcbd4c9860c7ef9e5c1c89bb28"
integrity sha512-gsmnwUTOxhplbKdJu1RWyRa+auq3M9w83RdgLhFLrJg6aqoobT9qPmGxzVDpwIIDDyFmJTolTLbOK6kSRtnJSQ==
"@cool-vue/crud@^7.0.11":
version "7.0.11"
resolved "https://registry.yarnpkg.com/@cool-vue/crud/-/crud-7.0.11.tgz#69b2d5a361dc162d342bd73ca286921725169c80"
integrity sha512-ROf42Odza3hjzpvRTOXi0ovC9YKYbR6rd0uRjyh0fbb0jX/a2CActyOEly28J2O+Mo8Mm8EsvrDRy1O1mmwaAg==
dependencies:
array.prototype.flat "^1.2.4"
core-js "^3.21.1"