import { View, Image, Switch, Radio, RadioGroup } from "@tarojs/components"
import Taro, { useDidShow } from "@tarojs/taro"
import { useState, useEffect, useMemo } from "react"
import CustomNav from "@/components/CustomNav"
import edit from "@/assets/icons/comm/edit.png"
import userRight from '@/assets/mineImgaes/userRight.png'
import withLayout from '@/layouts'
import deletes from "@/assets/icons/comm/deletes.png"
import ButtontWX from '@/components/ButtontWX'
import { useModel } from "@/store"


import { addressDefault, getAddress, addressDelete, addressUpdate } from "@/services/address"

import './style.less'



export default withLayout((props) => {
  const [addresList, setAddresList] = useState([])
  const $instance = Taro.getCurrentInstance()
  const { type } = $instance.router.params
  console.log("🚀 ~ file: index.jsx ~ line 23 ~ withLayout ~ orderAddress", type)


  const { setUserOrderAddress, userOrderAddress } = useModel('userData')


  const addAddress = () => {
    Taro.navigateTo({ url: `/pages/MyAddressList/AddressInfos/index?id=${1}` })
  }

  const addressDeletess = (e) => {
    Taro.showModal({
      title: '提示',
      content: '您确定要删除此地址吗',
      success: function (res) {
        if (res.confirm) {
          addressDelete(e).then((e) => {
            Taro.showToast({
              title: '地址删除成功',
              icon: 'success',
              duration: 2000
            })
            getList()

          })
        } else if (res.cancel) {
          console.log('用户点击取消')
        }
      }
    })

  }
  const [switchBool, setSwitchBool] = useState()
  // const [switchValue, setSwitchValue] = useState('')

  const handelSwitch = (a, e) => {
    const { value } = e.detail
    addressDefault(a).then((se) => {
      console.log('e', se);
      getList()
    })
    // if (value == '') {
    //   setSwitchBool(!!value)

    // } else {
    //   setSwitchBool(!value)
    // }

  }
  const addressEdit = (e, res) => {
    console.log('e', e);
    Taro.navigateTo({ url: `/pages/MyAddressList/AddressInfos/index?addressId=${e}&address=${res}` })

  }



  const getList = () => {
    getAddress().then((e) => {
      console.log('地址列表', e);
      // let abccList = e.records.sort((a, b) => b.isDefault - a.isDefault)
      // console.log("🚀 ~ file: index.jsx ~ line 75 ~ getAddress ~ abccList", abccList)
      setAddresList(e.records)
    })
  }
  useDidShow(() => {
    getList()

  })

  useEffect(() => {
    getList()


  }, [])

  const srcor = (e) => {
    console.log('评分', e.detail);

  }
  const handleAddress = (e) => {
    if (e) {
      setUserOrderAddress(e)
      Taro.showToast({
        title: '选择成功',
        icon: 'success',
        duration: 2000
      }).then(() => {
        setTimeout(() => {
          Taro.navigateBack({
            delta: 1
          })
          setInterval()

        }, 300)
      })

      console.log('选择的地址存放在store', userOrderAddress);



    }



  }
  return (
    <View className='page-index'>
      <View className='index-navbar'>
        <CustomNav title='地址管理' />
      </View>
      <scroll-view scrollY style='height: 100%;' >
        <View>
          {/* <mp-orderRater raterChange={srcor} initW='50%' /> */}
          {
            addresList.map((item, index) => {
              return (
                <View className='addressList-box' key={index}>
                  <View className='addressList-box-addressTop'>
                    {
                      item.isDefault ?
                        <View className='addressList-box-addressTop-redText'>默认地址</View> : ''
                    }
                    <View className='addressList-box-addressTop-title'>我的地址{index + 1}</View>
                  </View>
                  <View className='addressList-box-addressBotton'>
                    <View className='addressList-box-addressBotton-editTextImage'>
                      <View>
                        {item.address}
                      </View>
                      <Image src={edit} onClick={() => addressEdit(item.addressId, item.address)} />
                    </View>

                    <View className='addressList-box-addressBotton-setAddress'>
                      {
                        !type ? <>
                          <View>
                            设为默认地址:
                            <RadioGroup className='radio-group' onChange={(res) => handelSwitch(item.addressId, res)} >
                              <Radio color='#FC5531' checked={item.isDefault}></Radio>
                            </RadioGroup>
                          </View>

                          <View className='addressList-box-addressBotton-addressDelete' onClick={() => addressDeletess(item.addressId)}>
                            <View>
                              删除
                            </View>
                            <Image src={deletes} />

                          </View>
                        </>
                          : <View className='orderAddressa' onClick={() => handleAddress(item.address)}>
                            选择此地址
                          </View>
                      }

                    </View>
                  </View>
                </View>
              )
            })
          }

          <View className='bottomButtom' >
            <ButtontWX onClick={addAddress} formType='submit' butText='+新增收货地址' butWidth={315} butHeight={49} butFontSize={16} butBorderRadius={49} />
          </View>

        </View>
      </scroll-view>
    </View >
  )
})