学习页面

package-lock.json

@@ -8894,9 +8894,9 @@
       }
     },
     "lodash": {
-      "version": "4.17.11",
-      "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.11.tgz",
-      "integrity": "sha512-cQKh8igo5QUhZ7lg38DYWAxMvjSAKG0A8wGSVimP07SIUEK2UO+arSRKbRZWtelMtN5V0Hkwh5ryOto/SshYIg=="
+      "version": "4.17.15",
+      "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.15.tgz",
+      "integrity": "sha512-8xOcRHvCjnocdS5cpwXQXVzmmh5e5+saE2QGoeQmbKmRS6J3VQppPOIt0MnmE+4xlZoumy0GPG0D0MVIQbNA1A=="
     },
     "lodash-es": {
       "version": "4.17.11",

package.json

@@ -43,7 +43,7 @@
     "js-cookie": "^2.2.0",
     "less": "^3.9.0",
     "less-loader": "^4.1.0",
-    "lodash": "^4.17.11",
+    "lodash": "^4.17.15",
     "mini-css-extract-plugin": "0.5.0",
     "node-sass": "^4.11.0",
     "optimize-css-assets-webpack-plugin": "5.0.1",

src/common/v-list-base/index.scss

 .v-list-base-item {
     height: 130px;
     padding: 10px 10px 0;
+    position: relative;
 
     .content {
         display: flex;

src/components/study/myCourses/index.js

@@ -114,22 +114,35 @@ class MyCourses extends PureComponent {
                                     const Info = (
                                         <div className="info">
                                             <div className='title'>{item.course_title}</div>
-                                            <div className='contact'>QQ群：{item.course_qq}</div>
-                                            {/*<div className="process-status">
+                                            {
+                                                item.is_aist
+                                                    ? <div className='contact'>助教微信：{item.assist_weixin}</div>
+                                                    : <div className='contact'>QQ群：{item.course_qq}</div>
+                                            }
+                                            {
+                                                item.is_aist && item.aist_schedule &&
+                                                <div className="process-status">
                                                     <div className="process-wrapper">
-                                                    <div className="process-bar" style={{width: '50%'}}/>
+                                                        <div className="process-bar"
+                                                             style={{width: `${parseFloat(item.aist_schedule)}%`}}/>
+                                                    </div>
+                                                    <div className="process-text">{item.aist_schedule}</div>
                                                 </div>
-                                                <div className="process-text">50%</div>
-                                            </div>*/}
+                                            }
                                             <Bottom item={item}/>
                                         </div>
                                     )
+
+                                    const status = (
+                                        item.is_aist && <span className='status'>返现</span>
+                                    )
                                     return (
                                         <VList img={item.image_name}
                                                handleClick={this.handleClick}
                                                {...item}
                                                key={index}
                                                info={Info}
+                                               status={status}
                                                id={item['course_id']}
                                         />
                                     )

src/components/study/myCourses/my-courses.scss

-.info {
+#study {
+    .info {
         display: flex;
         flex-wrap: wrap;
         width: 55%;
@@ -19,13 +20,14 @@
             width: 100%;
         }
 
-    .process{
-        &-status{
+        .process {
+            &-status {
                 display: flex;
                 justify-content: space-between;
                 align-items: center;
             }
-        &-wrapper{
+
+            &-wrapper {
                 position: relative;
                 width: 147px;
                 height: 6px;
@@ -33,7 +35,8 @@
                 border-radius: 4px;
                 margin-right: 14px;
             }
-        &-bar{
+
+            &-bar {
                 position: absolute;
                 top: 0;
                 left: 0;
@@ -41,7 +44,8 @@
                 background-color: $active;
                 border-radius: 4px;
             }
-        &-text{
+
+            &-text {
                 color: $active;
                 font-size: 12px;
                 line-height: 15px;
@@ -73,9 +77,9 @@
             color: $white;
             border-radius: 3px;
         }
-}
+    }
 
-.add-course {
+    .add-course {
         padding: 10px 12px;
 
         button.add {
@@ -91,9 +95,9 @@
             border: 1px dashed $active;
             background: transparent;
         }
-}
+    }
 
-.my-course-uid {
+    .my-course-uid {
         width: 375px;
         height: 30px;
         background: $bg_FFF4CE;
@@ -101,9 +105,9 @@
         text-align: center;
         font-size: 12px;
         color: $color_333;
-}
+    }
 
-.empty {
+    .empty {
         height: 100%;
         display: flex;
         flex-direction: column;
@@ -135,4 +139,16 @@
             text-align: center;
             line-height: 30px;
         }
+    }
+
+    .status {
+        position: absolute;
+        top: 0;
+        right: 0;
+        padding: 2px 6px;
+        border-radius: 11px 0 0 11px;
+        font-size: 14px;
+        color: #fff;
+        background: linear-gradient(to bottom, #FF4000, #FD7700);
+    }
 }
\ No newline at end of file