fix(StatusAssetSelector): Reimplemented using `StatusComboBox`
This commit is contained in:
Igor Sirotin
Lukáš Tinkl
parent
72cc269ae6
commit
6e495596c6
|
|
@ -1 +1 @@
|
|||
Subproject commit 63ff9b82d1f13c063dddbb244a255a9886705fc7
|
||||
Subproject commit cff836280f3b9e1671518568fe1884f286b36054
|
||||
|
|
@ -2,8 +2,6 @@ import QtQuick 2.13
|
|||
import QtQuick.Controls 2.13
|
||||
import QtQuick.Layouts 1.13
|
||||
|
||||
import utils 1.0
|
||||
|
||||
import StatusQ.Core 0.1
|
||||
import StatusQ.Core.Theme 0.1
|
||||
import StatusQ.Core.Utils 0.1
|
||||
|
|
@ -12,159 +10,150 @@ import StatusQ.Components 0.1
|
|||
|
||||
Item {
|
||||
id: root
|
||||
|
||||
property var assets
|
||||
property var selectedAsset
|
||||
property string defaultToken
|
||||
property string userSelectedToken
|
||||
property string defaultToken: ""
|
||||
property string userSelectedToken: ""
|
||||
property var tokenAssetSourceFn: function (symbol) {
|
||||
return ""
|
||||
}
|
||||
|
||||
// Define this in the usage to get balance in currency selected by user
|
||||
property var getCurrencyBalanceString: function (currencyBalance) { return "" }
|
||||
implicitWidth: select.width
|
||||
implicitHeight: 48
|
||||
|
||||
function resetInternal() {
|
||||
assets = null
|
||||
selectedAsset = null
|
||||
}
|
||||
|
||||
implicitWidth: 106
|
||||
implicitHeight: comboBox.implicitHeight
|
||||
|
||||
onSelectedAssetChanged: {
|
||||
if (selectedAsset && selectedAsset.symbol) {
|
||||
iconImg.image.source = tokenAssetSourceFn(selectedAsset.symbol.toUpperCase())
|
||||
selectedTextField.text = selectedAsset.symbol.toUpperCase()
|
||||
d.iconSource = tokenAssetSourceFn(selectedAsset.symbol.toUpperCase())
|
||||
d.text = selectedAsset.symbol.toUpperCase()
|
||||
}
|
||||
}
|
||||
|
||||
StatusSelect {
|
||||
id: select
|
||||
width: visualRect.width
|
||||
model: root.assets
|
||||
caretVisible: false
|
||||
caretRightMargin: 0
|
||||
bgColor: Style.current.transparent
|
||||
bgColorHover: Theme.palette.directColor8
|
||||
select.radius: 16
|
||||
select.height: root.height
|
||||
selectMenu.width: 342
|
||||
selectMenu.height: 416
|
||||
selectedItemComponent: Rectangle {
|
||||
id: visualRect
|
||||
width: row.width + Style.current.padding
|
||||
QtObject {
|
||||
id: d
|
||||
property string iconSource: ""
|
||||
property string text: ""
|
||||
}
|
||||
|
||||
StatusComboBox {
|
||||
id: comboBox
|
||||
|
||||
width: parent.width
|
||||
height: parent.height
|
||||
color: Style.current.transparent
|
||||
border.width: 1
|
||||
border.color: Theme.palette.directColor8
|
||||
radius: 16
|
||||
Row {
|
||||
id: row
|
||||
anchors.left: parent.left
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
anchors.margins: Style.current.halfPadding
|
||||
spacing: Style.current.halfPadding
|
||||
|
||||
control.padding: 4
|
||||
control.popup.width: 342
|
||||
control.popup.x: width - control.popup.width
|
||||
|
||||
model: root.assets
|
||||
|
||||
control.background: Rectangle {
|
||||
color: comboBox.control.hovered ? Theme.palette.directColor8 : "transparent"
|
||||
radius: 6
|
||||
}
|
||||
|
||||
contentItem: RowLayout {
|
||||
spacing: 4
|
||||
|
||||
StatusRoundedImage {
|
||||
Layout.preferredWidth: 24
|
||||
Layout.preferredHeight: 24
|
||||
Layout.alignment: Qt.AlignVCenter
|
||||
image.source: d.iconSource
|
||||
image.onStatusChanged: {
|
||||
if (image.status === Image.Error) {
|
||||
image.source = defaultToken
|
||||
}
|
||||
}
|
||||
}
|
||||
StatusBaseText {
|
||||
id: selectedTextField
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
font.pixelSize: 15
|
||||
width: Math.min(50, implicitWidth)
|
||||
Layout.maximumWidth: 50
|
||||
Layout.alignment: Qt.AlignVCenter
|
||||
elide: Text.ElideRight
|
||||
verticalAlignment: Text.AlignVCenter
|
||||
color: Theme.palette.directColor1
|
||||
font.weight: Font.Medium
|
||||
text: d.text
|
||||
}
|
||||
StatusRoundedImage {
|
||||
id: iconImg
|
||||
width: 40
|
||||
height: 40
|
||||
image.onStatusChanged: {
|
||||
if (iconImg.image.status === Image.Error) {
|
||||
iconImg.image.source = defaultToken
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
selectMenu.delegate: menuItem
|
||||
}
|
||||
|
||||
Component {
|
||||
id: menuItem
|
||||
MenuItem {
|
||||
id: itemContainer
|
||||
property bool isFirstItem: index === 0
|
||||
property bool isLastItem: index === assets.rowCount() - 1
|
||||
delegate: StatusItemDelegate {
|
||||
width: comboBox.control.popup.width
|
||||
highlighted: index === comboBox.control.highlightedIndex
|
||||
padding: 16
|
||||
|
||||
onClicked: {
|
||||
// TODO: move this out of StatusQ, this involves dependency on BE code
|
||||
// WARNING: Wrong ComboBox value processing. Check `StatusAccountSelector` for more info.
|
||||
root.userSelectedToken = symbol
|
||||
root.selectedAsset = {name: name, symbol: symbol, totalBalance: totalBalance, totalCurrencyBalance: totalCurrencyBalance, balances: balances}
|
||||
}
|
||||
|
||||
// TODO: move this out of StatusQ, this involves dependency on BE code
|
||||
// WARNING: Wrong ComboBox value processing. Check `StatusAccountSelector` for more info.
|
||||
Component.onCompleted: {
|
||||
if ((userSelectedToken === "" && index === 0) || symbol === userSelectedToken)
|
||||
root.selectedAsset = { name: name, symbol: symbol, totalBalance: totalBalance, totalCurrencyBalance: totalCurrencyBalance, balances: balances}
|
||||
}
|
||||
|
||||
contentItem: RowLayout {
|
||||
spacing: 0
|
||||
|
||||
width: parent.width
|
||||
height: 72
|
||||
contentItem: Item {
|
||||
anchors.fill: parent
|
||||
StatusRoundedImage {
|
||||
id: iconImg
|
||||
anchors.left: parent.left
|
||||
anchors.leftMargin: 16
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
image.source: root.tokenAssetSourceFn(symbol.toUpperCase())
|
||||
image.onStatusChanged: {
|
||||
if (iconImg.image.status === Image.Error) {
|
||||
iconImg.image.source = defaultToken
|
||||
if (image.status === Image.Error) {
|
||||
image.source = defaultToken
|
||||
}
|
||||
}
|
||||
}
|
||||
Column {
|
||||
anchors.left: iconImg.right
|
||||
anchors.leftMargin: 12
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
|
||||
ColumnLayout {
|
||||
Layout.fillWidth: true
|
||||
Layout.leftMargin: 12
|
||||
spacing: 0
|
||||
|
||||
RowLayout {
|
||||
Layout.fillWidth: true
|
||||
|
||||
StatusBaseText {
|
||||
Layout.fillWidth: true
|
||||
text: symbol.toUpperCase()
|
||||
font.pixelSize: 15
|
||||
color: Theme.palette.directColor1
|
||||
}
|
||||
|
||||
StatusBaseText {
|
||||
Layout.fillWidth: true
|
||||
horizontalAlignment: Text.AlignRight
|
||||
font.pixelSize: 15
|
||||
text: parseFloat(totalBalance).toLocaleCurrencyString(Qt.locale(), symbol)
|
||||
}
|
||||
}
|
||||
RowLayout {
|
||||
Layout.fillWidth: true
|
||||
StatusBaseText {
|
||||
Layout.fillWidth: true
|
||||
text: name
|
||||
color: Theme.palette.baseColor1
|
||||
font.pixelSize: 15
|
||||
}
|
||||
}
|
||||
Column {
|
||||
anchors.right: parent.right
|
||||
anchors.rightMargin: 16
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
StatusBaseText {
|
||||
Layout.fillWidth: true
|
||||
horizontalAlignment: Text.AlignRight
|
||||
font.pixelSize: 15
|
||||
text: parseFloat(totalBalance).toFixed(4) + " " + symbol
|
||||
}
|
||||
StatusBaseText {
|
||||
font.pixelSize: 15
|
||||
anchors.right: parent.right
|
||||
text: getCurrencyBalanceString(totalCurrencyBalance)
|
||||
color: Theme.palette.baseColor1
|
||||
}
|
||||
}
|
||||
}
|
||||
background: Rectangle {
|
||||
color: itemContainer.highlighted ? Theme.palette.statusSelect.menuItemHoverBackgroundColor : Theme.palette.statusSelect.menuItemBackgroundColor
|
||||
}
|
||||
Component.onCompleted: {
|
||||
if(userSelectedToken === "") {
|
||||
if(index === 0) {
|
||||
selectedAsset = model
|
||||
}
|
||||
} else {
|
||||
if(symbol === userSelectedToken) {
|
||||
selectedAsset = model
|
||||
}
|
||||
}
|
||||
}
|
||||
MouseArea {
|
||||
cursorShape: Qt.PointingHandCursor
|
||||
anchors.fill: itemContainer
|
||||
onClicked: {
|
||||
userSelectedToken = symbol
|
||||
selectedAsset = model
|
||||
select.selectMenu.close()
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue