页面初始化操作
js
var processData = null
$(function () {
initView();
initTable();
// test();
})
function initView() {
layui.use(['laydate', 'form'], function () {
var laydate = layui.laydate;
laydate.render({
elem: '#applyDateTimeRange',
type: 'datetime',
range: true
});
});
}
初始化表格操作
js
function initTable() {
//初始化table
var headerObj = [[
{
title: '序号', width: 60, templet: function (d) {
return d.LAY_TABLE_INDEX + 1;
}
},
{field: "systemType", title: "平台", width: 100, sort: false,},
{field: "applyOrderDetailId", title: "工单号", minWidth: 70, sort: false},
{field: "createTime", title: "申请时间", minWidth: 60, sort: false},
{field: "applyUserName", title: "申请人", width: 100, sort: false},
{
field: "dealState", title: "状态", width: 100, sort: false, templet: function (d) {
if (d.dealState == 0) {
return "未开启";
} else if (d.dealState == 1) {
return "流程中";
} else if (d.dealState == 2) {
return "已完成";
} else{
return "未知(" + d.applyStatus + ")";
}
}
},
{field: "", title: "操作", minWidth: 200, toolbar: '#startFlowTableBar',}
]];
layui.use(['table', 'form'], function (exports) {
var table = layui.table;
table.render({
elem: '#searchTable',
url: 'http://localhost:8080/getStartList',
page: true, //显示分页默认不显示
cols: headerObj,
// request: {
// pageName: 'page',
// limitName: 'limit'
// },
// where: {
// applyStatus: $("#applyStatus").val()
// },
response: {
statusName: 'status',
statusCode: 'normal',
countName: 'count',
dataName: 'data'
},
parseData: function (res) {
console.log("+++",res)
return {
"count": res.data.total,
"data": res.data.list,
"status": "normal"
};
}
});
//table操作事件
table.on('tool(searchTable)', function (row) {
var data = row.data;
var layEvent = row.event;
var tr = row.tr;
if (layEvent == 'level2Check') {
initStartFlowView(data);
} else if (layEvent == 'showDetailEvent') {
// showDetailView(data)
ajax_load_detail(data)
}else if (layEvent == 'showFlowEvent'){
ajax_load_flow(data)
}
});
//搜索按钮
$('#searchBtn').on('click', function () {
var moduleType = $("#moduleType").val();
var applyStatus = $("#applyStatus").val();
var applyDateTimeRange = $("#applyDateTimeRange").val();
table.reload('searchTable', {
page: {
curr: 1 //重新从第 1 页开始
},
where: {
moduleType: moduleType,
applyStatus: applyStatus,
applyDateTimeRange: applyDateTimeRange
}
});
});
});
}
js
function showDetailView(data) {
console.log("data",data)
var resApplyId = data.resApplyId;
var moduleType = data.moduleType;
layui.use(['layer', 'laytpl', 'form', 'table'], function () {
var layer = layui.layer;
var form = layui.form;
var laytpl = layui.laytpl;
var table = layui.table;
var tplHtml = insertFormTpl.innerHTML;
var index;
laytpl(tplHtml).render({}, function (html) {
index = layer.open({
type: 1,
title: '展示详情',
area: ['600px', '310px'],
offset: 'auto',
maxmin: true,
content: html
});
form.render();
});
form.on('submit(insertFormBtn)', function (data) {
console.log("获取到监听事件")
$.ajax({
url: "http://localhost:8080/getApplyOrderDetail?orderId=" + resApplyId,
type: "POST",
dataType: "json",
data: {
moduleType: moduleType,
checkResult: data.field.checkResult,
description: data.field.description
},
success: function (data) {
if (data.status == 'normal') {
layer.msg("审批成功");
table.reload("searchTable", {});
layer.close(index);
} else {
layer.msg(data.exception.error_msg || '审批失败!');
}
}
});
return false;
});
});
}
js
function ajax_load_detail(data) {
var resApplyId = data.applyOrderDetailId;
$.ajax({
url: "http://localhost:8080/getApplyOrderDetail?orderId=" + resApplyId,
type: "GET",
dataType: "json",
success: function (data_r) {
console.log("+++++++" + data_r)
console.log("====" + JSON.stringify(data_r))
if (data_r.msg == 'NORMAL') {
layui.use(['layer', 'laytpl', 'form', 'table'], function () {
var layer = layui.layer;
var form = layui.form;
var laytpl = layui.laytpl;
var table = layui.table;
var tplHtml = detailHtml.innerHTML;
laytpl(tplHtml).render({}, function (html) {
index = layer.open({
type: 1,
title: '展示详情',
area: ['600px', '310px'],
offset: 'auto',
maxmin: true,
content: html
});
form.render();
});
//TODO 设置每个字段对应的值
form.val("showApplyDetail", {
"applyOrderDetailId": data_r.data.applyOrderDetailId,
"applyOrderDetail": data_r.data.applyOrderDetail
})
})
} else {
layer.msg();
}
}
});
}
整个页面的HTML
html
<!doctype html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>海燕-国美统一开发者平台 - 我的申请</title>
<meta content="text/html;charset=UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE-edge" />
<meta name="viewport" content="width=device-width,initial-scale=1" />
<link rel="stylesheet" th:href="@{/css/cat-common.css}" />
<link rel="stylesheet" th:href="@{/css/font.css}">
<link rel="stylesheet" th:href="@{/css/xadmin.css}">
<link rel="stylesheet" th:href="@{/lib/layui/css/layui.css}" />
<link rel="stylesheet" th:href="@{/css/common.css}">
<style>
.user_left{
width: 45%;
float: left;
margin: 20px 0 0 5%;
}
</style>
</head>
<body>
<div class="cat-body">
<h1 style="color: red">开启流程相关操作(开发中。。。。)</h1>
<!--<div class="layui-row">-->
<!--<form class="layui-form layui-col-md12 x-so" style="text-align: justify">-->
<!--<div class="layui-inline">-->
<!--<label class="layui-form-label">申请类型:</label>-->
<!--<div class="layui-input-inline">-->
<!--<select name="moduleType" id="moduleType">-->
<!--<option value="">全部</option>-->
<!--<option value="domain_scan_new">域名扫描</option>-->
<!--<option value="kvm_new">虚拟机</option>-->
<!--<option value="db_new">数据库</option>-->
<!--<option value="appDeploy_new">应用服务部署</option>-->
<!--<option value="net-acl">网络权限</option>-->
<!--<option value="net-lvs">负载均衡</option>-->
<!--<option value="nginx_conf_update_new">Nginx配置变更</option>-->
<!--<option value="cdn_link_up_new">CDN接入</option>-->
<!--<option value="cdn_cache_clean_new">CDN缓存清理</option>-->
<!--<option value="code_auth_new">代码权限申请</option>-->
<!--<option value="jms">堡垒机申请</option>-->
<!--<option value="domainHighDefense_new">域名高防</option>-->
<!--<option value="net-dns">域名解析</option>-->
<!--</select>-->
<!--</div>-->
<!--</div>-->
<!--<div class="layui-inline">-->
<!--<label class="layui-form-label">申请时间:</label>-->
<!--<input type="text" class="layui-input" id="applyDateTimeRange" placeholder="开始日期 - 结束日期" readonly style="width:300px">-->
<!--</div>-->
<!--<div class="layui-inline">-->
<!--<label class="layui-form-label">受理部门:</label>-->
<!--<div class="layui-input-inline">-->
<!--<select name="applyDept" id="applyDept">-->
<!--<option value="0">全部</option>-->
<!--<option value="1">DBA-数据库运维</option>-->
<!--<option value="2">SRE-应用运维</option>-->
<!--<option value="3">SA-云科</option>-->
<!--<option value="4">DTM-桌面运维</option>-->
<!--<option value="5">NS-网安</option>-->
<!--<option value="6">CR-代码</option>-->
<!--</select>-->
<!--</div>-->
<!--</div>-->
<!--<div class="layui-btn" title="查询" id="searchBtn">-->
<!--<i class="layui-icon"></i>查询-->
<!--</div>-->
<!--</form>-->
<!--</div>-->
<div class="layui-row">
<div class="cat-block">
<!-- TODO 1.修改button名称; -->
<!--<button class="layui-btn _add_apply" οnclick="applyNew();">-->
<!--<i class="layui-icon"></i>新建自定义工单</button>-->
<button class="layui-btn" onclick="reload_data();">
<i class="layui-icon"></i>刷新数据</button>
</div>
</div>
<!--结果 -->
<table id="searchTable" lay-filter="searchTable" lay-size="sm"></table>
</div>
<script type="text/html" id="startFlowTableBar">
{{# if(d.dealState==0){ }}
<a class="layui-btn layui-btn-normal layui-btn-xs" style="color: #0f3788;" lay-event="level2Check">开启流程</a>
{{# } }}
<a class="layui-btn layui-btn-normal layui-btn-xs" style="color: blue" lay-event="showFlowEvent">查看进度</a>
<a class="layui-btn layui-btn-normal layui-btn-xs" style="color: green" lay-event="showDetailEvent">工单详情</a>
<!--{{# if(d.applyStatus==1 || d.applyStatus==6){ }}-->
<!--<a class="layui-btn layui-btn-lg layui-btn-xs" lay-event="detail">详情</a>-->
<!--<a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="applyFlow">进度</a>-->
<!--{{# }else if((d.applyStatus==2 || d.applyStatus==5) && (d.applyStar==null || d.applyStar==0)){ }}-->
<!--<a class="layui-btn layui-btn-lg layui-btn-xs" lay-event="detail">详情</a>-->
<!--<a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="applyFlow">进度</a>-->
<!--<a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="comment">评论</a>-->
<!--{{# }else if((d.applyStatus==2 || d.applyStatus==5) && (d.applyStar!=null && d.applyStar!=0)){ }}-->
<!--<a class="layui-btn layui-btn-lg layui-btn-xs" lay-event="detail">详情</a>-->
<!--<a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="applyFlow">进度</a>-->
<!--<a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="lookComment">查看评论</a>-->
<!--{{# }else if(d.applyStatus==4 || d.applyStatus==7){ }}-->
<!--<a class="layui-btn layui-btn-lg layui-btn-xs" lay-event="detail">详情</a>-->
<!--<a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="applyFlow">进度</a>-->
<!--<a class="layui-btn layui-btn-warm layui-btn-xs" lay-event="reApply">重新提交</a>-->
<!--{{# }else{ }}-->
<!--<a class="layui-btn layui-btn-lg layui-btn-xs" lay-event="detail">详情</a>-->
<!--{{# } }}-->
</script>
<script type="text/html" id="insertFormTpl">
<div class="x-body">
<form class="layui-form" action="" lay-filter="insertForm">
<div class="layui-form-item">
<label class="layui-form-label">审批结果</label>
<div class="layui-input-block">
<input type="radio" name="checkResult" value="2" title="通过" checked>
<input type="radio" name="checkResult" value="3" title="拒绝">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">审批意见</label>
<div class="layui-input-block">
<textarea name="description" lay-verify="required" placeholder="请输入内容" class="layui-textarea"></textarea>
</div>
</div>
<div class="layui-form-item">
<div class="layui-input-block">
<button class='layui-btn' lay-submit lay-filter='insertFormBtn'>提交</button>
</div>
</div>
</form>
</div>
</script>
<script type="text/html" id="detailHtml">
<div class="x-body">
<h1 lay-filter="detailString">展示详情</h1>
<form class="layui-form" action="" lay-filter="showApplyDetail">
<!-- 表单类型 -->
<div class="layui-form-item">
<label class="layui-form-label">工单号</label>
<div class="layui-input-block">
<input type="text" name="applyOrderDetailId" class="layui-input" disabled>
</div>
</div>
<!-- 申请原因 -->
<div class="layui-form-item">
<label class="layui-form-label">工单详情</label>
<div class="layui-input-block">
<textarea name="applyOrderDetail" class="layui-textarea" disabled></textarea>
</div>
</div>
</form>
</div>
</script>
<script type="text/html" id="startFlow">
<div class="x-body">
<h1>开启流程操作待开发</h1>
<form class="layui-form" name="addForm" id="addForm">
<div class="user_left" id="selectPerson">
<!-- 一个标准的input组合,这个是固定项 -->
<div class="layui-form-item">
<label class="layui-form-label">申请人</label>
<div class="layui-input-block">
<input type="text" id="title" name="title" lay-verify="required" class="layui-input">
</div>
</div>
<!-- 根据属性List生成的input追加在这里-->
</div>
<div class="layui-form-item">
<label class="layui-form-label">开启备注信息</label>
<div class="layui-input-block">
<textarea name="description" lay-verify="required" placeholder="请输入内容" class="layui-textarea"></textarea>
</div>
</div>
<!-- buttons -->
<div class="layui-form-item" style="margin-left: 5%;">
<div class="layui-input-block">
<!-- 这里的提交按钮是button形式,不是submit -->
<!--<input type="button" id="insert" onclick="return check()" class="layui-btn" value="开启流程" />-->
<input type="button" id="insert" lay-submit lay-filter='startFormBtn' class="layui-btn" value="开启流程" />
<!-- 清空表单,这个按钮隐藏了 -->
<input type="button" name="reset" class="layui-btn" value="重置" />
</div>
</div>
</form>
</div>
</script>
<script type="text/html" id="showFlow">
<div class="x-body">
<h1>开启流程操作待开发</h1>
<form class="layui-form" name="addForm" >
<div class="user_left" id="showPerson">
<!-- 一个标准的input组合,这个是固定项 -->
<div class="layui-form-item">
<label class="layui-form-label">申请人</label>
<div class="layui-input-block">
<input type="text" id="person" name="title" lay-verify="required" class="layui-input">
</div>
</div>
<!-- 根据属性List生成的input追加在这里-->
</div>
</form>
</div>
</script>
<script type="text/html" id="insertTpl">
<div class="x-body">
<form class="layui-form" action="">
<!-- 域账号 -->
<div class="layui-form-item layui-form-text">
<label class="layui-form-label">主题</label>
<div class="layui-input-block">
<input type="text" name="topic" autocomplete="off" class="layui-input">
</div>
</div>
<!-- 权限 -->
<div class="layui-form-item">
<label class="layui-form-label">受理部门</label>
<div class="layui-input-block">
<select name="dept" lay-verify="dept" lay-filter="dept">
<option value="-1">请选择一个受理部门</option>
<option value="1">DBA-数据库运维</option>
<option value="2">SRE-应用运维</option>
<option value="3">SA-云科</option>
<option value="4">DTM-桌面运维</option>
<option value="5">NS-网安</option>
<option value="6">CR-代码</option>
</select>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">具体描述</label>
<div class="layui-input-block">
<textarea name="applyDesc" lay-filter="required" class="layui-textarea"></textarea>
</div>
</div>
<!-- <div class="layui-form-item"></div> -->
<div class="layui-form-item">
<div class="layui-input-block">
<button class='layui-btn' lay-submit lay-filter="insertApply">提交</button>
</div>
</div>
</form>
</div>
</script>
<script type="text/javascript" th:src="@{/lib/jquery/jquery-3.3.1.min.js}"></script>
<script type="text/javascript" th:src="@{/lib/layui/layui.js}" charset="utf-8"></script>
<script type="text/javascript" th:src="@{/js/common.js}"></script>
<script type="text/javascript" th:src="@{/js/approval/startApproval.js}"></script>
</body>
整个页面的JS代码
js
var processData = null
$(function () {
initView();
initTable();
// test();
})
function initView() {
layui.use(['laydate', 'form'], function () {
var laydate = layui.laydate;
laydate.render({
elem: '#applyDateTimeRange',
type: 'datetime',
range: true
});
});
}
function initTable() {
//初始化table
var headerObj = [[
{
title: '序号', width: 60, templet: function (d) {
return d.LAY_TABLE_INDEX + 1;
}
},
{field: "systemType", title: "平台", width: 100, sort: false,},
{field: "applyOrderDetailId", title: "工单号", minWidth: 70, sort: false},
{field: "createTime", title: "申请时间", minWidth: 60, sort: false},
{field: "applyUserName", title: "申请人", width: 100, sort: false},
{
field: "dealState", title: "状态", width: 100, sort: false, templet: function (d) {
if (d.dealState == 0) {
return "未开启";
} else if (d.dealState == 1) {
return "流程中";
} else if (d.dealState == 2) {
return "已完成";
} else{
return "未知(" + d.applyStatus + ")";
}
}
},
{field: "", title: "操作", minWidth: 200, toolbar: '#startFlowTableBar',}
]];
layui.use(['table', 'form'], function (exports) {
var table = layui.table;
table.render({
elem: '#searchTable',
url: 'http://localhost:8080/getStartList',
page: true, //显示分页默认不显示
cols: headerObj,
// request: {
// pageName: 'page',
// limitName: 'limit'
// },
// where: {
// applyStatus: $("#applyStatus").val()
// },
response: {
statusName: 'status',
statusCode: 'normal',
countName: 'count',
dataName: 'data'
},
parseData: function (res) {
console.log("+++",res)
return {
"count": res.data.total,
"data": res.data.list,
"status": "normal"
};
}
});
//table操作事件
table.on('tool(searchTable)', function (row) {
var data = row.data;
var layEvent = row.event;
var tr = row.tr;
if (layEvent == 'level2Check') {
initStartFlowView(data);
} else if (layEvent == 'showDetailEvent') {
// showDetailView(data)
ajax_load_detail(data)
}else if (layEvent == 'showFlowEvent'){
ajax_load_flow(data)
}
});
//搜索按钮
$('#searchBtn').on('click', function () {
var moduleType = $("#moduleType").val();
var applyStatus = $("#applyStatus").val();
var applyDateTimeRange = $("#applyDateTimeRange").val();
table.reload('searchTable', {
page: {
curr: 1 //重新从第 1 页开始
},
where: {
moduleType: moduleType,
applyStatus: applyStatus,
applyDateTimeRange: applyDateTimeRange
}
});
});
});
}
//开启流程
function initStartFlowView(data) {
console.log("开启流程操作",data)
var resApplyId = data.applyOrderDetailId;
layui.use(['layer', 'laytpl', 'form', 'table'], function () {
var layer = layui.layer;
var form = layui.form;
var laytpl = layui.laytpl;
var table = layui.table;
var tplHtml = startFlow.innerHTML;
// console.log("---------",tplHtml)
var index;
laytpl(tplHtml).render({}, function (html) {
index = layer.open({
type: 1,
title: '开启流程',
area: ['800px', '700px'],
offset: 'auto',
maxmin: true,
content: html
});
form.render();
});
// test();
initInputView()
form.on('submit(startFormBtn)', function (data) {
console.log("获取到监听事件")
// jsonToObject(data,processData.data.length)
var jsonStr = initFlowData(data,resApplyId,processData)
console.log("获取全局数据",processData)
console.log(jsonStr)
$.ajax({
url: "http://localhost:8080/startTask",
type: "POST",
dataType: "json",
contentType:"application/json",
data:jsonStr,
success: function (data) {
console.log(data)
if (data.msg == 'NORMAL') {
layer.msg("审批成功");
table.reload("searchTable", {});
layer.close(index);
} else {
layer.msg();
}
}
});
return false;
});
});
}
// 展示详情
function showDetailView(data) {
console.log("data",data)
var resApplyId = data.resApplyId;
var moduleType = data.moduleType;
layui.use(['layer', 'laytpl', 'form', 'table'], function () {
var layer = layui.layer;
var form = layui.form;
var laytpl = layui.laytpl;
var table = layui.table;
var tplHtml = insertFormTpl.innerHTML;
var index;
laytpl(tplHtml).render({}, function (html) {
index = layer.open({
type: 1,
title: '展示详情',
area: ['600px', '310px'],
offset: 'auto',
maxmin: true,
content: html
});
form.render();
});
form.on('submit(insertFormBtn)', function (data) {
console.log("获取到监听事件")
$.ajax({
url: "http://localhost:8080/getApplyOrderDetail?orderId=" + resApplyId,
type: "POST",
dataType: "json",
data: {
moduleType: moduleType,
checkResult: data.field.checkResult,
description: data.field.description
},
success: function (data) {
if (data.status == 'normal') {
layer.msg("审批成功");
table.reload("searchTable", {});
layer.close(index);
} else {
layer.msg(data.exception.error_msg || '审批失败!');
}
}
});
return false;
});
});
}
function ajax_load_detail(data) {
var resApplyId = data.applyOrderDetailId;
$.ajax({
url: "http://localhost:8080/getApplyOrderDetail?orderId=" + resApplyId,
type: "GET",
dataType: "json",
success: function (data_r) {
console.log("+++++++" + data_r)
console.log("====" + JSON.stringify(data_r))
if (data_r.msg == 'NORMAL') {
layui.use(['layer', 'laytpl', 'form', 'table'], function () {
var layer = layui.layer;
var form = layui.form;
var laytpl = layui.laytpl;
var table = layui.table;
var tplHtml = detailHtml.innerHTML;
laytpl(tplHtml).render({}, function (html) {
index = layer.open({
type: 1,
title: '展示详情',
area: ['600px', '310px'],
offset: 'auto',
maxmin: true,
content: html
});
form.render();
});
//TODO 设置每个字段对应的值
form.val("showApplyDetail", {
"applyOrderDetailId": data_r.data.applyOrderDetailId,
"applyOrderDetail": data_r.data.applyOrderDetail
})
})
} else {
layer.msg();
}
}
});
}
function ajax_load_flow(data) {
initFlow(data)
// layui.use(['layer', 'laytpl', 'form', 'table'], function () {
// var layer = layui.layer;
// var form = layui.form;
// var laytpl = layui.laytpl;
// var table = layui.table;
//
// var tplHtml = showFlow.innerHTML;
// // console.log("---------",tplHtml)
//
// var index;
// laytpl(tplHtml).render({}, function (html) {
// index = layer.open({
// type: 1,
// title: '开启流程',
// area: ['800px', '700px'],
// offset: 'auto',
// maxmin: true,
// content: html
// });
// form.render();
// });
// initFlow(data)
// });
}
function initFlow(data_p) {
var resApplyId = data_p.applyOrderDetailId;
$.ajax({
url: "http://localhost:8080/getApprovalFlowDetail?applyId=" + resApplyId,
type: "GET",
dataType: "json",
success: function (data) {
console.log("+++++++" + data)
console.log("====" + JSON.stringify(data))
initApplyFlowView(data.data)
//
// //遍历List
// for (var i = 0; i < data.data.length; i++) {
// //根据属性List拼接LayUI风格的input代码
// str = "<div class='layui-form-item'><label class='layui-form-label'>"
// + data.data[i].currentNodeDealId
// + "</label><div class='layui-input-block'><input type='text' id='"
// + data.data[i].approvalPersonName
// + "' name='"
// + data.data[i].approvalPersonName
// + "' placeholder='"
// + data.data[i].approvalPersonNote
// + "' class='layui-input'></div></div>"
//
// //追加到界面,property是后面div的id<div class="user_left" id="property">
// var html = document.getElementById("showPerson").innerHTML;
// document.getElementById("showPerson").innerHTML = html + str;
// }
}
});
}
function test() {
var jsonData ="[{\"propertyShow\":\"一级审批\",\"propertyName\":\"test\",\"propertyTips\":\"test\"},{\"propertyShow\":\"二级审批\",\"propertyName\":\"test\",\"propertyTips\":\"test\"},{\n" +
"\"propertyShow\":\"三级审批\",\"propertyName\":\"test\",\"propertyTips\":\"test\"}]"
var data = JSON.parse(jsonData)
//遍历List
for (var i = 0; i < data.length; i++) {
//根据属性List拼接LayUI风格的input代码
str = "<div class='layui-form-item'><label class='layui-form-label'>"
+ data[i].propertyShow
+ "</label><div class='layui-input-block'><input type='text' id='"
+ data[i].propertyName
+ "' name='"
+ data[i].propertyName
+ "' placeholder='"
+ data[i].propertyTips
+ "' class='layui-input'></div></div>"
//追加到界面,property是后面div的id<div class="user_left" id="property">
// var html = document.getElementById("property").innerHTML;
// document.getElementById("property").innerHTML = html + str;
// var html = property.innerHTML;
// property.innerHTML = html + str;
var html = document.getElementById("selectPerson").innerHTML;
document.getElementById("selectPerson").innerHTML=html+str;
}
}
function initInputView() {
$.ajax({ //获取属性List<Map>数据return data_r;
type: "get",
url: "http://localhost:8080/getProcess",
dataType: "json",
success: function (data) {
//遍历List
loadData(data)
for (var i = 0; i < data.data.length; i++) {
//根据属性List拼接LayUI风格的input代码
str = "<div class='layui-form-item'>" +
"<label class='layui-form-label'>"+ data.data[i].nodeName + "</label>" +
"<div class='layui-input-block'>" +
"<input type='text' id='"+data.data[i].nodeId +"' name='"+"no"+data.data[i].nodeOrder+ "' placeholder='"+ "审批人域账户" + "' class='layui-input'>" +
"</div>" +
"</div>"
//追加到界面,property是后面div的id<div class="user_left" id="property">
var html = document.getElementById("selectPerson").innerHTML;
document.getElementById("selectPerson").innerHTML = html + str;
}
}
});
}
function loadData(data) {
processData = data;
return data;
}
function jsonToObject(data ,len,applyOrderDetailId,process) {
var object = {};
var params = [];
console.log("开始进入方法")
for(var i = 0; i < len; i++){
console.log("组装数据")
var obj = {};
console.log(i)
switch (i) {
case 0:
obj["approvalOrder"] = process[0].nodeOrder ;
obj["approvalUserName"] = data.field.no1;
obj["nodeId"] = process[0].nodeId;
params.push(obj);
console.log(i)
continue;
case 1:
obj["approvalOrder"] = process[1].nodeOrder;
obj["approvalUserName"] = data.field.no2;
obj["nodeId"] = process[1].nodeId;
params.push(obj);
console.log(i)
continue;
case 2:
obj["approvalOrder"] = process[2].nodeOrder;
obj["approvalUserName"] = data.field.no3;
obj["nodeId"] = process[2].nodeId;
params.push(obj);
console.log(i)
continue;
case 3:
obj["approvalOrder"] = process[3].nodeOrder;
obj["approvalUserName"] = data.field.no4;
obj["nodeId"] = process[3].nodeId;
params.push(obj);
console.log(i)
continue;
case 4:
obj["approvalOrder"] = process[4].nodeOrder;
obj["approvalUserName"] = data.field.no5;
obj["nodeId"] = process[4].nodeId;
params.push(obj);
console.log(i)
continue;
}
}
object['applyId'] = applyOrderDetailId;
object['processId'] = process[0].processId;
object['approvalUserVoList'] = params;
var json = JSON.stringify(object);
// console.log(json);
return json;
}
function initFlowData(data,applyOrderDetailId,process){
return jsonToObject(data ,process.data.length ,applyOrderDetailId,process.data)
}
//表单提交时调用的验证及提交方法
function check() {
var data = new FormData($("#addForm")[0]); //获取表单数据,addForm是表单id
console.log(data)
// if ($("#title").val() == '') {
// alert("请填写完整信息");
// } else {
// $.ajax({
// type: "POST",
// url: getURL("insert"),
// data: new FormData($("#addForm")[0]), //获取表单数据,addForm是表单id
// processData: false,
// contentType: false,
// success: function (data) {
// alert(data)
// if (data == 'success') {
// $("input[type=reset]").trigger("click"); //清空表单
// }
// }
// })
// }
}
function reload_data() {
layui.use(['table'], function () {
var table = layui.table;
table.reload("searchTable", {});
});
}
function applyFlowView(data) {
var resApplyId = data.applyId;
$.ajax({
//TODO1 填写流程进度请求地址
url: "/v1/devTool/codeAuth/apply/flow",
type: "GET",
dataType: "json",
data: {
resApplyId: resApplyId
},
success: function (data) {
if (data.status == 'normal') {
initApplyFlowView(data.response);
} else {
layer.msg(data.exception.error_msg || '获取表结构失败!');
}
}
});
}
function initApplyFlowView(applyFlows) {
layui.use(['layer', 'laytpl'], function () {
var layer = layui.layer;
var form = layui.form;
var laytpl = layui.laytpl;
var table = layui.table;
var applyFlowTplHtml = "";
applyFlowTplHtml += '<div class="x-body">';
applyFlowTplHtml += '<ul class="layui-timeline">';
$.each(applyFlows, function (index, step) {
applyFlowTplHtml += '<li class="layui-timeline-item">';
applyFlowTplHtml += '<i class="layui-icon layui-timeline-axis"></i>';
applyFlowTplHtml += '<div class="layui-timeline-content layui-text">';
var title ="处理人: " + step.approvalPersonName+" - "+ "处理时间 "+step.lastUpdateTime
applyFlowTplHtml += '<h3 class="layui-timeline-title">' + title + '</h3>';
applyFlowTplHtml += '<p>';
applyFlowTplHtml += (step.approvalPersonNote);
applyFlowTplHtml += '</p>';
applyFlowTplHtml += '</div>';
applyFlowTplHtml += '</li>';
});
applyFlowTplHtml += '</ul>';
applyFlowTplHtml += '</div>';
var index;
laytpl(applyFlowTplHtml).render({}, function (html) {
index = layer.open({
type: 1,
title: '申请进度查询',
area: ['700px', '510px'],
offset: 'auto',
maxmin: true,
content: html
});
});
});
}