Initial commit

3 years ago · 7165b56bcc
commit 7165b56bcc
29 changed files with 30105 additions and 0 deletions
--- a/.browserslistrc
+++ b/.browserslistrc
@ -0,0 +1,3 @@
 > 1%
 last 2 versions
 not dead
--- a/.editorconfig
+++ b/.editorconfig
@ -0,0 +1,5 @@
 [*.{js,jsx,ts,tsx,vue}]
 indent_style = space
 indent_size = 2
 trim_trailing_whitespace = true
 insert_final_newline = true
--- a/.env.development
+++ b/.env.development
@ -0,0 +1,3 @@
 NODE_ENV = 'development'
 VUE_APP_URL = ''
 VUE_APP_CDN = ''
--- a/.env.production
+++ b/.env.production
@ -0,0 +1,3 @@
 NODE_ENV = 'production'
 VUE_APP_URL = ''
 VUE_APP_CDN = ''
--- a/.eslintrc.js
+++ b/.eslintrc.js
@ -0,0 +1,17 @@
 module.exports = {
  root: true,
  env: {
    node: true
  },
  extends: [
    'plugin:vue/essential',
    '@vue/standard'
  ],
  parserOptions: {
    parser: 'babel-eslint'
  },
  rules: {
    'no-console': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
    'no-debugger': process.env.NODE_ENV === 'production' ? 'warn' : 'off'
  }
 }
--- a/.gitignore
+++ b/.gitignore
@ -0,0 +1,23 @@
 .DS_Store
 node_modules
 /dist
 # local env files
 .env.local
 .env.*.local
 # Log files
 npm-debug.log*
 yarn-debug.log*
 yarn-error.log*
 pnpm-debug.log*
 # Editor directories and files
 .idea
 .vscode
 *.suo
 *.ntvs*
 *.njsproj
 *.sln
 *.sw?
--- a/README.md
+++ b/README.md
@ -0,0 +1,24 @@
 # base-vue
 ## Project setup
 ```
 npm install
 ```
 ### Compiles and hot-reloads for development
 ```
 npm run serve
 ```
 ### Compiles and minifies for production
 ```
 npm run build
 ```
 ### Lints and fixes files
 ```
 npm run lint
 ```
 ### Customize configuration
 See [Configuration Reference](https://cli.vuejs.org/config/).
--- a/babel.config.js
+++ b/babel.config.js
@ -0,0 +1,5 @@
 module.exports = {
  presets: [
    '@vue/cli-plugin-babel/preset'
  ]
 }
--- a/package-lock.json
+++ b/package-lock.json
--- a/package.json
+++ b/package.json
@ -0,0 +1,37 @@
 {
  "name": "base-vue",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "serve": "vue-cli-service serve",
    "build": "vue-cli-service build",
    "lint": "vue-cli-service lint"
  },
  "dependencies": {
    "axios": "^0.21.1",
    "core-js": "^3.6.5",
    "element-ui": "^2.4.5",
    "node-sass": "^4.14.1",
    "vue": "^2.6.11",
    "vue-router": "^3.2.0",
    "vuex": "^3.4.0"
  },
  "devDependencies": {
    "@vue/cli-plugin-babel": "~4.5.0",
    "@vue/cli-plugin-eslint": "~4.5.0",
    "@vue/cli-plugin-router": "~4.5.0",
    "@vue/cli-plugin-vuex": "~4.5.0",
    "@vue/cli-service": "~4.5.0",
    "@vue/eslint-config-standard": "^5.1.2",
    "babel-eslint": "^10.1.0",
    "eslint": "^6.7.2",
    "eslint-plugin-import": "^2.20.2",
    "eslint-plugin-node": "^11.1.0",
    "eslint-plugin-promise": "^4.2.1",
    "eslint-plugin-standard": "^4.0.0",
    "eslint-plugin-vue": "^6.2.2",
    "sass-loader": "^7.0.3",
    "vue-cli-plugin-element": "^1.0.1",
    "vue-template-compiler": "^2.6.11"
  }
 }
--- a/public/favicon.ico
+++ b/public/favicon.ico
--- a/public/index.html
+++ b/public/index.html
@ -0,0 +1,17 @@
 <!DOCTYPE html>
 <html lang="">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width,initial-scale=1.0">
    <link rel="icon" href="<%= BASE_URL %>favicon.ico">
    <title><%= htmlWebpackPlugin.options.title %></title>
  </head>
  <body>
    <noscript>
      <strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
    </noscript>
    <div id="app"></div>
    <!-- built files will be auto injected -->
  </body>
 </html>
