import { Input, Text, Textarea, View } from "@tarojs/components"
import { memo } from "react"
import "./index.scss"

interface ListParams{
  label: string, //左边label
  onInput?: (ev:Object)=>void, // 输入框输入
  onClick?:()=>any, //点击列表
  placeholder?:string, // 提示文本
  children?: any, // 插槽
  type?: string  // 类型：1.input,2.textarea,3.select
  value?: any
}

// 表单列表
const FromList = memo((props:ListParams)=>{
  const {type="input",value=""} = props;
  
  return (
    <View className="form-list">
      <View className="form-list-label">{props.label}</View>
      <View onClick={props?.onClick} className="form-list-right">
        {
          props.children??
          <View onClick={props?.onClick} className="form-list-right-meet">
            {
              type=="input"?
              <View className="form-list-input">
                <Input value={value} placeholder-class="phcolor" onInput={props?.onInput} placeholder={props.placeholder} />
                {value&&
                  <View><Text onClick={()=>props.onInput&&props.onInput({detail: {value: ""}})} className="iconfont icon-qingkong"/></View>
                }
              </View>:
              type=="textarea"?<Textarea value={value} placeholder-class="phcolor" onInput={props?.onInput} placeholder={props.placeholder} />:
              <>
                {
                  props.value?<View>{value}</View>:
                  <View className="form-list-right-placeholder">
                    {props.placeholder}
                  </View>
                }
                <View className="form-list-right-enter"><Text className="iconfont icon-a-moreback"></Text></View>
              </>
            }
          </View>
        }
      </View>
    </View>
  )
})

const A = ()=>{
  
}
export default FromList;