fix: 修复no-data提示问题

This commit is contained in:
chenjinsong
2021-11-11 23:07:01 +08:00
parent cd805b0644
commit 98846fd2da
2 changed files with 36 additions and 2 deletions

View File

@@ -70,3 +70,15 @@ g [aria-labelledby$=-title] {
opacity: 0.1;
transform: translateX(calc(100% - 52px)) scale(.7);
}
.no-data {
display: flex;
justify-content: center;
align-items: center;
height: 100%;
width: 100%;
color: #999;
}
.no-data-hide {
display: none;
}

View File

@@ -346,11 +346,33 @@ export const clickOutside = {
delete el.__vueClickOutside__
}
}
const noDataDom = document.createElement('div')
noDataDom.setAttribute('class', 'no-data')
noDataDom.innerText = 'No data'
export const noData = {
updated (el, binding) {
if (el) {
if (el && binding.oldValue !== binding.value) {
if (binding.value) {
el.innerHTML = '<div style="display: flex; justify-content: center; align-items: center; height: 100%; width: 100%; color: #999;">No data</div>'
setTimeout(() => {
el.childNodes.forEach(node => {
node.style.display = 'none'
})
el.insertBefore(noDataDom, el.childNodes[0])
})
} else {
setTimeout(() => {
for (let i = 0; i < el.childNodes.length; i++) {
const node = el.childNodes[i]
if (node.innerText === 'No data') {
el.removeChild(node)
break
}
}
el.childNodes.forEach(node => {
node.style.display = ''
})
})
}
}
}