2016-11-23 16:27:17 +08:00
|
|
|
<template>
|
2018-06-25 20:27:03 +08:00
|
|
|
<div>
|
2018-06-29 09:27:32 +08:00
|
|
|
<Table border ref="selection" :columns="columns4" :data="data1"></Table>
|
|
|
|
<br><br>
|
|
|
|
<Button @click="handleSelectAll(true)">Set all selected</Button>
|
|
|
|
<Button @click="handleSelectAll(false)">Cancel all selected</Button>
|
2018-06-25 20:27:03 +08:00
|
|
|
</div>
|
2016-11-23 16:27:17 +08:00
|
|
|
</template>
|
|
|
|
<script>
|
|
|
|
export default {
|
2017-07-19 15:09:15 +08:00
|
|
|
data () {
|
|
|
|
return {
|
2018-06-29 09:27:32 +08:00
|
|
|
columns4: [
|
2018-06-25 20:21:01 +08:00
|
|
|
{
|
2018-06-29 09:27:32 +08:00
|
|
|
type: 'selection',
|
|
|
|
width: 60,
|
|
|
|
align: 'center'
|
2018-06-25 20:21:01 +08:00
|
|
|
},
|
2017-10-17 10:14:10 +02:00
|
|
|
{
|
2018-06-29 09:27:32 +08:00
|
|
|
title: 'Name',
|
|
|
|
key: 'name'
|
2018-03-20 19:28:39 +08:00
|
|
|
},
|
|
|
|
{
|
2018-06-29 09:27:32 +08:00
|
|
|
title: 'Age',
|
|
|
|
key: 'age'
|
2018-06-25 20:27:03 +08:00
|
|
|
},
|
|
|
|
{
|
2018-06-29 09:27:32 +08:00
|
|
|
title: 'Address',
|
|
|
|
key: 'address'
|
2018-06-25 20:21:01 +08:00
|
|
|
}
|
|
|
|
],
|
2018-06-29 09:27:32 +08:00
|
|
|
data1: [
|
2018-03-26 14:28:11 +08:00
|
|
|
{
|
2018-06-29 09:27:32 +08:00
|
|
|
name: 'John Brown',
|
|
|
|
age: 18,
|
|
|
|
address: 'New York No. 1 Lake Park',
|
|
|
|
date: '2016-10-03'
|
2018-06-25 20:27:03 +08:00
|
|
|
},
|
|
|
|
{
|
2018-06-29 09:27:32 +08:00
|
|
|
name: 'Jim Green',
|
|
|
|
age: 24,
|
|
|
|
address: 'London No. 1 Lake Park',
|
|
|
|
date: '2016-10-01'
|
2018-06-25 20:27:03 +08:00
|
|
|
},
|
|
|
|
{
|
2018-06-29 09:27:32 +08:00
|
|
|
name: 'Joe Black',
|
|
|
|
age: 30,
|
|
|
|
address: 'Sydney No. 1 Lake Park',
|
|
|
|
date: '2016-10-02'
|
2018-06-25 20:27:03 +08:00
|
|
|
},
|
|
|
|
{
|
2018-06-29 09:27:32 +08:00
|
|
|
name: 'Jon Snow',
|
|
|
|
age: 26,
|
|
|
|
address: 'Ottawa No. 2 Lake Park',
|
|
|
|
date: '2016-10-04'
|
2018-06-25 13:03:08 +08:00
|
|
|
}
|
2018-06-25 20:27:03 +08:00
|
|
|
]
|
|
|
|
}
|
|
|
|
},
|
|
|
|
methods: {
|
2018-06-29 09:27:32 +08:00
|
|
|
handleSelectAll (status) {
|
|
|
|
this.$refs.selection.selectAll(status);
|
2018-06-25 13:03:08 +08:00
|
|
|
}
|
2016-11-23 16:27:17 +08:00
|
|
|
}
|
2017-10-23 19:01:47 +08:00
|
|
|
}
|
2018-06-25 13:03:08 +08:00
|
|
|
</script>
|