From 1ce875be27d9011c3944c6b975d9f817947ecdf8 Mon Sep 17 00:00:00 2001
From: wwf <1971391498@qq.com>
Date: 星期三, 01 十月 2025 16:22:24 +0800
Subject: [PATCH] 登录、注册
---
entry/src/main/ets/pages/login/LoginPage.ets | 286 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 286 insertions(+), 0 deletions(-)
diff --git a/entry/src/main/ets/pages/login/LoginPage.ets b/entry/src/main/ets/pages/login/LoginPage.ets
new file mode 100644
index 0000000..60e1a7b
--- /dev/null
+++ b/entry/src/main/ets/pages/login/LoginPage.ets
@@ -0,0 +1,286 @@
+import { UserInfoBase } from '../../data/UserInfoBase'
+import { promptAction } from '@kit.ArkUI'
+import PreferencesUtils from '../../utils/PreferencesUtils'
+import http from '@ohos.net.http';
+import { HttpResponseResult } from '../../data/HttpResponse';
+import { JSON } from '@kit.ArkTS';
+
+/**
+ * @Description : 鐧诲綍椤�
+ */
+@Entry
+@Component
+struct LoginPage {
+ @State account: string = ''
+ @State password: string = ''
+ @State rememberPassword: boolean = false
+ @State agreement: boolean = false
+ @State accountErrorFlag: boolean = false
+ @State passwordErrorFlag: boolean = false
+ //鐢ㄦ潵鑾峰彇瀛樺偍鐨勫瘑鐮佸拰鐢ㄦ埛璐﹀彿
+ @State userInfoData: UserInfoBase = new UserInfoBase()
+
+ aboutToAppear(): void {
+ PreferencesUtils.getPreferences('UserInfo','user','').then((value: string) => {
+ if (!value) return
+ this.userInfoData = JSON.parse(value) as UserInfoBase
+ this.account = this.userInfoData.account
+ this.password = this.userInfoData.password
+ if (this.account && this.password) {
+ this.rememberPassword = true
+ }
+ })
+ }
+
+ submitLogin() {
+ if (!this.account) {
+ this.accountErrorFlag = true
+ return
+ }
+ if (!this.password || this.password.length !== 8) {
+ this.passwordErrorFlag = true
+ return
+ }
+ if (!this.agreement) {
+ promptAction.showToast({
+ message: '璇峰嬀閫夊崗璁拰闅愮鏀跨瓥',
+ backgroundColor: '#242933',
+ backgroundBlurStyle: BlurStyle.NONE,
+ textColor: Color.White
+ })
+ return
+ }
+ this.userInfoData = {
+ account: this.account,
+ password: this.password
+ }
+ let httpRequest = http.createHttp();
+
+ // 鍑嗗瑕佹彁浜ょ殑鏁版嵁浣�
+ interface PostData {
+ mobilePhone: string,
+ password: string
+ }
+ let postData: PostData = {
+ mobilePhone: this.account,
+ password: this.password
+ }
+
+ httpRequest.request(
+ "http://192.168.20.70:8080/quiz-community/public/v1.0/users/login",
+ {
+ method: http.RequestMethod.PUT,
+ header: { 'Content-Type': 'application/json' },
+ extraData: postData
+ },
+ (err, data) => {
+ console.log('response', '/users/register')
+ console.log(JSON.stringify(data.result))
+ if (data.responseCode == 200) {
+ interface Data {
+ token: string
+ }
+ const resData = (typeof data.result == 'string' ? JSON.parse(data.result) : data.result) as HttpResponseResult<Data>
+ if (resData.code == 200) {
+
+ PreferencesUtils.putPreferences('UserInfo','user',JSON.stringify(this.userInfoData))
+ AppStorage.SetOrCreate('x-jwt-token', resData.data?.token)
+ promptAction.showToast({ message: '鐧诲綍鎴愬姛' })
+ } else {
+ promptAction.showToast({ message: resData.msg })
+ }
+ } else {
+ promptAction.showToast({ message: err.message })
+ }
+ }
+ )
+ }
+
+ build() {
+ Column({space: 10}){
+ Text('鎮ㄥソ锛�')
+ .width('100%')
+ .fontSize(22)
+ .fontWeight(800)
+ .fontColor(Color.White)
+ Text('娆㈣繋浣跨敤瀛﹁仒鍚岃')
+ .width('100%')
+ .fontSize(22)
+ .fontWeight(800)
+ .fontColor(Color.White)
+ Column({ space: 20 }) {
+ Text('璐﹀彿鐧诲綍')
+ .width('100%')
+ .textAlign(TextAlign.Center)
+ .fontSize(20)
+ .fontWeight(800)
+
+ Row() {
+ Image($r('app.media.icon_username'))
+ .width(16)
+ .height(16)
+ TextInput({ placeholder: '璇疯緭鍏ヨ处鍙�', text: $$this.account })
+ .type(InputType.USER_NAME)
+ .backgroundColor('#f3f7fe')
+ .onChange(() => {
+ this.accountErrorFlag = false
+ })
+ }
+ .width('100%')
+ .backgroundColor('#f3f7fe')
+ .border(this.accountErrorFlag ? { width: 1, color: Color.Red } : { width: 'none' })
+ .borderRadius(10)
+ .padding({ left: 10, right: 10 })
+
+ if(this.accountErrorFlag) {
+ Text('璐﹀彿涓嶈兘绌烘垨璐﹀彿鏈夎')
+ .width('100%')
+ .fontSize(12)
+ .fontColor(Color.Red)
+ .margin({ top: -16, bottom: -16, left: 20 })
+ }
+
+ Row() {
+ Image($r('app.media.icon_password'))
+ .width(16)
+ .height(16)
+ TextInput({ placeholder: '璇疯緭鍏ュ瘑鐮�', text: $$this.password })
+ .type(InputType.Password)
+ .backgroundColor('#f3f7fe')
+ .onChange(() =>{
+ this.passwordErrorFlag = false
+ })
+ }
+ .width('100%')
+ .backgroundColor('#f3f7fe')
+ .border(this.passwordErrorFlag ? { width: 1, color: Color.Red } : { width: 'none' })
+ .borderRadius(10)
+ .padding({ left: 10, right: 10 })
+
+ if(this.passwordErrorFlag) {
+ Text('瀵嗙爜涓嶈兘绌烘垨瀵嗙爜鏈夎')
+ .width('100%')
+ .fontSize(12)
+ .fontColor(Color.Red)
+ .margin({ top: -16, bottom: -16, left: 20 })
+ }
+
+ Row(){
+ Row() {
+ Checkbox()
+ .select($$this.rememberPassword)
+ .selectedColor(0x39a2db)
+ .shape(CheckBoxShape.ROUNDED_SQUARE)
+ .width(14)
+ Text('璁颁綇瀵嗙爜')
+ .fontSize(14)
+ }
+ .onClick(() => this.rememberPassword = !this.rememberPassword)
+ Text('蹇樿瀵嗙爜?')
+ .fontSize(14)
+ .fontColor('#1756f4')
+ .decoration({ type: TextDecorationType.Underline, color: '#1756f4' })
+ }
+ .width('100%')
+ .justifyContent(FlexAlign.SpaceBetween)
+
+ Button('鐧� 褰�')
+ .type(ButtonType.Normal)
+ .width('100%')
+ .borderRadius(10)
+ .onClick(() => {
+ this.submitLogin()
+ })
+
+ Row() {
+ Checkbox()
+ .select($$this.agreement)
+ .selectedColor(0x39a2db)
+ .shape(CheckBoxShape.ROUNDED_SQUARE)
+ .width(14)
+ Text(){
+ Span('鎴戝凡闃呰骞跺悓鎰�')
+ .fontColor(Color.Black)
+ Span('銆婄敤鎴峰崗璁��')
+ .fontColor('#1756f4')
+ Span('鍜�')
+ .fontColor(Color.Black)
+ Span('銆婇殣绉佸崗璁��')
+ .fontColor('#1756f4')
+ }
+ .fontSize(12)
+ }
+ .width('100%')
+ .justifyContent(FlexAlign.Center)
+ .onClick(() => { this.agreement = !this.agreement })
+
+ }
+ .width('100%')
+ .margin({ top: 20 })
+ .padding({ top: 30, bottom: 30, left: 20, right: 20 })
+ .borderRadius(6)
+ .backgroundColor(Color.White)
+
+ Row() {
+ Text() {
+ Span('娌℃湁璐﹀彿锛�')
+ Span('绔嬪嵆娉ㄥ唽>')
+ .fontColor('#1756f4')
+ .decoration({ type: TextDecorationType.Underline, color: '#1756f4' })
+ .onClick(() => {
+ this.getUIContext().getRouter().pushUrl({
+ url: 'pages/login/SignInPage'
+ })
+ })
+ }
+ .fontSize(14)
+ .fontWeight(500)
+ .margin({ top: 10 })
+ }
+
+ // Row(){
+ // Text('娉ㄥ唽')
+ // .fontColor(Color.White)
+ // .onClick(() => {
+ // this.getUIContext().getRouter().pushUrl({
+ // url: 'pages/login/SingInPage'
+ // })
+ // })
+ // }.width('90%')
+ // .offset({y: -15,x: -20})
+ // .justifyContent(FlexAlign.End)
+ // Blank()
+ // Button('鐧� 褰�')
+ // .width('90%')
+ // .height(70)
+ // .fontSize(25)
+ // .backgroundColor("#ff09b8aa")
+ // .onClick(() => {
+ // //鐐瑰嚮鑾峰彇杈撳叆妗嗗唴瀹�
+ // console.log(`鐢ㄦ埛鍚嶏細${this.userInfoData.userName},瀵嗙爜锛� ${this.userInfoData.userPwd}`);
+ // if (this.userName === '' || this.userName === undefined || this.userName.trim().length <= 0 || this.userName != this.userInfoData.userName) {
+ // this.isShowName = false
+ // this.getUIContext().getPromptAction().showToast({message: '鐢ㄦ埛涓嶈兘绌烘垨鐢ㄦ埛鍚嶆湁璇�'})
+ // return //缁撴潫褰撳墠閫昏緫锛屼笉鍦ㄥ悜涓嬫墽琛�
+ // }
+ // if (this.userPwd === '' || this.userPwd === undefined || this.userPwd.trim().length <= 0 || this.userPwd != this.userInfoData.userPwd) {
+ // this.getUIContext().getPromptAction().showToast({message: '瀵嗙爜涓嶈兘绌烘垨瀵嗙爜鏈夎'})
+ // this.isShowPwd = false
+ // return //缁撴潫褰撳墠閫昏緫锛屼笉鍦ㄥ悜涓嬫墽琛�
+ // }
+ // this.getUIContext().getPromptAction().showToast({message: '鐧诲綍鎴愬姛'})
+ // this.getUIContext().getRouter().replaceUrl({
+ // url:'pages/MainPage'
+ // })
+ // })
+ }
+ .width('100%')
+ .height('100%')
+ .padding({ top: 100, left: 20, right: 20 })
+ .backgroundImage($r('app.media.login_page_bg'))
+ .backgroundImageSize({width: '100%',height:'100%'})
+
+ }
+}
+
+
--
Gitblit v1.8.0