Commit 7f5e9a46 by 杨琪琪

ocr调用统计-秒级折线图Y轴修改;应用能力调用记录-添加导出

parent 76183631
...@@ -6,6 +6,7 @@ ...@@ -6,6 +6,7 @@
<title>ocr应用能力调用记录</title> <title>ocr应用能力调用记录</title>
<link rel="stylesheet" href="layui/css/layui.css" media="all"> <link rel="stylesheet" href="layui/css/layui.css" media="all">
<script src="js/FileSaver.min.js"></script> <script src="js/FileSaver.min.js"></script>
<script src="js/utils/axios.min.js"></script>
<style> <style>
html, body { html, body {
width: 100%; width: 100%;
...@@ -15,6 +16,7 @@ ...@@ -15,6 +16,7 @@
body { body {
background-color: #fff; background-color: #fff;
} }
.layui-input-inline { .layui-input-inline {
width: 150px !important; width: 150px !important;
} }
...@@ -30,7 +32,7 @@ ...@@ -30,7 +32,7 @@
<div id="court"></div> <div id="court"></div>
</div> </div>
</div> </div>
厂商 业务系统
<div class="layui-inline"> <div class="layui-inline">
<!--<label class="layui-form-label" style="width: 50px;">厂商:</label>--> <!--<label class="layui-form-label" style="width: 50px;">厂商:</label>-->
<div class="layui-input-inline"> <div class="layui-input-inline">
...@@ -69,6 +71,21 @@ ...@@ -69,6 +71,21 @@
<div class="layui-inline"> <div class="layui-inline">
<button onclick="search();" class="layui-btn layui-btn-sm layui-btn-normal">搜索</button> <button onclick="search();" class="layui-btn layui-btn-sm layui-btn-normal">搜索</button>
</div> </div>
<div class="layui-inline">
<button onclick="exportAll();" class="layui-btn layui-btn-sm layui-btn-normal">各法院总调用统计导出</button>
</div>
<div class="layui-inline">
<button onclick="exportYear();" class="layui-btn layui-btn-sm layui-btn-normal"><span id="year-text"></span>年调用量导出</button>
</div>
<div class="layui-inline">
<button onclick="exportMonth();" class="layui-btn layui-btn-sm layui-btn-normal"><span id="month-text"></span>月调用量导出</button>
</div>
<div class="layui-inline">
<button onclick="exportDay();" class="layui-btn layui-btn-sm layui-btn-normal"><span id="day-text"></span>日调用量导出</button>
</div>
<div class="layui-inline">
<span style="color: #C9C9C9">(以开始时间为基准导出,默认当前时间)</span>
</div>
</div> </div>
</div> </div>
<table id="recordList" lay-filter="recordList"></table> <table id="recordList" lay-filter="recordList"></table>
...@@ -76,23 +93,46 @@ ...@@ -76,23 +93,46 @@
<script src="layui/layui.all.js"></script> <script src="layui/layui.all.js"></script>
<script src="js/jquery.min.js"></script> <script src="js/jquery.min.js"></script>
<script src="layui/xmSelect/xm-select.js"></script> <script src="layui/xmSelect/xm-select.js"></script>
<script src="js/utils/dateformat.js"></script>
<script th:inline="javascript"> <script th:inline="javascript">
let gatewayUrl = [[${gatewayUrl}]]; let gatewayUrl = [[${gatewayUrl}]];
let youxiang = [[${youxiang}]]; let youxiang = [[${youxiang}]];
</script> </script>
<script> <script>
// 添加响应拦截器
axios.interceptors.response.use(function (response) {
// 2xx 范围内的状态码都会触发该函数。
// 对响应数据做点什么
return response.data;
}, function (error) {
// 超出 2xx 范围的状态码都会触发该函数。
// 对响应错误做点什么
return Promise.reject(error);
});
</script>
<script>
var list, table, form, condition = {}; var list, table, form, condition = {};
let courtList = [], formData; let courtList = [], formData;
var currYear = new Date().strftime('%Y'), currMonth = new Date().strftime('%m'),
currDate = new Date().strftime('%d');
layui.use(['laydate', "table", "form"], function () { layui.use(['laydate', "table", "form"], function () {
var laydate = layui.laydate var laydate = layui.laydate
table = layui.table; table = layui.table;
form = layui.form; form = layui.form;
dateInnerHtml();
//日期时间选择器 //日期时间选择器
laydate.render({ laydate.render({
elem: '#endTime' elem: '#endTime'
}); });
laydate.render({ laydate.render({
elem: '#startTime' elem: '#startTime',
done: function (value, date, endDate) {
console.log(' --- 开始日期 --- ', value);
currYear = new Date(value).getFullYear();
currMonth = new Date(value).getMonth() + 1;
currDate = new Date(value).getDate();
dateInnerHtml();
}
}); });
initSearchForm( initSearchForm(
function (courtListData) { function (courtListData) {
...@@ -116,7 +156,7 @@ ...@@ -116,7 +156,7 @@
function (applicationListData) { function (applicationListData) {
xmSelect.render({ xmSelect.render({
el: '#businessVendor', el: '#businessVendor',
tips: "选择厂商", tips: "选择业务系统",
filterable: true, filterable: true,
name: 'applicationId', name: 'applicationId',
autoRow: true, autoRow: true,
...@@ -166,7 +206,7 @@ ...@@ -166,7 +206,7 @@
[ [
{field: 'id', width: 80, title: '编号', align: "center", hide: true} {field: 'id', width: 80, title: '编号', align: "center", hide: true}
, {field: 'courtName', width: 260, title: '法院名称', align: "center"} , {field: 'courtName', width: 260, title: '法院名称', align: "center"}
, {field: 'businessVendors', width: 180, title: '业务厂商', align: "center"} , {field: 'businessVendors', width: 180, title: '业务系统', align: "center"}
, {field: 'callCount', width: 90, title: '调用次数', align: "center"} , {field: 'callCount', width: 90, title: '调用次数', align: "center"}
, {field: 'appAbilityName', width: 180, title: '识别能力', align: "center"} , {field: 'appAbilityName', width: 180, title: '识别能力', align: "center"}
, {field: 'ip', width: 160, title: '调用方IP', align: "center"} , {field: 'ip', width: 160, title: '调用方IP', align: "center"}
...@@ -199,7 +239,7 @@ ...@@ -199,7 +239,7 @@
table.on("toolbar(recordList)", function (obj) { table.on("toolbar(recordList)", function (obj) {
if (obj.event === "exports") { if (obj.event === "exports") {
layer.confirm('由于当前数据量过大,仅支持导出10000条记录,是否继续?', {icon: 3}, function(index){ layer.confirm('由于当前数据量过大,仅支持导出10000条记录,是否继续?', {icon: 3}, function (index) {
// 在确认按钮点击时关闭确认框 // 在确认按钮点击时关闭确认框
layer.close(index); layer.close(index);
let loadIndex = layer.load(2); let loadIndex = layer.load(2);
...@@ -221,7 +261,7 @@ ...@@ -221,7 +261,7 @@
layer.msg("数据量过大,导出数据失败!", {icon: 2}); layer.msg("数据量过大,导出数据失败!", {icon: 2});
} }
}) })
}, function(){ }, function () {
layer.msg('已取消导出'); layer.msg('已取消导出');
}); });
} }
...@@ -270,7 +310,6 @@ ...@@ -270,7 +310,6 @@
}); });
} }
function moreInfo(id) { function moreInfo(id) {
layer.open({ layer.open({
type: 2 type: 2
...@@ -282,5 +321,69 @@ ...@@ -282,5 +321,69 @@
, resize: false , resize: false
}); });
} }
function downloadFile(filename, params) {
axios({
url: gatewayUrl + '/appAbilityRecordAll/deriveCallRecord',
method: 'get',
responseType: 'blob',
params: params ? params : {}
}).then(function (res) {
if (res instanceof Blob) {
var blob = res;
//通过FileReader读取数据
var reader = new FileReader();
//以下这两种方式都可以解析出来,因为Blob对象的数据可以按文本或二进制的格式进行读取
// reader.readAsBinaryString(blob);
reader.readAsText(blob, "utf8");
reader.onload = (e) => {
var receive_data = e.target.result; //解析出来的数据
var responseData = {};
if (
receive_data.indexOf("success") != -1 &&
receive_data.indexOf("errCode") != -1
) {
responseData = JSON.parse(receive_data);
} else {
responseData.success = true;
}
if (responseData.success) {
saveAs(res, filename);
} else {
console.log(' --- 已获取文件流 下载失败 --- ', responseData)
}
};
} else {
console.log(' --- 未获取文件流 下载失败 --- ', data)
}
}).catch(function (err) {
console.log(' --- 接口请求失败,抛出异常 --- ', err)
})
}
function exportAll() {
downloadFile('各法院调用统计.xlsx');
}
function exportYear() {
let date = `${currYear}`
downloadFile(`各法院${date}调用统计.xlsx`, {yearMonthDay: date});
}
function exportMonth() {
let date = `${currYear}-${currMonth}`
downloadFile(`各法院${date}调用统计.xlsx`, {yearMonthDay: date});
}
function exportDay() {
let date = `${currYear}-${currMonth}-${currDate}`
downloadFile(`各法院${date}调用统计.xlsx`, {yearMonthDay: date});
}
function dateInnerHtml() {
$('#year-text').text(currYear);
$('#month-text').text(currMonth);
$('#day-text').text(currDate);
}
</script> </script>
</html> </html>
...@@ -519,9 +519,16 @@ ...@@ -519,9 +519,16 @@
orient: "horizontal", orient: "horizontal",
textStyle: { textStyle: {
color: "#fff" color: "#fff"
} },
}] }]
option.xAxis.minInterval = 1000; option.xAxis.minInterval = 1000;
option.yAxis = {
...option.yAxis,
interval: 65,
splitNumber: 6,
min: 0,
max: 390,
}
break break
default: default:
option.xAxis.minInterval = 1000 * 3600 * 24; option.xAxis.minInterval = 1000 * 3600 * 24;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment