diff --git a/components/apolloTable/component/base/config.tsx b/components/apolloTable/component/base/config.tsx index aec65c43b78431d55f83f640205c40f00d3cc6c4..0e224133c9e4137e51b8cb49208fe9efd6de97c7 100644 --- a/components/apolloTable/component/base/config.tsx +++ b/components/apolloTable/component/base/config.tsx @@ -79,7 +79,7 @@ export const config: any = { 3: { name: '多行文本', editComp: ApolloTextArea, - cellComp: CellContainer(ApolloTextArea), + cellComp: ApolloTextArea, getFormatter: GetFormatter.TEXTAREA, setFormatter: SetFormatter.TEXTAREA, componentAttr: { diff --git a/components/apolloTable/component/base/detail/textarea/index.less b/components/apolloTable/component/base/detail/textarea/index.less index 33cc4e34071daabd0656bfa7942c56d7a6c5ef79..e2b0499085eae0e01b51167b357066380110fa6f 100644 --- a/components/apolloTable/component/base/detail/textarea/index.less +++ b/components/apolloTable/component/base/detail/textarea/index.less @@ -19,7 +19,11 @@ text-overflow: ellipsis; word-break: break-all; } -.tooltip { +.tooltip{ + max-height: 300px; + overflow: auto; +} +.tooltipTitle { //min-width: 500px; .more { margin-left: @marginGen; diff --git a/components/apolloTable/component/base/detail/textarea/index.tsx b/components/apolloTable/component/base/detail/textarea/index.tsx index 2638c0d43c7325356359b8609a0d2bdb8acb296a..84644ae7e2a9666dbec084dab6941dfb39dccbf6 100644 --- a/components/apolloTable/component/base/detail/textarea/index.tsx +++ b/components/apolloTable/component/base/detail/textarea/index.tsx @@ -44,8 +44,9 @@ export const ApolloTextAreaDetail = (props: TextAreaProps) => {
{dotVisible ? ( +
{value} {value.length === cutLength && 查看更多}
diff --git a/components/apolloTable/component/base/edit/textarea/index.tsx b/components/apolloTable/component/base/edit/textarea/index.tsx index d59fdbb051526aaf2f2e70428b32b30f5eb0b0a8..80bfb9049ec33c930a8dd219ff52dfc1e1173f6f 100644 --- a/components/apolloTable/component/base/edit/textarea/index.tsx +++ b/components/apolloTable/component/base/edit/textarea/index.tsx @@ -1,22 +1,27 @@ import React, { useEffect, useState } from 'react'; -import { Input } from 'antd'; +import { Input, Modal } from 'antd'; import styles from './styles.less'; import { antiAssign } from '../../../../utils/utils'; import { ApolloTextAreaProps } from '../editInterface'; import { Consumer } from '../../../context'; export const ApolloTextArea = (props: ApolloTextAreaProps) => { - const { maxLength, onChange, value, cutLength, getDetail, rowData } = props; - const selfProps = antiAssign(props, ['columnConfig', 'onChange', 'value']); + const { maxLength, onChange, value, cutLength, getDetail, rowData, onEmitChange, columnConfig, origin } = props; + const { columnChsName } = columnConfig; + const selfProps = antiAssign(props, ['columnConfig', 'onChange', 'value', 'cutLength', 'getDetail', 'rowData', 'onEmitChange']); const [curValue, setCurValue] = useState(value); + const [visible, setVisible] = useState(false); useEffect(() => { - setCurValue(value); - }, [value]); - useEffect(() => { - if (value && value.length === cutLength) { + if (origin !== 'editForm') { + setCurValue(value); getMore(); } - }, []); + }, [value]); + // useEffect(() => { + // if (value && value.length === cutLength) { + // getMore(); + // } + // }, []); const changeValue = (e) => { if (typeof onChange === 'function') { @@ -24,30 +29,84 @@ export const ApolloTextArea = (props: ApolloTextAreaProps) => { } }; + const changeCurValue = (e) => { + if (typeof onChange === 'function') { + setCurValue(e.target.value); + } + }; + + const hide = () => { + if (typeof onEmitChange === 'function') { + onEmitChange(value); + } + setVisible(false); + } + + const confirmChange = () => { + if (typeof onEmitChange === 'function') { + onEmitChange(curValue); + } + setVisible(false); + } + const getMore = async () => { - let newValue = await getDetail({ rowId: rowData.id }); - if (newValue) { - newValue = newValue[0] && newValue[0].value; - setCurValue(newValue); + if (getDetail && rowData) { + let newValue = await getDetail({ rowId: rowData.id }); + if (newValue) { + newValue = newValue[0] && newValue[0].value; + setCurValue(newValue); + setVisible(true); + } } }; + if (origin === 'editForm') { + return ( + + {({ locale }) => { + return ( +
+ + {!!maxLength && ( + + {`${locale.alreadyInput} ${(value || '').length}/${maxLength}`} + + )} +
+ ); + }} +
+ ) + } + return ( {({ locale }) => { return (
- - {!!maxLength && ( - - {`${locale.alreadyInput} ${(curValue || '').length}/${maxLength}`} - - )} + + + {!!maxLength && ( + + {`${locale.alreadyInput} ${(curValue || '').length}/${maxLength}`} + + )} +
); }} diff --git a/components/apolloTable/component/base/edit/textarea/styles.less b/components/apolloTable/component/base/edit/textarea/styles.less index 0d50edcbc64a5aeefa7f98c94d002c7c73769236..6ce15f3c0f602626eb41547d0dfa8c5ed68beedd 100644 --- a/components/apolloTable/component/base/edit/textarea/styles.less +++ b/components/apolloTable/component/base/edit/textarea/styles.less @@ -2,11 +2,10 @@ position: relative; top: 0; left: 0; - .input { + .inputForm{ padding-bottom: 18px; - max-height: 500px !important; } - .wordNumber { + .wordNumberForm { position: absolute; right: 20px; bottom: 2px; @@ -14,3 +13,14 @@ font-size: 12px; } } +.input { + padding-bottom: 18px; + max-height: 500px !important; +} +.wordNumber { + position: absolute; + right: 35px; + bottom: 80px; + color: #e1e1e1; + font-size: 12px; +} \ No newline at end of file diff --git a/components/apolloTable/editForm/index.tsx b/components/apolloTable/editForm/index.tsx index 2a5f48d37399cc7d55ea04d77062d6a0a0b317e9..17edd7281a8e99c7df80fe5a1877563e74dec00b 100644 --- a/components/apolloTable/editForm/index.tsx +++ b/components/apolloTable/editForm/index.tsx @@ -59,7 +59,7 @@ const EditForm = (props: any) => { validateFirst={validateFirst} validateTrigger={validateTrigger} > - + ); }; diff --git a/components/apolloTable/editFormV3/index.tsx b/components/apolloTable/editFormV3/index.tsx index 524d23c6d12142daa47d4e141e9ff3fc2b7ca016..4d00a58779275a6d3a2fef9afe25bf816487c4e6 100644 --- a/components/apolloTable/editFormV3/index.tsx +++ b/components/apolloTable/editFormV3/index.tsx @@ -116,7 +116,7 @@ class FormWrap extends Component { validateTrigger, rules: [{ required: !!item.requiredFlag, message: '必填项不能为空' }, ...rules], initialValue: getFormat(detailConfig, item, value), - })()} + })()} ); };