修改样式及新增功能

src/components/pages/race/addRace.vue

@@ -80,10 +80,7 @@
           align-items: center;
         "
       >
-        <el-button
-          type="primary"
-          @click="dialogVisible1 = true"
-          v-if="steps == 2"
+        <el-button type="primary" @click="setTime" v-if="steps == 2"
           >跳过</el-button
         >
         <el-button type="primary" @click="lastSteps" v-if="steps != 1"
@@ -138,7 +135,7 @@
           <img src="../../../assets/icon/success.png" alt="" />
         </div>
         <div class="cresteMessage">
-          您确定要跳过网页端填写吗？
+          您确定要跳过网页端填写吗？<span style="color: #ccc">( {{ lastTime }}秒自动关闭 )</span>
           <div style="color: #9a9a9a; line-height: 25px">
             本次案例征集必填内容已提交，为实现更佳的展示效果，建议您根据平台指引完成网页端资料填写。
           </div>
@@ -245,6 +242,8 @@ export default {
         brief: "",
         data: [],
       },
+      lastTime: 5,
+      timer: null,
     };
   },
   methods: {
@@ -254,6 +253,28 @@ export default {
     goTo(path) {
       this.$router.push(path);
     },
+    setTime() {
+      this.dialogVisible1 = true;
+      this.timeLoading();
+      this.timer = setInterval(() => {
+        if (this.lastTime == 0) {
+          this.dialogVisible1 = false;
+          this.timer && this.clearTime();
+        } else {
+          this.timeLoading();
+        }
+      }, 1000);
+    },
+    clearTime() {
+      clearInterval(this.timer);
+      this.timer = null;
+      this.lastTime = 5;
+      this.steps++;
+    },
+    timeLoading() {
+      this.lastTime -= 1;
+      // this.timeText = this.lastTime + "秒倒计时自动关闭";
+    },
     checkSteps(steps) {
       if (steps > 1) {
         if (this.raceInfo.title == "") {
@@ -352,10 +373,12 @@ export default {
             return;
           } else if (t == 2) {
             this.dialogVisible1 = true;
-            setTimeout(() => {
-              this.dialogVisible1 = false;
-              this.steps++;
-            }, 5000);
+            this.setTime();
+            // setTimeout(() => {
+            //   this.dialogVisible1 = false;
+            //   this.steps++;
+            // }, 5000);
+            // this.steps++;
           }
           // this.$message.error("课程分类不能为空");
         }

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

@@ -222,7 +222,7 @@ export default {
     handleDragStart(e, item) {
       this.dragging = item;
     },
-    handleDragEnd(e, item,i) {
+    handleDragEnd(e, item, i) {
       if (this.ending.id === this.dragging.id) {
         return;
       }
@@ -526,7 +526,8 @@ export default {
   flex-wrap: nowrap;
   position: relative;
   width: 145px;
-  height: 150px;
+  max-height: 130px;
+  margin-bottom: 10px;
 }
 .steps > div:nth-child(1) > img {
   z-index: 9;
@@ -547,7 +548,6 @@ export default {
 
 .stepRightNav > div:nth-child(2) {
   width: 130px;
-  height: 63px;
   max-height: 63px;
   display: -webkit-box;
   overflow: hidden;

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

@@ -1212,7 +1212,8 @@ export default {
   flex-wrap: nowrap;
   position: relative;
   width: 145px;
-  height: 150px;
+  max-height: 130px;
+  margin-bottom: 10px;
 }
 .steps > div:nth-child(1) > img {
   z-index: 9;
@@ -1234,7 +1235,6 @@ export default {
 
 .stepRightNav > div:nth-child(2) {
   width: 130px;
-  height: 63px;
   max-height: 63px;
   display: -webkit-box;
   overflow: hidden;

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

@@ -70,13 +70,13 @@
         </div>
       </div>
       <div class="navBox" :class="{ isNavBox: isNavTop >= 300 }">
-        <div class="navTop" @click="jump('first')">
+        <div class="navTop" @click="isShow = 0">
           <div class="navImg" style="width: 24px">
             <img src="../../../../assets/icon/anliDetail/proOver.png" alt="" />
           </div>
           <div>项目基础信息</div>
         </div>
-        <div class="navTop" @click="jump('second')">
+        <div class="navTop" @click="isShow = 1">
           <div class="navImg">
             <img
               src="../../../../assets/icon/anliDetail/proOverTwo.png"
@@ -136,10 +136,14 @@
         <img src="../../../../assets/icon/race/isNoMessage.png" alt />
       </div>
       <div class="messageBox" v-else :class="{ isMessageBox: isNavTop >= 300 }">
-        <div class="leftNav" :class="{ isleftNav: isNavTop >= 300 }">
+        <div
+          class="leftNav"
+          :class="{ isleftNav: isNavTop >= 300 }"
+          v-if="isShow == 1"
+        >
           <div class="topNav">导航栏</div>
           <div class="navLeftBox">
-            <div class="navBTitle" @click="jump('first')">一、项目基础信息</div>
+            <!-- <div class="navBTitle" @click="jump('first')">一、项目基础信息</div>
             <div class="navBTitle" @click="jump('first')">1、基础信息</div>
             <div class="navLTitle" @click="jump('first')">
               <div>1.1</div>
@@ -147,7 +151,7 @@
             </div>
             <div class="navBTitle" @click="jump('second')">
               二、平台案例填写
-            </div>
+            </div> -->
             <div class="navBTitle" @click="jump('second')">1、项目概况</div>
             <div class="navLTitle" @click="jump('second')">
               <div>1.1</div>
@@ -179,7 +183,7 @@
               @click="jumpB(sib)"
             >
               <div>1.{{ sib + 1 }}</div>
-              <div>阶段{{ sib + 1 }}</div>
+              <div>活动阶段{{ sib + 1 }}</div>
             </div>
             <div class="navBTitle" @click="jump('fivth')">
               4、项目成果交流与评价
@@ -189,62 +193,63 @@
             </div>
           </div>
         </div>
-        <div
-          class="jdTopBox"
-          id="first"
-          style="padding: 20px 0 10px 0px"
-          v-if="
-            anliBox[0].info.courseText != '' ||
-            anliBox[0].info.imgBox.length > 0 ||
-            (anliBox &&
-              anliBox[0].info &&
-              anliBox[0].info.data &&
-              anliBox[0].info.data.length)
-          "
-        >
-          <div class="jdTopNav">
-            <div class="navBg" style="font-size: 18px">基础信息</div>
+        <div v-if="isShow == 0">
+          <div
+            class="jdTopBox"
+            id="first"
+            style="padding: 20px 0 10px 0px"
+            v-if="
+              anliBox[0].info.courseText != '' ||
+              anliBox[0].info.imgBox.length > 0 ||
+              (anliBox &&
+                anliBox[0].info &&
+                anliBox[0].info.data &&
+                anliBox[0].info.data.length)
+            "
+          >
+            <div class="jdTopNav">
+              <div class="navBg" style="font-size: 18px">基础信息</div>
+            </div>
           </div>
-        </div>
-        <div
-          class="proOverCss"
-          v-if="
-            anliBox[0].info.courseText != '' ||
-            anliBox[0].info.imgBox.length > 0 ||
-            (anliBox &&
-              anliBox[0].info &&
-              anliBox[0].info.data &&
-              anliBox[0].info.data.length)
-          "
-        >
-          <div class="whiteBg whiteLeft" style="min-height: 200px">
-            <div class="navBgTop">
-              <div class="jdLeftNav">
-                <div class="jdImg">
-                  <img
-                    src="../../../../assets/icon/anliDetail/jdTitle.png"
-                    alt=""
-                  />
-                </div>
-                <div class="jdLeftTitle">
-                  <div>项目简介</div>
+          <div
+            class="proOverCss"
+            v-if="
+              anliBox[0].info.courseText != '' ||
+              anliBox[0].info.imgBox.length > 0 ||
+              (anliBox &&
+                anliBox[0].info &&
+                anliBox[0].info.data &&
+                anliBox[0].info.data.length)
+            "
+          >
+            <div class="whiteBg whiteLeft" style="min-height: 200px">
+              <div class="navBgTop">
+                <div class="jdLeftNav">
+                  <div class="jdImg">
+                    <img
+                      src="../../../../assets/icon/anliDetail/jdTitle.png"
+                      alt=""
+                    />
+                  </div>
+                  <div class="jdLeftTitle">
+                    <div>项目简介</div>
+                  </div>
                 </div>
-              </div>
 
-              <el-button
-                @click="selectNav(anliBox[0].info.courseText)"
-                v-if="selectHeight('poDetail')"
-                >查看更多</el-button
+                <el-button
+                  @click="selectNav(anliBox[0].info.courseText)"
+                  v-if="selectHeight('poDetail')"
+                  >查看更多</el-button
+                >
+              </div>
+              <div
+                v-if="
+                  anliBox[0].info.courseText != '' ||
+                  anliBox[0].info.imgBox.length > 0
+                "
+                class="imgAndNav"
               >
-            </div>
-            <div
-              v-if="
-                anliBox[0].info.courseText != '' ||
-                anliBox[0].info.imgBox.length > 0
-              "
-              class="imgAndNav"
-            >
-              <!-- <div
+                <!-- <div
                 class="leftBox"
                 v-if="
                   anliBox[0].info.imgBox.length > 0 &&
@@ -264,146 +269,151 @@
                   <img :src="anliBox[0].info.imgBox[0].url" alt="" />
                 </div>
               </div> -->
-              <!-- :class="
+                <!-- :class="
                   anliBox[0].info.imgBox.length > 0 ? 'proOverNav' : 'noImg'
                 " -->
-              <div
-                class="proOverNav"
-                v-html="anliBox[0].info ? anliBox[0].info.courseText : ''"
-                style="padding: 10px"
-                id="poDetail"
-              ></div>
-              <div
-                class="fileLook"
-                v-if="
-                  pptImgUrl2.infoData != undefined &&
-                  Object.keys(pptImgUrl2.infoData).length
-                "
-              >
-                <div class="whiteRight">
-                  <div class="fileTopAll">
-                    <div class="fileTop">
-                      <div class="fileListImg">
+                <div
+                  class="proOverNav"
+                  v-html="anliBox[0].info ? anliBox[0].info.courseText : ''"
+                  style="padding: 10px"
+                  id="poDetail"
+                ></div>
+                <div class="fileBox" style="width: 97.5%; margin: 10px auto">
+                  <div
+                    class="fileList"
+                    :class="{
+                      isVfileList: pptImgUrl2.infoData.showType == 3,
+                    }"
+                    v-if="
+                      anliBox &&
+                      anliBox[0].info &&
+                      anliBox[0].info.data &&
+                      anliBox[0].info.data.length
+                    "
+                    style="max-height: 150px; height: auto"
+                  >
+                    <div
+                      class="file"
+                      v-for="(f, fIndex) in anliBox[0].info.data"
+                      :key="fIndex"
+                    >
+                      <div class="fileCss">
+                        <div>
+                          {{ fIndex + 1 }}.{{
+                            f.type == 1 ? "文档" : f.type == 2 ? "视频" : "图片"
+                          }}
+                        </div>
+                        <div>
+                          <el-tooltip
+                            effect="light"
+                            :content="f.name"
+                            placement="top"
+                          >
+                            <div
+                              :class="{
+                                openTaskActive:
+                                  pptImgUrl1.fileType.infoType ==
+                                  pptImgUrl1.infoData[fIndex].id,
+                              }"
+                              @click="lookFile2(f.url, f.type, 0, '', fIndex)"
+                            >
+                              {{ f.name }}
+                            </div>
+                          </el-tooltip>
+                          <!-- <div class="downFile" @click="downloadFile(f.url)">
                         <img
-                          src="../../../../assets/icon/anliDetail/onePic.png"
+                          src="../../../../assets/icon/anliDetail/down.png"
                           alt=""
                         />
+                      </div> -->
+                        </div>
                       </div>
-                      <div>项目方案与活动案例</div>
                     </div>
-                    <el-button @click="lookFile1(pptImgUrl2.infoData.url)"
-                      >全屏查看</el-button
-                    >
                   </div>
-                  <div class="upCss">
-                    <div class="look_file">
-                      <pdf
-                        v-if="pptImgUrl2.infoData.showType == 1"
-                        :pdfUrl="pptImgUrl2.infoData.url"
-                        style="width: 100%; height: 800px; overflow: auto"
-                        :class="{ fullStyle: full }"
-                      ></pdf>
-                      <vword
-                        v-else-if="pptImgUrl2.infoData.showType == 2"
-                        :pdfUrl="pptImgUrl2.infoData.url"
-                        frameborder="0"
-                        width="100%"
-                        height="800"
-                        :class="{ fullStyle: full }"
-                      ></vword>
-                      <div
-                        class="workd_media"
-                        style="height: 400px"
-                        v-else-if="pptImgUrl2.infoData.showType == 3"
-                      >
-                        <video-player
-                          class="video-player vjs-custom-skin"
-                          :playsinline="true"
-                          :options="pptImgUrl2.infoData.playerO"
-                          @play="onPlayerPlay($event)"
-                          style="width: 100%; height: 400px; margin: 0 auto"
-                        ></video-player>
+                  <div class="noFile" v-else>
+                    <img
+                      src="../../../../assets/icon/anliDetail/noFile.jpg"
+                      alt=""
+                    />
+                  </div>
+                </div>
+                <div
+                  class="fileLook"
+                  v-if="
+                    pptImgUrl2.infoData != undefined &&
+                    Object.keys(pptImgUrl2.infoData).length
+                  "
+                >
+                  <div class="whiteRight">
+                    <div class="fileTopAll">
+                      <div class="fileTop">
+                        <div class="fileListImg">
+                          <img
+                            src="../../../../assets/icon/anliDetail/onePic.png"
+                            alt=""
+                          />
+                        </div>
+                        <div>项目方案与活动案例</div>
                       </div>
-                      <div
-                        class="leftImg"
-                        style="height: 800px"
-                        v-else-if="pptImgUrl2.infoData.showType == 4"
+                      <el-button @click="lookFile1(pptImgUrl2.infoData.url)"
+                        >全屏查看</el-button
                       >
-                        <img :src="pptImgUrl2.infoData.url" alt="" />
-                      </div>
                     </div>
-                    <div class="fileBox">
+                    <div class="upCss">
                       <div
-                        class="fileList"
-                        :class="{ isVfileList:pptImgUrl2.infoData.showType == 3 }"
-                        v-if="
-                          anliBox &&
-                          anliBox[0].info &&
-                          anliBox[0].info.data &&
-                          anliBox[0].info.data.length
-                        "
+                        class="look_file"
+                        style="width: 100%; margin: 10px 5px"
                       >
+                        <pdf
+                          v-if="pptImgUrl2.infoData.showType == 1"
+                          :pdfUrl="pptImgUrl2.infoData.url"
+                          style="width: 100%; height: 800px; overflow: auto"
+                          :class="{ fullStyle: full }"
+                        ></pdf>
+                        <!-- <vword
+                          v-else-if="pptImgUrl2.infoData.showType == 2"
+                          :pdfUrl="pptImgUrl2.infoData.url"
+                          frameborder="0"
+                          width="100%"
+                          height="800"
+                          :class="{ fullStyle: full }"
+                        ></vword>
                         <div
-                          class="file"
-                          v-for="(f, fIndex) in anliBox[0].info.data"
-                          :key="fIndex"
+                          class="workd_media"
+                          style="height: 400px"
+                          v-else-if="pptImgUrl2.infoData.showType == 3"
                         >
-                          <div class="fileCss">
-                            <div>
-                              {{ fIndex + 1 }}.{{
-                                f.type == 1
-                                  ? "文档"
-                                  : f.type == 2
-                                  ? "视频"
-                                  : "图片"
-                              }}
-                            </div>
-                            <div>
-                              <el-tooltip
-                                effect="light"
-                                :content="f.name"
-                                placement="top"
-                              >
-                                <div
-                                  :class="{
-                                    openTaskActive:
-                                      pptImgUrl1.fileType.infoType ==
-                                      pptImgUrl1.infoData[fIndex].id,
-                                  }"
-                                  @click="
-                                    lookFile2(f.url, f.type, 0, '', fIndex)
-                                  "
-                                >
-                                  {{ f.name }}
-                                </div>
-                              </el-tooltip>
-                              <!-- <div class="downFile" @click="downloadFile(f.url)">
-                        <img
-                          src="../../../../assets/icon/anliDetail/down.png"
-                          alt=""
-                        />
-                      </div> -->
-                            </div>
-                          </div>
+                          <video-player
+                            class="video-player vjs-custom-skin"
+                            :playsinline="true"
+                            :options="pptImgUrl2.infoData.playerO"
+                            @play="onPlayerPlay($event)"
+                            style="width: 100%; height: 400px; margin: 0 auto"
+                          ></video-player>
                         </div>
-                      </div>
-                      <div class="noFile" v-else>
-                        <img
-                          src="../../../../assets/icon/anliDetail/noFile.jpg"
-                          alt=""
-                        />
+                        <div
+                          class="leftImg"
+                          style="height: 800px"
+                          v-else-if="pptImgUrl2.infoData.showType == 4"
+                        >
+                          <img :src="pptImgUrl2.infoData.url" alt="" />
+                        </div> -->
                       </div>
                     </div>
                   </div>
                 </div>
               </div>
-            </div>
-            <div class="noFile" v-else>
-              <img src="../../../../assets/icon/anliDetail/noFile.jpg" alt="" />
+              <div class="noFile" v-else>
+                <img
+                  src="../../../../assets/icon/anliDetail/noFile.jpg"
+                  alt=""
+                />
+              </div>
             </div>
           </div>
         </div>
-        <div>
+
+        <div v-if="isShow == 1">
           <div
             class="jdTopBox"
             id="second"
@@ -556,7 +566,10 @@
                         <div
                           class="fileList"
                           v-if="anliBox[0].overview.driQuestion.data.length"
-                          :class="{ isVfileList:pptImgUrl2.overData.driData.showType == 3 }"
+                          :class="{
+                            isVfileList:
+                              pptImgUrl2.overData.driData.showType == 3,
+                          }"
                         >
                           <div
                             class="file"
@@ -756,7 +769,10 @@
                         <div
                           class="fileList"
                           v-if="anliBox[0].overview.tarDesign.data.length"
-                          :class="{ isVfileList:pptImgUrl2.overData.tarData.showType == 3 }"
+                          :class="{
+                            isVfileList:
+                              pptImgUrl2.overData.tarData.showType == 3,
+                          }"
                         >
                           <div
                             class="file"
@@ -955,7 +971,10 @@
                         <div
                           class="fileList"
                           v-if="anliBox[0].overview.actiDesign.data.length"
-                          :class="{ isVfileList:pptImgUrl2.overData.actData.showType == 3 }"
+                          :class="{
+                            isVfileList:
+                              pptImgUrl2.overData.actData.showType == 3,
+                          }"
                         >
                           <div
                             class="file"
@@ -1536,7 +1555,14 @@
                           </div>
                         </div>
                         <div class="fileBox">
-                          <div class="fileList" v-if="jd.data.length" :class="{ isVfileList:pptImgUrl2.proData[jdIndex].showType == 3 }">
+                          <div
+                            class="fileList"
+                            v-if="jd.data.length"
+                            :class="{
+                              isVfileList:
+                                pptImgUrl2.proData[jdIndex].showType == 3,
+                            }"
+                          >
                             <div
                               class="file"
                               v-for="(f, fIndex) in jd.data"
@@ -1750,7 +1776,9 @@
                         <div
                           class="fileList"
                           v-if="anliBox[0].proexc.data.length"
-                          :class="{ isVfileList:pptImgUrl2.excData.showType == 3 }"
+                          :class="{
+                            isVfileList: pptImgUrl2.excData.showType == 3,
+                          }"
                         >
                           <div
                             class="file"
@@ -1955,7 +1983,9 @@
                         <div
                           class="fileList"
                           v-if="anliBox[0].results.data.length"
-                          :class="{ isVfileList:pptImgUrl2.effData.showType == 3 }"
+                          :class="{
+                            isVfileList: pptImgUrl2.effData.showType == 3,
+                          }"
                         >
                           <div
                             class="file"
@@ -2197,6 +2227,7 @@ export default {
       },
       playerO: {},
       isNavTop: 0,
+      isShow: 0,
     };
   },
   methods: {
@@ -3536,7 +3567,7 @@ body {
   overflow-y: auto;
   overflow-x: hidden;
 }
-.isVfileList{
+.isVfileList {
   height: 400px;
 }
 .file {