feat: NTRP测试入口接入

src/components/NTRPEvaluatePopup/index.tsx

@@ -7,21 +7,25 @@ import React, {
 } from "react";
 import { Button, Input, View, Text, Image } from "@tarojs/components";
 import Taro from "@tarojs/taro";
+import classnames from "classnames";
 import CommonPopup from "../CommonPopup";
 import { getCurrentFullPath } from "@/utils";
 import evaluateService from "@/services/evaluateService";
+import { useUserActions } from "@/store/userStore";
+import { EvaluateCallback, EvaluateScene } from "@/store/evaluateStore";
 import NTRPTestEntryCard from "../NTRPTestEntryCard";
 import NtrpPopupGuide from "../NTRPPopupGuide";
 import Picker from "../Picker/Picker";
 import CloseIcon from "@/static/ntrp/ntrp_popup_close.svg";
 import styles from "./index.module.scss";
 
-const options = ["1.5", "2.0", "2.5", "3.0", "3.5", "4.0", "4.5"].map(
-  (item) => ({
+const ntrpLevels = ["1.5", "2.0", "2.5", "3.0", "3.5", "4.0", "4.5"];
+const options = [
+  ntrpLevels.map((item) => ({
     text: item,
     value: item,
-  })
-);
+  })),
+];
 
 export enum EvaluateType {
   EDIT = "edit",
@@ -41,45 +45,57 @@ export enum SceneType {
 }
 
 interface NTRPEvaluatePopupProps {
-  types: EvaluateType[];
-  displayCondition: DisplayConditionType;
-  scene: SceneType;
+  // types: EvaluateType[];
+  // displayCondition: DisplayConditionType;
+  // scene: SceneType;
   showGuide: boolean;
-  children: React.ReactNode;
+  type: EvaluateScene;
+  // children: React.ReactNode;
 }
 
-function showCondition(scene, ntrp) {
-  if (scene === "list") {
-    // TODO: 显示频率
-    return Math.random() < 0.1 && [0, undefined].includes(ntrp);
-  }
-  return ntrp === "0";
-}
+// function showCondition(scene, ntrp) {
+//   if (scene === "list") {
+//     // TODO: 显示频率
+//     return Math.random() < 0.1 && [0, undefined].includes(ntrp);
+//   }
+//   return true;
+//   return !ntrpLevels.includes(ntrp);
+// }
 
 const NTRPEvaluatePopup = (props: NTRPEvaluatePopupProps, ref) => {
   const {
-    types = ["edit", "evaluate"],
-    displayCondition = "auto",
-    scene = "list",
+    // types = ["edit", "evaluate"],
+    // displayCondition = "auto",
+    // scene = "list",
+    type,
     showGuide = false,
   } = props;
-  const [visible, setVisible] = useState(true);
-  const [ntrp, setNtrp] = useState<undefined | string>();
-  const [guideShow, setGuideShow] = useState(() => props.showGuide);
+  const [visible, setVisible] = useState(false);
+  const [ntrp, setNtrp] = useState<string>("");
+  const [guideShow, setGuideShow] = useState(() => showGuide);
+  const { updateUserInfo } = useUserActions();
+  const [evaCallback, setEvaCallback] = useState<EvaluateCallback>({
+    type: "",
+    next: () => {},
+    onCancel: () => {},
+  });
 
   useImperativeHandle(ref, () => ({
-    show: () => setVisible(true),
+    show: (evaluateCallback) => {
+      setVisible(true);
+      setEvaCallback(evaluateCallback);
+    },
   }));
 
-  function handleEvaluate() {
-    setVisible(false);
-    // TODO: 实现NTRP评估逻辑
-    Taro.navigateTo({
-      url: `/other_pages/ntrp-evaluate/index?redirect=${encodeURIComponent(
-        getCurrentFullPath()
-      )}`,
-    });
-  }
+  // function handleEvaluate() {
+  //   setVisible(false);
+  //   // TODO: 实现NTRP评估逻辑
+  //   Taro.navigateTo({
+  //     url: `/other_pages/ntrp-evaluate/index?redirect=${encodeURIComponent(
+  //       getCurrentFullPath()
+  //     )}`,
+  //   });
+  // }
 
   useEffect(() => {
     getNtrp();
@@ -88,20 +104,32 @@ const NTRPEvaluatePopup = (props: NTRPEvaluatePopupProps, ref) => {
   async function getNtrp() {
     const res = await evaluateService.getLastResult();
     if (res.code === 0 && res.data.has_ntrp_level) {
-      // setNtrp(res.data.user_ntrp_level)
-      setNtrp("0");
+      setNtrp(res.data.user_ntrp_level);
     } else {
-      setNtrp("0");
+      setNtrp("");
     }
   }
 
-  const showEntry =
-    displayCondition === "auto"
-      ? showCondition(scene, ntrp)
-      : displayCondition === "always";
+  // const showEntry =
+  //   displayCondition === "auto"
+  //     ? showCondition(scene, ntrp)
+  //     : displayCondition === "always";
 
   function handleClose() {
+    console.log("hide  ....");
     setVisible(false);
+    setGuideShow(showGuide);
+  }
+
+  async function handleChangeNtrp() {
+    Taro.showLoading({ title: "修改中" });
+    await updateUserInfo({ ntrp_level: ntrp });
+    Taro.showToast({
+      title: "NTRP水平修改成功",
+      icon: "none",
+    });
+    evaCallback.next(true);
+    handleClose();
   }
 
   return (
@@ -116,10 +144,11 @@ const NTRPEvaluatePopup = (props: NTRPEvaluatePopupProps, ref) => {
       >
         {guideShow ? (
           <NtrpPopupGuide
-            close={handleClose}
+            close={() => handleClose()}
             skipGuide={() => {
               setGuideShow(false);
             }}
+            evaluateCallback={evaCallback}
           />
         ) : (
           <View className={styles.container}>
@@ -130,23 +159,42 @@ const NTRPEvaluatePopup = (props: NTRPEvaluatePopupProps, ref) => {
               </View>
             </View>
             <View className={styles.entryCard}>
-              <NTRPTestEntryCard />
+              <NTRPTestEntryCard type={type} evaluateCallback={evaCallback} />
             </View>
             <View className={styles.picker}>
-              <Picker
-                visible={visible}
-                options={options}
-                value={ntrp}
-                onChange={(val) => {
-                  console.log(val);
-                  setNtrp(val.values);
-                }}
-              />
+              {/* FIXME: 有异常渲染问题 */}
+              {visible && (
+                <Picker
+                  visible
+                  options={options}
+                  defaultValue={[ntrp]}
+                  onChange={(val) => {
+                    console.log(val[0]);
+                    if (val[0]?.value) {
+                      setNtrp(val[0]?.value as string);
+                    }
+                  }}
+                />
+              )}
+            </View>
+            <View className={styles.actions}>
+              <View className={styles.buttonWrap}>
+                <Button className={styles.button} onClick={handleClose}>
+                  取消
+                </Button>
+              </View>
+              <View className={styles.buttonWrap}>
+                <Button
+                  className={classnames(styles.button, styles.primary)}
+                  onClick={handleChangeNtrp}
+                >
+                  保存
+                </Button>
+              </View>
             </View>
           </View>
         )}
       </CommonPopup>
-      {showEntry ? props.children : ""}
     </>
   );
 };