--- a/src/App.vue
+++ b/src/App.vue
@ -0,0 +1,31 @@
 <template>
  <div id="app">
    <router-view></router-view>
  </div>
 </template>
 <script>
 export default {
  // mounted () {
  //   // 关闭浏览器窗口的时候清空浏览器缓存在localStorage的数据
  //   window.onbeforeunload = function (e) {
  //     var storage = window.localStorage
  //     storage.clear()
  //   }
  // }
 }
 </script>
 <style >
 #app{
  height: 100%;
 }
 *{
  margin: 0px;
  padding: 0px;
 }
 html,body{
  margin: 0px;
  height: 100%;
 }
 </style>
--- a/src/api/auth.js
+++ b/src/api/auth.js
@ -0,0 +1,38 @@
 import { GetAxios } from '@/utils/request'
 import router from '../router'
 router.beforeEach((to, from, next) => {
  // 全局前置守卫
  if (to.path === '/about' || to.path === '/register') {
    next()
  } else {
    // 验证token
    if (localStorage.getItem('manage-token') !== null) {
      next()
    } else {
      next({
        path: '/about'
      })
    }
  }
 })
 export const axios = GetAxios((config) => {
  // 在发送请求之前做些什么
  config.headers['device-type'] = 'web'
  config.headers['manage-token'] = localStorage.getItem('manage-token')
  return config
 }, process.env.VUE_APP_URL, response => {
  if (response.status === 200) {
    if (response.headers['content-type'].indexOf('application/json') !== -1) {
      if (response.data.code === 10000) {
        // 登录失败 跳转到登陆页面
        // 跳转到登录页
        router.push({ path: 'about' })
      } else {
        return response.data
      }
    } else {
      // 文件流
    }
  }
  return response.data
 })
--- a/src/api/basic.js
+++ b/src/api/basic.js
@ -0,0 +1,10 @@
 import { axios } from './auth'
 // 接口
 export const login = (params) => {
  return axios({
    url: '/login',
    method: 'post',
    data: params
  })
 }
--- a/src/api/file.js
+++ b/src/api/file.js
@ -0,0 +1,9 @@
 export const imagePath = process.env.VUE_APP_URL + '/file/image'// 图片上传拼接路径
 export const filePath = process.env.VUE_APP_URL + '/file/file'// 文件上传拼接路径
 export const cdnImage = (imagePath) => { return imagePath === '' ? '' : process.env.VUE_APP_CDN + imagePath }
 export const upHeaders = () => {
  return {
    'device-type': 'web',
    'manage-token': localStorage.getItem('manage-token')
  }
 }
--- a/src/api/index.js
+++ b/src/api/index.js
@ -0,0 +1,11 @@
 /*
 * 接口统一集成模块
 */
 import * as file from './file'
 import * as basic from './basic'
 // 默认全部导出
 export const api = {
  basic,
  file
 }
--- a/src/assets/css/element-variables.scss
+++ b/src/assets/css/element-variables.scss
@ -0,0 +1,11 @@
 /*
 Write your variables here. All available variables can be
 found in element-ui/packages/theme-chalk/src/common/var.scss.
 For example, to overwrite the theme color:
 */
 $--color-primary: teal;
 /* icon font path, required */
 $--font-path: '~element-ui/lib/theme-chalk/fonts';
@import "~element-ui/packages/theme-chalk/src/index";
--- a/src/assets/css/public.scss
+++ b/src/assets/css/public.scss
--- a/src/assets/logo.png
+++ b/src/assets/logo.png
--- a/src/components/HelloWorld.vue
+++ b/src/components/HelloWorld.vue
@ -0,0 +1,33 @@
 <template>
  <div class="hello">
    <h1>{{ msg }}</h1>
      <a href="/#/About" target="_blank" rel="noopener">about</a>
      </div>
 </template>
 <script>
 export default {
  name: 'HelloWorld',
  props: {
    msg: String
  }
 }
 </script>
 <!-- Add "scoped" attribute to limit CSS to this component only -->
 <style scoped>
 h3 {
  margin: 40px 0 0;
 }
 ul {
  list-style-type: none;
  padding: 0;
 }
 li {
  display: inline-block;
  margin: 0 10px;
 }
 a {
  color: #42b983;
 }
 </style>
