后台管理基础页面更新

package-lock.json

@@ -2431,6 +2431,11 @@
         "isarray": "^1.0.0"
       }
     },
+    "buffer-equal-constant-time": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npm.taobao.org/buffer-equal-constant-time/download/buffer-equal-constant-time-1.0.1.tgz",
+      "integrity": "sha1-+OcRMvf/5uAaXJaXpMbz5I1cyBk="
+    },
     "buffer-from": {
       "version": "1.1.1",
       "resolved": "https://registry.npm.taobao.org/buffer-from/download/buffer-from-1.1.1.tgz",
@@ -4035,6 +4040,14 @@
         "safer-buffer": "^2.1.0"
       }
     },
+    "ecdsa-sig-formatter": {
+      "version": "1.0.11",
+      "resolved": "https://registry.npm.taobao.org/ecdsa-sig-formatter/download/ecdsa-sig-formatter-1.0.11.tgz",
+      "integrity": "sha1-rg8PothQRe8UqBfao86azQSJ5b8=",
+      "requires": {
+        "safe-buffer": "^5.0.1"
+      }
+    },
     "ee-first": {
       "version": "1.1.1",
       "resolved": "https://registry.npm.taobao.org/ee-first/download/ee-first-1.1.1.tgz",
@@ -6751,6 +6764,23 @@
         "graceful-fs": "^4.1.6"
       }
     },
+    "jsonwebtoken": {
+      "version": "8.5.1",
+      "resolved": "https://registry.npm.taobao.org/jsonwebtoken/download/jsonwebtoken-8.5.1.tgz",
+      "integrity": "sha1-AOceC431TCEhofJhN98igGc7zA0=",
+      "requires": {
+        "jws": "^3.2.2",
+        "lodash.includes": "^4.3.0",
+        "lodash.isboolean": "^3.0.3",
+        "lodash.isinteger": "^4.0.4",
+        "lodash.isnumber": "^3.0.3",
+        "lodash.isplainobject": "^4.0.6",
+        "lodash.isstring": "^4.0.1",
+        "lodash.once": "^4.0.0",
+        "ms": "^2.1.1",
+        "semver": "^5.6.0"
+      }
+    },
     "jsprim": {
       "version": "1.4.1",
       "resolved": "https://registry.npm.taobao.org/jsprim/download/jsprim-1.4.1.tgz",
@@ -6763,6 +6793,25 @@
         "verror": "1.10.0"
       }
     },
+    "jwa": {
+      "version": "1.4.1",
+      "resolved": "https://registry.npm.taobao.org/jwa/download/jwa-1.4.1.tgz?cache=0&sync_timestamp=1576560341481&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fjwa%2Fdownload%2Fjwa-1.4.1.tgz",
+      "integrity": "sha1-dDwymFy56YZVUw1TZBtmyGRbA5o=",
+      "requires": {
+        "buffer-equal-constant-time": "1.0.1",
+        "ecdsa-sig-formatter": "1.0.11",
+        "safe-buffer": "^5.0.1"
+      }
+    },
+    "jws": {
+      "version": "3.2.2",
+      "resolved": "https://registry.npm.taobao.org/jws/download/jws-3.2.2.tgz",
+      "integrity": "sha1-ABCZ82OUaMlBQADpmZX6UvtHgwQ=",
+      "requires": {
+        "jwa": "^1.4.1",
+        "safe-buffer": "^5.0.1"
+      }
+    },
     "killable": {
       "version": "1.0.1",
       "resolved": "https://registry.npm.taobao.org/killable/download/killable-1.0.1.tgz",
@@ -6982,6 +7031,36 @@
       "integrity": "sha1-US6b1yHSctlOPTpjZT+hdRZ0HKY=",
       "dev": true
     },
