創建项目

.env

@@ -0,0 +1,3 @@
+VUE_APP_AXIOS_BASE_URL = ''
+VUE_APP_ROUTER="projectadmin"
+VUE_APP_HOST="http://broadcast.waityou24.cn"

.eslintrc.js

@@ -0,0 +1,33 @@
+// https://eslint.org/docs/user-guide/configuring
+
+module.exports = {
+  root: true,
+  env: {
+    node: true,
+  },
+  extends: ['plugin:vue/essential', '@vue/prettier'],
+  plugins: ['vue'],
+  rules: {
+    'max-len': [
+      'warn',
+      {
+        code: 10000,
+      },
+    ],
+    'no-unused-vars': 'off',
+    'no-console': 'off',
+    'prettier/prettier': [
+      'warn',
+      {
+        singleQuote: true,
+        trailingComma: 'es5',
+        bracketSpacing: true,
+        jsxBracketSameLine: true,
+        printWidth: 160,
+      },
+    ],
+  },
+  parserOptions: {
+    parser: 'babel-eslint',
+  },
+};

.gitignore

@@ -1,5 +1,6 @@
 .DS_Store
 node_modules
+package-lock.json
 /dist
 
 

README.md

@@ -1,24 +0,0 @@
-# admin
-
-## 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/).

babel.config.js

@@ -1,3 +1,3 @@
 module.exports = {
-  presets: ["@vue/cli-plugin-babel/preset"],
+  presets: ['@vue/cli-plugin-babel/preset'],
 };

package.json

@@ -8,8 +8,16 @@
     "lint": "vue-cli-service lint"
   },
   "dependencies": {
+    "animate.css": "^4.1.1",
+    "axios": "^1.2.2",
     "core-js": "^3.6.5",
+    "element-ui": "^2.15.12",
+    "jsonwebtoken": "^9.0.0",
+    "lodash": "^4.17.21",
+    "moment": "^2.29.4",
+    "naf-core": "^0.1.2",
     "vue": "^2.6.11",
+    "vue-meta": "^2.4.0",
     "vue-router": "^3.2.0",
     "vuex": "^3.4.0"
   },
@@ -27,6 +35,7 @@
     "less": "^3.0.4",
     "less-loader": "^5.0.0",
     "prettier": "^2.2.1",
