xg

package-lock.json

@@ -7767,6 +7767,11 @@
       "dev": true,
       "optional": true
     },
+    "mypackage_hzh": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/mypackage_hzh/-/mypackage_hzh-1.0.0.tgz",
+      "integrity": "sha512-Wwf3U4q6/4+wjDAsuIlP8ENkTMQ9H7RcxwmJwtErNoh4JPpVarYYMeOtoJj8lbDsQ48rf3duyqzknxWX9GwXPQ=="
+    },
     "mz": {
       "version": "2.7.0",
       "resolved": "http://192.168.80.51:7001/mz/download/mz-2.7.0.tgz",

package.json

@@ -14,6 +14,7 @@
     "element-ui": "^2.13.0",
     "html2canvas": "^1.0.0-rc.5",
     "jspdf": "^1.5.3",
+    "mypackage_hzh": "^1.0.0",
     "vue": "^2.6.11",
     "vue-router": "^3.1.3",
     "vuex": "^3.1.2"

src/components/UserTest.vue

@@ -0,0 +1,108 @@
+<style lang="scss" scoped>
+.user-test{
+  height: 100%;
+  &>*{
+    height: 100%;
+    display: inline-block;
+    vertical-align: top;
+  }
+  .left-menu{
+    width: 100px;
+    background: #181a19;
+    text-align: center;
+    padding: 40px 0;
+    color: white;
+    .user-info{
+      font-size: 15px;
+      img{
+        width: 40px;
+        height: 40px;
+        margin: 10px;
+      }
+    }
+    &>p{
+      display: inline-block;
+      padding: 2px 3px;
+      border-radius: 10px;
+      background: #5fb9c1;
+      margin: 15px 0 30px;
+      font-size: 13px;
+    }
+    ul{
+      li{
+        padding: 15px 0;
+        cursor: pointer;
+        opacity: 0.8;
+        &:hover{
+          opacity: 1;
+          background: #3a3c3b;
+        }
+        img{
+          width: 20px;
+          height: 20px;
+          margin-bottom: 5px;
+        }
+      }
+    }
+  }
+  .right-content{
+    width: calc(100% - 100px);
+  }
+}
+</style>
+<template>
+<div class="user-test">
+  <div class="left-menu">
+    <div class="user-info">
+      <img src="@/images/icon/user.png">
+      <p>你那么狗</p>
+    </div>
+    <p>爻象个人中心</p>
+    <ul>
+      <li>
+        <img src="@/images/icon/user.png">
+        <p>状态记录</p>
+      </li>
+      <li>
+        <img src="@/images/icon/user.png">
+        <p>学习提升</p>
+      </li>
+      <li>
+        <img src="@/images/icon/user.png">
+        <p>社交圈子</p>
+      </li>
+      <li>
+        <img src="@/images/icon/user.png">
+        <p>个人信息</p>
+      </li>
+      <li>
+        <img src="@/images/icon/user.png">
+        <p>学习小组</p>
+      </li>
+      <li>
+        <img src="@/images/icon/user.png">
+        <p>自习室</p>
+      </li>
+    </ul>
+  </div>
+  <div class="right-content">
+
+  </div>
+</div>
+</template>
+
+<script>
+export default {
+  name: 'UserTest',
+  components: {
+  },
+  data () {
+      return {
+      }
+  },
+  created() {
+  },
+  methods: {
+  }
+}
+</script>

src/router/index.js

@@ -33,6 +33,7 @@ const PDFTest = () => import(/* webpackChunkName: "group-controlApp"*/'@/compone
 // const Knowledge = () => import(/* webpackChunkName: "group-controlApp"*/'@/components/report/Knowledge');
 const SimpleReport = () => import(/* webpackChunkName: "group-controlApp"*/'@/components/report/SimpleReport');
 const ControlLogin = () => import(/* webpackChunkName: "group-controlApp"*/'@/login/ControlLogin');
+const UserTest = () => import(/* webpackChunkName: "group-controlApp"*/'@/components/UserTest');
 
 import store from '@/store/index';
 import { getLoginUser } from '@/api/login'
@@ -173,5 +174,9 @@ export default new Router({
         path: '/ctrlLogin',
         name: 'ControlLogin',
         component: ControlLogin,
+    },{
+        path: '/xxx',
+        name: 'UserTest',
+        component: UserTest,
     }]
 });