feat:添加自定义 loading指令

This commit is contained in:
zhangyu
2022-03-23 16:04:14 +08:00
parent 5ab9c33ddd
commit d01abf6abe
4 changed files with 21 additions and 4 deletions

View File

@@ -374,6 +374,9 @@ td .nz-icon-gear:before{
color: $--color-text-regular !important;
box-shadow: none !important;
}
.loading-hide {
display: none;
}
input, textarea {
font-family: Inter-Regular !important;
}

View File

@@ -1,5 +1,10 @@
// https://github.com/loadingio/css-spinner/tree/master/dist 从当前链接现在在 在tools.js 的myLoading 进行判断处理
// 高度 宽度 等细节 记得处理
loading-hide{
display: none;
}
// 1
.lds-dual-ring,
.lds-dual-ring:after {

View File

@@ -117,6 +117,8 @@ function myLoadingFunction (el, binding, vnode) {
return
}
// 若果是true创建一个div
const divBox = document.createElement('div')
divBox.setAttribute('class', 'el-loading-mask')
const div = document.createElement('div')
div.style.textAlign = 'center'
if (binding.modifiers.scaleMin) {
@@ -138,12 +140,13 @@ function myLoadingFunction (el, binding, vnode) {
newDiv1.setAttribute('class', 'el-loading-spinner')
div.appendChild(newDiv1)
}
divBox.appendChild(div)
// 插入到被绑定的元素内部
el.appendChild(div)
el.appendChild(divBox)
// div内部加入内容
// div.innerHTML = '加载中...'
// el 元素设置相对定位 div设置绝对定位
el.setAttribute('class', 'elrelative')
el.setAttribute('class', 'el-loading-parent--relative')
// 设置绝对定位
div.setAttribute('class', className)
} else {

View File

@@ -3,7 +3,7 @@
<left-menu @refresh="refresh"></left-menu>
<div ref="body" class="body">
<Header></Header>
<container v-if="containerShow" ref="container"></container>
<container v-if="containerShow" ref="container" v-my-loading:ldsFacebook="myLoading"></container>
</div>
<!--web-ssh-->
<web-ssh ref="webSsh"></web-ssh>
@@ -35,7 +35,8 @@ export default {
},
data () {
return {
containerShow: true
containerShow: true,
myLoading: true
}
},
methods: {
@@ -43,6 +44,11 @@ export default {
this.$store.commit('setIsRouteLive')
}
},
mounted () {
// setInterval(() => {
// this.myLoading = !this.myLoading
// }, 1000)
},
destroyed () {
localStorage.removeItem('moduleProjectId')
localStorage.removeItem('endpointProjectId')