3 years ago · a75b6f9eab
--- a/.browserslistrc
+++ b/.browserslistrc
@@ -0,0 +1,4 @@
 
																+> 1%
															
 
																+last 2 versions
															
 
																+not dead
															
 
																+not ie 11
															
--- 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,5 @@
 
																+# just a flag
															
 
																+ENV = 'development'
															
 
																+
															
 
																+# base api
															
 
																+VUE_APP_BASE_API = '/reporting'
															
--- a/.env.production
+++ b/.env.production
@@ -0,0 +1,5 @@
 
																+# just a flag
															
 
																+ENV = 'production'
															
 
																+
															
 
																+# base api
															
 
																+VUE_APP_BASE_API = '/prod-api'
															
--- a/.eslintrc.js
+++ b/.eslintrc.js
@@ -0,0 +1,16 @@
 
																+module.exports = {
															
 
																+  root: true,
															
 
																+  env: {
															
 
																+    node: true
															
 
																+  },
															
 
																+  extends: ['plugin:vue/vue3-essential', '@vue/standard'],
															
 
																+  parserOptions: {
															
 
																+    parser: '@babel/eslint-parser'
															
 
																+  },
															
 
																+  rules: {
															
 
																+    'no-console': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
															
 
																+    'no-debugger': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
															
 
																+    'space-before-function-paren': 0,
															
 
																+    'vue/multi-word-component-names': '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/.prettierrc
+++ b/.prettierrc
@@ -0,0 +1,5 @@
 
																+{
															
 
																+  "semi": false,
															
 
																+  "singleQuote": true,
															
 
																+  "trailingComma": "none"
															
 
																+}
															
--- a/babel.config.js
+++ b/babel.config.js
@@ -0,0 +1,5 @@
 
																+module.exports = {
															
 
																+  presets: [
															
 
																+    '@vue/cli-plugin-babel/preset'
															
 
																+  ]
															
 
																+}
															
--- a/jsconfig.json
+++ b/jsconfig.json
@@ -0,0 +1,19 @@
 
																+{
															
 
																+  "compilerOptions": {
															
 
																+    "target": "es5",
															
 
																+    "module": "esnext",
															
 
																+    "baseUrl": "./",
															
 
																+    "moduleResolution": "node",
															
 
																+    "paths": {
															
 
																+      "@/*": [
															
 
																+        "src/*"
															
 
																+      ]
															
 
																+    },
															
 
																+    "lib": [
															
 
																+      "esnext",
															
 
																+      "dom",
															
 
																+      "dom.iterable",
															
 
																+      "scripthost"
															
 
																+    ]
															
 
																+  }
															
 
																+}
															
--- a/lint-staged.config.js
+++ b/lint-staged.config.js
@@ -0,0 +1,3 @@
 
																+module.exports = {
															
 
																+  '*.{js,jsx,vue}': 'vue-cli-service lint'
															
 
																+}
															
--- a/package-lock.json
+++ b/package-lock.json
--- a/package.json
+++ b/package.json
@@ -0,0 +1,44 @@
 
																+{
															
 
																+  "name": "test_admin",
															
 
																+  "version": "0.1.0",
															
 
																+  "private": true,
															
 
																+  "scripts": {
															
 
																+    "dev": "vue-cli-service serve",
															
 
																+    "build": "vue-cli-service build",
															
 
																+    "lint": "vue-cli-service lint"
															
 
																+  },
															
 
																+  "dependencies": {
															
 
																+    "@element-plus/icons-vue": "^2.0.10",
															
 
																+    "axios": "^1.3.4",
															
 
																+    "core-js": "^3.8.3",
															
 
																+    "css-color-function": "^1.3.3",
															
 
																+    "element-plus": "^2.2.32",
															
 
																+    "fuse.js": "^6.6.2",
															
 
																+    "jsencrypt": "^3.3.1",
															
 
																+    "node-polyfill-webpack-plugin": "^2.0.1",
															
 
																+    "vue": "^3.2.13",
															
 
																+    "vue-router": "^4.0.3",
															
 
																+    "vuex": "^4.0.0"
															
 
																+  },
															
 
																+  "devDependencies": {
															
 
																+    "@babel/core": "^7.12.16",
															
 
																+    "@babel/eslint-parser": "^7.12.16",
															
 
																+    "@vue/cli-plugin-babel": "~5.0.0",
															
 
																+    "@vue/cli-plugin-eslint": "~5.0.0",
															
 
																+    "@vue/cli-plugin-router": "~5.0.0",
															
 
																+    "@vue/cli-plugin-vuex": "~5.0.0",
															
 
																+    "@vue/cli-service": "~5.0.0",
															
 
																+    "@vue/eslint-config-standard": "^6.1.0",
															
 
																+    "eslint": "^7.32.0",
															
 
																+    "eslint-plugin-import": "^2.25.3",
															
 
																+    "eslint-plugin-node": "^11.1.0",
															
 
																+    "eslint-plugin-promise": "^5.1.0",
															
 
																+    "eslint-plugin-vue": "^8.0.3",
															
 
																+    "lint-staged": "^11.1.2",
															
 
																+    "sass": "^1.32.7",
															
 
																+    "sass-loader": "^12.0.0"
															
 
																+  },
															
 
																+  "gitHooks": {
															
 
																+    "pre-commit": "lint-staged"
															
 
																+  }
															
 
																+}
															
--- 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>代理商登记管理系统</title>
															
 
																+  </head>
															
 
																+  <body>
															
 
																+    <noscript>
															
 
																+      <strong>We're sorry but Agent registration management system 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,7 @@
 
																+<template>
															
 
																+  <router-view />
															
 
																+</template>
															
 
																+
															
 
																+<script setup></script>
															
 
																+
															
 
																+<style lang="scss"></style>
															
--- a/src/api/project.js
+++ b/src/api/project.js
@@ -0,0 +1,19 @@
 
																+import request from '@/utils/request'
															
 
																+
															
 
																+// 获取项目管理列表
															
 
																+export const getProjectList = (params) => {
															
 
																+  return request({
															
 
																+    url: '/informationReporting/list',
															
 
																+    method: 'get',
															
 
																+    params
															
 
																+  })
															
 
																+}
															
 
																+
															
 
																+// 删除项目管理列表
															
 
																+export const deleteProjectList = (data) => {
															
 
																+  return request({
															
 
																+    url: '/informationReporting/delete',
															
 
																+    method: 'delete',
															
 
																+    data
															
 
																+  })
															
 
																+}
															
--- a/src/api/sys.js
+++ b/src/api/sys.js
@@ -0,0 +1,10 @@
 
																+import request from '@/utils/request'
															
 
																+
															
 
																+// 登录接口
															
 
																+export const login = (data) => {
															
 
																+  return request({
															
 
																+    url: '/user/login',
															
 
																+    method: 'post',
															
 
																+    data
															
 
																+  })
															
 
																+}
															
--- a/src/api/user.js
+++ b/src/api/user.js
@@ -0,0 +1,46 @@
 
																+import request from '@/utils/request'
															
 
																+
															
 
																+// 获取账号管理列表
															
 
																+export const getUserList = (params) => {
															
 
																+  return request({
															
 
																+    url: '/user/list',
															
 
																+    method: 'get',
															
 
																+    params
															
 
																+  })
															
 
																+}
															
 
																+
															
 
																+// 新增账号
															
 
																+export const addUserList = (data) => {
															
 
																+  return request({
															
 
																+    url: '/user/add',
															
 
																+    method: 'post',
															
 
																+    data
															
 
																+  })
															
 
																+}
															
 
																+
															
 
																+// 编辑账号
															
 
																+export const editUserList = (data) => {
															
 
																+  return request({
															
 
																+    url: '/user/update',
															
 
																+    method: 'put',
															
 
																+    data
															
 
																+  })
															
 
																+}
															
 
																+
															
 
																+// 修改当前用户密码
															
 
																+export const editPassword = (data) => {
															
 
																+  return request({
															
 
																+    url: '/user/updatePassword',
															
 
																+    method: 'put',
															
 
																+    data
															
 
																+  })
															
 
																+}
															
 
																+
															
 
																+// 删除管理员
															
 
																+export const deleteUserList = (data) => {
															
 
																+  return request({
															
 
																+    url: '/user/delete',
															
 
																+    method: 'delete',
															
 
																+    data
															
 
																+  })
															
 
																+}
															
--- a/src/assets/clothes.svg
+++ b/src/assets/clothes.svg
--- a/src/assets/language.svg
+++ b/src/assets/language.svg
--- a/src/assets/login-bg.png
+++ b/src/assets/login-bg.png
--- a/src/assets/login-group.png
+++ b/src/assets/login-group.png
--- a/src/assets/login-office.png
+++ b/src/assets/login-office.png
--- a/src/assets/login-people.png
+++ b/src/assets/login-people.png
--- a/src/assets/logo.png
+++ b/src/assets/logo.png
--- a/src/assets/sidebar-logo.png
+++ b/src/assets/sidebar-logo.png
--- a/src/constant/index.js
+++ b/src/constant/index.js
@@ -0,0 +1,20 @@
 
																+// token
															
 
																+export const TOKEN = 'token'
															
 
																+
															
 
																+// // 用户姓名
															
 
																+// export const realName = 'realName'
															
 
																+
															
 
																+// // 用户权限
															
 
																+// export const AdminType = 'adminType'
															
 
																+
															
 
																+// // 用户id
															
 
																+// export const AdminId = 'adminType'
															
 
																+
															
 
																+// 用户信息
															
 
																+export const USERINFO = 'token'
															
 
																+
															
 
																+// token 时间戳
															
 
																+export const TIME_STAMP = 'timeStamp'
															
 
																+
															
 
																+// 超时时长(毫秒) 两小时
															
 
																+export const TOKEN_TIMEOUT_VALUE = 2 * 3600 * 1000
															
--- a/src/layout/components/AppMain.vue
+++ b/src/layout/components/AppMain.vue
@@ -0,0 +1,22 @@
 
																+<template>
															
 
																+  <div class="app-main">
															
 
																+    <router-view v-slot="{ Component }">
															
 
																+      <transition name="fade-transform" mode="out-in">
															
 
																+        <component :is="Component" />
															
 
																+      </transition>
															
 
																+    </router-view>
															
 
																+  </div>
															
 
																+</template>
															
 
																+
															
 
																+<script setup></script>
															
 
																+
															
 
																+<style lang="scss" scoped>
															
 
																+.app-main {
															
 
																+  min-height: calc(100vh - 50px - 43px);
															
 
																+  width: 100%;
															
 
																+  position: relative;
															
 
																+  overflow: hidden;
															
 
																+  padding: 104px 20px 20px 20px;
															
 
																+  box-sizing: border-box;
															
 
																+}
															
 
																+</style>
															
--- a/src/layout/components/Navbar.vue
+++ b/src/layout/components/Navbar.vue
@@ -0,0 +1,201 @@
 
																+<template>
															
 
																+  <div class="navbar">
															
 
																+    <!-- 左上角区域 -->
															
 
																+    <div class="navbar-title">代理商登记管理系统</div>
															
 
																+    <!-- 右上角区域 -->
															
 
																+    <div class="right-menu">
															
 
																+      <!-- 头像 -->
															
 
																+      <el-dropdown class="avatar-container" trigger="click">
															
 
																+        <div class="avatar-wrapper">
															
 
																+          <el-avatar>{{ $store.getters.userInfo.name }}</el-avatar>
															
 
																+          {{ $store.getters.userInfo.name }}
															
 
																+        </div>
															
 
																+        <template #dropdown>
															
 
																+          <el-dropdown-menu class="user-dropdown">
															
 
																+            <el-dropdown-item @click="handleEditPassword">
															
 
																+              <el-icon><Lock /></el-icon>
															
 
																+              修改密码
															
 
																+            </el-dropdown-item>
															
 
																+            <el-dropdown-item divided @click="logout">
															
 
																+              <el-icon><SwitchButton /></el-icon>
															
 
																+              退出登录
															
 
																+            </el-dropdown-item>
															
 
																+          </el-dropdown-menu>
															
 
																+        </template>
															
 
																+      </el-dropdown>
															
 
																+    </div>
															
 
																+
															
 
																+    <!-- 修改密码弹窗区域 -->
															
 
																+    <el-dialog
															
 
																+      v-model="dialogVisible"
															
 
																+      title="修改密码"
															
 
																+      width="25%"
															
 
																+      top="20vh"
															
 
																+      :close-on-click-modal="false"
															
 
																+    >
															
 
																+      <div class="dialog_box">
															
 
																+        <div class="dialog_item">
															
 
																+          <span>原密码:</span>
															
 
																+          <el-input
															
 
																+            type="password"
															
 
																+            :show-password="true"
															
 
																+            style="width: 180px"
															
 
																+            placeholder="请输入原密码"
															
 
																+            v-model="password"
															
 
																+          ></el-input>
															
 
																+        </div>
															
 
																+        <div class="dialog_item">
															
 
																+          <span>新密码:</span>
															
 
																+          <el-input
															
 
																+            type="password"
															
 
																+            :show-password="true"
															
 
																+            style="width: 180px"
															
 
																+            placeholder="请输入新密码"
															
 
																+            v-model="newPassword"
															
 
																+          ></el-input>
															
 
																+        </div>
															
 
																+        <div class="dialog_item">
															
 
																+          <span>确认密码:</span>
															
 
																+          <el-input
															
 
																+            type="password"
															
 
																+            :show-password="true"
															
 
																+            style="width: 180px"
															
 
																+            placeholder="请再次输入新密码"
															
 
																+            v-model="newPassword2"
															
 
																+          ></el-input>
															
 
																+        </div>
															
 
																+      </div>
															
 
																+
															
 
																+      <template #footer>
															
 
																+        <span class="dialog-footer">
															
 
																+          <el-button @click="dialogVisible = false">取消</el-button>
															
 
																+          <el-button type="primary" @click="handleEditPasswordConfirm">
															
 
																+            确定
															
 
																+          </el-button>
															
 
																+        </span>
															
 
																+      </template>
															
 
																+    </el-dialog>
															
 
																+  </div>
															
 
																+</template>
															
 
																+
															
 
																+<script setup>
															
 
																+import { ref } from 'vue'
															
 
																+import { useStore } from 'vuex'
															
 
																+import { ElMessage, ElMessageBox } from 'element-plus'
															
 
																+import { RSAencrypt } from '@/utils/jsencrypt'
															
 
																+import { editPassword } from '@/api/user'
															
 
																+
															
 
																+const dialogVisible = ref(false)
															
 
																+
															
 
																+const password = ref('')
															
 
																+const newPassword = ref('')
															
 
																+const newPassword2 = ref('')
															
 
																+
															
 
																+const store = useStore()
															
 
																+const logout = () => {
															
 
																+  store.dispatch('user/logout')
															
 
																+}
															
 
																+
															
 
																+const handleEditPassword = () => {
															
 
																+  dialogVisible.value = true
															
 
																+}
															
 
																+
															
 
																+const handleEditPasswordConfirm = () => {
															
 
																+  if (password.value === '') {
															
 
																+    ElMessage.error('请输入原密码')
															
 
																+    return
															
 
																+  }
															
 
																+  if (newPassword.value === '') {
															
 
																+    ElMessage.error('请输入新密码')
															
 
																+    return
															
 
																+  }
															
 
																+  if (newPassword2.value === '') {
															
 
																+    ElMessage.error('请再次输入新密码')
															
 
																+    return
															
 
																+  }
															
 
																+  if (newPassword.value !== newPassword2.value) {
															
 
																+    ElMessage.error('两次输入的密码不一致')
															
 
																+    return
															
 
																+  }
															
 
																+  ElMessageBox.confirm('确定修改密码吗？', '提示', {
															
 
																+    confirmButtonText: '确定',
															
 
																+    cancelButtonText: '取消',
															
 
																+    type: 'warning'
															
 
																+  })
															
 
																+    .then(async () => {
															
 
																+      const res = await editPassword({
															
 
																+        id: store.getters.userInfo.id,
															
 
																+        password: RSAencrypt(password.value),
															
 
																+        newPassword: RSAencrypt(newPassword.value)
															
 
																+      })
															
 
																+      console.log(res)
															
 
																+      if (res == null) {
															
 
																+        dialogVisible.value = false
															
 
																+        ElMessage.success('修改成功')
															
 
																+        store.dispatch('user/logout')
															
 
																+      }
															
 
																+    })
															
 
																+    .catch(() => {
															
 
																+      ElMessage.info('已取消')
															
 
																+    })
															
 
																+}
															
 
																+</script>
															
 
																+
															
 
																+<style lang="scss" scoped>
															
 
																+.navbar {
															
 
																+  height: 80px;
															
 
																+  overflow: hidden;
															
 
																+  position: relative;
															
 
																+  background: #fff;
															
 
																+  box-shadow: 0 1px 4px rgba(0, 21, 41, 0.08);
															
 
																+  .navbar-title {
															
 
																+    float: left;
															
 
																+    margin-left: 23px;
															
 
																+    line-height: 80px;
															
 
																+    font-size: 30px;
															
 
																+    font-weight: bold;
															
 
																+  }
															
 
																+
															
 
																+  .right-menu {
															
 
																+    float: right;
															
 
																+    padding-right: 46px;
															
 
																+
															
 
																+    :deep .avatar-container {
															
 
																+      line-height: 80px;
															
 
																+      cursor: pointer;
															
 
																+      .avatar-wrapper {
															
 
																+        position: relative;
															
 
																+        white-space: nowrap;
															
 
																+        text-overflow: ellipsis;
															
 
																+        overflow: hidden;
															
 
																+        .el-avatar {
															
 
																+          --el-avatar-background-color: none;
															
 
																+          margin-right: 12px;
															
 
																+        }
															
 
																+      }
															
 
																+    }
															
 
																+  }
															
 
																+
															
 
																+  .dialog_box {
															
 
																+    height: 150px;
															
 
																+    .dialog_item {
															
 
																+      height: 30px;
															
 
																+      margin-bottom: 20px;
															
 
																+      span {
															
 
																+        display: inline-block;
															
 
																+        width: 70px;
															
 
																+      }
															
 
																+    }
															
 
																+  }
															
 
																+}
															
 
																+
															
 
																+::v-deep .el-dialog__header {
															
 
																+  margin: 0;
															
 
																+  font-weight: bold;
															
 
																+  background-color: #edf1f5;
															
 
																+}
															
 
																+
															
 
																+::v-deep .el-button--primary {
															
 
																+  background-color: #0061ff;
															
 
																+}
															
 
																+</style>
															
--- a/src/layout/components/Sidebar/MenuItem.vue
+++ b/src/layout/components/Sidebar/MenuItem.vue
@@ -0,0 +1,22 @@
 
																+<template>
															
 
																+  <el-icon>
															
 
																+    <component class="fold-menu" :is="icon"></component>
															
 
																+  </el-icon>
															
 
																+  <span>{{ title }}</span>
															
 
																+</template>
															
 
																+
															
 
																+<script setup>
															
 
																+import { defineProps } from 'vue'
															
 
																+defineProps({
															
 
																+  title: {
															
 
																+    type: String,
															
 
																+    required: true
															
 
																+  },
															
 
																+  icon: {
															
 
																+    type: String,
															
 
																+    required: true
															
 
																+  }
															
 
																+})
															
 
																+</script>
															
 
																+
															
 
																+<style lang="scss" scoped></style>
															
--- a/src/layout/components/Sidebar/SidebarItem.vue
+++ b/src/layout/components/Sidebar/SidebarItem.vue
@@ -0,0 +1,33 @@
 
																+<template>
															
 
																+  <!-- 支持渲染多级 menu 菜单 -->
															
 
																+  <el-sub-menu v-if="route.children.length > 0" :index="route.path">
															
 
																+    <template #title>
															
 
																+      <menu-item :title="route.meta.title" :icon="route.meta.icon"></menu-item>
															
 
																+    </template>
															
 
																+    <!-- 循环渲染 -->
															
 
																+    <sidebar-item
															
 
																+      v-for="item in route.children"
															
 
																+      :key="item.path"
															
 
																+      :route="item"
															
 
																+    ></sidebar-item>
															
 
																+  </el-sub-menu>
															
 
																+  <!-- 渲染 item 项 -->
															
 
																+  <el-menu-item v-else :index="route.path">
															
 
																+    <menu-item :title="route.meta.title" :icon="route.meta.icon"></menu-item>
															
 
																+  </el-menu-item>
															
 
																+</template>
															
 
																+
															
 
																+<script setup>
															
 
																+import MenuItem from './MenuItem'
															
 
																+import { defineProps } from 'vue'
															
 
																+
															
 
																+// 定义 props
															
 
																+defineProps({
															
 
																+  route: {
															
 
																+    type: Object,
															
 
																+    required: true
															
 
																+  }
															
 
																+})
															
 
																+</script>
															
 
																+
															
 
																+<style lang="scss" scoped></style>
															
--- a/src/layout/components/Sidebar/SidebarMenu.vue
+++ b/src/layout/components/Sidebar/SidebarMenu.vue
@@ -0,0 +1,48 @@
 
																+<template>
															
 
																+  <!-- 一级 menu 菜单 -->
															
 
																+  <el-menu
															
 
																+    background-color="#1E7DFB"
															
 
																+    text-color="#fff"
															
 
																+    active-text-color="#000000"
															
 
																+    :default-active="activeMenu"
															
 
																+    unique-opened
															
 
																+    router
															
 
																+  >
															
 
																+    <template v-for="item in routes" :key="item.path">
															
 
																+      <sidebar-item
															
 
																+        :route="item"
															
 
																+        v-if="item.meta.adminType >= $store.getters.userInfo.adminType"
															
 
																+      ></sidebar-item>
															
 
																+    </template>
															
 
																+  </el-menu>
															
 
																+</template>
															
 
																+
															
 
																+<script setup>
															
 
																+import { computed } from 'vue'
															
 
																+import SidebarItem from './SidebarItem'
															
 
																+import { useRouter, useRoute } from 'vue-router'
															
 
																+import { filterRouters, generateMenus } from '@/utils/route'
															
 
																+
															
 
																+// // 计算路由表结构
															
 
																+const router = useRouter()
															
 
																+const routes = computed(() => {
															
 
																+  const filterRoutes = filterRouters(router.getRoutes())
															
 
																+  return generateMenus(filterRoutes)
															
 
																+})
															
 
																+
															
 
																+// // 计算高亮 menu 的方法
															
 
																+const route = useRoute()
															
 
																+const activeMenu = computed(() => {
															
 
																+  const { meta, path } = route
															
 
																+  if (meta.activeMenu) {
															
 
																+    return meta.activeMenu
															
 
																+  }
															
 
																+  return path
															
 
																+})
															
 
																+</script>
															
 
																+
															
 
																+<style lang="scss" scoped>
															
 
																+::v-deep .is-active {
															
 
																+  background-color: #fff;
															
 
																+}
															
 
																+</style>
															
--- a/src/layout/components/Sidebar/index.vue
+++ b/src/layout/components/Sidebar/index.vue
@@ -0,0 +1,29 @@
 
																+<template>
															
 
																+  <div>
															
 
																+    <!-- logo区域 -->
															
 
																+    <div class="logo-container">
															
 
																+      <img src="../../../assets/sidebar-logo.png" />
															
 
																+    </div>
															
 
																+    <!-- Menu 菜单区域 -->
															
 
																+    <el-scrollbar>
															
 
																+      <SidebarMenu />
															
 
																+    </el-scrollbar>
															
 
																+  </div>
															
 
																+</template>
															
 
																+
															
 
																+<script setup>
															
 
																+import SidebarMenu from './SidebarMenu.vue'
															
 
																+</script>
															
 
																+
															
 
																+<style lang="scss" scoped>
															
 
																+.logo-container {
															
 
																+  height: 62px;
															
 
																+  padding: 22px 0;
															
 
																+  display: flex;
															
 
																+  align-items: center;
															
 
																+  justify-content: center;
															
 
																+  img {
															
 
																+    width: 100px;
															
 
																+  }
															
 
																+}
															
 
																+</style>
															
--- a/src/layout/index.vue
+++ b/src/layout/index.vue
@@ -0,0 +1,49 @@
 
																+<template>
															
 
																+  <div class="app_wrapper">
															
 
																+    <!-- 左侧 menu -->
															
 
																+    <Sidebar id="guide-sidebar" class="sidebar-container" />
															
 
																+    <!-- 右侧 -->
															
 
																+    <div class="main-container">
															
 
																+      <!-- 顶部的 navbar -->
															
 
																+      <div class="fixed_header">
															
 
																+        <Navbar />
															
 
																+      </div>
															
 
																+      <!-- 内容区 -->
															
 
																+      <AppMain />
															
 
																+    </div>
															
 
																+  </div>
															
 
																+</template>
															
 
																+
															
 
																+<script setup>
															
 
																+import Sidebar from './components/Sidebar/index.vue'
															
 
																+import AppMain from './components/AppMain.vue'
															
 
																+import Navbar from './components/Navbar.vue'
															
 
																+</script>
															
 
																+
															
 
																+<style lang="scss" scoped>
															
 
																+@import '~@/styles/mixin.scss';
															
 
																+@import '~@/styles/variables.module.scss';
															
 
																+.app_wrapper {
															
 
																+  @include clearfix;
															
 
																+  position: relative;
															
 
																+  height: 100%;
															
 
																+  width: 100%;
															
 
																+}
															
 
																+
															
 
																+.fixed_header {
															
 
																+  position: fixed;
															
 
																+  top: 0;
															
 
																+  right: 0;
															
 
																+  z-index: 9;
															
 
																+  width: calc(100% - #{$sideBarWidth});
															
 
																+  transition: width #{$sideBarDuration};
															
 
																+}
															
 
																+
															
 
																+.hideSidebar .fixed_header {
															
 
																+  width: calc(100% - #{$hideSideBarWidth});
															
 
																+}
															
 
																+
															
 
																+.sidebar-container {
															
 
																+  background-color: #1e7dfb;
															
 
																+}
															
 
																+</style>
															
--- a/src/main.js
+++ b/src/main.js
@@ -0,0 +1,31 @@
 
																+import { createApp } from 'vue'
															
 
																+import App from './App.vue'
															
 
																+import router from './router'
															
 
																+import store from './store'
															
 
																+// 导入权限控制模块
															
 
																+// import './permission'
															
 
																+
															
 
																+// 引入初始化样式
															
 
																+import '@/styles/index.scss'
															
 
																+
															
 
																+// 引入vue3 element 组件 和样式
															
 
																+import ElementPlus from 'element-plus'
															
 
																+import 'element-plus/dist/index.css'
															
 
																+import zhCn from 'element-plus/dist/locale/zh-cn.mjs'
															
 
																+
															
 
																+// 引入vue3 element Icon图标
															
 
																+import * as ElementPlusIconsVue from '@element-plus/icons-vue'
															
 
																+
															
 
																+const app = createApp(App)
															
 
																+
															
 
																+// 全局注册element Icon图标
															
 
																+for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
															
 
																+  app.component(key, component)
															
 
																+}
															
 
																+app
															
 
																+  .use(store)
															
 
																+  .use(router)
															
 
																+  .use(ElementPlus, {
															
 
																+    locale: zhCn
															
 
																+  })
															
 
																+  .mount('#app')
															
--- a/src/permission.js
+++ b/src/permission.js
@@ -0,0 +1,24 @@
 
																+import router from './router'
															
 
																+import store from './store'
															
 
																+
															
 
																+// 白名单
															
 
																+const whiteList = ['/login']
															
 
																+
															
 
																+// 路由前置守卫
															
 
																+router.beforeEach(async (to, from, next) => {
															
 
																+  // 存在 token ，进入主页
															
 
																+  if (store.getters.token) {
															
 
																+    if (to.path === '/login') {
															
 
																+      next('/')
															
 
																+    } else {
															
 
																+      next()
															
 
																+    }
															
 
																+  } else {
															
 
																+    // 没有token的情况下，可以进入白名单
															
 
																+    if (whiteList.indexOf(to.path) > -1) {
															
 
																+      next()
															
 
																+    } else {
															
 
																+      next('/login')
															
 
																+    }
															
 
																+  }
															
 
																+})
															
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -0,0 +1,59 @@
 
																+import {
															
 
																+  createRouter,
															
 
																+  createWebHistory,
															
 
																+  createWebHashHistory
															
 
																+} from 'vue-router'
															
 
																+import layout from '@/layout'
															
 
																+
															
 
																+// 公开路由表
															
 
																+const publicRoutes = [
															
 
																+  {
															
 
																+    path: '/login',
															
 
																+    component: () =>
															
 
																+      import(/* webpackChunkName: "login" */ '@/views/login/index.vue')
															
 
																+  },
															
 
																+  {
															
 
																+    path: '/',
															
 
																+    redirect: '/projectManagement',
															
 
																+    component: layout,
															
 
																+    children: [
															
 
																+      {
															
 
																+        path: '/projectManagement',
															
 
																+        name: 'projectManagement',
															
 
																+        component: () =>
															
 
																+          import(
															
 
																+            /* webpackChunkName: "projectManagement" */ '@/views/project-management/index'
															
 
																+          ),
															
 
																+        meta: {
															
 
																+          title: '项目管理',
															
 
																+          icon: 'Tickets',
															
 
																+          adminType: 2
															
 
																+        }
															
 
																+      },
															
 
																+      {
															
 
																+        path: '/accountManagement',
															
 
																+        name: 'accountManagement',
															
 
																+        component: () =>
															
 
																+          import(
															
 
																+            /* webpackChunkName: "accountManagement" */ '@/views/account-management/index'
															
 
																+          ),
															
 
																+        meta: {
															
 
																+          title: '账号管理',
															
 
																+          icon: 'Avatar',
															
 
																+          adminType: 1
															
 
																+        }
															
 
																+      }
															
 
																+    ]
															
 
																+  }
															
 
																+]
															
 
																+
															
 
																+const router = createRouter({
															
 
																+  // history: createWebHashHistory(),
															
 
																+  history:
															
 
																+    process.env.NODE_ENV === 'production'
															
 
																+      ? createWebHistory()
															
 
																+      : createWebHashHistory(),
															
 
																+  routes: [...publicRoutes]
															
 
																+})
															
 
																+
															
 
																+export default router
															
--- a/src/store/getters.js
+++ b/src/store/getters.js
@@ -0,0 +1,10 @@
 
																+const getters = {
															
 
																+  token: (state) => state.user.token,
															
 
																+  userInfo: (state) => state.user.userInfo,
															
 
																+  // name: (state) => state.user.name,
															
 
																+  // true 表示已存在用户信息
															
 
																+  hasUserInfo: (state) => {
															
 
																+    return JSON.stringify(state.user.userInfo) !== '{}'
															
 
																+  }
															
 
																+}
															
 
																+export default getters
															
--- a/src/store/index.js
+++ b/src/store/index.js
@@ -0,0 +1,10 @@
 
																+import { createStore } from 'vuex'
															
 
																+import user from './modules/user'
															
 
																+import getters from './getters'
															
 
																+
															
 
																+export default createStore({
															
 
																+  getters,
															
 
																+  modules: {
															
 
																+    user
															
 
																+  }
															
 
																+})
															
--- a/src/store/modules/user.js
+++ b/src/store/modules/user.js
@@ -0,0 +1,61 @@
 
																+import { login } from '@/api/sys'
															
 
																+import { setItem, getItem, removeAllItem } from '@/utils/storage'
															
 
																+import { TOKEN, USERINFO } from '@/constant/index'
															
 
																+import router from '@/router/index'
															
 
																+import { RSAencrypt } from '@/utils/jsencrypt'
															
 
																+import { setTimeStamp } from '@/utils/auth'
															
 
																+
															
 
																+export default {
															
 
																+  namespaced: true,
															
 
																+  state: () => ({
															
 
																+    token: getItem(TOKEN) || '',
															
 
																+    userInfo: getItem(USERINFO) || {
															
 
																+      name: '',
															
 
																+      adminType: '',
															
 
																+      id: ''
															
 
																+    }
															
 
																+  }),
															
 
																+  mutations: {
															
 
																+    setToken(state, token) {
															
 
																+      state.token = token
															
 
																+      setItem(TOKEN, token)
															
 
																+    },
															
 
																+    setInfo(state, data) {
															
 
																+      state.userInfo.name = data.name
															
 
																+      state.userInfo.adminType = data.adminType
															
 
																+      state.userInfo.id = data.id
															
 
																+      setItem(USERINFO, state.userInfo)
															
 
																+    }
															
 
																+  },
															
 
																+  actions: {
															
 
																+    // 登录请求
															
 
																+    login(context, userInfo) {
															
 
																+      const { userName, password } = userInfo
															
 
																+      return new Promise((resolve, reject) => {
															
 
																+        login({
															
 
																+          userName,
															
 
																+          password: RSAencrypt(password)
															
 
																+        })
															
 
																+          .then((data) => {
															
 
																+            console.log(data)
															
 
																+            this.commit('user/setToken', data.token)
															
 
																+            this.commit('user/setInfo', data)
															
 
																+            router.push('/')
															
 
																+            // // 保存登录时间
															
 
																+            setTimeStamp()
															
 
																+          })
															
 
																+          .catch((err) => {
															
 
																+            reject(err)
															
 
																+          })
															
 
																+      })
															
 
																+    },
															
 
																+
															
 
																+    // 退出登录
															
 
																+    logout() {
															
 
																+      this.commit('user/setToken', '')
															
 
																+      this.commit('user/setInfo', {})
															
 
																+      removeAllItem()
															
 
																+      router.push('/login')
															
 
																+    }
															
 
																+  }
															
 
																+}
															
--- a/src/styles/element.scss
+++ b/src/styles/element.scss
@@ -0,0 +1,3 @@
 
																+.el-avatar {
															
 
																+  --el-avatar-background-color: none !important;
															
 
																+}
															
--- a/src/styles/index.scss
+++ b/src/styles/index.scss
@@ -0,0 +1,57 @@
 
																+@import './variables.module.scss';
															
 
																+@import './mixin.scss';
															
 
																+@import './sidebar.scss';
															
 
																+@import './element.scss';
															
 
																+@import './transition.scss';
															
 
																+
															
 
																+html,
															
 
																+body {
															
 
																+  height: 100%;
															
 
																+  margin: 0;
															
 
																+  padding: 0;
															
 
																+  -moz-osx-font-smoothing: grayscale;
															
 
																+  -webkit-font-smoothing: antialiased;
															
 
																+  text-rendering: optimizeLegibility;
															
 
																+  font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB,
															
 
																+    Microsoft YaHei, Arial, sans-serif;
															
 
																+}
															
 
																+
															
 
																+#app {
															
 
																+  height: 100%;
															
 
																+}
															
 
																+
															
 
																+*,
															
 
																+*:before,
															
 
																+*:after {
															
 
																+  box-sizing: inherit;
															
 
																+  margin: 0;
															
 
																+  padding: 0;
															
 
																+}
															
 
																+
															
 
																+a:focus,
															
 
																+a:active {
															
 
																+  outline: none;
															
 
																+}
															
 
																+
															
 
																+a,
															
 
																+a:focus,
															
 
																+a:hover {
															
 
																+  cursor: pointer;
															
 
																+  color: inherit;
															
 
																+  text-decoration: none;
															
 
																+}
															
 
																+
															
 
																+div:focus {
															
 
																+  outline: none;
															
 
																+}
															
 
																+
															
 
																+.clearfix {
															
 
																+  &:after {
															
 
																+    visibility: hidden;
															
 
																+    display: block;
															
 
																+    font-size: 0;
															
 
																+    content: ' ';
															
 
																+    clear: both;
															
 
																+    height: 0;
															
 
																+  }
															
 
																+}
															
--- a/src/styles/mixin.scss
+++ b/src/styles/mixin.scss
@@ -0,0 +1,28 @@
 
																+@mixin clearfix {
															
 
																+  &:after {
															
 
																+    content: '';
															
 
																+    display: table;
															
 
																+    clear: both;
															
 
																+  }
															
 
																+}
															
 
																+
															
 
																+@mixin scrollBar {
															
 
																+  &::-webkit-scrollbar-track-piece {
															
 
																+    background: #d3dce6;
															
 
																+  }
															
 
																+
															
 
																+  &::-webkit-scrollbar {
															
 
																+    width: 6px;
															
 
																+  }
															
 
																+
															
 
																+  &::-webkit-scrollbar-thumb {
															
 
																+    background: #99a9bf;
															
 
																+    border-radius: 20px;
															
 
																+  }
															
 
																+}
															
 
																+
															
 
																+@mixin relative {
															
 
																+  position: relative;
															
 
																+  width: 100%;
															
 
																+  height: 100%;
															
 
																+}
															
--- a/src/styles/sidebar.scss
+++ b/src/styles/sidebar.scss
@@ -0,0 +1,181 @@
 
																+#app {
															
 
																+  .main-container {
															
 
																+    min-height: 100%;
															
 
																+    transition: margin-left #{$sideBarDuration};
															
 
																+    margin-left: $sideBarWidth;
															
 
																+    position: relative;
															
 
																+  }
															
 
																+
															
 
																+  .sidebar-container {
															
 
																+    transition: width #{$sideBarDuration};
															
 
																+    width: $sideBarWidth !important;
															
 
																+    height: 100%;
															
 
																+    position: fixed;
															
 
																+    top: 0;
															
 
																+    bottom: 0;
															
 
																+    left: 0;
															
 
																+    z-index: 1001;
															
 
																+    overflow: hidden;
															
 
																+
															
 
																+    // 重置 element-plus 的css
															
 
																+    .horizontal-collapse-transition {
															
 
																+      transition: 0s width ease-in-out, 0s padding-left ease-in-out,
															
 
																+        0s padding-right ease-in-out;
															
 
																+    }
															
 
																+
															
 
																+    .scrollbar-wrapper {
															
 
																+      overflow-x: hidden !important;
															
 
																+    }
															
 
																+
															
 
																+    .el-scrollbar__bar.is-vertical {
															
 
																+      right: 0px;
															
 
																+    }
															
 
																+
															
 
																+    .el-scrollbar {
															
 
																+      height: 100%;
															
 
																+    }
															
 
																+
															
 
																+    &.has-logo {
															
 
																+      .el-scrollbar {
															
 
																+        height: calc(100% - 50px);
															
 
																+      }
															
 
																+    }
															
 
																+
															
 
																+    .is-horizontal {
															
 
																+      display: none;
															
 
																+    }
															
 
																+
															
 
																+    a {
															
 
																+      display: inline-block;
															
 
																+      width: 100%;
															
 
																+      overflow: hidden;
															
 
																+    }
															
 
																+
															
 
																+    .svg-icon {
															
 
																+      margin-right: 16px;
															
 
																+    }
															
 
																+
															
 
																+    .sub-el-icon {
															
 
																+      margin-right: 12px;
															
 
																+      margin-left: -2px;
															
 
																+    }
															
 
																+
															
 
																+    .el-menu {
															
 
																+      border: none;
															
 
																+      height: 100%;
															
 
																+      width: 100% !important;
															
 
																+    }
															
 
																+
															
 
																+    .is-active > .el-submenu__title {
															
 
																+      color: $subMenuActiveText !important;
															
 
																+    }
															
 
																+
															
 
																+    & .nest-menu .el-submenu > .el-submenu__title,
															
 
																+    & .el-submenu .el-menu-item {
															
 
																+      min-width: $sideBarWidth !important;
															
 
																+    }
															
 
																+  }
															
 
																+
															
 
																+  .hideSidebar {
															
 
																+    .sidebar-container {
															
 
																+      width: 54px !important;
															
 
																+    }
															
 
																+
															
 
																+    .main-container {
															
 
																+      margin-left: 54px;
															
 
																+    }
															
 
																+
															
 
																+    .submenu-title-noDropdown {
															
 
																+      padding: 0 !important;
															
 
																+      position: relative;
															
 
																+
															
 
																+      .el-tooltip {
															
 
																+        padding: 0 !important;
															
 
																+
															
 
																+        .svg-icon {
															
 
																+          margin-left: 20px;
															
 
																+        }
															
 
																+
															
 
																+        .sub-el-icon {
															
 
																+          margin-left: 19px;
															
 
																+        }
															
 
																+      }
															
 
																+    }
															
 
																+
															
 
																+    .el-submenu {
															
 
																+      overflow: hidden;
															
 
																+
															
 
																+      & > .el-submenu__title {
															
 
																+        padding: 0 !important;
															
 
																+
															
 
																+        .svg-icon {
															
 
																+          margin-left: 20px;
															
 
																+        }
															
 
																+
															
 
																+        .sub-el-icon {
															
 
																+          margin-left: 19px;
															
 
																+        }
															
 
																+
															
 
																+        .el-submenu__icon-arrow {
															
 
																+          display: none;
															
 
																+        }
															
 
																+      }
															
 
																+    }
															
 
																+
															
 
																+    .el-menu--collapse {
															
 
																+      .el-submenu {
															
 
																+        & > .el-submenu__title {
															
 
																+          & > span {
															
 
																+            height: 0;
															
 
																+            width: 0;
															
 
																+            overflow: hidden;
															
 
																+            visibility: hidden;
															
 
																+            display: inline-block;
															
 
																+          }
															
 
																+        }
															
 
																+      }
															
 
																+    }
															
 
																+  }
															
 
																+
															
 
																+  .el-menu--collapse .el-menu .el-submenu {
															
 
																+    min-width: $sideBarWidth !important;
															
 
																+  }
															
 
																+
															
 
																+  .withoutAnimation {
															
 
																+    .main-container,
															
 
																+    .sidebar-container {
															
 
																+      transition: none;
															
 
																+    }
															
 
																+  }
															
 
																+}
															
 
																+
															
 
																+.el-menu--vertical {
															
 
																+  & > .el-menu {
															
 
																+    .svg-icon {
															
 
																+      margin-right: 16px;
															
 
																+    }
															
 
																+    .sub-el-icon {
															
 
																+      margin-right: 12px;
															
 
																+      margin-left: -2px;
															
 
																+    }
															
 
																+  }
															
 
																+
															
 
																+  // 菜单项过长时
															
 
																+  > .el-menu--popup {
															
 
																+    max-height: 100vh;
															
 
																+    overflow-y: auto;
															
 
																+
															
 
																+    &::-webkit-scrollbar-track-piece {
															
 
																+      background: #d3dce6;
															
 
																+    }
															
 
																+
															
 
																+    &::-webkit-scrollbar {
															
 
																+      width: 6px;
															
 
																+    }
															
 
																+
															
 
																+    &::-webkit-scrollbar-thumb {
															
 
																+      background: #99a9bf;
															
 
																+      border-radius: 20px;
															
 
																+    }
															
 
																+  }
															
 
																+}
															
--- a/src/styles/transition.scss
+++ b/src/styles/transition.scss
@@ -0,0 +1,30 @@
 
																+.breadcrumb-enter-active,
															
 
																+.breadcrumb-leave-active {
															
 
																+  transition: all 0.5s;
															
 
																+}
															
 
																+
															
 
																+.breadcrumb-enter-from,
															
 
																+.breadcrumb-leave-active {
															
 
																+  opacity: 0;
															
 
																+  transform: translateX(20px);
															
 
																+}
															
 
																+
															
 
																+.breadcrumb-leave-active {
															
 
																+  position: absolute;
															
 
																+}
															
 
																+
															
 
																+/* fade-transform */
															
 
																+.fade-transform-leave-active,
															
 
																+.fade-transform-enter-active {
															
 
																+  transition: all 0.5s;
															
 
																+}
															
 
																+
															
 
																+.fade-transform-enter-from {
															
 
																+  opacity: 0;
															
 
																+  transform: translateX(-30px);
															
 
																+}
															
 
																+
															
 
																+.fade-transform-leave-to {
															
 
																+  opacity: 0;
															
 
																+  transform: translateX(30px);
															
 
																+}
															
--- a/src/styles/variables.module.scss
+++ b/src/styles/variables.module.scss
@@ -0,0 +1,27 @@
 
																+// sidebar
															
 
																+$menuText: #bfcbd9;
															
 
																+$menuActiveText: #409eff;
															
 
																+$subMenuActiveText: #f4f4f5;
															
 
																+
															
 
																+$menuBg: #304156;
															
 
																+$menuHover: #263445;
															
 
																+
															
 
																+$subMenuBg: #1f2d3d;
															
 
																+$subMenuHover: #001528;
															
 
																+
															
 
																+$sideBarWidth: 210px;
															
 
																+$hideSideBarWidth: 54px;
															
 
																+$sideBarDuration: 0.28s;
															
 
																+
															
 
																+// https://www.bluematador.com/blog/how-to-share-variables-between-js-and-sass
															
 
																+// JS 与 scss 共享变量，在 scss 中通过 :export 进行导出，在 js 中可通过 ESM 进行导入
															
 
																+:export {
															
 
																+  menuText: $menuText;
															
 
																+  menuActiveText: $menuActiveText;
															
 
																+  subMenuActiveText: $subMenuActiveText;
															
 
																+  menuBg: $menuBg;
															
 
																+  menuHover: $menuHover;
															
 
																+  subMenuBg: $subMenuBg;
															
 
																+  subMenuHover: $subMenuHover;
															
 
																+  sideBarWidth: $sideBarWidth;
															
 
																+}
															
--- a/src/utils/auth.js
+++ b/src/utils/auth.js
@@ -0,0 +1,21 @@
 
																+import { TIME_STAMP, TOKEN_TIMEOUT_VALUE } from '@/constant'
															
 
																+import { setItem, getItem } from '@/utils/storage'
															
 
																+
															
 
																+// 获取本地缓存时间戳
															
 
																+export function getTimeStamp() {
															
 
																+  return getItem(TIME_STAMP)
															
 
																+}
															
 
																+
															
 
																+// 保存当前登录时间戳
															
 
																+export function setTimeStamp() {
															
 
																+  setItem(TIME_STAMP, Date.now())
															
 
																+}
															
 
																+
															
 
																+// 是否超时 true为超时
															
 
																+export function isCheckTimeout() {
															
 
																+  // 获取当前时间戳
															
 
																+  const currentTime = Date.now()
															
 
																+  // 获取缓存时间戳
															
 
																+  const timeStamp = getTimeStamp()
															
 
																+  return currentTime - timeStamp > TOKEN_TIMEOUT_VALUE
															
 
																+}
															
--- a/src/utils/jsencrypt.js
+++ b/src/utils/jsencrypt.js
@@ -0,0 +1,15 @@
 
																+import { JSEncrypt } from 'jsencrypt'
															
 
																+const publicKey =
															
 
																+  'MIGfMA0GCSqGSIb3DQEBAQUAA4GNADCBiQKBgQDMOcPB06u5yKyQsPjfVWiWgbEIrd14kiXNNihciaVKb6HnkQvq7zpQuZ80WEX94spnUMI3iOAl/GmIvHrpGwcbB4hJbznm+PajiwnUSPuCCXA68YJF640cJKb/8KeM7WVz69OFkIEPHhVxOy4FFF5QWe/kt6zOZ19HmE+ak+5x/QIDAQAB'
															
 
																+
															
 
																+// 加密方法
															
 
																+export function RSAencrypt(pas) {
															
 
																+  // 实例化jsEncrypt对象
															
 
																+  const jse = new JSEncrypt()
															
 
																+  // 设置公钥
															
 
																+  jse.setPublicKey(publicKey)
															
 
																+  // 加密后的密码
															
 
																+  const res = jse.encrypt(pas)
															
 
																+  // console.log('加密：' + res)
															
 
																+  return res
															
 
																+}
															
--- a/src/utils/request.js
+++ b/src/utils/request.js
@@ -0,0 +1,61 @@
 
																+import axios from 'axios'
															
 
																+import store from '@/store'
															
 
																+import { ElMessage } from 'element-plus'
															
 
																+// import { isCheckTimeout } from '@/utils/auth'
															
 
																+
															
 
																+const service = axios.create({
															
 
																+  baseURL: process.env.VUE_APP_BASE_API,
															
 
																+  timeout: 5000
															
 
																+})
															
 
																+
															
 
																+// 请求拦截器
															
 
																+service.interceptors.request.use(
															
 
																+  (config) => {
															
 
																+    // 在这个位置需要统一的去注入token
															
 
																+    if (store.getters.token) {
															
 
																+      // // 判断token是否超时
															
 
																+      // if (isCheckTimeout()) {
															
 
																+      //   // 登出操作
															
 
																+      //   store.dispatch('user/logout')
															
 
																+      //   return Promise.reject(new Error('token 失效'))
															
 
																+      // }
															
 
																+
															
 
																+      // 如果token存在 注入token
															
 
																+      config.headers.admin_token = store.getters.token
															
 
																+    }
															
 
																+    return config // 必须返回配置
															
 
																+  },
															
 
																+  (error) => {
															
 
																+    return Promise.reject(error)
															
 
																+  }
															
 
																+)
															
 
																+
															
 
																+// // 响应拦截器
															
 
																+service.interceptors.response.use(
															
 
																+  (response) => {
															
 
																+    const { success, message, data } = response.data
															
 
																+    //   要根据success的成功与否决定下面的操作
															
 
																+    if (success) {
															
 
																+      return data
															
 
																+    } else {
															
 
																+      // 业务错误
															
 
																+      ElMessage.error(message) // 提示错误消息
															
 
																+      return Promise.reject(new Error(message))
															
 
																+    }
															
 
																+  },
															
 
																+  (error) => {
															
 
																+    // 处理 token 超时问题
															
 
																+    if (
															
 
																+      error.response &&
															
 
																+      error.response.data &&
															
 
																+      error.response.data.code === 401
															
 
																+    ) {
															
 
																+      // token超时
															
 
																+      store.dispatch('user/logout')
															
 
																+    }
															
 
																+    ElMessage.error(error.message) // 提示错误信息
															
 
																+    return Promise.reject(error)
															
 
																+  }
															
 
																+)
															
 
																+
															
 
																+export default service
															
--- a/src/utils/route.js
+++ b/src/utils/route.js
@@ -0,0 +1,72 @@
 
																+import path from 'path'
															
 
																+
															
 
																+// 返回所有子路由
															
 
																+const getChildrenRoutes = (routes) => {
															
 
																+  const result = []
															
 
																+  routes.forEach((route) => {
															
 
																+    if (route.children && route.children.length > 0) {
															
 
																+      result.push(...route.children)
															
 
																+    }
															
 
																+  })
															
 
																+  return result
															
 
																+}
															
 
																+
															
 
																+/**
															
 
																+ * 处理脱离层级的路由：某个一级路由为其他子路由，则剔除该一级路由，保留路由层级
															
 
																+ * @param {*} routes router.getRoutes()
															
 
																+ */
															
 
																+export const filterRouters = (routes) => {
															
 
																+  const childrenRoutes = getChildrenRoutes(routes)
															
 
																+  // 把重复的路由过滤
															
 
																+  return routes.filter((route) => {
															
 
																+    return !childrenRoutes.find((childrenRoute) => {
															
 
																+      return childrenRoute.path === route.path
															
 
																+    })
															
 
																+  })
															
 
																+}
															
 
																+
															
 
																+// 判断数据是否为空值
															
 
																+function isNull(data) {
															
 
																+  if (!data) return true
															
 
																+  if (JSON.stringify(data) === '{}') return true
															
 
																+  if (JSON.stringify(data) === '[]') return true
															
 
																+  return false
															
 
																+}
															
 
																+
															
 
																+// 根据 routes 数据，返回对应 menu 规则数组
															
 
																+export function generateMenus(routes, basePath = '') {
															
 
																+  const result = []
															
 
																+  // 遍历路由表
															
 
																+  routes.forEach((item) => {
															
 
																+    // 不存在 children && 不存在 meta 直接 return
															
 
																+    if (isNull(item.meta) && isNull(item.children)) return
															
 
																+    // 存在 children 不存在 meta，进入迭代
															
 
																+    if (isNull(item.meta) && !isNull(item.children)) {
															
 
																+      result.push(...generateMenus(item.children))
															
 
																+      return
															
 
																+    }
															
 
																+    // 合并 path 作为跳转路径
															
 
																+    const routePath = path.resolve(basePath, item.path)
															
 
																+    // 路由分离之后，存在同名父路由的情况，需要单独处理
															
 
																+    let route = result.find((item) => item.path === routePath)
															
 
																+    if (!route) {
															
 
																+      route = {
															
 
																+        ...item,
															
 
																+        path: routePath,
															
 
																+        children: []
															
 
																+      }
															
 
																+
															
 
																+      // icon 与 title 必须全部存在
															
 
																+      if (route.meta.icon && route.meta.title) {
															
 
																+        // meta 存在生成 route 对象，放入 arr
															
 
																+        result.push(route)
															
 
																+      }
															
 
																+    }
															
 
																+
															
 
																+    // 存在 children 进入迭代到children
															
 
																+    if (item.children) {
															
 
																+      route.children.push(...generateMenus(item.children, route.path))
															
 
																+    }
															
 
																+  })
															
 
																+  return result
															
 
																+}
															
--- a/src/utils/storage.js
+++ b/src/utils/storage.js
@@ -0,0 +1,28 @@
 
																+// 存储数据
															
 
																+export const setItem = (key, value) => {
															
 
																+  // 将数组、对象类型的数据转化为 JSON 字符串进行存储
															
 
																+  if (typeof value === 'object') {
															
 
																+    value = JSON.stringify(value)
															
 
																+  }
															
 
																+  window.localStorage.setItem(key, value)
															
 
																+}
															
 
																+
															
 
																+// 获取数据
															
 
																+export const getItem = key => {
															
 
																+  const data = window.localStorage.getItem(key)
															
 
																+  try {
															
 
																+    return JSON.parse(data)
															
 
																+  } catch (err) {
															
 
																+    return data
															
 
																+  }
															
 
																+}
															
 
																+
															
 
																+// 删除某一条数据
															
 
																+export const removeItem = key => {
															
 
																+  window.localStorage.removeItem(key)
															
 
																+}
															
 
																+
															
 
																+// 删除全部数据
															
 
																+export const removeAllItem = () => {
															
 
																+  window.localStorage.clear()
															
 
																+}
															
--- a/src/views/account-management/index.vue
+++ b/src/views/account-management/index.vue
@@ -0,0 +1,480 @@
 
																+<template>
															
 
																+  <div>
															
 
																+    <el-card class="content">
															
 
																+      <!-- 标题区域 -->
															
 
																+      <el-row class="card_title">账号管理</el-row>
															
 
																+
															
 
																+      <!-- 筛选区域 -->
															
 
																+      <el-row :gutter="35" class="card_search">
															
 
																+        <el-col :span="5">
															
 
																+          账号:
															
 
																+          <el-input
															
 
																+            style="width: 180px"
															
 
																+            placeholder="请输入账号"
															
 
																+            clearable
															
 
																+            v-model="searchAccount"
															
 
																+          ></el-input>
															
 
																+        </el-col>
															
 
																+
															
 
																+        <el-col :span="5">
															
 
																+          姓名:
															
 
																+          <el-input
															
 
																+            style="width: 180px"
															
 
																+            placeholder="请输入姓名"
															
 
																+            clearable
															
 
																+            v-model="searchName"
															
 
																+          ></el-input>
															
 
																+        </el-col>
															
 
																+
															
 
																+        <el-col :span="5">
															
 
																+          创建时间:
															
 
																+          <el-date-picker
															
 
																+            type="date"
															
 
																+            placeholder="请选择创建时间"
															
 
																+            value-format="YYYY-MM-DD"
															
 
																+            v-model="searchTime"
															
 
																+          />
															
 
																+        </el-col>
															
 
																+
															
 
																+        <el-col :span="4">
															
 
																+          <el-button type="primary" @click="handleSearch">
															
 
																+            <el-icon><Search /></el-icon>
															
 
																+            <span> 查询</span>
															
 
																+          </el-button>
															
 
																+        </el-col>
															
 
																+      </el-row>
															
 
																+
															
 
																+      <!-- 新增账号按钮区域 -->
															
 
																+      <el-row class="card_button">
															
 
																+        <el-button type="primary" @click="handleAdd">
															
 
																+          <el-icon><Plus /></el-icon>
															
 
																+          <span> 新增账号</span>
															
 
																+        </el-button>
															
 
																+      </el-row>
															
 
																+
															
 
																+      <!-- 表格区域 -->
															
 
																+      <el-table
															
 
																+        stripe
															
 
																+        height="481"
															
 
																+        :data="tableData"
															
 
																+        style="width: 100%"
															
 
																+        :header-cell-style="{ backgroundColor: '#F0F3F7' }"
															
 
																+      >
															
 
																+        <el-table-column type="index" width="55" align="center" label="序号" />
															
 
																+        <el-table-column
															
 
																+          width="200"
															
 
																+          align="center"
															
 
																+          prop="userName"
															
 
																+          label="账号"
															
 
																+        />
															
 
																+        <el-table-column
															
 
																+          width="200"
															
 
																+          align="center"
															
 
																+          show-overflow-tooltip
															
 
																+          prop="name"
															
 
																+          label="姓名"
															
 
																+        />
															
 
																+        <el-table-column show-overflow-tooltip align="center" label="角色">
															
 
																+          <template #default="{ row }">
															
 
																+            {{ row.adminType == 1 ? '超级管理员' : '管理员' }}
															
 
																+          </template>
															
 
																+        </el-table-column>
															
 
																+        <el-table-column align="center" prop="time" label="创建时间" />
															
 
																+        <el-table-column width="200" align="center" label="操作">
															
 
																+          <template #default="{ row }">
															
 
																+            <el-button type="success" plain @click="handleEdit(row)"
															
 
																+              >编辑
															
 
																+            </el-button>
															
 
																+            <el-button
															
 
																+              v-if="row.adminType == 2"
															
 
																+              type="danger"
															
 
																+              plain
															
 
																+              @click="handleDelete(row.id)"
															
 
																+              >删除
															
 
																+            </el-button>
															
 
																+          </template>
															
 
																+        </el-table-column>
															
 
																+      </el-table>
															
 
																+      <!-- 分页器区域 -->
															
 
																+      <el-row class="card_pagination">
															
 
																+        <el-pagination
															
 
																+          v-model:current-page="currentPage"
															
 
																+          v-model:page-size="pageSize"
															
 
																+          :page-sizes="[8, 20, 50, 100]"
															
 
																+          layout="total, sizes, prev, pager, next, jumper"
															
 
																+          :total="total"
															
 
																+          @size-change="handleSizeChange"
															
 
																+          @current-change="handleCurrentChange"
															
 
																+        />
															
 
																+      </el-row>
															
 
																+    </el-card>
															
 
																+
															
 
																+    <!-- 编辑弹窗区域 -->
															
 
																+    <el-dialog
															
 
																+      v-model="dialogVisible"
															
 
																+      title="编辑账号"
															
 
																+      width="25%"
															
 
																+      top="20vh"
															
 
																+      :close-on-click-modal="false"
															
 
																+    >
															
 
																+      <div class="dialog_box">
															
 
																+        <div class="dialog_item">
															
 
																+          <span>账号:</span>
															
 
																+          <el-input
															
 
																+            style="width: 180px"
															
 
																+            placeholder="请输入账号"
															
 
																+            clearable
															
 
																+            v-model="editInfo.userName"
															
 
																+          ></el-input>
															
 
																+        </div>
															
 
																+        <div class="dialog_item">
															
 
																+          <span>姓名:</span>
															
 
																+          <el-input
															
 
																+            style="width: 180px"
															
 
																+            placeholder="请输入姓名"
															
 
																+            clearable
															
 
																+            v-model="editInfo.name"
															
 
																+          ></el-input>
															
 
																+        </div>
															
 
																+        <div class="dialog_item">
															
 
																+          <span>密码:</span>
															
 
																+          <el-input
															
 
																+            type="password"
															
 
																+            :show-password="true"
															
 
																+            style="width: 180px"
															
 
																+            placeholder="请输入密码"
															
 
																+            clearable
															
 
																+            v-model="editInfo.newPassword"
															
 
																+          ></el-input>
															
 
																+        </div>
															
 
																+        <div class="dialog_item">
															
 
																+          <span>确认密码:</span>
															
 
																+          <el-input
															
 
																+            type="password"
															
 
																+            :show-password="true"
															
 
																+            style="width: 180px"
															
 
																+            placeholder="请再次输入新密码"
															
 
																+            clearable
															
 
																+            v-model="editInfo.newPassword2"
															
 
																+          ></el-input>
															
 
																+        </div>
															
 
																+      </div>
															
 
																+
															
 
																+      <template #footer>
															
 
																+        <span class="dialog-footer">
															
 
																+          <el-button @click="dialogVisible = false">取消</el-button>
															
 
																+          <el-button type="primary" @click="handleEditConfirm">
															
 
																+            确定
															
 
																+          </el-button>
															
 
																+        </span>
															
 
																+      </template>
															
 
																+    </el-dialog>
															
 
																+
															
 
																+    <!-- 新增账号弹窗区域 -->
															
 
																+    <el-dialog
															
 
																+      v-model="dialogVisibleAdd"
															
 
																+      title="新增账号"
															
 
																+      width="25%"
															
 
																+      top="20vh"
															
 
																+      :close-on-click-modal="false"
															
 
																+    >
															
 
																+      <div class="dialog_box">
															
 
																+        <div class="dialog_item">
															
 
																+          <span>账号:</span>
															
 
																+          <el-input
															
 
																+            style="width: 180px"
															
 
																+            placeholder="请输入账号"
															
 
																+            clearable
															
 
																+            v-model="addInfo.userName"
															
 
																+          ></el-input>
															
 
																+        </div>
															
 
																+        <div class="dialog_item">
															
 
																+          <span>姓名:</span>
															
 
																+          <el-input
															
 
																+            style="width: 180px"
															
 
																+            placeholder="请输入姓名"
															
 
																+            clearable
															
 
																+            v-model="addInfo.name"
															
 
																+          ></el-input>
															
 
																+        </div>
															
 
																+        <div class="dialog_item">
															
 
																+          <span>密码:</span>
															
 
																+          <el-input
															
 
																+            type="password"
															
 
																+            :show-password="true"
															
 
																+            style="width: 180px"
															
 
																+            placeholder="请输入密码"
															
 
																+            clearable
															
 
																+            v-model="addInfo.newPassword"
															
 
																+          ></el-input>
															
 
																+        </div>
															
 
																+        <div class="dialog_item">
															
 
																+          <span>确认密码:</span>
															
 
																+          <el-input
															
 
																+            type="password"
															
 
																+            :show-password="true"
															
 
																+            style="width: 180px"
															
 
																+            placeholder="请再次输入新密码"
															
 
																+            clearable
															
 
																+            v-model="addInfo.newPassword2"
															
 
																+          ></el-input>
															
 
																+        </div>
															
 
																+      </div>
															
 
																+
															
 
																+      <template #footer>
															
 
																+        <span class="dialog-footer">
															
 
																+          <el-button @click="dialogVisibleAdd = false">取消</el-button>
															
 
																+          <el-button type="primary" @click="handleEditConfirmAdd">
															
 
																+            确定
															
 
																+          </el-button>
															
 
																+        </span>
															
 
																+      </template>
															
 
																+    </el-dialog>
															
 
																+  </div>
															
 
																+</template>
															
 
																+
															
 
																+<script setup>
															
 
																+import { ref, onMounted } from 'vue'
															
 
																+import { ElMessage, ElMessageBox } from 'element-plus'
															
 
																+import {
															
 
																+  getUserList,
															
 
																+  editUserList,
															
 
																+  addUserList,
															
 
																+  deleteUserList
															
 
																+} from '@/api/user'
															
 
																+import { RSAencrypt } from '@/utils/jsencrypt'
															
 
																+
															
 
																+const editInfo = ref({
															
 
																+  userName: '',
															
 
																+  name: '',
															
 
																+  newPassword: '',
															
 
																+  newPassword2: ''
															
 
																+})
															
 
																+
															
 
																+const addInfo = ref({
															
 
																+  userName: '',
															
 
																+  name: '',
															
 
																+  newPassword: '',
															
 
																+  newPassword2: ''
															
 
																+})
															
 
																+
															
 
																+const handleDelete = (id) => {
															
 
																+  ElMessageBox.confirm('确定删除吗？', '提示', {
															
 
																+    confirmButtonText: '确定',
															
 
																+    cancelButtonText: '取消',
															
 
																+    type: 'warning'
															
 
																+  })
															
 
																+    .then(async () => {
															
 
																+      const res = await deleteUserList({
															
 
																+        ids: [id]
															
 
																+      })
															
 
																+      // console.log(res)
															
 
																+      if (res == null) {
															
 
																+        ElMessage.success('删除成功')
															
 
																+        getData()
															
 
																+      }
															
 
																+    })
															
 
																+    .catch(() => {
															
 
																+      ElMessage.info('已取消')
															
 
																+    })
															
 
																+}
															
 
																+
															
 
																+// 获取账号管理列表
															
 
																+const getData = async () => {
															
 
																+  const res = await getUserList({
															
 
																+    userName: searchAccount.value,
															
 
																+    name: searchName.value,
															
 
																+    time: searchTime.value,
															
 
																+    currPage: currentPage.value,
															
 
																+    pageSize: pageSize.value
															
 
																+  })
															
 
																+  // console.log(res)
															
 
																+  tableData.value = res.list
															
 
																+  total.value = res.totalCount
															
 
																+  currentPage.value = res.currPage
															
 
																+}
															
 
																+
															
 
																+onMounted(() => {
															
 
																+  getData()
															
 
																+})
															
 
																+
															
 
																+// 筛选区域数据
															
 
																+const searchAccount = ref('')
															
 
																+const searchName = ref('')
															
 
																+const searchTime = ref('')
															
 
																+
															
 
																+// 总条数
															
 
																+const total = ref(0)
															
 
																+// 当前页
															
 
																+const currentPage = ref(1)
															
 
																+// 每页多少条
															
 
																+const pageSize = ref(8)
															
 
																+
															
 
																+// 编辑弹窗显示隐藏控制
															
 
																+const dialogVisible = ref(false)
															
 
																+
															
 
																+const dialogVisibleAdd = ref(false)
															
 
																+
															
 
																+// 查询按钮回调
															
 
																+const handleSearch = () => {
															
 
																+  getData()
															
 
																+}
															
 
																+
															
 
																+// 新增按钮回调
															
 
																+const handleAdd = () => {
															
 
																+  dialogVisibleAdd.value = true
															
 
																+  addInfo.value = {
															
 
																+    userName: '',
															
 
																+    name: '',
															
 
																+    newPassword: '',
															
 
																+    newPassword2: ''
															
 
																+  }
															
 
																+}
															
 
																+
															
 
																+// 每页条数改变时的回调
															
 
																+const handleSizeChange = (val) => {
															
 
																+  // console.log(`${val} items per page`)
															
 
																+  pageSize.value = val
															
 
																+}
															
 
																+// 当前页改变时的回调
															
 
																+const handleCurrentChange = (val) => {
															
 
																+  // console.log(`current page: ${val}`)
															
 
																+  currentPage.value = val
															
 
																+}
															
 
																+
															
 
																+// 编辑按钮回调
															
 
																+const handleEdit = (row) => {
															
 
																+  dialogVisible.value = true
															
 
																+  editInfo.value = Object.assign(editInfo.value, row)
															
 
																+  // editInfo.value.name = row.name
															
 
																+  // editInfo.value.userName = row.userName
															
 
																+  // console.log(editInfo.value)
															
 
																+}
															
 
																+
															
 
																+const handleEditConfirm = async () => {
															
 
																+  // console.log(editInfo.value)
															
 
																+  if (editInfo.value.newPassword === '') {
															
 
																+    ElMessage.error('请输入密码')
															
 
																+    return
															
 
																+  }
															
 
																+  if (editInfo.value.newPassword2 === '') {
															
 
																+    ElMessage.error('请输入确认新密码')
															
 
																+    return
															
 
																+  }
															
 
																+  if (editInfo.value.newPassword !== editInfo.value.newPassword2) {
															
 
																+    ElMessage.error('两次输入的密码不一致')
															
 
																+    return
															
 
																+  }
															
 
																+  const res = await editUserList({
															
 
																+    id: editInfo.value.id,
															
 
																+    userName: editInfo.value.userName,
															
 
																+    name: editInfo.value.name,
															
 
																+    password: RSAencrypt(editInfo.value.newPassword)
															
 
																+  })
															
 
																+  // console.log(res)
															
 
																+  if (res == null) {
															
 
																+    dialogVisible.value = false
															
 
																+    editInfo.value.newPassword = ''
															
 
																+    editInfo.value.newPassword2 = ''
															
 
																+    ElMessage.success('编辑账号成功')
															
 
																+    getData()
															
 
																+  }
															
 
																+}
															
 
																+
															
 
																+const handleEditConfirmAdd = async () => {
															
 
																+  if (addInfo.value.userName === '') {
															
 
																+    ElMessage.error('请输入账号')
															
 
																+    return
															
 
																+  }
															
 
																+  if (addInfo.value.name === '') {
															
 
																+    ElMessage.error('请输入姓名')
															
 
																+    return
															
 
																+  }
															
 
																+  if (addInfo.value.newPassword === '') {
															
 
																+    ElMessage.error('请输入密码')
															
 
																+    return
															
 
																+  }
															
 
																+  if (addInfo.value.newPassword2 === '') {
															
 
																+    ElMessage.error('请输入确认新密码')
															
 
																+    return
															
 
																+  }
															
 
																+  if (addInfo.value.newPassword !== addInfo.value.newPassword2) {
															
 
																+    ElMessage.error('两次输入的密码不一致')
															
 
																+    return
															
 
																+  }
															
 
																+  const res = await addUserList({
															
 
																+    userName: addInfo.value.userName,
															
 
																+    name: addInfo.value.name,
															
 
																+    password: RSAencrypt(addInfo.value.newPassword)
															
 
																+  })
															
 
																+  // console.log(res)
															
 
																+  if (res == null) {
															
 
																+    ElMessage.success('添加成功')
															
 
																+    dialogVisibleAdd.value = false
															
 
																+    getData()
															
 
																+  }
															
 
																+}
															
 
																+
															
 
																+const tableData = ref([])
															
 
																+</script>
															
 
																+
															
 
																+<style lang="scss" scoped>
															
 
																+.content {
															
 
																+  width: 1650px;
															
 
																+  height: 782px;
															
 
																+
															
 
																+  ::v-deep .el-card__body {
															
 
																+    padding: 0 27px;
															
 
																+  }
															
 
																+
															
 
																+  .card_title {
															
 
																+    line-height: 58px;
															
 
																+    font-size: 17px;
															
 
																+    font-weight: bold;
															
 
																+    border-bottom: 2px solid #d9d9d9;
															
 
																+  }
															
 
																+  .card_search {
															
 
																+    line-height: 85px;
															
 
																+    font-size: 13px;
															
 
																+    font-weight: bold;
															
 
																+  }
															
 
																+  .card_button {
															
 
																+    height: 53px;
															
 
																+  }
															
 
																+
															
 
																+  .card_pagination {
															
 
																+    float: right;
															
 
																+    line-height: 96px;
															
 
																+  }
															
 
																+}
															
 
																+
															
 
																+.dialog_box {
															
 
																+  height: 150px;
															
 
																+  .dialog_item {
															
 
																+    height: 30px;
															
 
																+    margin-bottom: 20px;
															
 
																+    span {
															
 
																+      display: inline-block;
															
 
																+      width: 70px;
															
 
																+    }
															
 
																+  }
															
 
																+}
															
 
																+
															
 
																+::v-deep .el-button--primary {
															
 
																+  background-color: #0061ff;
															
 
																+}
															
 
																+
															
 
																+::v-deep .el-dialog__header {
															
 
																+  margin: 0;
															
 
																+  font-weight: bold;
															
 
																+  background-color: #edf1f5;
															
 
																+}
															
 
																+
															
 
																+::v-deep
															
 
																+  .el-table--striped
															
 
																+  .el-table__body
															
 
																+  tr.el-table__row--striped.el-table__row--striped.el-table__row--striped
															
 
																+  td {
															
 
																+  background-color: #f0f3f7;
															
 
																+}
															
 
																+</style>
															
--- a/src/views/login/index.vue
+++ b/src/views/login/index.vue
@@ -0,0 +1,212 @@
 
																+<template>
															
 
																+  <div class="login_container">
															
 
																+    <!-- 登录表单区域 -->
															
 
																+    <el-form
															
 
																+      class="login_form"
															
 
																+      ref="ruleFormRef"
															
 
																+      :model="loginForm"
															
 
																+      :rules="loginRules"
															
 
																+    >
															
 
																+      <!-- logo标题区域 -->
															
 
																+      <div class="form_logo">
															
 
																+        <img src="../../assets/logo.png" />
															
 
																+      </div>
															
 
																+
															
 
																+      <div class="form_title">代理商登记管理系统</div>
															
 
																+
															
 
																+      <!-- 用户名区域 -->
															
 
																+      <el-form-item prop="userName">
															
 
																+        <span class="form_svg">
															
 
																+          <el-icon><Avatar /></el-icon>
															
 
																+        </span>
															
 
																+        <el-input
															
 
																+          placeholder="请输入账户名"
															
 
																+          type="text"
															
 
																+          v-model="loginForm.userName"
															
 
																+        ></el-input>
															
 
																+      </el-form-item>
															
 
																+
															
 
																+      <!-- 密码区域 -->
															
 
																+      <el-form-item prop="passWord">
															
 
																+        <span class="form_svg">
															
 
																+          <el-icon><Lock /></el-icon>
															
 
																+        </span>
															
 
																+        <el-input
															
 
																+          placeholder="请输入密码"
															
 
																+          type="password"
															
 
																+          show-password
															
 
																+          v-model="loginForm.password"
															
 
																+        ></el-input>
															
 
																+      </el-form-item>
															
 
																+
															
 
																+      <!-- 登录按钮区域 -->
															
 
																+      <el-button
															
 
																+        class="form_button"
															
 
																+        type="primary"
															
 
																+        :loading="loading"
															
 
																+        @click="handleLogin"
															
 
																+      >
															
 
																+        登录
															
 
																+      </el-button>
															
 
																+    </el-form>
															
 
																+
															
 
																+    <!-- 图片模块 -->
															
 
																+    <div class="img_group">
															
 
																+      <img src="../../assets/login-group.png" />
															
 
																+    </div>
															
 
																+
															
 
																+    <div class="img_people">
															
 
																+      <img src="../../assets/login-people.png" />
															
 
																+    </div>
															
 
																+
															
 
																+    <div class="img_office">
															
 
																+      <img src="../../assets/login-office.png" />
															
 
																+    </div>
															
 
																+  </div>
															
 
																+</template>
															
 
																+
															
 
																+<script setup>
															
 
																+import { ref, computed } from 'vue'
															
 
																+import { useStore } from 'vuex'
															
 
																+
															
 
																+const store = useStore()
															
 
																+
															
 
																+const loading = ref(false)
															
 
																+
															
 
																+const loginForm = ref({
															
 
																+  userName: '',
															
 
																+  password: ''
															
 
																+})
															
 
																+
															
 
																+const loginRules = computed(() => {
															
 
																+  return {
															
 
																+    userName: [
															
 
																+      {
															
 
																+        required: true,
															
 
																+        trigger: 'change',
															
 
																+        message: '请输入账户名'
															
 
																+      }
															
 
																+    ],
															
 
																+    password: [
															
 
																+      {
															
 
																+        required: true,
															
 
																+        trigger: 'change',
															
 
																+        message: '请输入密码'
															
 
																+      }
															
 
																+    ]
															
 
																+  }
															
 
																+})
															
 
																+
															
 
																+const ruleFormRef = ref(null)
															
 
																+
															
 
																+// 登录按钮逻辑
															
 
																+const handleLogin = () => {
															
 
																+  ruleFormRef.value.validate((valid) => {
															
 
																+    if (!valid) {
															
 
																+      return
															
 
																+    }
															
 
																+    loading.value = true
															
 
																+
															
 
																+    store
															
 
																+      .dispatch('user/login', loginForm.value)
															
 
																+      .then(() => {
															
 
																+        loading.value = false
															
 
																+      })
															
 
																+      .catch((err) => {
															
 
																+        console.log(err)
															
 
																+        loading.value = false
															
 
																+      })
															
 
																+  })
															
 
																+}
															
 
																+</script>
															
 
																+
															
 
																+<style lang="scss" scoped>
															
 
																+$bg: #409eff;
															
 
																+$cursor: #fff;
															
 
																+.login_container {
															
 
																+  width: 100vw;
															
 
																+  height: 100vh;
															
 
																+  background-image: url(../../assets/login-bg.png);
															
 
																+  background-size: 100% 100%;
															
 
																+  .login_form {
															
 
																+    position: absolute;
															
 
																+    top: 227px;
															
 
																+    left: 700px;
															
 
																+    width: 446px;
															
 
																+    .form_logo {
															
 
																+      width: 140px;
															
 
																+      height: 35px;
															
 
																+      img {
															
 
																+        width: 100%;
															
 
																+        height: 100%;
															
 
																+      }
															
 
																+    }
															
 
																+    .form_title {
															
 
																+      font-size: 48px;
															
 
																+      margin: 20px 0 40px;
															
 
																+      font-weight: bold;
															
 
																+    }
															
 
																+
															
 
																+    .form_svg {
															
 
																+      color: $bg;
															
 
																+      margin: 0 10px;
															
 
																+      cursor: pointer;
															
 
																+    }
															
 
																+
															
 
																+    :deep .el-form-item {
															
 
																+      height: 48px;
															
 
																+      border: 1px solid rgba(255, 255, 255, 0.1);
															
 
																+      background: $cursor;
															
 
																+      border-radius: 5px;
															
 
																+      color: #454545;
															
 
																+      margin-bottom: 50px;
															
 
																+    }
															
 
																+
															
 
																+    :deep .el-input {
															
 
																+      flex: 1;
															
 
																+      height: 48px;
															
 
																+    }
															
 
																+
															
 
																+    .form_button {
															
 
																+      width: 100%;
															
 
																+      height: 48px;
															
 
																+      margin-bottom: 30px;
															
 
																+      font-size: 16px;
															
 
																+    }
															
 
																+  }
															
 
																+
															
 
																+  .img_group {
															
 
																+    position: absolute;
															
 
																+    top: 364px;
															
 
																+    left: 20px;
															
 
																+    width: 403px;
															
 
																+    height: 351px;
															
 
																+    img {
															
 
																+      width: 100%;
															
 
																+      height: 100%;
															
 
																+    }
															
 
																+  }
															
 
																+  .img_people {
															
 
																+    position: absolute;
															
 
																+    top: 491px;
															
 
																+    left: 78px;
															
 
																+    width: 123px;
															
 
																+    height: 440px;
															
 
																+    img {
															
 
																+      width: 100%;
															
 
																+      height: 100%;
															
 
																+    }
															
 
																+  }
															
 
																+  .img_office {
															
 
																+    position: absolute;
															
 
																+    top: 582px;
															
 
																+    right: 0;
															
 
																+    width: 465px;
															
 
																+    height: 265px;
															
 
																+    img {
															
 
																+      width: 100%;
															
 
																+      height: 100%;
															
 
																+    }
															
 
																+  }
															
 
																+}
															
 
																+</style>
															
--- a/src/views/login/rules.js
+++ b/src/views/login/rules.js
@@ -0,0 +1,9 @@
 
																+export const validatePassword = () => {
															
 
																+  return (rule, value, callback) => {
															
 
																+    if (value.length < 6) {
															
 
																+      callback(new Error('密码不能少于6位'))
															
 
																+    } else {
															
 
																+      callback()
															
 
																+    }
															
 
																+  }
															
 
																+}
															
--- a/src/views/project-management/index.vue
+++ b/src/views/project-management/index.vue
@@ -0,0 +1,370 @@
 
																+<template>
															
 
																+  <div>
															
 
																+    <el-card class="content">
															
 
																+      <!-- 标题区域 -->
															
 
																+      <el-row class="card_title">项目管理</el-row>
															
 
																+
															
 
																+      <!-- 筛选区域 -->
															
 
																+      <el-row :gutter="35" class="card_search">
															
 
																+        <el-col :span="5">
															
 
																+          姓名:
															
 
																+          <el-input
															
 
																+            style="width: 180px"
															
 
																+            placeholder="请输入姓名"
															
 
																+            clearable
															
 
																+            v-model="searchName"
															
 
																+          ></el-input>
															
 
																+        </el-col>
															
 
																+
															
 
																+        <el-col :span="5">
															
 
																+          单位名称:
															
 
																+          <el-input
															
 
																+            style="width: 180px"
															
 
																+            placeholder="请输入单位名称"
															
 
																+            clearable
															
 
																+            v-model="searchAddress"
															
 
																+          ></el-input>
															
 
																+        </el-col>
															
 
																+
															
 
																+        <el-col :span="5">
															
 
																+          手机号码:
															
 
																+          <el-input
															
 
																+            style="width: 180px"
															
 
																+            placeholder="请输入手机号码"
															
 
																+            clearable
															
 
																+            v-model="searchPhone"
															
 
																+          ></el-input>
															
 
																+        </el-col>
															
 
																+
															
 
																+        <el-col :span="5">
															
 
																+          提交时间:
															
 
																+          <el-date-picker
															
 
																+            type="date"
															
 
																+            placeholder="请选择提交时间"
															
 
																+            value-format="YYYY-MM-DD"
															
 
																+            v-model="searchTime"
															
 
																+          />
															
 
																+        </el-col>
															
 
																+
															
 
																+        <el-col :span="4">
															
 
																+          <el-button type="primary" @click="handleSearch">
															
 
																+            <el-icon><Search /></el-icon>
															
 
																+            <span> 查询</span>
															
 
																+          </el-button>
															
 
																+        </el-col>
															
 
																+      </el-row>
															
 
																+
															
 
																+      <!-- 导出表单按钮区域 -->
															
 
																+      <el-row class="card_button">
															
 
																+        <el-button type="primary" @click="hanleExportForm">
															
 
																+          <el-icon><Download /></el-icon>
															
 
																+          <span> 导出表单</span>
															
 
																+        </el-button>
															
 
																+      </el-row>
															
 
																+
															
 
																+      <!-- 表格区域 -->
															
 
																+      <el-table
															
 
																+        stripe
															
 
																+        height="481"
															
 
																+        :data="tableData"
															
 
																+        style="width: 100%"
															
 
																+        :header-cell-style="{ backgroundColor: '#F0F3F7' }"
															
 
																+        @select="handleCurrentChangeTable"
															
 
																+        @select-all="handleCurrentChangeAll"
															
 
																+      >
															
 
																+        <el-table-column type="selection" width="55" />
															
 
																+        <el-table-column width="100" align="center" prop="name" label="姓名" />
															
 
																+        <el-table-column
															
 
																+          width="150"
															
 
																+          align="center"
															
 
																+          prop="phone"
															
 
																+          label="手机号码"
															
 
																+        />
															
 
																+        <el-table-column
															
 
																+          width="200"
															
 
																+          align="center"
															
 
																+          show-overflow-tooltip
															
 
																+          prop="company"
															
 
																+          label="单位名称"
															
 
																+        />
															
 
																+        <el-table-column
															
 
																+          align="center"
															
 
																+          show-overflow-tooltip
															
 
																+          prop="content"
															
 
																+          label="事件登记"
															
 
																+        />
															
 
																+        <el-table-column
															
 
																+          width="200"
															
 
																+          align="center"
															
 
																+          prop="reportingTime"
															
 
																+          label="提交时间"
															
 
																+        />
															
 
																+        <el-table-column width="200" align="center" label="操作">
															
 
																+          <template #default="{ row }">
															
 
																+            <el-button type="success" plain @click="handleCheckDetail(row)"
															
 
																+              >详情</el-button
															
 
																+            >
															
 
																+            <el-button
															
 
																+              v-if="store.getters.userInfo.adminType == 1"
															
 
																+              type="danger"
															
 
																+              plain
															
 
																+              @click="handleDelete(row.id)"
															
 
																+              >删除</el-button
															
 
																+            >
															
 
																+          </template>
															
 
																+        </el-table-column>
															
 
																+      </el-table>
															
 
																+
															
 
																+      <!-- 分页器区域 -->
															
 
																+      <el-row class="card_pagination">
															
 
																+        <el-pagination
															
 
																+          v-model:current-page="currentPage"
															
 
																+          v-model:page-size="pageSize"
															
 
																+          :page-sizes="[8, 20, 50, 100]"
															
 
																+          layout="total, sizes, prev, pager, next, jumper"
															
 
																+          :total="total"
															
 
																+          @size-change="handleSizeChange"
															
 
																+          @current-change="handleCurrentChange"
															
 
																+        />
															
 
																+      </el-row>
															
 
																+    </el-card>
															
 
																+
															
 
																+    <!-- 详情弹窗区域 -->
															
 
																+    <el-dialog
															
 
																+      v-model="dialogVisible"
															
 
																+      title="详情"
															
 
																+      width="40%"
															
 
																+      top="20vh"
															
 
																+      :close-on-click-modal="false"
															
 
																+    >
															
 
																+      <div class="dialog_box">
															
 
																+        <div class="dialog_item">
															
 
																+          <span>姓名:</span>
															
 
																+          {{ dialogInfo.name }}
															
 
																+        </div>
															
 
																+        <div class="dialog_item">
															
 
																+          <span>单位名称:</span>
															
 
																+          {{ dialogInfo.company }}
															
 
																+        </div>
															
 
																+        <div class="dialog_item">
															
 
																+          <span>手机号码:</span>
															
 
																+          {{ dialogInfo.phone }}
															
 
																+        </div>
															
 
																+        <div class="dialog_item">
															
 
																+          <span>提交时间:</span>
															
 
																+          {{ dialogInfo.reportingTime }}
															
 
																+        </div>
															
 
																+        <div class="dialog_item">
															
 
																+          <span>事件登记:</span>
															
 
																+          <div>
															
 
																+            {{ dialogInfo.content }}
															
 
																+          </div>
															
 
																+        </div>
															
 
																+      </div>
															
 
																+    </el-dialog>
															
 
																+  </div>
															
 
																+</template>
															
 
																+
															
 
																+<script setup>
															
 
																+import { onMounted, ref } from 'vue'
															
 
																+import { useStore } from 'vuex'
															
 
																+import { ElMessage, ElMessageBox } from 'element-plus'
															
 
																+import { getProjectList, deleteProjectList } from '@/api/project'
															
 
																+
															
 
																+const store = useStore()
															
 
																+
															
 
																+const downIds = ref([])
															
 
																+
															
 
																+const handleCurrentChangeTable = (list) => {
															
 
																+  downIds.value = []
															
 
																+  if (list.length !== 0) {
															
 
																+    list.forEach((item) => {
															
 
																+      downIds.value.push(item.id)
															
 
																+    })
															
 
																+  }
															
 
																+  console.log(downIds.value)
															
 
																+}
															
 
																+
															
 
																+const handleCurrentChangeAll = (list) => {
															
 
																+  downIds.value = []
															
 
																+  if (list.length !== 0) {
															
 
																+    list.forEach((item) => {
															
 
																+      downIds.value.push(item.id)
															
 
																+    })
															
 
																+  }
															
 
																+  console.log(downIds.value)
															
 
																+}
															
 
																+
															
 
																+// 获取项目管理列表
															
 
																+const getData = async () => {
															
 
																+  const res = await getProjectList({
															
 
																+    name: searchName.value,
															
 
																+    phone: searchPhone.value,
															
 
																+    company: searchAddress.value,
															
 
																+    reportingTime: searchTime.value,
															
 
																+    currPage: currentPage.value,
															
 
																+    pageSize: pageSize.value
															
 
																+  })
															
 
																+  // console.log(res)
															
 
																+  tableData.value = res.list
															
 
																+  total.value = res.totalCount
															
 
																+  currentPage.value = res.currPage
															
 
																+}
															
 
																+
															
 
																+onMounted(() => {
															
 
																+  getData()
															
 
																+})
															
 
																+
															
 
																+// 筛选区域绑定数据
															
 
																+const searchName = ref('')
															
 
																+const searchAddress = ref('')
															
 
																+const searchPhone = ref('')
															
 
																+const searchTime = ref('')
															
 
																+
															
 
																+// 点击查询按钮回调
															
 
																+const handleSearch = () => {
															
 
																+  // ElMessage.success('查询')
															
 
																+  getData()
															
 
																+}
															
 
																+
															
 
																+// 导出表单按钮回调
															
 
																+const hanleExportForm = () => {
															
 
																+  ElMessageBox.confirm('确定导出表单吗？', '提示', {
															
 
																+    confirmButtonText: '确定',
															
 
																+    cancelButtonText: '取消',
															
 
																+    type: 'warning'
															
 
																+  })
															
 
																+    .then(() => {
															
 
																+      window.location.href = `/reporting/informationReporting/download?name=${searchName.value}&phone=${searchPhone.value}&company=${searchAddress.value}&reportingTime=${searchTime.value}&ids=${downIds.value}`
															
 
																+    })
															
 
																+    .catch(() => {
															
 
																+      ElMessage.info('取消')
															
 
																+    })
															
 
																+}
															
 
																+
															
 
																+// 点击详情按钮回调
															
 
																+const handleCheckDetail = (row) => {
															
 
																+  dialogVisible.value = true
															
 
																+  dialogInfo.value = row
															
 
																+}
															
 
																+
															
 
																+// 点击删除按钮回调
															
 
																+const handleDelete = (id) => {
															
 
																+  ElMessageBox.confirm('确定删除吗？', '提示', {
															
 
																+    confirmButtonText: '确定',
															
 
																+    cancelButtonText: '取消',
															
 
																+    type: 'warning'
															
 
																+  })
															
 
																+    .then(async () => {
															
 
																+      const res = await deleteProjectList({
															
 
																+        name: store.getters.userInfo.name,
															
 
																+        id: store.getters.userInfo.id,
															
 
																+        ids: [id]
															
 
																+      })
															
 
																+      // console.log(res)
															
 
																+      if (res == null) {
															
 
																+        ElMessage.success('删除成功')
															
 
																+        getData()
															
 
																+      }
															
 
																+    })
															
 
																+    .catch(() => {
															
 
																+      ElMessage.info('已取消')
															
 
																+    })
															
 
																+}
															
 
																+
															
 
																+// 控制详情弹窗显示隐藏
															
 
																+const dialogVisible = ref(false)
															
 
																+
															
 
																+const dialogInfo = ref({})
															
 
																+
															
 
																+// 一共多少条
															
 
																+const total = ref(0)
															
 
																+// 分页器当前页
															
 
																+const currentPage = ref(1)
															
 
																+// 每页条数
															
 
																+const pageSize = ref(8)
															
 
																+
															
 
																+// 改变每页条数回调
															
 
																+const handleSizeChange = (val) => {
															
 
																+  // console.log(`每条${val}页`)
															
 
																+  pageSize.value = val
															
 
																+  getData()
															
 
																+}
															
 
																+// 改变当前页回调
															
 
																+const handleCurrentChange = (val) => {
															
 
																+  // console.log(`当前页: ${val}`)
															
 
																+  currentPage.value = val
															
 
																+  getData()
															
 
																+}
															
 
																+
															
 
																+// 表格数据
															
 
																+const tableData = ref([])
															
 
																+</script>
															
 
																+
															
 
																+<style lang="scss" scoped>
															
 
																+.content {
															
 
																+  width: 1650px;
															
 
																+  height: 782px;
															
 
																+
															
 
																+  ::v-deep .el-card__body {
															
 
																+    padding: 0 27px;
															
 
																+  }
															
 
																+
															
 
																+  .card_title {
															
 
																+    line-height: 58px;
															
 
																+    font-size: 17px;
															
 
																+    font-weight: bold;
															
 
																+    border-bottom: 2px solid #d9d9d9;
															
 
																+  }
															
 
																+  .card_search {
															
 
																+    line-height: 85px;
															
 
																+    font-size: 13px;
															
 
																+    font-weight: bold;
															
 
																+  }
															
 
																+  .card_button {
															
 
																+    height: 53px;
															
 
																+  }
															
 
																+
															
 
																+  .card_pagination {
															
 
																+    float: right;
															
 
																+    line-height: 96px;
															
 
																+  }
															
 
																+}
															
 
																+
															
 
																+.dialog_box {
															
 
																+  height: 430px;
															
 
																+  .dialog_item {
															
 
																+    margin-bottom: 10px;
															
 
																+    height: 35px;
															
 
																+    color: #4d4d4d;
															
 
																+    font-size: 15px;
															
 
																+    span {
															
 
																+      font-weight: bold;
															
 
																+    }
															
 
																+
															
 
																+    div {
															
 
																+      height: 210px;
															
 
																+      margin-top: 10px;
															
 
																+      overflow-y: auto;
															
 
																+    }
															
 
																+  }
															
 
																+}
															
 
																+
															
 
																+::v-deep .el-button--primary {
															
 
																+  background-color: #0061ff;
															
 
																+}
															
 
																+
															
 
																+::v-deep .el-dialog__header {
															
 
																+  margin: 0;
															
 
																+  font-weight: bold;
															
 
																+  background-color: #edf1f5;
															
 
																+}
															
 
																+
															
 
																+::v-deep
															
 
																+  .el-table--striped
															
 
																+  .el-table__body
															
 
																+  tr.el-table__row--striped.el-table__row--striped.el-table__row--striped
															
 
																+  td {
															
 
																+  background-color: #f0f3f7;
															
 
																+}
															
 
																+</style>
															
--- a/vue.config.js
+++ b/vue.config.js
@@ -0,0 +1,22 @@
 
																+const { defineConfig } = require('@vue/cli-service')
															
 
																+// node path 引用配置
															
 
																+const NodePolyfillPlugin = require('node-polyfill-webpack-plugin')
															
 
																+
															
 
																+module.exports = defineConfig({
															
 
																+  transpileDependencies: true,
															
 
																+  devServer: {
															
 
																+    // 配置反向代理
															
 
																+    proxy: {
															
 
																+      // 当地址中有/api的时候会触发代理机制
															
 
																+      '/reporting': {
															
 
																+        // 要代理的服务器地址  这里不用写 api
															
 
																+        target: 'https://chtech.ncjti.edu.cn/gradiate-school',
															
 
																+        changeOrigin: true // 是否跨域
															
 
																+      }
															
 
																+    }
															
 
																+  },
															
 
																+  // node path 引用配置
															
 
																+  configureWebpack: {
															
 
																+    plugins: [new NodePolyfillPlugin()]
															
 
																+  }
															
 
																+})