import { Button, Navigator, ScrollView, Text, View } from "@tarojs/components"
import { memo, useState } from "react"
import "./index.scss"

interface Params{
  refresherEnabled?: boolean,//是否开启刷新
  onSelect?: (item:any,index:number)=>void,//列表选择

}

// 地址列表
const AddressList = memo((props:Params)=>{
  // 处理刷新
  const [refreshState, setRefreshState] = useState(false);
  const handleRefresh = ()=>{
    setRefreshState(true);
    setTimeout(()=>{
      setRefreshState(false);
    },500)
  }
  const data = Array.from({length:15});

  return (
    <View className="address-scroll-view">
      <ScrollView scrollY refresherEnabled={props.refresherEnabled} enhanced refresherTriggered={refreshState} onRefresherRefresh={handleRefresh}>
        {
          data.length>0?
          data.map((item,index)=>{
            return(
              <View onClick={()=>props.onSelect&&props.onSelect(item,index)} className={`address-list ${index==0&&'address-active'}`}>
                <View className="address-user">
                  XL纺织
                  {
                    index==0?<Text className="address-list-default">默认</Text>:
                    <Text className="address-list-phone">1656488999</Text>
                  }
                </View>
                <View className="address-list-bottom">
                  <View className="address-list-info">
                    **省**市**区**街道****仓库
                    <Text className="address-list-phone">181****9790</Text>
                  </View>
                  <Navigator url="/pages/addressAdd/index?type=edit" hoverClass="none" className="address-edit">
                    <Text className="iconfont icon-bianji"></Text>
                  </Navigator>
                </View>
              </View>
            );
          }):
          <View className="address-no-data">暂未添加地址</View>
        }
      </ScrollView>
      <Navigator url="/pages/addressAdd/index?type=add" hoverClass="none" className="add-address">添加收货地址</Navigator>
    </View>
  )
})

export default AddressList;