From 29e05f7cb75bd381bf1e2bdaddfd88ef3b060c23 Mon Sep 17 00:00:00 2001
From: shaohaojiecoder <445923944@qq.com>
Date: Sun, 13 Dec 2020 16:42:17 +0800
Subject: [PATCH] delay render
---
cmdb-ui/src/components/Table/index.js | 12 ++++++++++++
cmdb-ui/src/views/cmdb/ci/index.vue | 7 +++++++
2 files changed, 19 insertions(+)
diff --git a/cmdb-ui/src/components/Table/index.js b/cmdb-ui/src/components/Table/index.js
index 06f9a2f..4b62563 100644
--- a/cmdb-ui/src/components/Table/index.js
+++ b/cmdb-ui/src/components/Table/index.js
@@ -20,6 +20,10 @@ export default {
type: [String, Function],
default: 'key'
},
+ loaded: {
+ type: Boolean,
+ default: true
+ },
data: {
type: Function,
required: true
@@ -265,6 +269,14 @@ export default {
},
render () {
+ if (!this.loaded) {
+ return (
+ <div style="width: 100%; height:160px; text-align: center; line-height:160px">
+ <a-spin tip="Loading...">
+ </a-spin>
+ </div>
+ )
+ }
const props = {}
const localKeys = Object.keys(this.$data)
const showAlert = (typeof this.alert === 'object' && this.alert !== null && this.alert.show) && typeof this.rowSelection.selectedRowKeys !== 'undefined' || this.alert
diff --git a/cmdb-ui/src/views/cmdb/ci/index.vue b/cmdb-ui/src/views/cmdb/ci/index.vue
index 8f45edb..4cd2109 100644
--- a/cmdb-ui/src/views/cmdb/ci/index.vue
+++ b/cmdb-ui/src/views/cmdb/ci/index.vue
@@ -51,6 +51,7 @@
ref="table"
size="middle"
rowKey="ci_id"
+ :loaded="tableLoaded"
:columns="columns"
:data="loadInstances"
:alert="options.alert"
@@ -172,6 +173,7 @@ export default {
data () {
return {
loading: false,
+ tableLoaded: false,
loadTip: '',
pageSizeOptions: ['10', '25', '50', '100'],
form: this.$form.createForm(this),
@@ -191,6 +193,7 @@ export default {
instanceList: [],
columns: [],
loadInstances: parameter => {
+ this.tableLoaded = false
const params = Object.assign(parameter, this.$refs.search.queryParam)
let q = `q=_type:${this.$router.currentRoute.meta.typeId}`
Object.keys(params).forEach(key => {
@@ -219,6 +222,10 @@ export default {
result.totalPage = Math.ceil(res.numfound / params.pageSize)
result.data = Object.assign([], res.result)
result.data.forEach((item, index) => (item.key = item.ci_id))
+ this.$nextTick(() => {
+ this.tableLoaded = true
+ })
+
if (res.numfound) {
setTimeout(() => {
this.setColumnWidth()