feat(Components): introduce `StatusContactRequestsIndicatorListItem`
Usage: ```qml import StatusQ.Components 0.1 StatusContactRequestsIndicatorListItem { title: "Contact requests" requestsCount: 3 sensor.onClicked: ... } ``` Closes #175
This commit is contained in:
parent
bad322e146
commit
48146b2fcf
|
@ -44,7 +44,6 @@ Rectangle {
|
|||
}
|
||||
}
|
||||
|
||||
|
||||
StatusAppLayout {
|
||||
id: statusAppLayout
|
||||
anchors.top: demoApp.top
|
||||
|
@ -173,57 +172,67 @@ Rectangle {
|
|||
text: "Chat"
|
||||
}
|
||||
|
||||
StatusChatList {
|
||||
Column {
|
||||
anchors.top: headline.bottom
|
||||
anchors.topMargin: 16
|
||||
anchors.bottom: parent.bottom
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
width: parent.width
|
||||
spacing: 8
|
||||
|
||||
chatListItems.model: demoChatListItems
|
||||
selectedChatId: "0"
|
||||
|
||||
onChatItemSelected: selectedChatId = id
|
||||
onChatItemUnmuted: {
|
||||
for (var i = 0; i < demoChatListItems.count; i++) {
|
||||
let item = demoChatListItems.get(i);
|
||||
if (item.chatId === id) {
|
||||
demoChatListItems.setProperty(i, "muted", false)
|
||||
}
|
||||
}
|
||||
StatusContactRequestsIndicatorListItem {
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
title: "Contact requests"
|
||||
requestsCount: 3
|
||||
sensor.onClicked: demoContactRequestsModal.open()
|
||||
}
|
||||
|
||||
popupMenu: StatusPopupMenu {
|
||||
StatusChatList {
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
|
||||
property string chatId
|
||||
|
||||
StatusMenuItem {
|
||||
text: "View Profile"
|
||||
icon.name: "group-chat"
|
||||
chatListItems.model: demoChatListItems
|
||||
selectedChatId: "0"
|
||||
onChatItemSelected: selectedChatId = id
|
||||
onChatItemUnmuted: {
|
||||
for (var i = 0; i < demoChatListItems.count; i++) {
|
||||
let item = demoChatListItems.get(i);
|
||||
if (item.chatId === id) {
|
||||
demoChatListItems.setProperty(i, "muted", false)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
StatusMenuSeparator {}
|
||||
popupMenu: StatusPopupMenu {
|
||||
|
||||
StatusMenuItem {
|
||||
text: "Mute chat"
|
||||
icon.name: "notification"
|
||||
}
|
||||
property string chatId
|
||||
|
||||
StatusMenuItem {
|
||||
text: "Mark as Read"
|
||||
icon.name: "checkmark-circle"
|
||||
}
|
||||
StatusMenuItem {
|
||||
text: "View Profile"
|
||||
icon.name: "group-chat"
|
||||
}
|
||||
|
||||
StatusMenuItem {
|
||||
text: "Clear history"
|
||||
icon.name: "close-circle"
|
||||
}
|
||||
StatusMenuSeparator {}
|
||||
|
||||
StatusMenuSeparator {}
|
||||
StatusMenuItem {
|
||||
text: "Mute chat"
|
||||
icon.name: "notification"
|
||||
}
|
||||
|
||||
StatusMenuItem {
|
||||
text: "Delete chat"
|
||||
icon.name: "delete"
|
||||
type: StatusMenuItem.Type.Danger
|
||||
StatusMenuItem {
|
||||
text: "Mark as Read"
|
||||
icon.name: "checkmark-circle"
|
||||
}
|
||||
|
||||
StatusMenuItem {
|
||||
text: "Clear history"
|
||||
icon.name: "close-circle"
|
||||
}
|
||||
|
||||
StatusMenuSeparator {}
|
||||
|
||||
StatusMenuItem {
|
||||
text: "Delete chat"
|
||||
icon.name: "delete"
|
||||
type: StatusMenuItem.Type.Danger
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -508,6 +517,41 @@ Rectangle {
|
|||
}
|
||||
}
|
||||
|
||||
StatusModal {
|
||||
id: demoContactRequestsModal
|
||||
anchors.centerIn: parent
|
||||
|
||||
header.title: "Contact Requests"
|
||||
headerActionButton: StatusFlatRoundButton {
|
||||
type: StatusFlatRoundButton.Type.Secondary
|
||||
width: 32
|
||||
height: 32
|
||||
|
||||
icon.width: 20
|
||||
icon.height: 20
|
||||
icon.name: "notification"
|
||||
}
|
||||
|
||||
content: StatusBaseText {
|
||||
anchors.centerIn: parent
|
||||
text: "Contact request will be shown here"
|
||||
font.pixelSize: 15
|
||||
color: Theme.palette.directColor1
|
||||
}
|
||||
|
||||
rightButtons: [
|
||||
StatusButton {
|
||||
text: "Decline all"
|
||||
type: StatusBaseButton.Type.Danger
|
||||
onClicked: demoContactRequestsModal.close()
|
||||
},
|
||||
StatusButton {
|
||||
text: "Accept all"
|
||||
onClicked: demoContactRequestsModal.close()
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
StatusModal {
|
||||
id: demoCommunityDetailModal
|
||||
|
||||
|
|
|
@ -243,4 +243,8 @@ GridLayout {
|
|||
iconButton.onClicked: tooltip.visible = !tooltip.visible
|
||||
}
|
||||
|
||||
StatusContactRequestsIndicatorListItem {
|
||||
title: "Contact requests"
|
||||
requestsCount: 3
|
||||
}
|
||||
}
|
||||
|
|
|
@ -0,0 +1,30 @@
|
|||
import StatusQ.Core 0.1
|
||||
import StatusQ.Core.Theme 0.1
|
||||
import StatusQ.Components 0.1
|
||||
|
||||
StatusListItem {
|
||||
id: statusContactRequestsListItem
|
||||
|
||||
implicitHeight: 64
|
||||
implicitWidth: 288
|
||||
|
||||
color: sensor.containsMouse ? Theme.palette.baseColor2 : "transparent"
|
||||
|
||||
property int requestsCount: 0
|
||||
|
||||
components: [
|
||||
StatusBadge {
|
||||
value: statusContactRequestsListItem.requestsCount
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
border.width: 4
|
||||
border.color: color
|
||||
},
|
||||
StatusIcon {
|
||||
icon: "chevron-down"
|
||||
rotation: 270
|
||||
color: Theme.palette.baseColor1
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
|
|
@ -8,6 +8,7 @@ StatusChatListCategory 0.1 StatusChatListCategory.qml
|
|||
StatusChatListCategoryItem 0.1 StatusChatListCategoryItem.qml
|
||||
StatusChatListAndCategories 0.1 StatusChatListAndCategories.qml
|
||||
StatusChatToolBar 0.1 StatusChatToolBar.qml
|
||||
StatusContactRequestsIndicatorListItem 0.1 StatusContactRequestsIndicatorListItem.qml
|
||||
StatusDescriptionListItem 0.1 StatusDescriptionListItem.qml
|
||||
StatusLetterIdenticon 0.1 StatusLetterIdenticon.qml
|
||||
StatusListItem 0.1 StatusListItem.qml
|
||||
|
|
|
@ -21,6 +21,7 @@
|
|||
<file>src/StatusQ/Components/StatusChatListItem.qml</file>
|
||||
<file>src/StatusQ/Components/StatusChatListAndCategories.qml</file>
|
||||
<file>src/StatusQ/Components/StatusChatInfoToolBar.qml</file>
|
||||
<file>src/StatusQ/Components/StatusContactRequestsIndicatorListItem.qml</file>
|
||||
<file>src/StatusQ/Components/StatusNavigationListItem.qml</file>
|
||||
<file>src/StatusQ/Components/StatusNavigationPanelHeadline.qml</file>
|
||||
<file>src/StatusQ/Components/StatusChatToolBar.qml</file>
|
||||
|
|
Loading…
Reference in New Issue