import { ref, getCurrentInstance } from 'vue';

export function useRegion(){
    const { proxy } = getCurrentInstance();
    const provinceOptions = ref([])
    const cityOptions = ref([])
    const areaOptions = ref([])
    const provinceValue = ref([])
    
    const provincAreaDetailInfoList = val => {
        proxy.$http.get('/sys/region/list', { params: { pid: val } }).then((res) => {
            if (res.msg = 'success') {
                provinceOptions.value = res.data.data || []
            }
        })
    }
    const cityAreaDetailInfoList = val => {
        proxy.$http.get('/sys/region/list', { params: { pid: val } }).then((res) => {
            if (res.msg = 'success') {
                cityOptions.value = res.data.data || []
            }
        })
    }
    
    const countyAreaDetailInfoList = val => {
        proxy.$http.get('/sys/region/list', { params: { pid: val } }).then((res) => {
            if (res.msg = 'success') {
                areaOptions.value = res.data.data || []
            }
        })
    }
    
    const regionChange = (val, type) => {
        if (type == 'province') {
            cityAreaDetailInfoList(val)
        } else if (type == 'city') {
            countyAreaDetailInfoList(val)
        }
    }

    return {
        provinceOptions,
        cityOptions,
        areaOptions,
        provinceValue,
        provincAreaDetailInfoList,
        cityAreaDetailInfoList,
        countyAreaDetailInfoList,
        regionChange
    }
}