From f383824ab86b2e4b4f71e84d5ff853efe6479f29 Mon Sep 17 00:00:00 2001
From: duanledexianxianxian <fengyuchenglun@foxmail.com>
Date: Thu, 30 Apr 2020 08:53:57 +0800
Subject: [PATCH] sync

---
 config/router.config.js                   |   8 +-
 src/pages/exam/basic.js                   |   6 +-
 src/pages/exam/components/item.js         |   2 +-
 src/pages/exam/question/list.js           | 111 +++++++++++++---------
 src/pages/exam/question/list.less         |  18 +++-
 src/pages/exam/question/single/index.js   |   8 ++
 src/pages/exam/question/single/index.less |   3 +
 7 files changed, 105 insertions(+), 51 deletions(-)
 create mode 100644 src/pages/exam/question/single/index.js
 create mode 100644 src/pages/exam/question/single/index.less

diff --git a/config/router.config.js b/config/router.config.js
index 3f3ed12..b8e656f 100644
--- a/config/router.config.js
+++ b/config/router.config.js
@@ -60,10 +60,16 @@ export default [
           },
           {
             key: '315',
-            path: '/exam/questionList',
+            path: '/exam/question/list',
             isFull: true, 
             component: './exam/question/list',
           },
+          {
+            key: '316',
+            path: '/exam/question/single',
+            isFull: true, 
+            component: './exam/question/single',
+          },
         ],
       },
     ],
diff --git a/src/pages/exam/basic.js b/src/pages/exam/basic.js
index 2921365..7e8d231 100644
--- a/src/pages/exam/basic.js
+++ b/src/pages/exam/basic.js
@@ -33,9 +33,9 @@ const Index = () => {
     console.log(id);
   };
   
