zhoufan
/
SQZC12345_Web


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274
							<!DOCTYPE html>

<html>

	<head>

		<meta charset="UTF-8">

		 <script src="../Script/Common/huayi.load.js"></script>

    <script src="../Script/Common/huayi.config.js"></script>

			<link href="../css/bootstrap.min14ed.css?v=3.3.6" rel="stylesheet">

		<link href="../css/bootstrap.min.css" />

		<link rel="stylesheet" href="../css/boot/bootstrap-table.css" />

		<link href="../css/font-awesome.min93e3.css?v=4.4.0" rel="stylesheet">

		<link href="../css/animate.min.css" rel="stylesheet">

		<link href="../css/style.min862f.css?v=4.1.0" rel="stylesheet">

		<link href="../css/layer/need/layer.css" />

		<link rel="stylesheet" href="../js/zTree/zTreeStyle.css" />

		<link rel="stylesheet" href="../css/init.css" />

		<title>知识库查询</title>

		<style>

			.toolBar {

				padding: 15px 0;

				border-bottom: 1px solid #ccc;

			}

			.treeTable {

				height: 400px;

				/*overflow-y: auto;*/

			}

			.tree {

				height: 100%;

			}

			.trTitle {

				width: 100%;

				height: 34px;

				line-height: 34px;

				border-bottom: 1px solid #ebebeb;

				color: red;

				font-weight: 700;

				margin-bottom: 15px;

			}

			
			.treeCon {

				height: 90%;

				border: 1px solid #ebebeb;

				overflow-y: auto

			}

			
			.ztree li {

				width: 100%;

				overflow: hidden;

				white-space: nowrap;

				text-overflow: ellipsis;

			}

			.content{

			    width: 270px;

			    height: 25px;

			    overflow: hidden;

			    white-space: nowrap;

			    text-overflow: ellipsis;

			    text-align: left;

			}

		</style>

	</head>

	<body>

		<div class="container-fluid">

				<div class="daoHang clearfix">

				<div class="dhLeft">

					<sapn><i class="syIcon"></i>位置：<a id="ReIndex">首页</a>&gt;<a href="javaScript:;">知识库</a>&gt;<a href="" class="nowPosition">知识库查看</a></sapn>

				</div>

			</div>

			<div class="toolBar clearfix">

				<div class="toolLeft">

					<button class="btns add">查看</button>

				</div>

				<div class="toolRight">

					<span>搜索内容：<input type="text" class="searCon" /></span>

					<button class="btns searchGo">搜索</button>

				</div>


			</div>

			<div class="treeTable clearfix">

				<div class="tree col-md-3">

					<div class="trTitle">知识库分类</div>

					<div class="treeCon">

						<ul id="treeDemo" class="ztree">

							<!--类名为ztree是必须的-->

						</ul>

					</div>


				</div>

				<div class="tableCon col-md-9">

					<div class="trTitle"> 知识库列表</div>

					<table id="table1" data-row-style="rowStyle" data-query-params="queryParams" data-pagination="true">

						<thead>

							<tr>

							    <th data-field="state" data-checkbox="true" data-align="center"></th>

							    <th data-align="center" data-formatter="setCode"></th>

								<th data-field="F_Title" data-align="left">标题</th>

								<th data-field="F_Description" data-align="left"  data-formatter="oper">内容</th>

								<th data-field="F_KeyWords" data-align="center">关键字</th>

								<th data-field="F_CreateOn" data-align="center">创建时间</th>

							</tr>

						</thead>

						<tbody id="tbody">

						</tbody>

					</table>


				</div>

			</div>


		</div>

	<script src="../js/jquery.min.js?v=2.1.4"></script>

	<script src="../js/jquery.cookie.js"></script>

	<script src="../js/bootstrap.min.js"></script>

	<script src="../js/bootstrap-table.js"></script>

	<script src="../js/bootstrap-table-zh-CN.js"></script>

	<script src="../js/zTree/jquery.ztree.core.js"></script>

	<script src="../css/layer/layer.js"></script>

	<script src="../js/kindeditor/kindeditor.js"></script>

	<script src="../js/kindeditor/lang/zh_CN.js"></script>

   
	</body>

	<script>

	var token = $.cookie("token");

	var id; //当前节点id

	var pid; //当前父节点ID

	var name; //选择的name

	var pidName; //父节点name

	var keyWord; //关键字

	var table = $('#table1');//右边表格

	var changeGetid;

	//搜索按钮

	$('.searchGo').click(function(){

		keyWord = $('.searCon').val();

		//console.log(keyWord);

		if(keyWord){

				initTable(token,id,keyWord);

		}else{

				layer.confirm('请输入搜索内容！', {

				btn: ['确定']

			});

			return;

		}

		
	})


	$.get(huayi.config.callcenter_url+'KnowledgeClass/GetList', {

		"token": $.cookie("token"),

		"pid": pid

	}, function(result) {

		result = $.parseJSON(result);

		$.fn.zTree.init($("#treeDemo"), setting1, result.data); //实例化树形图

	});

	var setting1 = {

		data: {

			key: {

				name: "text"

			},

			simpleData: {

				enable: true,

				idKey: "id",

				rootPId: 0

			}

		},

		callback: {

			onClick: zTreeOnClick

		}

	};


	function zTreeOnClick(event, treeId, treeNode) {

		id = treeNode.id;

		name = treeNode.text;

//		console.log(name);

//		console.log(id);

//		var pidnode = treeNode.getParentNode();

//		console.log(pidnode);

//		if(pidnode) {

//			pidName = pidnode.text;

//			pid = pidnode.id;

//			console.log(pid);

//		} else {

//			pidName = "顶级分类";

//			pid == 0;

//			console.log(pid);

//		}

		keyWord = $('.searCon').val(); 

		initTable(token,id,keyWord);

	};

	
	//===============添加功能开始=============================


	//添加按钮

	$('.add').click(function() {

	
		var changes = $.map( $('#table1').bootstrapTable('getSelections'), function(row) {

			return row.F_RepositoryId;

		});

		if ((changes.length <= 0 ) || (changes.length > 1)) {

            layer.confirm('请选择查一行查看！', {

                btn: ['确定']

            });

            return;

        } else {

            //iframe窗

		    layer.open({

		      	type: 2,

		      	title: '查看知识库',

		      	shadeClose: true, //是否开启点击遮罩关闭

		      	shade: 0.4, //遮罩

		     	maxmin: true, //开启最大化最小化按钮

		     	id: 'LAY_layuipro',//防止重复弹出

		     	moveType: 1,//拖拽类型 默认的拖拽风格正如你所见到的，会有个过度的透明框。但是如果你不喜欢，你可以设定moveType: 1切换到传统的拖拽模式

		     	moveOut: true, //拖拽到窗口外

		     	//resize: true,//是否允许拉伸

		      	area: ['70%', '50%'],

		      	content: 'addModel.html?changeGetid='+ changes +''

		    });

        }

			
	})

	
	//***********************添加功能结束=============================

	initTable();

	function initTable(token,id,keyWord) {

		//先销毁表格

		table.bootstrapTable('destroy');

		//初始化表格,动态从服务器加载数据

		table.bootstrapTable({

			method: "get", //使用get请求到服务器获取数据

		    url: huayi.config.callcenter_url+"Knowledge/GetList", //获取数据的Servlet地址

//			url: "../tree.json", //获取数据的Servlet地址

			contentType: "application/x-www-form-urlencoded",striped: true, //表格显示条纹

			pagination: true, //启动分页

			pageSize:5, //每页显示的记录数

			pageNumber: 1, //当前第几页

			pageList: [5, 10, 50, 100], //记录数可选列表

			search: false, //是否启用查询

			showColumns: false, //显示下拉框勾选要显示的列

			showRefresh: false, //显示刷新按钮

			sidePagination: "server", //表示服务端请求

			//设置为undefined可以获取pageNumber，pageSize，searchText，sortName，sortOrder

			//设置为limit可以获取limit, offset, search, sort, order

			queryParamsType: "undefined",

			queryParams: function queryParams(params) { //设置查询参数

				var param = {

					page: params.pageNumber,

					pagesize: params.pageSize,

					token: token,

					pid: id,

					keywords: keyWord

				};

				return param;

			},

			onLoadSuccess: function() { //加载成功时执行

				//layer.msg("加载成功");

			},

			onLoadError: function() { //加载失败时执行

				//layer.msg("加载数据失败", { time: 1500, icon: 2 });

			}

		});

	}

	function oper(val,row) {

        return '<div class="content">'+row.F_Content +'</div>'

    }

	 function setCode(val, row, index) {

		 	return index + 1;

		 }

	 
	</script>	

	
</html>