uploadReport.html
8.16 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head>
<th:block th:include="include :: header('信用修复上报')"/>
<th:block th:include="include :: jquery-smartwizard-css"/>
<th:block th:include="include :: bootstrap-fileinput-css"/>
</head>
<body class="gray-bg">
<div class="wrapper wrapper-content animated fadeInRight" style="height: 100%;">
<div class="row">
<div class="col-sm-12">
<div class="ibox">
<div class="ibox-title">
<h5>
数据上报
</h5>
</div>
<div class="ibox-content">
<div id="smartwizard">
<ul class="nav">
<li class="nav-item">
<a class="nav-link" href="#step-1"> 数据上传 </a>
</li>
<li class="nav-item">
<a class="nav-link" href="#step-2"> 数据校验对比 </a>
</li>
<li class="nav-item">
<a class="nav-link" href="#step-3"> 上报成功 </a>
</li>
</ul>
<div class="tab-content" style="min-height: 300px;">
<div id="step-1" class="tab-pane" role="tabpanel" aria-labelledby="step-1">
<div>
<form class="form form-horizontal m-t" id="uploadForm">
<div class="form-group">
<label class="col-sm-2 control-label is-required">文件：</label>
<div class="col-sm-7">
<input id="singleFile" name="file" type="file"/>
</div>
</div>
<div style="position: absolute;bottom: 10px;left: 40%;">
<button type="button" class="btn btn-w-m btn-primary"
onclick="uploadReport()">执行上报
</button>
</div>
</form>
</div>
</div>
<div id="step-2" class="tab-pane" role="tabpanel" aria-labelledby="step-2">
<div>
<div class="m-t-md">
<h4 id="check_prompt_msg">执行数据校验对比</h4>
<h4 id="check_msg" style="color: cadetblue;adding-left: 30px;"></h4>
</div>
</div>
<div style="position: absolute;bottom: 10px;left: 40%;">
<button type="button" class="btn btn-w-m btn-default" onclick="backStep()">
上一步查看
</button>
<button type="button" class="btn btn-w-m btn-primary" onclick="checkCompare()">
执行比较对比
</button>
</div>
</div>
<div id="step-3" class="tab-pane" role="tabpanel" aria-labelledby="step-3">
<div class="m-t-md">
<h4>上报校验对比结果：</h4>
<h4 id="check_content" style="color: cadetblue;adding-left: 30px;"></h4>
<h4>上报执行确认结果：</h4>
<h4 id="report_content" style="color: cornflowerblue;adding-left: 30px;"></h4>
</div>
<div style="position: absolute;bottom: 10px;left: 40%;">
<button type="button" class="btn btn-w-m btn-default" onclick="backStep()">
上一步查看
</button>
<button type="button" class="btn btn-w-m btn-primary" onclick="submit()">上报确认
</button>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<th:block th:include="include :: footer"/>
<th:block th:include="include :: jquery-smartwizard-js"/>
<th:block th:include="include :: bootstrap-fileinput-js"/>
<script>
var prefix = ctx + "business/recover";
$(document).ready(function () {
// 初始化表单向导组件
$('#smartwizard').smartWizard({
theme: 'arrows', // default, arrows, dots, progress
autoAdjustHeight: true, // 自动调整高度, 默认true
enableURLhash: false, //开启URL hash,开启后点击浏览器前进后退按钮会执行下一步和上一步操作
transition: {
animation: 'slide-horizontal', // Effect on navigation, none/fade/slide-horizontal/slide-vertical/slide-swing
},
toolbarSettings: {
showNextButton: false,// 因为上面自定义了下一步按钮, 所以隐藏掉插件自带的按钮, 如果不使用自定义按钮, 需要改为true或者去掉该属性
showPreviousButton: false,// 因为上面自定义了上一步按钮, 所以隐藏掉插件自带的按钮, 如果不使用自定义按钮, 需要改为true或者去掉该属性
//toolbarExtraButtons: [btnPrev,btnNext,btnFinish],// 扩展的按钮集合 btnCancel
toolbarButtonPosition: "none"
}
});
});
function uploadReport() {
$('#smartwizard').smartWizard("next");
}
function backStep() {
$('#smartwizard').smartWizard("prev");
}
function checkCompare() {
$.modal.loading("数据处理中");
var form = new FormData(document.getElementById("uploadForm"));
$.ajax({
url: prefix + "/uploadCheck",
type: "post",
data: form,
processData: false,
contentType: false,
success: function (result) {
$.modal.closeLoading();
if (result.code == web_status.SUCCESS) {
$("#check_msg").html("数据校验对比成功");
$("#check_content").html("数据校验对比成功");
$('#smartwizard').smartWizard("next");
} else {
$.modal.alertError(result.msg);
}
},
error: function (e) {
$.modal.closeLoading();
$("#check_msg").html("数据校验对比失败");
$("#check_content").html("数据校验对比失败");
}
});
}
function submit() {
$.modal.loading("数据上报确认处理中");
var form = new FormData(document.getElementById("uploadForm"));
$.ajax({
url: prefix + "/uploadConfirm",
type: "post",
data: form,
processData: false,
contentType: false,
success: function (result) {
$.modal.closeLoading();
if (result.code == web_status.SUCCESS) {
$.operate.successCallback(result);
$("#report_content").html("恭喜，上报成功")
} else {
$.modal.alertError(result.msg);
}
},
error: function (e) {
$.modal.closeLoading();
$.modal.alertError("上传数据失败！");
}
});
}
</script>
</body>
</html>