张善主

Merge remote-tracking branch 'origin/main'

1 -import { CustomToast, DateTimeUtils} from 'wdKit/Index'; 1 +import { BreakpointSystem, CustomToast, DateTimeUtils} from 'wdKit/Index';
2 import { WDRouterPage, WDRouterRule } from 'wdRouter/Index'; 2 import { WDRouterPage, WDRouterRule } from 'wdRouter/Index';
3 import { LoginModel } from './LoginModel'; 3 import { LoginModel } from './LoginModel';
4 import { ModifyPasswordRequestItem } from './ModifyPasswordRequestItem'; 4 import { ModifyPasswordRequestItem } from './ModifyPasswordRequestItem';
@@ -29,6 +29,27 @@ struct ModifyPasswordPage { @@ -29,6 +29,27 @@ struct ModifyPasswordPage {
29 }) 29 })
30 pageShowTime:number = 0; 30 pageShowTime:number = 0;
31 pageHideTime:number = 0; 31 pageHideTime:number = 0;
  32 + @StorageProp('currentBreakpoint') @Watch("currentChanged")currentBreakpoint: string = 'sm';
  33 + private breakpointSystem = new BreakpointSystem();
  34 + @State percent:number = 1
  35 +
  36 + currentChanged(){
  37 + if(this.currentBreakpoint == "md" || this.currentBreakpoint == "lg"){
  38 + this.percent = 0.7
  39 + }else {
  40 + this.percent = 1
  41 + }
  42 + }
  43 +
  44 + aboutToAppear() {
  45 + this.breakpointSystem.register();
  46 + this.currentChanged()
  47 + }
  48 +
  49 + aboutToDisappear(): void {
  50 + this.breakpointSystem.unregister();
  51 + }
  52 +
