import Vue from 'vue';
import { get } from 'lodash';
import App from './app.vue';
import { createRouter } from './router';
import { createStore } from './store';
import 'filters';
import 'directives';
import titleMixin from './mixins/title';
import pluginCore from './plugins/core';
import lazyload from 'vue-lazyload';
import reportError from 'report-error';
import ReportApp from './common/report-app';

Vue.use(lazyload, {
  preLoad: 2,
});
Vue.use(pluginCore);
Vue.mixin(titleMixin);

export function createApp(context) {
  const router = createRouter();
  const store = createStore(context);

  const reportApp = new ReportApp('');

  const app = new Vue({
    router,
    store,
    errorCaptured(error) {
      reportError(context, 'server')(error);
      return false;
    },
    methods: {
      getAnalyticAppData() {
        return new Promise(resolve => {
          if (this._updated) {
            return resolve();
          }

          this.$yoho.getAnalyticAppData('', data => {
            this._updated = true;
            reportApp.updateDeviceInfo(data);
            resolve();
          });

          setTimeout(function() {
            resolve();
          }, 500);
        });
      },
      async reportApp(type, pn, params = {}, pt) {
        let user = await this.$sdk.getUser();

        await this.getAnalyticAppData();

        if (!params.mst) {
          params.mst = get(this.$router, 'history.current.name', '');
        }
        reportApp.report(type, pt || 'BUSINESS', pn, params, get(user, 'uid'));
      },
      reportAppStart() {
        this.reportApp('', 'BUSINESS_PLAN_A_ENTER', { locfun: 'mounted' });
      },
    },
    render: h => h(App),
  });

  return { app, router, store };
}