sync

config/router.config.js

@@ -142,6 +142,12 @@ export default [
             isFull: true,
             component: './profile/order',
           },
+          {
+            key: '317',
+            path: '/profile/course',
+            isFull: true,
+            component: './profile/course',
+          },
         ],
       },
     ],

src/pages/exam/components/list.js → src/pages/exam/components/list/index.js

@@ -2,7 +2,7 @@ import React from 'react';
 import { SearchBar } from 'antd-mobile';
 import Item from './item';
 
-import styles from './list.less';
+import styles from './index.less';
 
 const Index = ({ dataSource=[], buttonLable, onClickLike, onClickShare, onClickButton,showCnt }) => {
   const renderItem = () => {
@@ -21,7 +21,7 @@ const Index = ({ dataSource=[], buttonLable, onClickLike, onClickShare, onClickB
     <div className={styles.root}>
       <div className="search">
         <SearchBar placeholder="Search" maxLength={8} />
-        <div>{renderItem()}</div>
+        <div className={styles.list}>{renderItem()}</div>
       </div>
     </div>
   );

src/pages/exam/components/list/index.less

+@import "~@/themes/vars.less";
+
+.root{
+  font-size: @font-size-sm;
+  width: 100%;
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
+  padding: 16px;
+  .list{
+    padding-top: 16px;
+  }
+}
\ No newline at end of file

src/pages/exam/components/item.js → src/pages/exam/components/list/item.js

@@ -20,7 +20,9 @@ const Index = ({
 
   return (
     <div className={styles.root}>
+     <div>
      <img src={image} alt="" />
+     </div>
       <div className={styles.right}>
         <div className={styles.title}>{title}</div>
         <div className={styles.action} style={showActionStyle}>

src/pages/exam/components/item.less → src/pages/exam/components/list/item.less

@@ -13,7 +13,7 @@
   }
   display: flex;
   justify-content: space-between;
-  padding: @space-xxxs @space-xxs;
+  margin-bottom: 16px;
   img {
     border-radius: 5px;
     width: 120px;
@@ -23,11 +23,12 @@
     display: flex;
     flex-direction: column;
     justify-content: space-between;
-    padding-left: @space-xxxs;
+    padding: 4px 0 4px 16px;
     .title {
       font-size: @space-sm;
-      font-weight: 500;
+      font-weight: 600;
       color: @item-title-color;
+      line-height: 1.5;
     }
     .action {
       display: flex;

src/pages/exam/components/select/index.js

@@ -2,9 +2,7 @@ import React, { useState } from 'react';
 import router from 'umi/router';
 
 import styles from './index.less';
-import config from '@/config';
 import { Button } from 'antd-mobile';
-import classNames from 'classNames';
 import Option from './option';
 const Index = ({ type = 0, analysis, title, total, no, rightAnswer, optionList = [] }) => {
   const [isShowAnswer, setIsShowAnswer] = useState(false);
@@ -18,7 +16,6 @@ const Index = ({ type = 0, analysis, title, total, no, rightAnswer, optionList =
     router.push('/exam/question/submit/analysis/0');
   };
 
-  const selectOption = () => {};
 
   const handleSelect = (id, isSelected) => {
     options.forEach(item => {

src/pages/exam/components/written/index.js

+import React, { useState } from 'react';
+import router from 'umi/router';
+import { Button, InputItem, TextareaItem } from 'antd-mobile';
+
+import styles from './index.less';
+const Index = ({ type = 3, no, total, title, analysis, rightAnswer }) => {
+  const [isShowAnswer, setIsShowAnswer] = useState(false);
+
+  const showAnswer = () => {
+    setIsShowAnswer(true);
+  };
+
+  const goSubmitAnalysis = () => {
+    router.push('/exam/question/submit/analysis/0');
+  };
+
+  return (
+    <div className={styles.root}>
+      <div className={styles.content}>
+        <div className={styles.title}>
+          {no}/{total}、{title}
+        </div>
+        <div className={styles.paper}>
+          {type === 3 && (
+            <div className={styles.input}>
+              <InputItem placeholder="请输入" />
+            </div>
+          )}
+          {(type === 4 || type === 6 || type === 8 || type === 9) && (
+            <div className={styles.textarea}>
+              <TextareaItem rows={6} placeholder="请输入" />
+            </div>
+          )}
+        </div>
+        {isShowAnswer && (
+          <div className={styles.answer}>
+            <div className={styles.rightAnswer}>正确答案为：{rightAnswer}</div>
+            <div className={styles.analysis}>
+              <span>题型解析</span>：{analysis}
+            </div>
+            <div className={styles.goAnalysis} onClick={goSubmitAnalysis}>
+              我要解析
+            </div>
+          </div>
+        )}
+        {!isShowAnswer && (
+          <div className={styles.submit}>
+            <Button type="primary" onClick={showAnswer}>
+              查看答案
+            </Button>
+          </div>
+        )}
+      </div>
+      <div className={styles.action}>
+        <div className={styles.pre}>上一题</div>
+        <div className={styles.input}>
+          跳转到
+          <input type="text" />题
+        </div>
+        <div className={styles.next}>下一题</div>
+      </div>
+    </div>
+  );
+};
+export default Index;

src/pages/exam/components/written/index.less

+.root {
+  height: 100%;
+  font-size: 16px;
+  padding: 16px;
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
+  .content {
+    .title {
+      color: #202030;
+      font-weight: 600;
+      line-height: 1.5;
+    }
+
+    .paper {
+      padding: 32px 0 48px;
+      :global {
+        .am-list-item {
+          padding-left: 0;
+        }
+        .am-list-line {
+          padding-right: 0;
+        }
+        .am-input-control {
+          height: 44px;
+          background: rgba(250, 250, 250, 1);
+          border-radius: 4px;
+        }
+      }
+
+      .input {
+        input {
+          line-height: 44px;
+          padding-left: 16px;
+        }
+      }
+
+      .textarea {
+        textarea {
+          background: rgba(250, 250, 250, 1);
+          border-radius: 4px;
+          padding-top: 8px;
+          padding-left: 16px;
+        }
+      }
+    }
+
+    .submit {
+      :global {
+        .am-button {
+          line-height: 40px;
+          font-size: 16px;
+          width: 105px;
+          height: 40px;
+          background: linear-gradient(270deg, rgba(23, 106, 254, 1) 0%, rgba(97, 159, 255, 1) 100%);
+          border-radius: 20px;
+        }
+      }
+    }
+
+    .answer {
+      .rightAnswer {
+        margin-bottom: 16px;
+        color: #3dc484;
+      }
+      .analysis {
+        margin-bottom: 16px;
+        font-size: 14px;
+        color: #202030;
+        line-height: 1.5;
+        span {
+          font-weight: 600;
+        }
+      }
+      .goAnalysis {
+        text-align: right;
+        color: #176aff;
+      }
+    }
+  }
+  .action {
+    display: flex;
+    justify-content: space-between;
+    font-size: 14px;
+    .pre {
+      width: 72px;
+      height: 32px;
+      background: #f9f9f9;
+      border-radius: 16px;
+      color: #cccccc;
+      font-weight: 600;
+      line-height: 32px;
+      text-align: center;
+    }
+    .input {
+      input {
+        width: 36px;
+        height: 26px;
+        border-radius: 4px;
+        border: 1px solid #eff4fe;
+        color: #176aff;
+        font-weight: 500;
+        margin: 0 12px;
+      }
+    }
+    .next {
+      width: 72px;
+      height: 32px;
+      line-height: 32px;
+      background: #e3edfe;
+      border-radius: 16px;
+      color: #176aff;
+      font-weight: 600;
+      text-align: center;
+    }
+  }
+}

src/pages/exam/question/analytical/index.js

 import React from 'react';
-import Select from '../../components/select';
+import Written from '../../components/written';
 import styles from './index.less';
 
 const Index = () => {
   const opt = {
-    type:1,
+    type:9,
     no: 1,
     total: 213,
     title:
@@ -43,7 +43,7 @@ const Index = () => {
   };
   return (
     <>
-      <Select {...opt}/>
+      <Written {...opt}/>
     </>
   );
 };

src/pages/exam/question/argumentation/index.js

 import React from 'react';
-import Select from '../../components/select';
+import Written from '../../components/written';
 import styles from './index.less';
 
 const Index = () => {
   const opt = {
-    type:1,
+    type:4,
     no: 1,
     total: 213,
     title:
@@ -43,7 +43,7 @@ const Index = () => {
   };
   return (
     <>
-      <Select {...opt}/>
+      <Written {...opt}/>
     </>
   );
 };

src/pages/exam/question/caseChoice/index.js

 import React from 'react';
-import Select from '../../components/select';
+import Written from '../../components/written';
 import styles from './index.less';
 
 const Index = () => {
   const opt = {
-    type:1,
+    type:4,
     no: 1,
     total: 213,
     title:
@@ -43,7 +43,7 @@ const Index = () => {
   };
   return (
     <>
-      <Select {...opt}/>
+      <Written {...opt}/>
     </>
   );
 };

src/pages/exam/question/caseMultiple/index.js

 import React from 'react';
-import Select from '../../components/select';
+import Written from '../../components/written';
 import styles from './index.less';
 
 const Index = () => {
   const opt = {
-    type:1,
+    type:8,
     no: 1,
     total: 213,
     title:
@@ -43,7 +43,7 @@ const Index = () => {
   };
   return (
     <>
-      <Select {...opt}/>
+      <Written {...opt}/>
     </>
   );
 };

src/pages/exam/question/completion/index.js

 import React from 'react';
-import Select from '../../components/select';
+import Written from '../../components/written';
 import styles from './index.less';
 
 const Index = () => {
   const opt = {
-    type:1,
+    type:3,
     no: 1,
     total: 213,
     title:
@@ -43,7 +43,7 @@ const Index = () => {
   };
   return (
     <>
-      <Select {...opt}/>
+      <Written {...opt}/>
     </>
   );
 };

src/pages/exam/question/list.js → src/pages/exam/question/list/index.js

 import React from 'react';
-import styles from './list.less';
+import styles from './index.less';
 import router from 'umi/router';
 
 const images = [

src/pages/exam/question/short/index.js

 import React from 'react';
-import Select from '../../components/select';
+import Written from '../../components/written';
 import styles from './index.less';
 
 const Index = () => {
   const opt = {
-    type:1,
+    type:6,
     no: 1,
     total: 213,
     title:
@@ -43,7 +43,7 @@ const Index = () => {
   };
   return (
     <>
-      <Select {...opt}/>
+      <Written {...opt}/>
     </>
   );
 };

src/pages/profile/components/list/index.js

+import React from 'react';
+import Item from './item';
+
+import styles from './index.less';
+
+const Index = ({ dataSource=[]}) => {
+  const renderItem = () => {
+    return dataSource.map(x => (
+      <Item
+        {...x}
+      />
+    ));
+  };
+  return (
+    <div className={styles.root}>
+       <div>{renderItem()}</div>
+    </div>
+  );
+};
+
+export default Index;

src/pages/exam/components/list.less → src/pages/profile/components/list/index.less

@@ -7,4 +7,5 @@
   display: flex;
   flex-direction: column;
   justify-content: space-between;
+  padding: 16px;
 }
\ No newline at end of file

src/pages/profile/components/list/item.js

+import React from 'react';
+import { Button } from 'antd-mobile';
+import Icon from 'components/Icon';
+import styles from './item.less';
+
+const Index = ({ id, image, title, like, share }) => {
+  return (
+    <div className={styles.root}>
+      <div>
+        <img src={image} alt="" />
+      </div>
+      <div className={styles.right}>
+        <div className={styles.title}>{title}</div>
+        <div className={styles.action}>
+          <div className={styles.limitTime}>
+            <span>有效期至</span>
+            <span className={styles.cnt}>2020.05.10</span>
+          </div>
+          <div className={styles.view}>
+            <span>浏览</span>
+            <span className={styles.cnt}>14222</span>
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+};
+
+export default Index;

src/pages/profile/components/list/item.less

+@import '~@/themes/vars.less';
+
+.root {
+  :global {
+    .am-button {
+      background-color: #176aff;
+      height: 24px;
+      line-height: 24px;
+      width: 64px;
+      border-radius: 10px;
+      font-size: 12px;
+    }
+  }
+  display: flex;
+  justify-content: space-between;
+  margin-bottom: 16px;
+  img {
+    border-radius: 5px;
+    width: 120px;
+    height: 92px;
+  }
+  .right {
+    display: flex;
+    flex-direction: column;
+    justify-content: space-between;
+    padding: 4px 0 4px 16px;
+    .title {
+      font-size: @space-sm;
+      font-weight: 600;
+      color: @item-title-color;
+      line-height: 1.5;
+    }
+    .action {
+      display: flex;
+      justify-content: space-between;
+      .cnt{
+        margin-left: 12px;
+      }
+      .limitTime {
+        height: 17px;
+        font-size: 12px;
+        font-weight: 500;
+        color: rgba(236, 164, 0, 1);
+        line-height: 17px;
+      }
+      .view {
+        height: 17px;
+        font-size: 12px;
+        font-weight: 500;
+        color: rgba(204, 204, 204, 1);
+        line-height: 17px;
+      }
+    }
+  }
+}

src/pages/profile/course/index.js

+import React from 'react';
+import List from '../components/list';
+const Index = () => {
+  const dataSource = [
+    {
+      id: 1,
+      image: '/images/exam1.png',
+      title: '2020版中西医结合执业助理医师 模拟试',
+      like: 0,
+      share: 1,
+    },
+    {
+      id: 2,
+      image: '/images/exam1.png',
+      title: '2020版中西医结合执业助理医师 模拟试',
+      like: 0,
+      share: 0,
+    },
+    {
+      id: 3,
+      image: '/images/exam1.png',
+      title: '2020版中西医结合执业助理医师 模拟试',
+      like: 1,
+      share: 1,
+    },
+  ];
+
+  const opt={
+    dataSource,
+  }
+  return (
+    <>
+      <List {...opt}/>
+    </>
+  );
+};
+export default Index;

src/pages/profile/index.js

@@ -64,10 +64,9 @@ const Index = () => {
                 <div className={styles.label}>加入会员</div>
               </div>
             </Item>
-            <Item arrow="horizontal" onClick={() => {}}>
+            <Item arrow="horizontal" onClick={() => {router.push('/profile/order');}}>
               <div className={styles.item}>
                 <Icon
-                  onClick={() => {router.push('/profile/order');}}
                   {...iconOpt}
                   type={require('public/images/profile/my-order.svg')}
                 />
@@ -84,7 +83,7 @@ const Index = () => {
                 <div className={styles.label}>错题集</div>
               </div>
             </Item>
-            <Item arrow="horizontal" onClick={() => {}}>
+            <Item arrow="horizontal" onClick={() => {router.push('/profile/course');}}>
               <div className={styles.item}>
                 <Icon
                   onClick={() => {}}

src/pages/profile/order/index.js

@@ -7,21 +7,21 @@ const list = [
     courseType: '购买普通课程',
     buyTime: '2012.01.23',
     invalidTime: '2012.01.23',
-    amount: 8,
+    amount: 8.00,
   },
   {
     title: '医学细胞生物学（本临床定向）',
     courseType: '购买普通课程',
-    buyTime: '2012.01.23',
-    invalidTime: '2012.01.23',
-    amount: 8,
+    buyTime: '2020.3.28 09:47:11',
+    invalidTime: '2020.3.28 09:47:11',
+    amount: 8.00,
   },
   {
     title: '医学细胞生物学（本临床定向）',
     courseType: '购买普通课程',
-    buyTime: '2012.01.23',
-    invalidTime: '2012.01.23',
-    amount: 8,
+    buyTime: '2020.3.28 09:47:11',
+    invalidTime: '2020.3.28 09:47:11',
+    amount: 8.00,
   },
 ];
 const Index = () => {

src/pages/profile/order/index.less

 .root {
   height: 100%;
-  background:rgba(247,247,247,1);
+  background: rgba(247, 247, 247, 1);
   padding: 16px;
   .item {
     min-height: 121px;
     background: rgba(255, 255, 255, 1);
     border-radius: 4px;
     margin-bottom: 16px;
-    padding: 24px 16px;
+    padding: 16px 16px;
+    .top {
+      display: flex;
+      justify-content: space-between;
       .title{
-      color: #202030;
+        .courseTitle {
           font-size: 16px;
-      font-weight:600;
-      margin-bottom: 8px;
+          font-weight: 600;
+          color: #202030;
+          line-height: 1.5;
         }
-    .content{
-      color: #909096;
+        .courseType {
           font-size: 12px;
+          font-weight: 500;
+          color: rgba(144, 144, 150, 1);
           line-height: 1.5;
         }
-    .noticeTime{
-      text-align: right;
-      color: #CCCCCC;
+      }
+
+      .amount {
+        height: 26px;
+        font-size: 20px;
+        font-weight: 500;
+        color: rgba(255, 0, 0, 1);
+        line-height: 2;
+      }
+    }
+    .bottom {
+      margin-top: 16px;
+      height: 17px;
       font-size: 12px;
+      font-weight: 500;
+      color: rgba(204, 204, 204, 1);
+      line-height: 17px;
+      .time{
+        display: flex;
+        justify-content: space-between;
+      }
     }
   }
 }