forked from Big-Data-Lab/CET-cmd-2.0
81 lines
1.8 KiB
Java
81 lines
1.8 KiB
Java
<template>
|
||
<a-card :bordered="false">
|
||
<j-tree-table
|
||
:url="url"
|
||
topValue="0"
|
||
queryKey="id"
|
||
:columns="columns"
|
||
:tableProps="tableProps">
|
||
|
||
<template v-slot:action="props">
|
||
<!-- 可使用的参数： -->
|
||
<!-- props.text -->
|
||
<!-- props.record -->
|
||
<!-- props.index -->
|
||
<a @click="()=>handleEdit(props.record)">编辑</a>
|
||
</template>
|
||
|
||
</j-tree-table>
|
||
</a-card>
|
||
</template>
|
||
|
||
<script>
|
||
import JTreeTable from '@/components/jeecg/JTreeTable'
|
||
|
||
export default {
|
||
name: 'JeecgTreeTable',
|
||
components: { JTreeTable },
|
||
data() {
|
||
return {
|
||
url: '/mock/api/asynTreeList',
|
||
columns: [
|
||
{
|
||
title: '菜单名称',
|
||
dataIndex: 'name'
|
||
},
|
||
{
|
||
title: '组件',
|
||
dataIndex: 'component'
|
||
},
|
||
{
|
||
title: '排序',
|
||
dataIndex: 'orderNum'
|
||
},
|
||
{
|
||
title: '操作',
|
||
dataIndex: 'action',
|
||
scopedSlots: { customRender: 'action' }
|
||
}
|
||
],
|
||
selectedRowKeys: []
|
||
}
|
||
},
|
||
computed: {
|
||
tableProps() {
|
||
let _this = this
|
||
return {
|
||
// 列表项是否可选择
|
||
// https://vue.ant.design/components/table-cn/#rowSelection
|
||
rowSelection: {
|
||
selectedRowKeys: _this.selectedRowKeys,
|
||
onChange: (selectedRowKeys) => _this.selectedRowKeys = selectedRowKeys
|
||
}
|
||
}
|
||
}
|
||
},
|
||
methods: {
|
||
handleEdit(record) {
|
||
this.$info({
|
||
width: 600,
|
||
title: '编辑',
|
||
content: '编辑ID：' + record.id+"；名称："+record.name,
|
||
okText: '确定',
|
||
maskClosable: true
|
||
})
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style scoped></style>
|