|
|
|
|
@ -7,7 +7,8 @@ import './index.less'
|
|
|
|
|
|
|
|
|
|
export default {
|
|
|
|
|
components: {
|
|
|
|
|
draggable, columnSetting
|
|
|
|
|
draggable,
|
|
|
|
|
columnSetting
|
|
|
|
|
},
|
|
|
|
|
data() {
|
|
|
|
|
return {
|
|
|
|
|
@ -85,12 +86,13 @@ export default {
|
|
|
|
|
},
|
|
|
|
|
extraTool: {
|
|
|
|
|
type: Array,
|
|
|
|
|
default: () => ([])
|
|
|
|
|
default: () => []
|
|
|
|
|
}
|
|
|
|
|
}),
|
|
|
|
|
watch: {
|
|
|
|
|
'localPagination.current'(val) {
|
|
|
|
|
this.pageURI && this.$router.push({
|
|
|
|
|
this.pageURI &&
|
|
|
|
|
this.$router.push({
|
|
|
|
|
...this.$route,
|
|
|
|
|
name: this.$route.name,
|
|
|
|
|
params: Object.assign({}, this.$route.params, {
|
|
|
|
|
@ -116,8 +118,10 @@ export default {
|
|
|
|
|
},
|
|
|
|
|
created() {
|
|
|
|
|
const { pageNo } = this.$route.params
|
|
|
|
|
const localPageNum = this.pageURI && (pageNo && parseInt(pageNo)) || this.pageNum
|
|
|
|
|
this.localPagination = ['auto', true].includes(this.showPagination) && Object.assign({}, this.localPagination, {
|
|
|
|
|
const localPageNum = (this.pageURI && pageNo && parseInt(pageNo)) || this.pageNum
|
|
|
|
|
this.localPagination =
|
|
|
|
|
(['auto', true].includes(this.showPagination) &&
|
|
|
|
|
Object.assign({}, this.localPagination, {
|
|
|
|
|
current: localPageNum,
|
|
|
|
|
pageSize: this.pageSize,
|
|
|
|
|
showSizeChanger: this.showSizeChanger,
|
|
|
|
|
@ -125,31 +129,28 @@ export default {
|
|
|
|
|
showTotal: (total, range) => {
|
|
|
|
|
return range[0] + '-' + range[1] + '共' + total + '条'
|
|
|
|
|
}
|
|
|
|
|
}) || false
|
|
|
|
|
})) ||
|
|
|
|
|
false
|
|
|
|
|
this.needTotalList = this.initTotalList(this.columns)
|
|
|
|
|
this.loadData()
|
|
|
|
|
// this.columnsSetting = this.columns
|
|
|
|
|
//记录选择显示的列，以当前路由为key
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
this.columnsSetting = []
|
|
|
|
|
let cacheColumns=this.$ls.get(this.$route.path);
|
|
|
|
|
let cacheColumns = this.$ls.get(this.$route.path)
|
|
|
|
|
if (cacheColumns && cacheColumns.length > 0) {
|
|
|
|
|
this.columnsSetting=cacheColumns;
|
|
|
|
|
this.columnsSetting = cacheColumns
|
|
|
|
|
|
|
|
|
|
this.columns.forEach((item, index, arr) => {
|
|
|
|
|
let temp=this.columnsSetting.find(m=>m.dataIndex==item.dataIndex);
|
|
|
|
|
let temp = this.columnsSetting.find(m => m.dataIndex == item.dataIndex)
|
|
|
|
|
//如果存在
|
|
|
|
|
if (temp) {
|
|
|
|
|
arr[index].checked=temp.checked;
|
|
|
|
|
arr[index].checked = temp.checked
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
this.columnsSetting = this.columns
|
|
|
|
|
}
|
|
|
|
|
else{
|
|
|
|
|
} else {
|
|
|
|
|
this.columnsSetting = this.columns
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
@ -160,9 +161,14 @@ export default {
|
|
|
|
|
* @param Boolean bool
|
|
|
|
|
*/
|
|
|
|
|
refresh(bool = false) {
|
|
|
|
|
bool && (this.localPagination = Object.assign({}, {
|
|
|
|
|
current: 1, pageSize: this.pageSize
|
|
|
|
|
}))
|
|
|
|
|
bool &&
|
|
|
|
|
(this.localPagination = Object.assign(
|
|
|
|
|
{},
|
|
|
|
|
{
|
|
|
|
|
current: 1,
|
|
|
|
|
pageSize: this.pageSize
|
|
|
|
|
}
|
|
|
|
|
))
|
|
|
|
|
this.loadData()
|
|
|
|
|
},
|
|
|
|
|
/**
|
|
|
|
|
@ -173,18 +179,26 @@ export default {
|
|
|
|
|
*/
|
|
|
|
|
loadData(pagination, filters, sorter) {
|
|
|
|
|
this.localLoading = true
|
|
|
|
|
const parameter = Object.assign({
|
|
|
|
|
pageNo: (pagination && pagination.current) ||
|
|
|
|
|
this.showPagination && this.localPagination.current || this.pageNum,
|
|
|
|
|
pageSize: (pagination && pagination.pageSize) ||
|
|
|
|
|
this.showPagination && this.localPagination.pageSize || this.pageSize
|
|
|
|
|
},
|
|
|
|
|
(sorter && sorter.field && {
|
|
|
|
|
const parameter = Object.assign(
|
|
|
|
|
{
|
|
|
|
|
pageNo:
|
|
|
|
|
(pagination && pagination.current) || (this.showPagination && this.localPagination.current) || this.pageNum,
|
|
|
|
|
pageSize:
|
|
|
|
|
(pagination && pagination.pageSize) ||
|
|
|
|
|
(this.showPagination && this.localPagination.pageSize) ||
|
|
|
|
|
this.pageSize
|
|
|
|
|
},
|
|
|
|
|
(sorter &&
|
|
|
|
|
sorter.field && {
|
|
|
|
|
sortField: sorter.field
|
|
|
|
|
}) || {},
|
|
|
|
|
(sorter && sorter.order && {
|
|
|
|
|
}) ||
|
|
|
|
|
{},
|
|
|
|
|
(sorter &&
|
|
|
|
|
sorter.order && {
|
|
|
|
|
sortOrder: sorter.order
|
|
|
|
|
}) || {}, {
|
|
|
|
|
}) ||
|
|
|
|
|
{},
|
|
|
|
|
{
|
|
|
|
|
...filters
|
|
|
|
|
}
|
|
|
|
|
)
|
|
|
|
|
@ -197,13 +211,15 @@ export default {
|
|
|
|
|
this.localLoading = false
|
|
|
|
|
return
|
|
|
|
|
}
|
|
|
|
|
this.localPagination = this.showPagination && Object.assign({}, this.localPagination, {
|
|
|
|
|
this.localPagination =
|
|
|
|
|
(this.showPagination &&
|
|
|
|
|
Object.assign({}, this.localPagination, {
|
|
|
|
|
current: r.pageNo, // pageNo, // 返回结果中的当前分页数
|
|
|
|
|
total: r.totalRows, // totalCount, // 返回结果中的总记录数
|
|
|
|
|
showSizeChanger: this.showSizeChanger,
|
|
|
|
|
pageSize: (pagination && pagination.pageSize) ||
|
|
|
|
|
this.localPagination.pageSize
|
|
|
|
|
}) || false
|
|
|
|
|
pageSize: (pagination && pagination.pageSize) || this.localPagination.pageSize
|
|
|
|
|
})) ||
|
|
|
|
|
false
|
|
|
|
|
// 后端数据rows为null保存修复
|
|
|
|
|
if (r.rows == null) {
|
|
|
|
|
r.rows = []
|
|
|
|
|
@ -218,7 +234,10 @@ export default {
|
|
|
|
|
// 这里用于判断接口是否有返回 r.totalCount 且 this.showPagination = true 且 pageNo 和 pageSize 存在 且 totalCount 小于等于 pageNo * pageSize 的大小
|
|
|
|
|
// 当情况满足时，表示数据不满足分页大小，关闭 table 分页功能
|
|
|
|
|
try {
|
|
|
|
|
if ((['auto', true].includes(this.showPagination) && r.totalCount <= (r.totalPage * this.localPagination.pageSize))) {
|
|
|
|
|
if (
|
|
|
|
|
['auto', true].includes(this.showPagination) &&
|
|
|
|
|
r.totalCount <= r.totalPage * this.localPagination.pageSize
|
|
|
|
|
) {
|
|
|
|
|
this.localPagination.hideOnSinglePage = true
|
|
|
|
|
}
|
|
|
|
|
} catch (e) {
|
|
|
|
|
@ -231,7 +250,9 @@ export default {
|
|
|
|
|
},
|
|
|
|
|
initTotalList(columns) {
|
|
|
|
|
const totalList = []
|
|
|
|
|
columns && columns instanceof Array && columns.forEach(column => {
|
|
|
|
|
columns &&
|
|
|
|
|
columns instanceof Array &&
|
|
|
|
|
columns.forEach(column => {
|
|
|
|
|
if (column.needTotal) {
|
|
|
|
|
totalList.push({
|
|
|
|
|
...column,
|
|
|
|
|
@ -277,28 +298,37 @@ export default {
|
|
|
|
|
renderClear(callback) {
|
|
|
|
|
if (this.selectedRowKeys.length <= 0) return null
|
|
|
|
|
return (
|
|
|
|
|
<a style="margin-left: 24px" onClick={() => {
|
|
|
|
|
<a
|
|
|
|
|
style="margin-left: 24px"
|
|
|
|
|
onClick={() => {
|
|
|
|
|
callback()
|
|
|
|
|
this.clearSelected()
|
|
|
|
|
}}>清空</a>
|
|
|
|
|
}}
|
|
|
|
|
>
|
|
|
|
|
清空
|
|
|
|
|
</a>
|
|
|
|
|
)
|
|
|
|
|
},
|
|
|
|
|
renderAlert() {
|
|
|
|
|
// 绘制统计列数据
|
|
|
|
|
// eslint-disable-next-line no-unused-vars
|
|
|
|
|
const needTotalItems = this.needTotalList.map((item) => {
|
|
|
|
|
return (<span style="margin-right: 12px">
|
|
|
|
|
{item.title}总计 <a style="font-weight: 600">{!item.customRender ? item.total : item.customRender(item.total)}</a>
|
|
|
|
|
</span>)
|
|
|
|
|
const needTotalItems = this.needTotalList.map(item => {
|
|
|
|
|
return (
|
|
|
|
|
<span style="margin-right: 12px">
|
|
|
|
|
{item.title}总计{' '}
|
|
|
|
|
<a style="font-weight: 600">{!item.customRender ? item.total : item.customRender(item.total)}</a>
|
|
|
|
|
</span>
|
|
|
|
|
)
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
// 绘制 清空 按钮
|
|
|
|
|
// eslint-disable-next-line no-unused-vars
|
|
|
|
|
const clearItem = (typeof this.alert.clear === 'boolean' && this.alert.clear) ? (
|
|
|
|
|
this.renderClear(this.clearSelected)
|
|
|
|
|
) : (this.alert !== null && typeof this.alert.clear === 'function') ? (
|
|
|
|
|
this.renderClear(this.alert.clear)
|
|
|
|
|
) : null
|
|
|
|
|
const clearItem =
|
|
|
|
|
typeof this.alert.clear === 'boolean' && this.alert.clear
|
|
|
|
|
? this.renderClear(this.clearSelected)
|
|
|
|
|
: this.alert !== null && typeof this.alert.clear === 'function'
|
|
|
|
|
? this.renderClear(this.alert.clear)
|
|
|
|
|
: null
|
|
|
|
|
|
|
|
|
|
// 绘制 alert 组件
|
|
|
|
|
// 统一先去除alert组件
|
|
|
|
|
@ -342,8 +372,7 @@ export default {
|
|
|
|
|
</a-menu>
|
|
|
|
|
)
|
|
|
|
|
},
|
|
|
|
|
onClick: () => {
|
|
|
|
|
}
|
|
|
|
|
onClick: () => {}
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
icon: 'setting',
|
|
|
|
|
@ -353,8 +382,7 @@ export default {
|
|
|
|
|
//return <columnSetting slot="overlay" columns={this.columns} onColumnChange={this.columnChange} />
|
|
|
|
|
return <columnSetting slot="overlay" columns={this.columnsSetting} onColumnChange={this.columnChange} />
|
|
|
|
|
},
|
|
|
|
|
onClick: () => {
|
|
|
|
|
}
|
|
|
|
|
onClick: () => {}
|
|
|
|
|
}
|
|
|
|
|
]
|
|
|
|
|
if (this.extraTool.length) {
|
|
|
|
|
@ -363,12 +391,9 @@ export default {
|
|
|
|
|
|
|
|
|
|
return (
|
|
|
|
|
<div class="s-table-tool">
|
|
|
|
|
<div class="s-table-tool-left">
|
|
|
|
|
{this.$scopedSlots.operator && this.$scopedSlots.operator()}
|
|
|
|
|
</div>
|
|
|
|
|
<div class="s-table-tool-left">{this.$scopedSlots.operator && this.$scopedSlots.operator()}</div>
|
|
|
|
|
<div class="s-table-tool-right">
|
|
|
|
|
{
|
|
|
|
|
tools.map(tool => {
|
|
|
|
|
{tools.map(tool => {
|
|
|
|
|
if (tool.isDropdown) {
|
|
|
|
|
return (
|
|
|
|
|
<a-dropdown trigger={['click']}>
|
|
|
|
|
@ -384,8 +409,7 @@ export default {
|
|
|
|
|
<a-icon type={tool.icon} />
|
|
|
|
|
</a-tooltip>
|
|
|
|
|
)
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
})}
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
)
|
|
|
|
|
@ -404,7 +428,12 @@ export default {
|
|
|
|
|
render() {
|
|
|
|
|
let 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
|
|
|
|
|
const showAlert =
|
|
|
|
|
(typeof this.alert === 'object' &&
|
|
|
|
|
this.alert !== null &&
|
|
|
|
|
this.alert.show &&
|
|
|
|
|
typeof this.rowSelection.selectedRowKeys !== 'undefined') ||
|
|
|
|
|
this.alert
|
|
|
|
|
|
|
|
|
|
Object.keys(T.props).forEach(k => {
|
|
|
|
|
const localKey = `local${k.substring(0, 1).toUpperCase()}${k.substring(1)}`
|
|
|
|
|
@ -441,8 +470,16 @@ export default {
|
|
|
|
|
return props[k]
|
|
|
|
|
})
|
|
|
|
|
const table = (
|
|
|
|
|
<a-table {...{ props, scopedSlots: { ...this.$scopedSlots } }} onChange={this.loadData} onExpand={ (expanded, record) => { this.$emit('expand', expanded, record) } }>
|
|
|
|
|
{ Object.keys(this.$slots).map(name => (<template slot={name}>{this.$slots[name]}</template>)) }
|
|
|
|
|
<a-table
|
|
|
|
|
{...{ props, scopedSlots: { ...this.$scopedSlots } }}
|
|
|
|
|
onChange={this.loadData}
|
|
|
|
|
onExpand={(expanded, record) => {
|
|
|
|
|
this.$emit('expand', expanded, record)
|
|
|
|
|
}}
|
|
|
|
|
>
|
|
|
|
|
{Object.keys(this.$slots).map(name => (
|
|
|
|
|
<template slot={name}>{this.$slots[name]}</template>
|
|
|
|
|
))}
|
|
|
|
|
</a-table>
|
|
|
|
|
)
|
|
|
|
|
|
|
|
|
|
|
