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 { @@ -55,6 +55,7 @@ struct LoginPage {
55 alignment:DialogAlignment.Center 55 alignment:DialogAlignment.Center
56 }) 56 })
57 loginViewModel = new LoginViewModel() 57 loginViewModel = new LoginViewModel()
  58 + @State isProtocol:boolean=false
58 59
59 onCodeSend() { 60 onCodeSend() {
60 Logger.debug(TAG, "isCodeSend:" + this.isCodeSend + "") 61 Logger.debug(TAG, "isCodeSend:" + this.isCodeSend + "")
@@ -72,108 +73,119 @@ struct LoginPage { @@ -72,108 +73,119 @@ struct LoginPage {
72 } 73 }
73 74
74 build() { 75 build() {
75 - RelativeContainer() {  
76 -  
77 - //注册内容  
78 - Column() {  
79 - Image($r("app.media.login_logo"))  
80 - .width(120)  
81 - .height(66)  
82 - .margin({ top: 78 })  
83 - .align(Alignment.Center)  
84 -  
85 - if (this.checkCodePage) {  
86 - LoginInputComponent({  
87 - phoneContent: $phoneContent,  
88 - codeContent: $codeContent,  
89 - isSubmit: $isSubmit,  
90 - isCodeSend: $isCodeSend  
91 - })  
92 - } else {  
93 - this.addPassword()  
94 - }  
95 - 76 + Stack() {
  77 + RelativeContainer() {
96 78
97 - Row() {  
98 - Image(this.protocolState ? $r('app.media.login_checkbox_select') : $r('app.media.login_checkbox_unselected'))  
99 - .width(15)  
100 - .height(15)  
101 - .onClick(() => {  
102 - this.protocolState = !this.protocolState 79 + //注册内容
  80 + Column() {
  81 + Image($r("app.media.login_logo"))
  82 + .width(120)
  83 + .height(66)
  84 + .margin({ top: 78 })
  85 + .align(Alignment.Center)
  86 +
  87 + if (this.checkCodePage) {
  88 + LoginInputComponent({
  89 + phoneContent: $phoneContent,
  90 + codeContent: $codeContent,
  91 + isSubmit: $isSubmit,
  92 + isCodeSend: $isCodeSend
103 }) 93 })
  94 + } else {
  95 + this.addPassword()
  96 + }
104 97
105 - Text() {  
106 - Span("我已阅读并同意").fontColor("#999999").fontSize(12)  
107 - Span("《用户协议》").fontColor("#ED2800").fontSize(12).onClick(() => {  
108 - let bean={contentID:"1",pageID:""} as Params  
109 - WDRouterRule.jumpWithPage(WDRouterPage.loginProtocolPage,bean)  
110 - })  
111 - Span("及").fontColor("#999999").fontSize(12)  
112 - Span("《隐私政策》").fontColor("#ED2800").fontSize(12).onClick(() => {  
113 - let bean={contentID:"2",pageID:""} as Params  
114 - WDRouterRule.jumpWithPage(WDRouterPage.loginProtocolPage,bean)  
115 - }) 98 +
  99 + Row() {
  100 + Image(this.protocolState ? $r('app.media.login_checkbox_select') : $r('app.media.login_checkbox_unselected'))
  101 + .width(15)
  102 + .height(15)
  103 + .onClick(() => {
  104 + this.protocolState = !this.protocolState
  105 + })
  106 +
  107 + Text() {
  108 + Span("我已阅读并同意").fontColor("#999999").fontSize(12)
  109 + Span("《用户协议》").fontColor("#ED2800").fontSize(12).onClick(() => {
  110 + let bean = { contentID: "1", pageID: "" } as Params
  111 + WDRouterRule.jumpWithPage(WDRouterPage.loginProtocolPage, bean)
  112 + })
  113 + Span("及").fontColor("#999999").fontSize(12)
  114 + Span("《隐私政策》").fontColor("#ED2800").fontSize(12).onClick(() => {
  115 + let bean = { contentID: "2", pageID: "" } as Params
  116 + WDRouterRule.jumpWithPage(WDRouterPage.loginProtocolPage, bean)
  117 + })
  118 + }
  119 + }.margin({ top: 48 }).alignItems(VerticalAlign.Center)
  120 +
  121 + Row() {
  122 + Text("登录")
  123 + .borderRadius(4)
  124 + .fontColor(this.isSubmit ? "#FFFFFFFF" : "#66FFFFFF")
  125 + .fontSize(18)
  126 + .fontWeight(FontWeight.Medium)
  127 + .margin({ top: 20 })
  128 + .height(44)
  129 + .textAlign(TextAlign.Center)
  130 + .width("100%")
  131 + .backgroundColor(this.isSubmit ? "#FFED2800" : "#99ED2800")
  132 + .onClick(() => {
  133 + if (!this.isSubmit) {
  134 + return
  135 + }
  136 + this.loginSubmit()
  137 +
  138 + })
  139 + }.padding({ left: 25, right: 25 }).width('100%')
  140 +
  141 +
  142 + if (!this.checkCodePage) {
  143 + Text('忘记密码').fontColor('#666666').fontSize(14).margin({ top: 16 })
  144 + .onClick(() => {
  145 + // router.pushUrl({ url: 'pages/login/ForgetPasswordPage' })
  146 + let pageType = { 'pageType': 0 } as Record<string, number>;
  147 + WDRouterRule.jumpWithPage(WDRouterPage.forgetPasswordPage, pageType)
  148 + })
116 } 149 }
117 - }.margin({ top: 48 }).alignItems(VerticalAlign.Center)  
118 150
119 - Row() {  
120 - Text("登录")  
121 - .borderRadius(4)  
122 - .fontColor(this.isSubmit ?"#FFFFFFFF":"#66FFFFFF")  
123 - .fontSize(18)  
124 - .fontWeight(FontWeight.Medium)  
125 - .margin({ top: 20 })  
126 - .height(44)  
127 - .textAlign(TextAlign.Center)  
128 - .width("100%")  
129 - .backgroundColor(this.isSubmit?"#FFED2800":"#99ED2800")  
130 - .onClick(() => {  
131 - if(!this.isSubmit){  
132 - return  
133 - }  
134 - this.loginSubmit() 151 + }.width("100%")
  152 + .alignRules({
  153 + top: { anchor: "__container__", align: VerticalAlign.Top },
  154 + }).id("register")
135 155
136 - })  
137 - }.padding({ left: 25, right: 25 }).width('100%') 156 + //其他登录方式
  157 + Column() {
  158 + this.addOtherLogin()
  159 + }.width('100%')
  160 + .alignRules({
  161 + bottom: { anchor: "__container__", align: VerticalAlign.Bottom },
  162 + }).id("other")
138 163
  164 + //关闭按钮
  165 + Image($r('app.media.login_closed'))
  166 + .width(24)
  167 + .height(24)
  168 + .margin({ top: 10, right: 15 })
  169 + .alignRules({
  170 + top: { anchor: "__container__", align: VerticalAlign.Top },
  171 + right: { anchor: "__container__", align: HorizontalAlign.End }
  172 + })
  173 + .onClick(() => {
  174 + router.back()
  175 + })
  176 + .id('id_close')
139 177
140 - if (!this.checkCodePage) {  
141 - Text('忘记密码').fontColor('#666666').fontSize(14).margin({ top: 16 })  
142 - .onClick(() => {  
143 - // router.pushUrl({ url: 'pages/login/ForgetPasswordPage' })  
144 - let pageType = {'pageType': 0} as Record<string, number>;  
145 - WDRouterRule.jumpWithPage(WDRouterPage.forgetPasswordPage, pageType)  
146 - })  
147 - } 178 + }.width('100%').height('100%')
148 179
149 - }.width("100%")  
150 - .alignRules({  
151 - top: { anchor: "__container__", align: VerticalAlign.Top },  
152 - }).id("register") 180 + ProtocolComponent({
  181 + cancelMethod: (): void => this.cancelProtocol(),
  182 + agreeMethod: (): void => this.agreeProtocol()
  183 + })
  184 + .visibility(this.isProtocol ? Visibility.Visible : Visibility.None)
153 185
154 - //其他登录方式  
155 - Column() {  
156 - this.addOtherLogin()  
157 - }.width('100%')  
158 - .alignRules({  
159 - bottom: { anchor: "__container__", align: VerticalAlign.Bottom },  
160 - }).id("other")  
161 -  
162 - //关闭按钮  
163 - Image($r('app.media.login_closed'))  
164 - .width(24)  
165 - .height(24)  
166 - .margin({ top: 10, right: 15 })  
167 - .alignRules({  
168 - top: { anchor: "__container__", align: VerticalAlign.Top },  
169 - right: { anchor: "__container__", align: HorizontalAlign.End }  
170 - })  
171 - .onClick(() => {  
172 - router.back()  
173 - })  
174 - .id('id_close') 186 + }.width('100%')
  187 + .height('100%')
175 188
176 - }.width('100%').height('100%')  
177 } 189 }
178 190
179 @Builder 191 @Builder
@@ -366,8 +378,92 @@ struct LoginPage { @@ -366,8 +378,92 @@ struct LoginPage {
366 if (this.protocolState) { 378 if (this.protocolState) {
367 this.requestLogin() 379 this.requestLogin()
368 } else { 380 } else {
369 - this.dialogController.open() 381 + // this.dialogController.open()
  382 + this.isProtocol=true
370 } 383 }
371 384
372 } 385 }
  386 +
  387 + agreeProtocol(): void {
  388 + this.isProtocol = false
  389 + this.protocolState = true
  390 + this.requestLogin()
  391 + }
  392 +
  393 + cancelProtocol(): void {
  394 + this.isProtocol = false
  395 + }
  396 +}
  397 +
  398 +
  399 +@Component
  400 +struct ProtocolComponent {
  401 + cancelMethod?: () => void
  402 + agreeMethod?: () => void
  403 +
  404 + build() {
  405 + Stack() {
  406 + Column() {
  407 + Text("温馨提示")
  408 + .fontColor("#222222")
  409 + .fontSize(18)
  410 + .width("100%")
  411 + .fontWeight(FontWeight.Bold)
  412 + .textAlign(TextAlign.Center)
  413 + .margin({ top: 20 })
  414 + Text() {
  415 + Span("为保障您的合法权益，请阅读并同意").fontSize(14).fontColor("#666666")
  416 + Span("《用户协议》").fontSize(14).fontColor("#ED2800").onClick(() => {
  417 + let bean = { contentID: "1", pageID: "" } as Params
  418 + WDRouterRule.jumpWithPage(WDRouterPage.loginProtocolPage, bean)
  419 + })
  420 + Span("及").fontSize(14).fontColor("#666666")
  421 + Span("《隐私政策》").fontSize(14).fontColor("#ED2800").onClick(() => {
  422 + let bean = { contentID: "2", pageID: "" } as Params
  423 + WDRouterRule.jumpWithPage(WDRouterPage.loginProtocolPage, bean)
  424 + })
  425 + Span("后进行登录").fontSize(14).fontColor("#666666")
  426 + }.margin({ top: 12, left: 16, right: 16 })
  427 +
  428 + Divider().color("#999999").width("100%").margin({ top: 14 }).height('1vp')
  429 + Row() {
  430 + Text('放弃登录')
  431 + .fontSize(16)
  432 + .fontColor("#999999")
  433 + .layoutWeight(1)
  434 + .fontWeight(FontWeight.Medium)
  435 + .textAlign(TextAlign.Center)
  436 + .onClick(() => {
  437 + if (this.cancelMethod) {
  438 + this.cancelMethod()
  439 + }
  440 + })
  441 + .height('100%')
  442 + // Divider().color("#999999").height('100%').width('0.5vp')
  443 + Text('同意并登录')
  444 + .fontSize(16)
  445 + .fontColor("#ED2800")
  446 + .layoutWeight(1)
  447 + .fontWeight(FontWeight.Medium)
  448 + .textAlign(TextAlign.Center)
  449 + .border({
  450 + width: { left: 1 },
  451 + color: "#999999",
  452 + style: { left: BorderStyle.Solid }
  453 +
  454 + })
  455 + .onClick(() => {
  456 + if (this.agreeMethod) {
  457 + this.agreeMethod()
  458 + }
  459 + })
  460 + .height('100%')
  461 + }.layoutWeight(1).justifyContent(FlexAlign.Center)
  462 + }.height(161).backgroundColor(Color.White).borderRadius(6).width('74%')
  463 +
  464 + }.width('100%')
  465 + .height('100%')
  466 + .backgroundColor('#66000000')
  467 +
  468 + }
373 } 469 }