<!doctype html>
<html>
	<head>
		<meta charset="utf-8">
		<title>流程节点人员配置</title>
		<script src="../../../js/vue/vue.js"></script>
		<script src="../../../js/vue/element-ui/lib/index.js"></script>
		<script src="../../../js/myelement.js"></script>
		<script src="../../../js/vue/page.js"></script>
		
		<link href="../../../js/vue/element-ui/lib/theme-chalk/index.css" rel="stylesheet">
		<link href="../../../css/myelement.css" rel="stylesheet">
		<link href="../../../css/iconfont.css" rel="stylesheet">
		<link href="../../../css/page.css" rel="stylesheet">
		<link href="//at.alicdn.com/t/font_2374495_13ltsxm2eor.css" rel="stylesheet">
	</head>
	
	<body>
		<div id="vbody">
			<div id="page_root">
				<div class="topbar">
					<span>{{title}}</span>
					
					<!-- <div style="float: right; margin-right: 24px;">
						<el-button-group style="margin-left: 3px;">
							<el-button @click="download()">导出</el-button>
						</el-button-group>
					</div> -->
				</div>
			
				<div class="topbar-line">
					<div class="query-icon">
						<i class="iconfont icon-query"></i>
					</div>
					<div class="query-bar">
						<h-form-filter ref="form1" 
							:form-attr="filterAttr" 
							:table-fields="filterFields" 
							:form-data="filterObj" 
							v-on:visible-change="cellVisibleChange"
							
							v-on:on-query="onQuery"
							v-on:on-init-query="onInitFilter"
							v-on:on-edit-query="onEditFilter"
							>
						</h-form-filter>
					</div>
				</div>
			
				<div class="versionNo">
					<h-table
						v-if="isRefresh"
						ref="table1"
						:table-fields="tableFields" 
						:table-data="tableData" 
						:is-edit-table-data="isEditTableData"
						:pagesize="pagesize"
						:pagenum="pagenum"
						:total="total"
						:table-height="tableHeight"
						:is-highlight-row="true"
						v-on:get-data="getData"
						v-on:edit-data="editData"
						v-on:del-data="delData"
						v-on:row-click="rowClick"
					>
					</h-table>
				</div>
			</div>
			
			<div id="page_loading" style="position: absolute; top:0px; width: 100vw; height: 100vh;">
				<div class="spinner">
				  <div class="cube1"></div>
				  <div class="cube2"></div>
				</div>
			</div>
		</div>	
		
		<script type="text/javascript">
			var initlized = false;
			
			new ListVue({
				el: "#vbody",
				data: {
					pageAttr: {
						heightType: "page"
					},
					dataname: "actApproveField",
					filterFieldsName: "nodeEmpConfig_",
					title: "流程节点人员配置",
				},
				created() {
					
				},
				
				mounted() {
					this.initData();
					this.$nextTick(() => { // 以服务的方式调用的 Loading 需要异步关闭
						hideLoading();
					});
				},
				
				methods:{
					initData() {
						if (initlized) { return; }
						initlized = true;
						
						//this.onQuery();
					},
					onInitFilter: function() {
						
						//清空
						this.filterObj = {};
						this.tableFields = [];
						this.tableData = [];
						this.pagesize = 10;
						this.pagenum= 1;
						this.total= 0;
						
					},
					onServerInitData(data) {
						var me = this.data;
						
						me.filterFields = data.filterFields;
								
						if(me.filterFields.length > 0) {
							for(var i=0; i < me.filterFields.length; i++) {
								let fieldObj_ = me.filterFields[i];
								
								me.filterFieldsObj[fieldObj_.field] = fieldObj_;
							}
						}	
						
					},
					doQuery() {
						let me = this;
						let param_ = {
							isClientMode: false,
							dataname: "actApproveField",
							filter: "type = '" + this.filterObj.type +"' and role_id = '"+this.filterObj.name+"'",
							orderby:"level,order_no "
						}
						Server.call("root/data/getEntitySet", param_, function(result) {
							var tableFields_ = [];
							for(var i=0;i<result.data.entityset.length;i++){
								var tableFields_1 = {};
								tableFields_1.isshow ="T";
								tableFields_1.field =result.data.entityset[i].field;
								tableFields_1.name =result.data.entityset[i].remark;
								tableFields_.push(tableFields_1)
							}
							me.tableFields =tableFields_;
							let param_ = {
								isClientMode: false,
								dataname: "actApproveEmp",
								filter: "type = '" + me.filterObj.type +"' and role_id = '"+me.filterObj.name+"'",
								page: {
									no: me.pagenum,
									pagesize: me.pagesize
								},
							}
							Server.call("root/data/getEntitySet", param_, function(result1) {
								me.total = 0;
								me.total = result1.data.page.recordcount; 
								var tableData_ = result1.data.entityset
								for(var i=0;i<result1.data.entityset.length;i++){
									for(var j=0;j<me.tableFields.length;j++){
										var name_ = me.tableFields[j].field
										var k = j+1
										tableData_[i][name_] = result1.data.entityset[i]["field"+k];
									}
								}
								me.tableData = tableData_;
							});
						});
					},
					cellVisibleChange (obj) {
						var me = this;
						
						if (obj.field == "type") {
							let param_ = {
								isClientMode: false,
								dataname: "actKeyMapping",
								filter: "editable = 1",
							}
							Server.call("root/data/getEntitySet", param_, function(result) {
								obj.options = result.data.entityset;
							
							});
						}
						else if (obj.field == "name") {
							if(!this.filterObj.type){
								Root.message({
									type: 'warning',
									message: '请先选择流程'
								});  
								return ;
							}
							let param_ = {
								isClientMode: false,
								dataname: "getActRole",
								filter: "act_approve_emp.type = '" + this.filterObj.type +"'",
							}
							Server.call("root/data/getEntitySet", param_, function(result) {
								obj.options = result.data.entityset;
							});
						}
					},
					
					
				
				}
			});
		</script>
		<style>
		   .el-select__tags{
		     max-height: 28px;
		     overflow: hidden;
			}
		  </style>
	</body>
</html>