login

src/course/user/login.vue

@@ -1,112 +1,163 @@
 <template>
   <div class="login-container">
     <div class="flex-box">
-      <div class="login-left flex-1" style="background-image: url(static/images/login-left.png);">
+      <div
+        class="login-left flex-1"
+        style="background-image: url(static/images/login-left.png)"
+      >
         <div class="left-content">
-          <div class="logo" style="text-align: center;margin-bottom: 2%;"><img src="static/images/logo.png" /></div>
+          <div class="logo" style="text-align: center; margin-bottom: 2%">
+            <img src="static/images/logo.png" />
+          </div>
           <el-carousel indicator-position="outside" :interval="5000">
-            <el-carousel-item style="text-align: center;font-size: 26px;color: #fff;">
-              <div style="margin-bottom: 2.2%;letter-spacing: 3px;">
+            <el-carousel-item
+              style="text-align: center; font-size: 26px; color: #fff"
+            >
+              <div style="margin-bottom: 2.2%; letter-spacing: 3px">
                 管理执行难，就用功道云
                 <br />
                 功到自然成
               </div>
-              <div class="flex-box-v flex-center-center" style="width: 76%;margin: 0 auto;"><img src="static/images/login1.png" style="width: 100%;" /></div>
+              <div
+                class="flex-box-v flex-center-center"
+                style="width: 76%; margin: 0 auto"
+              >
+                <img src="static/images/login1.png" style="width: 100%" />
+              </div>
             </el-carousel-item>
-            <el-carousel-item style="text-align: center;font-size: 26px;color: #fff;">
-              <div style="margin-bottom: 6.5%;letter-spacing: 3px;">
+            <el-carousel-item
+              style="text-align: center; font-size: 26px; color: #fff"
+            >
+              <div style="margin-bottom: 6.5%; letter-spacing: 3px">
                 积分赋能
                 <br />
                 成就员工价值
               </div>
-              <div class="flex-box-v flex-center-center" style="width: 76%;margin: 0 auto;"><img src="static/images/login2.png" style="width: 100%;" /></div>
+              <div
+                class="flex-box-v flex-center-center"
+                style="width: 76%; margin: 0 auto"
+              >
+                <img src="static/images/login2.png" style="width: 100%" />
+              </div>
             </el-carousel-item>
           </el-carousel>
-          <div style="text-align: center;color: #fff;margin-top: 3%;letter-spacing: 2px;">
-            <div style="font-size: 18px;">100000+用户都选择功道云</div>
-            <img src="static/images/loginBot.png" style="width: 80%;margin: 2% 0;" />
-            <div style="font-size: 14px;">如需帮助，请拨打咨询热线：400-6877-880</div>
+          <div
+            style="
+              text-align: center;
+              color: #fff;
+              margin-top: 3%;
+              letter-spacing: 2px;
+            "
+          >
+            <div style="font-size: 18px">100000+用户都选择功道云</div>
+            <img
+              src="static/images/loginBot.png"
+              style="width: 80%; margin: 2% 0"
+            />
+            <div style="font-size: 14px">
+              如需帮助，请拨打咨询热线：400-6877-880
+            </div>
           </div>
         </div>
       </div>
-      <div class="login-right flex-2" style="position: relative;">
+      <div class="login-right flex-2" style="position: relative">
         <div class="login_input">
           <div class="third-login-box">
             <p class="third-account" @click="getToken">平台ID登录</p>
-            <el-input v-model="testId" placeholder="请输入平台ID，回车登录" size="normal" style="width: 250px;margin:0 0 20px;" clearable @keyup.enter.native="getToken(testId)"></el-input>
+            <el-input
+              v-model="testId"
+              placeholder="请输入平台ID，回车登录"
+              size="normal"
+              style="width: 250px; margin: 0 0 20px"
+              clearable
+              @keyup.enter.native="getToken(testId)"
+            ></el-input>
             <p class="third-account">微信扫码登录</p>
-             <div class="account-login">
-                 <a data-href="/thirdlogin/wechat.do?appId=1006" class="wechat-login" @click="openWx" style="background-image: url(static/images/wechat1.png);"></a>
-             </div>
+            <div class="account-login">
+              <a
+                data-href="/thirdlogin/wechat.do?appId=1006"
+                class="wechat-login"
+                @click="openWx"
+                style="background-image: url(static/images/wechat1.png)"
+              ></a>
+            </div>
           </div>
         </div>
       </div>
     </div>
-    <el-dialog title="微信登录" :visible.sync="isShowWxLogin" append-to-body width="500px">
+    <el-dialog
+      title="微信登录"
+      :visible.sync="isShowWxLogin"
+      append-to-body
+      width="500px"
+    >
       <div>
         <iframe :src="wxUrl" width="100%" height="400" frameborder="0"></iframe>
       </div>
     </el-dialog>
-
   </div>
 </template>
 
 <script>
