1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
| export default {
name: "basetable",
data() {
return {
query: {
address: "",
name: "",
pageIndex: 1,
pageSize: 5
},
tableData: [],
multipleSelection: [],
delList: [],
editVisible: false,
pageTotal: 0,
form: {},
idx: -1,
id: -1,
currpage: 1,
list: [],
lists: [
{
"id": 1,
"name": "张三",
"money": 123,
"address": "广东省东莞市长安镇",
"state": "成功",
"date": "2019-11-1",
"thumb": "https://lin-xin.gitee.io/images/post/wms.png"
},
{
"id": 10,
"name": "赵六",
"money": 1011,
"address": "福建省厦门市鼓浪屿",
"state": "成功",
"date": "2019-10-20",
"thumb": "https://lin-xin.gitee.io/images/post/notice.png"
}
],
"pageTotal": 10
};
},
created() {
this.getData();
},
methods: {
getData() {
this.tableData = this.lists
this.list = this.lists
this.pageTotal = res.pageTotal || 50;
},
handleSearch() {
let arr = [];
arr = this.list.filter(item => {
return (
item.address.includes(this.query.address) &&
item.name.includes(this.query.name)
);
});
this.tableData = arr;
},
handleDelete(index, row) {
this.$confirm("确定要删除吗？", "提示", {
type: "warning"
})
.then(() => {
this.$message.success("删除成功");
this.tableData.splice(index, 1);
})
.catch(() => {});
},
handleSelectionChange(val) {
this.multipleSelection = val;
},
delAllSelection() {
const length = this.multipleSelection.length;
let str = "";
this.delList = this.delList.concat(this.multipleSelection);
this.multipleSelection.forEach(ele => {
this.tableData.forEach((item, index) => {
if (ele.id == item.id) {
this.tableData.splice(index, 1);
}
});
});
this.multipleSelection = [];
this.$message.error(`删除了${str}`);
},
handleEdit(index, row) {
this.idx = index;
this.form = row;
this.editVisible = true;
},
saveEdit() {
this.editVisible = false;
this.$message.success(`修改第 ${this.idx + 1} 行成功`);
this.$set(this.tableData, this.idx, this.form);
},
handlePageChange(val) {
this.currpage = val;
},
handleSizeChange(val) {
this.query.pageSize = val;
}
}
}
|
