整合登录

src/components/upload-file.vue

@@ -14,7 +14,7 @@
       :on-remove="remove"
     >
       <el-button slot="trigger" size="small" type="primary">选取文件</el-button>
-      <div slot="tip" class="el-upload__tip">{{ desc === undefined ? '只能上传不超过1MB的文件' : desc }}</div>
+      <div slot="tip" class="el-upload__tip">{{ desc === undefined ? '只能上传不超过2MB的文件' : desc }}</div>
     </el-upload>
     <el-dialog title="查看" :visible.sync="dialog" center>
       <el-row>

src/layout/main-layout.vue

@@ -1,23 +1,28 @@
 <template>
-  <div id="main-layout" @click="checkBind()">
-    <el-container style="background:#e7e8eb;">
-      <el-header height="4rem" class="head">
-        <heads></heads>
-      </el-header>
-      <el-container class="contain">
-        <el-aside width="13rem" class="side">
-          <menus></menus>
-        </el-aside>
-        <el-main class="main">
-          <router-view />
-        </el-main>
+  <div id="main-layout">
+    <div @click="checkBind()" v-if="!toLogin()">
+      <el-container style="background:#e7e8eb;">
+        <el-header height="4rem" class="head">
+          <heads></heads>
+        </el-header>
+        <el-container class="contain">
+          <el-aside width="13rem" class="side">
+            <menus></menus>
+          </el-aside>
+          <el-main class="main">
+            <router-view />
+          </el-main>
+        </el-container>
       </el-container>
-    </el-container>
-    <bind :display="dialog" v-if="!$isBindWx()">
-      <el-col :span="24" style="text-align:center;font-size:1.25rem;padding-top:1rem;">
-        绑定微信,开始您的招聘!
-      </el-col>
-    </bind>
+      <bind :display="dialog" v-if="!$isBindWx()">
+        <el-col :span="24" style="text-align:center;font-size:1.25rem;padding-top:1rem;">
+          绑定微信,开始您的招聘!
+        </el-col>
+      </bind>
+    </div>
+    <div v-else>
+      <router-view />
+    </div>
   </div>
 </template>
 
@@ -42,6 +47,10 @@ export default {
     checkBind() {
       if (!this.$isBindWx()) this.dialog = true;
     },
+    toLogin() {
+      let route = window.location.pathname;
+      return route.includes('login') || route.includes('register');
+    },
   },
 };
 </script>

src/router.js

@@ -10,7 +10,7 @@ export default new Router({
     {
       path: '/',
       name: 'index',
-      component: () => import('./views/index.vue'),
+      component: () => import('./views/home/index.vue'),
     },
     //重整理结构目录后的路由部分
     {
@@ -43,5 +43,9 @@ export default new Router({
       name: 'practiceIndex',
       component: () => import('./views/want/practice/index.vue'),
     },
+    {
+      path: '/login',
+      component: () => import('./views/login/login.vue'),
+    },
   ],
 });

src/store.js

@@ -23,7 +23,7 @@ const api = {
   connection: '/weixin/qrcode/create',
   wxtoken: '/weixin/qrcode/{qrcode}/token',
   studBind: '/api/stud/bind', //post=>query;corpid;body:mobile,wxtoken
-  studLogin: '/api/stud/login',
+  studLogin: '/api/stud/login', //query:type:0=>用户名+密码 account(学号@学校id)+passwd;1-微信(wxtoken)
   dictionary: '/api/code/{type}/items', //type === xzqh:query:level(1/2);parent(无/code)
   findOne: '/api/code/xzqh/findOne', //query:name
 };
@@ -202,6 +202,11 @@ export default new Vuex.Store({
       }
       return result;
     },
+    //原登录
+    async studLogin({ state }, { type, data }) {
+      let result = this.$axios.$post(api.studLogin, data, {}, { type: type });
+      return result;
+    },
   },
 });
 

src/views/login/login.vue

