修改样式

src/components/pages/race/addRace.vue

@@ -621,7 +621,7 @@ export default {
   width: 90%;
   justify-content: center;
   margin: 0 auto;
-  height: calc(100% - 150px);
+  height: calc(100% - 145px);
 }
 
 .race_btn {

src/components/pages/race/addRace/projectProcess.vue

@@ -46,11 +46,11 @@
                   v-model="sa.allTime"
                   @input="upRacePro"
                   disabled
-                  placeholder="输入阶段总课时"
+                  placeholder="自动计算"
                   @change="isNumber($event, saIndex, '', 0)"
                   style="width: 30%"
                 ></el-input>
-                <div class="plaTime">填写各任务课时后此处将自动计算总课时</div>
+                <div class="plaTime">提示：此处将自动计算总课时。</div>
               </div>
               <div
                 class="remove"

src/components/pages/race/addRace/raceDetail.vue

@@ -127,22 +127,14 @@
                           v-for="(item, index) in CourseType[0]"
                           :key="index"
                         >
-                          <div
+                          <span
+                            style="
+                              color: red;
+                              width: 10px;
+                            "
                             v-if="item.name == '案例组别'"
-                            style="position: relative; width: 120px"
-                          >
-                            <span
-                              style="
-                                color: red;
-                                position: absolute;
-                                top: 0;
-                                left: -10px;
-                              "
-                              v-if="item.name == '案例组别'"
-                              >*</span
-                            ><span>{{ item.name }}</span>
-                          </div>
-                          <span v-else>{{ item.name }}</span>
+                            >*</span
+                          ><span :class="item.name == '案例组别' ? 'isAnli' : ''">{{ item.name }}</span>
                           <el-checkbox-group
                             :class="item.name == '案例组别' ? 'radiusCss' : ''"
                             v-model="raceDetail.type"
@@ -166,9 +158,7 @@
           </div>
           <div class="whiteBg" style="border-radius: 0">
             <div class="right_first">
-              <div class="right_title" id="second">
-                <span style="color: red">*</span>案例封面设置
-              </div>
+              <div class="right_title" id="second">案例封面设置</div>
               <div class="fmBox">
                 <div>
                   <div class="bInfo_title" style="margin-top: 0 !important">
@@ -321,9 +311,7 @@
           </div>
           <div class="whiteBg" style="border-radius: 0">
             <div class="right_first">
-              <div class="right_title" id="sixth">
-                协作者
-              </div>
+              <div class="right_title" id="sixth">协作者</div>
               <div
                 class="addPeople"
                 @click="addAutor(1)"
@@ -508,8 +496,14 @@
                                 :placeholder="item.name"
                               />
                               <div class="chapter_upload_ud">
-                                <div class="chapter_upload_up" @click="upCd($event, index)"></div>
-                                <div class="chapter_upload_down" @click="downCd($event, index)"></div>
+                                <div
+                                  class="chapter_upload_up"
+                                  @click="upCd($event, index)"
+                                ></div>
+                                <div
+                                  class="chapter_upload_down"
+                                  @click="downCd($event, index)"
+                                ></div>
                               </div>
                             </div>
                           </div>
@@ -1307,8 +1301,7 @@ export default {
         return;
       }
       var a = this.raceDetail.data[i - 1];
-      this.raceDetail.data[i - 1] =
-        this.raceDetail.data[i];
+      this.raceDetail.data[i - 1] = this.raceDetail.data[i];
       this.raceDetail.data[i] = a;
       this.$forceUpdate();
     },
@@ -1318,8 +1311,7 @@ export default {
         return;
       }
       var a = this.raceDetail.data[i + 1];
-      this.raceDetail.data[i + 1] =
-        this.raceDetail.data[i];
+      this.raceDetail.data[i + 1] = this.raceDetail.data[i];
       this.raceDetail.data[i] = a;
       this.$forceUpdate();
     },
