东川项目前端vue基础框子

@@ -5,7 +5,7 @@ module.exports = {
   },
   },
   'extends': [
   'extends': [
     'plugin:vue/essential',
     'plugin:vue/essential',
-    'eslint:recommended'
+    // 'eslint:recommended'
   ],
   ],
   parserOptions: {
   parserOptions: {
     parser: 'babel-eslint'
     parser: 'babel-eslint'

@@ -9,6 +9,8 @@
   },
   },
   "dependencies": {
   "dependencies": {
     "core-js": "^3.6.5",
     "core-js": "^3.6.5",
+    "echarts": "^4.8.0",
+    "element-ui": "^2.13.2",
     "vue": "^2.6.11",
     "vue": "^2.6.11",
     "vue-router": "^3.2.0",
     "vue-router": "^3.2.0",
     "vuex": "^3.4.0"
     "vuex": "^3.4.0"

 <template>
 <template>
   <div id="app">
   <div id="app">
     <div id="nav">
     <div id="nav">
-      <router-link to="/">Home</router-link> |
-      <router-link to="/about">About</router-link>
     </div>
     </div>
     <router-view/>
     <router-view/>
   </div>
   </div>
 </template>
 </template>
 
 
 <style>
 <style>
-#app {
-  font-family: Avenir, Helvetica, Arial, sans-serif;
-  -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
-  text-align: center;
-  color: #2c3e50;
-}
 
 
-#nav {
-  padding: 30px;
-}
-
-#nav a {
-  font-weight: bold;
-  color: #2c3e50;
-}
-
-#nav a.router-link-exact-active {
-  color: #42b983;
-}
 </style>
 </style>

+/**
+ * @file commons
+ * Created by He 2020/07/22
+ * @brief 通用方法
+ * @author liuyuan
+ */
+export default {
+    /**
+     * @brief 依次打印出来， 正式版本要去的掉
+     * @param  {...any} args (1,2,3)
+     */
+    log(...args) {
+        args.forEach(val => {
+            console.log(val);
+        });
+    },
+    /**
+     * @param {*} fmt  '2020-07-22'
+     * @param {*} date  new Date()
+     */
+    dateZhuan(fmt, date) {
+        //日期格式转换
+        var o = {
+            "M+": date.getMonth() + 1, //月份
+            "d+": date.getDate(), //日
+            "h+": date.getHours(), //小时
+            "m+": date.getMinutes(), //分
+            "s+": date.getSeconds(), //秒
+            "q+": Math.floor((date.getMonth() + 3) / 3), //季度
+            "S": date.getMilliseconds() //毫秒
+        };
+        if (/(y+)/.test(fmt))
+            fmt = fmt.replace(RegExp.$1, (date.getFullYear() + "").substr(4 - RegExp.$1.length));
+        for (var k in o)
+            if (new RegExp("(" + k + ")").test(fmt))
+                fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
+        return fmt;
+    },
+    /**
+     * @brief 纯数组去重
+     * @param {*} arr [1, 1, 33, 33, 2]
+     */
+    unique: function (arr) {
+        var newArr = [];
+        var len = arr.length
+        for (var i = 0; i < len; i++) {
+            if (arr.indexOf(arr[i]) == i) {
+                newArr.push(arr[i]);
+            }
+        }
+        return newArr;
+    },
+    /**
+     * @brief:深度拷贝
+     * @param {*} year => obj
+     * */
+    deepClone: function (data) {
+        var type = this.getType(data);
+        var obj;
+        if (type === 'array') {
+            obj = [];
+        } else if (type === 'object') {
+            obj = {};
+        } else {
+            //不再具有下一层次
+            return data;
+        }
+        if (type === 'array') {
+            for (var i = 0, len = data.length; i < len; i++) {
+                obj.push(this.deepClone(data[i]));
+            }
+        } else if (type === 'object') {
+            for (var key in data) {
+                obj[key] = this.deepClone(data[key]);
+            }
+        }
+        return obj;
+    },
+}
\ No newline at end of file

