perf: 优化office加载提示

This commit is contained in:
kuaifan 2021-12-26 01:00:49 +08:00
parent 1fae364e7d
commit a486eefd81
3 changed files with 37 additions and 11 deletions

View File

@ -227,8 +227,8 @@
}
},
htmlOk() {
$A.loadScript('js/html2md.js', () => {
if (typeof toMarkdown !== 'function') {
$A.loadScript('js/html2md.js', (e) => {
if (e !== null || typeof toMarkdown !== 'function') {
$A.modalAlert("组件加载失败!");
return;
}

View File

@ -1,6 +1,7 @@
<template>
<div class="component-only-office">
<div :id="this.id" class="placeholder"></div>
<div class="office-loading"><Loading v-if="loadIng > 0"/></div>
</div>
</template>
@ -19,6 +20,17 @@
width: 100%;
height: 100%;
}
.office-loading {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
display: flex;
align-items: center;
justify-content: center;
z-index: 2;
}
}
</style>
<script>
@ -44,6 +56,8 @@ export default {
data() {
return {
loadIng: 0,
fileName: null,
fileType: null,
fileUrl: null,
@ -83,7 +97,13 @@ export default {
if (!url) {
return;
}
$A.loadScript(this.$store.state.method.apiUrl("../office/web-apps/apps/api/documents/api.js"), () => {
this.loadIng++;
$A.loadScript(this.$store.state.method.apiUrl("../office/web-apps/apps/api/documents/api.js"), (e) => {
this.loadIng--;
if (e !== null) {
$A.modalAlert("组件加载失败!");
return;
}
this.loadFile()
})
},

View File

@ -923,7 +923,7 @@
return;
}
if (this.__loadScript[url] === true) {
typeof callback === "function" && callback();
typeof callback === "function" && callback(null);
return;
}
let script = document.createElement("script");
@ -933,13 +933,16 @@
if (script.readyState === "loaded" || script.readyState === "complete") {
script.onreadystatechange = null;
this.__loadScript[url] = true;
typeof callback === "function" && callback();
typeof callback === "function" && callback(null);
}
};
} else {
script.onload = () => {
this.__loadScript[url] = true;
typeof callback === "function" && callback();
typeof callback === "function" && callback(null);
};
script.onerror = (e) => {
typeof callback === "function" && callback(e);
};
}
if (this.rightExists(url, '.js')) {
@ -955,7 +958,7 @@
if (++i < urls.length) {
this.loadScript(urls[i], recursiveCallback)
} else {
typeof callback === "function" && callback();
typeof callback === "function" && callback(null);
}
}
this.loadScript(urls[0], recursiveCallback);
@ -974,7 +977,7 @@
return;
}
if (this.__loadCss[url] === true) {
typeof callback === "function" && callback();
typeof callback === "function" && callback(null);
return;
}
let script = document.createElement('link');
@ -983,16 +986,19 @@
if (script.readyState == 'loaded' || script.readyState == 'complete') {
script.onreadystatechange = null;
this.__loadCss[url] = true;
typeof callback === "function" && callback();
typeof callback === "function" && callback(null);
}
};
} else {
script.onload = () => {
this.__loadCss[url] = true;
typeof callback === "function" && callback();
typeof callback === "function" && callback(null);
};
script.onerror = (e) => {
typeof callback === "function" && callback(e);
};
}
script.rel = 'stylesheet';
if (this.rightExists(url, '.css')) {
@ -1008,7 +1014,7 @@
if (++i < urls.length) {
this.loadCss(urls[i], recursiveCallback)
} else {
typeof callback === "function" && callback();
typeof callback === "function" && callback(null);
}
}
this.loadCss(urls[0], recursiveCallback);