updateweb3页面倒计时效果

assets/Scripts/chat18x/ui/panels/Web3PopPanel.ts

@@ -1,4 +1,4 @@
-import { _decorator, Component, Label, Node, Sprite, Vec3 } from "cc";
+import { _decorator, Component, Label, Node, Sprite, Vec3, Color } from "cc";
 import li_BaseView from "../../../Main/Common/li_BaseView";
 import Utils from "../../../Main/Common/Utils";
 import { GButton } from "../../../Main/Common/GButton";
@@ -34,6 +34,10 @@ export class Web3PopPanel extends li_BaseView {
   private goodId: number;
 
   private base: PurchasePanel;
+
+  private countdownTimer: any;
+  private remainingSeconds: number = 0;
+  private isCountingDown: boolean = false;
   openUIDataCT(data: any): void {
     this.refreshData(data);
     this.base.web3PopPanel = this;
@@ -114,7 +118,18 @@ export class Web3PopPanel extends li_BaseView {
     //   TipsPanel.show(LanguageUtils.getText("error_code_"+retCode));
     //   return;
     // }
-    this.expireTimeText.string = expireTime.toString();
+
+    this.stopCountdown();
+
+    this.resetButtonStates();
+
+    if (expireTime > 0) {
+      this.startCountdown(expireTime);
+    } else {
+      this.expireTimeText.string = "已过期";
+      this.expireTimeText.color = new Color(128, 128, 128, 255);
+      this.disableButtons();
+    }
     this.amount.string = amount;
     this.address.string = walletUrl;
     switch (this.curType) {
@@ -199,8 +214,114 @@ export class Web3PopPanel extends li_BaseView {
     });
   }
 
+  onDestroy() {
+    this.stopCountdown();
+    super.onDestroy();
+  }
+
   onClickClose() {
+    this.stopCountdown();
     this.base.web3PopPanel = null;
     this.close();
   }
+
+  private formatCountdownTime(seconds: number): string {
+    if (seconds <= 0) {
+      return "已过期";
+    }
+
+    const hours = Math.floor(seconds / 3600);
+    const minutes = Math.floor((seconds % 3600) / 60);
+    const secs = seconds % 60;
+
+    if (hours > 0) {
+      return `${hours.toString().padStart(2, '0')}:${minutes.toString().padStart(2, '0')}:${secs.toString().padStart(2, '0')}`;
+    } else {
+      return `${minutes.toString().padStart(2, '0')}:${secs.toString().padStart(2, '0')}`;
+    }
+  }
+
+  private startCountdown(totalSeconds: number): void {
+    this.stopCountdown();
+
+    this.remainingSeconds = totalSeconds;
+    this.isCountingDown = true;
+
+    this.updateCountdownDisplay();
+
+    this.countdownTimer = this.schedule(() => {
+      this.remainingSeconds--;
+      this.updateCountdownDisplay();
+
+      if (this.remainingSeconds <= 0) {
+        this.stopCountdown();
+        this.onCountdownExpired();
+      }
+    }, 1);
+  }
+
+  private stopCountdown(): void {
+    if (this.countdownTimer) {
+      this.unschedule(this.countdownTimer);
+      this.countdownTimer = null;
+    }
+    this.isCountingDown = false;
+  }
+
+  private updateCountdownDisplay(): void {
+    if (!this.expireTimeText) return;
+
+    const timeText = this.formatCountdownTime(this.remainingSeconds);
+    this.expireTimeText.string = timeText;
+
+    if (this.remainingSeconds <= 30 && this.remainingSeconds > 0) {
+      this.expireTimeText.color = new Color(255, 0, 0, 255);
+    } else if (this.remainingSeconds <= 0) {
+      this.expireTimeText.color = new Color(128, 128, 128, 255);
+    } else {
+      this.expireTimeText.color = new Color(255, 255, 255, 255);
+    }
+  }
+
+  private resetButtonStates(): void {
+    const copyBtn = this._nodeTab.CopyBtn;
+    if (copyBtn) {
+      const btnComponent = copyBtn.getComponent('Button');
+      if (btnComponent) {
+        btnComponent.interactable = true;
+      }
+    }
+
+    const coinTypeSelectBtn = this._nodeTab.CoinTypeSelectBtn;
+    if (coinTypeSelectBtn) {
+      const btnComponent = coinTypeSelectBtn.getComponent('Button');
+      if (btnComponent) {
+        btnComponent.interactable = true;
+      }
+    }
+  }
+
+  private disableButtons(): void {
+    const copyBtn = this._nodeTab.CopyBtn;
+    if (copyBtn) {
+      const btnComponent = copyBtn.getComponent('Button');
+      if (btnComponent) {
+        btnComponent.interactable = false;
+      }
+    }
+
+    const coinTypeSelectBtn = this._nodeTab.CoinTypeSelectBtn;
+    if (coinTypeSelectBtn) {
+      const btnComponent = coinTypeSelectBtn.getComponent('Button');
+      if (btnComponent) {
+        btnComponent.interactable = false;
+      }
+    }
+  }
+
+  private onCountdownExpired(): void {
+    console.log("Web3支付倒计时已过期");
+    this.disableButtons();
+    TipsPanel.show("支付时间已过期，请重新发起支付");
+  }
 }