import "./main.css";
/* script */
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
import { componentMixin, createComponentName } from '../../utils/base';
import ThirdpartAuthDialog from './thirdpart-auth-dialog';
const __vue_script__ = {
  name: createComponentName('account-main'),
  components: {
    ThirdpartAuthDialog
  },
  mixins: [componentMixin],
  props: {
    thirdpartLogin: {
      type: Array,

      default() {
        return [];
      }

    },
    authUrl: {
      type: Object,
      default: null
    },
    tab: {
      type: String,

      default() {
        return 'login';
      }

    },
    appStage: {
      type: String,

      default() {
        return 'production';
      }

    },
    styleHref: {
      type: String,

      default() {
        return '';
      }

    },
    withoutTips: {
      type: Boolean,

      default() {
        return false;
      }

    }
  },

  data() {
    return {
      accountPageUrl: '',
      showThirdpartAuth: false,
      authProvider: ''
    };
  },

  computed: {
    accountTab: {
      get() {
        return this.tab;
      },

      set(tab) {
        this.$emit('update:tab', tab);
      }

    },

    accountPageRoute() {
      return this.siteUrl + '/account';
    },

    siteUrl() {
      const appStage = this.appStage;

      if (appStage === 'development') {
        return 'http://www.gaoding.localhost';
      }

      if (appStage === 'test') {
        return 'http://www.dev.gaoding.com';
      }

      if (appStage === 'stage') {
        return 'https://stage.gaoding.com';
      }

      return 'https://www.gaoding.com';
    }

  },

  mounted() {
    this.init();
  },

  methods: {
    initExtImporter() {
      const handlers = {
        'login.success': data => {
          this.$emit('login-success', data);
        },
        'login.error': error => {
          this.$emit('login-error', error);
        },
        'update:tab': data => {
          this.accountTab = data.tab;
        },
        'ui.error': data => {
          this.$emit('ui-error', data);
        },
        'ui.tips': data => {
          this.$emit('ui-tips', data);
        },
        'login.thirdpart': data => {
          this.authProvider = data;
          this.showThirdpartAuth = true;
          this.$emit('login-thirdpart', data);
        },
        'register.success': data => {
          this.$emit('register-success', data);
        }
      };

      const evtHandler = evt => {
        const data = evt.data || {};
        const action = data.action;

        if (handlers[action]) {
          handlers[action].call(this, data.data);
          return;
        }

        if (this.appStage === 'development') {
          console.error('Not Supported Action', action, data);
        }
      };

      window.addEventListener('message', evtHandler, false);
      this.$on('destroy', () => {
        window.removeEventListener('message', evtHandler, false);
      });
    },

    getAccountPageUrl() {
      let url = this.accountPageRoute;
      let thirdpartQuery = '';
      const thirdpartLogin = this.thirdpartLogin;
      const params = [this.tab];
      const queryArray = [];
      const styleHref = this.styleHref;

      if (styleHref) {
        queryArray.push(`style_href=${styleHref}`);
      }

      for (let provider of thirdpartLogin) {
        if (provider) {
          thirdpartQuery += provider + ',';
        }
      }

      if (thirdpartQuery.length > 0) {
        thirdpartQuery = 'thirdpart=' + thirdpartQuery.slice(0, -1);
        queryArray.push(thirdpartQuery);
      }

      const withoutTips = this.withoutTips;

      if (withoutTips) {
        queryArray.push('without_tips=1');
      }

      if (params.length) {
        url += `/${params.join('/')}`;
      }

      if (queryArray.length) {
        url += `?${queryArray.join('&')}`;
      }

      this.accountPageUrl = url;
      return url;
    },

    init() {
      this.getAccountPageUrl();
      this.initExtImporter();
    }

  }
};
/* template */

var __vue_render__ = function () {
  var _vm = this;

  var _h = _vm.$createElement;

  var _c = _vm._self._c || _h;

  return _c("div", {
    staticClass: "gd-account-main"
  }, [_vm._t("header"), _vm._v(" "), _c("iframe", {
    staticClass: "gd-account-main-iframe",
    attrs: {
      name: "gd-account-frame",
      src: _vm.accountPageUrl,
      frameborder: "0"
    }
  }), _vm._v(" "), _c("ThirdpartAuthDialog", {
    attrs: {
      visible: _vm.showThirdpartAuth,
      authUrl: _vm.authUrl,
      authProvider: _vm.authProvider,
      siteUrl: _vm.siteUrl
    },
    on: {
      "update:visible": function ($event) {
        _vm.showThirdpartAuth = $event;
      }
    }
  }), _vm._v(" "), _vm._t("footer")], 2);
};

var __vue_staticRenderFns__ = [];
__vue_render__._withStripped = true;
/* style */

const __vue_inject_styles__ = undefined;
/* scoped */

const __vue_scope_id__ = undefined;
/* module identifier */

const __vue_module_identifier__ = undefined;
/* functional template */

const __vue_is_functional_template__ = false;
/* component normalizer */

import __vue_normalize__ from '../../utils/vue-normalize-component.js';
/* style inject */

/* style inject SSR */

export default __vue_normalize__({
  render: __vue_render__,
  staticRenderFns: __vue_staticRenderFns__
}, __vue_inject_styles__, __vue_script__, __vue_scope_id__, __vue_is_functional_template__, __vue_module_identifier__, undefined, undefined);