#@main(attr.getItem("currentMenuName"))

#define content()
<section class="content container-fluid">
	
	#if(msg)
	<div class="alert alert-success alert-dismissible">
	<button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
	<p>#(msg)</p></div>
	#end
	
	<div id="dataTable"></div>
</section>
#end

#define after()
<script>
require(['ez-datagrid', 'kit'], function(Grid, Kit){

	var pid = '#(pid)';
	var nodesJson = #(EJson.toJson(navis));
	var indexJson = #(EJson.toJson(indexChannel));
	var channelJson = #(EJson.toJson(channels));

	var channelOpts = [{'value': '-', 'text': '[无]'}, {'value': indexJson.id, 'text': indexJson.caption}];
	var prefixChar = '---------------';
	channelJson.forEach(channel => {
		var level = channel.path.split("_").length * 2;
		channelOpts.push({'value': channel.id, 'text': prefixChar.substr(0, level) + ' ' + channel.caption});
	});
	var targetOpts = [{'value': '_self', 'text': '当前窗口'}, {'value': '_blank', 'text': '新窗口'}];
	
	var datagrid;
	var initNodeGrid = function(){
		var opts = {
			container: '#dataTable'
			, data: nodesJson
			, title: '网站导航 - 明细 &nbsp; <a class="btn btn-default btn-sm" href="#(attr.src)/site/navi">返回</a>'
			, columns: [{
	            field: 'channelId'
	            , title: '栏目'
	            , type: 'select'
	            , options: channelOpts
	            , formatter: function(value){
	            	let seled = '';
	            	if(value !== null && value !== '' && value !== undefined){
	            		channelOpts.forEach(channel => {
            				if(value === channel.value) seled = channel.text.replace(/\-*\s*/g, '');
            			});
	            		return seled;
	            	}
	            	return '';
	            }
			},{
	            field: 'caption'
	            , title: '外链名称'
				, placeholder: '仅跳转到外部链接时填写'
			},{
            	field: 'href'
	            , title: '外链地址'
			    , visible: false
				, placeholder: '仅跳转到外部链接时填写，格式：http://...'
    		},{
            	field: 'target'
   	            , title: '打开方式'
	            , options: targetOpts
	            , type: 'radio'
   				, defaultValue: '_self'
   				, width: 100
		        , formatter: function(value){
	            	let seled = '';
	            	if(value !== null && value !== '' && value !== undefined){
	            		targetOpts.forEach(item => {
            				if(value === item.value) seled = item.text;
            			});
	            		return seled;
	            	}
	            	return '';
	            }
       		},{
	            field: 'sort'
	            , title: '序号'
	            , type: 'number'
				, defaultValue: 0
				, width: 100
			}]
			, btnAdd: { callback: function(params){ return '#(attr.ctrl)/addNaviItem?pid=' + pid } }
			, btnModify: { callback: function(params, row){ return '#(attr.ctrl)/modifyNaviItem?pid=' + pid } }
			, btnRemove: { callback: function(params, rows){ return '#(attr.ctrl)/removeNaviItem?pid=' + pid + '&ids=' + Kit.getFields(rows, 'id').join(',') } }
		}
		Grid.load(opts, function(dg){
			datagrid = dg;
		});
	}
	initNodeGrid();
});
</script>
#end