import { shallowRef, reactive, computed } from 'vue'
import { useDataTable } from '@/hooks/datatable'
import { useLoginStore } from '@/stores'
import { queryUserReceiveInfo, userReceiveInfo, delUserReceiveInfo, userReceiveIsDefault } from '@/services/api/user'

export function useAddress() {
    const { getUserId } = useLoginStore()
    const { dataList, total, pageIndex, pageSize } = useDataTable<Model.UserReceiveInfoRsp>()
    const loading = shallowRef(false)
    const columns = shallowRef([])

    const getUserAddressList = () => {
        loading.value = true
        return queryUserReceiveInfo({
            data: {
                userid: getUserId(),
            },
            success: (res) => {
                total.value = res.total
                dataList.value = res.data
            },
            complete: () => {
                loading.value = false
            }
        })
    }

    return {
        loading,
        dataList,
        columns,
        total,
        pageIndex,
        pageSize,
        getUserAddressList,
    }
}

export function useAddressForm(selectedRow?: Model.UserReceiveInfoRsp) {
    const { getUserId } = useLoginStore()
    const loading = shallowRef(false)

    const formData = reactive<Proto.UserReceiveInfoReq>({
        ReceiveInfoId: 0,
        UserID: getUserId(),
        CardTypeID: 0,
        ReceiverName: '',
        CardNum: '',
        PhoneNum: '',
        Address: '',
        TakeRemark: '',
    })

    if (selectedRow?.autoid) {
        ({
            autoid: formData.ReceiveInfoId,
            userid: formData.UserID,
            receivername: formData.ReceiverName,
            cardtypeid: formData.CardTypeID,
            cardnum: formData.CardNum,
            phonenum: formData.PhoneNum,
            countryid: formData.CountryID,
            provinceid: formData.ProvinceID,
            cityid: formData.CityID,
            districtid: formData.DistrictID,
            address: formData.Address,
            takeremark: formData.TakeRemark,
        } = selectedRow)
    }

    // 地区名称
    const regionName = computed(() => {
        const { provincename, cityname, districtname } = selectedRow ?? {}
        if (provincename || cityname || districtname) {
            return [provincename, cityname, districtname].join(' ')
        }
        return ''
    })

    const addOrUpdate = () => {
        loading.value = true
        return userReceiveInfo({
            data: formData,
            complete: () => {
                loading.value = false
            }
        })
    }

    const deleteAddress = () => {
        loading.value = true
        return delUserReceiveInfo({
            data: {
                ReceiveInfoId: formData.ReceiveInfoId
            },
            complete: () => {
                loading.value = false
            }
        })
    }

    const updateAddressIsDefault = () => {
        loading.value = true
        return userReceiveIsDefault({
            data: {
                UserId: getUserId(),
                AutoId: formData.ReceiveInfoId
            },
            complete: () => {
                loading.value = false
            }
        })
    }

    return {
        loading,
        formData,
        regionName,
        addOrUpdate,
        deleteAddress,
        updateAddressIsDefault,
    }
}