• 技术文章 >php框架 >ThinkPHP

    解析yylAdmin系统的安装使用

    藏色散人藏色散人2021-08-03 09:04:26转载321

    yylAdmin

    Gitee:https://gitee.com/skyselang/yylAdmin

    Github:https://github.com/skyselang/yylAdmin

    简介

    yylAdmin是一个极简后台管理系统,只有登录退出、权限管理、日志管理等基本功能,方便扩展;前后端分离,后端采用ThinkPHP6,前端采用Vue2;项目由后端yylAdmin和前端yylAdminWeb组成。

    • yylAdmin
    • yylAdminWeb

    演示

    地址:https://demo.yyladmin.top/#/login?redirect=%2Fdashboard
    账号:yyladmin、admin
    密码:123456
    提示:演示账号只有部分权限,请下载源码安装体验全部功能

    准备

    • PhpStudy
    • Git
    • Node
    • Composer
    • ThinkPHP
    • Vue
    • Element

    要求

    • PHP >= 7.1
    • MySQL >= 5.6
    • Redis

    安装

    PHP部分

    # 克隆项目
    git clone https://gitee.com/skyselang/yylAdmin.git
    
    # 进入项目目录
    cd yylAdmin
    
    # 安装依赖
    composer install
    
    # 可以通过composer镜像解决速度慢的问题
    composer config -g repo.packagist composer https://mirrors.aliyun.com/composer/
    
    # 导入数据库
    数据库文件:public/private/yyladmin.sql
    
    # 配置
    重命名.env.example为.env,修改里面配置
    或者直接修改config文件夹里面的相应配置

    WEB部分

    # 克隆项目
    git clone https://gitee.com/skyselang/yylAdminWeb.git
    
    # 进入项目目录
    cd yylAdminWeb
    
    # 安装依赖
    npm install
    
    # 可以通过npm镜像解决速度慢的问题
    npm install --registry=https://registry.npm.taobao.org
    # 或者使用cnpm,安装后使用cnpm替代npm,如 cnpm install
    npm install -g cnpm --registry=https://registry.npm.taobao.org
    
    # 配置
    在.env*环境变量文件里面修改接口地址
    
    # 启动服务
    npm run dev

    访问

    地址:http://localhost:9527
    账号:yyladmin
    密码:123456
    管理员:skyselang
    密码:123456

    开发

    以日志管理为例

    PHP部分

    • 编写接口代码:app/admin/controller/AdminLog.php

    <img width="100%" src="./public/static/img/devphp1.jpg">

    • 添加菜单信息

    <img width="100%" src="./public/static/img/devphp2.jpg">

    • 分配相应权限

    <img width="100%" src="./public/static/img/devphp3.jpg">

    WEB部分

    • 新建接口文件:src/api/admin.js

    <img width="100%" src="./public/static/img/devweb1.jpg">

    • 新建页面文件:src/views/admin/log.vue

    <img width="100%" src="./public/static/img/devweb2.jpg">

    • 添加路由信息:src/router/index.js

    <img width="100%" src="./public/static/img/devweb3.jpg">

    刷新权限

    • 退出重新登录

    <img width="100%" src="./public/static/img/devref.jpg">

    发布

    # 构建测试环境
    npm run build:stage
    
    # 构建生产环境
    npm run build:prod

    其它

    # 预览发布环境效果
    npm run preview
    
    # 预览发布环境效果 + 静态资源分析
    npm run preview -- --report
    
    # 代码格式检查
    npm run lint
    
    # 代码格式检查并自动修复
    npm run lint -- --fix

    预览

    <img width="100%" src="./public/static/img/yyladmin_login.jpg">

    <img width="100%" src="./public/static/img/yyladmin.jpg">

    FQA

    npm

    • 推荐使用cnpm:cnpm
    • 删除node_modules文件夹后使用cnpm重新安装依赖

    ui

    • 使用的是element-ui:element-ui

    browser

    • 支持Chrome、Firefox、QQ、360、Edge等主流浏览器,不支持IE以及浏览器的兼容模式(IE内核)

    debug

    • 调试模式下根据接口返回错误信息排查,或者提Issue

    协议

    • Apache2开源协议,完全免费使用
    • Copyright skyselang https://gitee.com/skyselang

    相关推荐:最新的10个thinkphp视频教程

    以上就是解析yylAdmin系统的安装使用的详细内容,更多请关注php中文网其它相关文章!

    声明:本文转载于:segmentfault,如有侵犯,请联系admin@php.cn删除
    专题推荐:php thinkphp vue.js element-ui
    上一篇:Thinkphp+layer+ajax如何完成增加方法(附代码示例) 下一篇:如何建立一个基于Serverless的TP框架应用
    大前端线上培训班

    相关文章推荐

    • 关于web hooks服务器自动拉取代码php thinkphp6• 详解thinkphp6后台添加google登录验证• ThinkPHP6加载中间件及多应用解析• 解析ThinkPHP6应用程序初始化

    全部评论我要评论

  • 取消发布评论发送
  • 1/1

    PHP中文网