105 lines
2.8 KiB
Vue
105 lines
2.8 KiB
Vue
<template>
|
|
<div>
|
|
<Table :columns="columns" :data="listData" @on-selection-change="selectChange" class="link-table table-bottom-box" :height="tableHeight" no-data-text="暂无数据"></Table>
|
|
<div class="page-panel">
|
|
<div class="fl ml-15 align-middle">
|
|
<slot :sel-ids="selectList"></slot>
|
|
</div>
|
|
<Page
|
|
class="page-box fr mr-5 align-middle"
|
|
:total="total"
|
|
:current="dataParmas.page"
|
|
:page-size="dataParmas.count"
|
|
:page-size-opts="[10, 20, 30, 40]"
|
|
@on-page-size-change="pageSizeUpdate"
|
|
@on-change="pageUpdate"
|
|
placement="top"
|
|
show-total
|
|
show-sizer
|
|
></Page>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
props: {
|
|
tableHeight: {
|
|
default: 0,
|
|
type: Number,
|
|
},
|
|
dataUrl: {
|
|
default: "",
|
|
type: String,
|
|
},
|
|
dataParmas: {
|
|
default: {},
|
|
type: Object,
|
|
},
|
|
dataFilter: {
|
|
type: Function,
|
|
default: null,
|
|
},
|
|
columns: {
|
|
default: [],
|
|
type: Array,
|
|
},
|
|
autoLoad: {
|
|
default: true,
|
|
Type: Boolean,
|
|
},
|
|
},
|
|
data() {
|
|
return {
|
|
listData: [],
|
|
selectList: [],
|
|
total: 30,
|
|
};
|
|
},
|
|
|
|
created() {
|
|
this.dataParmas.page = 1;
|
|
this.dataParmas.count = parseInt(localStorage.getItem("customPageCount") || 10);
|
|
if (this.autoLoad) this.getData();
|
|
},
|
|
|
|
methods: {
|
|
getData() {
|
|
const _this = this;
|
|
let item = {},
|
|
{ dataUrl, dataParmas } = this;
|
|
// console.log("dataParmas", dataParmas);
|
|
for (const key in dataParmas) {
|
|
const element = dataParmas[key];
|
|
item[key] = element;
|
|
}
|
|
_this.$api.get(dataUrl, item, resp => {
|
|
let rData = resp.data;
|
|
if (typeof _this.dataFilter === "function") {
|
|
let fData = _this.dataFilter(rData);
|
|
_this.listData = JSON.parse(JSON.stringify(fData));
|
|
} else _this.listData = rData;
|
|
});
|
|
},
|
|
selectChange(selection) {
|
|
this.selectList = selection;
|
|
},
|
|
pageUpdate(page) {
|
|
this.dataParmas.page = page;
|
|
this.getData();
|
|
},
|
|
pageSizeUpdate(size) {
|
|
this.dataParmas.page = 1;
|
|
this.dataParmas.count = size;
|
|
localStorage.setItem("customPageCount", size);
|
|
this.getData();
|
|
},
|
|
reloadData() {
|
|
this.getData();
|
|
},
|
|
},
|
|
};
|
|
</script>
|
|
|
|
<style>
|
|
</style> |