CN-1089 统一各列表页的loading、nodata交互
This commit is contained in:
@@ -28,10 +28,11 @@
|
||||
</button>
|
||||
</template>
|
||||
<template #default>
|
||||
<loading :loading="loading"></loading>
|
||||
<chart-table
|
||||
ref="dataTable"
|
||||
v-loading="tools.loading"
|
||||
:api="url"
|
||||
:isNoData="isNoData"
|
||||
:custom-table-title="tools.customTableTitle"
|
||||
:height="mainTableHeight"
|
||||
:table-data="tableData"
|
||||
|
||||
@@ -49,10 +49,11 @@
|
||||
</top-tool-more-options>
|
||||
</template>
|
||||
<template v-slot:default>
|
||||
<loading :loading="loading"></loading>
|
||||
<galaxy-proxy-table
|
||||
ref="dataTable"
|
||||
v-loading="tools.loading"
|
||||
:api="url"
|
||||
:isNoData="isNoData"
|
||||
:custom-table-title="tools.customTableTitle"
|
||||
:height="mainTableHeight"
|
||||
:table-data="tableData"
|
||||
|
||||
@@ -28,10 +28,11 @@
|
||||
</button>
|
||||
</template>
|
||||
<template #default>
|
||||
<loading :loading="loading"></loading>
|
||||
<i18n-table
|
||||
ref="dataTable"
|
||||
v-loading="tools.loading"
|
||||
:api="url"
|
||||
:isNoData="isNoData"
|
||||
:custom-table-title="tools.customTableTitle"
|
||||
:height="mainTableHeight"
|
||||
:table-data="tableData"
|
||||
|
||||
@@ -9,10 +9,11 @@
|
||||
:from="fromRoute.operationLog"
|
||||
@search="search">
|
||||
<template v-slot:default>
|
||||
<loading :loading="loading"></loading>
|
||||
<operation-log-table
|
||||
ref="dataTable"
|
||||
v-loading="tools.loading"
|
||||
:api="url"
|
||||
:isNoData="isNoData"
|
||||
:custom-table-title="tools.customTableTitle"
|
||||
:height="mainTableHeight"
|
||||
:table-data="tableData"
|
||||
|
||||
@@ -29,10 +29,11 @@
|
||||
<delete-button id="role-list-batch-delete" :api="url" :delete-objs="batchDeleteObjs" @after="getTableData" @before="delFlag=true"></delete-button>
|
||||
</template>
|
||||
<template v-slot:default>
|
||||
<loading :loading="loading"></loading>
|
||||
<roles-table
|
||||
ref="dataTable"
|
||||
v-loading="tools.loading"
|
||||
:api="url"
|
||||
:isNoData="isNoData"
|
||||
:custom-table-title="tools.customTableTitle"
|
||||
:height="mainTableHeight"
|
||||
:table-data="tableData"
|
||||
|
||||
@@ -27,10 +27,11 @@
|
||||
</button>
|
||||
</template>
|
||||
<template #default>
|
||||
<loading :loading="loading"></loading>
|
||||
<user-table
|
||||
ref="dataTable"
|
||||
v-loading="tools.loading"
|
||||
:api="url"
|
||||
:isNoData="isNoData"
|
||||
:custom-table-title="tools.customTableTitle"
|
||||
:height="mainTableHeight"
|
||||
:table-data="tableData"
|
||||
@@ -102,14 +103,15 @@ export default {
|
||||
this.searchLabel = { ...this.searchLabel, ...params }
|
||||
}
|
||||
this.searchLabel = { ...this.searchLabel, ...this.pageObj }
|
||||
this.tools.loading = true
|
||||
this.isNoData = false
|
||||
this.tableData = []
|
||||
this.toggleLoading(true)
|
||||
delete this.searchLabel.total
|
||||
let listUrl = this.url
|
||||
if (this.listUrl) {
|
||||
listUrl = this.listUrl
|
||||
}
|
||||
get(listUrl, this.searchLabel).then(response => {
|
||||
this.tools.loading = false
|
||||
if (response.code === 200) {
|
||||
for (let i = 0; i < response.data.list.length; i++) {
|
||||
response.data.list[i].status = response.data.list[i].status + ''
|
||||
@@ -118,14 +120,25 @@ export default {
|
||||
this.pageObj.total = response.data.total
|
||||
} else {
|
||||
console.error(response)
|
||||
this.isNoData = true
|
||||
if (response.message) {
|
||||
this.$message.error(response.message)
|
||||
} else {
|
||||
this.$message.error('Something went wrong...')
|
||||
}
|
||||
}
|
||||
}).finally(() => {
|
||||
this.toggleLoading(false)
|
||||
if (!this.tableData || this.tableData.length === 0) {
|
||||
this.isNoData = true
|
||||
} else {
|
||||
this.isNoData = false
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
unmounted () {
|
||||
this.isNoData = false
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -40,10 +40,11 @@
|
||||
</button>
|
||||
</template>
|
||||
<template #default>
|
||||
<loading :loading="builtinRightLoading"></loading>
|
||||
<loading :loading="loading"></loading>
|
||||
<report-table
|
||||
ref="dataTable"
|
||||
:api="url"
|
||||
:isNoData="isNoData"
|
||||
:custom-table-title="tools.customTableTitle"
|
||||
:category-list="builtinReportLeftMenu"
|
||||
:height="mainTableHeight"
|
||||
@@ -157,7 +158,7 @@ export default {
|
||||
],
|
||||
tableId: 'reportTable',
|
||||
builtinLeftLoading: false,
|
||||
builtinRightLoading: false,
|
||||
// builtinRightLoading: false,
|
||||
isInit: true
|
||||
}
|
||||
},
|
||||
@@ -246,7 +247,11 @@ export default {
|
||||
}
|
||||
this.searchLabel = { ...this.searchLabel, ...this.pageObj }
|
||||
// this.tools.loading = true
|
||||
this.builtinRightLoading = true
|
||||
// this.builtinRightLoading = true
|
||||
// this.loading = true
|
||||
this.isNoData = false
|
||||
this.tableData = []
|
||||
this.toggleLoading(true)
|
||||
delete this.searchLabel.total
|
||||
let listUrl = this.url
|
||||
if (this.listUrl) {
|
||||
@@ -260,13 +265,13 @@ export default {
|
||||
if (!this.isInit) {
|
||||
get(listUrl, this.searchLabel).then(response => {
|
||||
// this.tools.loading = false
|
||||
this.builtinRightLoading = false
|
||||
// this.builtinRightLoading = false
|
||||
// this.loading = false
|
||||
if (response.code === 200) {
|
||||
for (let i = 0; i < response.data.list.length; i++) {
|
||||
response.data.list[i].status = response.data.list[i].status + ''
|
||||
}
|
||||
this.$nextTick(() => {
|
||||
this.tableData = []
|
||||
this.tableData = response.data.list.map(item => {
|
||||
return {
|
||||
...item,
|
||||
@@ -274,9 +279,18 @@ export default {
|
||||
}
|
||||
})
|
||||
this.pageObj.total = response.data.total
|
||||
if (!this.tableData || this.tableData.length === 0) {
|
||||
this.isNoData = true
|
||||
} else {
|
||||
this.isNoData = false
|
||||
}
|
||||
})
|
||||
// TODO 回到顶部
|
||||
} else {
|
||||
this.isNoData = true
|
||||
}
|
||||
}).finally(() => {
|
||||
this.toggleLoading(false)
|
||||
})
|
||||
}
|
||||
this.isInit = false
|
||||
@@ -349,6 +363,9 @@ export default {
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
unmounted () {
|
||||
this.isNoData = false
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -53,12 +53,13 @@
|
||||
</div>
|
||||
<!-- 列表式 -->
|
||||
<template v-if="listMode === 'list'">
|
||||
<div class="list-mode__row" >
|
||||
<div class="list-mode__row" style="position:relative;">
|
||||
<loading :loading="loading"></loading>
|
||||
<knowledge-base-table-for-row
|
||||
ref="dataTable"
|
||||
v-loading="tools.loading"
|
||||
height="100%"
|
||||
:api="url"
|
||||
:isNoData="isNoData"
|
||||
:custom-table-title="tools.customTableTitle"
|
||||
:table-data="tableData"
|
||||
:is-selected-status="isSelectedStatus"
|
||||
@@ -68,16 +69,18 @@
|
||||
@edit="edit"
|
||||
@orderBy="tableDataSort"
|
||||
@reload="reloadRowList"
|
||||
@toggleLoading="toggleLoading"
|
||||
></knowledge-base-table-for-row>
|
||||
</div>
|
||||
</template>
|
||||
<!-- 卡片式 -->
|
||||
<template v-else-if="listMode === 'block'">
|
||||
<div class="list-mode__card" >
|
||||
<div class="list-mode__card" style="position:relative;">
|
||||
<loading :loading="loading"></loading>
|
||||
<knowledge-base-table-for-card
|
||||
ref="dataTableCard"
|
||||
v-loading="tools.loading"
|
||||
:api="url"
|
||||
:isNoData="isNoData"
|
||||
:custom-table-title="tools.customTableTitle"
|
||||
:table-data="tableData"
|
||||
:is-selected-status="isSelectedStatus"
|
||||
@@ -85,10 +88,10 @@
|
||||
@delete="toDelete"
|
||||
@checkboxStatusChange="checkboxStatusChange"
|
||||
@reload="reloadRowList"
|
||||
@toggleLoading="toggleLoading"
|
||||
></knowledge-base-table-for-card>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<div class="knowledge-pagination" style="">
|
||||
<pagination ref="pagination" :page-obj="pageObj" :table-id="tableId" @pageNo='pageNo' @pageSize='pageSize'></pagination>
|
||||
</div>
|
||||
@@ -132,7 +135,6 @@
|
||||
</el-dialog>
|
||||
</template>
|
||||
<script>
|
||||
import cnDataList from '@/components/table/CnDataList'
|
||||
import dataListMixin from '@/mixins/data-list'
|
||||
import KnowledgeBaseTableForCard from '@/components/table/setting/knowledgeBaseTableForCard'
|
||||
import KnowledgeBaseTableForRow from '@/components/table/setting/KnowledgeBaseTableForRow'
|
||||
@@ -145,7 +147,6 @@ import KnowledgeFilter from '@/views/setting/KnowledgeFilter'
|
||||
export default {
|
||||
name: 'knowledgeBase',
|
||||
components: {
|
||||
cnDataList,
|
||||
KnowledgeBaseTableForCard,
|
||||
KnowledgeBaseTableForRow,
|
||||
KnowledgeFilter
|
||||
@@ -171,13 +172,13 @@ export default {
|
||||
},
|
||||
methods: {
|
||||
onSearch () {
|
||||
let params = {
|
||||
const params = {
|
||||
...this.filterParams,
|
||||
name: this.keyWord
|
||||
}
|
||||
this.clearList()
|
||||
this.search(params)
|
||||
this.$refs.knowledgeFilter.reloadFilter(this.checkedCategoryIds,this.checkedStatusIds)
|
||||
this.$refs.knowledgeFilter.reloadFilter(this.checkedCategoryIds, this.checkedStatusIds)
|
||||
},
|
||||
reloadRowList () {
|
||||
this.getTableData()
|
||||
@@ -262,7 +263,7 @@ export default {
|
||||
type: 'warning'
|
||||
}).catch(() => {})
|
||||
} else {
|
||||
this.tools.loading = true
|
||||
this.toggleLoading(true)
|
||||
axios.delete(this.url + '?knowledgeIds=' + ids).then(response => {
|
||||
if (response.data.code === 200) {
|
||||
this.delFlag = true
|
||||
@@ -280,7 +281,7 @@ export default {
|
||||
this.$message.error(response.data.message)
|
||||
}
|
||||
}).finally(() => {
|
||||
this.tools.loading = false
|
||||
this.toggleLoading(false)
|
||||
if (this.isSelectedStatus != undefined) {
|
||||
this.isSelectedStatus = false
|
||||
this.disableDelete = true
|
||||
@@ -318,7 +319,7 @@ export default {
|
||||
}
|
||||
})
|
||||
},
|
||||
reload (params, isAll, isClearType,checkedCategoryIds,checkedStatusIds) {
|
||||
reload (params, isAll, isClearType, checkedCategoryIds, checkedStatusIds) {
|
||||
this.disableDelete = true
|
||||
this.isSelectedStatus = false
|
||||
this.batchDeleteObjs = []
|
||||
@@ -385,7 +386,7 @@ export default {
|
||||
cancelButtonText: this.$t('tip.no'),
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
this.tools.loading = true
|
||||
this.toggleLoading(true)
|
||||
axios.delete(this.url + '?knowledgeIds=' + row.id).then(response => {
|
||||
if (response.data.code === 200) {
|
||||
this.delFlag = true
|
||||
@@ -404,7 +405,7 @@ export default {
|
||||
this.$message.error('Something went wrong...')
|
||||
}
|
||||
}).finally(() => {
|
||||
this.tools.loading = false
|
||||
this.toggleLoading(false)
|
||||
})
|
||||
}).catch(() => {})
|
||||
},
|
||||
|
||||
@@ -633,8 +633,8 @@ export default {
|
||||
this.typeSelectDisable = true
|
||||
this.isClick = false
|
||||
},
|
||||
backEditData(){
|
||||
if(this.oldTagItem.isValid){
|
||||
backEditData () {
|
||||
if (this.oldTagItem.isValid) {
|
||||
this.showImportedData[this.oldTagItem.index].isValid = this.oldTagItem.isValid
|
||||
this.showImportedData[this.oldTagItem.index].msg = this.oldTagItem.msg
|
||||
}
|
||||
@@ -886,7 +886,7 @@ export default {
|
||||
msg: this.showImportedData[index].msg,
|
||||
tagName: this.showImportedData[index].tagName,
|
||||
tagValue: this.showImportedData[index].tagValue,
|
||||
index:index
|
||||
index: index
|
||||
}
|
||||
this.editIndex = index
|
||||
this.backEditFlag = true
|
||||
|
||||
@@ -196,7 +196,7 @@ export default {
|
||||
}
|
||||
}
|
||||
this.filterParams = params
|
||||
this.$emit('reload', params, true,false,this.defaultCheckedCategory,this.defaultCheckedStatus)
|
||||
this.$emit('reload', params, true, false, this.defaultCheckedCategory, this.defaultCheckedStatus)
|
||||
}
|
||||
},
|
||||
getAllTableData (params) {
|
||||
@@ -254,7 +254,7 @@ export default {
|
||||
category.children.push(source)
|
||||
})
|
||||
})
|
||||
if(this.defaultCheckedCategory.length === 0){
|
||||
if (this.defaultCheckedCategory.length === 0) {
|
||||
this.defaultCheckedCategory = categoryIds
|
||||
}
|
||||
},
|
||||
@@ -273,15 +273,15 @@ export default {
|
||||
})
|
||||
statusIds.push(index)
|
||||
})
|
||||
if(this.defaultCheckedStatus.length === 0){
|
||||
if (this.defaultCheckedStatus.length === 0) {
|
||||
this.defaultCheckedStatus = statusIds
|
||||
}
|
||||
},
|
||||
reloadFilter (checkedCategoryIds ,checkedStatusIds) {
|
||||
if(checkedCategoryIds && checkedCategoryIds.length > 0){
|
||||
reloadFilter (checkedCategoryIds, checkedStatusIds) {
|
||||
if (checkedCategoryIds && checkedCategoryIds.length > 0) {
|
||||
this.defaultCheckedCategory = checkedCategoryIds
|
||||
}
|
||||
if(checkedStatusIds && checkedStatusIds.length > 0){
|
||||
if (checkedStatusIds && checkedStatusIds.length > 0) {
|
||||
this.defaultCheckedStatus = checkedStatusIds
|
||||
}
|
||||
this.getAllTableData()
|
||||
|
||||
Reference in New Issue
Block a user