11

src/assets/scss/SignUp/referInfo.scss

@@ -239,111 +239,6 @@
 
 
 
-// 报名流程提示
-.referInfoTips {
-  position: absolute;
-  right: 1%;
-  top: 45%;
-  color: var(--color);
-
-  i {
-    font-size: 26px;
-    cursor: pointer;
-  }
-}
-
-.vertical-steps {
-  position: absolute;
-  right: 4%;
-  top: 22%;
-  width: 280px;
-  margin: 0 auto;
-  background-color: #f8f8f8;
-  padding: 30px 20px 20px;
-  border-radius: 8px;
-
-  .vertical-steps-title {
-    text-align: center;
-    margin-bottom: 20px;
-    font-weight: 600;
-    font-size: 18px;
-  }
-}
-
-.step {
-  display: flex;
-  margin-bottom: 10px;
-  position: relative;
-
-  .step-number {
-    width: 20px;
-    height: 20px;
-    border-radius: 50%;
-    background-color: #ddd;
-    color: #666;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    font-size: 12px;
-    margin-right: 15px;
-    flex-shrink: 0;
-    position: relative;
-    z-index: 2;
-    border: 2px solid white;
-    box-shadow:
-      0 4px 12px rgba(24, 144, 255, 0.3),
-      /* 主阴影 */
-      inset 0 2px 4px rgba(255, 255, 255, 0.3),
-      /* 内阴影 */
-      0 0 0 4px rgba(24, 144, 255, 0.1);
-    /* 外发光效果 */
-  }
-
-  .step-number {
-    background-color: var(--color);
-    color: white;
-  }
-
-  .step-content {
-    padding: 5px 0;
-    display: flex;
-
-    /* 向左三角形 */
-    .triangle-left {
-      width: 0;
-      height: 0;
-      border-top: 6px solid transparent;
-      border-right: 12px solid #ffffff;
-      border-bottom: 6px solid transparent;
-    }
-
-    .step-title {
-
-      color: #333;
-      font-size: 12px;
-      background-color: #ffffff;
-      width: 182px;
-      height: 30px;
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      border-radius: 6px;
-      position: relative;
-      top: -8px;
-    }
-  }
-
-  .connector {
-    position: absolute;
-    left: 11px;
-    top: 24px;
-    bottom: -30px;
-    width: 2px;
-    border-left: 1.5px dotted var(--color);
-    z-index: 1;
-  }
-}
-
 // 下载附件
 .annex {
   >div{

src/components/breadcrumb.vue

@@ -23,6 +23,30 @@
         />
       </div>
     </div>
+
+    <!-- 报名流程提示 -->
+    <div
+      class="vertical-steps"
+      v-if="isShowStepsTips && (status == 0 || status == 2)"
+    >
+      <div class="vertical-steps-title">报名流程</div>
+      <div class="vertical_close" @click="toShowSteps">
+        <i class="el-icon-close"></i>
+      </div>
+      <div v-for="(item, index) in steps" :key="item">
+        <div class="step">
+          <div class="step-number">{{ index + 1 }}</div>
+          <div class="step-content">
+            <div class="triangle-left"></div>
+            <div class="step-title">{{ item }}</div>
+          </div>
+          <div class="connector" v-if="index != 5"></div>
+        </div>
+      </div>
+    </div>
+    <div class="referInfoTips" @click="toShowSteps">
+      <i class="el-icon-question"></i>
+    </div>
   </div>
 </template>
 
@@ -35,6 +59,16 @@ export default {
     return {
       status: this.statusNum,
       bCList: [],
+      //  报名流程提示
+      steps: [
+        "登录报名系统",
+        "提交报名信息，等待审核",
+        "收到审核短信，登录系统缴费",
+        "上传缴费截图，等待审核",
+        "收到审核短信，登录系统",
+        "下载入营通知书，完成报名",
+      ],
+      isShowStepsTips: false,
     };
   },
   created() {
@@ -82,11 +116,15 @@ export default {
   },
   watch: {
     statusNum(val) {
-      // console.log(val, "statusNum");
+      console.log(val, "statusNum");
       this.status = val;
     },
   },
-  methods: {},
+  methods: {
+    toShowSteps() {
+      this.isShowStepsTips = !this.isShowStepsTips;
+    },
+  },
 };
 </script>
 
@@ -94,6 +132,114 @@ export default {
 .flex {
   display: flex;
 }
+// 报名流程提示
+.referInfoTips {
+  // position: absolute;
+  // right: 1%;
+  // top: 45%;
+  margin-left: 20px;
+  color: var(--color);
+
+  i {
+    font-size: 26px;
+    cursor: pointer;
+  }
+}
+
+.vertical-steps {
+  position: absolute;
+  right: 2%;
+  top: 9.5%;
+  // width: 280px;
+  margin: 0 auto;
+  background-color: #f8f8f8;
+  padding: 30px 20px 20px;
+  border-radius: 8px;
+  z-index: 99;
+  .vertical-steps-title {
+    text-align: center;
+    margin-bottom: 20px;
+    font-weight: 600;
+    font-size: 18px;
+  }
+
+  .vertical_close {
+    position: absolute;
+    right: 4%;
+    top: 2%;
+    cursor: pointer;
+  }
+}
+
+.step {
+  display: flex;
+  margin-bottom: 10px;
+  position: relative;
+
+  .step-number {
+    width: 20px;
+    height: 20px;
+    border-radius: 50%;
+    background-color: #ddd;
+    color: #666;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    font-size: 12px;
+    margin-right: 15px;
+    flex-shrink: 0;
+    position: relative;
+    z-index: 2;
+    border: 2px solid white;
+    box-shadow: 0 4px 12px rgba(24, 144, 255, 0.3),
+      /* 主阴影 */ inset 0 2px 4px rgba(255, 255, 255, 0.3),
+      /* 内阴影 */ 0 0 0 4px rgba(24, 144, 255, 0.1);
+    /* 外发光效果 */
+  }
+
+  .step-number {
+    background-color: var(--color);
+    color: white;
+  }
+
+  .step-content {
+    padding: 5px 0;
+    display: flex;
+
+    /* 向左三角形 */
+    .triangle-left {
+      width: 0;
+      height: 0;
+      border-top: 6px solid transparent;
+      border-right: 12px solid #ffffff;
+      border-bottom: 6px solid transparent;
+    }
+
+    .step-title {
+      color: #333;
+      font-size: 12px;
+      background-color: #ffffff;
+      width: 182px;
+      height: 30px;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      border-radius: 6px;
+      position: relative;
+      top: -8px;
+    }
+  }
+
+  .connector {
+    position: absolute;
+    left: 11px;
+    top: 24px;
+    bottom: -30px;
+    width: 2px;
+    border-left: 1.5px dotted var(--color);
+    z-index: 1;
+  }
+}
 
 .speed-bg-color {
   background-color: var(--color) !important;

src/components/index/SignUp/pass.vue

@@ -6,14 +6,18 @@
         <i class="icon-icon"></i>
       </div>
       <!-- {{!this.examine_status == 1}} -->
-      <div v-if="this.examine_status==0">同学你好，你的报名资料已提交</div>
-      <div v-if="this.examine_status == 0">
+      <div v-if="this.examine_status == 0 || this.examine_status == 3">
+        同学你好，你的报名资料已提交
+      </div>
+      <div v-if="this.examine_status == 0 || this.examine_status == 3">
         请等待工作人员审核，审核结果将于以短信形式发送到报名手机号，请注意查收。
       </div>
       <div v-if="this.examine_status == 1">
         同学你好，你的材料已经通过审核，请点击“下一步”完成报名
       </div>
-      <div v-if="this.examine_status == 2">同学你好，你的申请材料未能通过审核。原因是：{{ this.examine_reason }}</div>
+      <div v-if="this.examine_status == 2">
+        同学你好，你的申请材料未能通过审核。原因是：{{ this.examine_reason }}
+      </div>
       <div class="btn" v-show="this.examine_status == 2">
         <el-button @click="Lasting()">上一步</el-button>
       </div>
@@ -25,92 +29,90 @@
 </template>
 
 <script>
-  /* eslint-disable */
+/* eslint-disable */
 
-  import {signBack, signUpInit} from "r/index/signUp";
+import { signBack, signUpInit } from "r/index/signUp";
 
-  export default {
-    name: "Pass",
-    data() {
-      return {
-        examine_status: window.localStorage.getItem(
-          "examine_status" + this.$store.state.indexIdentity
-        ),
-        examine_reason: window.localStorage.getItem(
-          "examine_reason" + this.$store.state.indexIdentity
-        ),
-        signBackStatus: "",
-       
-      };
-    },
-    created() {
-    },
+export default {
+  name: "Pass",
+  data() {
+    return {
+      examine_status: window.localStorage.getItem(
+        "examine_status" + this.$store.state.indexIdentity
+      ),
+      examine_reason: window.localStorage.getItem(
+        "examine_reason" + this.$store.state.indexIdentity
+      ),
+      signBackStatus: "",
+    };
+  },
+  created() {},
 
-    watch: {},
-    methods: {
-      Lasting() {
-        signBack({}).then((res) => {
-          if (res.data.code != 200) {
-            return this.$message.error(res.data.msg);
-          }
-          this.signBackStatus = res.data.status;
-          this.$emit("getstatus", res.data.status);
-          this.$message.success(res.data.msg);
-        });
-      },
-      paying() {
-        this.$emit("is_next", 1);
-      },
-     
+  watch: {},
+  methods: {
+    Lasting() {
+      signBack({}).then((res) => {
+        if (res.data.code != 200) {
+          return this.$message.error(res.data.msg);
+        }
+        this.signBackStatus = res.data.status;
+        this.$emit("getstatus", res.data.status);
+        this.$message.success(res.data.msg);
+      });
+    },
+    paying() {
+      this.$emit("is_next", 1);
     },
-  };
+  },
+};
 </script>
 
 <style lang="scss" scoped>
-  @import "a/scss/btn";
-  @import "a/scss/index";
-  @import "a/style";
+@import "a/scss/btn";
+@import "a/scss/index";
+@import "a/style";
 
-  @font-face {
-    font-family: "icomoon";
-    src: url("../../../assets/fonts/icomoon.eot?dcunb6");
-    src: url("../../../assets/fonts/icomoon.eot?dcunb6#iefix") format("embedded-opentype"),
+@font-face {
+  font-family: "icomoon";
+  src: url("../../../assets/fonts/icomoon.eot?dcunb6");
+  src: url("../../../assets/fonts/icomoon.eot?dcunb6#iefix")
+      format("embedded-opentype"),
     url("../../../assets/fonts/icomoon.ttf?dcunb6") format("truetype"),
     url("../../../assets/fonts/icomoon.woff?dcunb6") format("woff"),
     url("../../../assets/fonts/icomoon.svg?dcunb6#icomoon") format("svg");
-    font-weight: normal;
-    font-style: normal;
-    font-display: block;
-  }
+  font-weight: normal;
+  font-style: normal;
+  font-display: block;
+}
 
-  .btn {
-    padding-bottom: 0 !important;
-  }
+.btn {
+  padding-bottom: 0 !important;
+}
 
-  .pass {
-    padding: 0 56px 65px 56px;
+.pass {
+  padding: 0 56px 65px 56px;
 
-    .p_content {
-      i {
-        font-size: 100px;
-        color: var(--color);
-      }
+  .p_content {
+    i {
+      font-size: 100px;
+      color: var(--color);
+    }
 
-      div {
-        text-align: center;
-        font-size: 16px;
-        font-weight: 500;
-        color: #666666;
-        line-height: 18px;
-      }
+    div {
+      text-align: center;
+      font-size: 16px;
+      font-weight: 500;
+      color: #666666;
+      line-height: 18px;
+    }
 
-      :nth-child(2) {
-        margin: 24px 0;
-      }
+    :nth-child(2) {
+      margin: 24px 0;
+    }
 
-      :nth-child(3) {
-        margin: 0 0 50px 0;
-      }
+    :nth-child(3) {
+      margin: 0 0 50px 0;
     }
   }
+}
 </style>

src/components/index/SignUp/referInfo.vue

@@ -1336,23 +1336,7 @@
     <!--    多形式报名邀请码报错弹框   -->
     <cueDialog :dialogVisible="cueDialogVisible" :msg="msg"></cueDialog>
 
-    <!-- 报名流程提示 -->
-    <div class="vertical-steps" v-if="isShowStepsTips">
-      <div class="vertical-steps-title">报名流程</div>
-      <div v-for="(item, index) in steps" :key="item">
-        <div class="step">
-          <div class="step-number">{{ index + 1 }}</div>
-          <div class="step-content">
-            <div class="triangle-left"></div>
-            <div class="step-title">{{ item }}</div>
-          </div>
-          <div class="connector" v-if="index != 5"></div>
-        </div>
-      </div>
-    </div>
-    <div class="referInfoTips" @click="toShowSteps">
-      <i class="el-icon-question"></i>
-    </div>
+   
   </div>
 </template>
 
@@ -1843,16 +1827,6 @@ export default {
       resultPicture: "",
       disabled: false, //限制输入框
       isOffline: false, //活动形式是否包含线下字段
-      //  报名流程提示
-      steps: [
-        "登录报名系统",
-        "提交报名信息，等待审核",
-        "收到审核短信，登录系统缴费",
-        "上传缴费截图，等待审核",
-        "收到审核短信，登录系统",
-        "下载入营通知书，完成报名",
-      ],
-      isShowStepsTips: false,
       // 下载附件
       annexList: [],
     };
@@ -2033,9 +2007,7 @@ export default {
         });
       });
     },
-    toShowSteps() {
-      this.isShowStepsTips = !this.isShowStepsTips;
-    },
+   
     // 判断证件类型-证件号是否需要校验
     // IDtypeRule(val) {
     //   if (val == "大陆居民身份证") {