@@ -1520,17 +1512,20 @@ export default {
 
 .choose > .all_choose:nth-child(2) > span,
 .choose > .all_choose:nth-child(3) > span {
-  letter-spacing: 31px;
+  letter-spacing: 42px;
 }
 
 .all_choose > span {
-  width: 120px;
+  width: 130px;
   /* display: block;
   letter-spacing: 33px;
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis; */
 }
+.isAnli{
+  width: 120px !important;
+}
 
 .all_choose >>> .el-checkbox-group {
   display: flex;

src/components/pages/race/eventCenter/anliDetail.vue

@@ -193,8 +193,8 @@
               anliBox[0].info.data.length)
           "
         >
-          <div class="jdTopNav" style="font-size: 18px">
-            <div class="navBg">基础信息</div>
+          <div class="jdTopNav">
+            <div class="navBg" style="font-size: 18px">基础信息</div>
           </div>
         </div>
         <div
@@ -261,6 +261,7 @@
               <div
                 class="proOverNav"
                 v-html="anliBox[0].info ? anliBox[0].info.courseText : ''"
+                style="padding: 0 10px 10px 10px;"
               ></div>
               <div
                 class="fileLook"
@@ -399,8 +400,8 @@
                 anliBox[0].overview.actiDesign.data.length > 0)
             "
           >
-            <div class="jdTopNav" style="font-size: 18px">
-              <div class="navBg">项目概况</div>
+            <div class="jdTopNav">
+              <div class="navBg" style="font-size: 18px">项目概况</div>
             </div>
           </div>
           <div
@@ -468,6 +469,7 @@
                       ? anliBox[0].overview.driQuestion.brief
                       : ''
                   "
+                  style="padding: 0 10px 10px 10px;"
                 ></div>
                 <div
                   class="fileLook"
@@ -655,6 +657,7 @@
                       ? anliBox[0].overview.tarDesign.brief
                       : ''
                   "
+                  style="padding: 0 10px 10px 10px;"
                 ></div>
                 <div
                   class="fileLook"
@@ -843,6 +846,7 @@
                       ? anliBox[0].overview.actiDesign.brief
                       : ''
                   "
+                  style="padding: 0 10px 10px 10px;"
                 ></div>
                 <div
                   class="fileLook"
@@ -965,7 +969,7 @@
             id="third"
             style="padding: 20px 0 10px 0px"
           >
-            <div class="jdTopNav" style="font-size: 18px">
+            <div class="jdTopNav">
               <div class="jdNavBg">项目安排</div>
             </div>
           </div>
@@ -974,7 +978,12 @@
             :key="jdIndex"
             style="margin: 20px 0 20px 0"
           >
-            <div class="jdTopBox" v-if="jd.staTitle != ''" :id="'jd' + jdIndex">
+            <div
+              class="jdTopBox"
+              v-if="jd.staTitle != ''"
+              :id="'jd' + jdIndex"
+              style="padding: 20px 20px 20px 10px"
+            >
               <div class="jdTopNav">
                 <div class="jdLeftNav">
                   <div
@@ -1021,7 +1030,7 @@
             >
               <div
                 class="jdTopBox"
-                style="padding: 10px 20px"
+                style="padding: 10px 20px 10px 10px"
                 v-if="hd.actName != ''"
               >
                 <div class="jdTopNav">
@@ -1346,19 +1355,10 @@
             class="jdTopBox"
             id="fouth"
             v-if="anliBox[0].process.stageBox[0].brief != ''"
+            style="padding: 20px 20px 20px 0px"
           >
-            <div class="jdTopNav" style="font-size: 18px">
-              <div class="jdLeftNav">
-                <div class="jdImg">
-                  <img
-                    src="../../../../assets/icon/anliDetail/jdTitle.png"
-                    alt=""
-                  />
-                </div>
-                <div class="jdLeftTitle">
-                  <div>项目活动过程</div>
-                </div>
-              </div>
+            <div class="jdTopNav">
+              <div class="bigNavBg">项目活动过程</div>
             </div>
           </div>
           <div
