补充提交

src/components/common/header.vue

@@ -21,8 +21,15 @@
         </ul>
       </div>
       <div class="centerNav">
-        <el-button type="success">提交</el-button>
+        <el-button
-        <el-button type="danger">重新开始</el-button>
+          type="success"
+          v-if="reqType != 2 && !isSubmit"
+          @click="submitExam"
+          >提交</el-button
+        >
+        <el-button type="danger" v-if="reqType == 1" @click="reStartTest"
+          >重新开始</el-button
+        >
       </div>
       <!-- 右侧 nav -->
       <div class="rightNav" :style="{width: rightNavWidth}">
@@ -170,6 +177,7 @@
       class="counting"
       @click="showCounting = !showCounting"
       :style="{width: showCounting ? '150px' : '30px'}"
+      v-if="reqType == 0"
     >
       <p>
         考试进行中
@@ -177,7 +185,11 @@
         <i class="el-icon-d-arrow-left" v-else></i>
       </p>
       <br />
-      <p v-if="showCounting">00:12:25</p>
+      <p v-if="showCounting">
+        <span>{{ hour }}</span
+        >&nbsp;:&nbsp;<span>{{ mins }}</span
+        >&nbsp;:&nbsp;<span>{{ sec }}</span>
+      </p>
     </div>
   </div>
 </template>
@@ -187,6 +199,8 @@ import {getCurrentLanguage} from '@/common/i18n';
 import {getExchangeRateCookie, setExchangeRateCookie} from '@/utils/auth';
 import {logOut} from '@/api/user';
 import {FILE_URL} from '@/api/app';
+import {submit, reStart} from '@/api/yyyf';
+import {signUp, signIn} from '@/api/user';
 
 const Menu = {
   icon: [{t: 'nav.menu_name', link: '/'}],
@@ -256,6 +270,16 @@ export default {
       perUrl: 'personal',
       file: '',
       showCounting: true,
+      //0 考试 1 练习 2 不计分
+      reqType: 2,
+      //剩余时间
+      remainingTime: 0,
+      //防止重复提交
+      isSubmit: false,
+      hour: 0,
+      mins: 0,
+      sec: 0,
+      setIntervalInt: 0,
     };
   },
 
