fix: 报告页面补充 loading 动画效果,自动刷新逻辑调整
This commit is contained in:
@@ -8,6 +8,7 @@
|
|||||||
width: 288px;
|
width: 288px;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
border-right: 1px solid #E7EAED;
|
border-right: 1px solid #E7EAED;
|
||||||
|
position: relative;
|
||||||
.cn-builtin-left-title {
|
.cn-builtin-left-title {
|
||||||
padding: 28px 0 26px 13px;
|
padding: 28px 0 26px 13px;
|
||||||
font-size: 16px;
|
font-size: 16px;
|
||||||
|
|||||||
@@ -6,6 +6,7 @@
|
|||||||
:height="height"
|
:height="height"
|
||||||
:expand-row-keys="expandedIds"
|
:expand-row-keys="expandedIds"
|
||||||
row-key="id"
|
row-key="id"
|
||||||
|
v-loading="toolsLoading"
|
||||||
border
|
border
|
||||||
tooltip-effect="light"
|
tooltip-effect="light"
|
||||||
@header-dragend="dragend"
|
@header-dragend="dragend"
|
||||||
@@ -107,6 +108,11 @@
|
|||||||
<span v-if="item.prop === 'timeLimit'">
|
<span v-if="item.prop === 'timeLimit'">
|
||||||
{{handleTimeRange(scope.row)}}
|
{{handleTimeRange(scope.row)}}
|
||||||
</span>
|
</span>
|
||||||
|
<span v-else-if="item.prop === 'categoryId'">
|
||||||
|
<span v-for="item in categoryList">
|
||||||
|
<span v-if="scope.row.categoryId === item.id">{{item.name}}</span>
|
||||||
|
</span>
|
||||||
|
</span>
|
||||||
<span v-else-if="item.prop === 'timePlan'">
|
<span v-else-if="item.prop === 'timePlan'">
|
||||||
<template v-if="scope.row.config.isScheduler === 0">
|
<template v-if="scope.row.config.isScheduler === 0">
|
||||||
{{$t('report.always')}}
|
{{$t('report.always')}}
|
||||||
@@ -217,6 +223,10 @@ export default {
|
|||||||
Loading,
|
Loading,
|
||||||
chartDetectionPagination
|
chartDetectionPagination
|
||||||
},
|
},
|
||||||
|
props: {
|
||||||
|
categoryList: Array,
|
||||||
|
toolsLoading: Boolean
|
||||||
|
},
|
||||||
inject: ['reload'],
|
inject: ['reload'],
|
||||||
data () {
|
data () {
|
||||||
return {
|
return {
|
||||||
@@ -227,7 +237,12 @@ export default {
|
|||||||
label: 'ID',
|
label: 'ID',
|
||||||
prop: 'id',
|
prop: 'id',
|
||||||
show: true,
|
show: true,
|
||||||
width: 40
|
width: 50
|
||||||
|
}, {
|
||||||
|
label: this.$t('report.categoryType'),
|
||||||
|
prop: 'categoryId',
|
||||||
|
show: true,
|
||||||
|
minWidth: 180
|
||||||
}, {
|
}, {
|
||||||
label: this.$t('config.user.name'),
|
label: this.$t('config.user.name'),
|
||||||
prop: 'name',
|
prop: 'name',
|
||||||
@@ -384,7 +399,7 @@ export default {
|
|||||||
})
|
})
|
||||||
}
|
}
|
||||||
this.loadingDown = false
|
this.loadingDown = false
|
||||||
const showInterval = this.downDataList.find(item => item.percent !== 1)
|
const showInterval = this.downDataList.find(item => item.percent !== 1 && item.state !== 2)
|
||||||
if (this.downDataList && showInterval) {
|
if (this.downDataList && showInterval) {
|
||||||
this.intervalChange(param)
|
this.intervalChange(param)
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,6 +1,7 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="cn-builtin">
|
<div class="cn-builtin">
|
||||||
<div class="cn-builtin-left">
|
<div class="cn-builtin-left">
|
||||||
|
<loading :loading="builtinLeftLoading"></loading>
|
||||||
<div class="cn-builtin-left-title">
|
<div class="cn-builtin-left-title">
|
||||||
{{$t('report.category')}}
|
{{$t('report.category')}}
|
||||||
</div>
|
</div>
|
||||||
@@ -34,9 +35,10 @@
|
|||||||
<template #default>
|
<template #default>
|
||||||
<builtin-report-table
|
<builtin-report-table
|
||||||
ref="dataTable"
|
ref="dataTable"
|
||||||
v-loading="tools.loading"
|
:tools-loading="tools.loading"
|
||||||
:api="url"
|
:api="url"
|
||||||
:custom-table-title="tools.customTableTitle"
|
:custom-table-title="tools.customTableTitle"
|
||||||
|
:category-list="builtinReportLeftMenu"
|
||||||
:height="mainTableHeight"
|
:height="mainTableHeight"
|
||||||
:table-data="tableData"
|
:table-data="tableData"
|
||||||
@delete="del"
|
@delete="del"
|
||||||
@@ -75,6 +77,7 @@ import cnDataList from '@/components/table/CnDataList'
|
|||||||
import dataListMixin from '@/mixins/data-list'
|
import dataListMixin from '@/mixins/data-list'
|
||||||
import { api } from '@/utils/api'
|
import { api } from '@/utils/api'
|
||||||
import ReportBox from '@/components/rightBox/report/ReportBox'
|
import ReportBox from '@/components/rightBox/report/ReportBox'
|
||||||
|
import Loading from '@/components/common/Loading'
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'Report',
|
name: 'Report',
|
||||||
@@ -141,17 +144,20 @@ export default {
|
|||||||
'report.november',
|
'report.november',
|
||||||
'report.december'
|
'report.december'
|
||||||
],
|
],
|
||||||
tableId: 'builtinReportTable'
|
tableId: 'builtinReportTable',
|
||||||
|
builtinLeftLoading: false
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
mixins: [dataListMixin],
|
mixins: [dataListMixin],
|
||||||
components: {
|
components: {
|
||||||
|
Loading,
|
||||||
cnDataList,
|
cnDataList,
|
||||||
builtinReportTable,
|
builtinReportTable,
|
||||||
ReportBox
|
ReportBox
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
queryGetTempData () {
|
queryGetTempData () {
|
||||||
|
this.builtinLeftLoading = true
|
||||||
get(api.reportCategory).then(res => {
|
get(api.reportCategory).then(res => {
|
||||||
if (res.code === 200) {
|
if (res.code === 200) {
|
||||||
this.builtinReportLeftMenu = res.data.list.map(c => {
|
this.builtinReportLeftMenu = res.data.list.map(c => {
|
||||||
@@ -161,6 +167,7 @@ export default {
|
|||||||
}
|
}
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
this.builtinLeftLoading = false
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
getTableData (params) {
|
getTableData (params) {
|
||||||
|
|||||||
Reference in New Issue
Block a user