智能选课

src/components/intelligent-recommend/index.scss

 #intelligent-recommend {
   background: linear-gradient(to right, #F1F0F6, #EBF4F9);
-  padding: 59px 10px 0;
+  padding: 59px 10px 18px;
+  height: 100%;
 
   .clearfix {
     &::after {
@@ -172,9 +173,7 @@
   }
 
   .result {
-    width: 355px;
-    height: 614px;
-    padding: 0 15px;
+    padding: 0 15px 30px;
     background: rgba(255, 255, 255, 1);
     border: 1px solid rgba(0, 153, 255, 1);
     border-radius: 8px;
@@ -218,6 +217,10 @@
       font-size: 18px;
       line-height: 36px;
       font-weight: 600;
+
+      &.project {
+        font-size: 14px;
+      }
     }
 
     .salary {
@@ -257,9 +260,11 @@
       .course {
         display: flex;
         justify-content: space-between;
+        margin-bottom: 20px;
 
         .info {
           flex: 1 1 auto;
+          position: relative;
         }
 
         .title {
@@ -282,9 +287,13 @@
         }
 
         .bar {
+          position: absolute;
+          left: 0;
+          bottom: 0;
           display: flex;
           justify-content: space-between;
           align-items: center;
+          width: 100%;
           height: 24px;
           font-size: 0;
 
@@ -321,7 +330,7 @@
             text-decoration: line-through;
           }
 
-          .study{
+          .study {
             background-color: #09f;
             color: #fff;
             font-size: 12px;

src/components/intelligent-recommend/store/index.js

+export const ADD_MESSAGE = 'ADD_MESSAGE'
+export const ADD_RESULT = 'ADD_RESULT'
+export const RESELECT = 'RESELECT'
+
+export const addMessage = payload => {
+  return {
+    type: ADD_MESSAGE,
+    payload,
+  }
+}
+
+export const addResult = payload => {
+  return {
+    type: ADD_RESULT,
+    payload,
+  }
+}
+
+export const reselect = () => {
+  return {
+    type: RESELECT
+  }
+}
+
+const initialState = {
+  processing: [],
+  result: {},
+}
+
+export default function intelligentRecommend(state = initialState, action) {
+  switch (action.type) {
+    case ADD_MESSAGE:
+      return {
+        processing: [...state.processing, action.payload],
+        result: state.result,
+      }
+    case ADD_RESULT:
+      return {
+        processing: state.processing,
+        result: action.payload,
+      }
+    case RESELECT:
+      return initialState
+    default:
+      return state
+  }
+}
\ No newline at end of file

src/store/index.js

@@ -3,13 +3,15 @@ import myCourses from '@/components/study/myCourses/reducers'
 import courseInfo from '@/components/detail/reducers'
 import user from './userReducer'
 import country from '@/components/country/countryRedux'
+import intelligentRecommend from "@components/intelligent-recommend/store"
 
 
 const reducer = combineReducers({
     myCourses,
     courseInfo,
     user,
-    country
+    country,
+    intelligentRecommend
 });
 
 export default reducer;
\ No newline at end of file