-import { setCourseToken, setCourseId,_debounce } from '@/utils/auth';
-import {getUserToken,getAdminTokenId} from '../api'
+import { setCourseToken, setCourseId, _debounce } from "@/utils/auth";
+import { getUserToken, getAdminTokenId } from "../api";
 export default {
   data() {
     return {
-      testId:"11770",
-      isShowWxLogin:false,
+      testId: "11770",
+      isShowWxLogin: false,
       // wxUrl:process.env.BASE_API+'/wechat/auth/web?ct=1',
-      wxUrl:'https://oa.g107.com/wechat/auth/web?ct=1',
+      wxUrl: "https://oa.g107.com/wechat/auth/web?ct=1",
     };
   },
   methods: {
+    init() {
+      this.clearData(); //进入登录界面，清除本地缓存，主要是避免用户意外清除cookies后造成本地缓存依然存在，重新登陆后显示上次的缓存,或特殊情况本地缓存未清空又登录别的账号。
+      document.title = "功道云-课程营销用户登录";
+    },
     //临时指定id获取用户token(11770)
-    getToken(id){
-      getUserToken(id).then(token=>{
-        this.getAccountIdToken(token)
-      }).catch(err=>{
-        console.log(err)
-      })
+    getToken(id) {
+      getUserToken(id)
+        .then((token) => {
+          this.getAccountIdToken(token);
+        })
+        .catch((err) => {
+          console.log(err);
+        });
     },
     //根据用户token获取用户adminUserId和auToken
-    getAccountIdToken(token){
-      getAdminTokenId(token).then(res=>{
-        setCourseToken(res.auToken)
-          setCourseId(res.adminUserId)
-          localStorage.setItem('Course-Token',res.auToken)
-          localStorage.setItem('Course-Id',res.adminUserId)
+    getAccountIdToken(token) {
+      getAdminTokenId(token)
+        .then((res) => {
+          setCourseToken(res.auToken);
+          setCourseId(res.adminUserId);
+          localStorage.setItem("Course-Token", res.auToken);
+          localStorage.setItem("Course-Id", res.adminUserId);
           this.$message({
-            message: '登陆成功！',
-            type: 'success',
+            message: "登陆成功！",
+            type: "success",
             showClose: true,
             duration: 2000,
           });
-          this.$router.push('/course')
-      }).catch(err=>{
-        console.log(err)
-      })
+          this.$router.push("/course");
+        })
+        .catch((err) => {
+          console.log(err);
+        });
     },
     // 微信扫码
-    openWx(){
-      this.isShowWxLogin=true;
+    openWx() {
+      this.isShowWxLogin = true;
     },
     // 清缓存
     clearData() {
       localStorage.clear();
       sessionStorage.clear();
-    }
+    },
   },
   created() {
-    this.clearData(); //进入登录界面，清除本地缓存，主要是避免用户意外清除cookies后造成本地缓存依然存在，重新登陆后显示上次的缓存,或特殊情况本地缓存未清空又登录别的账号。
-    document.title = '功道云-课程营销用户登录';
+    this.init();
   },
-  destroyed() {
-    // this.$setCache('login_code', '0');
-  }
 };
 </script>
 
@@ -118,27 +169,27 @@ export default {
   right: 0;
 }
 .third-account {
-    text-align: center;
-    margin-bottom: 15px;
-    color: #999999;
+  text-align: center;
+  margin-bottom: 15px;
+  color: #999999;
 }
 .account-login {
-    text-align: center;
+  text-align: center;
 }
-.wechat-login{
-    width: 100px;
-    height: 100px;
-    background-color: #dddddd;
-    background-repeat: no-repeat;
-    background-position: center;
-    border-radius: 50%;
-    cursor: pointer;
+.wechat-login {
+  width: 100px;
+  height: 100px;
+  background-color: #dddddd;
+  background-repeat: no-repeat;
+  background-position: center;
+  border-radius: 50%;
+  cursor: pointer;
 }
-.wechat-login:hover{
-    background-color: #67c23a;
+.wechat-login:hover {
+  background-color: #67c23a;
 }
 .account-login a {
-    display: inline-block;
+  display: inline-block;
 }
 .login-left {
   min-width: 500px;
@@ -149,8 +200,8 @@ export default {
   background-size: 100% 100%;
   position: relative;
   filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/static/images/login-left.png', sizingMethod='scale');
-  -ms-behavior: url('/static/images/login-left.png');
-  behavior: url('/static/images/login-left.png');
+  -ms-behavior: url("/static/images/login-left.png");
+  behavior: url("/static/images/login-left.png");
 }
 .login_input {
   position: relative;
@@ -166,7 +217,6 @@ export default {
   height: 100%;
 }
 
-
 @media screen and (min-width: 1601px) {
   .left-content {
     height: 800px;

src/router/index.js

@@ -428,6 +428,14 @@ const constantRouterMap = [
     component: () => import('@/course/user/login'),
     label: '课程营销登录',
     meta: {},
+    beforeEnter: (to, from, next) => {
+      //  判断是否需要鉴定一下权限
+      if (localStorage.getItem('Course-Token')&&localStorage.getItem('Course-Id')) {
+        next('/course')
+      } else {
+        next()
+      }
+    }
   },
   {
     path: '/login',