@@ -271,6 +295,7 @@ export default {
 
   created() {
     let yyyfToken = localStorage.getItem('yyyfToken');
+    this.isSubmit = localStorage.getItem('isSubmit') == 'true' ? true : false;
     if (yyyfToken == '' || yyyfToken == undefined) {
       this.$alert('未从以渔有方登录，点击确定关闭浏览器', '提示', {
         type: 'error',
@@ -281,43 +306,196 @@ export default {
           this.closeWindow();
         },
       });
-    }
+    } else {
-    this.file = FILE_URL;
+      //请求类型
-    this.perUrl = window.location.pathname.split('/')[1];
+      this.reqType = localStorage.getItem('reqType');
-    // console.log(this.perUrl);
+      //如果考试
-
+      if (this.reqType == 0) {
-    // this.userData = Cookie.get('userData');
+        //获取考试剩余时间
-    this.userData = localStorage.getItem('userData');
+        this.remainingTime = localStorage.getItem('remainingTime');
-
+        //启动倒计时
-    if (this.userData != '' && this.userData != undefined) {
+        this.setIntervalInt = setInterval(this.showTime, 1000);
-      this.userData = JSON.parse(localStorage.getItem('userData'));
-      // console.log(this.userData);
-      if (this.userData.avatar != null) {
-        this.headerImg = this.file + this.userData.avatar;
-      } else {
-        this.headerImg = this.userData.avatar;
       }
-    }
+      this.file = FILE_URL;
-    // console.log(this.headerImg);
+      this.perUrl = window.location.pathname.split('/')[1];
+      // console.log(this.perUrl);
+
+      // this.userData = Cookie.get('userData');
+      this.userData = localStorage.getItem('userData');
 
-    const currentLang = getCurrentLanguage();
+      if (this.userData != '' && this.userData != undefined) {
-    for (let item of this.lang.list) {
+        this.userData = JSON.parse(localStorage.getItem('userData'));
-      if (item.lang === currentLang) {
+        // console.log(this.userData);
-        this.lang.current = item;
+        if (this.userData.avatar != null) {
-        break;
+          this.headerImg = this.file + this.userData.avatar;
+        } else {
+          this.headerImg = this.userData.avatar;
+        }
       }
-    }
+      // console.log(this.headerImg);
-    const currentrate = getExchangeRateCookie();
+
-    for (let item of this.exRate.list) {
+      const currentLang = getCurrentLanguage();
-      if (item.id === currentrate) {
+      for (let item of this.lang.list) {
-        this.exRate.current = item;
+        if (item.lang === currentLang) {
-        // setExchangeRateCookie(currentrate);
+          this.lang.current = item;
-        break;
+          break;
+        }
+      }
+      const currentrate = getExchangeRateCookie();
+      for (let item of this.exRate.list) {
+        if (item.id === currentrate) {
+          this.exRate.current = item;
+          // setExchangeRateCookie(currentrate);
+          break;
+        }
       }
     }
   },
 
   methods: {
+    showTime: function() {
+      let remainingTime = this.remainingTime;
+      remainingTime -= 1;
+      localStorage.setItem('remainingTime', remainingTime);
+      this.remainingTime = remainingTime;
+      let h = 0;
+      let m = 0;
+      let s = 0;
+      if (remainingTime > 0) {
+        h = Math.floor(remainingTime / 60 / 60);
+        m = Math.floor((remainingTime / 60) % 60);
+        s = Math.floor(remainingTime % 60);
+      }
+      if (h < 10) {
+        this.hour = this.format(h, 2);
+      } else {
+        this.hour = h;
+      }
+      this.mins = this.format(m, 2);
+      this.sec = this.format(s, 2);
+      if (h <= 0 && m <= 0 && s <= 0) {
+        if (!this.isSubmit)
+          this.$message.warning('考试时间到,系统将自动提交试卷');
+        this.submitExam();
+      }
+    },
+    format: function(num, n) {
+      return (Array(n).join(0) + num).slice(-n);
+    },
+    submitExam: function() {
+      let self = this;
+      //防止重复提交
+      if (!self.isSubmit) {
+        self.isSubmit = true;
+      } else {
+        return false;
+      }
+
+      submit().then(res => {
+        if (res.data.code === 200) {
+          this.$message.success({
+            message: '提交成功',
+            onClose: function() {
+              if (self.reqType == 0) {
+                self.closeWindow();
+              } else {
+                localStorage.setItem('isSubmit', JSON.stringify(true));
+                self.isSubmit = false;
+              }
+            },
+          });
+        } else {
+          this.$message.warning({
+            message: res.data.msg,
+            onClose: function() {
+              self.closeWindow();
+            },
+          });
+        }
+      });
+    },
+    reStartTest: function() {
+      let self = this;
+      //防止重复提交
+      if (!self.isSubmit) {
+        this.isSubmit = true;
+      } else {
+        return false;
+      }
+      //退出当前用户
+      this.exit(1);
+      reStart().then(res => {
+        if (res.data.code === 200) {
+          this.$message.success({
+            message: '重新开始成功',
+            onClose: function() {
+              let signParams = {
+                tel: res.data.data.tel,
+                nickName: res.data.data.nickName,
+                code: res.data.data.code,
+                password: res.data.data.password,
+                internationalCode: null,
+                invitationCode: '',
+              };
+              self.sign(signParams);
+            },
+          });
+        } else {
+          this.$message.warning({
+            message: res.data.msg,
+            onClose: function() {
+              self.closeWindow();
+            },
+          });
+        }
+      });
+    },
+    sign(params) {
+      signUp(params).then(res => {
+        if (res.data.code === 200) {
+          this.login({
+            tel: params.tel,
+            password: params.password,
+          });
+        } else {
+          this.$message.warning(res.data.msg);
+          this.isSubmit = false;
+        }
+      });
+    },
+    login(params) {
+      signIn(params).then(res => {
+        // console.log(res);
+        if (res.data.code === 200) {
+          //判断是否保存自动登录
+          // if( this.checked === true ){
+          //   Cookie.set('phoneNum',num)
+          //   Cookie.set('password',pass)
+          // }
+          //保存登录的token到cookie
+          // Cookie.set('token', res.data.data.token);
+          localStorage.setItem('token', res.data.data.token);
+          //重复提交标识
+          localStorage.setItem('isSubmit', JSON.stringify(false));
+          //保存登录的用户信息到cookie
+          // Cookie.set('userData', res.data.data);
+          localStorage.setItem('userData', JSON.stringify(res.data.data));
+          // console.log(JSON.parse(localStorage.getItem('userData')));
+
+          // 保存userID的信息到cookie
+          // Cookie.set('userID', res.data.data.id);
+          localStorage.setItem('userID', res.data.data.id);
+
+          // 保存邀请码信息
+          localStorage.setItem('invitationCode', res.data.data.invitationCode);
+          this.isSubmit = false;
+          location.href = '/entry';
+        } else {
+          this.$message.warning(res.data.msg);
+          this.isSubmit = false;
+        }
+      });
+    },
     closeWindow: function() {
       if (
         navigator.userAgent.indexOf('Firefox') != -1 ||
@@ -366,7 +544,7 @@ export default {
         location.href = '/personal?perUrl=' + this.perUrl + '#/' + command;
       }
     },
-    exit() {
+    exit(params) {
       logOut().then(res => {
         if (res.data.code === 200 || res.data.code === 202) {
           // Cookie.set('userData', '');
@@ -374,7 +552,10 @@ export default {
           localStorage.removeItem('userpass');
           localStorage.removeItem('userdate');
           localStorage.removeItem('nowPassNOValue');
-          window.location.href = '/';
+          if (params == undefined) {
+            //window.location.href = '/';
+            this.closeWindow();
+          }
 
           // let pathName = window.location.pathname.split('/')[1];
           // console.log(pathName);
@@ -416,6 +597,7 @@ export default {
     align-items: center;
     // margin-left: 12.6%;
     margin-right: 7.9%;
+
     img {
       width: 45px;
       height: 45px;
@@ -439,15 +621,20 @@ export default {
     flex: 1;
     display: flex;
     margin-left: 2%;
+
     .nav-menu {
       width: 60%;
     }
+
     .menu-item {
       margin-right: 3%;
     }
   }
+
   .centerNav {
-    flex: 1;
+    //flex: 1;
+    width: 230px;
+
     .el-button {
       color: #ffffff;
     }
@@ -486,10 +673,12 @@ export default {
       > a {
         // color: $local-menu-text-color;
         color: #545663;
+
         &.is-active {
           color: white;
         }
       }
+
       span {
         color: #545663;
       }
@@ -505,6 +694,7 @@ export default {
       // padding: 0 10px;
     }
   }
+
   .nav-menuRight {
     display: flex;
     flex-wrap: wrap;
@@ -515,6 +705,7 @@ export default {
       align-items: center;
       font-size: 14px;
       color: $local-menu-text-color;
+
       &.no-padding {
         padding: 0;
       }
@@ -522,10 +713,12 @@ export default {
       > a {
         // color: $local-menu-text-color;
         color: #545663;
+
         &.is-active {
           color: white;
         }
       }
+
       span {
         color: #545663;
       }
@@ -545,6 +738,7 @@ export default {
   .navColor {
     color: #e8494a !important;
     position: relative;
+
     &::after {
       content: '';
       width: 100%;
@@ -560,6 +754,7 @@ export default {
     /* logo area */
     .nav-logo-area {
       padding: 0;
+
       .logo_text {
         font-size: 26px;
         color: #ffffff;
@@ -599,10 +794,12 @@ export default {
         &:not(.is-disabled):hover {
           background-color: #d3dae2;
         }
+
         .is-active {
           color: #666 !important;
         }
       }
+
       .dropdown-menu-item-inner {
         color: #666;
       }
@@ -615,12 +812,15 @@ export default {
     .langDropdown {
       left: -50% !important;
     }
+
     .userDropdown {
       left: -5% !important;
       width: 110px;
+
       .el-dropdown-menu__item {
         padding: 0;
       }
+
       .dropdown-menu-item-inner {
         text-align: center;
       }
@@ -671,16 +871,20 @@ export default {
     display: flex;
     justify-content: center;
     align-items: center;
+
     span {
       color: #fff !important;
     }
+
     &:hover {
       background-color: #fff;
+
       span {
         color: #e8494a !important;
       }
     }
   }
+
   // .userAvatar {
   //   width: 40px;
   //   height: 40px;
@@ -695,10 +899,7 @@ export default {
   //   }
   // }
 }
-.btn-self-style {
+
-  background: #f56c6c !important;
-  color: #fff !important;
-}
 .main-nav {
   .counting {
     position: fixed;
@@ -716,10 +917,16 @@ export default {
     height: 200px;
     z-index: 999;
     cursor: pointer;
+
     p {
       width: 100%;
       text-align: center;
     }
   }
 }
+
+.btn-self-style {
+  background: #f56c6c !important;
+  color: #fff !important;
+}
 </style>