@@ -1371,7 +1371,17 @@
             >
               <div class="whiteBg whiteLeft">
                 <div class="navBgTop">
-                  <div class="navBg">阶段{{ jdIndex + 1 }}</div>
+                  <div class="jdLeftNav">
+                    <div class="jdImg">
+                      <img
+                        src="../../../../assets/icon/anliDetail/jdTitle.png"
+                        alt=""
+                      />
+                    </div>
+                    <div class="jdLeftTitle">
+                      <div>阶段{{ jdIndex + 1 }}</div>
+                    </div>
+                  </div>
                   <el-button v-if="jd.brief != ''" @click="selectNav(jd.brief)"
                     >查看更多</el-button
                   >
@@ -1393,7 +1403,11 @@
                     </div>
                   </div> -->
 
-                  <div class="proOverNav" v-html="jd ? jd.brief : ''"></div>
+                  <div
+                    class="proOverNav"
+                    v-html="jd ? jd.brief : ''"
+                    style="padding: 0 10px 10px 10px"
+                  ></div>
                   <div class="fileLook" v-if="pptImgUrl2.proData[jdIndex]">
                     <div class="whiteRight">
                       <div class="fileTopAll">
@@ -1527,19 +1541,10 @@
               anliBox[0].proexc.imgBox.length > 0 ||
               anliBox[0].proexc.data.length
             "
+            style="padding: 20px 20px 20px 0px"
           >
-            <div class="jdTopNav" style="font-size: 18px">
-              <div class="jdLeftNav">
-                <div class="jdImg">
-                  <img
-                    src="../../../../assets/icon/anliDetail/jdTitle.png"
-                    alt=""
-                  />
-                </div>
-                <div class="jdLeftTitle">
-                  <div>项目成果交流与评价</div>
-                </div>
-              </div>
+            <div class="jdTopNav">
+              <div class="bigNavBg">项目成果交流与评价</div>
             </div>
           </div>
           <div
@@ -1552,7 +1557,17 @@
           >
             <div class="whiteBg whiteLeft">
               <div class="navBgTop">
-                <div class="navBg">活动成果</div>
+                <div class="jdLeftNav">
+                  <div class="jdImg">
+                    <img
+                      src="../../../../assets/icon/anliDetail/jdTitle.png"
+                      alt=""
+                    />
+                  </div>
+                  <div class="jdLeftTitle">
+                    <div>活动成果</div>
+                  </div>
+                </div>
                 <el-button
                   v-if="anliBox[0].proexc.brief != ''"
                   @click="selectNav(anliBox[0].proexc.brief)"
@@ -1590,6 +1605,7 @@
                 <div
                   class="proOverNav"
                   v-html="anliBox[0].proexc ? anliBox[0].proexc.brief : ''"
+                  style="padding: 0 10px 10px 10px"
                 ></div>
                 <div
                   class="fileLook"
@@ -1719,19 +1735,10 @@
               anliBox[0].results.imgBox.length > 0 ||
               anliBox[0].results.data.length
             "
+            style="padding: 20px 20px 20px 0px"
           >
-            <div class="jdTopNav" style="font-size: 18px">
-              <div class="jdLeftNav">
-                <div class="jdImg">
-                  <img
-                    src="../../../../assets/icon/anliDetail/jdTitle.png"
-                    alt=""
-                  />
-                </div>
-                <div class="jdLeftTitle">
-                  <div>项目成效与反思</div>
-                </div>
-              </div>
+            <div class="jdTopNav">
+              <div class="bigNavBg">项目成效与反思</div>
             </div>
           </div>
           <div
@@ -1744,7 +1751,17 @@
           >
             <div class="whiteBg whiteLeft">
               <div class="navBgTop">
