@{
    Layout = "~/Views/Shared/_MainLayout.cshtml";
}
@section CSS {
<style type="text/css">
   .subapp-loading {
      height: 480px;
      line-height: 480px;
      text-align:center;
    }

    .subapp-loading .spinner-border {
       width: 3rem;
       height: 3rem;
    }

   .subapp-loading .spinner-text {
      display: inline-block;
      position: relative;
      margin-left: 1rem;
      top: -7px;
      color: #6c757d;
   }
</style>
}
<div id="subapp-container"></div>
@section js
{
    <script type="text/javascript">
        var pageObj={
            UserEncryptId: "@ViewBag.userId"
        }
        // 注册微应用
        if (window.qiankun) {
            var menuTags = $(".accordion-menu a");
            var currentUrl = window.location.pathname + window.location.search + window.location.hash;
            menuTags.each((index,item)=>{
                var menuPath = item.pathname;
                var menuText = item.text;
                if (currentUrl == menuPath) {
                   
                    $(item).parent().addClass("active");
                    var menuParent = $(item).parent().parent().parent().find(".menu-text");
                    $(".breadcrumb-item").text(menuParent[0].outerText + "-" + menuText);
                    $(menuParent).addClass("active-page open");
                    $('title').text(menuText);
                    return;
                }
            })
            var vueApp = new Vue({
                template: '<div id="subapp-container"><h4 v-if="loading" class="subapp-loading"><div class="spinner-border text-secondary" role="status" aria-hidden="true"></div><span class="spinner-text">Loading...</span></h4><div id="subapp-viewport" style="padding:0 16px"></div></div>',
                el: '#subapp-container',
                data: function () {
                    return { loading: true }
                }
            })
            var vueLoader = function (loading) {
                vueApp.loading = loading
            }
            window.qiankun.registerMicroApps([{
                name: 'vue3',
                entry: '//' + window.location.host + '/otcdms-ui/',
                container: '#subapp-viewport',
                loader: vueLoader,
                activeRule: '/v3',
            }]);
            var actions = window.qiankun.initGlobalState({logout:false,retrieveTradeDetail: false, quotaTrial: false, retrieveExchangeTrade: false, retrieveSwapDetail:false});
            actions.onGlobalStateChange(function(state) {
                if (state.logout) {
                    $('#logoutBtn').trigger('click')
                }
                if (state.retrieveTradeDetail) {
                    main.open("查看交易", "/trade/tradeView/?enid={0}".template(state.retrieveTradeDetail));
                }
                if (state.retrieveSwapDetail) {
                    main.open("查看交易", "/swapTrade2/TradeView/?enid={0}&checkBtn=1".template(state.retrieveSwapDetail));
                }
                if (state.quotaTrial) {
                    main.open("提示", "/trade/quotaTrial?id=" + state.quotaTrial, { area: ['800px', '400px'] });
                }
                if (state.retrieveExchangeTrade) {
                    main.open("查看交易", "/ExchangeTrade/tradeView/?enid=" + state.retrieveExchangeTrade, { area: ["1200px", "650px"] });
                }
            });
            window.qiankun.start();
        }
  </script>
}