+    "vue-loader": "^17.0.1",
     "vue-template-compiler": "^2.6.11"
   },
   "eslintConfig": {

src/App.vue

@@ -1,32 +1,24 @@
 <template>
   <div id="app">
-    <div id="nav">
-      <router-link to="/">Home</router-link> |
-      <router-link to="/about">About</router-link>
-    </div>
     <router-view />
   </div>
 </template>
 
 <style lang="less">
-#app {
-  font-family: Avenir, Helvetica, Arial, sans-serif;
-  -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
-  text-align: center;
-  color: #2c3e50;
+body {
+  margin: 0;
 }
-
-#nav {
-  padding: 30px;
-
-  a {
-    font-weight: bold;
-    color: #2c3e50;
-
-    &.router-link-exact-active {
-      color: #42b983;
-    }
-  }
+.w_1200 {
+  max-width: 1200px;
+  margin: 0 auto;
+}
+p {
+  margin: 0;
+  padding: 0;
+}
+.textOver {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
 }
 </style>

src/components/HelloWorld.vue

@@ -1,130 +0,0 @@
-<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 lang="less">
-h3 {
-  margin: 40px 0 0;
-}
-ul {
-  list-style-type: none;
-  padding: 0;
-}
-li {
-  display: inline-block;
-  margin: 0 10px;
-}
-a {
-  color: #42b983;
-}
-</style>

src/components/login/login-1 copy.vue

@@ -0,0 +1,165 @@
+<template>
+  <div id="login-1">
+    <el-row>
+      <el-col :span="24" class="main" :style="{ 'background-image': 'url(' + backimage + ')' }">
+        <el-col :span="24" class="one">
+          <div class="w_1200">
+            <el-col :span="11" class="left">
+              <el-col :span="24" class="info">
+                <el-col :span="24" class="txt">
+                  <el-col :span="4">
+                    <el-image :src="logo_url" class="image"></el-image>
+                  </el-col>
+                  <el-col :span="20">
+                    <h1>{{ name }}</h1></el-col
+                  >
+                </el-col>
+                <el-col :span="24" class="form">
+                  <el-form :model="form" :rules="rules" ref="form">
+                    <el-form-item prop="account">
+                      <el-input placeholder="账号" v-model="form.account" suffix-icon="el-icon-user"> </el-input>
+                    </el-form-item>
+                    <el-form-item prop="password">
+                      <el-input placeholder="密码" v-model="form.password" type="password" suffix-icon="el-icon-lock"> </el-input>
+                    </el-form-item>
+                    <el-col :span="24" class="codes">
+                      <el-col :span="17">
+                        <el-form-item prop="code">
+                          <el-input placeholder="验证码" v-model="form.code"> </el-input>
+                        </el-form-item>
+                      </el-col>
+                      <el-col :span="6" class="code">
+                        <el-image :src="code" class="image"></el-image>
+                      </el-col>
+                    </el-col>
+                    <el-form-item class="btn">
+                      <el-button type="primary" @click="toLogin('form')">登录</el-button>
+                      <el-button type="warning" @click="toRegister()">注册</el-button>
+                    </el-form-item>
+                  </el-form>
+                </el-col>
+              </el-col>
+            </el-col>
+            <el-col :span="13" class="right">
+              <el-image :src="back" class="image"></el-image>
+            </el-col>
+          </div>
+        </el-col>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import { mapState, createNamespacedHelpers } from 'vuex';
+export default {
+  name: 'login-1',
+  props: {},
+  components: {},
+  data: function () {
+    return {
+      // logo
+      logo_url: require('@/assets/logo.png'),
+      // 验证码
+      code: require('@/assets/login/login_1_3.png'),
+      // 背景图片
+      back: require('@/assets/login/login_1_2.png'),
+      // 右侧图片
+      backimage: require('@/assets/login/login_1_1.png'),
+      name: '长春市福瑞科技有限公司',
+      form: {},
+      rules: {
+        account: [{ required: true, message: '账号不能为空', trigger: 'blur' }],
+        password: [{ required: true, message: '密码不能为空', trigger: 'blur' }],
+        code: [{ required: true, message: '验证码不能为空', trigger: 'blur' }],
+      },
+    };
+  },
+  created() {},
+  methods: {
+    toLogin(formName) {
+      this.$refs[formName].validate(async (valid) => {
+        if (valid) {
+          this.$emit('toLogin', { data: this.form, formName: formName });
+        } else {
+          console.log('error submit!!');
+          return false;
+        }
+      });
+    },
+    toRegister() {
+      this.$emit('toRegister');
+    },
+  },
+  computed: {
+    ...mapState(['user']),
+  },
+  metaInfo() {
+    return { title: this.$route.meta.title };
+  },
+  watch: {
+    test: {
+      deep: true,
+      immediate: true,
+      handler(val) {},
+    },
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.w_1200 {
+  max-width: 1200px;
+  margin: 0 auto;
+  padding: 15vh 0;
+}
+.main {
+  background-size: 100% 100%;
+  height: 100vh;
+  background-repeat: no-repeat;
+  overflow: hidden;
+  .one {
+    height: 93vh;
+    width: 96vw;
+    margin: 2%;
+    background: rgba(255, 255, 255, 0.7);
+    border-radius: 20px;
+  }
+
+  .left {
+    .info {
+      border-radius: 20px;
+      background: #fff;
+      box-shadow: 0 0 10px #bdbdbd;
+      padding: 5%;
+      .txt {
+        margin: 20px 0;
+        .image {
+          width: 50px;
+          height: 50px;
+        }
+        h1 {
+          margin: 3px 0;
+        }
+      }
+    }
+    .form {
+      .codes {
+        margin: 0 0 10px 0;
+        .code {
+          height: 40px;
+          background: rgba(55, 55, 55, 0.5);
+          margin: 0 0 0 3%;
+          .image {
+            height: 40px;
+          }
+        }
+      }
+      .btn {
+        margin: 15% 0 0 0;
+        text-align: center;
+      }
+    }
+  }
+}
+</style>

src/components/login/login-1.vue

@@ -0,0 +1,165 @@
+<template>
+  <div id="login-1">
+    <el-row>
+      <el-col :span="24" class="main" :style="{ 'background-image': `url('${bg_url_1}')` }">
+        <el-col :span="24" class="one">
+          <div class="w_1200">
+            <el-col :span="24" class="one_1">
+              <el-col :span="12" class="one_1_1">
+                <el-col :span="24" class="login">
+                  <el-col :span="24" class="login_1 textOver">
+                    <el-image :src="bg_url_3"></el-image>
+                    <span>{{ title }}</span>
+                  </el-col>
+                  <el-col :span="24" class="login_2">
+                    <el-form :model="form" :rules="rules" ref="form">
+                      <el-form-item prop="account">
+                        <el-input placeholder="账号" v-model="form.account" suffix-icon="el-icon-user"> </el-input>
+                      </el-form-item>
+                      <el-form-item prop="password">
+                        <el-input placeholder="密码" v-model="form.password" type="password" suffix-icon="el-icon-lock"> </el-input>
+                      </el-form-item>
+                      <el-col :span="24" class="codes">
+                        <el-col :span="17">
+                          <el-form-item prop="code">
+                            <el-input placeholder="验证码" v-model="form.code"> </el-input>
+                          </el-form-item>
+                        </el-col>
+                        <el-col :span="6" class="code">
+                          <el-image :src="code" class="image"></el-image>
+                        </el-col>
+                      </el-col>
+                      <el-form-item class="btn">
+                        <el-button type="primary" @click="toLogin('form')">登录</el-button>
+                        <el-button type="danger" @click="toRegister()">注册</el-button>
+                      </el-form-item>
+                    </el-form>
+                  </el-col>
+                </el-col>
+              </el-col>
+              <el-col :span="12" class="one_1_2">
+                <el-image :src="bg_url_2" fit="fill"></el-image>
+              </el-col>
+            </el-col>
+          </div>
+        </el-col>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import { mapState, createNamespacedHelpers } from 'vuex';
+export default {
+  name: 'login-1',
+  props: {},
+  components: {},
+  data: function () {
+    return {
+      // 背景图片
+      bg_url_1: require('@a/login/login_1_1.png'),
+      bg_url_2: require('@a/login/login_1_2.png'),
+      bg_url_3: require('@a/logo.png'),
+      title: '长春市福瑞科技有限公司',
+      form: {},
+      rules: {
+        account: [{ required: true, message: '账号不能为空', trigger: 'blur' }],
+        password: [{ required: true, message: '密码不能为空', trigger: 'blur' }],
+        code: [{ required: true, message: '验证码不能为空', trigger: 'blur' }],
+      },
+      // 验证码
+      code: require('@/assets/login/login_1_3.png'),
+    };
+  },
+  created() {},
+  methods: {
+    toLogin(formName) {
+      this.$refs[formName].validate(async (valid) => {
+        if (valid) {
+          this.$emit('toLogin', { data: this.form, formName: formName });
+        } else {
+          console.log('error submit!!');
+          return false;
+        }
+      });
+    },
+    toRegister() {
+      this.$emit('toRegister');
+    },
+  },
+  computed: {
+    ...mapState(['user']),
+  },
+  metaInfo() {
+    return { title: this.$route.meta.title };
+  },
+  watch: {
+    test: {
+      deep: true,
+      immediate: true,
+      handler(val) {},
+    },
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.w_1200 {
+  max-width: 1450px;
+}
+.main {
+  height: 100vh;
+  background-repeat: no-repeat;
+  background-size: 100%;
+  padding: 2vw;
+
+  .one {
+    height: 100%;
+    background-color: rgba(255, 255, 255, 0.8);
+    border-radius: 5px;
+    .one_1 {
+      margin: 10vw 0 0 0;
+      .one_1_1 {
+        padding: 0 8vw 0 4vw;
+        .login {
+          height: 450px;
+          padding: 45px 30px;
+          border-radius: 10px;
+          background-color: #fff;
+          box-shadow: 2px 3px 7px rgb(0 0 0 / 20%);
+          .login_1 {
+            display: inline-flex;
+            margin: 0 0 2vw 0;
+            .el-image {
+              width: 50px;
+              height: 50px;
+              margin: 0 10px 0 0;
+            }
+            span {
+              padding: 0.5vw 0 0 0;
+              font-size: 25px;
+            }
+          }
+          .login_2 {
+            .codes {
+              margin: 0 0 10px 0;
+              .code {
+                height: 40px;
+                background: rgba(55, 55, 55, 0.5);
+                margin: 0 0 0 3%;
+                .image {
+                  height: 40px;
+                }
+              }
+            }
+            .btn {
+              margin: 15% 0 0 0;
+              text-align: center;
+            }
+          }
+        }
+      }
+    }
+  }
+}
+</style>

src/components/login/login-2.vue

@@ -0,0 +1,107 @@
+<template>
+  <div id="login-2">
+    <el-row>
+      <el-col :span="24" class="main" :style="{ 'background-image': 'url(' + backimage + ')' }">
+        <div class="w_1200">
+          <el-col :span="24" class="info">
+            <el-col :span="24" class="txt">
+              <el-col :span="6">
+                <el-image :src="logo_url" class="image"></el-image>
+              </el-col>
+              <el-col :span="16">
+                <h3>{{ name }}</h3>
+              </el-col>
+            </el-col>
+            <el-col :span="24" class="tabs">
+              <el-tabs v-model="active">
+                <el-tab-pane label="账号密码登录" name="1">
+                  <form-1 class="form1 animate__animated animate__bounceInLeft" @toLogin="toLogin" @toRegister="toRegister"></form-1>
+                </el-tab-pane>
+                <el-tab-pane label="手机号登录" name="2">
+                  <form-2 class="form1 animate__animated animate__bounceInRight" @toLogin="toLogin" @toRegister="toRegister" @toCode="toCode"></form-2>
+                </el-tab-pane>
+              </el-tabs>
+            </el-col>
+          </el-col>
+        </div>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import { mapState, createNamespacedHelpers } from 'vuex';
+export default {
+  name: 'login-2',
+  props: {},
+  components: {
+    form1: () => import('./parts/form-1.vue'),
+    form2: () => import('./parts/form-2.vue'),
+  },
+  data: function () {
+    return {
+      name: '长春市福瑞科技有限公司',
+      // logo
+      logo_url: require('@/assets/logo.png'),
+      // 背景图片
+      backimage: require('@/assets/login/login_2_1.png'),
+      active: '1',
+    };
+  },
+  created() {},
+  methods: {
+    toLogin(formName) {
+      this.$emit('toLogin', { data: this.form, formName: formName });
+    },
+    toRegister() {
+      this.$emit('toRegister');
+    },
+    toCode() {
+      this.$emit('toCode');
+    },
+  },
+  computed: {
+    ...mapState(['user']),
+  },
+  metaInfo() {
+    return { title: this.$route.meta.title };
+  },
+  watch: {
+    test: {
+      deep: true,
+      immediate: true,
+      handler(val) {},
+    },
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.main {
+  background-size: 100%;
+  height: 100vh;
+  background-repeat: no-repeat;
+  overflow: hidden;
+
+  .info {
+    padding: 8% 35% 0 35%;
+    .txt {
+      margin: 20px 0;
+      text-align: center;
+      .image {
+        width: 40px;
+        height: 40px;
+      }
+      h3 {
+        margin: 5px 0;
+      }
+    }
+  }
+}
+/deep/.el-tabs__nav-wrap::after {
+  position: static !important;
+}
+/deep/.el-tabs__nav-scroll {
+  padding: 0 5vw;
+}
+</style>

src/components/login/login-3.vue

@@ -0,0 +1,136 @@
+<template>
+  <div id="login-2">
+    <el-row>
+      <el-col :span="24" class="main" :style="{ 'background-image': `url('${backimage}')` }">
+        <div class="w_1200">
+          <el-col :span="24" class="info">
+            <el-col :span="24" class="info_1"> 欢迎登陆 </el-col>
+            <el-col :span="24" class="info_2">
+              <el-form :model="form" :rules="rules" ref="form">
+                <el-form-item prop="account">
+                  <el-input placeholder="请输入账号" v-model="form.account">
+                    <el-button slot="prepend" icon="el-icon-user-solid"></el-button>
+                  </el-input>
+                </el-form-item>
+                <el-form-item prop="password">
+                  <el-input placeholder="密码" v-model="form.password" type="password">
+                    <el-button slot="prepend" icon="el-icon-user-solid"></el-button>
+                  </el-input>
+                </el-form-item>
+                <el-form-item class="btn">
+                  <el-button type="primary" @click="toLogin('form')">登录</el-button>
+                </el-form-item>
+              </el-form>
+              <el-col :span="24" class="info_3"> 输入任意用户名和密码即可 </el-col>
+            </el-col>
+          </el-col>
+        </div>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import { mapState, createNamespacedHelpers } from 'vuex';
+export default {
+  name: 'login-2',
+  props: {},
+  components: {},
+  data: function () {
+    return {
+      // 背景图片
+      backimage: require('@/assets/login/login_3_1.png'),
+      form: {},
+      rules: {
+        account: [{ required: true, message: '账号不能为空', trigger: 'blur' }],
+        password: [{ required: true, message: '密码不能为空', trigger: 'blur' }],
+        code: [{ required: true, message: '验证码不能为空', trigger: 'blur' }],
+      },
+    };
+  },
+  created() {},
+  methods: {
+    toLogin(formName) {
+      this.$refs[formName].validate(async (valid) => {
+        if (valid) {
+          this.$emit('toLogin', { data: this.form, formName: formName });
+        } else {
+          console.log('error submit!!');
+          return false;
+        }
+      });
+    },
+    toRegister() {
+      this.$emit('toRegister');
+    },
+    toCode() {
+      this.$emit('toCode');
+    },
+  },
+  computed: {
+    ...mapState(['user']),
+  },
+  metaInfo() {
+    return { title: this.$route.meta.title };
+  },
+  watch: {
+    test: {
+      deep: true,
+      immediate: true,
+      handler(val) {},
+    },
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.main {
+  background-size: 100% 100%;
+  height: 100vh;
+  background-repeat: no-repeat;
+  overflow: hidden;
+
+  .info {
+    width: 300px;
+    border-radius: 5px;
+    background: #fff;
+    font-size: 14px;
+    margin: 20% 0 0 70%;
+    .info_1 {
+      border-bottom: 1px solid #e8eaec;
+      padding: 14px 16px;
+      line-height: 1;
+    }
+    .info_2 {
+      padding: 16px;
+      .btn {
+        margin: 5% 0 0 0;
+        text-align: center;
+        button {
+          width: 100%;
+        }
+      }
+      .info_3 {
+        font-size: 10px;
+        text-align: center;
+        color: #c3c3c3;
+        margin: 16px 0 0 0;
+      }
+    }
+  }
+}
+.el-input-group__append button.el-button,
+.el-input-group__append div.el-select .el-input__inner,
+.el-input-group__append div.el-select:hover .el-input__inner,
+.el-input-group__prepend button.el-button,
+.el-input-group__prepend div.el-select .el-input__inner,
+.el-input-group__prepend div.el-select:hover .el-input__inner {
+  border-color: transparent;
+  background-color: transparent;
+  color: inherit;
+  border-top: 0;
+  border-bottom: 0;
+  width: 15px;
+  padding: 0 13px;
+}
+</style>

src/components/login/login-4.vue

@@ -0,0 +1,139 @@
+<template>
+  <div id="login-2">
+    <el-row>
+      <el-col :span="24" class="main" :style="{ 'background-image': `url('${backimage}')` }">
+        <div class="w_1200">
+          <el-col :span="24" class="info">
+            <el-col :span="24" class="info_1">
+              <h2>{{ name }}</h2>
+            </el-col>
+            <el-col :span="24" class="info_2">
+              <el-form :model="form" :rules="rules" ref="form">
+                <el-form-item prop="account">
+                  <el-input placeholder="请输入账号" v-model="form.account"> </el-input>
+                </el-form-item>
+                <el-form-item prop="password">
+                  <el-input placeholder="密码" v-model="form.password" type="password"> </el-input>
+                </el-form-item>
+                <el-col :span="24">
+                  <el-switch v-model="value" active-text="记住密码" active-color="#555" inactive-color="#ccc"> </el-switch>
+                </el-col>
+                <el-col :span="24" class="btn">
+                  <el-form-item class="btn">
+                    <el-button type="primary" @click="toLogin('form')">登录</el-button>
+                  </el-form-item>
+                </el-col>
+              </el-form>
+            </el-col>
+            <el-col :span="24" class="info_3">立即注册 </el-col>
+          </el-col>
+        </div>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import { mapState, createNamespacedHelpers } from 'vuex';
+export default {
+  name: 'login-2',
+  props: {},
+  components: {},
+  data: function () {
+    return {
+      name: '长春市福瑞科技有限公司',
+      // 背景图片
+      backimage: require('@/assets/login/login_4_1.png'),
+      form: {},
+      rules: {
+        account: [{ required: true, message: '账号不能为空', trigger: 'blur' }],
+        password: [{ required: true, message: '密码不能为空', trigger: 'blur' }],
+        code: [{ required: true, message: '验证码不能为空', trigger: 'blur' }],
+      },
+      value: true,
+    };
+  },
+  created() {},
+  methods: {
+    toLogin(formName) {
+      this.$refs[formName].validate(async (valid) => {
+        if (valid) {
+          this.$emit('toLogin', { data: this.form, formName: formName });
+        } else {
+          console.log('error submit!!');
+          return false;
+        }
+      });
+    },
+    toRegister() {
+      this.$emit('toRegister');
+    },
+    toCode() {
+      this.$emit('toCode');
+    },
+  },
+  computed: {
+    ...mapState(['user']),
+  },
+  metaInfo() {
+    return { title: this.$route.meta.title };
+  },
+  watch: {
+    test: {
+      deep: true,
+      immediate: true,
+      handler(val) {},
+    },
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.main {
+  background-size: 100% 100%;
+  height: 100vh;
+  background-repeat: no-repeat;
+  overflow: hidden;
+
+  .info {
+    flex: 0 0 auto;
+    width: 33.333333%;
+    border-radius: 5px;
+    font-size: 14px;
+    margin: 15% 30%;
+    background: #fff;
+    padding: 16px;
+    .info_1 {
+      border-radius: 5px;
+      background: #e32f6e;
+      margin: -20% 0 8% 0;
+      padding: 16px;
+      color: #fff;
+      text-align: center;
+    }
+    .info_2 {
+      .btn {
+        margin: 5% 0 0 0;
+        text-align: center;
+        button {
+          width: 100%;
+          background: #e32f6e;
+          border: #e32f6e;
+        }
+      }
+    }
+    .info_3 {
+      margin: 20px 0 10px 0;
+      color: #e32f6e;
+      font-size: 14px;
+      text-align: center;
+    }
+  }
+}
+/deep/.el-switch__label {
+  color: #7b809a;
+}
+/deep/.el-switch__label.is-active {
+  color: #7b809a;
+}
+</style>

src/components/login/parts/form-1.vue

@@ -0,0 +1,122 @@
+<template>
+  <div id="form-1">
+    <el-row>
+      <el-col :span="24" class="main">
+        <el-col :span="24" class="form">
+          <el-form :model="form" :rules="rules" ref="form">
+            <el-form-item prop="account">
+              <el-input placeholder="账号" v-model="form.account" prefix-icon="el-icon-user"> </el-input>
+            </el-form-item>
+            <el-form-item prop="password">
+              <el-input placeholder="密码" v-model="form.password" type="password" prefix-icon="el-icon-lock"> </el-input>
+            </el-form-item>
+            <el-col :span="24" class="codes">
+              <el-col :span="17">
+                <el-form-item prop="code">
+                  <el-input placeholder="验证码" v-model="form.code" prefix-icon="el-icon-mobile"> </el-input>
+                </el-form-item>
+              </el-col>
+              <el-col :span="6" class="code">
+                <el-image :src="code" class="image"></el-image>
+              </el-col>
+            </el-col>
+            <el-col :span="24" class="info">
+              <el-col :span="12"> <el-checkbox v-model="checked">自动登录</el-checkbox></el-col>
+              <el-col :span="12" class="text">
+                <span>立即注册</span>
+                <span>忘记密码</span>
+              </el-col>
+            </el-col>
+            <el-col :span="24" class="btn">
+              <el-form-item class="btn">
+                <el-button type="primary" @click="toLogin('form')">登录</el-button>
+              </el-form-item>
+            </el-col>
+          </el-form>
+        </el-col>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import { mapState, createNamespacedHelpers } from 'vuex';
+export default {
+  name: 'form-1',
+  props: {},
+  components: {},
+  data: function () {
+    return {
+      // 验证码
+      code: require('@/assets/login/login_1_3.png'),
+      form: {},
+      rules: {
+        account: [{ required: true, message: '账号不能为空', trigger: 'blur' }],
+        password: [{ required: true, message: '密码不能为空', trigger: 'blur' }],
+        code: [{ required: true, message: '验证码不能为空', trigger: 'blur' }],
+      },
+      checked: true,
+    };
+  },
+  created() {},
+  methods: {
+    toLogin(formName) {
+      this.$refs[formName].validate(async (valid) => {
+        if (valid) {
+          this.$emit('toLogin', { data: this.form, formName: formName });
+        } else {
+          console.log('error submit!!');
+          return false;
+        }
+      });
+    },
+    toRegister() {
+      this.$emit('toRegister');
+    },
+  },
+  computed: {
+    ...mapState(['user']),
+  },
+  metaInfo() {
+    return { title: this.$route.meta.title };
+  },
+  watch: {
+    test: {
+      deep: true,
+      immediate: true,
+      handler(val) {},
+    },
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.form {
+  .codes {
+    margin: 0 0 10px 0;
+    .code {
+      height: 40px;
+      background: rgba(55, 55, 55, 0.5);
+      margin: 0 0 0 3%;
+      .image {
+        height: 40px;
+      }
+    }
+  }
+  .text {
+    text-align: right;
+    font-size: 14px;
+    color: rgb(0, 136, 255);
+    span:nth-child(1) {
+      margin: 0 8px 0 0;
+    }
+  }
+  .btn {
+    margin: 5% 0 0 0;
+    text-align: center;
+    button {
+      width: 100%;
+    }
+  }
+}
+</style>

src/components/login/parts/form-2.vue

@@ -0,0 +1,118 @@
+<template>
+  <div id="form-1">
+    <el-row>
+      <el-col :span="24" class="main">
+        <el-col :span="24" class="form">
+          <el-form :model="form" :rules="rules" ref="form">
+            <el-form-item prop="phone">
+              <el-input placeholder="手机号" v-model="form.phone" prefix-icon="el-icon-mobile"> </el-input>
+            </el-form-item>
+            <el-col :span="24" class="codes">
+              <el-col :span="16">
+                <el-form-item prop="code">
+                  <el-input placeholder="验证码" v-model="form.code" prefix-icon="el-icon-message"> </el-input>
+                </el-form-item>
+              </el-col>
+              <el-col :span="6" class="code">
+                <el-button @click="toCode()">获取验证码</el-button>
+              </el-col>
+            </el-col>
+            <el-col :span="24" class="info">
+              <el-col :span="12"> <el-checkbox v-model="checked">自动登录</el-checkbox></el-col>
+              <el-col :span="12" class="text">
+                <span>立即注册</span>
+                <span>忘记密码</span>
+              </el-col>
+            </el-col>
+            <el-col :span="24" class="btn">
+              <el-form-item class="btn">
+                <el-button type="primary" @click="toLogin('form')">登录</el-button>
+              </el-form-item>
+            </el-col>
+          </el-form>
+        </el-col>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import { mapState, createNamespacedHelpers } from 'vuex';
+export default {
+  name: 'form-1',
+  props: {},
+  components: {},
+  data: function () {
+    return {
+      form: {},
+      rules: {
+        phone: [{ required: true, message: '手机号不能为空', trigger: 'blur' }],
+        code: [{ required: true, message: '验证码不能为空', trigger: 'blur' }],
+      },
+      checked: true,
+    };
+  },
+  created() {},
+  methods: {
+    toLogin(formName) {
+      this.$refs[formName].validate(async (valid) => {
+        if (valid) {
+          this.$emit('toLogin', { data: this.form, formName: formName });
+        } else {
+          console.log('error submit!!');
+          return false;
+        }
+      });
+    },
+    toCode() {
+      this.$emit('toCode');
+    },
+  },
+  computed: {
+    ...mapState(['user']),
+  },
+  metaInfo() {
+    return { title: this.$route.meta.title };
+  },
+  watch: {
+    test: {
+      deep: true,
+      immediate: true,
+      handler(val) {},
+    },
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.form {
+  .codes {
+    margin: 0 0 10px 0;
+    .code {
+      height: 40px;
+      width: 80px;
+      margin: 0 0 0 20px;
+      button {
+        width: 100px;
+        height: 40px;
+        text-align: center;
+      }
+    }
+  }
+  .text {
+    text-align: right;
+    font-size: 14px;
+    color: rgb(0, 136, 255);
+    span:nth-child(1) {
+      margin: 0 8px 0 0;
+    }
+  }
+  .btn {
+    margin: 5% 0 0 0;
+    text-align: center;
+    button {
+      width: 100%;
+    }
+  }
+}
+</style>

src/main.js

@@ -1,12 +1,17 @@
-import Vue from "vue";
-import App from "./App.vue";
-import router from "./router";
-import store from "./store";
-
+import Vue from 'vue';
+import App from './App.vue';
+import router from './router';
+import store from './store';
+import '@/plugins/axios';
+import '@/plugins/check-res';
+import '@/plugins/components';
+import '@/plugins/element.js';
+import '@/plugins/filters';
+import '@/plugins/loading';
+import '@/plugins/meta';
+import '@/plugins/var';
+import '@/plugins/methods';
+import 'animate.css';
 Vue.config.productionTip = false;
-
-new Vue({
-  router,
-  store,
-  render: (h) => h(App),
-}).$mount("#app");
+new Vue({ router, store, render: (h) => h(App) }).$mount('#app');
+window.vm = new Vue({ router });

src/plugins/axios.js

@@ -0,0 +1,19 @@
+import Vue from 'vue';
+import AxiosWrapper from '@/util/axios-wrapper';
+
+const Plugin = {
+  install(vue, options) {
+    // 3. 注入组件
+    vue.mixin({
+      created() {
+        if (this.$store && !this.$store.$axios) {
+          this.$store.$axios = this.$axios;
+        }
+      },
+    });
+    // 4. 添加实例方法
+    vue.prototype.$axios = new AxiosWrapper(options);
+  },
+};
+
+Vue.use(Plugin, { baseUrl: '' });

src/plugins/check-res.js

@@ -0,0 +1,34 @@
+import Vue from 'vue';
+import _ from 'lodash';
+import { Message } from 'element-ui';
+
+const vm = new Vue({});
+const Plugin = {
+  install(Vue, options) {
+    // 4. 添加实例方法
+    Vue.prototype.$checkRes = async (res, okText, errText) => {
+      let _okText = okText;
+      let _errText = errText;
+      if (!_.isFunction(okText) && _.isObject(okText) && okText != null) {
+        ({ okText: _okText, errText: _errText } = okText);
+      }
+      const { errcode = 0, errmsg } = res || {};
+      if (errcode === 0) {
+        if (_.isFunction(_okText)) {
+          return _okText();
+        }
+        if (_okText) {
+          Message.success(_okText);
+        }
+        return true;
+      }
+      if (_.isFunction(_errText)) {
+        return _errText();
+      }
+      Message.error(_errText || errmsg);
+      return false;
+    };
+  },
+};
+
+Vue.use(Plugin);

src/plugins/components.js

@@ -0,0 +1,5 @@
+import Vue from 'vue';
+
+const Plugin = (vue) => {};
+
+Vue.use(Plugin);

src/plugins/element.js

@@ -0,0 +1,5 @@
+import Vue from 'vue';
+import Element from 'element-ui';
+import 'element-ui/lib/theme-chalk/index.css';
+
+Vue.use(Element);

src/plugins/filters.js

@@ -0,0 +1,6 @@
+import Vue from 'vue';
+import filters from '@/util/filters';
+
+for (const method in filters) {
+  Vue.filter(method, filters[method]);
+}

src/plugins/loading.js

@@ -0,0 +1,18 @@
+import Vue from 'vue';
+
+const Plugin = {
+  install(vue, options) {
+    // 3. 注入组件
+    vue.mixin({
+      created() {
+        const isRoot = this.constructor === Vue;
+        if (isRoot) {
+          const el = document.getElementById('loading');
+          if (el) el.style.display = 'none';
+        }
+      },
+    });
+  },
+};
+
+Vue.use(Plugin, { baseUrl: 'test' });

src/plugins/meta.js

@@ -0,0 +1,4 @@
+import Vue from 'vue';
+import Meta from 'vue-meta';
+
+Vue.use(Meta);

src/plugins/methods.js

@@ -0,0 +1,16 @@
+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;
+        }
+      },
+    });
+  },
+};
+
+Vue.use(Plugin);

src/plugins/var.js

@@ -0,0 +1,24 @@
+import Vue from 'vue';
+import _ from 'lodash';
+
+const getSiteId = () => {
+  let host = `${window.location.hostname}`;
+  let schId;
+  host = host.replace('http://', '');
+  let arr = host.split('.');
+  if (arr.length > 0) {
+    schId = arr[0];
+    if (schId === 'smart') schId = 'master';
+    else `${schId}`.includes('localhost') || `${schId}`.includes('127.0.0.1') ? (schId = '99991') : '';
+  }
+  return schId;
+};
+const Plugin = {
+  install(vue, options) {
+    // 4. 添加实例方法
+    vue.prototype.$limit = 10;
+    vue.prototype.$site = getSiteId();
+  },
+};
+
+Vue.use(Plugin);

src/router/index.js

@@ -1,30 +1,34 @@
-import Vue from "vue";
-import VueRouter from "vue-router";
-import Home from "../views/Home.vue";
-
+import Vue from 'vue';
+import VueRouter from 'vue-router';
+import store from '@/store/index';
+// 公共
+import common from './module/common';
+const jwt = require('jsonwebtoken');
 Vue.use(VueRouter);
-
-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 web = [
+  // {
+  //   path: '/',
+  //   meta: { title: '网站首页' },
+  //   component: () => import('../views/homeIndex.vue'),
+  // },
+  // 公共
+  ...common,
 ];
-
-const router = new VueRouter({
-  mode: "history",
-  base: process.env.BASE_URL,
-  routes,
+const routes = [...web];
+const router = new VueRouter({ mode: 'history', base: process.env.BASE_URL, routes });
+router.beforeEach((to, from, next) => {
+  document.title = `${to.meta.title} `;
+  const token = sessionStorage.getItem('token');
+  if (token) {
+    let user = jwt.decode(token);
+    store.commit('setUser', user, { root: true });
+    next();
+  } else {
+    if (to.meta.is_filter) {
+      next('/login');
+    } else {
+      next();
+    }
+  }
 });
-
 export default router;

src/router/module/common.js

@@ -0,0 +1,38 @@
+export default [
+  {
+    path: '/',
+    redirect: '/homeIndex',
+  },
+  {
+    path: '/register',
+    meta: { title: '账号注册', is_filter: false },
+    component: () => import('@/views/register.vue'),
+  },
+  {
+    path: '/login',
+    meta: { title: '账号登录', is_filter: false },
+    component: () => import('@/views/login.vue'),
+  },
+  {
+    path: '/homeIndex',
+    meta: { title: '管理平台', is_filter: true },
+    component: () => import('@common/src/components/admin-frame/home.vue'),
+    children: [
+      {
+        path: '/homeIndex',
+        meta: { title: '管理平台', is_filter: true },
+        component: () => import('@/views/home/index.vue'),
+      },
+      {
+        path: '/test/test1',
+        meta: { title: '二级菜单', is_filter: true },
+        component: () => import('@/views/test/test1/index.vue'),
+      },
+      {
+        path: '/test/test2/test1',
+        meta: { title: '三级菜单', is_filter: true },
+        component: () => import('@/views/test/test2/test1/index.vue'),
+      },
+    ],
+  },
+];

src/store/index.js

@@ -1,11 +1,13 @@
-import Vue from "vue";
-import Vuex from "vuex";
-
+import Vue from 'vue';
+import Vuex from 'vuex';
+import * as ustate from '@common/src/store/user/state';
+import * as umutations from '@common/src/store/user/mutations';
 Vue.use(Vuex);
 
 export default new Vuex.Store({
-  state: {},
-  mutations: {},
+  state: { ...ustate },
+  getters: {},
+  mutations: { ...umutations },
   actions: {},
   modules: {},
 });

src/util/axios-wrapper.js

@@ -0,0 +1,110 @@
+import _ from 'lodash';
+import Axios from 'axios';
+import { Util, Error } from 'naf-core';
+import util from './user-util';
+
+const { trimData, isNullOrUndefined } = Util;
+const { ErrorCode } = Error;
+
+let currentRequests = 0;
+
+export default class AxiosWrapper {
+  constructor({ baseUrl = '', unwrap = true } = {}) {
+    this.baseUrl = baseUrl;
+    this.unwrap = unwrap;
+  }
+
+  // 替换uri中的参数变量
+  static merge(uri, query = {}) {
+    if (!uri.includes(':')) {
+      return uri;
+    }
+    const keys = [];
+    const regexp = /\/:([a-z0-9_]+)/gi;
+    let res;
+    // eslint-disable-next-line no-cond-assign
+    while ((res = regexp.exec(uri)) != null) {
+      keys.push(res[1]);
+    }
+    keys.forEach((key) => {
+      if (!isNullOrUndefined(query[key])) {
+        uri = uri.replace(`:${key}`, query[key]);
+      }
+    });
+    return uri;
+  }
+
+  $get(uri, query, options) {
+    return this.$request(uri, null, query, options);
+  }
+
+  $post(uri, data = {}, query, options) {
+    return this.$request(uri, data, query, options);
+  }
+  $delete(uri, data = {}, router, query, options = {}) {
+    options = { ...options, method: 'delete' };
+    return this.$request(uri, data, query, options, router);
+  }
+  async $request(uri, data, query, options) {
+    // TODO: 合并query和options
+    if (_.isObject(query) && _.isObject(options)) {
+      options = { ...options, params: query, method: 'get' };
+    } else if (_.isObject(query) && !query.params) {
+      options = { params: query };
+    } else if (_.isObject(query) && query.params) {
+      options = query;
+    }
+    if (!options) options = {};
+    if (options.params) options.params = trimData(options.params);
+    const url = AxiosWrapper.merge(uri, options.params);
+    currentRequests += 1;
+
+    try {
+      const axios = Axios.create({
+        baseURL: this.baseUrl,
+      });
+      axios.defaults.headers.common.Authorization = util.token;
+      let res = await axios.request({
+        method: isNullOrUndefined(data) ? 'get' : 'post',
+        url,
+        data,
+        responseType: 'json',
+        ...options,
+      });
+      res = res.data;
+      const { errcode, errmsg, details } = res;
+      if (errcode) {
+        console.warn(`[${uri}] fail: ${errcode}-${errmsg} ${details}`);
+        return res;
+      }
+      // unwrap data
+      if (this.unwrap) {
+        res = _.omit(res, ['errmsg', 'details']);
+        const keys = Object.keys(res);
+        if (keys.length === 1 && keys.includes('data')) {
+          res = res.data;
+        }
+      }
+      return res;
+    } catch (err) {
+      let errmsg = '接口请求失败，请稍后重试';
+      if (err.response) {
+        const { status } = err.response;
+        if (status === 401) errmsg = '用户认证失败，请重新登录';
+        if (status === 403) errmsg = '当前用户不允许执行该操作';
+      }
+      console.error(
+        `[AxiosWrapper] 接口请求失败: ${err.config && err.config.url} - 
+        ${err.message}`
+      );
+      return { errcode: ErrorCode.SERVICE_FAULT, errmsg, details: err.message };
+    } finally {
+      /* eslint-disable */
+      currentRequests -= 1;
+      if (currentRequests <= 0) {
+        currentRequests = 0;
+        // Indicator.close();
+      }
+    }
+  }
+}

src/util/filters.js

@@ -0,0 +1,10 @@
+import _ from 'lodash';
+
+const filters = {
+  getName(object) {
+    const { data, searchItem } = object;
+    return _.get(data, searchItem) === undefined ? '' : _.get(data, searchItem);
+  },
+};
+
+export default filters;

src/util/methods-util.js

@@ -0,0 +1,50 @@
+import { Util } from 'naf-core';
+
+const { isNullOrUndefined } = Util;
+
+export default {
+  //判断信息是否过期
+  isDateOff(dataDate) {
+    const now = new Date(new Date().getTime() - 24 * 60 * 60 * 1000);
+    dataDate = new Date(dataDate);
+    return now.getTime() <= dataDate.getTime();
+  },
+  //判断企业是否可以执行此动作/显示
+  checkCorp(data) {
+    const { role, unit, selfUnit, status, displayType, userid } = data;
+    if (!isNullOrUndefined(selfUnit) && !isNullOrUndefined(status)) {
+      return role === 'corp' && selfUnit === unit && status === '0';
+    } else if (!isNullOrUndefined(displayType)) {
+      if (role === 'corp') {
+        return role === displayType;
+      } else {
+        return role === displayType && !isNullOrUndefined(userid);
+      }
+    }
+  },
+  //获取url的参数params
+  getParams() {
+    let str = location.href;
+    let num = str.indexOf('?');
+    const param = {};
+    str = str.substr(num + 1);
+    let num2 = str.indexOf('#');
+    let str2 = '';
+    if (num2 > 0) {
+      str2 = str.substr(0, num2);
+    } else {
+      num2 = str.indexOf('/');
+      str2 = str.substr(0, num2);
+    }
+    const arr = str2.split('&');
+    for (let i = 0; i < arr.length; i++) {
+      num = arr[i].indexOf('=');
+      if (num > 0) {
+        const name = arr[i].substring(0, num);
+        const value = arr[i].substr(num + 1);
+        param[name] = decodeURI(value);
+      }
+    }
+    return param;
+  },
+};

src/views/About.vue

@@ -1,5 +0,0 @@
-<template>
-  <div class="about">
-    <h1>This is an about page</h1>
-  </div>
-</template>

src/views/Home.vue

@@ -1,18 +0,0 @@
-<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>

src/views/home/index.vue

@@ -0,0 +1,36 @@
+<template>
+  <div id="index">
+    <el-row>
+      <el-col :span="24" class="main animate__animated animate__backInRight"> test </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import { mapState, createNamespacedHelpers } from 'vuex';
+export default {
+  name: 'index',
+  props: {},
+  components: {},
+  data: function () {
+    return {};
+  },
+  created() {},
+  methods: {},
+  computed: {
+    ...mapState(['user']),
+  },
+  metaInfo() {
+    return { title: this.$route.meta.title };
+  },
+  watch: {
+    test: {
+      deep: true,
+      immediate: true,
+      handler(val) {},
+    },
+  },
+};
+</script>
+
+<style lang="less" scoped></style>

src/views/login.vue

@@ -0,0 +1,56 @@
+<template>
+  <div id="login">
+    <el-row>
+      <el-col :span="24" class="main animate__animated animate__backInRight">
+        <!-- <login-1 @toLogin="toLogin" @toRegister="toRegister"></login-1> -->
+        <!-- <login-2 @toLogin="toLogin" @toRegister="toRegister"></login-2> -->
+        <!-- <login-3 @toLogin="toLogin" @toRegister="toRegister"></login-3> -->
+        <login-4 @toLogin="toLogin" @toRegister="toRegister"></login-4>
+        <el-button type="primary" size="small" @click="toLogin()">登录登录</el-button>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import { mapState, createNamespacedHelpers } from 'vuex';
+export default {
+  name: 'login',
+  props: {},
+  components: {
+    // login1: () => import('@/components/login/login-1.vue'),
+    // login2: () => import('@/components/login/login-2.vue'),
+    // login3: () => import('@/components/login/login-3.vue'),
+    login4: () => import('@/components/login/login-4.vue'),
+  },
+  data: function () {
+    return {};
+  },
+  created() {},
+  methods: {
+    toLogin(data) {
+      let token = 'test_token';
+      sessionStorage.setItem('token', token);
+      this.$router.push('/homeIndex');
+    },
+    toRegister() {
+      this.$router.push({ path: '/register' });
+    },
+  },
+  computed: {
+    ...mapState(['user']),
+  },
+  metaInfo() {
+    return { title: this.$route.meta.title };
+  },
+  watch: {
+    test: {
+      deep: true,
+      immediate: true,
+      handler(val) {},
+    },
+  },
+};
+</script>
+
+<style lang="less" scoped></style>

src/views/register.vue

@@ -0,0 +1,36 @@
+<template>
+  <div id="register">
+    <el-row>
+      <el-col :span="24" class="main animate__animated animate__backInRight"> 账号注册 </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import { mapState, createNamespacedHelpers } from 'vuex';
+export default {
+  name: 'register',
+  props: {},
+  components: {},
+  data: function () {
+    return {};
+  },
+  created() {},
+  methods: {},
+  computed: {
+    ...mapState(['user']),
+  },
+  metaInfo() {
+    return { title: this.$route.meta.title };
+  },
+  watch: {
+    test: {
+      deep: true,
+      immediate: true,
+      handler(val) {},
+    },
+  },
+};
+</script>
+
+<style lang="less" scoped></style>

src/views/test/test1/index.vue

@@ -0,0 +1,36 @@
+<template>
+  <div id="index">
+    <el-row>
+      <el-col :span="24" class="main animate__animated animate__backInRight"> 二级菜单 </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import { mapState, createNamespacedHelpers } from 'vuex';
+export default {
+  name: 'index',
+  props: {},
+  components: {},
+  data: function () {
+    return {};
+  },
+  created() {},
+  methods: {},
+  computed: {
+    ...mapState(['user']),
+  },
+  metaInfo() {
+    return { title: this.$route.meta.title };
+  },
+  watch: {
+    test: {
+      deep: true,
+      immediate: true,
+      handler(val) {},
+    },
+  },
+};
+</script>
+
+<style lang="less" scoped></style>

src/views/test/test2/test1/index.vue

@@ -0,0 +1,36 @@
+<template>
+  <div id="index">
+    <el-row>
+      <el-col :span="24" class="main animate__animated animate__backInRight"> 三级第一个 </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import { mapState, createNamespacedHelpers } from 'vuex';
+export default {
+  name: 'index',
+  props: {},
+  components: {},
+  data: function () {
+    return {};
+  },
+  created() {},
+  methods: {},
+  computed: {
+    ...mapState(['user']),
+  },
+  metaInfo() {
+    return { title: this.$route.meta.title };
+  },
+  watch: {
+    test: {
+      deep: true,
+      immediate: true,
+      handler(val) {},
+    },
+  },
+};
+</script>
+
+<style lang="less" scoped></style>

vue.config.js

@@ -0,0 +1,32 @@
+const path = require('path');
+const common = path.resolve(__dirname, '../common');
+module.exports = {
+  publicPath: `/${process.env.VUE_APP_ROUTER}`,
+  outputDir: `${process.env.VUE_APP_ROUTER}`,
+  productionSourceMap: false,
+  configureWebpack: (config) => {
+    Object.assign(config, {
+      resolve: {
+        alias: {
+          '@': path.resolve(__dirname, './src'),
+          '@c': path.resolve(__dirname, './src/components'),
+          '@a': path.resolve(__dirname, './src/assets'),
+          '@common': common,
+        },
+      },
+    });
+  },
+  devServer: {
+    port: '8001',
+    proxy: {
+      '/files': {
+        target: 'http://broadcast.waityou24.cn',
+      },
+      '/projectadmin/api': {
+        target: 'http://192.168.1.144:10101', //http://192.168.1.144:16001
+        changeOrigin: true,
+        ws: false,
+      },
+    },
+  },
+};