--- a/src/main.js
+++ b/src/main.js
@ -0,0 +1,15 @@
 import Vue from 'vue'
 import App from './App.vue'
 import router from './router'
 import store from './store'
 import * as utils from './utils/index'
 import './plugins/element.js'
 Vue.config.productionTip = false
 Vue.use(utils)
 new Vue({
  router,
  store,
  render: h => h(App)
 }).$mount('#app')
--- a/src/plugins/element.js
+++ b/src/plugins/element.js
@ -0,0 +1,5 @@
 import Vue from 'vue'
 import Element from 'element-ui'
 import '@/assets/css/element-variables.scss'
 Vue.use(Element)
--- a/src/router/index.js
+++ b/src/router/index.js
@ -0,0 +1,27 @@
 import Vue from 'vue'
 import VueRouter from 'vue-router'
 import Home from '../views/Home.vue'
 Vue.use(VueRouter)
 // 配置路由
 export const routes = [
  {
    path: '/',
    name: 'Home',
    component: Home
  },
  {
    path: '/about',
    name: 'About',
    // route level code-splitting
    // this generates a separate chunk (about.[hash].js) for this route
    // which is lazy-loaded when the route is visited.
    component: () => import(/* webpackChunkName: "about" */ '../views/About.vue')
  }
 ]
 const router = new VueRouter({
  routes
 })
 export default router
--- a/src/store/index.js
+++ b/src/store/index.js
@ -0,0 +1,15 @@
 import Vue from 'vue'
 import Vuex from 'vuex'
 Vue.use(Vuex)
 export default new Vuex.Store({
  state: {
  },
  mutations: {
  },
  actions: {
  },
  modules: {
  }
 })
--- a/src/utils/index.js
+++ b/src/utils/index.js
@ -0,0 +1,29 @@
 import { api } from '@/api'
 // 配置工具类
 export const utils = {
  api: api,
  formatDate: (time, fmt) => {
    if (time > 0) {
      const date = new Date(time * 1000)
      if (/(y+)/.test(fmt)) {
        fmt = fmt.replace(RegExp.$1, (date.getFullYear() + '').substr(4 - RegExp.$1.length))
      }
      const o = {
        'M+': date.getMonth() + 1,
        'd+': date.getDate(),
        'h+': date.getHours(),
        'm+': date.getMinutes(),
        's+': date.getSeconds()
      }
      for (const k in o) {
        if (new RegExp(`(${k})`).test(fmt)) {
          const str = o[k] + ''
          fmt = fmt.replace(RegExp.$1, (RegExp.$1.length === 1) ? str : ('00' + str).substr(str.length))
        }
      }
      return fmt
    } else {
      return ''
    }
  }
 }
--- a/src/utils/request.js
+++ b/src/utils/request.js
@ -0,0 +1,28 @@
 import axios from 'axios'
 export const GetAxios = (config, baseUrl, toResponse) => {
  const instance = axios.create({
    headers: {
      'content-type': 'application/json'
    }
  })
  instance.defaults.baseURL = baseUrl
  instance.defaults.withCredentials = true
  // 添加请求拦截器
  instance.interceptors.request.use(config, function (error) {
    // 对请求错误做些什么
    return Promise.reject(error)
  })
  // 添加响应拦截器
  instance.interceptors.response.use(function (response) {
    // 对响应数据做点什么
    // console.log(response)
    return toResponse(response)
  }, function (error) {
    // 对响应错误做点什么
    return Promise.reject(error)
  })
  return instance
 }
--- a/src/views/About.vue
+++ b/src/views/About.vue
@ -0,0 +1,25 @@
 <template>
  <div class="about">
    <h1>{{msg}}</h1>
  </div>
 </template>
 <script>
 import { api } from '@/api'
 import { utils } from '@/utils'
 export default ({
  data () {
    return {
      msg: ''
    }
  },
  created () {
    // 测试时间转换工具类
    const timeTest = utils.formatDate('1629360995', 'yyyy-MM-dd')
    console.log(timeTest)
    // 测试调用接口
    api.basic.login({ userName: 'admin', pwd: '123456' }).then(res => {
      console.log(res)
    })
  }
 })
 </script>
--- a/src/views/Home.vue
+++ b/src/views/Home.vue
@ -0,0 +1,18 @@
 <template>
  <div class="home">
    <img alt="Vue logo" src="../assets/logo.png">
    <HelloWorld msg="Welcome to Your Vue.js App"/>
  </div>
 </template>
 <script>
 // @ is an alias to /src
 import HelloWorld from '@/components/HelloWorld.vue'
 export default {
  name: 'Home',
  components: {
    HelloWorld
  }
 }
 </script>