TP5.1 Layui (无限级)树形表格treetable
演示地址： https://whvse.gitee.io/treetable-lay/
项目地址： https://gitee.com/whvse/treetable-lay
例子： TP5.1 + Layui 2.4.0
一、模板代码：
导航菜单
注意：
1、插件路径
2、数据源的路径
二、控制器代码
where('level',1)->order('sort desc')->select();
// menujson(0,'ok',$res);
return $this->fetch();
}
/**
* 导航菜单JSON数据
*/
public function menujsondata(){
$res = Db::name('menu')->select();
foreach($res as $k => $rs){
$data[$k]['id']=$rs['id'];
$data[$k]['title']=$rs['title'];
$data[$k]['sort']=$rs['sort'];//排序
$data[$k]['icon']=$rs['icon'];
$data[$k]['hide']=$rs['hide'];
$data[$k]['pid']=$rs['pid'];
}
json(0,'',$count,$data);
}
/**
* 添加栏目、保存
*/
public function add(){
$id=input('id');
$pid=input('pid');
//$level1=input('level');
//$level=input('level');
//$this->assign('level',$level);
//当前
//$level2=input('level');
//$this->assign('level2',$level2);
// $levelx=$level+1;
// $this->assign('levelx',$levelx);
//取得一级栏目
//$column_rs=Db::name('column')->where('level',$level1)->order('sort','desc')->select();
//$this->assign('column_rs',$column_rs);
// $res = Db::name('menu')->where('level',1)->order('sort desc')->select();
// $this->assign('name',$data);
if($id){
$rs=Db::name('menu')->field('id,level,pid,title,position,hide,sort')->where('id',$id)->find();
$this->assign('rs',$rs);
}
if (request()->isPost()){
//$title=input('title');
$data = input('post.');
if(!$data['pid']){
$data['pid']= -1;
}
$validate = Validate::make([
'title' => 'require|max:30',
]);
if (!$validate->check($data)) {
$this->error('错误:'.$validate->getError());
}
$rsi=db('menu')->insert($data);
if($rsi){
$this->success('成功！',url('add',['pid'=>$pid,'level'=>$level-2]));
}else{
$this->error('失败');
}
return;
}
return $this->fetch();
}
}
三、数据库
例子： TP5.1 + Layui 2.4.0(增强版)(完全代码)
1、模板
导航菜单
2、控制器代码
where('level',1)->order('sort desc')->select();
// menujson(0,'ok',$res);
return $this->fetch();
}
/**
* 导航菜单JSON数据
*/
public function menujsondata(){
$res = Db::name('menu')->order('sort', 'desc')->select();
$count = count($res);
foreach($res as $k => $rs){
$data[$k]['id']=$rs['id'];
$data[$k]['name']=$rs['title'];
//先判断是否有下级数据 有则加上参数is_open
$where1['pid']=$rs['id'];
$checkRepeat=checkRepeat('menu',$where1,0);//一种有条件(比如自身修改)的查询重复
if($checkRepeat){
$data[$k]['is_open']=false;//true=展开 false=收起
}
$data[$k]['sort']=$rs['sort'];//排序
$data[$k]['icon']=$rs['icon'];
$data[$k]['hide']=$rs['hide'];
$data[$k]['position']=$rs['position'];
$data[$k]['pId']=$rs['pid'];
}
json(0,'',$count,$data);
}
/**
* 添加栏目、保存
*/
public function add(){
$id=input('id');
$this->assign('id',$id);
$pid=input('pid');
$title=input('title');
$action=input('action');
$this->assign('action',$action);
$field=input('field');
$this->assign('field',$field);
if($id){//更新图标要用
//列出数据
$rs=Db::name('menu')->field('id,icon,position')->where('id',$id)->find();
$this->assign('rs',$rs);
}
//ajax 更新标题
if($action=="ajax_add" && $title){
// echo ($id."|".$pid."|".$title);die;
$data_ajax['title']=$title;
if($pid){
$data_ajax['pid']=$pid;
}
//$rs=db('menu')->insert($data_ajax);
$menuid=db('menu')->insertGetId($data_ajax);
if($menuid){
$arr['code']=1;
$arr['msg']="添加成功";
$arr['title']=$title;
$arr['menuid']=$menuid;
//$se="更新成功";
}else{
$arr['code']=2;
$arr['msg']="添加失败";
$arr['title']=$title;
$arr['menuid']='';
}
return $arr;die;
}
//$level1=input('level');
//$level=input('level');
//$this->assign('level',$level);
//当前
//$level2=input('level');
//$this->assign('level2',$level2);
// $levelx=$level+1;
// $this->assign('levelx',$levelx);
//取得一级栏目
//$column_rs=Db::name('column')->where('level',$level1)->order('sort','desc')->select();
//$this->assign('column_rs',$column_rs);
// $res = Db::name('menu')->where('level',1)->order('sort desc')->select();
// $this->assign('name',$data);
// if($id){
// $rs=Db::name('menu')->field('id,level,pid,title,position,hide,sort')->where('id',$id)->find();
// $this->assign('rs',$rs);
// }
//
// if (request()->isPost()){
//
//
// //$title=input('title');
// $data = input('post.');
//// if(!$data['pid']){
//// $data['pid']= -1;
//// }
// $validate = Validate::make([
// 'title' => 'require|max:30',
// ]);
//
// if (!$validate->check($data)) {
// $this->error('错误:'.$validate->getError());
// }
// $rsi=db('menu')->insert($data);
//
// if($rsi){
// $this->success('成功！',url('add',['pid'=>$pid,'level'=>$level-2]));
// }else{
// $this->error('失败');
// }
//
// return;
// }
return $this->fetch();
}
/**
* 编辑栏目、保存
*/
public function edit(){
$action=input('action');
$id=input('id');
$field=input('field');
$title=input('title');
$icon=input('icon');
$url=input('url');
$sort=input('sort');
$hide=input('hide');
//$position=input('position');
//dump($title);die;
//$spread=input('spread');
//$controller=input('controller');
$pid=input('pid');
//ajax 更新标题
if($action=="ajax_update" && $id){//更新字段值
$field=$field=="name"?"title":$field;//当字段是name是要转换成数据库对应的字段title
$rs=Db::name('menu')->where('id', $id)->update([$field => $title]);
if($rs){
$arr['code']=1;
$arr['msg']="更新成功";
$arr['title']=$title;
//$se="更新成功";
}else{
$arr['code']=2;
$arr['msg']="更新失败";
$arr['title']=$title;
}
if($field=="icon" || $field=="position"){//更新icon图标、位置
return $arr['msg'];die;
}else{
return $arr;die;
}
}
//// if($pid=="a"){
//// $pid=0;
//// }
// $level=input('level');
//
// if(!$id){
// $this->error('错误：ID非空！');
// }
//
// if (request()->isPost()){
//
// $rs=Db::name('column')
// ->where('id', $id)
// ->update(['title' => $title,'icon' => $icon,'url' => $url,'sort' => $sort,'hide' => $hide,'position' => $position,'spread' => $spread,'controller' => $controller,'pid' => $pid]);
//
//
// if($rs){
// //$this->success('成功！',url('add'));
// $this->success('成功！',url('column/add',['id'=>$id,'pid'=>$pid,'level'=>$level-1]));
// }else{
// $this->error('失败！');
// }
//
// return;
// }
// // return $this->fetch();
// return view(add);
}
//栏目列表 读出接口数据
public function columntable()
{
$pid=input('pid');
$flid=input('flid');
$ts_id=input('ts_id');//上报教学站
$page=input('page');//页数
$limit=input('limit');//一页多少条记录
$type=input('type');//搜索分类
$key=input('key');//搜索关键词
$where = new Where;
if($key==""){//不搜索
//级别
if($pid){
$where['pid'] = $pid;
}else{
$where['pid'] = 0;
}
}else{//搜索
//类别
if($type=="id"){
$where[$type] = $key;
}else{
$where['flid'] = $flid;
$where[$type] = ['like',"%".$key."%"];
}
}
$rs=Db::name('menu')->where($where)->order('id desc')->limit($limit)->page($page)->select();
$rs1=Db::name('menu')->where($where)->select();
$count = count($rs1);//取得记录集总条数
json(0,'数据返回成功',$count,$rs);
}
//通用删除
public function del(){
$id=input('id');//id
$dataname="menu";//表名
if(!$id && !$dataname){
$this->error('错误：参数不为空！');
}
$del_info=del($dataname,$id,1,$dataname,'pid');
$del_info = explode(',',$del_info);
if($del_info[0]==1){//1=成功
$date=[1,$del_info[1]];
}elseif($del_info[0]==2){//失败
$date=[0,$del_info[1]];
}
return $date;
}
//图标
public function icon(){
return $this->fetch();
}
}
3、treeTable插件代码有修改
修改treeTable代码在这里打包下载：https://download.csdn.net/download/haibo0668/10638716
插件放置路径按上面例子放
修改dltable.js位置：
1、增加修改字段参数
that.layBody.on('change', '.'+ELEM_EDIT, function(){
2、原代码有BUG，如果第一个数组PID有值，就只会显示一条数据
Class.prototype.resetData=function(list) {
4、edu_menu表代码
/*
Navicat MySQL Data Transfer
Source Server : 本机
Source Server Version : 50553
Source Host : localhost:3306
Source Database : edu_cms
Target Server Type : MYSQL
Target Server Version : 50553
File Encoding : 65001
Date: 2018-09-01 16:26:08
*/
SET FOREIGN_KEY_CHECKS=0;
-- ----------------------------
-- Table structure for `edu_menu`
-- ----------------------------
DROP TABLE IF EXISTS `edu_menu`;
CREATE TABLE `edu_menu` (
`id` int(11) NOT NULL AUTO_INCREMENT,
`model` tinyint(11) DEFAULT '1' COMMENT '模型 1产品(要购买) 2文章 3单页 4bbs 5留言 6招聘',
`icon` varchar(100) DEFAULT NULL COMMENT '图标',
`title` varchar(30) DEFAULT NULL COMMENT '标题',
`pid` int(11) DEFAULT NULL COMMENT '父类id',
`pid_all` varchar(300) DEFAULT NULL COMMENT '所有上级的父类id 18,19,15',
`hide` tinyint(1) DEFAULT '0' COMMENT '显示是否 0显示 1隐藏',
`url` varchar(150) DEFAULT NULL COMMENT '链接',
`sort` int(11) DEFAULT '0' COMMENT '排序',
`level` int(11) DEFAULT '0' COMMENT '层次',
`position` tinyint(4) DEFAULT '1' COMMENT '位置 1顶部 2底部 3都在',
`enterprise_id` int(11) DEFAULT NULL COMMENT '企业ID',
`add_user_id` int(11) DEFAULT NULL COMMENT '添加者ID',
`time` timestamp NULL DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP COMMENT '创建时间',
PRIMARY KEY (`id`)
) ENGINE=MyISAM AUTO_INCREMENT=445 DEFAULT CHARSET=utf8;
-- ----------------------------
-- Records of edu_menu
-- ----------------------------
INSERT INTO `edu_menu` VALUES ('433', '1', null, '人力', '377', '377', '0', null, '0', '1', '1', null, null, '2018-09-01 15:52:00');
INSERT INTO `edu_menu` VALUES ('431', '1', null, '会计', '377', '377', '0', null, '0', '1', '1', null, null, '2018-09-01 15:52:05');
INSERT INTO `edu_menu` VALUES ('291', null, 'thermometer-0', '图书商城', null, null, '0', '', '1', '0', '1', null, null, '2018-08-31 18:45:19');
INSERT INTO `edu_menu` VALUES ('432', '1', null, '教师', '377', '377', '0', null, '0', '1', '1', null, null, '2018-09-01 15:52:03');
INSERT INTO `edu_menu` VALUES ('327', null, null, '录播课程', null, null, '0', null, '10', '0', '2', null, null, '2018-08-31 18:19:32');
INSERT INTO `edu_menu` VALUES ('435', '1', null, '行业新闻', '382', '382', '0', null, '0', '1', '1', null, null, '2018-09-01 15:52:18');
INSERT INTO `edu_menu` VALUES ('342', null, null, '首页', null, null, '0', null, '300', '0', '1', null, null, '2018-08-31 19:16:28');
INSERT INTO `edu_menu` VALUES ('419', '1', null, '中学', '417', '349,417', '0', null, '0', '2', '1', null, null, '2018-09-01 15:50:23');
INSERT INTO `edu_menu` VALUES ('418', '1', null, '小学', '417', '349,417', '0', null, '0', '2', '1', null, null, '2018-09-01 15:50:25');
INSERT INTO `edu_menu` VALUES ('439', '1', null, '公司简介', '384', '384', '0', null, '0', '1', '1', null, null, '2018-09-01 15:52:41');
INSERT INTO `edu_menu` VALUES ('349', '3', null, '直播课程', null, null, '1', null, '200', '0', '3', null, null, '2018-09-01 12:47:42');
INSERT INTO `edu_menu` VALUES ('427', '1', null, 'JS教程', '426', '291,426', '0', null, '0', '2', '1', null, null, '2018-09-01 15:51:39');
INSERT INTO `edu_menu` VALUES ('438', '1', null, '请修改标题', '384', '384', '0', null, '0', '1', '1', null, null, '2018-09-01 15:52:33');
INSERT INTO `edu_menu` VALUES ('357', null, null, '请修改标题2', '355', null, '0', null, '0', '0', '1', null, null, '2018-08-31 10:12:50');
INSERT INTO `edu_menu` VALUES ('421', '1', null, '中学2', '420', '327,420', '0', null, '0', '2', '1', null, null, '2018-09-01 15:50:56');
INSERT INTO `edu_menu` VALUES ('420', '1', null, '教师1', '327', '327', '0', null, '0', '1', '1', null, null, '2018-09-01 15:50:45');
INSERT INTO `edu_menu` VALUES ('417', '1', null, '教师', '349', '349', '0', null, '0', '1', '1', null, null, '2018-09-01 15:50:17');
INSERT INTO `edu_menu` VALUES ('377', null, null, '讲师团队', null, null, '0', null, '0', '0', '1', null, null, '2018-08-31 18:48:39');
INSERT INTO `edu_menu` VALUES ('434', '1', null, '公司新闻', '382', '382', '0', null, '0', '1', '1', null, null, '2018-09-01 15:52:20');
INSERT INTO `edu_menu` VALUES ('382', null, null, '新闻资讯', null, null, '0', null, '0', '0', '1', null, null, '2018-08-31 19:07:03');
INSERT INTO `edu_menu` VALUES ('384', null, null, '关于我们', null, null, '0', null, '0', '0', '1', null, null, '2018-08-31 19:08:15');
INSERT INTO `edu_menu` VALUES ('428', '1', null, 'PHP教程', '426', '291,426', '0', null, '0', '2', '1', null, null, '2018-09-01 15:51:30');
INSERT INTO `edu_menu` VALUES ('426', '1', null, '计算机', '291', '291', '0', null, '0', '1', '1', null, null, '2018-09-01 15:51:26');
INSERT INTO `edu_menu` VALUES ('414', '1', null, '请修改1', '413', '349,413', '0', null, '0', '2', '1', null, null, '2018-09-01 15:49:19');
INSERT INTO `edu_menu` VALUES ('413', '1', null, '自考', '349', '349', '0', null, '0', '1', '1', null, null, '2018-09-01 15:49:01');
INSERT INTO `edu_menu` VALUES ('415', '1', null, '本科', '413', '349,413', '0', null, '0', '2', '1', null, null, '2018-09-01 15:49:16');
INSERT INTO `edu_menu` VALUES ('416', '1', null, '专科', '413', '349,413', '0', null, '0', '2', '1', null, null, '2018-09-01 15:49:12');
INSERT INTO `edu_menu` VALUES ('422', '1', null, '小学2', '420', '327,420', '0', null, '0', '2', '1', null, null, '2018-09-01 15:50:51');
INSERT INTO `edu_menu` VALUES ('423', '1', null, '自考1', '327', '327', '0', null, '0', '1', '1', null, null, '2018-09-01 15:51:06');
INSERT INTO `edu_menu` VALUES ('424', '1', null, '研究生', '423', '327,423', '0', null, '0', '2', '1', null, null, '2018-09-01 15:51:14');
INSERT INTO `edu_menu` VALUES ('425', '1', null, '博士', '423', '327,423', '0', null, '0', '2', '1', null, null, '2018-09-01 15:51:10');
INSERT INTO `edu_menu` VALUES ('429', '1', null, '自考', '291', '291', '0', null, '0', '1', '1', null, null, '2018-09-01 15:51:43');
INSERT INTO `edu_menu` VALUES ('430', '1', null, '专科升本科密级', '429', '291,429', '0', null, '0', '2', '1', null, null, '2018-09-01 15:51:48');
INSERT INTO `edu_menu` VALUES ('436', '1', null, '公告', '382', '382', '0', null, '0', '1', '1', null, null, '2018-09-01 15:52:16');
INSERT INTO `edu_menu` VALUES ('440', '1', null, '公司地址', '384', '384', '0', null, '0', '1', '1', null, null, '2018-09-01 15:52:39');
INSERT INTO `edu_menu` VALUES ('441', '1', null, '联系我们', '384', '384', '0', null, '0', '1', '1', null, null, '2018-09-01 15:52:37');
调用方法：
控制代码：
$res = Db::name('menu')->field('id as value,title as name,pid')->whereNull('pid')->order(['sort'=>'desc'])->select();
foreach($res as $k => $rs){
$rs['children']=getList2($rs['value']);
$res[$k]= $rs;
}
echo json_encode($res);
getList2函数
/**
* 无限级分类
* getList2返回的数据都是二级、3级、4级、5级、6级等数据;一级在调用那边实现
* 导航菜单引用
*/
function getList2($id) {
$tree = '';
$list=Db::name('menu')->field('id as value,title as name,pid')->where('pid',$id)->select();
foreach($list as $key => $val ){
if($val['pid']!=0){
$val['children'] = getList2($val['value']);
$tree[] = $val;
}
}
return $tree;
//echo json_encode($tree);
}
模板代码：
/**
* 格式函数 专门把数据录格式成为layui 数据表格的格式
*/
function json($code,$msg="",$count,$data=array()){
$result=array(
'code'=>$code,
'msg'=>$msg,
'count'=>$count,
'data'=>$data
);
//输出json
echo json_encode($result);
exit;
}