+    "lodash.includes": {
+      "version": "4.3.0",
+      "resolved": "https://registry.npm.taobao.org/lodash.includes/download/lodash.includes-4.3.0.tgz",
+      "integrity": "sha1-YLuYqHy5I8aMoeUTJUgzFISfVT8="
+    },
+    "lodash.isboolean": {
+      "version": "3.0.3",
+      "resolved": "https://registry.npm.taobao.org/lodash.isboolean/download/lodash.isboolean-3.0.3.tgz",
+      "integrity": "sha1-bC4XHbKiV82WgC/UOwGyDV9YcPY="
+    },
+    "lodash.isinteger": {
+      "version": "4.0.4",
+      "resolved": "https://registry.npm.taobao.org/lodash.isinteger/download/lodash.isinteger-4.0.4.tgz",
+      "integrity": "sha1-YZwK89A/iwTDH1iChAt3sRzWg0M="
+    },
+    "lodash.isnumber": {
+      "version": "3.0.3",
+      "resolved": "https://registry.npm.taobao.org/lodash.isnumber/download/lodash.isnumber-3.0.3.tgz",
+      "integrity": "sha1-POdoEMWSjQM1IwGsKHMX8RwLH/w="
+    },
+    "lodash.isplainobject": {
+      "version": "4.0.6",
+      "resolved": "https://registry.npm.taobao.org/lodash.isplainobject/download/lodash.isplainobject-4.0.6.tgz",
+      "integrity": "sha1-fFJqUtibRcRcxpC4gWO+BJf1UMs="
+    },
+    "lodash.isstring": {
+      "version": "4.0.1",
+      "resolved": "https://registry.npm.taobao.org/lodash.isstring/download/lodash.isstring-4.0.1.tgz",
+      "integrity": "sha1-1SfftUVuynzJu5XV2ur4i6VKVFE="
+    },
     "lodash.kebabcase": {
       "version": "4.1.1",
       "resolved": "https://registry.npm.taobao.org/lodash.kebabcase/download/lodash.kebabcase-4.1.1.tgz",
@@ -7000,6 +7079,11 @@
       "integrity": "sha1-vMbEmkKihA7Zl/Mj6tpezRguC/4=",
       "dev": true
     },