-  const onClickButton = id => {
-    router.push('/exam/questionList');
-
+  const onClickButton = (id,e) => {
+    e.preventDefault()
+  return  router.push('/exam/question/list');
   };
   
 
diff --git a/src/pages/exam/components/item.js b/src/pages/exam/components/item.js
index 46bf490..767e200 100644
--- a/src/pages/exam/components/item.js
+++ b/src/pages/exam/components/item.js
@@ -42,7 +42,7 @@ const Index = ({
             />
             <div className={styles.label}>分享</div>
           </div>
-          <Button type="primary" onClick={() => onClickButton(id)}>
+          <Button type="primary" onClick={(e) => onClickButton(id,e)}>
             {buttonLable}
           </Button>
         </div>
diff --git a/src/pages/exam/question/list.js b/src/pages/exam/question/list.js
index 823b205..1923fa8 100644
--- a/src/pages/exam/question/list.js
+++ b/src/pages/exam/question/list.js
@@ -1,71 +1,94 @@
 import React from 'react';
 import styles from './list.less';
+import router from 'umi/router';
 
 const images = [
   {
-    image: '',
-    title: '',
+    key: 'single',
+    image: '/images/danxuanti.png',
+    title: '单选题',
   },
   {
-    image: '',
-    title: '',
+    key: 'multiple',
+    image: '/images/duoxuanti.png',
+    title: '多选题',
   },
   {
-    image: '',
-    title: '',
+    key: 'judgment',
+    image: '/images/panduanti.png',
+    title: '判断题',
   },
   {
-    image: '',
-    title: '',
+    key: 'completion',
+    image: '/images/tiankongti.png',
+    title: '填空题',
   },
   {
-    image: '',
-    title: '',
+    key: 'short',
+    image: '/images/jiandati.png',
+    title: '简答题',
   },
   {
-    image: '',
-    title: '',
+    key: 'caseChoice ',
+    image: '/images/anlixuanzeti.png',
+    title: '案例选择题',
   },
   {
-    image: '',
-    title: '',
+    key: 'caseMultiple',
+    image: '/images/mingcijieshi.png',
+    title: '名词解释',
   },
   {
-    image: '',
-    title: '',
+    key: 'b1',
+    image: '/images/b1tixing.png',
+    title: 'B1题型',
   },
   {
-    image: '',
-    title: '',
+    key: 'argumentation',
+    image: '/images/lunshuti.png',
+    title: '论述题',
+  },
+  {
+    key: 'analytical ',
+    image: '/images/fenxiti.png',
+    title: '分析题',
   },
 ];
-const Index = () => {
-  return (
-    <div className={styles.root}>
-      <div className={styles.row}>
-        <div>
-          <img src={'/images/danxuanti.png'} alt=""></img>
-          <span>单选题</span>
-        </div>
+const goPage = key => {
+  router.push(`/exam/question/${key}`);
+};
 
-        <img src={'/images/duoxuanti.png'} alt=""></img>
-        <img src={'/images/panduanti.png'} alt=""></img>
-      </div>
-      <div className={styles.row}>
-        <img src={'/images/tiankongti.png'} alt=""></img>
-        <img src={'/images/jiandati.png'} alt=""></img>
-        <img src={'/images/anlixuanzeti.png'} alt=""></img>
-      </div>
-      <div className={styles.row}>
-        <img src={'/images/mingcijieshi.png'} alt=""></img>
-        <img src={'/images/b1tixing.png'} alt=""></img>
-        <img src={'/images/lunshuti.png'} alt=""></img>
-      </div>
-      <div className={styles.row}>
-        <img src={'/images/fenxiti.png'} alt=""></img>
-      </div>
-    </div>
-  );
+const renderMenu = () => {
+  const menus = [];
+  for (let i = 0; i < images.length; ) {
+    if (i % 3 === 0) {
+      console.log(i)
+      console.log(images[i])
+      console.log(images[i + 1])
+      console.log(images[i + 2])
+      menus.push(
+        <div className={styles.row} key={i}>
+          <div className={styles.col} key={images[i].key}>
+            <img src={images[i].image} alt="" onClick={()=>goPage(images[i].key)} />
+            <span>{images[i].title}</span>
+          </div>
+         {i+1< images.length &&  <div className={styles.col} key={images[i+ 1].key}>
+            <img src={images[i + 1].image} alt="" onClick={()=>goPage(images[i + 1].key)} />
+            <span>{images[i + 1].title}</span>
+          </div>}
+          {i+2< images.length && <div className={styles.col} key={images[i+ 2].key}>
+            <img src={images[i + 2].image} alt="" onClick={()=>goPage(images[i + 2].key)} />
+            <span>{images[i + 2].title}</span>
+          </div>}
+        </div>,
+      );
+    }
+    i += 3;
+  }
+  return menus;
+};
+const Index = () => {
+  return <div className={styles.root}>{renderMenu()}</div>;
 };
 
 export default Index;
diff --git a/src/pages/exam/question/list.less b/src/pages/exam/question/list.less
index 49162bb..ef3a8a9 100644
--- a/src/pages/exam/question/list.less
+++ b/src/pages/exam/question/list.less
@@ -1,12 +1,26 @@
 .root{
   display: flex;
   flex-direction: column;
+  padding-top: 8px;
   .row{
     display: flex;
     justify-content: space-between;
     padding: 0px 8px;
-    img{
-      padding: 4px 4px;
+  
+    .col{
+      position: relative;
+      img{
+        padding: 4px 4px;
+      }
+      span{
+        margin-left: -20px;
+        width: 100px;
+        position: absolute;
+        left: 50%;
+        right: 50%;
+        bottom: 18px;
+        color: #FFFFFF;
+      }
     }
     
   }
diff --git a/src/pages/exam/question/single/index.js b/src/pages/exam/question/single/index.js
new file mode 100644
index 0000000..14d36e2
--- /dev/null
+++ b/src/pages/exam/question/single/index.js
@@ -0,0 +1,8 @@
+import React from "react";
+import styles from "./index.less";
+
+const Index = () => {
+  return <div className={styles.root}>hello wolrd</div>;
+};
+
+export default Index;
\ No newline at end of file
diff --git a/src/pages/exam/question/single/index.less b/src/pages/exam/question/single/index.less
new file mode 100644
index 0000000..185e2bb
--- /dev/null
+++ b/src/pages/exam/question/single/index.less
@@ -0,0 +1,3 @@
+.root{
+  
+}
\ No newline at end of file
-- 
GitLab