update 404.vue

src/router/index.js

@@ -19,24 +19,10 @@ import BackgroundFileRouter from './background_file'
 
 // 懒加载引入页面组件，es6语法
 // ********************************************************************************************************************
-const Login = () => import('views/Login')
+const Login = () => import('views/Login1')
 const Register = () => import('views/Register')
 const Forgot = () => import('views/Forgot')
 const Index = () => import('views/Index')
-const ShareVideo = () => import('views/home/ShareVideo')
-
-const Home = () => import('views/home/Home')
-const TimelineIndex = () => import('views/home/Timeline')
-const VideoIndex = () => import('views/home/Video')
-const VideoTag = () => import('views/home/VideoTag')
-const ShortVideoIndex = () => import('views/home/ShortVideo')
-const VideoPage = () => import('views/home/VideoPage')
-const AudioIndex = () => import('views/home/Audio')
-const AudioPage = () => import('views/home/AudioPage')
-const ImagePage = () => import('views/home/ImagePage')
-const PlaylistIndex = () => import('views/home/PlaylistIndex')
-const PlaylistView = () => import('views/home/PlaylistView')
-const Discover = () => import('views/home/Discover')
 
 // ********************************************************************************************************************
 // 使用安装路由插件

src/views/404.vue

@@ -3,8 +3,9 @@
     <el-main>
       <nav-bar />
       <el-row>
-        <div style="height: 720px; text-align: center;">
+        <div style="text-align: center;">
           <h1>Not Found!</h1>
+          <el-button type="text" @click="goIndex">回到首页</el-button>
         </div>
       </el-row>
     </el-main>
@@ -12,12 +13,17 @@
 </template>
 
 <script>
-import NavBar from 'components/layout/NavBar'
+import NavBar from 'components/layout/LoginBar'
 
 export default {
   name: 'NotFound',
   components: {
     NavBar
+  },
+  methods: {
+    goIndex() {
+      this.$router.push('/')
+    }
   }
 }
 </script>

src/views/Login1.vue

@@ -0,0 +1,110 @@
+<template>
+  <el-container>
+    <el-main>
+      <login-bar />
+      <router-view />
+      <el-row class="movie-list">
+        <el-col :md="8" style="padding-right: 5px; padding-left: 5px; padding-bottom: 5px" />
+        <el-col :md="8" style="padding-right: 5px; padding-left: 5px; padding-bottom: 5px">
+          <el-row style="padding-right: 5px; padding-left: 5px; padding-bottom: 5px; text-align: center">
+            <el-card class="box-card">
+              <el-tabs v-model="activeName" @tab-click="tabClick">
+                <el-tab-pane name="login1">
+                  <span slot="label">密码登入</span>
+                  <div class="text item">
+                    <el-form ref="form" :model="userLogin" label-width="80px">
+                      <el-form-item label="帐号">
+                        <el-input
+                          v-model="userLogin.principal"
+                          placeholder="请输入手机号或邮箱"
+                          style="padding-right: 1px"
+                          clearable
+                        />
+                      </el-form-item>
+                      <el-form-item label="密码">
+                        <el-input
+                          v-model="userLogin.credential"
+                          type="password"
+                          placeholder="请输入密码"
+                          style="padding-right: 1px"
+                          clearable
+                        />
+                      </el-form-item>
+                      <el-form-item label="图形验证码" label-width="90px">
+                        <el-image :src="captchaCode" @click="getCaptcha" />
+                        <el-input
+                          v-model="userLogin.captchaCode"
+                          placeholder="请输入图形验证码"
+                          style="width: 50%; padding-right: 1px"
+                          clearable
+                          @keyup.enter.native="loginBtn"
+                        />
+                      </el-form-item>
+                      <el-form-item>
+                        <el-button type="primary" size="mini" :loading="isLoading" @click.native="loginBtn">登 入</el-button>
+                        <el-button type="plain" size="mini" @click="forgot">忘记密码</el-button>
+                      </el-form-item>
+                    </el-form>
+                  </div>
+                </el-tab-pane>
+              </el-tabs>
+            </el-card>
+          </el-row>
+        </el-col>
+        <el-col :md="8" style="padding-right: 5px; padding-left: 5px; padding-bottom: 5px" />
+      </el-row>
+    </el-main>
+  </el-container>
+</template>
+
+<script>
+import { userMixin } from 'assets/js/mixin'
+import LoginBar from 'components/layout/LoginBar'
+
+export default {
+  name: 'Login',
+  components: {
+    LoginBar
+  },
+  mixins: [userMixin],
+  data() {
+    return {
+      activeName: 'login1'
+    }
+  },
+  watch: {
+    $route() {
+      this.$router.go()
+    }
+  },
+  created() {
+    document.title = '用户登入'
+    this.fetchPubkey(1)
+  },
+  methods: {
+    tabClick(tab) {
+      this.activeName = tab.name
+    },
+    forgot() {
+      this.$message.info('联系管理员')
+    }
+  }
+}
+</script>
+
+<style>
+/*处于手机屏幕时*/
+@media screen and (max-width: 768px){
+  .movie-list {
+    padding-top: 8px;
+    padding-left: 0.5%;
+    padding-right: 0.5%;
+  }
+}
+
+.movie-list {
+  padding-top: 15px;
+  padding-left: 6%;
+  padding-right: 6%;
+}
+</style>