'admin-21.05.16:优化iframe、更新最新依赖、规范工具类命名'

package.json

@@ -28,12 +28,12 @@
 		"vue-router": "^4.0.2",
 		"vue-web-screen-shot": "^1.1.9",
 		"vuex": "^4.0.0-rc.2",
-		"wangeditor": "^4.6.17"
+		"wangeditor": "^4.7.0"
 	},
 	"devDependencies": {
 		"@types/axios": "^0.14.0",
 		"@types/clipboard": "^2.0.1",
-		"@types/node": "^15.0.3",
+		"@types/node": "^15.3.0",
 		"@types/nprogress": "^0.2.0",
 		"@types/sortablejs": "^1.10.6",
 		"@typescript-eslint/eslint-plugin": "^4.23.0",
@@ -45,7 +45,7 @@
 		"eslint-plugin-vue": "^7.9.0",
 		"prettier": "^2.3.0",
 		"sass": "^1.32.13",
-		"sass-loader": "^11.1.0",
+		"sass-loader": "^11.1.1",
 		"typescript": "^4.2.4",
 		"vite": "^2.3.2",
 		"vue-eslint-parser": "^7.6.0"

src/utils/customDirective.ts

@@ -5,7 +5,7 @@ export function wavesDirective(app: App) {
 	app.directive('waves', {
 		mounted(el, binding) {
 			el.classList.add('waves-effect');
-			binding.value && el.classList.add('waves-' + binding.value);
+			binding.value && el.classList.add(`waves-${binding.value}`);
 			function setConvertStyle(obj: any) {
 				let style: string = '';
 				for (let i in obj) {

src/utils/getStyleSheets.ts

@@ -28,7 +28,7 @@ const getAlicdnIconfont = () => {
 };
 
 // 初始化获取 css 样式，获取 element plus 自带图标
-const elementPlusIconfont = () => {
+const getElementPlusIconfont = () => {
 	return new Promise((resolve, reject) => {
 		nextTick(() => {
 			const styles: any = document.styleSheets;
@@ -49,7 +49,7 @@ const elementPlusIconfont = () => {
 };
 
 // 初始化获取 css 样式，这里使用 fontawesome 的图标
-const awesomeIconfont = () => {
+const getAwesomeIconfont = () => {
 	return new Promise((resolve, reject) => {
 		nextTick(() => {
 			const styles: any = document.styleSheets;
@@ -81,14 +81,17 @@ const awesomeIconfont = () => {
 
 // 定义导出方法集合
 const initIconfont = {
+	// iconfont
 	ali: () => {
 		return getAlicdnIconfont();
 	},
+	// element plus
 	ele: () => {
-		return elementPlusIconfont();
+		return getElementPlusIconfont();
 	},
+	// fontawesome
 	awe: () => {
-		return awesomeIconfont();
+		return getAwesomeIconfont();
 	},
 };
 

src/utils/request.ts

@@ -59,4 +59,5 @@ service.interceptors.response.use(
 	}
 );
 
+// 导出 axios 实例
 export default service;

src/utils/wartermark.ts

@@ -19,13 +19,14 @@ const setWatermark = (str: any) => {
 	div.style.left = '0px';
 	div.style.position = 'fixed';
 	div.style.zIndex = '10000000';
-	div.style.width = document.documentElement.clientWidth + 'px';
-	div.style.height = document.documentElement.clientHeight + 'px';
+	div.style.width = `${document.documentElement.clientWidth}px`;
+	div.style.height = `${document.documentElement.clientHeight}px`;
 	div.style.background = `url(${can.toDataURL('image/png')}) left top repeat`;
 	document.body.appendChild(div);
 	return id;
 };
 
+// 定义导出方法集合
 const watermark = {
 	// 设置水印
 	set: (str: any) => {
@@ -39,4 +40,5 @@ const watermark = {
 	},
 };
 
+// 导出方法
 export default watermark;

src/views/layout/routerView/iframes.vue

@@ -1,7 +1,7 @@
 <template>
 	<div class="layout-scrollbar">
 		<div class="layout-view-bg-white flex h100" v-loading="iframeLoading">
-			<iframe :src="iframeUrl" frameborder="0" height="100%" width="100%" id="iframe"></iframe>
+			<iframe :src="iframeUrl" frameborder="0" height="100%" width="100%" id="iframe" v-show="!iframeLoading"></iframe>
 		</div>
 	</div>
 </template>