LoginView.qml (7119B)
1 import QtQuick 2 import QtQuick.Layouts 3 import "../styles" 4 5 Item { 6 id: root 7 8 function performLogin() { 9 errorMessage.text = "" 10 // Rust validates and emits loginFailed with message if invalid 11 NetworkManager.login(emailInput.text, passwordInput.text) 12 } 13 14 Rectangle { 15 anchors.fill: parent 16 color: TelegramStyle.backgroundColor 17 18 // Center the login form 19 Item { 20 anchors.centerIn: parent 21 width: 400 22 height: columnLayout.height 23 24 ColumnLayout { 25 id: columnLayout 26 width: parent.width 27 spacing: TelegramStyle.standardMargin * 2 28 29 // Title 30 Text { 31 Layout.alignment: Qt.AlignHCenter 32 text: "Login" 33 font.pixelSize: 32 34 font.bold: true 35 color: TelegramStyle.textPrimary 36 } 37 38 // Email input 39 ColumnLayout { 40 Layout.fillWidth: true 41 spacing: 4 42 43 Text { 44 text: "Email" 45 font.pixelSize: TelegramStyle.fontSizeSmall 46 color: TelegramStyle.textSecondary 47 } 48 49 Rectangle { 50 Layout.fillWidth: true 51 height: 48 52 border.color: emailInput.activeFocus ? TelegramStyle.primaryColor : TelegramStyle.divider 53 border.width: emailInput.activeFocus ? 2 : 1 54 radius: 6 55 color: "white" 56 57 TextInput { 58 id: emailInput 59 anchors.fill: parent 60 anchors.margins: TelegramStyle.standardMargin 61 verticalAlignment: TextInput.AlignVCenter 62 font.pixelSize: TelegramStyle.fontSizeNormal 63 color: TelegramStyle.textPrimary 64 selectByMouse: true 65 activeFocusOnTab: true 66 KeyNavigation.tab: passwordInput 67 68 Keys.onReturnPressed: root.performLogin() 69 70 Text { 71 anchors.fill: parent 72 verticalAlignment: TextInput.AlignVCenter 73 text: "you@example.com" 74 color: TelegramStyle.textSecondary 75 visible: !emailInput.text && !emailInput.activeFocus 76 } 77 } 78 } 79 } 80 81 // Password input 82 ColumnLayout { 83 Layout.fillWidth: true 84 spacing: 4 85 86 Text { 87 text: "Password" 88 font.pixelSize: TelegramStyle.fontSizeSmall 89 color: TelegramStyle.textSecondary 90 } 91 92 Rectangle { 93 Layout.fillWidth: true 94 height: 48 95 border.color: passwordInput.activeFocus ? TelegramStyle.primaryColor : TelegramStyle.divider 96 border.width: passwordInput.activeFocus ? 2 : 1 97 radius: 6 98 color: "white" 99 100 TextInput { 101 id: passwordInput 102 anchors.fill: parent 103 anchors.margins: TelegramStyle.standardMargin 104 verticalAlignment: TextInput.AlignVCenter 105 font.pixelSize: TelegramStyle.fontSizeNormal 106 color: TelegramStyle.textPrimary 107 echoMode: TextInput.Password 108 selectByMouse: true 109 activeFocusOnTab: true 110 KeyNavigation.tab: loginButton 111 112 Text { 113 anchors.fill: parent 114 verticalAlignment: TextInput.AlignVCenter 115 text: "Enter your password" 116 color: TelegramStyle.textSecondary 117 visible: !passwordInput.text && !passwordInput.activeFocus 118 } 119 120 // Submit on Enter key 121 Keys.onReturnPressed: root.performLogin() 122 } 123 } 124 } 125 126 // Error message 127 Text { 128 id: errorMessage 129 Layout.fillWidth: true 130 Layout.alignment: Qt.AlignHCenter 131 text: "" 132 font.pixelSize: TelegramStyle.fontSizeSmall 133 color: "#f44336" 134 wrapMode: Text.WordWrap 135 horizontalAlignment: Text.AlignHCenter 136 visible: text !== "" 137 } 138 139 // Login button 140 Rectangle { 141 id: loginButton 142 Layout.fillWidth: true 143 height: 48 144 radius: 6 145 color: loginMouseArea.containsMouse || activeFocus ? TelegramStyle.accentColor : TelegramStyle.primaryColor 146 border.color: activeFocus ? TelegramStyle.textPrimary : "transparent" 147 border.width: activeFocus ? 2 : 0 148 activeFocusOnTab: true 149 KeyNavigation.tab: emailInput 150 151 Keys.onReturnPressed: root.performLogin() 152 Keys.onSpacePressed: root.performLogin() 153 154 Behavior on color { 155 ColorAnimation { duration: 100 } 156 } 157 158 Text { 159 anchors.centerIn: parent 160 text: "Login" 161 font.pixelSize: TelegramStyle.fontSizeNormal 162 font.bold: true 163 color: "white" 164 } 165 166 MouseArea { 167 id: loginMouseArea 168 anchors.fill: parent 169 hoverEnabled: true 170 cursorShape: Qt.PointingHandCursor 171 onClicked: root.performLogin() 172 } 173 } 174 } 175 } 176 } 177 178 // Handle login success/failure 179 Connections { 180 target: NetworkManager 181 182 function onLoginSuccess(authToken) { 183 // Navigate to chat list 184 if (typeof stackView !== 'undefined' && stackView) { 185 stackView.replace(Qt.resolvedUrl("ChatListView.qml")) 186 } 187 } 188 189 function onLoginFailed(error) { 190 errorMessage.text = "Login failed: " + error 191 } 192 } 193 }