From 8e558ac57ff677bfa0a622c075676a6b822c182e Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E7=AD=B1=E9=87=8E?= Date: Mon, 24 Nov 2025 23:30:27 +0800 Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E5=BC=B9=E7=AA=97?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/TextareaTag/TextareaTag.scss | 12 +++++++++ src/components/TextareaTag/TextareaTag.tsx | 19 +++++++++----- .../TitleTextarea/TitleTextarea.tsx | 15 ++++++----- src/components/TitleTextarea/index.scss | 3 +++ .../formSchema/publishBallFormSchema.ts | 2 +- .../AiImportPopup/AiImportPopup.tsx | 9 +++++-- .../AiImportPopup/index.module.scss | 3 +++ .../SelectStadium/SelectStadium.tsx | 8 ++++++ src/publish_pages/publishBall/index.tsx | 26 +++++++++++++++++-- 9 files changed, 79 insertions(+), 18 deletions(-) diff --git a/src/components/TextareaTag/TextareaTag.scss b/src/components/TextareaTag/TextareaTag.scss index 7dbc0e6..42c9e5e 100644 --- a/src/components/TextareaTag/TextareaTag.scss +++ b/src/components/TextareaTag/TextareaTag.scss @@ -7,6 +7,9 @@ box-sizing: border-box; .input-wrapper { margin-top: 8px; + display: flex; + flex-direction: column; + gap: 4px; .additional-input { width: 100%; min-height: 46px; @@ -22,6 +25,15 @@ color: theme.$textarea-placeholder-color; } } + .char-count { + color: #999; + font-size: 12px; + line-height: 18px; + text-align: right; + &.char-count--error { + color: #ff4d4f; + } + } } .options-wrapper { diff --git a/src/components/TextareaTag/TextareaTag.tsx b/src/components/TextareaTag/TextareaTag.tsx index c967faf..484c009 100644 --- a/src/components/TextareaTag/TextareaTag.tsx +++ b/src/components/TextareaTag/TextareaTag.tsx @@ -1,4 +1,4 @@ -import React, { useCallback, useState } from 'react' +import React, { useCallback } from 'react' import { View, Textarea } from '@tarojs/components' import { Checkbox } from '@nutui/nutui-react-taro' @@ -21,14 +21,15 @@ const TextareaTag: React.FC = ({ value, onChange, placeholder = '请输入', - maxLength = 1000, + maxLength = 200, options = [], onFocus, onBlur }) => { // 处理文本输入变化 - const handleTextChange = useCallback((e: any) => { - onChange({...value, description: e.detail.value}) + const handleTextChange = useCallback((val: string) => { + console.log(val,'e.detail.value') + onChange({...value, description: val}) }, [onChange]) // 处理标签选择变化 @@ -36,7 +37,8 @@ const TextareaTag: React.FC = ({ onChange({...value, description_tag: selectedTags}) }, [onChange]) - console.log(options, 'options') + const isOverflow = value.description.length > maxLength + return ( {/* 选择选项 */} @@ -70,12 +72,15 @@ const TextareaTag: React.FC = ({ placeholder={placeholder} value={value.description} placeholderClass='textarea-placeholder' - onInput={handleTextChange} - maxlength={maxLength} + onInput={(e) => handleTextChange(e.detail.value)} + maxlength={-1} autoHeight={true} onFocus={onFocus} onBlur={onBlur} /> + + {value.description.length}/{maxLength} + diff --git a/src/components/TitleTextarea/TitleTextarea.tsx b/src/components/TitleTextarea/TitleTextarea.tsx index cf32dcc..f6a4c27 100644 --- a/src/components/TitleTextarea/TitleTextarea.tsx +++ b/src/components/TitleTextarea/TitleTextarea.tsx @@ -21,12 +21,13 @@ const TitleTextarea: React.FC = ({ onFocus, onBlur }) => { + const isOverflow = value.length > maxLength const handleChange = useCallback((values) => { - if (values.length > maxLength ) { - const newValues = values.slice(0, maxLength) - onChange(newValues) - return; - } + // if (values.length > maxLength ) { + // const newValues = values.slice(0, maxLength) + // onChange(newValues) + // return; + // } onChange(values) }, []) return ( @@ -42,7 +43,9 @@ const TitleTextarea: React.FC = ({ onFocus={onFocus} onBlur={onBlur} /> - {value.length}/{maxLength} + + {value.length}/{maxLength} + ) } diff --git a/src/components/TitleTextarea/index.scss b/src/components/TitleTextarea/index.scss index 98378d7..48682a7 100644 --- a/src/components/TitleTextarea/index.scss +++ b/src/components/TitleTextarea/index.scss @@ -41,5 +41,8 @@ font-size: 14px; font-weight: 400; line-height: 24px; + &.char-count--error { + color: #ff4d4f; + } } } \ No newline at end of file diff --git a/src/config/formSchema/publishBallFormSchema.ts b/src/config/formSchema/publishBallFormSchema.ts index 7904952..b682eff 100644 --- a/src/config/formSchema/publishBallFormSchema.ts +++ b/src/config/formSchema/publishBallFormSchema.ts @@ -150,7 +150,7 @@ export const publishBallFormSchema: FormFieldConfig[] = [ placeholder: '补充性别偏好、特殊要求和注意事项等信息', required: true, props: { - maxLength: 1000, + maxLength: 200, }, options:[ { label: '仅限男生', value: '仅限男生' }, diff --git a/src/publish_pages/publishBall/components/AiImportPopup/AiImportPopup.tsx b/src/publish_pages/publishBall/components/AiImportPopup/AiImportPopup.tsx index 02509fb..0f9f08f 100644 --- a/src/publish_pages/publishBall/components/AiImportPopup/AiImportPopup.tsx +++ b/src/publish_pages/publishBall/components/AiImportPopup/AiImportPopup.tsx @@ -25,6 +25,7 @@ const AiImportPopup: React.FC = ({ const [loading, setLoading] = useState(false) const [uploadLoading, setUploadLoading] = useState(false) const maxFailCount = 3 + const isCharCountExceeded = text.length > 100 // 获取 actions（在组件顶层调用 Hook） const { setPublishData } = usePublishBallActions() @@ -56,6 +57,7 @@ const AiImportPopup: React.FC = ({ } const handlePasteAndRecognize = async () => { if (text) { + if (text.length > 100) return; textIdentification(text) } else { getClipboardData() @@ -71,6 +73,7 @@ const AiImportPopup: React.FC = ({ duration: 2, wordBreak:'break-word' }) + if (res.data.length > 100) return; textIdentification(res.data) // Taro.showToast({ // title: '已读取你的剪切板信息', @@ -220,7 +223,7 @@ const AiImportPopup: React.FC = ({ onFocus={() => {}} onBlur={() => {}} placeholder="在此「粘贴识别」或输入文本，智能拆分球局时间、费用、地点和其他信息，并帮你智能生成球局标题" - maxlength={100} + maxlength={-1} showConfirmBar={false} placeholderClass={styles.textArea_placeholder} autoHeight @@ -228,7 +231,9 @@ const AiImportPopup: React.FC = ({ adjustPosition={false} /> - {text.length}/100 + + {text.length}/100 + diff --git a/src/publish_pages/publishBall/components/AiImportPopup/index.module.scss b/src/publish_pages/publishBall/components/AiImportPopup/index.module.scss index e676a40..db3b909 100644 --- a/src/publish_pages/publishBall/components/AiImportPopup/index.module.scss +++ b/src/publish_pages/publishBall/components/AiImportPopup/index.module.scss @@ -85,6 +85,9 @@ font-size: 12px; color: #8a8a8a; } + .charCountTextExceeded { + color: #ff4d4f; + } } } diff --git a/src/publish_pages/publishBall/components/SelectStadium/SelectStadium.tsx b/src/publish_pages/publishBall/components/SelectStadium/SelectStadium.tsx index 424e552..744ca27 100644 --- a/src/publish_pages/publishBall/components/SelectStadium/SelectStadium.tsx +++ b/src/publish_pages/publishBall/components/SelectStadium/SelectStadium.tsx @@ -118,6 +118,14 @@ const SelectStadium: React.FC = ({ const formData = stadiumDetailRef.current.getFormData() console.log('获取球馆表单数据:', formData) const { description, ...rest } = formData + const { description: descriptionInfo} = description; + if (descriptionInfo.length > 200 ) { + Taro.showToast({ + title: `场地信息补充最多可输入200个字`, + icon: "none", + }); + return; + }; onConfirm({ ...rest, ...description }) setSelectedStadium(null) setSearchValue('') diff --git a/src/publish_pages/publishBall/index.tsx b/src/publish_pages/publishBall/index.tsx index ff0854f..6bd8f29 100644 --- a/src/publish_pages/publishBall/index.tsx +++ b/src/publish_pages/publishBall/index.tsx @@ -206,8 +206,10 @@ const PublishBall: React.FC = () => { image_list, players, current_players, + descriptionInfo } = formData; const { play_type, price, location_name } = activityInfo; + const { description } = descriptionInfo; const { max } = players; if (!image_list?.length && activityType === "group") { @@ -241,6 +243,16 @@ const PublishBall: React.FC = () => { } return false; } + if (title.length > 20) { + if (!isOnSubmit) { + Taro.showToast({ + title: `标题最多可输入20个字`, + icon: "none", + }); + } + return false; + } + if ( !price || (typeof price === "number" && price <= 0) || @@ -324,6 +336,16 @@ const PublishBall: React.FC = () => { return false; } + if (description?.length > 200) { + if (!isOnSubmit) { + Taro.showToast({ + title: `补充要求最多可输入200个字`, + icon: "none", + }); + } + return false; + } + return true; }; const validateOnSubmit = () => { @@ -865,7 +887,7 @@ const PublishBall: React.FC = () => { )} - {activityType === "group" && ( + {/* {activityType === "group" && ( { /> 已认证 徐汇爱打球官方球场，请严格遵守签约协议 - )} + )} */}