Переглянути джерело

feat: 标题配置修改,登录页面样式优化

mnisting 6 місяців тому
батько
коміт
8749969cfd

+ 1 - 1
.env.development

@@ -1,5 +1,5 @@
 # 页面标题
-VUE_APP_TITLE = 争锋科技管理系统
+VUE_APP_TITLE = 争锋科技官网管理系统
 
 # 开发环境配置
 ENV = 'development'

+ 1 - 1
.env.production

@@ -1,5 +1,5 @@
 # 页面标题
-VUE_APP_TITLE = 争锋科技管理系统
+VUE_APP_TITLE = 争锋科技官网管理系统
 
 # 生产环境配置
 ENV = 'production'

+ 1 - 1
.env.staging

@@ -1,5 +1,5 @@
 # 页面标题
-VUE_APP_TITLE = 争锋科技管理系统
+VUE_APP_TITLE = 争锋科技官网管理系统
 
 BABEL_ENV = production
 

+ 1 - 1
package.json

@@ -1,7 +1,7 @@
 {
   "name": "zhengfeng",
   "version": "3.8.8",
-  "description": "争锋科技管理系统",
+  "description": "争锋科技官网管理系统",
   "author": "争锋科技",
   "license": "MIT",
   "scripts": {

BIN
src/assets/images/login-background.png


+ 0 - 0
src/assets/images/login-background.jpg → src/assets/images/login-background1.jpg


+ 3 - 3
src/router/index.js

@@ -98,7 +98,7 @@ export const constantRoutes = [
         alwaysShow: true,
         component: () => import("@/views/recruitInfoManage/index"),
         name: "RecruitInfoManage",
-        meta: { title: "招聘信息管理", icon: "dashboard", affix: true },
+        meta: { title: "招聘信息管理", icon: "dashboard" },
       },
     ],
   },
@@ -112,7 +112,7 @@ export const constantRoutes = [
         alwaysShow: true,
         component: () => import("@/views/newsManage/index"),
         name: "NewsManage",
-        meta: { title: "新闻资讯管理", icon: "dashboard", affix: true },
+        meta: { title: "新闻资讯管理", icon: "dashboard" },
       },
     ],
   },
@@ -126,7 +126,7 @@ export const constantRoutes = [
         alwaysShow: true,
         component: () => import("@/views/userDemandManage/index"),
         name: "UserDemandManage",
-        meta: { title: "用户留言管理", icon: "dashboard", affix: true },
+        meta: { title: "用户留言管理", icon: "dashboard" },
       },
     ],
   },

+ 104 - 85
src/views/login.vue

@@ -1,82 +1,85 @@
 <template>
   <div class="login">
-    <el-form
-      ref="loginForm"
-      :model="loginForm"
-      :rules="loginRules"
-      class="login-form"
-    >
-      <h3 class="title">争锋科技管理系统</h3>
-      <el-form-item prop="username">
-        <el-input
-          v-model="loginForm.username"
-          type="text"
-          auto-complete="off"
-          placeholder="账号"
-        >
-          <svg-icon
-            slot="prefix"
-            icon-class="user"
-            class="el-input__icon input-icon"
-          />
-        </el-input>
-      </el-form-item>
-      <el-form-item prop="password">
-        <el-input
-          v-model="loginForm.password"
-          type="password"
-          auto-complete="off"
-          placeholder="密码"
-          @keyup.enter.native="handleLogin"
-        >
-          <svg-icon
-            slot="prefix"
-            icon-class="password"
-            class="el-input__icon input-icon"
-          />
-        </el-input>
-      </el-form-item>
-      <el-form-item prop="code" v-if="captchaEnabled">
-        <el-input
-          v-model="loginForm.code"
-          auto-complete="off"
-          placeholder="验证码"
-          style="width: 63%"
-          @keyup.enter.native="handleLogin"
-        >
-          <svg-icon
-            slot="prefix"
-            icon-class="validCode"
-            class="el-input__icon input-icon"
-          />
-        </el-input>
-        <div class="login-code">
-          <img :src="codeUrl" @click="getCode" class="login-code-img" />
-        </div>
-      </el-form-item>
-      <el-checkbox
-        v-model="loginForm.rememberMe"
-        style="margin: 0px 0px 25px 0px"
-        >记住密码</el-checkbox
+    <div class="loginBox">
+      <el-form
+        ref="loginForm"
+        :model="loginForm"
+        :rules="loginRules"
+        class="login-form"
       >
