增加统一的分页设置
This commit is contained in:
@@ -1,19 +1,18 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="ai-table" :class="[isShowBorder ? 'ai-table__border' : 'ai-table__noborder']">
|
<div class="ai-table" :class="[isShowBorder ? 'ai-table__border' : 'ai-table__noborder']">
|
||||||
<el-table
|
<el-table :data="tableData"
|
||||||
:data="tableData"
|
header-cell-class-name="ai-table__header"
|
||||||
header-cell-class-name="ai-table__header"
|
cell-class-name="ai-table__cell"
|
||||||
cell-class-name="ai-table__cell"
|
row-class-name="ai-table__row"
|
||||||
row-class-name="ai-table__row"
|
:class="{'ai-header__border': isShowBorder}"
|
||||||
:class="{'ai-header__border': isShowBorder}"
|
:ref="refName"
|
||||||
:ref="refName"
|
:size="tableSize"
|
||||||
:size="tableSize"
|
:stripe="stripe"
|
||||||
:stripe="stripe"
|
:tooltip-effect="tooltipEffect"
|
||||||
:tooltip-effect="tooltipEffect"
|
@selection-change="handleSelectionChange"
|
||||||
@selection-change="handleSelectionChange"
|
v-on="$listeners"
|
||||||
v-on="$listeners"
|
v-bind="$attrs"
|
||||||
v-bind="$attrs"
|
v-loading="loading">
|
||||||
v-loading="loading">
|
|
||||||
<template v-for="colConfig in colConfigs.filter(e=>!e.hide)">
|
<template v-for="colConfig in colConfigs.filter(e=>!e.hide)">
|
||||||
<slot v-if="colConfig.slot && colConfig.slot !== 'options'" :name="colConfig.slot"/>
|
<slot v-if="colConfig.slot && colConfig.slot !== 'options'" :name="colConfig.slot"/>
|
||||||
<component
|
<component
|
||||||
@@ -52,7 +51,7 @@
|
|||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
</template>
|
</template>
|
||||||
<slot class="table-options" name="options"></slot>
|
<slot class="table-options" name="options"/>
|
||||||
<template #empty>
|
<template #empty>
|
||||||
<slot v-if="$scopedSlots.empty" name="empty"/>
|
<slot v-if="$scopedSlots.empty" name="empty"/>
|
||||||
<div v-else class="no-data" style="height:160px;"/>
|
<div v-else class="no-data" style="height:160px;"/>
|
||||||
@@ -61,7 +60,7 @@
|
|||||||
<div class="pagination newPagination" v-if="isShowPagination">
|
<div class="pagination newPagination" v-if="isShowPagination">
|
||||||
<el-pagination
|
<el-pagination
|
||||||
background
|
background
|
||||||
:current-page.sync="page.current"
|
:current-page="page.current"
|
||||||
:total="page.total"
|
:total="page.total"
|
||||||
:page-size="page.size"
|
:page-size="page.size"
|
||||||
v-bind="$attrs"
|
v-bind="$attrs"
|
||||||
@@ -72,8 +71,7 @@
|
|||||||
@current-change="handleChange">
|
@current-change="handleChange">
|
||||||
<div class="paginationPre">
|
<div class="paginationPre">
|
||||||
<el-checkbox v-if="isHasPaginationBtnsSlot" :disabled="!tableData.length" :indeterminate="isIndeterminate"
|
<el-checkbox v-if="isHasPaginationBtnsSlot" :disabled="!tableData.length" :indeterminate="isIndeterminate"
|
||||||
:value="checkAll"
|
:value="checkAll" @click.native="toggleAllSelection">全选
|
||||||
@click.native="toggleAllSelection">全选
|
|
||||||
</el-checkbox>
|
</el-checkbox>
|
||||||
<slot name="pagination"/>
|
<slot name="pagination"/>
|
||||||
<div class="pagination-btns">
|
<div class="pagination-btns">
|
||||||
@@ -112,7 +110,8 @@ export default {
|
|||||||
tableRef: String,
|
tableRef: String,
|
||||||
dict: {default: () => dict},
|
dict: {default: () => dict},
|
||||||
pagerCount: {default: 5},
|
pagerCount: {default: 5},
|
||||||
pageSizes: {default: () => [10, 20, 50, 100]}
|
pageSizes: {default: () => [10, 20, 50, 100]},
|
||||||
|
pageConfig: Object
|
||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
@@ -150,6 +149,7 @@ export default {
|
|||||||
checkAll: v => v.chooseList.length == v.tableData.length && v.tableData !== 0,
|
checkAll: v => v.chooseList.length == v.tableData.length && v.tableData !== 0,
|
||||||
page() {
|
page() {
|
||||||
return {
|
return {
|
||||||
|
...this.pageConfig,
|
||||||
current: this.current,
|
current: this.current,
|
||||||
size: this.size,
|
size: this.size,
|
||||||
total: this.total,
|
total: this.total,
|
||||||
@@ -158,14 +158,16 @@ export default {
|
|||||||
},
|
},
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
handleChange(e) {
|
handleChange(current) {
|
||||||
this.$emit('update:current', e)
|
this.$emit('update:current', current)
|
||||||
|
this.$emit('update:pageConfig', {...this.pageConfig, current})
|
||||||
this.$nextTick(() => {
|
this.$nextTick(() => {
|
||||||
this.$emit('getList')
|
this.$emit('getList')
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
handleSizeChange(e) {
|
handleSizeChange(size) {
|
||||||
this.$emit('update:size', e)
|
this.$emit('update:size', size)
|
||||||
|
this.$emit('update:pageConfig', {...this.pageConfig, size})
|
||||||
this.$nextTick(() => {
|
this.$nextTick(() => {
|
||||||
this.$emit('getList')
|
this.$emit('getList')
|
||||||
})
|
})
|
||||||
@@ -175,16 +177,13 @@ export default {
|
|||||||
this.$emit('handleSelectionChange', e)
|
this.$emit('handleSelectionChange', e)
|
||||||
},
|
},
|
||||||
getValue(colConfig, row) {
|
getValue(colConfig, row) {
|
||||||
if (this.isFunction(colConfig.format)) {
|
if (typeof colConfig.format === 'function') {
|
||||||
return colConfig.format.call(this, row[colConfig.prop])
|
return colConfig.format.call(this, row[colConfig.prop])
|
||||||
}
|
}
|
||||||
if (colConfig.dateFormat) {
|
if (colConfig.dateFormat) {
|
||||||
return moment(row[colConfig.prop]).format(colConfig.dateFormat)
|
return moment(row[colConfig.prop]).format(colConfig.dateFormat)
|
||||||
}
|
}
|
||||||
return row[colConfig.prop]|| "-"
|
return row[colConfig.prop] || "-"
|
||||||
},
|
|
||||||
isFunction(fun) {
|
|
||||||
return typeof fun === 'function'
|
|
||||||
},
|
},
|
||||||
/**
|
/**
|
||||||
* 表格方法代理
|
* 表格方法代理
|
||||||
|
|||||||
Reference in New Issue
Block a user