diff --git a/src/packages/base-field/components/Checkbox.jsx b/src/packages/base-field/components/Checkbox.jsx index 86d72c6..7892521 100644 --- a/src/packages/base-field/components/Checkbox.jsx +++ b/src/packages/base-field/components/Checkbox.jsx @@ -5,11 +5,6 @@ import { optionsToValueEnum, valueEnumToOptions, valueEnumToText } from '../util import { getSlotVNode } from '@/utils/props-util' import { isUndefined } from 'lodash-es' -/** - * @todo 待优化 - * validateStatus 变化应该使组件颜色变化 - * 组件库没有对外暴露 Form.Item 的 Status - */ export default defineComponent({ inheritAttrs: false, props: { ...baseFieldProps }, diff --git a/src/packages/base-field/components/Radio.jsx b/src/packages/base-field/components/Radio.jsx index 7a99d9f..6a67895 100644 --- a/src/packages/base-field/components/Radio.jsx +++ b/src/packages/base-field/components/Radio.jsx @@ -5,11 +5,6 @@ import { optionsToValueEnum, valueEnumToOptions, valueEnumToText } from '../util import { getSlotVNode } from '@/utils/props-util' import { isUndefined } from 'lodash-es' -/** - * @todo 待优化 - * validateStatus 变化应该使组件颜色变化 - * 组件库没有对外暴露 Form.Item 的 Status - */ export default defineComponent({ inheritAttrs: false, props: { ...baseFieldProps }, diff --git a/src/packages/table/editable-table/index.jsx b/src/packages/table/editable-table/index.jsx index 13c19d3..30a834e 100644 --- a/src/packages/table/editable-table/index.jsx +++ b/src/packages/table/editable-table/index.jsx @@ -2,7 +2,7 @@ import { defineComponent, reactive, watch } from 'vue' import { Field, Form } from '@/packages/form' import Table from '../table' import InlineError from './components/inline-error' -import { omit, pick } from 'lodash-es' +import { get, pick, set, unset } from 'lodash-es' const editable = { type: 'multiple', // 可编辑表格的类型,单行编辑或者多行编辑 @@ -33,23 +33,28 @@ export default defineComponent({ emits: ['update:value'], setup (props, { emit, slots }) { const model = reactive(props.dataSource || []) + const validateErrors = reactive([]) watch(model, (value) => { - console.log(value) emit('update:value', value) }, { deep: true, immediate: true }) - function onValidate (name, status, errors) { - console.log(name, status, errors) + function onValidate (namePath, status, errors) { + if (!status && errors) { + set(validateErrors, namePath, errors) + } else { + unset(validateErrors, namePath) + } } function customRender ({ text, record, index, column }) { const { fieldProps, formItemProps } = column - const namePath = column.key || column.dataIndex + const namePath = [index, column.key || column.dataIndex] const needFormItemProps = { - ...omit(formItemProps, ['label']), - name: [index, namePath], + ...formItemProps, + name: namePath, + label: column.title, noStyle: true } const needFieldProps = { @@ -57,11 +62,15 @@ export default defineComponent({ fieldProps: { ...fieldProps, style: { width: '100%' } }, formItemProps: needFormItemProps } - return ( - - - - ) + if (needFormItemProps.required || needFormItemProps.rules) { + const errors = get(validateErrors, namePath) + return ( + + + + ) + } + return } return () => { @@ -71,6 +80,12 @@ export default defineComponent({ return { ...column, customRender } }) + const formProps = { + model: model, + layout: 'vertical', + onValidate: onValidate + } + const tableProps = { ...pick(props, Object.keys(Table.props)), columns: columns, @@ -79,7 +94,7 @@ export default defineComponent({ toolbar: false } return ( -
+ ) diff --git a/src/views/table/CustomSearch.jsx b/src/views/table/CustomSearch.jsx index bf2ed3a..54718c2 100644 --- a/src/views/table/CustomSearch.jsx +++ b/src/views/table/CustomSearch.jsx @@ -1,6 +1,6 @@ import { defineComponent, ref, unref } from 'vue' import { CustomFields } from '@/packages/base-field' -import { HocField, Radio, Select } from '@/packages/form' +import { HocField, Radio, Select, Checkbox, Switch, Slider } from '@/packages/form' import { Action, ActionGroup, BaseSearch, Table } from '@/packages/table' const Test = HocField('test') @@ -9,7 +9,7 @@ export default defineComponent({ name: 'TableCustomSearch', setup () { const model = ref({ - radio: '1' + // radio: '1' }) const columns = [ @@ -84,7 +84,7 @@ export default defineComponent({ }}>
( - +