merge

mock/challenge.ts

@@ -51,7 +51,7 @@ export default [
                             "resignQg": 999,
                         }
                     ],
-                    "hasChallengeDay": 30,
+                    "hasChallengeDay": 29,
                     "boolNeedResign": false,
                     "boolNeedResignPop": false,
                     "taskInfoList": [

mock/index.ts

@@ -97,8 +97,8 @@ export default [
             "prizeId": "g0e432eeb",
             "type": 4,
             "moneyStatus": 10,
-            "moneyCanReissueStartTimestamp": 1565213353000,
-            "moneyCanReissueEndTimestamp": 1565213353000,
+            "moneyCanReissueStartTimestamp": Date.now() -1565213353000,
+            "moneyCanReissueEndTimestamp":  Date.now() + 1565213353000,
           },
           {
             "extra": {

src/components/consume_credits/consume_credits.jsx

@@ -11,6 +11,7 @@ import API from "../../../src/api/index";
 import store from "../../../src/store/store.ts";
 import { pre_reduce_score } from "../../store/credits.js";
 import { handleLogExposure, handleLogClick } from "@/MD";
+import { _asyncThrottle } from "../../utils/utils.ts";
 
 @observer
 class Consume_credits extends React.Component {
@@ -18,8 +19,8 @@ class Consume_credits extends React.Component {
     super(props);
   }
 
-  handleclock = async (n, code) => {
-    handleLogClick(16)
+  handleclock = _asyncThrottle(async (n, code) => {
+    handleLogClick(16);
     await pre_reduce_score(
       {
         toPlaywayId: "challenge",
@@ -35,11 +36,11 @@ class Consume_credits extends React.Component {
         if (success) {
           ModalCtrl.closeModal();
         }
-        store.getTaskInfo()
-        store.getBaseIndex()
+        store.getTaskInfo();
+        store.getBaseIndex();
       }
     );
-  };
+  });
 
   handleclose = () => {
     ModalCtrl.closeModal();
@@ -47,7 +48,7 @@ class Consume_credits extends React.Component {
 
   render() {
     const { n = 0, code, title } = this.props;
-    handleLogExposure(16)
+    handleLogExposure(16);
     return (
       <div className="consume_credits modal_center">
         <span className="bg"></span>

src/components/consume_qg/consume_qg.jsx

@@ -10,6 +10,7 @@ import Finish_task from "../finish_task/finish_task";
 import API from "../../../src/api/index";
 import store from "../../../src/store/store.ts";
 import { handleLogExposure, handleLogClick } from "@/MD";
+import { _asyncThrottle } from "../../utils/utils.ts";
 
 @observer
 class Consume_qg extends React.Component {
@@ -17,7 +18,7 @@ class Consume_qg extends React.Component {
     super(props);
   }
 
-  handleclock = async (code) => {
+  handleclock = _asyncThrottle(async (code) => {
     handleLogClick(17);
     const { success } = await API.getChallenegeComplete({ taskCode: code });
     if (success) {
@@ -25,7 +26,7 @@ class Consume_qg extends React.Component {
     }
     store.getTaskInfo();
     store.getBaseIndex();
-  };
+  });
 
   handleclose = () => {
     ModalCtrl.closeModal();

src/components/renewmodule/renewmodule.jsx

@@ -11,6 +11,7 @@ import store from "../../../src/store/store.ts";
 import { pre_reduce_score } from "../../store/credits.js";
 import Finish_resign from "../finish_resign/finish_resign.jsx";
 import { handleLogExposure, handleLogClick } from "@/MD";
+import { _asyncThrottle } from "../../utils/utils.ts";
 @observer
 class Renewmodule extends React.Component {
   constructor(props) {
@@ -32,7 +33,8 @@ class Renewmodule extends React.Component {
     this.setState({ activeChoice: choice });
   };
 
-  handleUse = async (activeChoice, inferQg, inferJf, resignJf) => {
+  handleUse = _asyncThrottle(
+    async (activeChoice, inferQg, inferJf, resignJf) => {
       handleLogClick(18);
       if (activeChoice === "credits") {
         // 执行积分续签逻辑 todo
@@ -68,7 +70,8 @@ class Renewmodule extends React.Component {
         store.getTaskInfo();
         store.getBaseIndex();
       }
-  };
+    }
+  );
 
   render() {
     handleLogExposure(18);

src/pages/HomePage/Check/Check.less

@@ -273,11 +273,12 @@
 
     .subcribe {
       position: absolute;
-      left: 580px;
-      width: 380px;
-      height: 46px;
-      font-size: 26px;
-      // .webpBg("HomePage/未订阅.png");
+      left: 574px;
+      width: 92px;
+      height: 34px;
+      top: -2px;
+      // font-size: 26px;
+      .webpBg("HomePage/订阅.png");
     }
 
     .list {

src/pages/HomePage/Check/Check.tsx

@@ -152,7 +152,7 @@ class Check extends React.Component<any, any> {
         <div className="task">
           <div className="task-bg">
             {hasChallengeDay !== challengeTotalDay && (
-              <div className="task-plan">打卡任务 {completedTasks} ｜ {taskCount}</div>
+              <div className="task-plan">打卡任务 |  {completedTasks} / {taskCount}</div>
             )}
             {hasChallengeDay !== challengeTotalDay && Array.isArray(taskInfoList) &&
                 taskInfoList.length > 0 &&
@@ -268,7 +268,7 @@ class Check extends React.Component<any, any> {
 
         <div className="calendar">
           <span className="remind">提醒我签到 挑战失败重新开始</span>
-          <Button className="subcribe" onClick={this.handlesubscribe}>去订阅</Button>
+          <Button className="subcribe" onClick={this.handlesubscribe} />
           <div className="list">
             {Array.from({ length: challengeTotalDay }).map((_, dayIndex) => (
               <div

src/pages/MyPrize/MyPrize.less

@@ -74,16 +74,18 @@
 
       .yifafang {
         position: absolute;
-        width: 178px;
+        width: 141px;
         height: 44px;
-        left: 490px;
+        left: 520px;
         top: 53px;
         text-align: center;
         line-height: 44px;
-        .webpBg("MyPrize/已发放.png");
+        font-size: 23px;
+        color: white;
+        .webpBg("MyPrize/grayBg.png");
       }
 
-      .bufa {
+      .fafangzhong {
         position: absolute;
         width: 141px;
         height: 44px;
@@ -91,10 +93,12 @@
         top: 53px;
         text-align: center;
         line-height: 44px;
-        .webpBg("MyPrize/补发红包.png");
+        .webpBg("MyPrize/redBg.png");
+        color: white;
+        font-size: 23px;
       }
 
-      .fafangzhong {
+      .shibai {
         position: absolute;
         width: 141px;
         height: 44px;
@@ -102,18 +106,60 @@
         top: 53px;
         text-align: center;
         line-height: 44px;
-        .webpBg("MyPrize/发放中.png");
+        font-size: 23px;
+        color: white;
+        .webpBg("MyPrize/grayBg.png");
       }
 
-      .shibai {
+      .meidaoshijian {
         position: absolute;
-        width: 178px;
+        width: 141px;
         height: 44px;
-        left: 490px;
+        left: 520px;
         top: 53px;
         text-align: center;
         line-height: 44px;
-        .webpBg("MyPrize/发放失败.png");
+        font-size: 23px;
+        color: white;
+        .webpBg("MyPrize/redBg.png");
+      }
+
+      .shijianguole {
+        position: absolute;
+        width: 141px;
+        height: 44px;
+        left: 520px;
+        top: 53px;
+        text-align: center;
+        line-height: 44px;
+        font-size: 23px;
+        color: white;
+        .webpBg("MyPrize/grayBg.png");
+      }
+
+      .keyibufa {
+        position: absolute;
+        width: 141px;
+        height: 44px;
+        left: 520px;
+        top: 53px;
+        text-align: center;
+        line-height: 44px;
+        font-size: 23px;
+        color: white;
+        .webpBg("MyPrize/redBg.png");
+      }
+
+      .remian {
+        position: absolute;
+        width: 200px;
+        height: 44px;
+        left: 454px;
+        top: 100px;
+        text-align: right;
+        line-height: 30px;
+        font-size: 23px;
+        .lineClamp1();
       }
 
       .prizeImg {

src/pages/MyPrize/MyPrize.tsx

@@ -2,7 +2,7 @@ import React from 'react';
 import { observer } from 'mobx-react';
 import './MyPrize.less';
 import { Button, Toast } from "@grace/ui";
-import { dateFormatter, miniGoUrl } from "@/utils/utils.ts";
+import { _asyncThrottle, dateFormatter, miniGoUrl } from "@/utils/utils.ts";
 import API from "@/api";
 import { PageCtrl } from "@/core/ctrls/PageCtrl.tsx";
 
@@ -11,6 +11,7 @@ class MyPrize extends React.Component<any, any> {
 
     state = {
         list: [],
+        time: 0
     }
 
     componentDidMount() {
@@ -18,12 +19,13 @@ class MyPrize extends React.Component<any, any> {
     }
 
     async initList() {
-        const { success, data } = await API.records({
+        const { success, data, timeStamp } = await API.records({
             ignoreSp: true,
         });
         if (!success) return;
         this.setState({
             list: data,
+            time: timeStamp
         });
     }
 
@@ -66,30 +68,27 @@ class MyPrize extends React.Component<any, any> {
         }
     }
 
-    handleyifafang = (item) => {
-        Toast.show("已发放")
-    }
+    handleMeidaoshijian = _asyncThrottle(() => {
+        Toast.show("未到补发时间")
+    })
+
+    handleShijianguole = _asyncThrottle(() => {
+        Toast.show("补发已过时效")
+    })
 
-    handlebufa = async (item) => {
-        const { success } = await API.redpacket({
+    handleKeyibufa = _asyncThrottle(async (item) => {
+        await API.redpacket({
             prizeRecordId: item.id,
         });
-        if (success) {
         this.initList();
     }
-    }
-
-    handleshibai = (item) => {
-        Toast.show("发放失败")
-    }
-
-    handlefafangzhong = (item) => {
-        Toast.show("正在发放中，请耐心等待")
-    }
+    );
 
     render() {
 
         const { list } = this.state;
+        const { time } = this.state;
+
 
         return <div className="MyPrize">
             <div className="MyPrizeBg" />
@@ -97,17 +96,57 @@ class MyPrize extends React.Component<any, any> {
             <div className="prizeList">
                 {
                     list.length > 0 ? list.map((item, index) => {
+
+                        const remainingTime = item.moneyCanReissueEndTimestamp - time;
+                        const days = Math.floor(remainingTime / (24 * 60 * 60 * 1000));
+                        const hours = Math.floor((remainingTime % (24 * 60 * 60 * 1000)) / (60 * 60 * 1000));
+
+                        let ProgressText;
+                        if (days === 0 && hours === 0) {
+                            ProgressText = '剩余1小时'; 
+                        } else {
+                            ProgressText = `剩余${days}天${hours}小时`; 
+                        }
+
                         return (
                             <div className="prizeItem" key={index}>
                                 <img className="prizeImg" src={item.extra.icon} />
                                 <div className="prizeName">{item.extra.name}</div>
-                                <div className="getTime">{dateFormatter(item.gmtCreate, "yyyy.MM.dd")}</div>
+                                <div className="getTime">{item?.gmtCreate ? dateFormatter(item.gmtCreate, "yyyy.MM.dd") : ""}</div>
+
                                 {item.type == 4 ? (
                                     <>
-                                        {item.moneyStatus === 1 && <Button className="yifafang" onClick={() => this.handleyifafang(item)} />}
-                                        {item.moneyStatus === 2 && <Button className="shibai" onClick={() => this.handleshibai(item)} />}
-                                        {item.moneyStatus === 10 && <Button className="bufa" onClick={() => this.handlebufa(item)} />}
-                                        {item.moneyStatus === 11 && <Button className="fafangzhong" onClick={() => this.handlefafangzhong(item)} />}
+                                        {item.moneyStatus === 1 && <Button className="yifafang">已发放</Button>}
+                                        {item.moneyStatus === 2 && <Button className="shibai">发放失败</Button>}
+                                        {item.moneyStatus === 11 && <Button className="fafangzhong">发放中</Button>}
+                                        {item.moneyStatus === 10 && (
+                                            <>
+                                                {/* 1. 未到可补发时 */}
+                                                {item.moneyCanReissueStartTimestamp > time && (
+                                                    <Button className="meidaoshijian" onClick={this.handleMeidaoshijian}>
+                                                        补发红包
+                                                    </Button>
+                                                )}
+
+                                                {/* 2. 已过可补发时间 */}
+                                                {time > item.moneyCanReissueEndTimestamp && (
+                                                    <Button className="shijianguole" onClick={this.handleShijianguole}>
+                                                        补发失败
+                                                    </Button>
+                                                )}
+
+                                                {/* 3. 可补发 */}
+                                                {time < item.moneyCanReissueEndTimestamp &&
+                                                    time > item.moneyCanReissueStartTimestamp && (
+                                                        <>
+                                                            <Button className="keyibufa" onClick={() => this.handleKeyibufa(item)}>
+                                                                补发红包
+                                                            </Button>
+                                                            <span className="remian">{ProgressText}</span>
+                                                        </>
+                                                    )}
+                                            </>
+                                        )}
                                     </>
                                 ) : (
                                     <Button className="use" onClick={() => this.clickItem(item)} />