<!doctype html>
<html>
	<head>
		<meta charset="utf-8"><meta http-equiv="Expires" content="0"><meta http-equiv="Pragma" content="no-cache"><meta http-equiv="Cache-control" content="no-cache"><meta http-equiv="Cache" content="no-cache">
		<title>页面角色</title>
		
		<script type="text/javascript">
			var pageVue = null;
			function loadJsCss(callback) {
				var jscss_urls = [];
				window.top.initJsCss(document, jscss_urls, callback);
			};
			
			function initVue() {
				new ListVue({
					el: "#vbody",
					data: {
						dataname: "sys_right_role",
						orderby: "role_type, order_no",
						title: "",
						isPagination: false,
						menuList: [],
						refresh_menu: true,
						selectPageObj: {},
						start_expanded_keys: [], //默认展开的菜单
						checkedMenu: [], 	//默认选中菜单
						defaultProps: {
							children: 'children',
							label: 'title'
						},
						tableFields_tab: [
							{isshow: "T", field: "name", name: "Tab名称", align: "left"},
							// {isshow: "T", field: "is_visible", name: "是否可见", align: "center"},
							// {isshow: "T", field: "is_active", name: "是否可编辑", align: "center", type:"switch"},
						],
						tableData_tab: [],
						tab_tableHeight: 100,
						
						dataname_p: "md_product",
						isRefresh_p: true,
						tableFields_p: [],
						tableData_p: [],
						pagesize_p: 10,
						pagenum_p: 1,
						total_p: 0,
						tableHeight_p: 100,
						
						filterfieldClick: {},
						tablefieldClick: {},
						formfieldClick: {},
						activeName: "",
						tableFields_button: [
							{isshow: "T", field: "sys_page_tab__name", name: "Tab名称", align: "left"},
							{isshow: "T", field: "title", name: "按钮名称", align: "left"},
							{isshow: "T", field: "name", name: "名称", align: "left"},
							{isshow: "T", field: "type", name: "类型", align: "left"},
							// {isshow: "T", field: "is_active", name: "是否可用", align: "center", type:"switch"},
						],
						tableData_button: [],
						selectButtons: [],
						selectTabs: [],
						oldRolePage: [],
						oldarr: [],
						oldsarr: [],
						checkarrbutton: [],
						checkarrtab: [],
						pageid: "",
						savem: false,
						savebt: false,
						ischange: false,
						title_name: null,
						
						treeTxtFormatter: "{title}",
						treeTxtFormatter_bt: "{name}【{type}】",
						bt_selected: [],
						options_tree_bt: [],
						
						tablebuttonclick: [],
					},
					created() {
						
					},
					
					mounted() {
						//获取数据
						this.activeName = "button";
						this.initData();
						this.$nextTick(() => { // 以服务的方式调用的 Loading 需要异步关闭
							hideLoading();
						});
					},
					
					methods:{
						initData() {
							var me = this;
							this.tablebuttonClick();
							this.onQuery(function(result, callback) {//查询后的回调,用于获取字段的
								if (result.meta && result.meta[me.dataname] && result.meta[me.dataname].fields) {
									var metas = clone(result.meta[me.dataname].fields);
									var filterFields_ = [];
									var tableFields_ = [];
									
									metas.map(f=>{
										f.isshow = "T";
										
										if (f.isfilter) {
											filterFields_.push(clone(f));
										}
										else {
											var filter_f = clone(f);
											filter_f.isshow = "F";
											filterFields_.push(filter_f);
										}
										
										tableFields_.push(clone(f));
									})
									if (!me.filterFields || (me.filterFields && me.filterFields.length == 0)) {
										me.filterFields = clone(filterFields_);
										me.tableFields = clone(tableFields_);
										
										//字段数组转字段obj,目的为了筛选时获取字段属性
										me.fieldsToFieldsObj();
										
										//设置字段事件
										me.tableFieldClick();
									}
								}
								
								if (callback) {
									callback();
								}
								me.getMenuAll();
							});
						},
						
						onTableDataAfter(){
							var me = this;
							this.$nextTick(() => { // 以服务的方式调用的 Loading 需要异步关闭
								let clientHeight = document.documentElement.clientHeight;
								let filter_height = document.getElementsByClassName('h_form_filter').length ? document.getElementsByClassName('h_form_filter')[0].offsetHeight : 0;
								
								me.tableHeight = clientHeight - filter_height - 20;
							});
						},
						
						rowClick(obj) {
							var me = this;
							me.reseta();
							this.selectedrow = obj.row;
							this.getMenuByRole();
						},
						
						getMenuAll() {
							var me = this;
							var param_ = {}
							
							Server.call("root/client/getMenuTreeAll", param_, function(result) {
								//遍历树数据,将根节点的menu_id设置为id
								var menus_tree = clone(result.data.menus);
								// var menus_tree2 = clone(result.data.menus);
								me.menuToPageTree(menus_tree);
								me.menuList = clone(menus_tree);
								// me.tableDataAfter_p();
								var row = me.tableData[0];
								me.$refs.table1.setCurrentRow(row)
								
								me.selectedrow = row;
								me.getMenuByRole();
								
								// me.menuToPageTree(menus_tree, function(menus) {
								// 	me.menuList = clone(menus);
								// 	// me.tableDataAfter_p();
								// 	var row = me.tableData[0];
								// 	me.$refs.table1.setCurrentRow(row)
									
								// 	me.selectedrow = row;
								// 	me.getMenuByRole();
								// })
								
								
							})
						},
						
						menuToPageTree2(oldmenus, callback) {
							var me = this;
							oldmenus.map(om=>{
								if (om.children) {
									me.menuToPageTree2(om.children);
								}
								else if (om.page_id) {
									om.id = om.page_id
								}
							})
							if (callback) {
								callback(oldmenus);
							}
						},
						
						menuToPageTree(oldmenus) {
							var me = this;
							oldmenus.map(om=>{
								if (om.children) {
									me.menuToPageTree(om.children);
								}
								// else if (om.page_id) {
								// 	om.id = om.page_id
								// }
								else if (om.menu_id) {
									om.id = om.menu_id
								}
							})
						},
						
						tableDataAfter_p() {
							var me = this;
							if (this.tableFields_p.length > 0){
								this.isRefresh_p = false;
								this.$nextTick(function(){
									this.isRefresh_p = true;
									this.$nextTick(function(){
										me.tableHeight_p = me.tableHeight
									})
								})
							}
						},
						tablebuttonClick() {
							var me = this;
							var tablebuttonclick = [];
							tablebuttonclick = [
								{
									isbuttonshow: true, //type: "",
									code: "add", isselected: false, classname:"",
									onclick: function(obj) {
										me.addData();
									}
								},
								{
									isbuttonshow: true, //type: "",
									code: "edit", isselected: true, classname:"",
									onclick: function(obj) {
										me.editData("edit", obj.selectedList[0]);
									}
								},
								{
									isbuttonshow: true, type: "danger",
									code: "delete", isselected: true, classname:"",
									onclick: function(obj) {
										me.delData(obj.selectedList[0]);
									}
								}
							]
							this.tablebuttonclick = tablebuttonclick;
						},
						
						tableFieldClick() {
							var me = this;
							//筛选字段事件设置
							
							//表格字段事件设置
							this.tablefieldClick = {
								user_list: {//字段事件设置
									defaultval: {
										val: "查看",//空值时的显示值
										onclick: function(obj) {//默认值点击事件,此事件需要设置val才有效
											me.getUserList(obj);
										}
									},
								},
							};
							//表单字段事件设置
							
						},
						
						// 角色列表的查看点击
						getUserList(obj){
							console.log("obj",obj)
							let me = this
							let row = obj.row

							var config = ({
								totab: false, //true: 以Tab导航的方式打开
								url: "module/config/page/employee_role_list.html",
								width: 950,
								height: 550,
								text: "用户列表",
								sceneCode: "browse",
								data: row,
								delta: {},
								callback: function(obj, callback) {
									console.log(obj.row);
									
									if (callback) {
										callback();
									}
								}
							});

							me.doPopupByPublic(config);
						},
						
						reseta(){
							this.$nextTick(() => {
								this.$refs.menuTree.setCheckedKeys([])
							});
						},
						
						getTabButtonByPageId(pageId, menuId) {
							var me = this;
							let param_t = {
								dataname: "sys_page_tab",
								filter: "page_id = '" + pageId + "'"
							}
							Server.call("root/data/getEntitySet", param_t, function(result_tab) {
								var tab_list_ = result_tab.data.entityset;
								let param_b = {
									dataname: "sys_page_button",
									filter: "sys_page_button.page_id = '" + pageId + "'",
									orderby: "sys_page_button.page_id, tab_id",
								}
								Server.call("root/data/getEntitySet", param_b, function(result_button) {
									var button_list_ = result_button.data.entityset;
									var tab_button_list_ = [];
									var options_tree_bt_ = [];
									tab_list_.map(t=>{
										var t_ = {
											id: t.id,
											name: t.name,
											type: "T"
										}
										tab_button_list_.push(t_)
									})
									button_list_.map(b=>{
										var b_ = {
											id: b.id,
											name: b.title,
											type: "B",
											parent_id: b.tab_id
										}
										tab_button_list_.push(b_)
									})
									options_tree_bt_ = ArrayToTree(clone(tab_button_list_), "name", "parent_id", null, null, null, null);
									me.options_tree_bt = clone(options_tree_bt_);
									me.getTabButtonByRole(pageId, menuId, me.selectedrow.id)
								})
								
							})
						},
						
						getTabButtonByRole(pageId, menuId, role_id) { 
							var me = this;
							let param_ = {
								dataname: "sys_right_role_page_tab",
								filter: "role_id = '" + role_id + "' and page_id = '" + pageId + "' and menu_id='" + menuId + "'"
							}
							Server.call("root/data/getEntitySet", param_, function(result_tab) {
								var tab_list_ = result_tab.data.entityset;
								let param_b = {
									dataname: "sys_right_role_page_button",
									filter: "role_id = '" + role_id + "' and page_id = '" + pageId + "' and menu_id='" + menuId + "'"
								}
								Server.call("root/data/getEntitySet", param_b, function(result_button) {
									var button_list_ = result_button.data.entityset;
									var bt_selected_ = [];
									tab_list_.map(t=>{
										bt_selected_.push(t.tab_id);
									})
									button_list_.map(b=>{
										bt_selected_.push(b.button_id);
									})
									
									me.bt_selected = clone(bt_selected_);
								})
							})
						},
						
						getTabList(pageId) {
							var me = this;
							let param_ = {
								isClientMode: false,
								dataname: "sys_page_tab",
								filter: "page_id = '"+pageId+"'"
							}
							Server.call("root/data/getEntitySet", param_, function(result) {
								// console.log(result.data.entityset)
								var temparr1 = []
								me.oldsarr = result.data.entityset;
								temparr1 = clone(me.oldsarr);
								// temparr1.map((e,index)=>{
								// 	e.is_active = null;
								// })
								me.oldsarr = temparr1;
								
								var temparr = []
								me.tableData_tab = result.data.entityset;
								temparr = clone(me.tableData_tab);
								// temparr.map((e,index)=>{
								// 	e.is_active = null;
								// })
								me.tableData_tab = temparr;
								if(me.selectedrow.id){
									me.getTabByRole(pageId);
								}
							});
						},
						getButtonList(pageId){
							var me = this;
							console.log(pageId)
							let param_ = {
								isClientMode: false,
								dataname: "sys_page_button",
								filter: "sys_page_button.page_id = '"+pageId+"'",
								orderby: "sys_page_button.page_id, tab_id",
							}
							Server.call("root/data/getEntitySet", param_, function(result) {
								console.log(result.data.entityset)
								var temparr1 = []
								me.oldarr = result.data.entityset;
								temparr1 = clone(me.oldarr);
								// temparr1.map((e,index)=>{
								// 	e.is_active = null;
								// })
								me.oldarr = temparr1;
								
								var temparr = []
								me.tableData_button = result.data.entityset;
								temparr = clone(me.tableData_button);
								// temparr.map((e,index)=>{
								// 	e.is_active = null;
								// })
								me.tableData_button = temparr;
								if(me.selectedrow.id){
									me.getButtonByRole(pageId);
								}
							});
						},
						
						getTabByRole(pageId){
							var me = this;
							let param_ = {
								dataname: "sys_right_role_page_tab",
								filter: "role_id = '"+this.selectedrow.id+"' and page_id = '"+pageId+"'"
							}
							me.tableData_tab = me.oldsarr;
							Server.call("root/data/getEntitySet", param_, function(result) {
								var data_ = result.data.entityset;
								// var tableData_tab_ = clone(me.tableData_tab);
								// if(data_[0]){
								// 	tableData_tab_.map((e,index)=>{
								// 		if(e.id == data_[index].tab_id){
								// 			tableData_tab_[index].is_active = data_[index].is_active;
								// 			if(data_[index].is_active){
								// 				tableData_tab_[index].is_visible = true;
								// 			}
								// 		}
								// 	})
								// }
								// me.tableData_tab = tableData_tab_;
								var checkarr = [];
								data_.map(e=>{
									checkarr.push(e.tab_id)
								})
								console.log(checkarr)
								// toggleSelection
								me.$refs.table_tab.toggleSelection(checkarr);
							});
						},
						getButtonByRole(pageId){
							var me = this;
							let param_ = {
								isClientMode: false,
								dataname: "sys_right_role_page_button",
								filter: "role_code = '"+this.selectedrow.id+"' and page_id = '"+pageId+"'"
							}
							me.tableData_button = me.oldarr;
							Server.call("root/data/getEntitySet", param_, function(result) {
								var data_ = result.data.entityset;
								// var tableData_button_ = clone(me.tableData_button);
								// if(data_[0]){
								// 	tableData_button_.map((e,index)=>{
								// 		if(e.id == data_[index].button_id){
								// 			tableData_button_[index].is_active = data_[index].is_active;
								// 			if(data_[index].is_active){
								// 				tableData_button_[index].is_visible = true;
								// 			}
								// 		}
								// 	})
								// }
								// me.tableData_button = tableData_button_;
								// console.log(data_)
								var checkarr = [];
								data_.map(e=>{
									checkarr.push(e.button_id)
								})
								console.log(checkarr)
								// toggleSelection
								me.$refs.table_button.toggleSelection(checkarr);
							});
						},
						
						getMenuByRole(){
							var me = this;
							let param_ = {
								isClientMode: false,
								dataname: "sys_right_role_menu",
								filter: "role_id = '"+this.selectedrow.id+"'",
							}
							me.oldRolePage = [];
							me.checkedMenu = [];
							Server.call("root/data/getEntitySet", param_, function(result) {
								me.oldRolePage = clone(result.data.entityset);
								var checkedMenu_ = clone(me.checkedMenu);
								me.oldRolePage.map(sm=>{
									checkedMenu_.push(sm.menu_id)
								})
								me.checkedMenu = checkedMenu_;
							});
						},
						
						onQueryAfter() {
							this.pagenum_p = 1;
							this.tableData_p = [];
							this.total_p = 0;
						},
						btTreeCheckClick(obj) {
							let me = this;
							var data = obj.data, checked = obj.checked, indeterminate = obj.indeterminate;
							this.ischange = true;
						},
						menuTreeCheckClick(obj) {
							let me = this;
							var data = obj.data, checked = obj.checked, indeterminate = obj.indeterminate;
							
							this.title_name = "";
							this.menuId = "";
							this.pageid = "";
							
							this.options_tree_bt = [];
							this.bt_selected = [];
						},
						
						menuTreeNodeClick(obj) {
							let me = this;
							var data = obj.data, node = obj.node, e = obj.el;
							// if(me.ischange){
							// 	Root.confirm('有未保存的按键或Tab,是否保存?', '未保存提示', {
							// 	  confirmButtonText: '保存',
							// 	  cancelButtonText: '不保存',
							// 	  type: 'warning'
							// 	}).then(() => {
							// 		me.onSaveResourceByPage();
							// 	}).catch(() => {
							// 		me.ischange = false;
							// 		Root.message({
							// 			type: 'info',
							// 			message: '已取消'
							// 		});          
							// 	});
							// 	return
							// }
							// this.getButtonList(data.page_id);
							// this.getTabList(data.page_id);
							
							this.title_name = "";
							this.menuId = "";
							this.pageid = "";
							
							this.options_tree_bt = [];
							this.bt_selected = [];
							
							if (data.page_id) {
								if (!node.checked) { //如果没有被选中
									Root.message({
										type: 'warning',
										message: '仅选中的菜单可配置资源'
									});
									this.$refs.menuTree.setCurrentKey();
									return
								}
								this.$refs.menuTree.setCurrentKey(data.id);
							}
							
							if (data && data.page_id) {
								me.pageid = data.page_id;
								me.menuId = data.id;
								me.title_name = data.title;
								this.getTabButtonByPageId(me.pageid, me.menuId);
							}
						},
						
						//保存单个页面的资源权限
						onSaveResourceByPage() {
							let me = this;
							var select_bt = this.$refs.btTree.getCheckedNodes();
							var select_bt_keys = this.$refs.btTree.getCheckedKeys();
							
							if(!this.selectedrow.id) {
								this.$message({
									message: '请先选择左侧角色',
									type: 'warning'
								});
								return;
							}
							
							var cbuttons = [];
							var ctabs = [];
							select_bt.map(bt=>{
								if (bt.type == "T") { // tab
									ctabs.push(bt.id);
								}
								else if (bt.type == "B") { // button
									var b_ = {
										tab_id: bt.parent_id,
										button_id: bt.id
									}
									cbuttons.push(b_);
								}
							})
							
							let param_ = {
								roleId: this.selectedrow.id,
								roleCode: this.selectedrow.code,
								menuId: me.menuId,
								pageId: me.pageid,
								buttons: cbuttons,
								tabs: ctabs,
							}
							console.log(param_);
							// return
							me.savebt = true;
							Server.call("root/system/saveBtnAndTab", param_, function(result) {
								if(result.success){
									me.roleRefresh(param_.roleId, function(){
										me.$message({
											message: '保存成功',
											type: 'success'
										});
										me.savebt = false;
										me.ischange = false;
									});
								}
							}, function(result) {
								me.savebt = false;
							});
						},
						
						// 刷新缓存
						roleRefresh(roleId, callback) {
							var me = this;
							let param_ = {
								role_id: roleId
							}
							console.log(param_);
							Server.call("root/system/reloadRole", param_, function(result) {
								if(result.success){
									if (callback) {
										callback()
									}
								}
							}, function(result) {
								me.savebt = false;
							});
						},
						
						saveResourceByPage(type) {
							let me = this;
							let ids = "";
							this.selectButtons;
							this.selectTabs;
							
							let arr = this['select' + type]
							console.log(this['select' + type])
							
							for (let i = 0; i < arr.length; i++) {
								if (ids == "") {
									ids = arr[i];
								}
								else {
									ids += "','" + arr[i];
								}
							}
							console.log(ids)
							
							var roleType = this.selectRole.type;
							let filter_ = " role_id = '" + this.selectRole.id + 
								"' and type = '" + type.substring(0, type.length - 1).toLowerCase() +
								"' and resource_id in('" + ids + "')";
							param_ = {
								
								dataname: "resourceRole",
								filter: filter_,
							}
							//return
							Server.call("root/data/deleteEntityByFilter", param_, function(result) {
								console.log(result);
								let arr_ = me.selectMenu[me.menuId][type.toLowerCase()];
								let type_ = type.substring(0, type.length - 1).toLowerCase();
								var array_ = clone(arr_);
								me.doSaveResourceByPage(array_, type_);
							});
						},
						
						doSaveResourceByPage(array, type, callback) {
							var me = this;
							if (array.length) {
								var array_row_ = array[0];
								
								var row_ = {
									role_id: me.selectRole.id,
									type: type,
									resource_id: array_row_.id,
								}
								var param_ = {
									
									dataname: "resourceRole",
									entity: row_
								}
							
								Server.call("root/data/saveEntity", param_, function(result) {
									console.log(result);
									array.remove(array_row_);
									
									if (array.length) {
										me.doSaveResourceByPage(array, type, callback);
									}
									else {
										me.$message({
											message: '保存成功',
											type: 'success'
										});
										if (callback) {
											callback();
										}
									}
								});
							}
							else {
								me.$message({
									message: '保存成功',
									type: 'success'
								});
								if (callback) {
									callback();
								}
							}
						},
						
						onInitFilter(){
							this.reseta();
							this.selectedrow = {};
							this.pageid = "";
						},
						
						handleClick(tab) {
							// if (tab.name == "button") {
							// 	//this.getButtonByRole();
							// 	this.getPermissionByRole("button");
							// }
							// if (tab.name == "tab") {
							// 	this.getPermissionByRole("tab");
							// }
							// if (tab.name == "table") {
							// 	this.getPermissionByRole("table");
							// }
							// if (tab.name == "form") {
							// 	this.getPermissionByRole("form");
							// }
						},
						
						getPermissionByRole(type) {
							let me = this;
							var type_ = type;
							var roleType = this.selectRole.type
									
							let filter_ = "EXISTS ( SELECT resource_id FROM resource_role WHERE type = '" + type + "' AND resource_id = v_menu.id and role_id='" + this.selectRole.id + "' )"
							var param_ = {
								
								dataname: "v_menu",
								filter: filter_
							}
							
							Server.call("root/data/getEntitySet", param_, function(result) {
								console.log(result);
								if (result && result.data.entityset) {
									let data_ = result.data.entityset;
									let arr = [];
									let leafarr = [];
									
									me.start_expanded_keys = [];
									me.checkedMenu = [];
									
									for (let i = 0; i < data_.length; i++) {
										arr[i] = data_[i].id;
										
										if (data_[i].page_id) {
											leafarr.push(data_[i].id);
										}
									}
									
									if (type == 'menu') {
										me.checkedMenu_ = arr;
										me.start_expanded_keys = leafarr;
										me.checkedMenu = leafarr;
										
										me.refresh_menu = false;
										//me.isStrictly=false;
										me.$forceUpdate()
										me.$nextTick(() => {
											me.refresh_menu = true;
									
											//me.$refs.menuTree.setCheckedKeys(arr)
										});
									} else if (type == 'panel') {
										me.selectPanels = arr;
										me.selectMenu[me.menuId].panels = arr;
										console.log(me.selectMenu[me.menuId].panels)
									} else if (type == 'button') {
										me.selectButtons = arr;
										me.selectMenu[me.menuId].buttons = arr;
									
										//me.$refs.table_button.toggleSelection(data_);
									} else if (type == 'table') {
										me.selectTables = arr;
										me.selectMenu[me.menuId].tables = arr;
									
									} else if (type == 'tableField') {
										me.selectTableFields = arr;
										me.selectFieldsByTable[me.menuId][me.tableId] = arr;
									
									} else if (type == 'form') {
										me.selectForms = arr;
										me.selectMenu[me.menuId].forms = arr;
									
									} else if (type == 'formField') {
										me.selectFormFields = arr;
										me.selectFieldsByForm[me.menuId][me.formId] = arr;
									
									} else if (type == 'tab') {
										me.selectTabs = arr;
										me.selectMenu[me.menuId].tabs = arr;
									
									}
								}
							});
						},
						
						//保存菜单权限
						onSaveMenuByRole() {
							let me = this;
							let resultMenu = this.$refs.menuTree.getCheckedNodes(true);
							let resultpages = this.$refs.menuTree.getCheckedKeys(true);
							// var pages_ = [];
							// resultMenu.map(m=>{
							// 	if (m.page_id) {
							// 		pages_.push(m.page_id);
							// 	}
							// })
							let menu_list = []
							resultMenu.map(e => {
								menu_list.push({menuId: e.id,pageId: e.page_id,remark: e.title})
							})
							let param_ = {
								dataName: "sys_right_role_menu",
								// roleCode: this.selectedrow.code,
								roleId: this.selectedrow.id,
								menus: menu_list,
							}
							console.log("aaaa", param_);
							// return
							
							me.savem = true;
							Server.call("root/system/saveRoleMenus", param_, function(result) {
								if(result.success){
									me.$message({
										message: '保存成功',
										type: 'success'
									});
									me.savem=false;
									// if(window.top.vue.roleselect.name == me.selectedrow.name){
									// window.top.vue.refreshMenu();
									// }
								}
							}, function(result) {
								me.savem=false;
							});
						},
						
						doSaveMenuByRole(resultMenu, callback) {
							var me = this;
							if (resultMenu.length) {
								var resultMenu_ = resultMenu[0];
								var row_ = {
									role_id: me.selectRole.id,
									type: "menu",
									resource_id: resultMenu_,
									role_type: me.selectRole.type,
								}
								var param_ = {
									
									dataname: "resourceRole",
									entity: row_
								}
								
								Server.call("root/data/saveEntity", param_, function(result) {
									console.log(result);
									resultMenu.remove(resultMenu_);
									
									if (resultMenu.length) {
										me.doSaveMenuByRole(resultMenu, callback);
									}
									else {
										me.$message({
											message: '保存成功',
											type: 'success'
										});
										if (callback) {
											callback();
										}
									}
								});
							}
							else {
								if (callback) {
									callback();
								}
							}
						},
						
						addData(){
							var me = this;
							var config = {
								totab: false, //true: 以Tab导航的方式打开
								width: "500px",
								height: "300px",
								icon: "icon-product",
								text: "页面权限新增",
								id: "page_role_edit",//totab: true时需设置,用于判断是否已打开此页面
								url: "module/config/page/page_role_edit.html",
								data: {},
								delta: {},
								sceneCode: "add",
								callback: function(obj, callback) {
									me.onQuery();
									if (callback) {
										callback();
									}
								}
							};
							me.doPopupByPublic(config);
						},
						
						editData(sceneCode, row) {
							var me = this;
							// var row = this.selectedrow;
							if (!row || !row.id) {
								Root.message({
									type: 'warning',
									message: '请选择要编辑的数据'
								});  
								return false;
							}
							var config = {
								totab: false, //true: 以Tab导航的方式打开
								width: "500px",
								height: "300px",
								icon: "icon-product",
								text: "页面权限修改",
								id: "page_role_edit",//totab: true时需设置,用于判断是否已打开此页面
								url: "module/config/page/page_role_edit.html",
								data: row,
								delta: me.dataname,
								sceneCode: sceneCode,//"refuseedit",//"approval", //"add"//"browse",
								callback: function(obj, callback) {
									me.onQuery();
									if (callback) {
										callback();
									}
								}
							};
							me.doPopupByPublic(config);
						},
						
						delData(row) {
							let me = this;
							// let row = this.selectedrow;
							let name_ = "该数据";
							
							if (!this.dataname) {
								Root.message({
									type: 'warning',
									message: '该事件需指定数据对象'
								});  
								return
							}
							if (!row.id) {
								Root.message({
									type: 'warning',
									message: '该事件需存在数据ID'
								});  
								return
							}
							Root.confirm('确定删除' + name_ + '吗?', '删除提示', {
							  confirmButtonText: '删除',
							  cancelButtonText: '取消',
							  type: 'warning'
							}).then(() => {
								let param = {
									id: row.id,
									dataname: this.dataname,
								}
								Server.call("root/data/deleteEntity", param, function(result) {
									console.log(result);
									Root.message({
										type: 'success',
										message: '删除成功!'
									});
									me.doQuery();
								});
							}).catch(() => {
								Root.message({
									type: 'info',
									message: '已取消删除'
								});          
							});
						},
						
						
					}
				});
			};
			
			loadJsCss(function () {
				initVue();
			});
		</script>
		<style>
			/* 在vue.js中 v-cloak 这个指令是防止页面加载时出现 vuejs 的变量名而设计的 */
			[v-cloak] {
				display: none !important;
			}
			.table_title, .el-tree-node__label {
				font-size: 12px !important;
			}
		</style>
		
	</head>
	
	<body style="margin: 0px;">
		<div v-cloak id="vbody">
			<div id="page_root">
			
				<div class="h_dialog__body" style="margin-top: 10px;">
					<div style="width: 100%; height: 100%; box-sizing: border-box;">
						<div style="width: 29%; height: 100%; float: left; border: 1px solid #ccc;">
							<div style="height: 32px; border-bottom: 1px solid #ccc;display: flex;justify-content: space-between;align-items: center;">
								<div class="table_title" style="line-height: 32px;">
									<span>页面角色列表</span>
								</div>
								<!-- <div style="margin-right: 5px">
									<el-button-group style="margin-left: 3px">
										<el-button @click="addData" :icon="buttonsconfig.add.icon">{{buttonsconfig.add.name}}</el-button>
										<el-button @click="editData":icon="buttonsconfig.alter.icon">{{buttonsconfig.alter.name}}</el-button>
										<el-button @click="delData" :disabled="!(selectedrow && selectedrow.id)"  type="danger" :icon="buttonsconfig.delete.icon">{{buttonsconfig.delete.name}}</el-button>
									</el-button-group>
								</div> -->
							</div>
							<h-table
								v-if="isRefresh && tableFields.length"
								ref="table1"
								:table-fields="tableFields" 
								:table-data="tableData" 
								:is-edit-table-data="isEditTableData"
								:table-height="tableHeight - 76"
								:table-field-click="tablefieldClick"
								:table-buttons-click="tablebuttonclick"
								:is-highlight-row="true"
								:tableloading="tableloading"
								:filtersobj="filterObj"
								:isdraggableorder="false"
								:is-pagination="false"
								:isfilterfield="false"
								:isbasicfilterfields="false"
								:istablebuttons="false"
								
								v-on:get-data="getData"
								v-on:row-click="rowClick"
							>
							</h-table>
							<!-- 
							 :pagesize="pagesize"
							 :pagenum="pagenum"
							 :total="total"
							 -->
						</div>
						<div :style="{width: '70%', height: tableHeight +'px', float: 'right', border: '1px solid #ccc'}">
							<el-container>
								<el-aside :style="{width: '280px', height: tableHeight +'px'} ">
									<div class="table_title" style="border-bottom: 1px solid #ccc; width: 260px; height: 32px; padding-left: 20px;">
										<div style="float: left; margin-left: 10px; line-height: 32px;">
											<span>菜单</span>
										</div>
										<div style="float: right; margin-right: 5px; line-height: 32px;">
											<el-button @click="onSaveMenuByRole" :loading="savem":icon="buttonsconfig.save.icon">{{buttonsconfig.save.name}}</el-button>
										</div>
									</div>
						
									<div :style="{width: '280px', height: tableHeight - 35 +'px', overflow: 'auto'}">
										<!-- <el-tree 
											v-if="refresh_menu" 
											style="margin: 10px;"
											ref="menuTree" 
											:data="menuList" 
											show-checkbox 
											highlight-current
											node-key="id" 
											:default-expanded-keys="start_expanded_keys"
											:default-checked-keys="checkedMenu" 
											:props="defaultProps"
											@node-click="menuTreeNodeClick"
										>
										</el-tree> -->
										
										<h-tree
											v-if="refresh_menu"
											ref="menuTree" 
											:tree-txt-formatter="treeTxtFormatter"
											:is-checkbox="true"
											:default-expand-all="false"
											:tree-data="menuList"
											:default-checked-keys="checkedMenu"
											:is-readonly="true"
											:expand-on-click-node="true"
											@node-click="menuTreeNodeClick"
											@check-click="menuTreeCheckClick"
										>
										</h-tree>
									</div>
								</el-aside>
								<el-main
									:style="{height: tableHeight +'px', 'border-left': '1px solid #ccc', padding: 0}">
									<div class="table_title" style="border-bottom: 1px solid #ccc; height: 32px; padding-left: 20px;">
										<div style="float: left; margin-left: 10px; line-height: 32px;">
											<span>{{title_name ? title_name : "请选择菜单"}}</span>
										</div>
										<div style="float: right; margin-right: 5px; line-height: 32px;">
											<el-button @click="onSaveResourceByPage" :loading="savebt" :disabled="!(pageid && options_tree_bt.length)":icon="buttonsconfig.save.icon">{{buttonsconfig.save.name}}</el-button>
										</div>
									</div>
									<div :style="{height: (tableHeight - 35) +'px', padding: '0px 10px', 'box-sizing': 'border-box', overflow: 'auto'}">
										<h-tree
											ref="btTree" 
											:tree-txt-formatter="treeTxtFormatter_bt"
											:is-checkbox="true"
											:checkstrictly="true"
											:default-expand-all="true"
											:tree-data="options_tree_bt"
											:default-checked-keys="bt_selected"
											:is-readonly="true"
											@check-click="btTreeCheckClick"
										>
										</h-tree>
									</div>
								</el-main>
							</el-container>
						</div>
					</div>
				</div>
			</div>
		</div>
		
		<div id="page_loading" style="position: absolute; top:0px; width: 100vw; height: 50vh;">
			<div class="spinner">
			  <div class="cube1"></div>
			  <div class="cube2"></div>
			</div>
		</div>
		
	</body>
</html>