import { ref, reactive, onMounted, computed, watch, watchEffect, nextTick } from "vue";
import { ElMessageBox, ElMessage, ElLoading } from "element-plus";
import {
  getProviceByUid,
  getCityByUid,
  getCountryByUid,
  getStationByUid,
  getPowerByUid,
  getBattByUid,
} from '@/api/station.js';


export default () => {
  const provice = ref("");
  const city = ref("");
  const country = ref("");
  const stationName = ref("");
  const stationId = ref("");
  const powerId = ref("");
  const battId = ref("");
  const proviceList = ref([]);
  const cityList = ref([]);
  const countryList = ref([]);
  const stationList = ref([]);
  const powerList = ref([]);
  const battList = ref([]);

  const isManual = ref(false);

  let loadPromise = null;

  onMounted(async () => {
    loadPromise = new Promise(async (resolve, reject) => {
      await getProviceList();
      await getStationList();
      await getPowerList();
      await getBattList();

      resolve();
    });
  });

  watch(
    () => provice.value,
    (val) => {
      if (val) {
        city.value = "";
        getCityList();
      } else {
        cityList.value = [];
        city.value = "";
      }
      powerId.value = "";
      battId.value = "";
      getPowerList();
      getBattList();
    }
  );

  watch(
    () => city.value,
    (val) => {
      if (val) {
        country.value = "";
        getCountryList();
      } else {
        countryList.value = [];
        country.value = "";
      }
      powerId.value = "";
      battId.value = "";
      getPowerList();
      getBattList();
    }
  );

  watch(
    () => country.value,
    (val) => {
      if (val) {
        stationName.value = "";
        getStationList();
      } else {
        stationList.value = [];
        stationName.value = "";
      }
      powerId.value = "";
      battId.value = "";
      getPowerList();
      getBattList();
    }
  );

  watch(
    () => stationName.value,
    async (val) => {
      // if (val) {
      //   powerId.value = "";
      // } else {
      //   powerList.value = [];
      //   powerId.value = "";
      // }
      let station = stationList.value.find(v => v.stationName == val);
      if (station) {
        stationId.value = station.stationId;
      }
      if (!isManual.value) {
        powerId.value = "";
        battId.value = "";
        await getPowerList();
        await getBattList();
      }
    }
  );

  function getProviceList() {
    return getProviceByUid().then((res) => {
      let { code, data, data2 } = res;
      let _list = [];
      if (code && data) {
        _list = data2;
      }
      proviceList.value = _list;
      return _list;
    });
  }

  function getCityList() {
    return getCityByUid(provice.value).then((res) => {
      let { code, data, data2 } = res;
      let _list = [];
      if (code && data) {
        _list = data2;
      }
      cityList.value = _list;
      // city.value = "";
      return _list;
    });
  }

  function getCountryList() {
    return getCountryByUid(provice.value, city.value).then((res) => {
      let { code, data, data2 } = res;
      let _list = [];
      if (code && data) {
        _list = data2;
      }
      countryList.value = _list;
      // country.value = "";
      return _list;
    });
  }

  function getStationList() {
    let params = {
      provice: provice.value || undefined,
      city: city.value || undefined,
      country: country.value || undefined,
    };
    return getStationByUid(params).then((res) => {
      let { code, data, data2 } = res;
      let _list = [];
      if (code && data) {
        _list = data2;
      }
      stationList.value = _list;
      // stationName.value = "";
      return _list;
    });
  }

  function getPowerList() {
    let params = {
      provice: provice.value || undefined,
      city: city.value || undefined,
      country: country.value || undefined,
      stationName: stationName.value || undefined
    };
    return getPowerByUid(params).then((res) => {
      let { code, data, data2 } = res;
      let _list = [];
      if (code && data) {
        _list = data2;
      }
      powerList.value = _list;
      // powerId.value = "";
      return _list;
    });
  }

  function getBattList() {
    let params = {
      provice: provice.value || undefined,
      city: city.value || undefined,
      country: country.value || undefined,
      stationName: stationName.value || undefined,
    };
    return getBattByUid(params).then((res) => {
      let { code, data, data2 } = res;
      let _list = [];
      if (code && data) {
        _list = data2;
      }
      battList.value = _list;
      // powerId.value = "";
      isManual.value = false;
      return _list;
    });
  }

  return { provice, city, country, stationName, stationId, powerId, battId, proviceList, cityList, countryList, stationList, powerList, battList, getProviceList, getCityList, getCountryList, getStationList, getPowerList, getBattList, isManual,
    whenLoaded: () => loadPromise,
  };
};