jsmind结合php,thinkCMF5与jsMind实现文章Mind版

一.需求

(1)一级分类下的所有文章.

(2)文章链接跳转

(3)节点点击收缩

实现如图1.png

二、相关文档

1.jsmind文档：http://hizzgdev.github.io/jsmind/developer.html

三、实现步骤：

(1)引入静态资源，下载jsmind包，添加css和js文件，如图

(2)头部head.html 引用

(3)在app/portal/controller/Index.class.php 添加方法

use app\portal\service\ApiService;

//接口

public  function jsmind()

{

$catergeresObj=new ApiService();

$catergeres=$catergeresObj->allSubCategories(0);//获取根类下所有子分类(所有后代)

$mind_data=[

'id'=>'root',

'topic'=>'博文',

];

$arr1=array();

$arr2=array();

foreach ($catergeres as $catergery){

$catergeres_articles=$catergeresObj->articles(array('category_ids'=>$catergery['id']));//获取某个分类下所有文章

foreach ($catergeres_articles as $articles){

$data_children=[

'id'=>$catergery['name'],

'topic'=>$catergery['name'],

'direction'=>'right',

'expanded'=>'false',

];

if($catergery['id']%2==0){

$data_children['direction']='left';

}

foreach ($articles as $article){

$data_children['children']=[

'id'=>$article['id'],

'topic'=>"".$article['post_title'].""

];

array_push($arr1,$data_children['children']);

$data_children['children']=$arr1;

}

$arr1=array();

array_push($arr2,$data_children);

$mind_data['children']=$arr2;

}

}

return json($mind_data);

}

public  function mind(){

$id                  = $this->request->param('id', 0, 'intval');

$portalCategoryModel = new PortalCategoryModel();

$category = $portalCategoryModel->where('id', $id)->where('status', 1)->find();

$this->assign('category', $category);

$listTpl = empty($category['list_tpl']) ? 'list' : $category['list_tpl'];

return $this->fetch(':mind');

}

(4)在..../simpleboots添加mind.html

html>

{$category.seo_title}

$top_slide_id=empty($theme_vars['top_slide'])?1:$theme_vars['top_slide'];

{$vo.title|default=''}

            

            

$demo_time=2;

首页/最新文章

$(function () {

$("#home-slider").slippry({

transition: 'fade',

useCSS: true,

captions: false,

speed: 1000,

pause: 3000,

auto: true,

preload: 'visible'

});

});

function data(){

var minddata=$.ajax({url:"/thinkcmf-master/public/index.php/portal/index/jsmind",async:false});

var arrs=minddata.responseJSON;

console.log(arrs);

return arrs;

}

function load_jsmind(){

var mind = {

/* 元数据，定义思维导图的名称、作者、版本等信息 */

"meta":{

"name":"jsMind-demo-tree",

"author":"hizzgdev@163.com",

"version":"0.2"

},

/* 数据格式声明 */

"format":"node_tree",

/* 数据内容 */

"data":data()

};

var options = {

container:'jsmind_container',

editable:true,

theme:'primary'

};

var jm = jsMind.show(options,mind);

}

load_jsmind();