layui学习笔记(一) 关于layuiAdmin pro+ThinkPHP6部署方案(更新)

 今日发现有很多朋友都在收藏此部署方案,这个方案相对来说比较老旧了,随着layui的不断更新,我把部署的内容做一下简单的更新。(20240616)

layuiAdmin pro 是完全基于 layui 架构而成的后台管理模板系统,可以更轻松地实现前后端分离,它是mvc 的简化版,全面接管 视图页面路由,并可自主完成数据渲染,服务端通常只负责数据接口,而前端只需专注视图和事件交互,所有的页面动作都是在一个宿主页面中完成,因此这赋予了layuiAdmin 单页面应用开发的能力。

由于 layuiAdmin pro 可采用前后端分离开发模式,因此你无需将其放置在你的服务端 MVC 框架中,你只需要给 layuiAdmin 主入口页面(我们也称之为: 宿主页面)进行访问解析,它即可全权完成自身路由的跳转和视图的呈现,而数据层则完全通过服务端提供的异步接口来完成。

因layuiAdmin pro需要版权,所以切记,一切以学习为主,禁止商用。

我所使用的layuiAdmin pro来自于网络,仅供学习使用。

学习使用的版本:

layuiAdmin pro v2.5.0【layui 更新到2.9.11】

 以下是纯手工还原的layuiadmin pro和std版本。切记仅供学习使用。

LayuiAdmin pro2.5.0,纯手工还原,源码仅限学习使用,请勿商用及传播。 

LayuiAdmin std 2.3.2,纯手工还原,源码仅限学习使用,请勿商用及传播。

ThinkPHP是一个免费开源的,快速、简单的面向对象的轻量级PHP开发框架,是为了敏捷WEB应用开发和简化企业应用开发而诞生的。ThinkPHP从诞生以来一直秉承简洁实用的设计原则,在保持出色的性能和至简代码的同时,更注重易用性。遵循Apache2开源许可协议发布,意味着你可以免费使用ThinkPHP,甚至允许把你基于ThinkPHP开发的应用开源或商业产品发布/销售。

学习使用的版本:

ThinkPHP6 v6.1.4

 注:如果你的开发最终选择了layuiadmin pro为前端,那么就要清楚,layuiadmin pro是mvc 的简化版,全面接管 视图页面路由,服务端通常只负责数据接口。要放弃ThinkPHP6的视图和路由等。

一、layuiadmin pro + ThinkPHP6的初步部署。

安装thinkphp6:composer create-project topthink/think tp 

【tp为下载目录,下载后可自行剪切到想要放置的目录下】

应用视图:composer require topthink/think-view

【虽说layuiadmin pro全面接管了视图页面,但是这里安装tp6的视图的作用是,部署layuiadmin的宿主页面】

 验证码安装:composer require topthink/think-captcha

【主要应用于登录】

如项目为前台+后台,那么需要多应用模式:composer require topthink/think-multi-app
多应用模式下,添加admins应用和index应用
php think build admins
php think build index

 具体关于ThinkPHP6的安装,请查看官方开发手册。

安装 · ThinkPHP6.0完全开发手册 · 看云

本例以多应用模式为例

1.将 layuiadmin pro文件夹下的res两个文件夹复制到 /public/目录下。

 2.将layuiadmin pro文件夹下的index.html,剪切到/app/view/index/目录下。

修改静态资源路径,并配置version属性实时更新缓存。version: new Date().getTime()

3.关于{__CCADMINS__}的配置模板输出替换设置,在config/view.php下

 4.首页控制器方法   /app/controller/Index.php

 

 5.控制器的接口路径配置

 做完映射后,再配合.htaccess 的配置(后面有介绍),后端接口就可以写成如下:

/ccadmins/Menu/index   ,  对应目录为admins/controller/Menu.php文件下的index控制器方法。

6.设置错误页面,如果页面找不到就提示错误页面

 在app/controller下创建Error.php文件,

在view创建template文件夹,在template文件夹下创建error.html

 设置后如果页面找不到就会提示如下错误页面。错误页面可根据自己喜好自定义内容。

二、配置.htaccess 

<IfModule mod_rewrite.c>
  Options +FollowSymlinks -Multiviews
  RewriteEngine On

  RewriteCond %{REQUEST_FILENAME} !-d
  RewriteCond %{REQUEST_FILENAME} !-f
  RewriteRule ^(.*)$ index.php?/$1 [QSA,PT,L]
</IfModule>
  • RewriteRule ^(.*)$ index.php?/$1 [QSA,PT,L]   中的【?】是关键。

