import { View, Image, Switch, Radio, RadioGroup } from "@tarojs/components"
import Taro from "@tarojs/taro"
import { useState, useEffect } from "react"
import CustomNav from "@/components/CustomNav"
import edit from "@/assets/icons/comm/edit.png"
import userRight from '@/assets/mineImgaes/userRight.png'

import deletes from "@/assets/icons/comm/deletes.png"
import ButtontWX from '@/components/ButtontWX'


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

import './style.less'



export default (props) => {
  const [addresList, setAddresList] = useState([])

  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) => {

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

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

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

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

  }
  const addressEdit = (e) => {
    console.log('e', e);

  }


  const getList = () => {
    getAddress().then((e) => {
      console.log('地址列表', e);
      setAddresList(e.records)
    })
  }

  useEffect(() => {
    getList()


    console.log('执行了', switchBool,);
  }, [switchBool,])



  return (
    <View className='page-index'>
      <View className='index-navbar'>
        <CustomNav title='地址管理' />
      </View>
      <scroll-view scrollY style='height: 100%;' >
        <View>
          {

            addresList.map((item, index) => {
              return (
                <View className='addressList-box' key={index}>
                  <View className='addressList-box-addressTop'>
                    <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)} />
                    </View>

                    <View className='addressList-box-addressBotton-setAddress'>
                      <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>
                  </View>
                </View>
              )
            })
          }

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

          </View>

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