編寫后臺模塊 · thinkphp5.1快速開發

首先我們將創建一下基礎目錄，如下圖所示 ![](https://box.kancloud.cn/bd9b05b5cc8cee51ba1e8b554701adb4_256x542.png) ``` admin模塊 |- controller command 命令行目錄 model 模型目錄 traits trait目錄 validate 驗證目錄 view 目錄直接單獨放在根目錄下，本人習慣而已 ``` 因為 view 目錄在根目錄下面，所以要做一些改變，首先修改配置文件 template.php ``` // 模板路徑 'view_path' => env('root_path') . 'view' . DIRECTORY_SEPARATOR, ``` 然后需要重寫 fetch 方法，再次基礎上所以必須建立基類控制器, admin\controller\Base.php ``` namespace app\admin\controller; use think\Controller; class Base extends Controller { protected $vars; protected function fetch($template = '', $vars = [], $config = []) { $template = strtolower($this->request->module()) . DIRECTORY_SEPARATOR . strtolower($this->request->controller()) . DIRECTORY_SEPARATOR . ($template ? $template : strtolower($this->request->action())); if (count($this->vars)) { $vars = array_merge($vars, $this->vars); } return $this->view->fetch($template, $vars, $config); } // 這里是為了屬性的賦值模板分配 public function __set($name, $value) { // TODO: Implement __set() method. $this->vars[$name] = $value; } } ``` ### 另外一種方法 ``` 'view_base' => env('root_path') . 'views' . DIRECTORY_SEPARATOR, // 直接添加 view_base 配置就可以了 ``` 這樣就可以開始了。 ### 創建基類模型這里創建抽象模型 application\model\AbstractBase.php，約定必須實現其中的四個抽象方法，以及約定模型文件必須以Model結尾 ``` namespace app\model; use think\Model; use think\db\Where; abstract class AbstractBase extends Model { // 時間戳自動更新 protected $autoWriteTimestamp = 'datetime'; protected $createTime = 'created_at'; protected $updateTime = false; public function initialize() { parent::initialize(); // 這里為了簡化模型使用，所以這里就講自動設置表名 $m = explode('\\', get_called_class()); $modelName = array_pop($m); if (strpos($modelName, 'Model') !== false) { $this->name = substr($modelName, 0, -strpos($modelName, 'Model')-1); } } // 以下是必須實現的四個方法 public abstract function store($data); public abstract function updateBy($id, $data); public abstract function findBy($id); public abstract function deleteBy($id); public function conditions($where) { return (new Where($where)); } } ``` ## view的編寫后臺模塊用的是這個 [https://download.csdn.net/download/qq_31470439/10707283]() 還是挺好看的。有興趣的可以下載使用,還需要**ajaxform**和**sweetalert**插件創建一個基類模板 view\admin\public\base.html ``` <!DOCTYPE html> <html lang="zh-cn"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <title>后臺管理-<block name="title"></block></title> <meta name="description" content="Elisyam is a Web App and Admin Dashboard Template built with Bootstrap 4"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <link rel="apple-touch-icon" sizes="180x180" href="/assets/img/apple-touch-icon.png"> <link rel="icon" type="image/png" sizes="32x32" href="/assets/img/favicon-32x32.png"> <link rel="icon" type="image/png" sizes="16x16" href="/assets/img/favicon-16x16.png"> <link rel="stylesheet" href="/assets/css/animate/animate.min.css">  <link rel="stylesheet" href="/assets/vendors/css/base/bootstrap.min.css"> <link rel="stylesheet" href="/assets/vendors/css/base/elisyam-1.2.min.css">  <block name="css"></block> <style> .pagination li a { position: relative; display: block; padding: .5rem .75rem; margin-left: -1px; line-height: 1.25; color: #007bff; background-color: #fff; border: 1px solid #dee2e6; } .pagination li.active { position: relative; display: block; padding: .5rem .75rem; margin-left: -1px; line-height: 1.25; z-index: 1; color: #fff; background-color: #007bff; border-color: #007bff; } .pagination li.disabled { position: relative; display: block; padding: .5rem .75rem; margin-left: -1px; line-height: 1.25; color: #007bff; background-color: #fff; border: 1px solid #dee2e6; } </style>  </head> <body id="page-top"> <div class="container-fluid">  <div class="row"> <div class="page-header"> <div class="d-flex align-items-center"> <h2 class="page-header-title"><block name="button"></block></h2> <div> <ul class="breadcrumb"> <li class="breadcrumb-item"><a href="{:url('admin/index/index')}"><i class="ti ti-home"></i></a></li> <li class="breadcrumb-item active"><block name="title"></block></li> </ul> </div> </div> </div> </div> <div class="row"> <div class="col-xl-12"> <div class="widget has-shadow"> <div class="widget-header bordered no-actions d-flex align-items-center"> <h4><block name="title"></block></h4> </div> <div class="widget-body"> <block name="content"></block> </div> </div> </div> </div> </div> <script src="/assets/vendors/js/base/jquery.min.js"></script> <script src="/assets/vendors/js/base/core.min.js"></script> <script src="/assets/vendors/js/nicescroll/nicescroll.min.js"></script> <script src="/assets/vendors/js/noty/noty.min.js"></script> <script src="/assets/js/components/notifications/notifications.min.js"></script> <script src="/assets/js/jquery.form.js"></script> <script src="/assets/js/components/validation/validation.min.js"></script> <script src="https://unpkg.com/sweetalert/dist/sweetalert.min.js"></script> <script> $('form').ajaxForm(function(response) { if (!response.code) { message(response.msg, 'error'); } else { message(response.msg, 'success') setTimeout(function(){ window.location.href = response.url },response.wait * 1000); } }); $('.delete').click(function () { swal({ title: "確認刪除嗎?", text: "一旦刪除, 資源就無法恢復了", icon: "warning", buttons: true, dangerMode: true, }).then((willDelete) => { if (willDelete) { $.post($(this).attr('data-url'), {id : $(this).attr('data')}, function (response) { if (!response.code) { message(response.msg, 'error'); } else { message(response.msg, 'success') setTimeout(function(){ window.location.href = response.url },response.wait * 1000); } }) } }); }) // 提示插件 function message(msg, type = 'info') { new Noty({ type: type, layout: "topRight", text: msg, progressBar: true, timeout: 2500, animation: { open: "animated bounceInRight", close: "animated bounceOutRight" } }).show() } $(function () { $('[data-toggle="popover"]').popover() }) </script> </body> </html>  <block name="js"></block> ``` 此后模板文件都會繼承這個基類模板。