+    "lodash.once": {
+      "version": "4.1.1",
+      "resolved": "https://registry.npm.taobao.org/lodash.once/download/lodash.once-4.1.1.tgz",
+      "integrity": "sha1-DdOXEhPHxW34gJd9UEyI+0cal6w="
+    },
     "lodash.transform": {
       "version": "4.6.0",
       "resolved": "https://registry.npm.taobao.org/lodash.transform/download/lodash.transform-4.6.0.tgz",
@@ -7423,8 +7507,7 @@
     "ms": {
       "version": "2.1.2",
       "resolved": "https://registry.npm.taobao.org/ms/download/ms-2.1.2.tgz",
-      "integrity": "sha1-0J0fNXtEP0kzgqjrPM0YOHKuYAk=",
-      "dev": true
+      "integrity": "sha1-0J0fNXtEP0kzgqjrPM0YOHKuYAk="
     },
     "multicast-dns": {
       "version": "6.2.3",
@@ -9370,8 +9453,7 @@
     "safe-buffer": {
       "version": "5.1.2",
       "resolved": "https://registry.npm.taobao.org/safe-buffer/download/safe-buffer-5.1.2.tgz",
-      "integrity": "sha1-mR7GnSluAxN0fVm9/St0XDX4go0=",
-      "dev": true
+      "integrity": "sha1-mR7GnSluAxN0fVm9/St0XDX4go0="
     },
     "safe-regex": {
       "version": "1.1.0",
@@ -9422,8 +9504,7 @@
     "semver": {
       "version": "5.7.1",
       "resolved": "https://registry.npm.taobao.org/semver/download/semver-5.7.1.tgz?cache=0&sync_timestamp=1576601833267&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fsemver%2Fdownload%2Fsemver-5.7.1.tgz",
-      "integrity": "sha1-qVT5Ma66UI0we78Gnv8MAclhFvc=",
-      "dev": true
+      "integrity": "sha1-qVT5Ma66UI0we78Gnv8MAclhFvc="
     },
     "send": {
       "version": "0.17.1",

package.json

@@ -11,6 +11,7 @@
     "axios": "^0.19.0",
     "core-js": "^3.4.4",
     "element-ui": "^2.13.0",
+    "jsonwebtoken": "^8.5.1",
     "loadsh": "0.0.4",
     "naf-core": "^0.1.2",
     "vue": "^2.6.10",

src/App.vue

@@ -1,8 +1,17 @@
 <template>
   <div id="app">
-    <router-view />
+    <main-layout></main-layout>
   </div>
 </template>
+<script>
+import mainLayout from '@/layout/main-layout.vue';
+export default {
+  name: 'app',
+  components: {
+    mainLayout,
+  },
+};
+</script>
 
 <style lang="less">
 html {

src/layout/layout-part/heads.vue

@@ -0,0 +1,158 @@
+<template>
+  <div id="heads">
+    <el-row>
+      <div class="headTop">
+        <a href="" class="headImg">
+          <img src="../../assets/logo20.png" width="60" height="60" />
+        </a>
+        <h3 class="headCompany">吉林省产业技术创新联盟管理平台后台管理系统</h3>
+      </div>
+      <div class="headBtn">
+        <span class="mr14">|</span>
+        <span class="mr14">
+          <span class="el-icon-s-custom info_icon"></span>
+          &nbsp;测试
+        </span>
+        <a class="mr14">
+          <el-link class="el-icon-edit-outline info_icon">修改密码</el-link>
+        </a>
+        <span class="mr14">|</span>
+        <a style="color: #333;"
+          ><span class="el-icon-switch-button info_icon"></span>
+          &nbsp;退出
+        </a>
+      </div>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import { mapActions, mapState, mapMutations } from 'vuex';
+
+export default {
+  name: 'heads',
+  props: {},
+  components: {},
+  data: () => ({}),
+  created() {},
+  watch: {},
+  computed: {},
+  methods: {},
+};
+</script>
+
+<style lang="less" scoped>
+img {
+  max-height: 100%;
+  max-width: 100%;
+}
+a {
+  text-decoration: none;
+}
+.headTop {
+  float: left;
+  width: 50%;
+  padding: 0 0 0 50px;
+}
+.headImg {
+  float: left;
+  width: 65px;
+  height: 60px;
+}
+.headXinyong {
+  float: left;
+  width: 70px;
+  height: 40px;
+  margin: 13px 0 0 10px;
+}
+.headCompany {
+  float: left;
+  font-size: 21px;
+  width: 244px;
+  padding: 18px 0;
+  margin: 0;
+  color: #333;
+  font-family: 'inherit';
+  font-weight: 500;
+}
+.headBtn {
+  float: right;
+  width: 40%;
+  text-align: right;
+  padding: 0 60px 0 0;
+  margin-top: 20px;
+  font-size: 14px;
+  color: #333;
+}
+.headBtn .mr14 {
+  margin-right: 14px;
+  color: #333;
+}
+.headBtn .el-button {
+  border-radius: 0px;
+  border: none;
+  width: 0;
+  height: 0px;
+}
+.headBtn .el-button:hover {
+  background: none;
+}
+.popover-content {
+  margin: 0;
+  padding: 0;
+  .el-col {
+    border-bottom: 1px dashed #cccccc;
+    font-size: 0.8rem;
+    height: 1.25rem;
+  }
+}
+/deep/.el-popper {
+  border: 1px solid #ccc;
+  border-radius: 0px;
+  height: 100px;
+  padding: 0;
+}
+/deep/.popoverCon {
+  width: 400px;
+  height: 70px;
+  text-align: center;
+  padding: 0;
+  margin: 0;
+}
+/deep/.popoverCon li {
+  list-style: none;
+}
+/deep/.popoverBtn {
+  position: absolute;
+  bottom: 0;
+  left: 0px;
+  width: 424px;
+  height: 30px;
+  line-height: 30px;
+  text-align: right;
+  color: #333;
+  border-radius: 0 0 4px 4px;
+  background: #f6f6f6;
+  margin: 0;
+  padding: 0;
+}
+/deep/.popoverBtn:hover {
+  text-decoration: underline;
+  color: #409eff;
+}
+/deep/.el-form-item__label {
+  padding: 0px 0px 0 0;
+}
+/deep/.el-dialog__header {
+  background-color: #40a44c;
+}
+/deep/.el-icon-close:before {
+  color: #000;
+}
+/deep/.el-dialog__footer {
+  padding: 0px 20px 10px;
+}
+/deep/.el-dialog__body {
+  padding: 15px 20px;
+}
+</style>

src/layout/layout-part/menus.vue

@@ -0,0 +1,40 @@
+<template>
+  <div id="menus">
+    <el-menu :default-active="thisRouter()" class="el-menu-vertical-demo" :router="false" :default-openeds="defalutMenu" @select="to">
+      <el-menu-item index="/"> <i class="el-icon-s-grid"></i>首页 </el-menu-item>
+      <el-submenu index="1">
+        <template v-slot:title>
+          <i class="el-icon-files"></i>
+          <span>测试</span>
+        </template>
+        <el-menu-item-group>
+          <el-menu-item index="/test/index">测试页面</el-menu-item>
+        </el-menu-item-group>
+      </el-submenu>
+    </el-menu>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'menus',
+  props: {},
+  components: {},
+  data: () => ({
+    defalutMenu: ['1', '2', '3'],
+    defalutPage: '',
+  }),
+  created() {},
+  computed: {},
+  methods: {
+    thisRouter() {
+      console.log(this.$route.path);
+    },
+    to(index) {
+      this.$router.push({ path: index });
+    },
+  },
+};
+</script>
+
+<style lang="less" scoped></style>

src/layout/main-layout.vue

@@ -0,0 +1,62 @@
+<template>
+  <div id="main-layout">
+    <el-container style="background:#e7e8eb;">
+      <el-header height="4rem" class="head">
+        <heads></heads>
+      </el-header>
+      <el-container class="contain">
+        <el-aside width="13rem" class="side">
+          <menus></menus>
+        </el-aside>
+        <el-main class="main">
+          <router-view />
+        </el-main>
+      </el-container>
+    </el-container>
+  </div>
+</template>
+
+<script>
+import heads from '@/layout/layout-part/heads.vue';
+import menus from '@/layout/layout-part/menus.vue';
+import { mapActions, mapState } from 'vuex';
+export default {
+  name: 'main-layout',
+  props: {},
+  components: {
+    menus,
+    heads,
+  },
+  data: () => ({}),
+  created() {},
+  computed: {},
+  methods: {},
+};
+</script>
+
+<style lang="less" scoped>
+.head {
+  margin: 0;
+  padding: 0;
+  width: 100%;
+  background: #fff;
+}
+.contain {
+  height: 100%;
+  margin: 2rem 3.5rem;
+  border: 1px solid #a2a2b6;
+  background: #eeeeee;
+}
+.side {
+  margin: 0;
+  padding: 0;
+  width: 2rem;
+  border-right: 1px solid #a2a2b6;
+  background: #ffffff;
+}
+.main {
+  margin: 0;
+  padding: 0 2rem;
+  background: #ffffff;
+}
+</style>

src/main.js

@@ -8,6 +8,7 @@ import '@/plugins/check-res';
 import '@/plugins/meta';
 import '@/plugins/filters';
 import '@/plugins/loading';
+import '@/plugins/methods';
 
 Vue.config.productionTip = false;
 

src/plugins/methods.js

@@ -0,0 +1,33 @@
+import Vue from 'vue';
+import _ from 'lodash';
+const Plugin = {
+  install(Vue, options) {
+    // 3. 注入组件
+    Vue.mixin({
+      created() {
+        if (this.$store && !this.$store.$toUndefined) {
+          this.$store.$toUndefined = this.$toUndefined;
+        }
+      },
+    });
+    // 4. 添加实例方法
+    Vue.prototype.$toUndefined = object => {
+      let keys = Object.keys(object);
+      keys.map(item => {
+        object[item] = object[item] === '' ? (object[item] = undefined) : object[item];
+      });
+      return object;
+    };
+    Vue.prototype.$isBindWx = () => {
+      let user = sessionStorage.getItem('user');
+      if (user) {
+        user = JSON.parse(user);
+        return _.get(user, `openid`, false);
+      } else {
+        return false;
+      }
+    };
+  },
+};
+
+Vue.use(Plugin);

src/router/index.js

@@ -1,18 +1,19 @@
 import Vue from 'vue';
-import VueRouter from 'vue-router';
+import Router from 'vue-router';
+Vue.use(Router);
 
-Vue.use(VueRouter);
-
-const routes = [
-  {
-    path: '/',
-    name: 'index',
-    component: () => import('../views/index.vue'),
-  },
-];
-
-const router = new VueRouter({
-  routes,
+export default new Router({
+  mode: 'history',
+  base: process.env.NODE_ENV === 'development' ? '' : process.env.VUE_APP_ROUTER,
+  routes: [
+    {
+      path: '/',
+      name: 'home',
+      component: () => import('../views/home/index.vue'),
+    },
+    {
+      path: '/test/index',
+      component: () => import('../views/test/index.vue'),
+    },
+  ],
 });
-
-export default router;

src/views/index.vue

@@ -1,6 +1,6 @@
 <template>
   <div id="index">
-    <p>index</p>
+    <p>你好</p>
   </div>
 </template>
 

src/views/test/index.vue

@@ -0,0 +1,19 @@
+<template>
+  <div id="index">
+    <p>测试页面</p>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'index',
+  props: {},
+  components: {},
+  data: () => ({}),
+  created() {},
+  computed: {},
+  methods: {},
+};
+</script>
+
+<style lang="less" scoped></style>