-                <div class="navBg">活动反思</div>
+                <div class="jdLeftNav">
+                  <div class="jdImg">
+                    <img
+                      src="../../../../assets/icon/anliDetail/jdTitle.png"
+                      alt=""
+                    />
+                  </div>
+                  <div class="jdLeftTitle">
+                    <div>活动反思</div>
+                  </div>
+                </div>
                 <el-button
                   v-if="anliBox[0].results.brief != ''"
                   @click="selectNav(anliBox[0].results.brief)"
@@ -1782,6 +1799,7 @@
                 <div
                   class="proOverNav"
                   v-html="anliBox[0].results ? anliBox[0].results.brief : ''"
+                  style="padding: 0 10px 10px 10px"
                 ></div>
                 <div
                   class="fileLook"
@@ -3112,7 +3130,7 @@ body {
 }
 .detaBox {
   padding: 10px 0 0 0;
-  background: #e1f1ff;
+  background: #e0eaf3;
   position: relative;
   padding-bottom: 50px;
 }
@@ -3253,7 +3271,8 @@ body {
   height: auto;
 }
 .navBg,
-.jdNavBg {
+.jdNavBg,
+.bigNavBg {
   width: 130px;
   height: 50px;
   background-image: url("../../../../assets/icon/anliDetail/navBg.png");
@@ -3264,6 +3283,10 @@ body {
   margin: 0 0 5px 10px;
   text-indent: 20px;
 }
+.bigNavBg {
+  width: 200px;
+  background-image: url("../../../../assets/icon/anliDetail/longNavBg.png");
+}
 .jdNavBg {
   background-image: url("../../../../assets/icon/anliDetail/jdNavBg.png");
 }
@@ -3309,11 +3332,11 @@ body {
   margin-left: 10px;
   width: 95%;
   /* background: #f6f9fe; */
-  padding: 0 10px 10px 10px;
+  padding: 0 10px 10px 0;
   border-radius: 10px;
   height: auto;
   max-height: 500px;
-  line-height: 26px;
+  line-height: 30px;
 }
 .noImg {
   max-height: 300px;
@@ -3336,11 +3359,11 @@ body {
   flex-wrap: nowrap;
   align-items: center;
   justify-content: space-between;
-  background: #398fc0;
+  background: #4b79a3;
   color: #fff;
   height: 38px;
-  border-top-left-radius: 10px;
-  border-top-right-radius: 10px;
+  border-top-left-radius: 8px;
+  border-top-right-radius: 8px;
   padding: 0 0 0 19px;
   font-size: 14px;
 }
@@ -3350,6 +3373,7 @@ body {
 }
 .fileListImg {
   width: 25px;
+  height: 25px;
 }
 .fileListImg > img {
   width: 100%;
@@ -3639,6 +3663,7 @@ body {
   flex-wrap: nowrap;
   align-items: center;
   margin-left: 10px;
+  color: #707078;
 }
 .jdLeftTitle > div:nth-child(2) {
   margin-left: 5px;
@@ -3822,7 +3847,8 @@ ol {
   border-bottom-right-radius: 5px;
   box-sizing: border-box;
   height: 460px;
-  overflow: auto;
+  overflow-y: auto;
+  overflow-x: hidden;
 }
 .navBTitle {
   background: #fff;
@@ -3878,4 +3904,24 @@ ol {
 .isleftNav {
   top: 65%;
 }
+
+.navLeftBox::-webkit-scrollbar {
+  /*滚动条整体样式*/
+  width: 6px;
+  /*高宽分别对应横竖滚动条的尺寸*/
+  height: 6px;
+}
+
+/*定义滚动条轨道 内阴影+圆角*/
+.navLeftBox::-webkit-scrollbar {
+  border-radius: 10px;
+  background-color: #b8bdc9;
+}
+
+/*定义滑块 内阴影+圆角*/
+.navLeftBox::-webkit-scrollbar-thumb {
+  border-radius: 10px;
+  -webkit-box-shadow: inset 0 0 6px rgb(96, 125, 184);
+  background-color: #0d285c;
+}
 </style>