提交

src/App.vue

@@ -6,23 +6,18 @@
 
 <style>
 * {
-  /* padding: 0;
-  margin: 0; */
+  
   box-sizing: border-box;
 }
 html, body {
   width: 100%;
   height: 100%;
   color: #606c71;
+  padding: 0;
+  margin: 0;
 }
 #app {
   width: 100%;
   height: 100%;
-  /* font-family: 'Avenir', Helvetica, Arial, sans-serif;
-  -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
-  text-align: center;
-  color: #2c3e50; */
-  /* margin-top: 60px; */
 }
 </style>

src/api/index.js

@@ -1,7 +1,7 @@
 import axios from 'axios'
 // import queryString from './../untils/querysting'
 
-const base_url = '/api'
+const base_url = '/server'
 
 export default function fetch(url, data) {
   return new Promise((resolve, reject) => {

src/components/Slider/Slider.vue

@@ -1,6 +1,9 @@
 <template>
   <div class="slider">
-    <div class="silder-header"></div>
+    <div class="silder-header">
+      <img src='./../../assets/logo-twitch.png' alt="">
+      Blog
+    </div>
     <div class="slider-list">
       <ul class="slider-item" v-for="(menuItem, index) in theModel" :key="index">
         <Menu :model="menuItem" :icon="menuItem.icon" :key="menuItem.id"></Menu>
@@ -33,11 +36,18 @@ export default {
     width: 100%;
     height: 64px;
     background-color: #002140;
+    line-height: 64px;
+    padding-left: 20px;
+    img {
+      width: 36px;
+      vertical-align: middle;
+    }
   }
   .slider-list {
     padding: 10px 0;
     height: 100%;
     .slider-item {
+      padding: 0;
       display: block;
     }
   }

src/page/Login/Login.vue

@@ -1,8 +1,20 @@
 <template>
   <div class="login">
     <div class="login-box">
-      <input v-model="username" @input="inputHandle($event,'username')" type="text" class="username">
-      <input v-model="password" @input="inputHandle($event,'password')" type="text" class="password">
+      <h3>博客后台管理系统</h3>
+      <input 
+        v-model="username" @input="inputHandle($event,'username')" 
+        type="text" 
+        class="username"
+        placeholder="admin"
+      >
+      <input 
+        v-model="password" 
+        @input="inputHandle($event,'password')" 
+        type="text"
+        class="password"
+        placeholder="password"
+      >
       <button class="login-btn" @click="handleLogin">Login</button>
     </div>
   </div>
@@ -19,7 +31,6 @@ export default {
   },
   methods: {
     handleLogin() {
-      console.log(111)
     },
     inputHandle(e, type) {
       this[type] = e.target.value
@@ -33,6 +44,7 @@ export default {
   width: 100%;
   height: 100%;
   background-color: #324157;
+  background: url('./../../assets/bg-01-denglu.png') no-repeat center center;
   .login-box {
     width: 380px;
     height: 240px;
@@ -42,7 +54,11 @@ export default {
     left: 50%;
     top: 50%;
     margin: -120px 0 0 -190px;
-    padding: 40px;
+    padding: 0 40px 40px;
+    h3 {
+      color: #324157;
+      text-align: center;
+    }
     .username,
     .password {
       margin-bottom: 1rem;

vue.config.js

@@ -3,13 +3,14 @@ module.exports = {
     host: 'localhost',
     port: 8080,
     proxy: {
-      '/api': {
+      '/server': {
         target: 'http://localhost:3333',
         pathRewrite: {
-          '^/api': 'http://localhost:3333'
+          '^/server': 'http://localhost:3333'
         },
         changeOrigin: false
       }
     }
-  }
+  },
+  baseUrl: process.env.NODE_ENV === 'production' ? 'http://zw-lazy.cn/backend/' : '/'
 }