perf: 优化office加载提示
This commit is contained in:
parent
1fae364e7d
commit
a486eefd81
@ -227,8 +227,8 @@
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
htmlOk() {
|
htmlOk() {
|
||||||
$A.loadScript('js/html2md.js', () => {
|
$A.loadScript('js/html2md.js', (e) => {
|
||||||
if (typeof toMarkdown !== 'function') {
|
if (e !== null || typeof toMarkdown !== 'function') {
|
||||||
$A.modalAlert("组件加载失败!");
|
$A.modalAlert("组件加载失败!");
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
@ -1,6 +1,7 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="component-only-office">
|
<div class="component-only-office">
|
||||||
<div :id="this.id" class="placeholder"></div>
|
<div :id="this.id" class="placeholder"></div>
|
||||||
|
<div class="office-loading"><Loading v-if="loadIng > 0"/></div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
@ -19,6 +20,17 @@
|
|||||||
width: 100%;
|
width: 100%;
|
||||||
height: 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>
|
</style>
|
||||||
<script>
|
<script>
|
||||||
@ -44,6 +56,8 @@ export default {
|
|||||||
|
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
|
loadIng: 0,
|
||||||
|
|
||||||
fileName: null,
|
fileName: null,
|
||||||
fileType: null,
|
fileType: null,
|
||||||
fileUrl: null,
|
fileUrl: null,
|
||||||
@ -83,7 +97,13 @@ export default {
|
|||||||
if (!url) {
|
if (!url) {
|
||||||
return;
|
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()
|
this.loadFile()
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
|
22
resources/assets/js/functions/common.js
vendored
22
resources/assets/js/functions/common.js
vendored
@ -923,7 +923,7 @@
|
|||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
if (this.__loadScript[url] === true) {
|
if (this.__loadScript[url] === true) {
|
||||||
typeof callback === "function" && callback();
|
typeof callback === "function" && callback(null);
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
let script = document.createElement("script");
|
let script = document.createElement("script");
|
||||||
@ -933,13 +933,16 @@
|
|||||||
if (script.readyState === "loaded" || script.readyState === "complete") {
|
if (script.readyState === "loaded" || script.readyState === "complete") {
|
||||||
script.onreadystatechange = null;
|
script.onreadystatechange = null;
|
||||||
this.__loadScript[url] = true;
|
this.__loadScript[url] = true;
|
||||||
typeof callback === "function" && callback();
|
typeof callback === "function" && callback(null);
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
} else {
|
} else {
|
||||||
script.onload = () => {
|
script.onload = () => {
|
||||||
this.__loadScript[url] = true;
|
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')) {
|
if (this.rightExists(url, '.js')) {
|
||||||
@ -955,7 +958,7 @@
|
|||||||
if (++i < urls.length) {
|
if (++i < urls.length) {
|
||||||
this.loadScript(urls[i], recursiveCallback)
|
this.loadScript(urls[i], recursiveCallback)
|
||||||
} else {
|
} else {
|
||||||
typeof callback === "function" && callback();
|
typeof callback === "function" && callback(null);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
this.loadScript(urls[0], recursiveCallback);
|
this.loadScript(urls[0], recursiveCallback);
|
||||||
@ -974,7 +977,7 @@
|
|||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
if (this.__loadCss[url] === true) {
|
if (this.__loadCss[url] === true) {
|
||||||
typeof callback === "function" && callback();
|
typeof callback === "function" && callback(null);
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
let script = document.createElement('link');
|
let script = document.createElement('link');
|
||||||
@ -983,16 +986,19 @@
|
|||||||
if (script.readyState == 'loaded' || script.readyState == 'complete') {
|
if (script.readyState == 'loaded' || script.readyState == 'complete') {
|
||||||
script.onreadystatechange = null;
|
script.onreadystatechange = null;
|
||||||
this.__loadCss[url] = true;
|
this.__loadCss[url] = true;
|
||||||
typeof callback === "function" && callback();
|
typeof callback === "function" && callback(null);
|
||||||
|
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
} else {
|
} else {
|
||||||
script.onload = () => {
|
script.onload = () => {
|
||||||
this.__loadCss[url] = true;
|
this.__loadCss[url] = true;
|
||||||
typeof callback === "function" && callback();
|
typeof callback === "function" && callback(null);
|
||||||
|
|
||||||
};
|
};
|
||||||
|
script.onerror = (e) => {
|
||||||
|
typeof callback === "function" && callback(e);
|
||||||
|
};
|
||||||
}
|
}
|
||||||
script.rel = 'stylesheet';
|
script.rel = 'stylesheet';
|
||||||
if (this.rightExists(url, '.css')) {
|
if (this.rightExists(url, '.css')) {
|
||||||
@ -1008,7 +1014,7 @@
|
|||||||
if (++i < urls.length) {
|
if (++i < urls.length) {
|
||||||
this.loadCss(urls[i], recursiveCallback)
|
this.loadCss(urls[i], recursiveCallback)
|
||||||
} else {
|
} else {
|
||||||
typeof callback === "function" && callback();
|
typeof callback === "function" && callback(null);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
this.loadCss(urls[0], recursiveCallback);
|
this.loadCss(urls[0], recursiveCallback);
|
||||||
|
Loading…
x
Reference in New Issue
Block a user