TG-PlatformPlus/qml/PageInterface.qml

885 lines
34 KiB
QML
Raw Blame History

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

import QtQuick
import QtQuick.Controls
import QtQuick.Layouts
import QtQuick.Dialogs
import "./common"
Item {
id: self
property var systemInterfaceUuid: ""
property var interfacetypeNames: []
property var interfacetypes: []
property var serialPorts: []
property var serialBuadRates: ["9600", "19200", "38400", "115200"]
property var serialStopBits: ["1", "1.5", "2"]
property var serialParity: ["None", "Odd", "Even", "Mark", "Space"]
property var serialByteSize: ["8", "7", "6", "5"]
property var tcpRole: ["服务器", "客户端"]
property var settingData: null
property var supportType: {}
signal refreshSerial
signal beginSaveSerial
Component.onCompleted: {
initInterFace()
createAddButton()
getAvailablePorts()
loadInterface()
}
ListModel {
id: interfaceModel
}
Component {
id: contactDelegate
Rectangle {
width: 283
height: 311
radius: 9
color: "#ffffff"
property var rowIndex : model.index
Component.onCompleted: {
cbCom.currentIndex = cbCom.find(serialPort)
var baudrateIndex = cbBuad.find(baudrate)
if(baudrateIndex == -1 )
{
if(baudrate != "")
{
var tempSerialBuadRates = ["9600", "19200", "38400", "115200"]
tempSerialBuadRates.push(baudrate)
cbBuad.model = tempSerialBuadRates
cbBuad.currentIndex = cbBuad.find(baudrate)
}
}
else
{
cbBuad.currentIndex = baudrateIndex
}
cbRole.currentIndex = cbRole.find(role) > -1 ? cbRole.find(role) : 0
cbParity.currentIndex = cbParity.find(parity) > -1 ? cbParity.find(parity) : 0
cbStopBits.currentIndex = cbStopBits.find(stopbits) > -1 ? cbStopBits.find(stopbits) : 0
cbByteSize.currentIndex = cbByteSize.find(bytesize) > -1 ? cbByteSize.find(bytesize) : 0
}
Connections{
target: self
function onRefreshSerial()
{
cbCom.currentIndex = cbCom.find(serialPort)
cbBuad.currentIndex = cbBuad.find(baudrate)
cbRole.currentIndex = cbRole.find(role)
}
function onBeginSaveSerial()
{
model.serialPort = cbCom.currentText
if(cbBuad.editText == "")
model.baudrate = cbBuad.currentText
else
model.baudrate = cbBuad.editText
model.stopbits = cbStopBits.currentText
model.parity = cbParity.currentText
model.bytesize = cbByteSize.currentText
model.role = cbRole.currentText
}
}
Rectangle {
anchors.fill: parent
radius: 9
color: "#ffffff"
visible: model.id != "add"
Column {
spacing: 9
anchors.horizontalCenter: parent.horizontalCenter
anchors.top: parent.top
anchors.topMargin: 10
Item {
width: 233
height: 25
Rectangle {
id: control
anchors.left: parent.left
visible: model.id != systemInterfaceUuid && type != "http"
property var checked: false
property var realChecked: false
implicitWidth: 40
implicitHeight: 20
radius: 20
smooth: true
color: control.checked ? "#3096ff" : "#ffffff"
border.color: control.checked ? "#3096ff" : "#cccccc"
Rectangle {
x: control.checked ? parent.width - width : 0
width: 20
height: 20
radius: 10
smooth: true
color: control.down ? "#cccccc" : "#ffffff"
border.color: control.checked ? (control.down ? "#3096ff" : "#3096ff") : "#999999"
}
Component.onCompleted: {
control.realChecked = interfaceManager.isConnect(model.id)
control.checked = control.realChecked
}
Connections {
target: interfaceManager
function onConnectSuccess(_id)
{
if(model.id == _id)
{
control.realChecked = true
control.checked = true
}
}
function onConnectClosed(_id)
{
if(model.id == _id)
{
control.realChecked = false
control.checked = false
}
}
function onConnectFailed(_id)
{
if(model.id == _id)
{
// connectErrorDialog.visible = true
control.realChecked = false
control.checked = false
}
}
}
MouseArea{
anchors.fill: parent
onClicked: {
editCtrl.checked = false
if(control.realChecked == false)
{
interfaceManager.open(model.id)
}
else
{
if(interfaceManager.close(model.id))
control.realChecked = false
}
control.checked = control.realChecked
if(!control.checked)
{
cbAutoReconnect.checked = false
interfaceManager.stopAutoReconnect(model.id)
model.auto = "false"
updateInterface(model.index)
}
}
}
}
CheckBox{
id: cbAutoReconnect
anchors.left: control.right
anchors.leftMargin: 40
anchors.verticalCenter: control.verticalCenter
visible: control.visible
font.pointSize: 9
checked: model.auto == "true" ? true : false
text: "自动连接"
onClicked: {
if (checked) {
interfaceManager.startAutoReconnect(model.id)
model.auto = "true"
} else {
interfaceManager.stopAutoReconnect(model.id)
model.auto = "false"
}
updateInterface(model.index)
}
}
// Switch{
// id: control
// anchors.left: parent.left
// checked: false
// property var realChecked: false
// visible: model.id != systemInterfaceUuid && type != "http"
// indicator: Rectangle {
// implicitWidth: 40
// implicitHeight: 20
// radius: 20
// smooth: true
// color: control.checked ? "#3096ff" : "#ffffff"
// border.color: control.checked ? "#3096ff" : "#cccccc"
// Rectangle {
// x: control.checked ? parent.width - width : 0
// width: 20
// height: 20
// radius: 10
// smooth: true
// color: control.down ? "#cccccc" : "#ffffff"
// border.color: control.checked ? (control.down ? "#3096ff" : "#3096ff") : "#999999"
// }
// }
// Connections {
// target: interfaceManager
// function onConnectSuccess(_id)
// {
// if(model.id == _id)
// {
// control.realChecked = true
// control.checked = true
// }
// }
// function onConnectFailed(_id)
// {
// if(model.id == _id)
// {
// // connectErrorDialog.visible = true
// control.realChecked = false
// control.checked = false
// }
// }
// }
// onClicked: {
// editCtrl.checked = false
// if(realChecked == false)
// {
// interfaceManager.open(model.id)
// }
// else
// {
// if(interfaceManager.close(model.id))
// realChecked = false
// }
// checked = realChecked
// }
// }
Image
{
id: editCtrl
property var checked: false
anchors.right: removeBtn.left
anchors.rightMargin: 10
width: 26
height: 26
visible: model.id != systemInterfaceUuid
enabled: !control.checked
source: checked ? "./resource/finish.svg" : "./resource/edit.svg"
MouseArea
{
anchors.fill: parent
onClicked: {
// 如果当前在编辑模式checked为true表示正在编辑点击后变为完成需要保存数据
if(editCtrl.checked)
{
updateInterface(model.index)
}
editCtrl.checked = !editCtrl.checked
}
}
}
Image
{
id: removeBtn
anchors.right: parent.right
anchors.rightMargin: -18
width: 26
height: 26
visible: model.id != systemInterfaceUuid
source: "./resource/remove.svg"
MouseArea
{
anchors.fill: parent
onClicked: {
deleteDialog.visible = true
deleteDialog.index = index
}
}
}
}
Item {
width: 233
height: 28
Text {
text: "类型"
font.pointSize: 11
color: "#737373"
anchors.verticalCenter: parent.verticalCenter
}
TextField {
id: tfType
height: parent.height
text: !!type ? supportType[type] : ""
verticalAlignment: TextInput.AlignVCenter
width: 150
anchors.right: parent.right
enabled: false
}
}
Item {
width: 233
height: 28
Text {
text: "名称"
font.pointSize: 11
color: "#737373"
anchors.verticalCenter: parent.verticalCenter
}
TextField {
id: tfName
text: name
verticalAlignment: TextInput.AlignVCenter
width: 150
height: parent.height
enabled: editCtrl.checked
selectByMouse: true
anchors.right: parent.right
onTextChanged: {
if (text != model.name)
{
model.name = text
updateInterface(model.index)
}
}
}
}
Item {
width: 233
height: 28
visible: type == "serial" || type == "tbus" || type == "tbus_ns"
Text {
text: "端口"
font.pointSize: 11
color: "#737373"
anchors.verticalCenter: parent.verticalCenter
}
ComboBox{
id: cbCom
width: 150
height: parent.height
model:serialPorts
enabled: editCtrl.checked
anchors.right: parent.right
onActivated: {
updateInterface(rowIndex)
}
}
MouseArea{
anchors.fill: parent
propagateComposedEvents: false
onPressed:(mouse)=> {
// 刷新串口
getAvailablePorts()
refreshSerial()
mouse.accepted = false
}
}
}
Item {
width: 233
height: 28
visible: type == "serial" || type == "tbus" || type == "tbus_ns"
Text {
text: "波特率"
font.pointSize: 11
color: "#737373"
anchors.verticalCenter: parent.verticalCenter
}
ComboBox{
id: cbBuad
width: 150
height: parent.height
editable: true
enabled: editCtrl.checked
model:serialBuadRates
anchors.right: parent.right
onActivated: {
updateInterface(rowIndex)
}
onEditTextChanged:{
updateInterface(rowIndex)
}
}
}
Item {
width: 233
height: 28
visible: type == "serial" || type == "tbus" || type == "tbus_ns"
Text {
text: "数据位"
font.pointSize: 11
color: "#737373"
anchors.verticalCenter: parent.verticalCenter
}
ComboBox{
id: cbByteSize
width: 150
height: parent.height
// editable: true
enabled: editCtrl.checked
model:serialByteSize
anchors.right: parent.right
onActivated: {
updateInterface(rowIndex)
}
}
}
Item {
width: 233
height: 28
visible: type == "serial" || type == "tbus" || type == "tbus_ns"
Text {
text: "停止位"
font.pointSize: 11
color: "#737373"
anchors.verticalCenter: parent.verticalCenter
}
ComboBox{
id: cbStopBits
width: 150
height: parent.height
// editable: true
enabled: editCtrl.checked
model:serialStopBits
anchors.right: parent.right
onActivated: {
updateInterface(rowIndex)
}
}
}
Item {
width: 233
height: 28
visible: type == "serial" || type == "tbus" || type == "tbus_ns"
Text {
text: "奇偶校验"
font.pointSize: 11
color: "#737373"
anchors.verticalCenter: parent.verticalCenter
}
ComboBox{
id: cbParity
width: 150
height: parent.height
// editable: true
enabled: editCtrl.checked
model:serialParity
anchors.right: parent.right
onActivated: {
updateInterface(rowIndex)
}
}
}
Item {
width: 233
height: 28
visible: type == "tcp" || type == "tbus_tcp"
Text {
text: "角色"
font.pointSize: 11
color: "#737373"
anchors.verticalCenter: parent.verticalCenter
}
ComboBox{
id: cbRole
width: 150
height: parent.height
model:tcpRole
enabled: editCtrl.checked
anchors.right: parent.right
onActivated: {
updateInterface(rowIndex)
}
}
}
Item {
width: 233
height: 28
visible: type == "tcp" || type == "tbus_tcp"
Text {
text: "IP"
font.pointSize: 11
color: "#737373"
anchors.verticalCenter: parent.verticalCenter
}
TextField{
id: cbIp
width: 150
text: ip
verticalAlignment: TextInput.AlignVCenter
height: parent.height
enabled: editCtrl.checked
selectByMouse: true
anchors.right: parent.right
onTextChanged: {
if (text != model.ip)
{
model.ip = text
updateInterface(rowIndex)
}
}
}
}
Item {
width: 233
height: 28
visible: type == "tcp" || type == "tbus_tcp"
Text {
text: "端口号"
font.pointSize: 11
color: "#737373"
anchors.verticalCenter: parent.verticalCenter
}
TextField{
id: tfPort
width: 150
height: parent.height
text: port
enabled: editCtrl.checked
verticalAlignment: TextInput.AlignVCenter
selectByMouse: true
anchors.right: parent.right
onTextChanged: {
if(text != model.port)
{
model.port = text
updateInterface(rowIndex)
}
}
}
}
}
}
Item {
anchors.fill: parent
visible: model.id == "add"
Image{
id: imgAdd
anchors.centerIn: parent
source: "./resource/add.svg"
}
MouseArea{
anchors.fill: parent
hoverEnabled: true
onEntered:{
imgAdd.scale = 0.9
}
onExited: {
imgAdd.scale = 1
}
onClicked:{
dialog.visible = true
}
}
}
}
}
GridView {
clip: true
anchors.left: parent.left
anchors.right: parent.right
anchors.bottom: parent.bottom
anchors.top: parent.top
anchors.leftMargin: 10
anchors.topMargin: 18
flow: GridView.FlowLeftToRight
cellWidth: 293; cellHeight: 321
delegate: contactDelegate
model: interfaceModel
boundsBehavior: Flickable.StopAtBounds
}
function initInterFace()
{
supportType = interfaceManager.getSupportedType()
interfacetypes = []
interfacetypeNames = []
for (var key in supportType)
{
interfacetypes.push(key)
interfacetypeNames.push(supportType[key])
}
cbInterfaceType.model = interfacetypeNames
}
function createAddButton(){
interfaceModel.append({
'id': "add",
'name': "",
'type': "",
'auto': "",
'serialPort': "",
'baudrate': "",
'parity': "",
'bytesize': "",
'stopbits': "",
'role':"",
'ip':"",
'port':""
})
}
function createInterface(obj)
{
var name = obj.name
var type = obj.type
var attr = {}
var interfaceId = interfaceManager.create(name, type, attr)
if(interfaceId != "")
{
obj.id = interfaceId
interfaceModel.insert(interfaceModel.count-1, obj)
}
}
function deleteInterface(index)
{
var obj = interfaceModel.get(index)
var interfaceId = obj.id
if(interfaceManager.delete(interfaceId))
{
interfaceModel.remove(index)
}
}
function updateInterface(index)
{
beginSaveSerial()
var obj = interfaceModel.get(index)
var interfaceId = obj.id
if (interfaceId == systemInterfaceUuid)
return
var name = obj.name
var type = obj.type
var attr = {}
if (type == "tcp" || type == "tbus_tcp")
{
attr = {
"auto": obj.auto,
"role": obj.role,
"ip": obj.ip,
"port": obj.port
}
}
else
{
attr = {
"auto": obj.auto,
"port": obj.serialPort,
"baudrate":obj.baudrate,
"parity": obj.parity,
"bytesize": obj.bytesize,
"stopbits": obj.stopbits,
}
}
interfaceManager.update(interfaceId, name, attr)
}
function loadInterface(){
systemInterfaceUuid = common.getSystemInterfaceUuid()
var interfaceList = interfaceManager.getInfo("all")
if(!!interfaceList)
{
for(var i = 0; i < interfaceList.length; ++i)
{
var interfaceObj = interfaceList[i]
var obj = {
'id': interfaceObj.id,
'name': interfaceObj.name,
'type': interfaceObj.type,
'auto': "auto" in interfaceObj.attrs ? interfaceObj.attrs.auto : "false",
'serialPort': "port" in interfaceObj.attrs ? interfaceObj.attrs.port : "",
'baudrate': "baudrate" in interfaceObj.attrs ? interfaceObj.attrs.baudrate : "" ,
'parity': "parity" in interfaceObj.attrs ? interfaceObj.attrs.parity : "",
'bytesize': "bytesize" in interfaceObj.attrs ? interfaceObj.attrs.bytesize : "",
'stopbits': "stopbits" in interfaceObj.attrs ? interfaceObj.attrs.stopbits : "",
'role': "role" in interfaceObj.attrs ? interfaceObj.attrs.role : "",
'ip': "ip" in interfaceObj.attrs ? interfaceObj.attrs.ip : "",
'port': "port" in interfaceObj.attrs ? interfaceObj.attrs.port : "",
}
interfaceModel.insert(interfaceModel.count - 1, obj)
if(obj.auto == "true")
{
interfaceManager.startAutoReconnect(obj.id)
}
}
}
}
function getAvailablePorts(){
serialPorts = common.getComList()
}
Dialog{
id: dialog
visible: false
anchors.centerIn: parent
width : 465
height: 230
title: "添加接口"
onAccepted:{
createInterface({
name: tfInterfaceName.text,
type: interfacetypes[cbInterfaceType.currentIndex]
})
dialog.close()
}
contentItem:Rectangle{
Column{
spacing: 15
anchors.centerIn: parent
Item {
width: 332
height: 32
Text { text: "名称" }
TextField {
id: tfInterfaceName
width: 286
height: 32
selectByMouse: true
anchors.right: parent.right
}
}
Item {
width: 332
height: 32
Text { text: "类型" }
ComboBox{
id: cbInterfaceType
width: 286
height: 32
anchors.right: parent.right
}
}
Item
{
width: 332
height: 50
Row
{
anchors.centerIn: parent
spacing: 21
Button{
text:"添加"
width: 80
height: 32
onClicked: dialog.accepted()
}
Button{
text:"取消"
width: 80
height: 32
onClicked: dialog.close()
}
}
}
}
}
}
Dialog{
id: deleteDialog
visible: false
property var index: 0
anchors.centerIn: parent
width : 342
height: 160
title: "提示"
onAccepted:{
deleteInterface(index)
deleteDialog.close()
}
contentItem:Rectangle{
Column
{
anchors.centerIn: parent
spacing: 30
Item{
width: 181
height: 32
Text{
anchors.centerIn: parent
font.pointSize: 12
text: "是否继续删除?"
}
}
Item
{
width: 181
height: 32
Row
{
anchors.centerIn: parent
spacing: 10
Button{
text:"确定"
width: 80
height: 32
onClicked: deleteDialog.accepted()
}
Button{
text:"取消"
width: 80
height: 32
onClicked: deleteDialog.close()
}
}
}
}
}
}
Dialog{
id: connectErrorDialog
visible: false
property var index: 0
anchors.centerIn: parent
width : 270
height: 160
title: "提示"
onAccepted:{
deleteInterface(index)
deleteDialog.close()
}
contentItem:Rectangle{
Column
{
anchors.centerIn: parent
spacing: 30
Text{
font.pointSize: 12
text: " 连接失败"
}
Button{
text:"确定"
width: 80
height: 32
onClicked: connectErrorDialog.close()
}
}
}
}
}