status-desktop/ui/app/AppLayouts/Chat/controls/community/PermissionItem.qml

220 lines
7.2 KiB
QML
Raw Normal View History

import QtQuick 2.3
import QtQuick.Controls 2.13
import QtQuick.Layouts 1.14
import StatusQ.Core.Theme 0.1
import StatusQ.Core 0.1
import StatusQ.Controls 0.1
import StatusQ.Components 0.1
import StatusQ.Core.Utils 0.1
Control{
id: root
property var holdingsListModel
property string permissionName
property var permissionImageSource
property var channelsListModel
property bool isPrivate: false
signal editClicked
signal duplicateClicked
signal removeClicked
QtObject {
id: d
readonly property int flowRowHeight: 32
readonly property int commonMargin: 16
readonly property int designRadius: 16
readonly property int itemTextPixelSize: 17
readonly property int tagTextPixelSize: 15
readonly property int buttonTextPixelSize: 12
readonly property int buttonDiameter: 36
readonly property int buttonTextSpacing: 6
}
background: Rectangle {
color: "transparent"
border.color: Theme.palette.baseColor2
border.width: 1
radius: d.designRadius
}
contentItem: ColumnLayout {
spacing: 0
Rectangle {
id: header
color: Theme.palette.baseColor2
Layout.fillWidth: true
Layout.preferredHeight: 34
radius: d.designRadius
RowLayout {
anchors.fill: parent
spacing: 8
StatusIcon {
Layout.leftMargin: 19
icon: "checkmark"
Layout.preferredWidth: 11
Layout.preferredHeight: 8
color: Theme.palette.directColor1
}
StatusBaseText {
Layout.fillWidth: true
text: qsTr("Active")
font.pixelSize: d.tagTextPixelSize
}
StatusIcon {
Layout.rightMargin: 10
visible: root.isPrivate
icon: "hide"
color: Theme.palette.baseColor1
}
}
}
Flow {
id: content
Layout.fillWidth: true
Layout.fillHeight: true
Layout.topMargin: 8
Layout.rightMargin: d.commonMargin
Layout.leftMargin: d.commonMargin
Layout.bottomMargin: 20
spacing: 6
StatusBaseText {
font.pixelSize: d.itemTextPixelSize
height: d.flowRowHeight
text: qsTr("Anyone who holds")
verticalAlignment: Text.AlignVCenter
}
Repeater {
model: root.holdingsListModel
StatusListItemTag {
height: d.flowRowHeight
width: (implicitWidth > content.width) ? content.width : implicitWidth
leftPadding: 2
title: model.text
asset.name: model.imageSource
asset.isImage: true
asset.bgColor: "transparent"
asset.height: 28
asset.width: asset.height
closeButtonVisible: false
titleText.color: Theme.palette.primaryColor1
titleText.font.pixelSize: d.tagTextPixelSize
}
}
StatusBaseText {
height: d.flowRowHeight
font.pixelSize: d.itemTextPixelSize
text: qsTr("is allowed to")
verticalAlignment: Text.AlignVCenter
}
StatusListItemTag {
height: d.flowRowHeight
title: root.permissionName
asset.name: root.permissionImageSource
asset.isImage: false
asset.bgColor: "transparent"
closeButtonVisible: false
titleText.color: Theme.palette.primaryColor1
titleText.font.pixelSize: d.tagTextPixelSize
}
StatusBaseText {
height: d.flowRowHeight
font.pixelSize: d.itemTextPixelSize
text: qsTr("in")
verticalAlignment: Text.AlignVCenter
}
Repeater {
model: root.channelsListModel
StatusListItemTag {
height: d.flowRowHeight
width: (implicitWidth > content.width) ? content.width : implicitWidth
title: model.text
asset.name: model.imageSource
asset.isImage: true
asset.bgColor: "transparent"
closeButtonVisible: false
titleText.color: Theme.palette.primaryColor1
titleText.font.pixelSize: d.tagTextPixelSize
}
}
}
RowLayout {
id: footer
spacing: 85
Layout.fillWidth: true
Layout.bottomMargin: d.commonMargin
Layout.alignment: Qt.AlignHCenter
ColumnLayout {
spacing: d.buttonTextSpacing
StatusRoundButton {
Layout.alignment: Qt.AlignHCenter
icon.name: "edit_pencil"
Layout.preferredHeight: d.buttonDiameter
Layout.preferredWidth: Layout.preferredHeight
type: StatusRoundButton.Type.Primary
onClicked: root.editClicked()
}
StatusBaseText {
Layout.alignment: Qt.AlignHCenter
text: qsTr("Edit")
color: Theme.palette.primaryColor1
font.pixelSize: d.buttonTextPixelSize
}
}
ColumnLayout {
spacing: d.buttonTextSpacing
StatusRoundButton {
Layout.alignment: Qt.AlignHCenter
icon.name: "copy"
Layout.preferredHeight: d.buttonDiameter
Layout.preferredWidth: Layout.preferredHeight
type: StatusRoundButton.Type.Primary
onClicked: root.duplicateClicked()
}
StatusBaseText {
Layout.alignment: Qt.AlignHCenter
text: qsTr("Duplicate")
color: Theme.palette.primaryColor1
font.pixelSize: d.buttonTextPixelSize
}
}
ColumnLayout {
spacing: d.buttonTextSpacing
StatusRoundButton {
Layout.alignment: Qt.AlignHCenter
icon.name: "delete"
Layout.preferredHeight: d.buttonDiameter
Layout.preferredWidth: Layout.preferredHeight
type: StatusRoundButton.Type.Quaternary
onClicked: root.removeClicked()
}
StatusBaseText {
Layout.alignment: Qt.AlignHCenter
text: qsTr("Delete")
color: Theme.palette.dangerColor1
font.pixelSize: d.buttonTextPixelSize
}
}
}
}
}