160 lines
4.5 KiB
QML
160 lines
4.5 KiB
QML
|
import QtQuick
|
|||
|
import QtQuick.Controls
|
|||
|
import QtQuick.Layouts
|
|||
|
import QtQuick.Window
|
|||
|
import FluentUI
|
|||
|
import "../component"
|
|||
|
|
|||
|
FluScrollablePage{
|
|||
|
|
|||
|
title:"TableView"
|
|||
|
leftPadding:10
|
|||
|
rightPadding:10
|
|||
|
bottomPadding:20
|
|||
|
spacing: 0
|
|||
|
|
|||
|
Component.onCompleted: {
|
|||
|
const columns = [
|
|||
|
{
|
|||
|
title: '姓名',
|
|||
|
dataIndex: 'name',
|
|||
|
width:100
|
|||
|
},
|
|||
|
{
|
|||
|
title: '年龄',
|
|||
|
dataIndex: 'age',
|
|||
|
width:100
|
|||
|
},
|
|||
|
{
|
|||
|
title: '住址',
|
|||
|
dataIndex: 'address',
|
|||
|
width:200
|
|||
|
},
|
|||
|
{
|
|||
|
title: '别名',
|
|||
|
dataIndex: 'nickname',
|
|||
|
width:100
|
|||
|
},
|
|||
|
{
|
|||
|
title: '操作',
|
|||
|
dataIndex: 'action',
|
|||
|
width:100
|
|||
|
},
|
|||
|
];
|
|||
|
table_view.columns = columns
|
|||
|
loadData(1,10)
|
|||
|
}
|
|||
|
|
|||
|
FluTableView{
|
|||
|
id:table_view
|
|||
|
Layout.fillWidth: true
|
|||
|
Layout.topMargin: 20
|
|||
|
pageCurrent:1
|
|||
|
pageCount:10
|
|||
|
itemCount: 1000
|
|||
|
onRequestPage:
|
|||
|
(page,count)=> {
|
|||
|
loadData(page,count)
|
|||
|
}
|
|||
|
}
|
|||
|
|
|||
|
Component{
|
|||
|
id:com_action
|
|||
|
Item{
|
|||
|
Row{
|
|||
|
anchors.centerIn: parent
|
|||
|
spacing: 10
|
|||
|
FluFilledButton{
|
|||
|
text:"编辑"
|
|||
|
topPadding:3
|
|||
|
bottomPadding:3
|
|||
|
leftPadding:3
|
|||
|
rightPadding:3
|
|||
|
onClicked:{
|
|||
|
console.debug(dataModel.index)
|
|||
|
showSuccess(JSON.stringify(dataObject))
|
|||
|
}
|
|||
|
}
|
|||
|
FluFilledButton{
|
|||
|
text:"删除"
|
|||
|
topPadding:3
|
|||
|
bottomPadding:3
|
|||
|
leftPadding:3
|
|||
|
rightPadding:3
|
|||
|
onClicked:{
|
|||
|
showError(JSON.stringify(dataObject))
|
|||
|
}
|
|||
|
}
|
|||
|
}
|
|||
|
}
|
|||
|
}
|
|||
|
|
|||
|
function loadData(page,count){
|
|||
|
const dataSource = []
|
|||
|
for(var i=0;i<count;i++){
|
|||
|
dataSource.push({
|
|||
|
name: "孙悟空%1".arg(((page-1)*count+i)),
|
|||
|
age: 500,
|
|||
|
address: "钟灵毓秀的花果山,如神仙仙境的水帘洞",
|
|||
|
nickname: "齐天大圣",
|
|||
|
action:com_action
|
|||
|
})
|
|||
|
}
|
|||
|
table_view.dataSource = dataSource
|
|||
|
}
|
|||
|
|
|||
|
CodeExpander{
|
|||
|
Layout.fillWidth: true
|
|||
|
Layout.topMargin: 10
|
|||
|
code:'FluTableView{
|
|||
|
id:table_view
|
|||
|
Layout.fillWidth: true
|
|||
|
Layout.topMargin: 20
|
|||
|
pageCurrent:1
|
|||
|
pageCount:10
|
|||
|
itemCount: 1000
|
|||
|
onRequestPage:
|
|||
|
(page,count)=> {
|
|||
|
loadData(page,count)
|
|||
|
}
|
|||
|
Component.onCompleted: {
|
|||
|
const columns = [
|
|||
|
{
|
|||
|
title: "姓名",
|
|||
|
dataIndex: "name",
|
|||
|
width:100
|
|||
|
},
|
|||
|
{
|
|||
|
title: "年龄",
|
|||
|
dataIndex: "age",
|
|||
|
width:100
|
|||
|
},
|
|||
|
{
|
|||
|
title: "住址",
|
|||
|
dataIndex: "address",
|
|||
|
width:200
|
|||
|
},
|
|||
|
{
|
|||
|
title: "别名",
|
|||
|
dataIndex: "nickname",
|
|||
|
width:100
|
|||
|
}
|
|||
|
];
|
|||
|
table_view.columns = columns
|
|||
|
const dataSource = [
|
|||
|
{
|
|||
|
name: "孙悟空”,
|
|||
|
age: 500,
|
|||
|
address:"钟灵毓秀的花果山,如神仙仙境的水帘洞",
|
|||
|
nickname:"齐天大圣"
|
|||
|
}
|
|||
|
];
|
|||
|
table_view.dataSource = columns
|
|||
|
}
|
|||
|
}'
|
|||
|
}
|
|||
|
|
|||
|
|
|||
|
|
|||
|
}
|