-<template>
-  <div class="hello">
-    <h1>{{ msg }}</h1>
-    <p>
-      For a guide and recipes on how to configure / customize this project,<br>
-      check out the
-      <a href="https://cli.vuejs.org" target="_blank" rel="noopener">vue-cli documentation</a>.
-    </p>
-    <h3>Installed CLI Plugins</h3>
-    <ul>
-      <li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-babel" target="_blank" rel="noopener">babel</a></li>
-      <li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-router" target="_blank" rel="noopener">router</a></li>
-      <li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-vuex" target="_blank" rel="noopener">vuex</a></li>
-      <li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-eslint" target="_blank" rel="noopener">eslint</a></li>
-    </ul>
-    <h3>Essential Links</h3>
-    <ul>
-      <li><a href="https://vuejs.org" target="_blank" rel="noopener">Core Docs</a></li>
-      <li><a href="https://forum.vuejs.org" target="_blank" rel="noopener">Forum</a></li>
-      <li><a href="https://chat.vuejs.org" target="_blank" rel="noopener">Community Chat</a></li>
-      <li><a href="https://twitter.com/vuejs" target="_blank" rel="noopener">Twitter</a></li>
-      <li><a href="https://news.vuejs.org" target="_blank" rel="noopener">News</a></li>
-    </ul>
-    <h3>Ecosystem</h3>
-    <ul>
-      <li><a href="https://router.vuejs.org" target="_blank" rel="noopener">vue-router</a></li>
-      <li><a href="https://vuex.vuejs.org" target="_blank" rel="noopener">vuex</a></li>
-      <li><a href="https://github.com/vuejs/vue-devtools#vue-devtools" target="_blank" rel="noopener">vue-devtools</a></li>
-      <li><a href="https://vue-loader.vuejs.org" target="_blank" rel="noopener">vue-loader</a></li>
-      <li><a href="https://github.com/vuejs/awesome-vue" target="_blank" rel="noopener">awesome-vue</a></li>
-    </ul>
-  </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>

+/**
+ * @file commons
+ * Created by He 2020/07/22
+ * @brief 通用配置
+ * @author liuyuan
+ */
+export default {
+    url: '',
+}
\ No newline at end of file

@@ -3,6 +3,19 @@ import App from './App.vue'
 import router from './router'
 import router from './router'
 import store from './store'
 import store from './store'
 
 
+import echarts from 'echarts'
+import config from './config';
+import commons from './commons/commons';
+
+import ElementUI from 'element-ui';
+import 'element-ui/lib/theme-chalk/index.css';
+
+Vue.use(ElementUI);
+
+
+Vue.prototype.$echarts = echarts;
+Vue.prototype.config = config;
+Vue.prototype.commons = commons;
 Vue.config.productionTip = false
 Vue.config.productionTip = false
 
 
 new Vue({
 new Vue({

@@ -4,21 +4,11 @@ import Home from '../views/Home.vue'
 
 
 Vue.use(VueRouter)
 Vue.use(VueRouter)
 
 
-  const routes = [
-  {
+const routes = [{
   path: '/',
   path: '/',
   name: 'Home',
   name: 'Home',
   component: 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({
 const router = new VueRouter({
   mode: 'history',
   mode: 'history',

+export default {
+  
+}
\ No newline at end of file

+export default {
+} 
\ No newline at end of file

 import Vue from 'vue'
 import Vue from 'vue'
 import Vuex from 'vuex'
 import Vuex from 'vuex'
 
 
-Vue.use(Vuex)
+import demo from './storeModules/demo'  // 页面分组例子
+import actions from './actions'
+import mutations from './mutations'
+import state from './state'
+
+Vue.use(Vuex);
 
 
 export default new Vuex.Store({ 
 export default new Vuex.Store({ 
-  state: {
-  },
-  mutations: {
-  },
-  actions: {
-  },
+    state,  //依此加入到store对象中
+    mutations,
+    actions,
     modules: {
     modules: {
+        demo,
     }
     }
-})
+ })
\ No newline at end of file

+import constant from './constant'
+
+export default{
+  
+}
\ No newline at end of file

+export default {
+}
\ No newline at end of file

+/**
+ * @file demo 文件夹名称，命名需和页面一一对应
+ * Created by He 2020/07/22
+ * @brief store 分组 示例
+ * @author liuyuan
+ */
+
+ // 方法名 一定要备注清楚 一定要备注清楚方法实现的内容！！！
+// const CHANGE_LOAIDNG_TYPE = 'CHANGE_LOAIDNG_TYPE';  
+
+export default {
+    state: {
+    },
+    actions: {
+       
+    },
+    mutations: {
+       
+    }
+};
\ No newline at end of file

-<template>
-  <div class="about">
-    <h1>This is an about page</h1>
-  </div>
-</template>

 <template>
 <template>
     <div class="home">
     <div class="home">
-    <img alt="Vue logo" src="../assets/logo.png">
-    <HelloWorld msg="Welcome to Your Vue.js App"/>
+        <el-button type="primary">首页</el-button>
+
     </div>
     </div>
 </template>
 </template>
 
 
 <script>
 <script>
-// @ is an alias to /src
-import HelloWorld from '@/components/HelloWorld.vue'
-
-export default {
+    export default {
         name: 'Home',
         name: 'Home',
-  components: {
-    HelloWorld
+        components: {},
+        data() {
+            return {
+
+            }
+        }
     }
     }
-}
 </script>
 </script>
\ No newline at end of file