<!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>
		<script src="../setting.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 v-if="buttons.openanaccount" :disabled="buttons.openanaccount.disabled" @click="acct_mapping('add')">新增商业</el-button>
							<el-button v-if="buttons.openanaccount" :disabled="buttons.openanaccount.disabled" @click="acct_mapping('edit', 'acctstate', 'input')">开户</el-button>
							<el-button v-if="buttons.openanaccount" :disabled="buttons.openanaccount.disabled" @click="h_procedure_act('acctstate', 'input', 'working', 'md_description', '开户', '等待审批中', 'customeracct')">开户提交</el-button> 
							 -->
							<el-button v-if="activeNamezz != 'records'" :disabled="!selectedrow.id" @click="approvalData('register_state')">审批</el-button>
							<el-button v-if="activeNamezz == 'records'" :disabled="!selectedrow.id" @click="showData">查看资质</el-button>
						</el-button-group>
					</div>
				</div>
			
				<div class="topbar-line">
					<div style="float: left; width: 100%;">
						<el-tabs v-model="activeNamezz" @tab-click="handleClick">
							<el-tab-pane label="全部" name="0"></el-tab-pane>
							<el-tab-pane label="资质申报" name="1"></el-tab-pane>
							<el-tab-pane label="资质变更" name="2"></el-tab-pane>
							<el-tab-pane label="审批历史" name="records"></el-tab-pane>
						</el-tabs>
					</div>
					
					<div class="query-icon">
						<i class="iconfont icon-query"></i>
					</div>
					<div v-show="activeNamezz != 'records'" class="query-bar">
						<h-form-filter ref="form1" 
							:form-attr="filterAttr" 
							:table-fields="filterFields" 
							:form-data="filterObj" 
							:isbuttonquery="true"
							
							v-on:on-formchange="onQuery" 
							v-on:show-popup="showFilterPopup"
							v-on:on-query="onQuery"
							v-on:on-init-query="onInitFilter"
							v-on:on-edit-query="onEditFilter"
							>
						</h-form-filter>
					</div>
					
					<div v-show="activeNamezz == 'records'" class="query-bar">
						<h-form-filter ref="form_records" 
							:form-attr="filterAttr" 
							:table-fields="filterFields_records" 
							:form-data="filterObj" 
							:isbuttonquery="false"
							
							v-on:on-formchange="onQueryApprovalRecords" 
							v-on:show-popup="showFilterPopup"
							v-on:on-query="onQueryApprovalRecords"
							v-on:on-init-query="onInitFilterApprovalRecords"
							v-on:on-edit-query="onEditFilter"
							>
						</h-form-filter>
					</div>
					
				</div>
			
				<div v-show="activeNamezz != 'records'" 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"
						:is-show-index="true"
						
						v-on:get-data="getData"
						v-on:edit-data="editData"
						v-on:del-data="delData"
						v-on:cell-click="cellClick"
						v-on:row-click="rowClick"
					>
					</h-table>
				</div>
				<div v-show="activeNamezz == 'records'" class="versionNo">
					<h-table
						v-if="isRefresh"
						ref="table_records"
						:table-fields="tableFields_records" 
						:table-data="tableData_records" 
						:is-edit-table-data="isEditTableData"
						:pagesize="pagesize"
						:pagenum="pagenum"
						:total="total"
						:table-height="tableHeight_records"
						:is-highlight-row="true"
						:is-show-index="true"
						
						v-on:get-data="getApprovalRecordsData"
						v-on:cell-click="cellClickRecords"
						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 setting = getSetting("customer_list");
			var initlized = false;
			
			new ListVue({
				el: "#vbody",
				data: {
					pageAttr: {
						heightType: "page"
					},
					dataname: "getCertificationApproveList",
					tabaleFieldsName: "customer_factorylicence_approval",
					filterFieldsName: "customer_licence_approval",
					
					orderby: "customer_delivery_certification_mapping.update_time desc",
					
					filterObjBydefault: {
						emp_code: localStorage.getItem("emp_code"),
						status: "working"
					},
					paramObjBydefault: {
						
					},
					dataRequest: [
						{
							isClientMode: false,
							code: "code",
							label: "name",
							name: "hierarchy",
							filter: "long_code like '01!0101!010102!010102628!01010218!20210420-0001%'"
						},
						{
							isClientMode: false,
							code: "code",
							label: "name",
							name: "division_level1",
							filter: " level='1' and active='1'"
						},
						{
							isClientMode: false,
							code: "code",
							label: "name",
							name: "deliveryOrganizationOpen",
						}
					],
					dataRequestObj: {},
					
					filterAttr: {
						columnnumber: 4,
						labelwidth: "130px",
						labelposition: "right",
						size: "medium",
						border: "0px solid #c6c6c600",
					},
					
					title: "资质材料审批",
					page: setting.page,
					buttons: setting.buttons,
					
					provinces: [],
					activeNamezz: "0",
					
					total_tab0: 0,
					total_tab1: 0,
					total_tab2: 0,
					total_tabrecords: 0,
					
					filterFields_records: [
						{isshow: "T", field: "md_code", name: "商业编码", fieldname:"", fieldtype: "like", type: ""},
						{isshow: "T", field: "md_description", name: "商业名称", fieldname:"", fieldtype: "like", type: ""},
						{isshow: "T", field: "record_province", name: "备案省份", fieldname:"", type: "select", options: [], props: {value: "code", label: "name", checkStrictly: true}},
						{isshow: "T", field: "dep_code", name: "备案省商务部门", fieldname:"cus_dep_code", type: "select", options: [], props: {value: "md_code", label: "md_description", checkStrictly: true}},
						{isshow: "T", field: "delivery_part_code", name: "发货主体", fieldname:"", type: "select", options: [], props: {value: "code", label: "name", checkStrictly: true}},
						{isshow: "T", field: "business_type", name: "商业属性", fieldname:"business_type", type: "select", options: [{code: 1, name: "直管"}, {code: 2, name: "非直管"}], props: {value: "code", label: "name", checkStrictly: true}},
						{isshow: "T", field: "uscc", name: "统一信用代码", fieldname:"", fieldtype: "like", type: ""},
						{isshow: "T", field: "operator_code", name: "操作人", fieldname:"", type: "popup", valfield: "operator_code_val"},
						{isshow: "T", field: "business_operate_name", name: "商业操作人", fieldname:"", fieldtype: "like", type: ""},
						//{isshow: "T", field: "province_name", name: "商业状态", fieldname:"", fieldtype: "like", type: "select", options: dataRoot.database.province},
					],
				},
				created() {
					this.getdlempcode("accountCustomerCertification");//根据流程获取代理人员,设置this.dl_emp_codestrs
				},
				mounted() {
					var me = this;
					if (this.dataRequest.length) {
						var result = {};
						this.loadRequestData(this.dataRequest, result, function(data) {
							me.dataRequestObj = data;
							if(me.filterFields.length > 0) {
								var filterFields_ = clone(me.filterFields);
								filterFields_.map(e=>{
									if(e.field == "dep_code") {
										e.options = me.dataRequestObj.hierarchy;
									}
									if(e.field == "record_province") {
										e.options = me.dataRequestObj.division_level1;
									}
									if(e.field == "delivery_part_code") {
										e.options = me.dataRequestObj.deliveryOrganizationOpen;
									}
									me.filterFieldsObj[e.field] = e;
								});
								
								me.filterFields = filterFields_;
							}
							
							if(me.filterFields_records.length > 0) {
								var filterFields_records_ = clone(me.filterFields_records);
								filterFields_records_.map(e=>{
									if(e.field == "dep_code") {
										e.options = me.dataRequestObj.hierarchy;
									}
									if(e.field == "record_province") {
										e.options = me.dataRequestObj.division_level1;
									}
									if(e.field == "delivery_part_code") {
										e.options = me.dataRequestObj.deliveryOrganizationOpen;
									}
									me.filterFieldsObj_records[e.field] = e;
								});
								
								me.filterFields_records = filterFields_records_;
							}
							
							if(me.tableFields.length > 0) {
								var tableFields_ = clone(me.tableFields);
								tableFields_.map(e=>{
									if (e.field == "delivery_part_code") {
										e.formatterjson = me.dataRequestObj.map.deliveryOrganizationOpen;
									}
									if (e.field == "customer_part_code") {
										e.formatterjson = me.dataRequestObj.map.dictitem;
									}
									if (e.field == "province") {
										e.formatterjson = me.dataRequestObj.map.division_level1;
									}
								});
								
								me.tableFields = tableFields_;
							}
							
							me.initData();
						});
					}
					else {
						this.initData();
					}
					
					this.$nextTick(() => { // 以服务的方式调用的 Loading 需要异步关闭
						hideLoading();
					});
				},
				methods:{
					initData() {
						//1. run only
						if (initlized) { return; }
						initlized = true;
					  
						//2. query data
						this.filterTxt = "flows.status in ('working', 'refuse')";
						
						var total_tab = "total_tab" + this.activeNamezz;
						this.totaltab = total_tab;
						this.onQuery(total_tab);
					},
					
					onServerInitData(data) {
						var me = this.data;
						me.tableFields = data.tableFields;
						me.filterFields = data.filterFields;
						
						if(me.filterFields.length > 0) {
							me.filterFields.map(e=>{
								me.filterFieldsObj[e.field] = e;
							});
						}	
						if(me.tableFields.length > 0) {
							me.tableFields.map(e=>{
								me.tableFieldsObj[e.field] = e;
							});
						}
					},
					
					onshowFilterPopup(filter) {
						var me = this;
						var fieldObj_ = filter.obj;
						var filterValue = clone(me.filterObj);
						var field_ = fieldObj_.field;
						
						if (field_ == "operator_code") {
							Root.showPopup({
								url: "../md/customer/popup/employee_list.html",
								
								width: 800,
								height: 550,
								callback: function(result, callback) {
									filterValue[field_] = result.row.md_description;
									if (fieldObj_.valfield) {
										filterValue[fieldObj_.valfield] = result.row.md_code;
									}
									me.filterObj = filterValue;
									if (callback) {
										callback();
									}
								}
							});
							
						}
					},
					
					handleClick(tab) {
						var me = this;
						
						var total_tab = "total_tab" + tab.name;
						this.totaltab = total_tab;
						
						if (tab.name == "0") {
							this.filterTxt = " flows.status in ('working', 'refuse')";
						}
						else if (tab.name == "1") {
							this.filterTxt = " flows.status in ('working', 'refuse') and customer_delivery_certification_mapping.old_id is null";
						}
						else if (tab.name == "2") {
							this.filterTxt = " flows.status in ('working', 'refuse') and customer_delivery_certification_mapping.old_id is not null";
						}
						
						if (tab.name == "records") {
							/* 
							 business_id: "d0557eaf6c714edba1b831b2e41b9209"
							 business_type: "accountCustomerDelivery"
							 end_time: "2021-08-20 07:54:23"
							 flow_id: "4fc1b2b0c3574912bb91b2c08edfb982"
							 node_name: "商务准入部经理"
							 start_time: "2021-08-20 07:54:10"
							 status: "open"
							 submit_user_id: "0"
							 submit_user_name: "admin"
							 */
							 var tableFields_records_ = [
							   {isshow: "T", field: "act_end_time", name: "审批时间", width: "180"},
							   {isshow: "T", field: "act_node_name", name: "审批节点", width: "120"},
							   {isshow: "T", field: "act_status", name: "状态", formatter: "formatter_OrderState", iscellclick: true, clickContext: {type: "popup", width: 1200, url: "", sceneCode: "browse", delta: null}},
							   {isshow: "T", field: "submit_user_name", name: "提交人", width: "100"},
							   
							   {isshow: "T", field: "md_code", name: "商业编码", width: "100"},
							   {isshow: "T", field: "md_description", name: "商业名称", width: "200", align: "left"},
							   {isshow: "T", field: "old_code", name: "EAS编码", width: "100", align: "left"},
							   {isshow: "T", field: "uscc", name: "统一信用代码", width: "200"},
							   {isshow: "T", field: "delivery_part_code", name: "发货主体", width: "200", align: "left"},
							   {isshow: "T", field: "business_operate_code", name: "商业操作人", width: "120"},
							   {isshow: "T", field: "remark", name: "备案原因"},
							   {isshow: "T", field: "cer_create_time", name: "资质申报时间", width: "120", formatter: "formatter_date"},
							]
							
							tableFields_records_.map(e=>{
								if (e.field == "delivery_part_code") {
									e.formatterjson = me.dataRequestObj.map.deliveryOrganizationOpen;
								}
								if (e.field == "customer_part_code") {
									e.formatterjson = me.dataRequestObj.map.dictitem;
								}
								
								me.tableFieldsObj_records[e.field] = e;
							});
							
							
							this.tableFields_records = tableFields_records_;
							this.paramRecordsObjBydefault = {
								linkId: "cer_id"
							};
							
							this.dataname_records = "getCertificationApproveHistory";
							
							this.approvaltype = "accountCustomerCertification";
							this.filterTxt = " a.act_business_type='accountCustomerCertification' and a.act_end_time is not null and  a.act_assignee in ('" + localStorage.getItem("emp_code") + "', '" + localStorage.getItem("emp_id") + "', '" + localStorage.getItem("id") + "')"; //(a.act_assignee='" + localStorage.getItem("emp_code") + "' or a.act_assignee='" + localStorage.getItem("id") + "'" + me.dl_emp_codestrs + ")
							this.approvalfields = ["*"]//["md_description", "uscc", "delivery_part_code"];
							this.getMyApprovalRecords(total_tab);
						}
						else {
							this.onQuery(total_tab);
						}
					},
					
					onCellClick(config, obj) {
						var clickContext = this.selectCellField.clickContext;
						var row = obj.row ? obj.row : {};
						if(this.selectCellField.field == "cer_status" && obj.row.cer_flow_id){
							clickContext.hide_close = true;
							// clickContext.url = "";
							// if(obj.row.status != 'input' && obj.row.cer_flow_id){
							// 	clickContext.url = window.top.RootSetting.url_act +  "act/diagram/" + obj.row.cer_flow_id;
							// }
							
							clickContext.url = "../approval/ApprovalList.html";
							clickContext.delta = {
								flow_id: obj.row.cer_flow_id,
								title: obj.row.md_description + "-" + obj.row.delivery_part_name
							}
							
							clickContext.width = "75vw";
							clickContext.height = "65vh";
							clickContext.hide_close = true;
						}
						if(this.selectCellField.field == "act_status" && obj.row.flow_id){
							clickContext.hide_close = true;
							clickContext.url = "../approval/ApprovalList.html";
							clickContext.delta = {
								flow_id: obj.row.flow_id,
								title: obj.row.md_description + "-" + obj.row.delivery_part_name
							}
							
							clickContext.width = "75vw";
							clickContext.height = "65vh";
							clickContext.hide_close = true;
						}
						
						else if(this.selectCellField.field == "md_code"){
							clickContext.totab = true;
							clickContext.id = "approval_licence" + row.id;
							clickContext.url = "../md/customer/customer_licence.html";
							clickContext.text = row.md_description;
							clickContext.sceneCode = "approval";
							clickContext.width = "1500px";
							clickContext.callback = function(obj, callback) {
								me.onQuery();
								if (callback) {
									callback();
								}
							}
						}
						
						if (clickContext && clickContext.type == "popup" && clickContext.url) {
							if(!clickContext.callback) {
								clickContext.callback = null;
							}
							if(!clickContext.width) {
								clickContext.width = "650px";
							}
							
							config.combine({
								hide_close: clickContext.hide_close,
								totab: clickContext.totab,
								width: clickContext.width,
								icon: "icon-product",
								text: clickContext.text,
								id: clickContext.id,
								url: clickContext.url,
								sceneCode: clickContext.sceneCode,
								data: row,
								delta: clickContext.delta ? clickContext.delta : {},
								callback: clickContext.callback
							})
						}
						else {
							return false;
						}
						
						return true;
					},
					
					/* onCellClick(config, obj) {
						var clickContext = this.selectCellField.clickContext;
						
						if (clickContext && clickContext.type == "popup") {
							config.combine({
								url: clickContext.url,
								sceneCode: clickContext.sceneCode,
								data: obj.row,
								delta: clickContext.delta ? clickContext.delta : {},
							})
						}
						else {
							return false;
						}
						
						return true;
					}, */
					
					/* acct_mapping(type, field_, original_val) {
						let me = this;
						let row = {};
						var text_ = "资质审批";
						var id_ = "applicence";
						row = this.selectedrow;
						if (this.selectedrow[field_] && this.selectedrow[field_] != original_val) {
							Root.message({
								type: 'warning',
								message: "已开户"
							})
							return;
						}
						
						text_ = row.md_description;
						id_ = "licence" + row.id;
						
						var config = {
							totab: true,
							width: "1500px",
							icon: "icon-product",
							text: text_,
							id: id_,
							url: "../md/customer/customer_acct.html",
							data: row,
							delta: "",
							callback: function(obj, callback) {
								//me.uploadFileAfter(obj);
								if (callback) {
									callback();
								}
							}
						};
						this.doPopupByPublic(config);
					}, */
					
					/* consignee_mapping(){
						var row = this.selectedrow;
						var row_ ;
						let me = this;
						if (!row.id) {
							Root.message({
								type: 'warning',
								message: '请先选择一条数据'
							})
							return;
						}
						
						Root.popupParames = {
							width: "900px",
							//height: "580px",
							url: "../md/customer/consignee_mapping.html",
						 	callback: function(obj, callback) {
								if (callback) {
									callback();
								}
							} 
						};
						
						Root.popupParames.data = row; 
						Root.showPopup(Root.popupParames);
						
					}, */
					/* invoice_mapping(){
						var row = this.selectedrow;
						
						if (!row.id) {
							Root.message({
								type: 'warning',
								message: '请先选择一条数据'
							})
							return;
						}
						
					}, */
					/* licence_mapping(){
						var row = this.selectedrow;
						
						if (!row.id) {
							Root.message({
								type: 'warning',
								message: '请先选择一条数据'
							})
							return;
						}
						Root.popupParames = {
							width: "900px",
							//height: "580px",
							url: "../md/customer/licence_mapping.html",
						 	callback: function(obj, callback) {
								if (callback) {
									callback();
								}
							} 
						};
						
						Root.popupParames.data = row; 
						Root.showPopup(Root.popupParames);
						
						
					}, */
					//绑定审批流程的
					h_procedure_act(field_, original_val, new_val, confirm_field, confirm_type, success_val) {
						var row = this.selectedrow;
						
						if (!row.field1) {
							Root.message({
								type: 'warning',
								message: '请先选择一条数据'
							})
							return;
						}
						
						if (row && row[field_] != original_val) {
							Root.message({
								type: 'warning',
								message: row[field_]
							})
							return;
						}
						
						Root.confirm('确定' + confirm_type + '-' + row[confirm_field] + '-吗?', confirm_type + '提示', {
							confirmButtonText: confirm_type,
							cancelButtonText: '取消',
							type: 'warning'
						}).then(() => {
							if (field_ == "field10") {//提交审批
								
							}
							else if (field_ == "field15") {//提交开户提交审批
								
							}
							
							this.selectedrow[field_] = new_val;
							window.top.setAlertNum();
							Root.message({
								type: 'success',
								message: success_val
							});
						}).catch(() => {
							Root.message({
								type: 'info',
								message: '已取消'
							});          
						});
					},
					
					approvalData() {
						let me = this;
						var row = this.selectedrow;
						var text_ = row.md_description + row.delivery_part_name;
						var id_ = "approval_licence" + row.id;
							/* this.getFormData(row); */
							
						var config = {
							totab: true,
							width: "1500px",
							icon: "icon-product",
							text: text_,
							id: id_,
							url: "../md/customer/customer_licence.html",
							sceneCode: "approval",
							data: row,
							delta: "",
							callback: function(obj, callback) {
								//me.uploadFileAfter(obj);
								me.onQuery();
								if (callback) {
									callback();
								}
							}
						};
						this.doPopupByPublic(config);
					},
					
					showData() {
						let me = this;
						var row = this.selectedrow;
						var text_ = row.md_description + row.delivery_part_name;
						var id_ = "show_licence" + row.id;
							/* this.getFormData(row); */
							
						var config = {
							totab: true,
							width: "1500px",
							icon: "icon-product",
							text: text_,
							id: id_,
							url: "../md/customer/customer_licence.html",
							sceneCode: "browse",
							data: row,
							delta: "",
							callback: function(obj, callback) {
								//me.uploadFileAfter(obj);
								//me.onQuery();
								if (callback) {
									callback();
								}
							}
						};
						this.doPopupByPublic(config);
					},
					
				}
			});

		</script>
		<style>
			
		</style>
	</body>
</html>