增加获取场馆、字典

src/pages/publishBall/components/FormBasicInfo/FormBasicInfo.tsx

@@ -1,12 +1,28 @@
-import React, { useState } from 'react'
+import React, { useState, useCallback, useEffect } from 'react'
 import { View, Text, Input, Image, Picker } from '@tarojs/components'
 import PopupGameplay from '../PopupGameplay'
 import img from '@/config/images';
-import './FormBasicInfo.scss'
 import { FormFieldConfig } from '@/config/formSchema/publishBallFormSchema';
+import SelectStadium from '../SelectStadium/SelectStadium'
+import { Stadium } from '../SelectStadium/StadiumDetail'
+import './FormBasicInfo.scss'
 
+type PlayGame = {
+  play_type: string // 玩法类型
+  price: number | string // 价格
+  venue_id?: number | null // 场地id
+  location_name?: string // 场地名称
+  location?: string // 场地地址
+  latitude?: string // 纬度
+  longitude?: string // 经度
+  court_type?: string // 场地类型 1: 室内 2: 室外
+  court_surface?: string // 场地表面 1: 硬地 2: 红土 3: 草地
+  venue_description_tag?: Array<string>[] // 场地描述标签
+  venue_description?: string // 场地描述
+  venue_image_list?: Array<string>[] // 场地图片
+}
 interface FormBasicInfoProps {
-  value: any
+  value: PlayGame
   onChange: (value: any) => void
   children: FormFieldConfig[]
 }
@@ -17,20 +33,49 @@ const FormBasicInfo: React.FC<FormBasicInfoProps> = ({
   children
 }) => {
   const [gameplayVisible, setGameplayVisible] = useState(false)
-  
+  const [showStadiumSelector, setShowStadiumSelector] = useState(false)
+  const [playGame, setPlayGame] = useState<{label: string, value: string }[]>([])
   const handleGameplaySelect = () => {
     setGameplayVisible(true)
   }
 
   const handleGameplayConfirm = (selectedGameplay: string) => {
-    onGameplayChange(selectedGameplay)
+    onChange({...value, [children[2].prop]: selectedGameplay})
     setGameplayVisible(false)
   }
 
   const handleGameplayClose = () => {
     setGameplayVisible(false)
   }
+// 处理场馆选择
+  const handleStadiumSelect = (stadium: Stadium | null) => {
+    console.log(stadium,'stadiumstadium');
+    const { address, name, latitude, longitude, court_type, court_surface, description, description_tag, venue_image_list} = stadium || {};
+    onChange({...value, 
+      venue_id: stadium?.id, 
+      location_name: name, 
+      location: address, 
+      latitude, 
+      longitude,
+      court_type,
+      court_surface,
+      venue_description: description,
+      venue_description_tag: description_tag,
+      venue_image_list
+    })
+    setShowStadiumSelector(false)
+  }
 
+  const handleChange = useCallback((key: string, value: any) => {
+    onChange({...value, [key]: value})
+  }, [onChange])
+
+  useEffect(() => {
+    if (children.length > 2) {
+      const options = children[2]?.options || [];
+      setPlayGame(options)
+    }
+  }, [children])
   const renderChildren = () => {
     return children.map((child: any, index: number) => {
       return <View className='form-item'>
@@ -46,8 +91,8 @@ const FormBasicInfo: React.FC<FormBasicInfoProps> = ({
               placeholder='请输入'
               placeholderClass='title-placeholder'
               type='digit'
-              value={value[child.key]}
-              onInput={(e) => onChange(child.key, e.detail.value)}
+              value={value[child.prop]}
+              onInput={(e) => handleChange(child.prop, e.detail.value)}
             />
             <Text className='unit'>元/每人</Text>
           </View>
@@ -56,9 +101,9 @@ const FormBasicInfo: React.FC<FormBasicInfoProps> = ({
       {
         index === 1 && (<View className='form-wrapper'>
           <Text className='form-item-label'>{child.label}</Text>
-          <View className='form-right-wrapper' onClick={() => {}}>
-            <Text className={`right-text ${value[child.key] ? 'selected' : ''}`}>
-              {value[child.key] ? value[child.key] : '请选择'}
+          <View className='form-right-wrapper' onClick={() => setShowStadiumSelector(true)}>
+            <Text className={`right-text ${value[child.prop] ? 'selected' : ''}`}>
+              {value[child.prop] ? value[child.prop] : '请选择'}
             </Text>
             <Image src={img.ICON_ARROW_RIGHT}  className='arrow'/>
           </View>
@@ -68,8 +113,8 @@ const FormBasicInfo: React.FC<FormBasicInfoProps> = ({
         index === 2 && ( <View className='form-wrapper'>
           <Text className='form-item-label'>{child.label}</Text>
           <View className='form-right-wrapper' onClick={handleGameplaySelect}>
-            <Text className={`right-text ${value[child.key] ? 'selected' : ''}`}>
-              {value[child.key] ? value[child.key] : '请选择'}
+            <Text className={`right-text ${value[child.prop] ? 'selected' : ''}`}>
+              {value[child.prop] ? value[child.prop] : '请选择'}
             </Text>
             <Image src={img.ICON_ARROW_RIGHT}  className='arrow'/>
           </View>
@@ -81,15 +126,21 @@ const FormBasicInfo: React.FC<FormBasicInfoProps> = ({
   return (
     <View className='form-basic-info'>
       {/* 费用 */}
-      {/* {renderChildren()} */}
-      
+      {renderChildren()}
       {/* 玩法选择弹窗 */}
-      {/* <PopupGameplay 
+      <PopupGameplay 
         visible={gameplayVisible}
         onClose={handleGameplayClose}
         onConfirm={handleGameplayConfirm}
-        selectedGameplay={value[children[2].key]}
-      /> */}
+        value={value[children[2].prop]}
+        options={playGame}
+      />
+      {/* 场馆选择弹窗 */}
+      <SelectStadium
+        visible={showStadiumSelector}
+        onClose={() => setShowStadiumSelector(false)}
+        onConfirm={handleStadiumSelect}
+      />
     </View>
   )
 }