douaojie

feat: 优化缺省页的交互

@@ -3,9 +3,17 @@ import { EmptyComponent } from '../view/EmptyComponent' @@ -3,9 +3,17 @@ import { EmptyComponent } from '../view/EmptyComponent'
3 @Entry 3 @Entry
4 @Component 4 @Component
5 export struct DefaultPage { 5 export struct DefaultPage {
  6 + retry() {
  7 + console.log('daj点击了重试')
  8 + }
  9 +
6 build() { 10 build() {
7 Row() { 11 Row() {
8 - EmptyComponent({ emptyType: 8 }) 12 + EmptyComponent({
  13 + emptyType: 8, emptyButton: true, retry: () => {
  14 + this.retry()
  15 + }
  16 + })
9 } 17 }
10 } 18 }
11 } 19 }
@@ -56,7 +56,9 @@ export struct EmptyComponent { @@ -56,7 +56,9 @@ export struct EmptyComponent {
56 // private emptySize: SizeOptions = {}; 56 // private emptySize: SizeOptions = {};
57 @State emptyWidth: string | number = CommonConstants.FULL_PARENT; 57 @State emptyWidth: string | number = CommonConstants.FULL_PARENT;
58 @State emptyHeight: string | number = CommonConstants.FULL_PARENT; 58 @State emptyHeight: string | number = CommonConstants.FULL_PARENT;
59 - @State emptyType: number = WDViewDefaultType.WDViewDefaultType_Default 59 + @State emptyType: number = WDViewDefaultType.WDViewDefaultType_Default;
  60 + @State emptyButton: boolean = false
  61 + @State timeNum: number = 10
60 /** 62 /**
61 * The empty image width percentage setting. 63 * The empty image width percentage setting.
62 */ 64 */
@@ -73,6 +75,42 @@ export struct EmptyComponent { @@ -73,6 +75,42 @@ export struct EmptyComponent {
73 * The empty data text opacity. 75 * The empty data text opacity.
74 */ 76 */
75 readonly TEXT_OPACITY: number = 0.4; 77 readonly TEXT_OPACITY: number = 0.4;
  78 + private timer: number = -1
  79 + retry: () => void = () => {
  80 + }
  81 +
  82 + createTimer() {
  83 + if (this.emptyType === 8) {
  84 + this.timer = setInterval(() => {
  85 + this.timeNum--;
  86 + if (this.timeNum === 0) {
  87 + clearInterval(this.timer);
  88 + }
  89 + }, 1000);
  90 + }
  91 + }
  92 +
  93 + destroyTimer() {
  94 + if (this.emptyType === 8) {
  95 + clearInterval(this.timer);
  96 + }
  97 + }
  98 +
  99 + onPageShow(): void {
  100 + this.createTimer()
  101 + }
  102 +
  103 + aboutToAppear(): void {
  104 + this.createTimer()
  105 + }
  106 +
  107 + onPageHide(): void {
  108 + this.destroyTimer()
  109 + }
  110 +
  111 + aboutToDisappear() {
  112 + this.destroyTimer()
  113 + }
76 114
77 build() { 115 build() {
78 this.noProgrammeData(); 116 this.noProgrammeData();
@@ -90,7 +128,7 @@ export struct EmptyComponent { @@ -90,7 +128,7 @@ export struct EmptyComponent {
90 .objectFit(ImageFit.Contain) 128 .objectFit(ImageFit.Contain)
91 // .border({ width: 1, color: Color.Red, radius: 6 }) 129 // .border({ width: 1, color: Color.Red, radius: 6 })
92 130
93 - Text(this.buildNoDataTip()) 131 + Text(this.emptyType !== 8 ? this.buildNoDataTip() : `${this.buildNoDataTip()}(${this.timeNum}s)`)
94 .fontSize($r('app.float.normal_text_size')) 132 .fontSize($r('app.float.normal_text_size'))
95 .fontColor('#000000') 133 .fontColor('#000000')
96 .fontWeight(FontWeight.Normal) 134 .fontWeight(FontWeight.Normal)
@@ -99,6 +137,23 @@ export struct EmptyComponent { @@ -99,6 +137,23 @@ export struct EmptyComponent {
99 .onClick((event: ClickEvent) => { 137 .onClick((event: ClickEvent) => {
100 Logger.info(TAG, `noProgrammeData onClick event?.source: ${event.source}`); 138 Logger.info(TAG, `noProgrammeData onClick event?.source: ${event.source}`);
101 }) 139 })
  140 +
  141 + if (this.emptyButton) {
  142 + Button('点击重试')
  143 + .type(ButtonType.Normal)
  144 + .width(80)
  145 + .height(28)
  146 + .backgroundColor('#fffffff')
  147 + .fontColor('#FF666666')
  148 + .border({ width: 1 })
  149 + .borderColor('#FFEDEDED')
  150 + .fontSize($r('app.float.font_size_12'))
  151 + .margin({ top: 16 })
  152 + .padding(0)
  153 + .onClick(() => {
  154 + this.retry()
  155 + })
  156 + }
102 } 157 }
103 .justifyContent(FlexAlign.Center) 158 .justifyContent(FlexAlign.Center)
104 .width(this.emptyWidth) 159 .width(this.emptyWidth)
@@ -127,7 +182,7 @@ export struct EmptyComponent { @@ -127,7 +182,7 @@ export struct EmptyComponent {
127 } else if (this.emptyType === WDViewDefaultType.WDViewDefaultType_NoBooking) { 182 } else if (this.emptyType === WDViewDefaultType.WDViewDefaultType_NoBooking) {
128 contentString = '暂无预约' 183 contentString = '暂无预约'
129 } else if (this.emptyType === WDViewDefaultType.WDViewDefaultType_NetworkFailed) { 184 } else if (this.emptyType === WDViewDefaultType.WDViewDefaultType_NetworkFailed) {
130 - contentString = '' // 前方拥堵,请耐心等待 185 + contentString = '前方拥堵,请耐心等待...' // 前方拥堵,请耐心等待...
131 } else if (this.emptyType === WDViewDefaultType.WDViewDefaultType_NoVisitAccount) { 186 } else if (this.emptyType === WDViewDefaultType.WDViewDefaultType_NoVisitAccount) {
132 contentString = '该号主暂时无法访问' // 前方拥堵,请耐心等待 187 contentString = '该号主暂时无法访问' // 前方拥堵,请耐心等待
133 } else if (this.emptyType === WDViewDefaultType.WDViewDefaultType_NoLiveEnd) { 188 } else if (this.emptyType === WDViewDefaultType.WDViewDefaultType_NoLiveEnd) {
@@ -163,7 +218,7 @@ export struct EmptyComponent { @@ -163,7 +218,7 @@ export struct EmptyComponent {
163 } else if (this.emptyType === WDViewDefaultType.WDViewDefaultType_NoBooking) { 218 } else if (this.emptyType === WDViewDefaultType.WDViewDefaultType_NoBooking) {
164 imageString = $r('app.media.icon_no_appointmentMade') 219 imageString = $r('app.media.icon_no_appointmentMade')
165 } else if (this.emptyType === WDViewDefaultType.WDViewDefaultType_NetworkFailed) { 220 } else if (this.emptyType === WDViewDefaultType.WDViewDefaultType_NetworkFailed) {
166 - imageString = $r('app.media.icon_no_net') 221 + imageString = $r('app.media.icon_no_limiting')
167 } else if (this.emptyType === WDViewDefaultType.WDViewDefaultType_NoVisitAccount) { 222 } else if (this.emptyType === WDViewDefaultType.WDViewDefaultType_NoVisitAccount) {
168 imageString = $r('app.media.icon_no_master1') 223 imageString = $r('app.media.icon_no_master1')
169 } else if (this.emptyType === WDViewDefaultType.WDViewDefaultType_NoLiveEnd) { 224 } else if (this.emptyType === WDViewDefaultType.WDViewDefaultType_NoLiveEnd) {