|
@@ -1,38 +1,18 @@
|
|
|
package com.ys.bdtp.adm.mvvm.ui.screen.login
|
|
|
|
|
|
+import android.content.SharedPreferences
|
|
|
import androidx.compose.foundation.Image
|
|
|
import androidx.compose.foundation.background
|
|
|
-import androidx.compose.foundation.layout.Arrangement
|
|
|
-import androidx.compose.foundation.layout.Column
|
|
|
-import androidx.compose.foundation.layout.Row
|
|
|
-import androidx.compose.foundation.layout.Spacer
|
|
|
-import androidx.compose.foundation.layout.fillMaxHeight
|
|
|
-import androidx.compose.foundation.layout.fillMaxSize
|
|
|
-import androidx.compose.foundation.layout.fillMaxWidth
|
|
|
-import androidx.compose.foundation.layout.height
|
|
|
-import androidx.compose.foundation.layout.padding
|
|
|
-import androidx.compose.foundation.layout.size
|
|
|
-import androidx.compose.foundation.layout.wrapContentHeight
|
|
|
+import androidx.compose.foundation.layout.*
|
|
|
import androidx.compose.foundation.shape.RoundedCornerShape
|
|
|
-import androidx.compose.material.Button
|
|
|
-import androidx.compose.material.ButtonDefaults
|
|
|
-import androidx.compose.material.Icon
|
|
|
-import androidx.compose.material.IconButton
|
|
|
-import androidx.compose.material.OutlinedTextField
|
|
|
-import androidx.compose.material.Text
|
|
|
-import androidx.compose.material.TextFieldDefaults
|
|
|
-import androidx.compose.runtime.Composable
|
|
|
-import androidx.compose.runtime.getValue
|
|
|
-import androidx.compose.runtime.mutableStateOf
|
|
|
-import androidx.compose.runtime.remember
|
|
|
-import androidx.compose.runtime.setValue
|
|
|
+import androidx.compose.material.*
|
|
|
+import androidx.compose.runtime.*
|
|
|
import androidx.compose.ui.Alignment
|
|
|
import androidx.compose.ui.Modifier
|
|
|
import androidx.compose.ui.focus.FocusState
|
|
|
import androidx.compose.ui.focus.onFocusChanged
|
|
|
import androidx.compose.ui.graphics.Color
|
|
|
import androidx.compose.ui.layout.ContentScale
|
|
|
-import androidx.compose.ui.platform.LocalDensity
|
|
|
import androidx.compose.ui.res.painterResource
|
|
|
import androidx.compose.ui.text.input.PasswordVisualTransformation
|
|
|
import androidx.compose.ui.text.input.VisualTransformation
|
|
@@ -40,255 +20,36 @@ import androidx.compose.ui.tooling.preview.Preview
|
|
|
import androidx.compose.ui.unit.dp
|
|
|
import androidx.compose.ui.unit.sp
|
|
|
import androidx.constraintlayout.compose.ConstraintLayout
|
|
|
-import com.google.accompanist.insets.LocalWindowInsets
|
|
|
+import androidx.core.content.edit
|
|
|
import com.google.accompanist.insets.statusBarsHeight
|
|
|
import com.ys.bdtp.adm.R
|
|
|
+import com.ys.bdtp.adm.app.Token
|
|
|
import com.ys.bdtp.adm.mvvm.model.vo.request.Login
|
|
|
import com.ys.bdtp.adm.mvvm.vm.login.LoginViewModel
|
|
|
+import org.kodein.di.compose.rememberInstance
|
|
|
import org.kodein.di.compose.rememberViewModel
|
|
|
|
|
|
@Composable
|
|
|
fun LoginScreen() {
|
|
|
- val vm by rememberViewModel<LoginViewModel>()
|
|
|
- val insets = LocalWindowInsets.current
|
|
|
- println("insets: ${insets.statusBars.layoutInsets.left}")
|
|
|
- println("insets: ${insets.statusBars.layoutInsets.bottom}")
|
|
|
- val imeBottom = with(LocalDensity.current) { insets.ime.bottom.toDp() }
|
|
|
- println("insets: $imeBottom")
|
|
|
|
|
|
- var isShowPassword by remember { mutableStateOf(false) }
|
|
|
- var isLoginBtnEnable by remember { mutableStateOf(true) }
|
|
|
-
|
|
|
- var username by remember { mutableStateOf("") }
|
|
|
- var password by remember { mutableStateOf("") }
|
|
|
-
|
|
|
- var visualState: VisualTransformation by remember { mutableStateOf(PasswordVisualTransformation()) }
|
|
|
-
|
|
|
- var usernameLeadingIconColor by remember { mutableStateOf(Color(0xFFC3C7CB)) }
|
|
|
- var passwordLeadingIconColor by remember { mutableStateOf(Color(0xFFC3C7CB)) }
|
|
|
|
|
|
Row(
|
|
|
modifier = Modifier
|
|
|
.fillMaxSize()
|
|
|
.background(Color.White)
|
|
|
-
|
|
|
) {
|
|
|
- ConstraintLayout(modifier = Modifier.weight(3.0f).fillMaxHeight()) {
|
|
|
- val (statusBar, logo, background, title) = createRefs()
|
|
|
-
|
|
|
- Image(
|
|
|
- painter = painterResource(R.drawable.login_background),
|
|
|
- contentDescription = "",
|
|
|
- modifier = Modifier.fillMaxSize().constrainAs(background) {
|
|
|
- top.linkTo(parent.top)
|
|
|
- bottom.linkTo(parent.bottom)
|
|
|
- start.linkTo(parent.start)
|
|
|
- end.linkTo(parent.end)
|
|
|
- },
|
|
|
- contentScale = ContentScale.Crop
|
|
|
- )
|
|
|
-
|
|
|
- Spacer(Modifier.statusBarsHeight().fillMaxWidth().constrainAs(statusBar) {
|
|
|
- top.linkTo(parent.top)
|
|
|
- start.linkTo(parent.start)
|
|
|
- end.linkTo(parent.end)
|
|
|
- })
|
|
|
-
|
|
|
- Image(
|
|
|
- painter = painterResource(R.drawable.logo),
|
|
|
- contentDescription = "",
|
|
|
- modifier = Modifier.size(112.dp, 48.dp).constrainAs(logo) {
|
|
|
- top.linkTo(statusBar.bottom, margin = 12.dp)
|
|
|
- start.linkTo(parent.start, margin = 32.dp)
|
|
|
- }
|
|
|
- )
|
|
|
- val guideline = createGuidelineFromBottom(0.1f)
|
|
|
- Column(modifier = Modifier.constrainAs(title) {
|
|
|
- top.linkTo(parent.top, margin = 32.dp)
|
|
|
- start.linkTo(parent.start)
|
|
|
- end.linkTo(parent.end)
|
|
|
- bottom.linkTo(guideline)
|
|
|
- }) {
|
|
|
- Text(text = "Yushu", fontSize = 36.sp, color = Color(0XFF1F2429))
|
|
|
- Text("智慧建筑运维平台", fontSize = 48.sp, color = Color(0XFF1F2429))
|
|
|
- Text("为您提供什么服务,能够用一句话概括出来吧。", fontSize = 16.sp, color = Color(0XFF8D9399))
|
|
|
- }
|
|
|
+ Column(modifier = Modifier.weight(3.0f)) {
|
|
|
+ LoginSide()
|
|
|
}
|
|
|
Column(
|
|
|
modifier = Modifier.weight(2.0f)
|
|
|
- .fillMaxHeight()
|
|
|
- .padding(start = 56.dp, end = 96.dp),
|
|
|
- verticalArrangement = Arrangement.Center
|
|
|
) {
|
|
|
- Column(modifier = Modifier.wrapContentHeight()) {
|
|
|
- Text(text = "登录", fontSize = 30.sp, color = Color(0XFF1F2429))
|
|
|
- Spacer(modifier = Modifier.height(32.dp))
|
|
|
-
|
|
|
- OutlinedTextField(
|
|
|
- value = username,
|
|
|
- modifier = Modifier.fillMaxWidth().onFocusChanged { focusState: FocusState ->
|
|
|
- if (focusState.isFocused)
|
|
|
- usernameLeadingIconColor = Color(0xFF0091FF)
|
|
|
- else
|
|
|
- usernameLeadingIconColor = Color(0xFFC3C7CB)
|
|
|
- },
|
|
|
- onValueChange = {
|
|
|
- username = it
|
|
|
- isLoginBtnEnable = username.isNotEmpty() && password.isNotEmpty()
|
|
|
-
|
|
|
- },
|
|
|
- label = {
|
|
|
- Text(text = "请输入账号")
|
|
|
- },
|
|
|
- colors = TextFieldDefaults.outlinedTextFieldColors(
|
|
|
- textColor = Color(0xFF1F2429),
|
|
|
- cursorColor = Color(0xFF0091FF),
|
|
|
- focusedBorderColor = Color(0xFF0091FF),
|
|
|
- unfocusedBorderColor = Color(0xFFC3C7CB),
|
|
|
- focusedLabelColor = Color(0xFF0091FF),
|
|
|
- unfocusedLabelColor = Color(0xFFC3C7CB),
|
|
|
- backgroundColor = Color.Transparent
|
|
|
- ),
|
|
|
- leadingIcon = {
|
|
|
- Icon(
|
|
|
- painter = painterResource(R.drawable.login_user),
|
|
|
- contentDescription = "",
|
|
|
- tint = usernameLeadingIconColor
|
|
|
- )
|
|
|
- },
|
|
|
- trailingIcon = {
|
|
|
- if (username.isNotBlank()) {
|
|
|
- IconButton(
|
|
|
- onClick = { username = "" },
|
|
|
- enabled = username.isNotEmpty()
|
|
|
- ) {
|
|
|
-
|
|
|
- Icon(
|
|
|
- painter = painterResource(R.drawable.login_delete),
|
|
|
- contentDescription = "",
|
|
|
- modifier = Modifier.size(16.dp),
|
|
|
- tint = Color(0xFFC3C6CB)
|
|
|
- )
|
|
|
- }
|
|
|
- }
|
|
|
- },
|
|
|
- shape = RoundedCornerShape(4.dp)
|
|
|
- )
|
|
|
-
|
|
|
- Spacer(modifier = Modifier.height(32.dp))
|
|
|
-
|
|
|
- OutlinedTextField(
|
|
|
- value = password,
|
|
|
- modifier = Modifier.fillMaxWidth()
|
|
|
- .onFocusChanged { focusState ->
|
|
|
- if (focusState.isFocused)
|
|
|
- passwordLeadingIconColor = Color(0xFF0091FF)
|
|
|
- else
|
|
|
- passwordLeadingIconColor = Color(0xFFC3C7CB)
|
|
|
- },
|
|
|
- onValueChange = {
|
|
|
- password = it
|
|
|
- isLoginBtnEnable = username.isNotEmpty() && password.isNotEmpty()
|
|
|
- },
|
|
|
- label = { Text(text = "请输入密码") },
|
|
|
- colors = TextFieldDefaults.outlinedTextFieldColors(
|
|
|
- textColor = Color(0xFF1F2429),
|
|
|
- cursorColor = Color(0xFF0091FF),
|
|
|
- focusedBorderColor = Color(0xFF0091FF),
|
|
|
- unfocusedBorderColor = Color(0xFFC3C7CB),
|
|
|
- focusedLabelColor = Color(0xFF0091FF),
|
|
|
- unfocusedLabelColor = Color(0xFFC3C7CB),
|
|
|
- backgroundColor = Color.Transparent
|
|
|
- ),
|
|
|
- visualTransformation = visualState,
|
|
|
- leadingIcon = {
|
|
|
- Icon(
|
|
|
- painter = painterResource(R.drawable.login_lock),
|
|
|
- contentDescription = "",
|
|
|
- tint = passwordLeadingIconColor
|
|
|
- )
|
|
|
- },
|
|
|
- trailingIcon = {
|
|
|
- Row(
|
|
|
- horizontalArrangement = Arrangement.End,
|
|
|
- verticalAlignment = Alignment.CenterVertically
|
|
|
- ) {
|
|
|
- if (password.isNotBlank()) {
|
|
|
- IconButton(
|
|
|
- onClick = { isShowPassword = !isShowPassword }
|
|
|
- ) {
|
|
|
- val icon =
|
|
|
- if (isShowPassword) R.drawable.login_eye_open else R.drawable.login_eye_close
|
|
|
- visualState =
|
|
|
- if (isShowPassword) VisualTransformation.None else PasswordVisualTransformation()
|
|
|
- val description = if (isShowPassword) "Show password" else "Hide password"
|
|
|
- Icon(
|
|
|
- painter = painterResource(icon),
|
|
|
- contentDescription = description,
|
|
|
- modifier = Modifier.size(18.dp).padding(0.dp),
|
|
|
- tint = Color(0xFFC3C6CB)
|
|
|
- )
|
|
|
- }
|
|
|
-
|
|
|
- IconButton(
|
|
|
- onClick = {
|
|
|
- password = ""
|
|
|
- isShowPassword = false
|
|
|
- },
|
|
|
- enabled = password.isNotEmpty()
|
|
|
- ) {
|
|
|
- Icon(
|
|
|
- painter = painterResource(R.drawable.login_delete),
|
|
|
- contentDescription = "",
|
|
|
- modifier = Modifier.size(18.dp),
|
|
|
- tint = Color(0xFFC3C6CB)
|
|
|
- )
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- )
|
|
|
- }
|
|
|
-
|
|
|
- Spacer(modifier = Modifier.height(48.dp))
|
|
|
-
|
|
|
- Button(
|
|
|
- onClick = {
|
|
|
- vm.login(
|
|
|
- login = Login(
|
|
|
- phone = "17337681032",
|
|
|
- passWord = "123456",
|
|
|
- ),
|
|
|
- success = {
|
|
|
- println("success::::$it")
|
|
|
- },
|
|
|
- failure = {
|
|
|
- println("failure::::$it")
|
|
|
- }
|
|
|
- )
|
|
|
- //isLoginBtnEnable = username.isNotEmpty() && password.isNotEmpty()
|
|
|
- // TODO
|
|
|
- // 返回登录结果进行处理
|
|
|
- },
|
|
|
- enabled = isLoginBtnEnable,
|
|
|
- modifier = Modifier.fillMaxWidth().height(48.dp),
|
|
|
- shape = RoundedCornerShape(4),
|
|
|
- colors = ButtonDefaults.buttonColors(
|
|
|
- backgroundColor = Color(0xFF0091FF),
|
|
|
- disabledBackgroundColor = Color(0xFFEFF0F1)
|
|
|
- )
|
|
|
- ) {
|
|
|
- Text(
|
|
|
- text = "立即登录",
|
|
|
- color = if (isLoginBtnEnable) Color(0xFFFFFFFF) else Color(0XFFC3C7CB),
|
|
|
- fontSize = 16.sp
|
|
|
- )
|
|
|
- }
|
|
|
+ LoginContent()
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
-@Preview(widthDp = 1280, heightDp = 800)
|
|
|
+@Preview(widthDp = 1137, heightDp = 711)
|
|
|
@Composable
|
|
|
fun PreviewLoginScreen() {
|
|
|
LoginScreen()
|