import {observable, action, computed} from 'mobx';

export default class Packages {

  @observable packagesList = [];
  @observable packagesListByStatus = [];
  @observable getAllPackagesLoading = false;
  @observable temporaryHotels = {
    name: '',
    image: []
  };
  @observable postData = {
    package_reward_id: '',
    name: '',
    transportation: '',
    description: '',
    banner: '',
    destination: {},
    duration: {},
    hotels: {
      hotels: []
    },
    galleries: {
      image: []
    },
    itinerary: {
      data: []
    },
    price: '',
    status: 'enable',
    repeat: '',
    transportation: ''
  };
  @observable postPackagesLoading = false;
  @observable deletePackagesLoading = false;
  @observable packageData = {
    package_reward_id: '',
    name: '',
    transportation: '',
    description: '',
    banner: '',
    destination: {},
    duration: {},
    transport: {
      name: ''
    },
    hotels: {
      hotels: [
        {
          name: '',
          image: [""]
        }
      ]
    },
    galleries: {
      image: []
    },
    itinerary: {
      data: []
    },
    price: '',
    status: 'enable',
    repeat: '',
    category_id: ''
  };
  @observable getPackageByIdLoading = false;
  @observable editPackagesLoading = false;
  @observable packageId = '';
  @observable imageGallerySource = [];
  @observable editedPackageData = {
    package_reward_id: '',
    name: '',
    transportation: '',
    description: '',
    banner: '',
    destination: {},
    duration: {},
    hotels: {
      hotels: [
        {
          name: '',
          image: [""]
        }
      ]
    },
    galleries: {
      image: []
    },
    transport: {
      name: ''
    },
    itinerary: {
      data: []
    },
    price: '',
    status: 'enable',
    repeat: '',
    category_id: ''
  };
  @observable packageReward = "";
  @observable paymentMethod = "";
  @observable rewardType = "";
  @observable queries = {
    departure_date: "",
    currency: "",
    destination: "",
    price_from: "",
    price_to: "",
    pax: ""
  };

  constructor(context) {
    this.http = context.http;
    this.context = context;
  }

  @action
  setDepartureDate(data) {
    this.queries.departure_date = data;
  }

  @action
  setCurrency(data) {
    this.queries.currency = data;
  }

  @action
  setDestination(data) {
    this.queries.destination = data;
  }

  @action
  setPriceFrom(data) {
    this.queries.price_from = data;
  }

  @action
  setPriceTo(data) {
    this.queries.price_to = data;
  }

  @action
  setPax(data) {
    this.queries.pax = data;
  }

  @action
  getAllPackages() {
    this.getAllPackagesLoading = true;
    return this.http.get(`packages`).then(res => {
      this.packagesList = res;
      this.getAllPackagesLoading = false;
    });

    console.log(this.packagesList)
  }

  @action
  getAllPackagesByQueries() {
    let builder = "";
    this.getAllPackagesLoading = true;
    if (this.queries.departure_date) {
      builder = "departure_date=" + this.queries.departure_date
    }
    return this.http.get(`packages?` + builder).then(res => {
      this.packagesListByStatus = res;
      this.getAllPackagesLoading = false;
    });

    console.log(this.packagesList)
  }

  @action
  getAllPackagesbyStatus() {
    this.getAllPackagesLoading = true;
    return this.http.get(`packages?status=enable`).then(res => {
      this.packagesListByStatus = res;
      this.getAllPackagesLoading = false;
    });

    console.log(this.packagesList)
  }

  @action
  getPackageById(id) {
    this.getPackageByIdLoading = true;
    return this.http.get(`packages/${id}`).then(res => {
      this.packageData = res[0];
      this.packageId = id;
      this.getPackageByIdLoading = false;
    })
  }

  @computed
  get isPackageEmpty() {
    if (this.packagesList.length > 0) {
      return false;
    }
    return true;

  }

  @computed
  get isPackageEmptybyStatus() {
    if (this.packagesListByStatus.length > 0) {
      return false;
    }
    return true;

  }

  @computed
  get isIteneraryEmpty() {
    if (this.postData.itinerary.data.length > 0) {
      return false;
    } else {
      return true;
    }
  }
  
    @computed
    get isHotelEmpty() {
      if (this.postData.hotels.hotels.length > 0) {
        return false;
      } else {
        return true;
      }
    }
  
    @computed
    get isHotelsEmpty() {
      if (this.packageData.hotels.hotels.length > 0) {
        return false;
      } else {
        return true;
      }
    }

  @action
  onUpdateGallery(data) {
    this.postData.galleries.image.push(data);
    // console.log(data)
  }

  @action
  onUpdateHotels(data) {
    this.temporaryHotels.image.push(data);
    // console.log(data)
  }

  @action
  addHotels(data){
    // if (typeof this.postData.hotels.hotels !== 'function') {
    //   this.postData.hotels.hotels = [];
    // }
    this.postData.hotels.hotels.push(data);
  }

  @computed
  get isGalleryEmpty() {
    if (this.postData.galleries.image.length > 0) {
      return false;
    } else {
      return true;
    }
  }

  @action
  postPackages() {
    this.postPackagesLoading = true;
    return this.http.post(`packages`, this.postData).then(res => {
      this.postPackagesLoading = false;
      return res;
    });
  }

  @action
  deletePackages(id) {
    this.deletePackagesLoading = true;
    return this.http.delete(`packages/${id}`).then(res => {
      this.getAllPackages();
      this.deletePackagesLoading = false;
      return res;
    });
  }

  @action
  editPackages() {
    this.editPackagesLoading = true;
    return this.http.put(`packages/${this.packageId}`, this.editedPackageData).then(res => {
      this.getAllPackages();
      this.editPackagesLoading = false;
      // this.packageData = {};
      return res;
    });
  }

  @action
  editPackagesDetail() {
    this.editPackagesLoading = true;
    return this.http.put(`packages/${this.packageId}`, this.editedPackageData).then(res => {
      this.getPackageById(this.packageId);
      this.editPackagesLoading = false;
      // this.packageData = {};
      return res;
    });
  }

}