<template>
  <div id="app">
    <!-- <el-button v-for="item in microApps" :key="item.activeRule" type="primary" @click="gotoPage(item)">{{ item.name }}</el-button> -->
    <router-view />
  </div>
</template>

<script setup name="App">
import { reactive, provide, nextTick } from 'vue';
import { microApps } from '@/micro/app';
import actions from '@/micro/actions';

const state = reactive({
  isRouterAlive: true,
});

const gotoPage = (row) => {
  const data = {};
  switch (row.name) {
    case 'sub-vue':
      data.title = 'sub-vue';
      break;
    case 'sub-admin':
      data.title = 'sub-admin';
      break;
  }
  // 设置与子应用通信的值
  actions.setGlobalState({
    data: data,
  });
  window.history.pushState({}, row.name, row.activeRule);
};

const reload = () => {
  state.isRouterAlive = false;
  nextTick(() => {
    state.isRouterAlive = true;
  });
};

provide('reload', reload);
</script>
<style lang="scss">
@import './styles/style.scss';
</style>