32 53
33 onPageShow() { 54 onPageShow() {
34 this.pageShowTime = DateTimeUtils.getTimeStamp() 55 this.pageShowTime = DateTimeUtils.getTimeStamp()
@@ -42,25 +63,54 @@ struct ModifyPasswordPage { @@ -42,25 +63,54 @@ struct ModifyPasswordPage {
42 } 63 }
43 64
44 build() { 65 build() {
45 - Row() {  
46 - Column() { 66 + Column(){
  67 + this.TitleBackComponent('')
47 this.ModifyPasswordLayout() 68 this.ModifyPasswordLayout()
48 } 69 }
49 - .width('100%')  
50 - .height('100%')  
51 - }.width('100%')  
52 - .height('100%') 70 +
  71 + }
  72 +
  73 + @Builder TitleBackComponent(title:string){
  74 + RelativeContainer() {
  75 + Text(title)
  76 + .fontColor('#FF333333')
  77 + .fontSize(18)
  78 + .textAlign(TextAlign.Center)
  79 + .height(44)
  80 + .alignRules({
  81 + top: { anchor: "__container__", align: VerticalAlign.Top },
  82 + left: { anchor: "__container__", align: HorizontalAlign.Start },
  83 + right: { anchor: "__container__", align: HorizontalAlign.End },
  84 +
  85 + })
  86 + .id('titleContent')
  87 + Image($r("app.media.login_back_icon"))
  88 + .objectFit(ImageFit.Auto)
  89 + .height(24)
  90 + .width(24)
  91 + .margin({
  92 + left: 16, top: 8
  93 + })
  94 + .alignRules({
  95 + top: { anchor: "__container__", align: VerticalAlign.Top },
  96 + left: { anchor: "__container__", align: HorizontalAlign.Start },
  97 + })
  98 + .onClick(() => {
  99 + router.back()
  100 + })
  101 + .id('backImage')
  102 +
  103 + }.height(44)
53 } 104 }
54 105
55 106
56 @Builder ModifyPasswordLayout(){ 107 @Builder ModifyPasswordLayout(){
57 - Navigation() {  
58 Column(){ 108 Column(){
59 Column() { 109 Column() {
60 Text("修改密码").fontWeight(FontWeight.Bold).fontSize(20).maxLines(1) 110 Text("修改密码").fontWeight(FontWeight.Bold).fontSize(20).maxLines(1)
61 } 111 }
62 .width('100%') 112 .width('100%')
63 - .height('75lpx') 113 + .height(`${this.calcHeight(75)}lpx`)
64 .alignItems(HorizontalAlign.Start) 114 .alignItems(HorizontalAlign.Start)
65 115
66 Row() { 116 Row() {
@@ -77,12 +127,12 @@ struct ModifyPasswordPage { @@ -77,12 +127,12 @@ struct ModifyPasswordPage {
77 }) 127 })
78 } 128 }
79 .alignItems(VerticalAlign.Center) 129 .alignItems(VerticalAlign.Center)
80 - .height('80lpx') 130 + .height(`${this.calcHeight(80)}lpx`)
81 .backgroundColor('#f5f5f5') 131 .backgroundColor('#f5f5f5')
82 .borderRadius('4vp') 132 .borderRadius('4vp')
83 } 133 }
84 .width('100%') 134 .width('100%')
85 - .height('110lpx') 135 + .height(`${this.calcHeight(110)}lpx`)
86 .backgroundColor(0xffffff0) 136 .backgroundColor(0xffffff0)
87 .alignItems(VerticalAlign.Center) 137 .alignItems(VerticalAlign.Center)
88 138
@@ -100,12 +150,12 @@ struct ModifyPasswordPage { @@ -100,12 +150,12 @@ struct ModifyPasswordPage {
100 }) 150 })
101 } 151 }
102 .alignItems(VerticalAlign.Center) 152 .alignItems(VerticalAlign.Center)
103 - .height('80lpx') 153 + .height(`${this.calcHeight(80)}lpx`)
104 .backgroundColor('#f5f5f5') 154 .backgroundColor('#f5f5f5')
105 .borderRadius('4vp') 155 .borderRadius('4vp')
106 } 156 }
107 .width('100%') 157 .width('100%')
108 - .height('110lpx') 158 + .height(`${this.calcHeight(110)}lpx`)
109 .backgroundColor(0xffffff0) 159 .backgroundColor(0xffffff0)
110 .alignItems(VerticalAlign.Center) 160 .alignItems(VerticalAlign.Center)
111 161
@@ -123,32 +173,32 @@ struct ModifyPasswordPage { @@ -123,32 +173,32 @@ struct ModifyPasswordPage {
123 }) 173 })
124 } 174 }
125 .alignItems(VerticalAlign.Center) 175 .alignItems(VerticalAlign.Center)
126 - .height('80lpx') 176 + .height(`${this.calcHeight(80)}lpx`)
127 .backgroundColor('#f5f5f5') 177 .backgroundColor('#f5f5f5')
128 .borderRadius('4vp') 178 .borderRadius('4vp')
129 } 179 }
130 .width('100%') 180 .width('100%')
131 - .height('110lpx') 181 + .height(`${this.calcHeight(110)}lpx`)
132 .backgroundColor(0xffffff0) 182 .backgroundColor(0xffffff0)
133 .alignItems(VerticalAlign.Center) 183 .alignItems(VerticalAlign.Center)
134 184
135 Column() { 185 Column() {
136 - Text("提示:密码长度6~20位,使用大写字母、小写字母、数字、特殊字符中三种或三种以上").fontSize(12).maxLines(3).fontColor(0x999999).padding({top:'10lpx'}) 186 + Text("提示:密码长度6~20位,使用大写字母、小写字母、数字、特殊字符中三种或三种以上").fontSize(12).maxLines(3).fontColor(0x999999).padding({top:`${this.calcHeight(10)}lpx`})
137 } 187 }
138 .width('100%') 188 .width('100%')
139 - .height('85lpx') 189 + .height(`${this.calcHeight(85)}lpx`)
140 .alignItems(HorizontalAlign.Start) 190 .alignItems(HorizontalAlign.Start)
141 191
142 Row() { 192 Row() {
143 Button( { type: ButtonType.Normal, stateEffect: true }){ 193 Button( { type: ButtonType.Normal, stateEffect: true }){
144 Text("确认") 194 Text("确认")
145 .fontColor("#fff") 195 .fontColor("#fff")
146 - .fontSize("35lpx")  
147 - .lineHeight("50lpx") 196 + .fontSize(`${this.calcHeight(35)}lpx`)
  197 + .lineHeight(`${this.calcHeight(50)}lpx`)
148 .opacity(this.btnStatus ?1:0.5) 198 .opacity(this.btnStatus ?1:0.5)
149 } 199 }
150 .width('100%') 200 .width('100%')
151 - .height('80lpx') 201 + .height(`${this.calcHeight(80)}lpx`)
152 .backgroundColor(this.btnStatus ? '#ED2800' : '#99ED2800') 202 .backgroundColor(this.btnStatus ? '#ED2800' : '#99ED2800')
153 .borderRadius('4vp') 203 .borderRadius('4vp')
154 .onClick(() => { 204 .onClick(() => {
@@ -158,25 +208,22 @@ struct ModifyPasswordPage { @@ -158,25 +208,22 @@ struct ModifyPasswordPage {
158 } 208 }
159 }) 209 })
160 } 210 }
161 - .padding({top:'25lpx'}) 211 + .padding({top:`${this.calcHeight(25)}lpx`})
162 .alignItems(VerticalAlign.Center) 212 .alignItems(VerticalAlign.Center)
163 .width('100%') 213 .width('100%')
164 - .height('120lpx') 214 + .height(`${this.calcHeight(120)}lpx`)
165 215
166 Column() { 216 Column() {
167 - Text("忘记密码").fontSize(12).maxLines(3).fontColor(0x999999).padding({top:'10lpx'}) 217 + Text("忘记密码").fontSize(12).maxLines(3).fontColor(0x999999).padding({top:`${this.calcHeight(10)}lpx`})
168 .onClick(()=>{ 218 .onClick(()=>{
169 WDRouterRule.jumpWithPage(WDRouterPage.forgetPasswordPage) 219 WDRouterRule.jumpWithPage(WDRouterPage.forgetPasswordPage)
170 }) 220 })
171 } 221 }
172 .width('100%') 222 .width('100%')
173 - .height('85lpx') 223 + .height(`${this.calcHeight(85)}lpx`)
174 .alignItems(HorizontalAlign.Center) 224 .alignItems(HorizontalAlign.Center)
175 - }.padding({top:"92lpx",left:"48lpx",right:"48lpx"}) 225 + }.padding({top:`${this.calcHeight(92)}lpx`,left:`${this.calcHeight(48)}lpx`,right:`${this.calcHeight(48)}lpx`})
176 226
177 - }.titleMode(NavigationTitleMode.Mini)  
178 - .backButtonIcon($r("app.media.login_back_icon"))  
179 - .title('')  
180 } 227 }
181 228
182 inputTextChange(){ 229 inputTextChange(){
@@ -211,6 +258,10 @@ struct ModifyPasswordPage { @@ -211,6 +258,10 @@ struct ModifyPasswordPage {
211 this.toastText = msg 258 this.toastText = msg
212 this.dialogToast.open() 259 this.dialogToast.open()
213 } 260 }
  261 +
  262 + calcHeight(value:number): number{
  263 + return value * this.percent
  264 + }
214 } 265 }
215 266
216 267