feat:修改基础信息-任务大纲横向滚动条

src/views/projectcenter/TaskPage.vue

@@ -208,7 +208,8 @@
           </div>
           <!-- 概览（有数据） -->
         </a-tab-pane>
-        <a-tab-pane key="2" tab="任务" force-render>
+        <a-tab-pane key="2" tab="任务">
+          <div style="flex: 1">
             <div class="split"></div>
             <div class="onerow">
               <div class="taskmain">任务大纲</div>
@@ -248,9 +249,49 @@
                     v-for="(item, key) in value.children"
                     :key="key"
                   >
+                    <!-- :style="{width:item.course==='在线'?'28px':
+												height:item.course==='在线'?'27px':}" -->
                     <div class="first">
                       <div class="icon">
-                      <img src="../../assets/images/leveladd/zai.png" />
+                        <div
+                          style="
+                            width: 31px;
+                            height: 28px;
+                            display: flex;
+                            align-items: center;
+                            justify-content: center;
+                          "
+                        >
+                          <img
+                            :src="
+                              item.course === '在线'
+                                ? require('../../assets/images/leveladd/zai.png')
+                                : item.course === '面授'
+                                ? require('../../assets/images/leveladd/mian.png')
+                                : item.course === '案例'
+                                ? require('../../assets/images/leveladd/an.png')
+                                : item.course === '作业'
+                                ? require('../../assets/images/leveladd/zuo.png')
+                                : item.course === '考试'
+                                ? require('../../assets/images/leveladd/kao.png')
+                                : item.course === '直播'
+                                ? require('../../assets/images/leveladd/zhi.png')
+                                : item.course === '外链'
+                                ? require('../../assets/images/leveladd/wai.png')
+                                : item.course === '讨论'
+                                ? require('../../assets/images/leveladd/tao.png')
+                                : item.course === '活动'
+                                ? require('../../assets/images/leveladd/huo.png')
+                                : item.course === '测评'
+                                ? require('../../assets/images/leveladd/ce.png')
+                                : item.course === '调研'
+                                ? require('../../assets/images/leveladd/diao.png')
+                                : item.course === '投票'
+                                ? require('../../assets/images/leveladd/tou.png')
+                                : null
+                            "
+                          />
+                        </div>
                       </div>
                       <div>
                         <div class="iconame">「{{ item.course }}」</div>
@@ -353,8 +394,8 @@
                 </a-collapse-panel>
               </a-collapse>
             </div>
-
             <div style="display: flex; height: 20px"></div>
+          </div>
         </a-tab-pane>
         <a-tab-pane key="3" tab="学员">
           <div class="split"></div>
@@ -2461,7 +2502,6 @@ export default {
     background-color: #edf0f5;
   }
   .content {
-    //display: flex;
     //margin: 0 37px;
     .ant-tabs-top > .ant-tabs-nav::before,
     .ant-tabs-bottom > .ant-tabs-nav::before,
@@ -2695,10 +2735,15 @@ export default {
       }
     }
     .taskSyllabus {
+      // flex: 1;
+      overflow-x: scroll;
+
       .ant-collapse {
         border: 0px;
         background-color: rgba(255, 255, 255, 0);
+        min-width: 1040px;
       }
+
       .ant-collapse-content > .ant-collapse-content-box {
         padding-top: 0px;
         padding-bottom: 0px;
@@ -2746,12 +2791,15 @@ export default {
     }
     .course {
       //width: 100%;
+      flex-shrink: 0;
+      margin-right: 24px;
+
       display: flex;
       flex-wrap: wrap;
       align-items: center;
       padding: 25px 0px;
       margin-left: 22px;
-      margin-right: 24px;
+
       //margin: 0 12px;
       border: 1px solid #f2f6fc;
       border-top: 0px;
@@ -2768,12 +2816,13 @@ export default {
           //position: absolute;
           color: #4f5156;
           font-size: 16px;
+          margin-left: 4px;
         }
         .icontext {
           //positipn: absolute;
           color: #999ba3;
           font-size: 14px;
-          margin-left: 8px;
+          margin-left: 12px;
           width: 83px;
         }
       }