import { Route } from 'vue-router';
import { Component, Prop, Vue, Watch } from 'vue-property-decorator';
import { LoginSubmit } from '@/models';
import userStore from '@/store-modules/user';

@Component({})
export default class Login extends Vue {

  private loginForm: LoginSubmit = {
    email: '',
    password: ''
  };

  private waiting = false;
  private flashMessage = '';
  private  redirect: string | undefined = undefined;

  public async login() {
    this.waiting = true;
    this.flashMessage = '';
    try {
      await userStore.login(this.loginForm);
      this.$router.push({ path: this.redirect || '/' });
    } catch (e) {
      if (e.response.status === 401) {
        this.flashMessage = 'invlid username or password';
      }
    }
    this.waiting = false;
  }

  /*
  @Watch('$route', { immediate: true })
  private onRouteChange(route: Route) {
    this.redirect = route.query && route.query.redirect as string;
  }
  */
}

// TODO: styling of flash message