fix:修复report页点击tab栏,地址栏和分页刷新的问题
This commit is contained in:
@@ -1,6 +1,6 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="pagination">
|
<div class="pagination">
|
||||||
<el-pagination
|
<el-pagination
|
||||||
ref="page"
|
ref="page"
|
||||||
@size-change="size"
|
@size-change="size"
|
||||||
@prev-click="prev"
|
@prev-click="prev"
|
||||||
@@ -11,12 +11,14 @@
|
|||||||
:page-size="Number(pageObj.pageSize)"
|
:page-size="Number(pageObj.pageSize)"
|
||||||
:layout="layout"
|
:layout="layout"
|
||||||
:total="pageObj.total"
|
:total="pageObj.total"
|
||||||
>
|
>
|
||||||
<el-select v-model="pageSize" :placeholder="pageSize+$t('pageSize')" size="mini" :popper-append-to-body="appendToBody" class="pagination-size-select" @change="size" :popper-class="popClass" @visible-change="popperVisible">
|
<el-select v-model="pageSize" :placeholder="pageSize+$t('pageSize')" size="mini"
|
||||||
<el-option v-for="(item, index) in pageSizes" :key="index" :label="item.label" :value="item.value"></el-option>
|
:popper-append-to-body="appendToBody" class="pagination-size-select" @change="size"
|
||||||
</el-select>
|
:popper-class="popClass" @visible-change="popperVisible">
|
||||||
|
<el-option v-for="(item, index) in pageSizes" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||||
|
</el-select>
|
||||||
|
|
||||||
</el-pagination>
|
</el-pagination>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
@@ -48,8 +50,7 @@ export default {
|
|||||||
setup () {
|
setup () {
|
||||||
const { query } = useRoute()
|
const { query } = useRoute()
|
||||||
const pageSize = ref(defaultPageSize)
|
const pageSize = ref(defaultPageSize)
|
||||||
console.log('初始化路由信息', query);
|
const currentPageNo = ref(query.pageNo || 1)
|
||||||
let currentPageNo = ref(query.pageNo || 1)
|
|
||||||
|
|
||||||
return {
|
return {
|
||||||
pageSize,
|
pageSize,
|
||||||
@@ -80,10 +81,10 @@ export default {
|
|||||||
* 向地址栏添加/删除参数
|
* 向地址栏添加/删除参数
|
||||||
*/
|
*/
|
||||||
reloadUrl (newParam, clean) {
|
reloadUrl (newParam, clean) {
|
||||||
const { query } = this.$route;
|
const { query } = this.$route
|
||||||
let newUrl = urlParamsHandler(window.location.href, query, newParam);
|
let newUrl = urlParamsHandler(window.location.href, query, newParam)
|
||||||
if(clean) {
|
if (clean) {
|
||||||
newUrl = urlParamsHandler(window.location.href, query, newParam, clean);
|
newUrl = urlParamsHandler(window.location.href, query, newParam, clean)
|
||||||
}
|
}
|
||||||
overwriteUrl(newUrl)
|
overwriteUrl(newUrl)
|
||||||
},
|
},
|
||||||
@@ -127,10 +128,10 @@ export default {
|
|||||||
this.scrollbarToTop()
|
this.scrollbarToTop()
|
||||||
// this.currentPageNo = val;
|
// this.currentPageNo = val;
|
||||||
|
|
||||||
let newParam = {
|
const newParam = {
|
||||||
pageNo: val
|
pageNo: val
|
||||||
}
|
}
|
||||||
this.reloadUrl(newParam);
|
this.reloadUrl(newParam)
|
||||||
},
|
},
|
||||||
/**
|
/**
|
||||||
* 更改页码大小
|
* 更改页码大小
|
||||||
@@ -141,10 +142,10 @@ export default {
|
|||||||
this.$emit('pageSize', val)
|
this.$emit('pageSize', val)
|
||||||
this.backgroundColor()
|
this.backgroundColor()
|
||||||
|
|
||||||
let newParam = {
|
const newParam = {
|
||||||
pageSize: val
|
pageSize: val
|
||||||
}
|
}
|
||||||
this.reloadUrl(newParam);
|
this.reloadUrl(newParam)
|
||||||
},
|
},
|
||||||
scrollbarToTop () {
|
scrollbarToTop () {
|
||||||
this.$nextTick(() => {
|
this.$nextTick(() => {
|
||||||
@@ -159,7 +160,10 @@ export default {
|
|||||||
resetPageSizes: function () {
|
resetPageSizes: function () {
|
||||||
if (this.postPageSizes) {
|
if (this.postPageSizes) {
|
||||||
this.pageSizes = this.postPageSizes.map((item) => {
|
this.pageSizes = this.postPageSizes.map((item) => {
|
||||||
return { label: item + this.$t('pageSize'), value: item }
|
return {
|
||||||
|
label: item + this.$t('pageSize'),
|
||||||
|
value: item
|
||||||
|
}
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
@@ -181,10 +185,10 @@ export default {
|
|||||||
this.pageSize = parseInt(pageSize)
|
this.pageSize = parseInt(pageSize)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
this.size(this.pageSize);
|
this.size(this.pageSize)
|
||||||
this.currentPageNo = parseInt(this.currentPageNo);
|
this.currentPageNo = parseInt(this.currentPageNo)
|
||||||
this.current(this.currentPageNo);
|
this.current(this.currentPageNo)
|
||||||
},
|
},
|
||||||
watch: {
|
watch: {
|
||||||
postPageSizes: {
|
postPageSizes: {
|
||||||
|
|||||||
@@ -40,6 +40,7 @@
|
|||||||
:category-list="builtinReportLeftMenu"
|
:category-list="builtinReportLeftMenu"
|
||||||
:height="mainTableHeight"
|
:height="mainTableHeight"
|
||||||
:table-data="tableData"
|
:table-data="tableData"
|
||||||
|
:category-id="builtinId"
|
||||||
@delete="del"
|
@delete="del"
|
||||||
@edit="edit"
|
@edit="edit"
|
||||||
@download="download"
|
@download="download"
|
||||||
@@ -156,7 +157,7 @@ export default {
|
|||||||
*/
|
*/
|
||||||
setup () {
|
setup () {
|
||||||
const { query } = useRoute()
|
const { query } = useRoute()
|
||||||
const builtinId = ref(parseInt(query.ategoryId) || '')
|
const builtinId = ref(parseInt(query.categoryId) || '')
|
||||||
const urlPageNo = ref(parseInt(query.pageNo) || 1)
|
const urlPageNo = ref(parseInt(query.pageNo) || 1)
|
||||||
|
|
||||||
return {
|
return {
|
||||||
@@ -173,22 +174,34 @@ export default {
|
|||||||
},
|
},
|
||||||
mounted () {
|
mounted () {
|
||||||
this.$nextTick(() => {
|
this.$nextTick(() => {
|
||||||
this.queryGetTempData();
|
this.queryGetTempData()
|
||||||
});
|
})
|
||||||
},
|
},
|
||||||
watch: {
|
watch: {
|
||||||
builtinId (n) {
|
builtinId (n) {
|
||||||
const { query } = this.$route
|
const { query } = this.$route
|
||||||
let newUrl = urlParamsHandler(window.location.href, query, {
|
let newUrl = urlParamsHandler(window.location.href, query, {
|
||||||
ategoryId: n
|
categoryId: n,
|
||||||
|
pageNo: 1,
|
||||||
|
pageSize: 20
|
||||||
})
|
})
|
||||||
|
|
||||||
// 点击“全部”或者首次进入界面时,不显示左侧菜单栏参数
|
// 点击“全部”或者首次进入界面时,不显示左侧菜单栏参数
|
||||||
if(n === null) {
|
const newQuery = JSON.parse(JSON.stringify(query)) // 深拷贝路由数据
|
||||||
let newQuery = JSON.parse(JSON.stringify(query)) // 深拷贝路由数据
|
|
||||||
delete newQuery.ategoryId;
|
if (n === null) {
|
||||||
newUrl = urlParamsHandler(window.location.href, query, newQuery, 'clean')
|
delete newQuery.categoryId
|
||||||
|
} else {
|
||||||
|
delete newQuery.startTime
|
||||||
|
delete newQuery.endTime
|
||||||
|
delete newQuery.expandId
|
||||||
|
delete newQuery.expandPage
|
||||||
|
delete newQuery.pageNo
|
||||||
|
delete newQuery.pageSize
|
||||||
}
|
}
|
||||||
|
|
||||||
|
newUrl = urlParamsHandler(window.location.href, query, newQuery, 'clean')
|
||||||
|
|
||||||
overwriteUrl(newUrl)
|
overwriteUrl(newUrl)
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
@@ -204,17 +217,17 @@ export default {
|
|||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
if(this.builtinId !== '') {
|
if (this.builtinId !== '') {
|
||||||
this.builtinTabs (this.builtinId);
|
this.builtinTabs(this.builtinId, 'init')
|
||||||
} else {
|
} else {
|
||||||
this.getTableData();
|
this.getTableData()
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
this.builtinLeftLoading = false
|
this.builtinLeftLoading = false
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
getTableData (params) {
|
getTableData (params) {
|
||||||
this.searchLabel = null;
|
this.searchLabel = null
|
||||||
if (params) {
|
if (params) {
|
||||||
this.searchLabel = { ...this.searchLabel, ...params }
|
this.searchLabel = { ...this.searchLabel, ...params }
|
||||||
}
|
}
|
||||||
@@ -226,28 +239,28 @@ export default {
|
|||||||
listUrl = this.listUrl
|
listUrl = this.listUrl
|
||||||
}
|
}
|
||||||
|
|
||||||
if(this.builtinId !== '') {
|
if (this.builtinId !== '') {
|
||||||
this.searchLabel.categoryId = this.builtinId;
|
this.searchLabel.categoryId = this.builtinId
|
||||||
}
|
}
|
||||||
|
|
||||||
// 该请求不知道为什么会走2次,此处留个记录,后续解决。
|
// 该请求不知道为什么会走2次,此处留个记录,后续解决。
|
||||||
this.getNum = this.getNum + 1;
|
this.getNum = this.getNum + 1
|
||||||
if(this.getNum >0) {
|
if (this.getNum > 0) {
|
||||||
get(listUrl, this.searchLabel).then(response => {
|
get(listUrl, this.searchLabel).then(response => {
|
||||||
// this.tools.loading = false
|
// this.tools.loading = false
|
||||||
if (response.code === 200) {
|
if (response.code === 200) {
|
||||||
for (let i = 0; i < response.data.list.length; i++) {
|
for (let i = 0; i < response.data.list.length; i++) {
|
||||||
response.data.list[i].status = response.data.list[i].status + ''
|
response.data.list[i].status = response.data.list[i].status + ''
|
||||||
}
|
}
|
||||||
this.$nextTick(()=>{
|
this.$nextTick(() => {
|
||||||
this.tableData = [];
|
this.tableData = []
|
||||||
this.tableData = response.data.list.map(item => {
|
this.tableData = response.data.list.map(item => {
|
||||||
return {
|
return {
|
||||||
...item,
|
...item,
|
||||||
config: item.config ? JSON.parse(item.config) : {}
|
config: item.config ? JSON.parse(item.config) : {}
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
this.pageObj.total = response.data.total;
|
this.pageObj.total = response.data.total
|
||||||
})
|
})
|
||||||
// TODO 回到顶部
|
// TODO 回到顶部
|
||||||
}
|
}
|
||||||
@@ -257,9 +270,13 @@ export default {
|
|||||||
/**
|
/**
|
||||||
* 点击左侧tab页
|
* 点击左侧tab页
|
||||||
*/
|
*/
|
||||||
builtinTabs (id) {
|
builtinTabs (id, flag) {
|
||||||
this.builtinId = id
|
this.builtinId = id
|
||||||
this.getTableData({ categoryId: id });
|
if (flag === undefined) {
|
||||||
|
this.pageObj.pageNo = 1
|
||||||
|
this.pageObj.pageSize = 20
|
||||||
|
}
|
||||||
|
this.getTableData({ categoryId: id })
|
||||||
},
|
},
|
||||||
edit (u) {
|
edit (u) {
|
||||||
this.initConfig(u)
|
this.initConfig(u)
|
||||||
@@ -305,9 +322,6 @@ export default {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
|
||||||
beforeDestroy(to, from, next) {
|
|
||||||
this.getNum = null;
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|||||||
Reference in New Issue
Block a user