thinkphp+vue+antpro前后端权限管理系统

大恒大

已于 2022-08-18 02:46:46 修改

阅读量697

点赞数

分类专栏： VUE 笔记文章标签： vue.js javascript 前端

于 2022-08-18 01:36:03 首次发布

本文链接：https://blog.csdn.net/kindmb/article/details/126397234

版权

笔记同时被 2 个专栏收录

16 篇文章 0 订阅

订阅专栏

VUE

6 篇文章 0 订阅

订阅专栏

有位网友上传的完整理系统，Thinkphp6.0-Antd-vue前后端权限管理系统

开发环境安装部署如下：

服务端

git clone https://gitee.com/ShiXingXinYa/Thinkphp6.0-Antd-vue.git
composer install

安装php>7.4
安装redis，PHP.INI开启redis
安装mysql，建库，导入/antsign.sql
配置database.php

php think run
跑起在8000端口，可以直接访问，但发布的前端好像有点问题

客户端 antdpro3.02

git clone https://gitee.com/ShiXingXinYa/ant-design-pro-vue-3.0.2.git
yarn install
配置vue.config.js的devproxy

  devServer: {
    // development server port 8000
    port: 8002,
    // If you want to turn on the proxy, please remove the mockjs /src/main.jsL11
    proxy: {
      '/api': {
        target: 'http://127.0.0.1:8000',
        ws: false,
        changeOrigin: true
      }
    }
  },

yarn run serve

服务器发布

测试成功，上传服务器，分别建立静态与动态站点，对API进行NGIX反向代理，apache开启伪静态
在antdpro/src/public中添加.htaccess，以便每次编译都能开启伪静态

<IfModule mod_rewrite.c>
  RewriteEngine On    #重写引擎
  RewriteBase /
  RewriteRule ^index\.html$ - [L]
  RewriteCond %{REQUEST_FILENAME} !-f
  RewriteCond %{REQUEST_FILENAME} !-d
  RewriteRule . /index.html [L]
</IfModule>

参见https://editor.csdn.net/md/?articleId=126245219

antdpro3.02升级到3.03

main.js

import { TreeSelect, Tree } from 'ant-design-vue' //添加此行，在权限设置中用

// mock
// WARNING: `mockjs` NOT SUPPORT `IE` PLEASE DO NOT USE IN `production` ENV.
// import './mock'           //此行改动，注销MOCK

import bootstrap from './core/bootstrap'
import './core/lazy_use' // use lazy load components
import './permission' // permission control
import './utils/filter' // global filter
import './global.less' // global style

Vue.config.productionTip = false
Vue.use(TreeSelect)  //添加此行
Vue.use(Tree)        //添加此行

api/login.js，替换API列表

const userApi = {
  Login: '/auth/login',
  Logout: '/auth/logout',
  ForgePassword: '/auth/forge-password',
  Register: '/auth/register',
  twoStepCode: '/auth/2step-code',
  SendSms: '/account/sms',
  SendSmsErr: '/account/sms_err',
  // get my info
  UserInfo: '/user/info',
  UserMenu: '/user/nav'
}

改src\router\generator-routers.js，增加view页面：

  // 角色管理
  Rules: () => import('@/views/system/rules/index'),
  Roles: () => import('@/views/system/roles/index'),
  // psy
  PsyManager: () => import('@/views/psy/typeManager/index'),
  PsyType: () => import('@/views/psy/typeManager/index'),
 
  QuestionManager: () => import('@/views/psy/questionManager/index'),
  //个人设置
  BaseSettings: () => import('@/views/account/settings/BaseSetting'),

复制文件：

api/psyManager.js,system.js
src\views\account\settings\BaseSetting.vue
src\views\list\modules\QuestionForm.vue    RulesForm.vue
src\views\system\*
src\views\psy\*