developOne / harmonyPool

Go to a project
Toggle navigation Toggle navigation pinning
shishuangxi
c96cb118 1 parent c1c86c9f

修改协议弹窗样式

Inline Side-by-side
Showing 1 changed file with 188 additions and 92 deletions
... ... @@ -55,6 +55,7 @@ struct LoginPage {
alignment:DialogAlignment.Center
})
loginViewModel = new LoginViewModel()
@State isProtocol:boolean=false
onCodeSend() {
Logger.debug(TAG, "isCodeSend:" + this.isCodeSend + "")
... ... @@ -72,108 +73,119 @@ struct LoginPage {
}
build() {
RelativeContainer() {
//注册内容
Column() {
Image($r("app.media.login_logo"))
.width(120)
.height(66)
.margin({ top: 78 })
.align(Alignment.Center)
if (this.checkCodePage) {
LoginInputComponent({
phoneContent: $phoneContent,
codeContent: $codeContent,
isSubmit: $isSubmit,
isCodeSend: $isCodeSend
})
} else {
this.addPassword()
}
Stack() {
RelativeContainer() {
Row() {
Image(this.protocolState ? $r('app.media.login_checkbox_select') : $r('app.media.login_checkbox_unselected'))
.width(15)
.height(15)
.onClick(() => {
this.protocolState = !this.protocolState
//注册内容
Column() {
Image($r("app.media.login_logo"))
.width(120)
.height(66)
.margin({ top: 78 })
.align(Alignment.Center)
if (this.checkCodePage) {
LoginInputComponent({
phoneContent: $phoneContent,
codeContent: $codeContent,
isSubmit: $isSubmit,
isCodeSend: $isCodeSend
})
} else {
this.addPassword()
}
Text() {
Span("我已阅读并同意").fontColor("#999999").fontSize(12)
Span("《用户协议》").fontColor("#ED2800").fontSize(12).onClick(() => {
let bean={contentID:"1",pageID:""} as Params
WDRouterRule.jumpWithPage(WDRouterPage.loginProtocolPage,bean)
})
Span("及").fontColor("#999999").fontSize(12)
Span("《隐私政策》").fontColor("#ED2800").fontSize(12).onClick(() => {
let bean={contentID:"2",pageID:""} as Params
WDRouterRule.jumpWithPage(WDRouterPage.loginProtocolPage,bean)
})
Row() {
Image(this.protocolState ? $r('app.media.login_checkbox_select') : $r('app.media.login_checkbox_unselected'))
.width(15)
.height(15)
.onClick(() => {
this.protocolState = !this.protocolState
})
Text() {
Span("我已阅读并同意").fontColor("#999999").fontSize(12)
Span("《用户协议》").fontColor("#ED2800").fontSize(12).onClick(() => {
let bean = { contentID: "1", pageID: "" } as Params
WDRouterRule.jumpWithPage(WDRouterPage.loginProtocolPage, bean)
})
Span("及").fontColor("#999999").fontSize(12)
Span("《隐私政策》").fontColor("#ED2800").fontSize(12).onClick(() => {
let bean = { contentID: "2", pageID: "" } as Params
WDRouterRule.jumpWithPage(WDRouterPage.loginProtocolPage, bean)
})
}
}.margin({ top: 48 }).alignItems(VerticalAlign.Center)
Row() {
Text("登录")
.borderRadius(4)
.fontColor(this.isSubmit ? "#FFFFFFFF" : "#66FFFFFF")
.fontSize(18)
.fontWeight(FontWeight.Medium)
.margin({ top: 20 })
.height(44)
.textAlign(TextAlign.Center)
.width("100%")
.backgroundColor(this.isSubmit ? "#FFED2800" : "#99ED2800")
.onClick(() => {
if (!this.isSubmit) {
return
}
this.loginSubmit()
})
}.padding({ left: 25, right: 25 }).width('100%')
if (!this.checkCodePage) {
Text('忘记密码').fontColor('#666666').fontSize(14).margin({ top: 16 })
.onClick(() => {
// router.pushUrl({ url: 'pages/login/ForgetPasswordPage' })
let pageType = { 'pageType': 0 } as Record<string, number>;
WDRouterRule.jumpWithPage(WDRouterPage.forgetPasswordPage, pageType)
})
}
}.margin({ top: 48 }).alignItems(VerticalAlign.Center)
Row() {
Text("登录")
.borderRadius(4)
.fontColor(this.isSubmit ?"#FFFFFFFF":"#66FFFFFF")
.fontSize(18)
.fontWeight(FontWeight.Medium)
.margin({ top: 20 })
.height(44)
.textAlign(TextAlign.Center)
.width("100%")
.backgroundColor(this.isSubmit?"#FFED2800":"#99ED2800")
.onClick(() => {
if(!this.isSubmit){
return
}
this.loginSubmit()
}.width("100%")
.alignRules({
top: { anchor: "__container__", align: VerticalAlign.Top },
}).id("register")
})
}.padding({ left: 25, right: 25 }).width('100%')
//其他登录方式
Column() {
this.addOtherLogin()
}.width('100%')
.alignRules({
bottom: { anchor: "__container__", align: VerticalAlign.Bottom },
}).id("other")
//关闭按钮
Image($r('app.media.login_closed'))
.width(24)
.height(24)
.margin({ top: 10, right: 15 })
.alignRules({
top: { anchor: "__container__", align: VerticalAlign.Top },
right: { anchor: "__container__", align: HorizontalAlign.End }
})
.onClick(() => {
router.back()
})
.id('id_close')
if (!this.checkCodePage) {
Text('忘记密码').fontColor('#666666').fontSize(14).margin({ top: 16 })
.onClick(() => {
// router.pushUrl({ url: 'pages/login/ForgetPasswordPage' })
let pageType = {'pageType': 0} as Record<string, number>;
WDRouterRule.jumpWithPage(WDRouterPage.forgetPasswordPage, pageType)
})
}
}.width('100%').height('100%')
}.width("100%")
.alignRules({
top: { anchor: "__container__", align: VerticalAlign.Top },
}).id("register")
ProtocolComponent({
cancelMethod: (): void => this.cancelProtocol(),
agreeMethod: (): void => this.agreeProtocol()
})
.visibility(this.isProtocol ? Visibility.Visible : Visibility.None)
//其他登录方式
Column() {
this.addOtherLogin()
}.width('100%')
.alignRules({
bottom: { anchor: "__container__", align: VerticalAlign.Bottom },
}).id("other")
//关闭按钮
Image($r('app.media.login_closed'))
.width(24)
.height(24)
.margin({ top: 10, right: 15 })
.alignRules({
top: { anchor: "__container__", align: VerticalAlign.Top },
right: { anchor: "__container__", align: HorizontalAlign.End }
})
.onClick(() => {
router.back()
})
.id('id_close')
}.width('100%')
.height('100%')
}.width('100%').height('100%')
}
@Builder
... ... @@ -366,8 +378,92 @@ struct LoginPage {
if (this.protocolState) {
this.requestLogin()
} else {
this.dialogController.open()
// this.dialogController.open()
this.isProtocol=true
}
}
agreeProtocol(): void {
this.isProtocol = false
this.protocolState = true
this.requestLogin()
}
cancelProtocol(): void {
this.isProtocol = false
}
}
@Component
struct ProtocolComponent {
cancelMethod?: () => void
agreeMethod?: () => void
build() {
Stack() {
Column() {
Text("温馨提示")
.fontColor("#222222")
.fontSize(18)
.width("100%")
.fontWeight(FontWeight.Bold)
.textAlign(TextAlign.Center)
.margin({ top: 20 })
Text() {
Span("为保障您的合法权益，请阅读并同意").fontSize(14).fontColor("#666666")
Span("《用户协议》").fontSize(14).fontColor("#ED2800").onClick(() => {
let bean = { contentID: "1", pageID: "" } as Params
WDRouterRule.jumpWithPage(WDRouterPage.loginProtocolPage, bean)
})
Span("及").fontSize(14).fontColor("#666666")
Span("《隐私政策》").fontSize(14).fontColor("#ED2800").onClick(() => {
let bean = { contentID: "2", pageID: "" } as Params
WDRouterRule.jumpWithPage(WDRouterPage.loginProtocolPage, bean)
})
Span("后进行登录").fontSize(14).fontColor("#666666")
}.margin({ top: 12, left: 16, right: 16 })
Divider().color("#999999").width("100%").margin({ top: 14 }).height('1vp')
Row() {
Text('放弃登录')
.fontSize(16)
.fontColor("#999999")
.layoutWeight(1)
.fontWeight(FontWeight.Medium)
.textAlign(TextAlign.Center)
.onClick(() => {
if (this.cancelMethod) {
this.cancelMethod()
}
})
.height('100%')
// Divider().color("#999999").height('100%').width('0.5vp')
Text('同意并登录')
.fontSize(16)
.fontColor("#ED2800")
.layoutWeight(1)
.fontWeight(FontWeight.Medium)
.textAlign(TextAlign.Center)
.border({
width: { left: 1 },
color: "#999999",
style: { left: BorderStyle.Solid }
})
.onClick(() => {
if (this.agreeMethod) {
this.agreeMethod()
}
})
.height('100%')
}.layoutWeight(1).justifyContent(FlexAlign.Center)
}.height(161).backgroundColor(Color.White).borderRadius(6).width('74%')
}.width('100%')
.height('100%')
.backgroundColor('#66000000')
}
}
\ No newline at end of file
... ...