yangchenggong1_wd

desc:重置密码 适配 折叠屏

@@ -2,7 +2,7 @@ import ArrayList from '@ohos.util.ArrayList'; @@ -2,7 +2,7 @@ import ArrayList from '@ohos.util.ArrayList';
2 import { Params } from '../../../../../../../commons/wdRouter/oh_modules/wdBean/Index'; 2 import { Params } from '../../../../../../../commons/wdRouter/oh_modules/wdBean/Index';
3 import router from '@ohos.router'; 3 import router from '@ohos.router';
4 import { LoginViewModel } from './LoginViewModel'; 4 import { LoginViewModel } from './LoginViewModel';
5 -import { CustomToast, DateTimeUtils, Logger, SPHelper, ToastUtils } from 'wdKit'; 5 +import { BreakpointSystem, CustomToast, DateTimeUtils, Logger, SPHelper, ToastUtils } from 'wdKit';
6 import { 6 import {
7 SpConstants 7 SpConstants
8 } from '../../../../../../../commons/wdNetwork/oh_modules/wdConstant/src/main/ets/constants/SpConstants' 8 } from '../../../../../../../commons/wdNetwork/oh_modules/wdConstant/src/main/ets/constants/SpConstants'
@@ -74,6 +74,17 @@ export struct SettingPasswordPage { @@ -74,6 +74,17 @@ export struct SettingPasswordPage {
74 pageHideResetTime:number = 0; 74 pageHideResetTime:number = 0;
75 pageShowSetTime:number = 0; 75 pageShowSetTime:number = 0;
76 pageHideSetTime:number = 0; 76 pageHideSetTime:number = 0;
  77 + @StorageProp('currentBreakpoint') @Watch("currentChanged")currentBreakpoint: string = 'sm';
  78 + private breakpointSystem = new BreakpointSystem();
  79 + @State percent:number = 1
  80 +
  81 + currentChanged(){
  82 + if(this.currentBreakpoint == "md" || this.currentBreakpoint == "lg"){
  83 + this.percent = 0.7
  84 + }else {
  85 + this.percent = 1
  86 + }
  87 + }
77 88
78 onPageShow(): void { 89 onPageShow(): void {
79 if (this.pageType === 0){//重置密码 90 if (this.pageType === 0){//重置密码
@@ -83,6 +94,10 @@ export struct SettingPasswordPage { @@ -83,6 +94,10 @@ export struct SettingPasswordPage {
83 } 94 }
84 } 95 }
85 96
  97 + calcHeight(value:number): number{
  98 + return value * this.percent
  99 + }
  100 +
86 onPageHide(): void { 101 onPageHide(): void {
87 if (this.pageType === 0){ 102 if (this.pageType === 0){
88 this.pageHideResetTime = DateTimeUtils.getTimeStamp() 103 this.pageHideResetTime = DateTimeUtils.getTimeStamp()
@@ -104,7 +119,13 @@ export struct SettingPasswordPage { @@ -104,7 +119,13 @@ export struct SettingPasswordPage {
104 } 119 }
105 } 120 }
106 121
  122 + aboutToDisappear(): void {
  123 + this.breakpointSystem.unregister();
  124 + }
  125 +
107 aboutToAppear() { 126 aboutToAppear() {
  127 + this.breakpointSystem.register();
  128 + this.currentChanged()
108 let params:SettingPasswordParams = router.getParams() as SettingPasswordParams; 129 let params:SettingPasswordParams = router.getParams() as SettingPasswordParams;
109 this.pageId = parseInt(params.pageID); 130 this.pageId = parseInt(params.pageID);
110 this.getPageListData(this.pageId) 131 this.getPageListData(this.pageId)
@@ -147,10 +168,43 @@ export struct SettingPasswordPage { @@ -147,10 +168,43 @@ export struct SettingPasswordPage {
147 } 168 }
148 169
149 build() { 170 build() {
150 - Navigation() { 171 + Column(){
  172 + this.TitleBackComponent('')
151 this.settingList() //滑动区域 173 this.settingList() //滑动区域
152 - }.titleMode(NavigationTitleMode.Mini)  
153 - .title('') 174 + }
  175 + }
  176 +
  177 + @Builder TitleBackComponent(title:string){
  178 + RelativeContainer() {
  179 + Text(title)
  180 + .fontColor('#FF333333')
  181 + .fontSize(`${this.calcHeight(18)}`)
  182 + .textAlign(TextAlign.Center)
  183 + .height(`${this.calcHeight(44)}`)
  184 + .alignRules({
  185 + top: { anchor: "__container__", align: VerticalAlign.Top },
  186 + left: { anchor: "__container__", align: HorizontalAlign.Start },
  187 + right: { anchor: "__container__", align: HorizontalAlign.End },
  188 +
  189 + })
  190 + .id('titleContent')
  191 + Image($r("app.media.login_back_icon"))
  192 + .objectFit(ImageFit.Auto)
  193 + .height(`${this.calcHeight(24)}`)
  194 + .width(`${this.calcHeight(24)}`)
  195 + .margin({
  196 + left: `${this.calcHeight(16)}`, top: `${this.calcHeight(8)}`
  197 + })
  198 + .alignRules({
  199 + top: { anchor: "__container__", align: VerticalAlign.Top },
  200 + left: { anchor: "__container__", align: HorizontalAlign.Start },
  201 + })
  202 + .onClick(() => {
  203 + router.back()
  204 + })
  205 + .id('backImage')
  206 +
  207 + }.height(`${this.calcHeight(44)}`)
154 } 208 }
155 209
156 // 页面布局 210 // 页面布局
@@ -176,7 +230,7 @@ export struct SettingPasswordPage { @@ -176,7 +230,7 @@ export struct SettingPasswordPage {
176 }) 230 })
177 } 231 }
178 }.width('100%') 232 }.width('100%')
179 - .padding({ left:"31lpx",right:"31lpx",top:"131lpx" }) 233 + .padding({ left:`${this.calcHeight(31)}lpx`,right:`${this.calcHeight(31)}lpx`,top:`${this.calcHeight(131)}lpx` })
180 .height('100%') 234 .height('100%')
181 } 235 }
182 236
@@ -185,10 +239,10 @@ export struct SettingPasswordPage { @@ -185,10 +239,10 @@ export struct SettingPasswordPage {
185 // 标题 239 // 标题
186 @Builder getTitleCell(item: AccoutPageDataModel, alignTitle: HorizontalAlign) { 240 @Builder getTitleCell(item: AccoutPageDataModel, alignTitle: HorizontalAlign) {
187 Column() { 241 Column() {
188 - Text(item.compTitle).fontWeight(FontWeight.Bold).fontSize(20).maxLines(1) 242 + Text(item.compTitle).fontWeight(FontWeight.Bold).fontSize(`${this.calcHeight(20)}`).maxLines(1)
189 } 243 }
190 .width('100%') 244 .width('100%')
191 - .height('75lpx') 245 + .height(`${this.calcHeight(75)}lpx`)
192 .alignItems(alignTitle) 246 .alignItems(alignTitle)
193 } 247 }
194 248
@@ -210,12 +264,12 @@ export struct SettingPasswordPage { @@ -210,12 +264,12 @@ export struct SettingPasswordPage {
210 }) 264 })
211 } 265 }
212 .alignItems(VerticalAlign.Center) 266 .alignItems(VerticalAlign.Center)
213 - .height('80lpx') 267 + .height(`${this.calcHeight(80)}lpx`)
214 .backgroundColor('#f5f5f5') 268 .backgroundColor('#f5f5f5')
215 - .borderRadius('4vp') 269 + .borderRadius(`${this.calcHeight(4)}`)
216 } 270 }
217 .width('100%') 271 .width('100%')
218 - .height('110lpx') 272 + .height(`${this.calcHeight(110)}lpx`)
219 .backgroundColor(0xffffff0) 273 .backgroundColor(0xffffff0)
220 .alignItems(VerticalAlign.Center) 274 .alignItems(VerticalAlign.Center)
221 } 275 }
@@ -235,12 +289,12 @@ export struct SettingPasswordPage { @@ -235,12 +289,12 @@ export struct SettingPasswordPage {
235 }) 289 })
236 } 290 }
237 .alignItems(VerticalAlign.Center) 291 .alignItems(VerticalAlign.Center)
238 - .height('80lpx') 292 + .height(`${this.calcHeight(80)}lpx`)
239 .backgroundColor('#f5f5f5') 293 .backgroundColor('#f5f5f5')
240 - .borderRadius('4vp') 294 + .borderRadius(`${this.calcHeight(4)}`)
241 } 295 }
242 .width('100%') 296 .width('100%')
243 - .height('110lpx') 297 + .height(`${this.calcHeight(110)}lpx`)
244 .backgroundColor(0xffffff0) 298 .backgroundColor(0xffffff0)
245 .alignItems(VerticalAlign.Center) 299 .alignItems(VerticalAlign.Center)
246 } 300 }
@@ -249,7 +303,7 @@ export struct SettingPasswordPage { @@ -249,7 +303,7 @@ export struct SettingPasswordPage {
249 @Builder getCodeCell(item: AccoutPageDataModel) { 303 @Builder getCodeCell(item: AccoutPageDataModel) {
250 Row() { 304 Row() {
251 Stack() { 305 Stack() {
252 - Image($r('app.media.get_code_bg')).width('100%').borderRadius('4vp') 306 + Image($r('app.media.get_code_bg')).width('100%').borderRadius(`${this.calcHeight(4)}`)
253 Row() { 307 Row() {
254 TextInput({ placeholder: item.inputPlacholder }) 308 TextInput({ placeholder: item.inputPlacholder })
255 .placeholderColor("#CCCCCC") 309 .placeholderColor("#CCCCCC")
@@ -264,10 +318,10 @@ export struct SettingPasswordPage { @@ -264,10 +318,10 @@ export struct SettingPasswordPage {
264 .fontColor('#da3e22') 318 .fontColor('#da3e22')
265 } 319 }
266 .width('100%') 320 .width('100%')
267 - }.height('80lpx') 321 + }.height(`${this.calcHeight(80)}lpx`)
268 } 322 }
269 .width('100%') 323 .width('100%')
270 - .height('110lpx') 324 + .height(`${this.calcHeight(110)}lpx`)
271 .backgroundColor(0xffffff0) 325 .backgroundColor(0xffffff0)
272 .alignItems(VerticalAlign.Center) 326 .alignItems(VerticalAlign.Center)
273 } 327 }
@@ -275,7 +329,7 @@ export struct SettingPasswordPage { @@ -275,7 +329,7 @@ export struct SettingPasswordPage {
275 // desc 329 // desc
276 @Builder getDescCell(item: AccoutPageDataModel, alignTitle: HorizontalAlign) { 330 @Builder getDescCell(item: AccoutPageDataModel, alignTitle: HorizontalAlign) {
277 Column() { 331 Column() {
278 - Text(item.compDesc).fontSize(12).maxLines(3).fontColor(0x999999).padding({top:'10lpx'}) 332 + Text(item.compDesc).fontSize(`${this.calcHeight(12)}`).maxLines(3).fontColor(0x999999).padding({top:`${this.calcHeight(10)}lpx`})
279 .onClick(()=>{ 333 .onClick(()=>{
280 if (item.compDesc == '忘记密码') { 334 if (item.compDesc == '忘记密码') {
281 this.showToastTip('密码不符合密码规范') 335 this.showToastTip('密码不符合密码规范')
@@ -283,7 +337,7 @@ export struct SettingPasswordPage { @@ -283,7 +337,7 @@ export struct SettingPasswordPage {
283 }) 337 })
284 } 338 }
285 .width('100%') 339 .width('100%')
286 - .height('85lpx') 340 + .height(`${this.calcHeight(85)}lpx`)
287 .alignItems(alignTitle) 341 .alignItems(alignTitle)
288 } 342 }
289 343
@@ -293,29 +347,29 @@ export struct SettingPasswordPage { @@ -293,29 +347,29 @@ export struct SettingPasswordPage {
293 Text(item.compButtonTitle) 347 Text(item.compButtonTitle)
294 .layoutWeight(1) 348 .layoutWeight(1)
295 .fontColor("#FFFFFF") 349 .fontColor("#FFFFFF")
296 - .borderRadius(4)  
297 - .fontSize(18) 350 + .borderRadius(`${this.calcHeight(4)}`)
  351 + .fontSize(`${this.calcHeight(18)}`)
298 .textAlign(TextAlign.Center) 352 .textAlign(TextAlign.Center)
299 .fontWeight(FontWeight.Medium) 353 .fontWeight(FontWeight.Medium)
300 - .margin({ top: 26 })  
301 - .height(44) 354 + .margin({ top: `${this.calcHeight(26)}` })
  355 + .height(`${this.calcHeight(44)}`)
302 .backgroundColor("#ED2800") 356 .backgroundColor("#ED2800")
303 .enabled(this.btnStatus ? true : false) 357 .enabled(this.btnStatus ? true : false)
304 .opacity(this.btnStatus ? 1: 0.6) 358 .opacity(this.btnStatus ? 1: 0.6)
305 .onClick(() => { 359 .onClick(() => {
306 this.buttonClick() 360 this.buttonClick()
307 }) 361 })
308 - }.padding({top:'25lpx'}) 362 + }.padding({top:`${this.calcHeight(25)}lpx`})
309 .width('100%') 363 .width('100%')
310 } 364 }
311 365
312 // 标题 366 // 标题
313 @Builder getLogoCell(item: AccoutPageDataModel) { 367 @Builder getLogoCell(item: AccoutPageDataModel) {
314 Column() { 368 Column() {
315 - Image(item.compLogo).height('150lpx').width('150lpx') 369 + Image(item.compLogo).height(`${this.calcHeight(150)}lpx`).width(`${this.calcHeight(150)}lpx`)
316 } 370 }
317 .width('100%') 371 .width('100%')
318 - .height('200lpx') 372 + .height(`${this.calcHeight(200)}lpx`)
319 } 373 }
320 374
321 /***************************** 事件处理 ******************************************/ 375 /***************************** 事件处理 ******************************************/