1、VUE

Former-commit-id: 205115f4a840698042784fb023a64d70e29ff135

src/main/resources/modules/SpringBoot/resources/static/css/base.css

@@ -632,30 +632,6 @@ code {
     box-shadow: 0 1px 6px rgba(0, 0, 0, .2);
 }
 
-.loading-bar {
-    width: 100%;
-    padding: 0!important;
-    top: 0!important;
-    box-shadow: 0px 0px 0px 0px;
-    border: 0px;
-}
-
-.loading-bar .el-message__content {
-    display: block;
-    width: 100%;
-    height: 2px;
-}
-
-.loading-bar .el-message__content .bar {
-    display: block;
-    height: 2px;
-    background-color: #2d8cf0;
-}
-
-.loading-bar .el-message__content .bar.error {
-    background-color: #ff1a0e;
-}
-
 /* 带有固定title布局,title保持固定*/
 .wb-layout-title-fix {
     width: 100%;

src/main/resources/modules/SpringBoot/resources/templates/control/nav.ftl

@@ -43,19 +43,18 @@
     }
     function jsonRequest(data) {
         nav.barShow();
-        nav.tipShow();
         return jsonService.request(data)
                 .then(function (response) {
-                    nav.tipClose();
-                    if (response.data.errors) {// 确保服务器正确返回Json
+                    if (response.data.errors && response.data.errors.length == 0) {
                         nav.barFinish();
+                    } else if(response.data.errors && response.data.errors.length > 0) {
+                        nav.barError();
                     } else {
                         response.data = {errors: [{message: '服务器响应错误'}]};
                         nav.barError();
                     }
                     return Promise.resolve(response.data);
                 }, function (error) {
-                    nav.tipClose();
                     nav.barError();
                     const rsp = {errors: []};
                     if (!error.response) {
@@ -449,38 +448,24 @@
                 }
             },
             barShow: function () {
-                if (!this.loadingBar) {
-                    this.loadingBar = this.$message({
-                        type: '',
-                        duration: 0,
-                        customClass: 'loading-bar',
-                        dangerouslyUseHTMLString: true,
-                        message: '<i class="bar" style="width: 90%"></i>'
-                    });
-                } else {
-                    this.loadingBar.message = '<i class="bar" style="width: 90%"></i>'
+                if (window.index) {
+                    window.index.barStart();
+                } else if (window.parent.index) {
+                    window.parent.index.barStart();
                 }
             },
             barFinish: function () {
-                if (this.loadingBar) {
-                    this.loadingBar.message = '<i class="bar" style="width: 100%"></i>'
-                    setTimeout(function () {
-                        if (this.loadingBar) {
-                            this.loadingBar.close();
-                            this.loadingBar = '';
-                        }
-                    }.bind(this), 500);
+                if (window.index) {
+                    window.index.barFinish();
+                } else if (window.parent.index) {
+                    window.parent.index.barFinish();
                 }
             },
             barError: function () {
-                if (this.loadingBar) {
-                    this.loadingBar.message = '<i class="bar error" style="width: 100%"></i>'
-                    setTimeout(function () {
-                        if (this.loadingBar) {
-                            this.loadingBar.close();
-                            this.loadingBar = '';
-                        }
-                    }.bind(this), 500);
+                if (window.index) {
+                    window.index.barError();
+                } else if (window.parent.index) {
+                    window.parent.index.barError();
                 }
             },
             i: function (message, callback) {

src/main/resources/modules/SpringBoot/resources/templates/screen/index.ftl

@@ -1,4 +1,13 @@
 <div id="index" v-cloak>
+    <div id="loadingBar" v-if="barPercent > 0">
+        <el-progress
+                :percentage="barPercent"
+                :stroke-width="2"
+                :show-text="false"
+                :status="barStatus"
+                stroke-linecap="round"></el-progress>
+    </div>
+
     <div id="aside" :style="{width:(prop.coll?'64px':'200px')}">
         <el-menu
                 @open="handleOpen"
@@ -134,6 +143,26 @@
         cursor: pointer;
     }
 
+    #loadingBar {
+        position: fixed;
+        z-index: 99;
+        top: 0;
+        left: 0;
+        right: 0;
+    }
+
+    #loadingBar div[role=progressbar] {
+        position: fixed;
+        top: 0;
+        left: 0;
+        right: 0;
+        z-index: 99;
+    }
+
+    #loadingBar div[role=progressbar] .el-progress-bar__outer{
+        background-color: transparent;
+    }
+
     #aside {
         overflow: hidden;
         height: 100%;
@@ -268,6 +297,9 @@
         data: {
             tabs: [],//所有Tabs
             activeTabName: '',
+            barStatus:null,
+            barPercent: 0,
+            barInterval: null,
             prop: {
                 open: ${r"<#if prop.open>true<#else>false</#if>"},
                 coll: ${r"<#if prop.coll>true<#else>false</#if>"},
@@ -283,6 +315,29 @@
                     url: '${r"${contextPath}"}/home.htm'
                 })
             },
+            barStart: function () {
+                clearInterval(this.barInterval);
+                this.barPercent = 10;
+                this.barInterval = setInterval(function () {
+                    this.barPercent = this.barPercent + (90 - this.barPercent) * 0.01;
+                }.bind(this), 100)
+            },
+            barFinish: function () {
+                clearInterval(this.barInterval);
+                this.barPercent = 100;
+                setTimeout(function () {
+                    this.barPercent = 0;
+                }.bind(this), 1000);
+            },
+            barError: function () {
+                clearInterval(this.barInterval);
+                this.barPercent = 100;
+                this.barStatus = 'exception'
+                setTimeout(function () {
+                    this.barPercent = 0;
+                    this.barStatus = null;
+                }.bind(this), 1000);
+            },
             collapseSwitch: function () {
                 this.prop.coll = !this.prop.coll;
             },

src/main/resources/modules/SpringBoot/resources/templates/screen/module/system/logErr.ftl

@@ -29,9 +29,9 @@
     <el-card class="box-card">
         <el-row>
             <el-col :span="12">
-                <el-button type="success" size="small" icon="el-icon-check">解决</el-button>
+                <el-button type="success" size="mini" icon="el-icon-check">解决</el-button>
 
-                <el-button type="warning" size="small" icon="el-icon-minus">搁置</el-button>
+                <el-button type="warning" size="mini" icon="el-icon-minus">搁置</el-button>
             </el-col>
 
             <el-col :span="12">