在配置admin.req的url接口文件时可直接使用方法。

如:url: "/menu/menu_del", 

直接调取控制器menu下的menu_del方法。

说明:网上有很多方法都是在控制器里做跳转:return redirect('/start'),所以导致打开项目时,浏览器地址栏里的地址都会跳转:http://localhost/start/#/  看起来项目像是在二级目录里,对于有强迫症的程序员来说是很不舒服的。

所以配置tp6视图可以解决此问题,http://localhost/#/  

到这基础就配置完了,剩下的可以自己再研究一下。

  • 28
    点赞
  • 18
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 4
    评论
要在前端显示导出进度条,可以使用layui的layer和jquery库来实现。在导出数据的过程中,可以通过计算已经导出的行数和总行数来计算出导出进度,并将其传递给前端页面。然后,利用ajax轮询的方式来获取导出进度,并更新进度条的显示。以下是示例代码: 1.前端页面代码: ```html <!-- 导出按钮 --> <button class="layui-btn layui-btn-normal" onclick="exportData()">导出数据</button> <!-- 进度条 --> <div class="layui-progress layui-progress-big" lay-showPercent="true" style="display:none; margin-top:15px;"> <div class="layui-progress-bar layui-bg-green" lay-percent="0%"></div> </div> <!-- 引入jquery和layui的layer库 --> <script src="https://cdn.bootcss.com/jquery/3.5.1/jquery.min.js"></script> <script src="https://cdn.bootcss.com/layer/3.1.1/layer.min.js"></script> <script> // 导出数据 function exportData() { // 显示进度条 $('.layui-progress').show(); // 发送ajax请求导出数据 $.ajax({ type: 'post', url: '/index/export', dataType: 'json', success: function(res) { // 隐藏进度条 $('.layui-progress').hide(); // 下载导出的文件 window.location.href = res.fileUrl; }, error: function() { // 隐藏进度条 $('.layui-progress').hide(); // 弹出错误提示 layer.msg('导出数据失败,请稍后重试!', {icon: 2}); } }); // 定时获取导出进度 var timer = setInterval(function() { $.ajax({ type: 'get', url: '/index/getExportProgress', dataType: 'json', success: function(res) { // 更新进度条显示 $('.layui-progress-bar').attr('lay-percent', res.progress + '%'); $('.layui-progress-bar').css('width', res.progress + '%'); // 导出完成,清除定时器 if (res.progress == 100) { clearInterval(timer); } } }); }, 1000); } </script> ``` 2.控制器代码: ```php // 导出数据 public function export() { try { // 省略从数据库中获取数据的代码 // ... // 获取总行数 $totalCount = count($data); // 初始化PHPExcel和PHPExcel_IOFactory require_once 'PHPExcel/PHPExcel.php'; require_once 'PHPExcel/IOFactory.php'; // 创建PHPExcel对象 $objPHPExcel = new PHPExcel(); // 创建第一个工作表 $sheet = $objPHPExcel->getActiveSheet(); // 省略将数据写入PHPExcel对象中的代码 // ... // 开始导出 ob_start(); $objWriter = PHPExcel_IOFactory::createWriter($objPHPExcel, 'Excel2007'); $objWriter->save('php://output'); $excelData = ob_get_clean(); // 生成导出文件名 $fileName = date('YmdHis') . '.xlsx'; $fileUrl = 'public/export/' . $fileName; // 保存导出文件 file_put_contents($fileUrl, $excelData); // 返回导出结果 return json([ 'fileUrl' => $fileUrl, ]); } catch (Exception $e) { // 导出数据失败,返回错误提示 return json([ 'code' => -1, 'msg' => '导出数据失败,请稍后重试!', ]); } } // 获取导出进度 public function getExportProgress() { // 获取当前导出进度 $progress = session('export_progress'); // 计算导出进度百分比 if ($progress['current'] == 0) { $percent = 0; } else { $percent = floor($progress['current'] / $progress['total'] * 100); } // 返回导出进度百分比 return json([ 'progress' => $percent, ]); } ``` 在以上代码中,我们利用ajax发送导出数据的请求,并在前端页面上显示进度条。然后,我们在控制器中逐行导出数据,并计算出导出进度,并将导出进度存储到session中。最后,我们通过ajax轮询的方式来获取导出进度,并更新进度条的显示。当导出完成时,我们返回导出结果并清除轮询定时器。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 4
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

ccadmins

你的鼓励是我创作的最大动力!

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值