增加选择错误后的跳转

src/layouts/CheckLack.js

@@ -44,16 +44,14 @@ const CorrectMark = styled(MarkImg)`
 `;
 
 
-const CheckBtn = withRouter(({ w, h, leftGap, bg, to, history }) => {
+const CheckBtn = withRouter(({ w, h, leftGap, bg, to, correct, history }) => {
   const [showCheckMark, setShowCheckMark] = useState(false);
   function handleClick(e) {
     e.preventDefault();
     setShowCheckMark(true);
-    if(to !== '#') {
     setTimeout(() => {
       history.push(to);
-      }, 500);
-    }
+    }, 1000);
   }
   return (
     <StyledBtn
@@ -65,7 +63,7 @@ const CheckBtn = withRouter(({ w, h, leftGap, bg, to, history }) => {
       onClick={e => handleClick(e)}
     >
       {
-        to !== '#' ? <CorrectMark show={showCheckMark} src={CorrectImg} /> : <WrongMark show={showCheckMark} src={WrongImg} />
+        correct ? <CorrectMark show={showCheckMark} src={CorrectImg} /> : <WrongMark show={showCheckMark} src={WrongImg} />
       }
     </StyledBtn>
   );
@@ -107,7 +105,8 @@ export default function CheckLack({ config }) {
                   h={config.btns.h}
                   leftGap={config.btns.leftGap}
                   bg={ele.bg}
-                  to={ele.to || '#'}
+                  correct={ele.correct}
+                  to={ele.to}
                 />
               ))
             }

src/pages/corn/getComponent.js

@@ -35,7 +35,9 @@ export default function (idx) {
         ]
       }
     }
-    config.btns.rows[0][idx].to = match.url+'/info';
+    const cornList = ['n', 'p', 'k', 'zn', 'b'];
+    config.btns.rows[0][idx].correct = true;
+    config.btns.rows[0].forEach((ele, i) => ele.to = `/corn/lack-of-${cornList[i]}/info`);
     return <CheckLack config={config} />;
   });
   return Component;

src/pages/rape/getComponent.js

@@ -49,7 +49,16 @@ export default function (lackElement) {
         ]
       }
     }
-    config.btns.rows[lackElement[0]][lackElement[1]].to = match.url+'/info';
+    const rapeList = [
+      ['n', 'p', 'k', 'ga',],
+      ['mg', 'zn', 'b', 's']
+    ];
+    config.btns.rows[lackElement[0]][lackElement[1]].correct = true;
+    config.btns.rows.forEach((r, i) => {
+      r.forEach((ele, j) => {
+        ele.to = `/rape/lack-of-${rapeList[i][j]}/info`
+      });
+    });
     return <CheckLack config={config} />;
   });
   return Component;

src/pages/tomato/getComponent.js

@@ -43,7 +43,11 @@ export default function(idx) {
         ]
       }
     }
-    config.btns.rows[0][idx].to = match.url+'/info';
+    config.btns.rows[0][idx].correct = true;
+    const tomatoList = ['n', 'p', 'k', 'ga', 'mg', 'zn', 'b', 's', 'mu'];
+    config.btns.rows[0].forEach((ele, i) => {
+      ele.to = `/tomato/lack-of-${tomatoList[i]}/info`
+    });
     return <CheckLack config={config} />;
   });
   return Component;

src/pages/wheat/getComponent.js

@@ -26,6 +26,7 @@ const bgs = [ N_Bg, P_Bg, K_Bg, Ga_Bg, Mg_Bg, Zn_Bg, B_Bg, Mn_Bg, Fe_Bg, ]
 
 export default function (idx) {
   const Component = withRouter(({ match }) => {
+    const to = match.url+'/info'
     const config = {
       bg: bgs[idx],
       btns: {
@@ -36,12 +37,16 @@ export default function (idx) {
         leftGap: 48,
         rows: [
           [
-            { bg: N_Btn_Bg }, { bg: P_Btn_Bg }, { bg: K_Btn_Bg }, { bg: Ga_Btn_Bg }, { bg: Mg_Btn_Bg }, { bg: Zn_Btn_Bg }, { bg: B_Btn_Bg }, { bg: Mn_Btn_Bg }, { bg: Fe_Btn_Bg },
+            { bg: N_Btn_Bg, to }, { bg: P_Btn_Bg, to }, { bg: K_Btn_Bg, to }, { bg: Ga_Btn_Bg, to }, { bg: Mg_Btn_Bg, to }, { bg: Zn_Btn_Bg, to }, { bg: B_Btn_Bg, to }, { bg: Mn_Btn_Bg, to }, { bg: Fe_Btn_Bg, to },
           ],
         ]
       }
     }
-    config.btns.rows[0][idx].to = match.url+'/info';
+    config.btns.rows[0][idx].correct = true;
+    const wheatList = ['n', 'p', 'k', 'ga', 'mg', 'zn', 'b', 'mn', 'fe'];
+    config.btns.rows[0].forEach((ele, i) => {
+      ele.to = `/wheat/lack-of-${wheatList[i]}/info`
+    });
     return <CheckLack config={config} />;
   });
   return Component;