@@ -0,0 +1,196 @@
+<template>
+  <div id="stulogin">
+    <div :style="'overflow:hidden; background: url(' + img.bg + ');background-size:cover;height:100vh;'" class="bg">
+      <div class="covers">
+        <el-row :span="24">
+          <el-col :span="24" class="top">
+            <div class="w_1200">
+              <el-col :span="22"><img style="width: 290px; height: 66px" :src="url"/></el-col>
+              <el-col :span="2">
+                <el-col :span="6"><img style="width: 25px; height: 25px" :src="pic"/></el-col>
+                <el-col :span="18"><el-link type="primary">咨询帮助</el-link></el-col>
+              </el-col>
+            </div>
+          </el-col>
+          <div class="w_1200">
+            <el-col :span="24">
+              <el-col :span="14" class="mainLeft">
+                <el-row><span class="one">海阔凭鱼跃 · 天高任鸟飞</span></el-row>
+                <el-row class="two">
+                  覆盖：20个省200+高校&nbsp;&nbsp;&nbsp;&nbsp;190万+毕业生&nbsp;&nbsp;&nbsp;&nbsp;20万+单位入驻
+                </el-row>
+                <el-row class="three">帮助天下毕业生走稳求职第一步 </el-row>
+              </el-col>
+              <el-col :span="8" class="mainRight" v-if="loginType === 0">
+                <el-row>
+                  <el-col :span="22" style="margin: 0 0 18px;">
+                    <span class="tit_right">学生登录<span style="color: #ff4500;">(建议您使用谷歌浏览器)</span></span>
+                  </el-col>
+                  <el-col :span="2" class="el-icon-full-screen" style="zoom:1.5" @click.native="loginType = 1"> </el-col>
+                  <el-col :span="24">
+                    <el-form :model="form" :rules="rules" ref="form">
+                      <el-form-item prop="account">
+                        <el-col>
+                          <el-input placeholder="学号" prefix-icon="el-icon-user-solid" v-model="form.account"></el-input>
+                        </el-col>
+                      </el-form-item>
+                      <el-form-item prop="passwd">
+                        <el-col>
+                          <el-input
+                            placeholder="密码(首次登陆密码为身份证密码后六位)"
+                            prefix-icon="el-icon-lock"
+                            v-model="form.passwd"
+                            show-password
+                            @keyup.enter.native="toSubmit"
+                          >
+                          </el-input>
+                        </el-col>
+                      </el-form-item>
+                    </el-form>
+                  </el-col>
+                  <el-col class="inp_sty">
+                    <!-- <el-col :span="19" style="padding: 8px 0;"><el-checkbox v-model="checked">记住登陆账号</el-checkbox></el-col> -->
+                    <el-col :span="5"><el-button type="success" class="login" @click="toSubmit">登录</el-button></el-col>
+                  </el-col>
+                  <el-col><el-link type="primary" class="login_tips" :underline="false">忘记登陆密码?</el-link></el-col>
+                </el-row>
+              </el-col>
+              <el-col :span="8" class="mainRight" v-else>
+                <el-col :span="22" style="margin: 0 0 18px;">
+                  <span class="tit_right">学生登录<span style="color: #ff4500;">(建议您使用谷歌浏览器)</span></span>
+                </el-col>
+                <el-col :span="2" class="el-icon-s-platform" style="zoom:1.5" @click.native="loginType = 0"> </el-col>
+                <el-col :span="24" style="text-align:center;">
+                  <span>微信扫码登录</span>
+                  <qrcode :qrcode="qrcode" @toReturn="toReturn"></qrcode>
+                </el-col>
+              </el-col>
+            </el-col>
+          </div>
+        </el-row>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import qrcode from '@/components/qrcode.vue';
+import { mapActions, mapState } from 'vuex';
+const jwt = require('jsonwebtoken');
+export default {
+  name: 'stulogin',
+  props: {},
+  components: {
+    qrcode,
+  },
+  data: () => ({
+    img: {
+      bg: require('@/assets/stulogin.jpg'),
+    },
+    url: require('@/assets/logo.jpg'),
+    pic: require('@/assets/qq.jpg'),
+    checked: '',
+    form: {},
+    qrcode: '',
+    loginType: 0,
+    rules: {
+      account: [{ required: true, message: '请输入学号', trigger: 'blur' }],
+      passwd: [{ required: true, message: '请输入密码', trigger: 'blur' }],
+    },
+  }),
+  created() {
+    this.initQrcode();
+  },
+  computed: {},
+  methods: {
+    ...mapActions(['studLogin', 'createConnection', 'getWxtoken']),
+    toSubmit() {
+      this.$refs.form.validate(valid => {
+        if (valid) {
+          this.submit();
+        }
+        return false;
+      });
+    },
+    async submit(wxtoken) {
+      let data = JSON.parse(JSON.stringify(this.form));
+      if (this.loginType === 0) {
+        data.account = `${data.account}@999991`;
+      } else {
+        data = { wxtoken: wxtoken };
+      }
+      let result = await this.studLogin({ type: this.loginType, data: data });
+      this.$message({
+        type: `${result.errcode}` === '0' ? 'success' : 'error',
+        message: `${result.errcode}` === '0' ? '登录成功' : 'result.errmsg',
+      });
+      if (`${result.errcode}` === '0') {
+        sessionStorage.setItem('token', JSON.stringify(result.data));
+        let info = jwt.decode(result.data);
+        sessionStorage.setItem('user', JSON.stringify(result.data));
+        this.$router.push({ path: '/' });
+      }
+    },
+    async initQrcode() {
+      let result = await this.createConnection();
+      this.$set(this, `qrcode`, result);
+    },
+    async toReturn(msg) {
+      let result = await this.getWxtoken(this.qrcode);
+      this.submit(result);
+    },
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.w_1200 {
+  margin: 0 auto;
+  width: 1200px;
+}
+.top {
+  height: 70px;
+  background: #fff;
+  opacity: 0.9;
+  border-top: 4px solid #44b569;
+}
+.mainLeft {
+  padding: 15% 0;
+}
+.mainRight {
+  height: 310px;
+  background: #fff;
+  border-radius: 10px;
+  padding: 32px 40px;
+  margin: 10% 0;
+  float: right;
+}
+.covers {
+  background: rgba(92, 91, 91, 0.1);
+}
+.one {
+  font-size: 30px;
+  color: #ffffff;
+}
+.two {
+  color: rgba(255, 255, 255, 0.6);
+  margin: 20px 0px;
+}
+.three {
+  color: rgba(255, 255, 255, 0.6);
+}
+/deep/.el-input__inner {
+  height: 55px;
+}
+.inp_sty {
+  padding: 5px 0;
+}
+.tit_right {
+  font-size: 18px !important;
+  margin-bottom: 18px;
+}
+.login_tips {
+  font-size: 13px;
+  color: #808080;
+}
+</style>