77 lines
1.5 KiB
JavaScript
77 lines
1.5 KiB
JavaScript
|
|
export default `<template>
|
||
|
|
<div>
|
||
|
|
<d2-crud
|
||
|
|
:columns="columns"
|
||
|
|
:data="data"
|
||
|
|
title="D2 CRUD"
|
||
|
|
:rowHandle="rowHandle"
|
||
|
|
@row-remove="handleRowRemove"/>
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
export default {
|
||
|
|
data () {
|
||
|
|
return {
|
||
|
|
columns: [
|
||
|
|
{
|
||
|
|
title: '日期',
|
||
|
|
key: 'date'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
title: '姓名',
|
||
|
|
key: 'name'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
title: '地址',
|
||
|
|
key: 'address'
|
||
|
|
}
|
||
|
|
],
|
||
|
|
data: [
|
||
|
|
{
|
||
|
|
date: '2016-05-02',
|
||
|
|
name: '王小虎',
|
||
|
|
address: '上海市普陀区金沙江路 1518 弄'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
date: '2016-05-04',
|
||
|
|
name: '王小虎',
|
||
|
|
address: '上海市普陀区金沙江路 1517 弄'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
date: '2016-05-01',
|
||
|
|
name: '王小虎',
|
||
|
|
address: '上海市普陀区金沙江路 1519 弄'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
date: '2016-05-03',
|
||
|
|
name: '王小虎',
|
||
|
|
address: '上海市普陀区金沙江路 1516 弄'
|
||
|
|
}
|
||
|
|
],
|
||
|
|
rowHandle: {
|
||
|
|
remove: {
|
||
|
|
icon: 'el-icon-delete',
|
||
|
|
size: 'small',
|
||
|
|
fixed: 'right',
|
||
|
|
confirm: true
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
handleRowRemove ({index, row}, done) {
|
||
|
|
setTimeout(() => {
|
||
|
|
console.log(index)
|
||
|
|
console.log(row)
|
||
|
|
this.$message({
|
||
|
|
message: '删除成功',
|
||
|
|
type: 'success'
|
||
|
|
})
|
||
|
|
done()
|
||
|
|
}, 300)
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</script>`
|