-      <el-form-item style="width: 100%">
-        <el-button
-          :loading="loading"
-          size="medium"
-          type="primary"
-          style="width: 100%"
-          @click.native.prevent="handleLogin"
-        >
-          <span v-if="!loading">登 录</span>
-          <span v-else>登 录 中...</span>
-        </el-button>
-        <div style="float: right" v-if="register">
-          <router-link class="link-type" :to="'/register'"
-            >立即注册</router-link
+        <el-form-item prop="username">
+          <el-input
+            v-model="loginForm.username"
+            type="text"
+            auto-complete="off"
+            placeholder="账号"
+          >
+            <svg-icon
+              slot="prefix"
+              icon-class="user"
+              class="el-input__icon input-icon"
+            />
+          </el-input>
+        </el-form-item>
+        <el-form-item prop="password">
+          <el-input
+            v-model="loginForm.password"
+            type="password"
+            auto-complete="off"
+            placeholder="密码"
+            @keyup.enter.native="handleLogin"
+          >
+            <svg-icon
+              slot="prefix"
+              icon-class="password"
+              class="el-input__icon input-icon"
+            />
+          </el-input>
+        </el-form-item>
+        <el-form-item prop="code" v-if="captchaEnabled">
+          <el-input
+            v-model="loginForm.code"
+            auto-complete="off"
+            placeholder="验证码"
+            style="width: 63%"
+            @keyup.enter.native="handleLogin"
           >
-        </div>
-      </el-form-item>
-    </el-form>
+            <svg-icon
+              slot="prefix"
+              icon-class="validCode"
+              class="el-input__icon input-icon"
+            />
+          </el-input>
+          <div class="login-code">
+            <img :src="codeUrl" @click="getCode" class="login-code-img" />
+          </div>
+        </el-form-item>
+        <el-form-item style="width: 100%">
+          <el-button
+            :loading="loading"
+            size="medium"
+            type="primary"
+            style="width: 100%"
+            @click.native.prevent="handleLogin"
+          >
+            <span v-if="!loading">登 录</span>
+            <span v-else>登 录 中...</span>
+          </el-button>
+          <div style="float: right" v-if="register">
+            <router-link class="link-type" :to="'/register'"
+              >立即注册</router-link
+            >
+          </div>
+        </el-form-item>
+        <el-form-item>
+          <el-divider>
+            <!-- 欢迎登录争锋后台系统 -->
+            <span class="title">欢迎登录争锋后台系统</span>
+          </el-divider>
+        </el-form-item>
+      </el-form>
+    </div>
+
     <!--  底部  -->
     <div class="el-login-footer">
       <span>南京争锋信息科技有限公司 All rights Reserved</span>
@@ -100,8 +103,8 @@ export default {
     return {
       codeUrl: "",
       loginForm: {
-        username: "admin",
-        password: "admin123",
+        username: "",
+        password: "",
         rememberMe: false,
         code: "",
         uuid: "",
@@ -195,23 +198,30 @@ export default {
 <style rel="stylesheet/scss" lang="scss">
 .login {
   display: flex;
-  justify-content: center;
+  justify-content: flex-end;
   align-items: center;
   height: 100%;
-  background-image: url("../assets/images/login-background.jpg");
+  background-image: url("../assets/images/login-background.png");
   background-size: cover;
 }
 .title {
-  margin: 0px auto 30px auto;
-  text-align: center;
   color: #707070;
+  font-size: 12px;
+  white-space: nowrap;
 }
 
-.login-form {
-  border-radius: 6px;
+.loginBox {
+  border-radius: 20px;
   background: #ffffff;
   width: 400px;
-  padding: 25px 25px 5px 25px;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  padding-top: 50px;
+  margin-right: 20%;
+}
+.login-form {
+  width: 88%;
   .el-input {
     height: 38px;
     input {
@@ -224,6 +234,15 @@ export default {
     margin-left: 2px;
   }
 }
+
+@media (max-width: 1280px) {
+  .loginBox {
+    width: 360px;
+    margin-right: 10%;
+    padding-top: 40px;
+  }
+}
+
 .login-tip {
   font-size: 13px;
   text-align: center;
@@ -245,7 +264,7 @@ export default {
   bottom: 0;
   width: 100%;
   text-align: center;
-  color: #fff;
+  color: #707070;
   font-family: Arial;
   font-size: 12px;
   letter-spacing: 1px;

+ 2 - 2
src/views/register.vue

@@ -6,7 +6,7 @@
       :rules="registerRules"
       class="register-form"
     >
-      <h3 class="title">争锋科技管理系统</h3>
+      <h3 class="title">争锋科技官网管理系统</h3>
       <el-form-item prop="username">
         <el-input
           v-model="registerForm.username"
@@ -205,7 +205,7 @@ export default {
   justify-content: center;
   align-items: center;
   height: 100%;
-  background-image: url("../assets/images/login-background.jpg");
+  background-image: url("../assets/images/login-background.png");
   background-size: cover;
 }
 .title {

+ 1 - 1
vue.config.js

@@ -7,7 +7,7 @@ function resolve(dir) {
 
 const CompressionPlugin = require("compression-webpack-plugin");
 
-const name = process.env.VUE_APP_TITLE || "争锋科技管理系统"; // 网页标题
+const name = process.env.VUE_APP_TITLE || "争锋科技官网管理系统"; // 网页标题
 
 const port = process.env.port || process.env.npm_config_port || 80; // 端口