monitor_v3 / hg-monitor-web · Commits

Go to a project

Authored by 王涛
Commit 6cf3326e592b7616413d517091e03d2845c111df 2 parents e9b1244d 5affc063

Merge branch 'master-500-dev-lushangqing' into 'master-500-dev' 

状态指标散点图功能迁移 #1



See merge request !656
Inline Side-by-side
Showing 3 changed files with 134 additions and 56 deletions
@@ -162,9 +162,6 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele @@ -162,9 +162,6 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele
162 } 162 }
163 titleStr = valueStr; 163 titleStr = valueStr;
164 } 164 }
165 - var tips = '<a class="detail_row_menu hide">\n' +  
166 - '<img style="width: 17px;height: 17px;" src="/src/style/img/icon_row_menu.png">\n' +  
167 - '</a>'  
168 var tips = '<a class="detail_row_menu hide" data-statusf='+statusF+' data-id='+v.id+' data-flag='+v.flag+ 165 var tips = '<a class="detail_row_menu hide" data-statusf='+statusF+' data-id='+v.id+' data-flag='+v.flag+
169 ' data-name='+v.name+' data-kpiname='+v.name+' data-iswarning=1 data-ident=1' + 166 ' data-name='+v.name+' data-kpiname='+v.name+' data-iswarning=1 data-ident=1' +
170 ' data-trend=0 data-unit="" data-hidem="hidem" data-nature="true" ' + 167 ' data-trend=0 data-unit="" data-hidem="hidem" data-nature="true" ' +
@@ -277,9 +274,6 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele @@ -277,9 +274,6 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele
277 kpiIdList += ar.id + ","; 274 kpiIdList += ar.id + ",";
278 } 275 }
279 //start lsq 更改下探图标的属性值 2022-06-08 276 //start lsq 更改下探图标的属性值 2022-06-08
280 - /* var tips = '<a class="detail_row_menu hide">\n' +  
281 - '<img style="width: 17px;height: 17px;" src="/src/style/img/icon_row_menu.png">\n' +  
282 - '</a>'*/  
283 var tips = '<a class="detail_row_menu hide" data-statusf='+statusF+' data-id='+v.id+' data-flag='+v.flag+ 277 var tips = '<a class="detail_row_menu hide" data-statusf='+statusF+' data-id='+v.id+' data-flag='+v.flag+
284 ' data-name='+v.name+' data-kpiname='+v.name+' data-iswarning=1 data-ident=1' + 278 ' data-name='+v.name+' data-kpiname='+v.name+' data-iswarning=1 data-ident=1' +
285 ' data-trend=0 data-unit="" data-hidem="hidem" data-nature="true" ' + 279 ' data-trend=0 data-unit="" data-hidem="hidem" data-nature="true" ' +
@@ -1906,6 +1900,9 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele @@ -1906,6 +1900,9 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele
1906 * @param colWidth 各个列宽度设置，可以只设置前边的，设置百分比 1900 * @param colWidth 各个列宽度设置，可以只设置前边的，设置百分比
1907 */ 1901 */
1908 renderTable: function (tableId, page, resId, kpiId, title, flagPrifix, sortBy, order, size,colWidth) { 1902 renderTable: function (tableId, page, resId, kpiId, title, flagPrifix, sortBy, order, size,colWidth) {
  1903 + //start lsq 状态信息的状态也增加下探 202-06-08
  1904 + let statusF=false;//是否为状态信息
  1905 + //end lsq 2022-06-08
1909 var editFlag = localStorage.getItem("editFlag");//是否编辑状态 1906 var editFlag = localStorage.getItem("editFlag");//是否编辑状态
1910 if (!size) { 1907 if (!size) {
1911 size = 5; 1908 size = 5;
@@ -2029,9 +2026,14 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele @@ -2029,9 +2026,14 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele
2029 // } 2026 // }
2030 // 2027 //
2031 // // End Wang 2021/11/18 15:03 查询字典编辑指标，判断编辑状态 2028 // // End Wang 2021/11/18 15:03 查询字典编辑指标，判断编辑状态
2032 - 2029 + //start lsq 判断当前kpiId是否在状态指标数据列表中 2022-06-08
  2030 + let status=statusKpiList.indexOf(d[v.id].kpiId);
  2031 + if(status!=-1){
  2032 + statusF=true;
  2033 + }
  2034 + //end lsq 2022-06-08
2033 //拼接表空间名称、文件系统名称等等,如果是性能指标或者趋势指标，则可以下探 徐毫杰还原 2035 //拼接表空间名称、文件系统名称等等,如果是性能指标或者趋势指标，则可以下探 徐毫杰还原
2034 - if (value.kpiIdent == '1' || value.isWarning == '1') { 2036 + if (value.kpiIdent == '1' || value.isWarning == '1' || status!=-1) {
2035 var chbox = ''; 2037 var chbox = '';
2036 if (editFlag && editFlag == "true" && value.kpiIdent == '1') { 2038 if (editFlag && editFlag == "true" && value.kpiIdent == '1') {
2037 chbox = '<input lay-filter="kpicheckboxfilter" type="checkbox" lay-skin="primary" name="identKpiCheckbox" ' + 2039 chbox = '<input lay-filter="kpicheckboxfilter" type="checkbox" lay-skin="primary" name="identKpiCheckbox" ' +
@@ -2039,7 +2041,7 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele @@ -2039,7 +2041,7 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele
2039 } 2041 }
2040 return chbox + '<a class="link showlinechart_' + tableId + '" style="padding-left:5px;' + resStyle + '" ' + 'data-isWarning="' + value.isWarning + '" data-ident="' + value.kpiIdent + '"' + 2042 return chbox + '<a class="link showlinechart_' + tableId + '" style="padding-left:5px;' + resStyle + '" ' + 'data-isWarning="' + value.isWarning + '" data-ident="' + value.kpiIdent + '"' +
2041 'data-trend="' + value.isTrend + '" data-id="' + v.id + '" data-kpiname="' + kpiname + '" data-name="' + v.name + '" data-flag="' + value.flag + '">' + value.kpiValue + '</a>' + 2043 'data-trend="' + value.isTrend + '" data-id="' + v.id + '" data-kpiname="' + kpiname + '" data-name="' + v.name + '" data-flag="' + value.flag + '">' + value.kpiValue + '</a>' +
2042 - '<a class="detail_row_menu hide" data-isWarning="' + value.isWarning + '" data-ident="' + value.kpiIdent + '" data-trend="' + value.isTrend + '" ' + 2044 + '<a class="detail_row_menu hide" data-statusf="'+statusF+'" data-isWarning="' + value.isWarning + '" data-ident="' + value.kpiIdent + '" data-trend="' + value.isTrend + '" ' +
2043 'data-id="' + v.id + '" data-kpiname="' + kpiname + '" data-name="' + v.name + '" data-flag="' + value.flag + '"' + 2045 'data-id="' + v.id + '" data-kpiname="' + kpiname + '" data-name="' + v.name + '" data-flag="' + value.flag + '"' +
2044 'data-canca="' + value.canCA + '" data-incaing="' + value.inCAing + '" data-restype="' + resType + '"' + 2046 'data-canca="' + value.canCA + '" data-incaing="' + value.inCAing + '" data-restype="' + resType + '"' +
2045 '>' + 2047 '>' +
@@ -2439,6 +2441,9 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele @@ -2439,6 +2441,9 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele
2439 * @param resId 2441 * @param resId
2440 */ 2442 */
2441 renderActiveAlarms: function (tableId, resId) { 2443 renderActiveAlarms: function (tableId, resId) {
  2444 + //start lsq 状态信息的状态也增加下探 202-06-08
  2445 + let statusF=false;//是否为状态信息
  2446 + //end lsq 2022-06-08
2442 $('#'+tableId).prev().text('实时告警') 2447 $('#'+tableId).prev().text('实时告警')
2443 var alarmlist = table.render({ 2448 var alarmlist = table.render({
2444 elem: '#' + tableId 2449 elem: '#' + tableId
@@ -2477,11 +2482,25 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele @@ -2477,11 +2482,25 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele
2477 , { 2482 , {
2478 field: 'kpiName', title: '指标名称', align: 'center', width: '20%', 2483 field: 'kpiName', title: '指标名称', align: 'center', width: '20%',
2479 templet: function (d) { 2484 templet: function (d) {
  2485 + //start lsq 判断当前kpiId是否在状态指标数据列表中 2022-06-08
  2486 + let status=statusKpiList.indexOf(d.kpiId);
  2487 + if(status!=-1){
  2488 + statusF=true;
  2489 + }
  2490 + //end lsq 2022-06-08
2480 var kpiName = d.kpiName == 'TYPE'?'ERRPT':d.kpiName; 2491 var kpiName = d.kpiName == 'TYPE'?'ERRPT':d.kpiName;
  2492 + let chbox='';
  2493 + if(status!=-1){
  2494 + chbox='<a class="detail_row_menu hide" data-one="1" data-statusf='+statusF+' data-isWarning="' + d.isWarning + '" data-ident="' + d.kpiIdent + '" data-trend="' + d.isTrend + '" ' +
  2495 + 'data-id="' + d.kpiId + '" data-kpiname="' + d.kpiName + '" data-name="' + d.name + '" data-flag="' + d.flag + '"' +
  2496 + 'data-canca="' + d.canCA + '" data-incaing="' + d.inCAing + '" data-restype="' + d.resType + '"' +
  2497 + '>' +
  2498 + '<img style="width: 20px;height: 20px;" src="/src/style/img/icon_row_menu.png"></a>';;
  2499 + }
2481 if (d.kpiIdent != 1 && d.isWarning != 1) { 2500 if (d.kpiIdent != 1 && d.isWarning != 1) {
2482 - return '<div>' + kpiName + '</div>'; 2501 + return '<div>' + kpiName +chbox+ '</div>';
2483 } 2502 }
2484 - return '<div><span data-ident="'+d.kpiIdent+'" data-warning="'+d.isWarning+'" data-resid="' + d.resId + '" data-flag="' + d.flag + '" data-kpi="' + d.kpiId + '" data-name="' + kpiName + '" data-warn-zbmc="' + d.id + '" class="layui-table-link">' + kpiName + '</span></div>'; 2503 + return '<div><span data-ident="'+d.kpiIdent+'" data-warning="'+d.isWarning+'" data-resid="' + d.resId + '" data-flag="' + d.flag + '" data-kpi="' + d.kpiId + '" data-name="' + kpiName + '" data-warn-zbmc="' + d.id + '" class="layui-table-link">' + kpiName +chbox+ '</span></div>';
2485 } 2504 }
2486 } 2505 }
2487 , {field: 'updateTime', title: '告警时间', align: 'center', width: '15%'} 2506 , {field: 'updateTime', title: '告警时间', align: 'center', width: '15%'}
@@ -2595,6 +2614,17 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele @@ -2595,6 +2614,17 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele
2595 '<input type="radio" name="noticeFlag" value="true" title="是">&nbsp;是' + 2614 '<input type="radio" name="noticeFlag" value="true" title="是">&nbsp;是' +
2596 '<input type="radio" name="noticeFlag" value="false" title="否" checked="" style="margin-left: 20px;">&nbsp;否</div> '); 2615 '<input type="radio" name="noticeFlag" value="false" title="否" checked="" style="margin-left: 20px;">&nbsp;否</div> ');
2597 } 2616 }
  2617 + //start lsq 添加状态指标下探 2022-06-09
  2618 + $("[lay-id='"+tableId+"']").find(".layui-table-cell").hover(function () {
  2619 + var $that = $(this)
  2620 + var $btn = $that.find(".detail_row_menu");
  2621 + if ($btn.length > 0) {
  2622 + $(".layui-card-body").find(".detail_row_menu:not(.hide)").addClass("hide")
  2623 + $btn.removeClass("hide");
  2624 + }
  2625 + })
  2626 + filterSuppressMonitor(resId);
  2627 + //end lsq 2022-06-09
2598 } 2628 }
2599 }) 2629 })
2600 }); 2630 });
@@ -4213,32 +4243,39 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele @@ -4213,32 +4243,39 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele
4213 var nature = $menu.data('nature'); 4243 var nature = $menu.data('nature');
4214 //lsq 状态信息无其他下探 2022-06-08 4244 //lsq 状态信息无其他下探 2022-06-08
4215 var statusF = $menu.data('statusf'); 4245 var statusF = $menu.data('statusf');
  4246 + var one = $menu.data('one');
4216 var menubox = '<div class="detail_menubox" id="detail_menubox_id" style="color:#666;"><ul>'; 4247 var menubox = '<div class="detail_menubox" id="detail_menubox_id" style="color:#666;"><ul>';
4217 - if (!nature) {  
4218 - menubox +=  
4219 - '<li type="w"><i class="layui-icon">&#xe667;</i>告警设置</li>' +  
4220 - '<li type="s"><i class="layui-icon">&#xe64d;</i>过滤单指标</li>';  
4221 - }  
4222 - if (!hideM) {  
4223 - menubox += '<li type="m"><i class="layui-icon">&#xe64d;</i>过滤多指标</li>';  
4224 - }  
4225 - if (!nature) {  
4226 - menubox += '<li type="t"><i class="layui-icon">&#xe62c;</i>性能趋势</li>'; 4248 + //lsq 只有状态指标下探的标识
  4249 + if(one==1){
  4250 + menubox+='';
  4251 + }else{
  4252 + if (!nature) {
  4253 + menubox +=
  4254 + '<li type="w"><i class="layui-icon">&#xe667;</i>告警设置</li>' +
  4255 + '<li type="s"><i class="layui-icon">&#xe64d;</i>过滤单指标</li>';
  4256 + }
  4257 + if (!hideM) {
  4258 + menubox += '<li type="m"><i class="layui-icon">&#xe64d;</i>过滤多指标</li>';
  4259 + }
  4260 + if (!nature) {
  4261 + menubox += '<li type="t"><i class="layui-icon">&#xe62c;</i>性能趋势</li>';
  4262 + }
  4263 + // if(!statusF){
  4264 + menubox += '<li type="n"><i class="layui-icon">&#xe758;</i>压制次数</li>';
  4265 + // }
  4266 +
  4267 + // Start Wang 2022/3/28 14:06 833:屏蔽纳入容量预测按钮 https://hgkj.zentaopm.com/task-view-833.html
  4268 + // 后面计划将功能作为配置项
  4269 + // if (canCA) {
  4270 + // if (inCAing) {
  4271 + // menubox += '<li type="ca-cancel"><i class="layui-icon">&#xe64d;</i>取消容量预测</li>';
  4272 + // } else {
  4273 + // menubox += '<li type="ca-add"><i class="layui-icon">&#xe64c;</i>纳入容量预测</li>';
  4274 + // }
  4275 + // }
  4276 + // End Wang 2022/3/28 14:06
4227 } 4277 }
4228 - // if(!statusF){  
4229 - menubox += '<li type="n"><i class="layui-icon">&#xe758;</i>压制次数</li>';  
4230 - // }  
4231 4278
4232 - // Start Wang 2022/3/28 14:06 833:屏蔽纳入容量预测按钮 https://hgkj.zentaopm.com/task-view-833.html  
4233 - // 后面计划将功能作为配置项  
4234 - // if (canCA) {  
4235 - // if (inCAing) {  
4236 - // menubox += '<li type="ca-cancel"><i class="layui-icon">&#xe64d;</i>取消容量预测</li>';  
4237 - // } else {  
4238 - // menubox += '<li type="ca-add"><i class="layui-icon">&#xe64c;</i>纳入容量预测</li>';  
4239 - // }  
4240 - // }  
4241 - // End Wang 2022/3/28 14:06  
4242 menubox += '</ul></div>'; 4279 menubox += '</ul></div>';
4243 var cX = e.clientX + 10; 4280 var cX = e.clientX + 10;
4244 var cY = e.clientY - 10; 4281 var cY = e.clientY - 10;
@@ -4259,7 +4296,6 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele @@ -4259,7 +4296,6 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele
4259 flag = flag.replace(/^\s+|\s+$/g, ""); 4296 flag = flag.replace(/^\s+|\s+$/g, "");
4260 } 4297 }
4261 //start lsq 根据kpiid获取是否是指标状态 2022-05-23 4298 //start lsq 根据kpiid获取是否是指标状态 2022-05-23
4262 - //start lsq 根据kpiid获取是否是指标状态 2022-05-23  
4263 let idArr=[]; 4299 let idArr=[];
4264 let idStr=''; 4300 let idStr='';
4265 if(id.indexOf(',')!=-1){ 4301 if(id.indexOf(',')!=-1){
@@ -3,33 +3,38 @@ @@ -3,33 +3,38 @@
3 <div class="pie-detail-content"> 3 <div class="pie-detail-content">
4 <el-row class="detail-content-title"> 4 <el-row class="detail-content-title">
5 <el-col :span="8"></el-col> 5 <el-col :span="8"></el-col>
6 - <el-col :span="16" class="pie-flex-end">  
7 - <div class="pie-date-range">  
8 -<!-- <cm-date-range-influx v-if="dateType=='custom'" :keys="keys" @callbackinflux="getInfluxOption" @callbacksure="getOptionData" @callbacktime="callbacktime" @callbackrate="callbackrate"></cm-date-range-influx>-->  
9 - </div> 6 + <el-col :span="16" class="pie-flex-end" style="justify-content: flex-end;">
10 <div class="line-filter pie-line-filter"> 7 <div class="line-filter pie-line-filter">
11 <div class="linechartfrequency line-filter-content"> 8 <div class="linechartfrequency line-filter-content">
12 <div v-if="dateType!='custom'" @click="changeInterval('oneDay')" :class="['line-filter-item', {'active':dateType=='oneDay'}]" data-value="oneDay" >近24小时</div> 9 <div v-if="dateType!='custom'" @click="changeInterval('oneDay')" :class="['line-filter-item', {'active':dateType=='oneDay'}]" data-value="oneDay" >近24小时</div>
13 - <div v-if="dateType!='custom'" @click="changeInterval('week')" :class="['line-filter-item', {'active':dateType=='week'}]" data-value="week">一周</div>  
14 - <div v-if="dateType!='custom'" @click="changeInterval('month')" :class="['line-filter-item', {'active':dateType=='month'}]" data-value="month">一月</div>  
15 -<!-- <div v-if="dateType!='custom'" @click="changeInterval('YEAR')" :class="['line-filter-item', {'active':dateType=='YEAR'}]" data-value="YEAR">一年</div>-->  
16 -<!-- <div v-if="dateType!='custom'" @click="changeInterval('custom')" :class="['line-filter-item', {'active':dateType=='custom'}]" data-value="custom">自定义</div>-->  
17 -<!-- <div v-if="dateType=='custom'" @click="changeInterval('DAY')" :class="['line-filter-item', {'active':dateType=='custom'}]" data-value="custom">返 回</div>--> 10 + <el-date-picker
  11 + v-model="customDate"
  12 + type="date"
  13 + placeholder="请选择日期"
  14 + size="small"
  15 + format="YYYY-MM-DD"
  16 + value-format="YYYY-MM-DD"
  17 + style="margin-left:6px;"
  18 + />
  19 + <el-time-picker
  20 + v-model="customTime"
  21 + is-range
  22 + range-separator="-"
  23 + start-placeholder="开始时间"
  24 + end-placeholder="结束时间"
  25 + size="small"
  26 + format="HH:mm:ss"
  27 + value-format="HH:mm:ss"
  28 + style="margin-left:6px;"
  29 + />
  30 + <el-button style="margin-left:6px;" type="primary" size="small" @click="search"> 查询</el-button>
18 </div> 31 </div>
19 </div> 32 </div>
20 -  
21 </el-col> 33 </el-col>
22 -  
23 </el-row> 34 </el-row>
24 <el-row class="detail-content"> 35 <el-row class="detail-content">
25 - <el-col :span="24" class="detail_linechart"> 36 + <el-col :span="24" class="detail_linechart" style="height:550px !important;">
26 <LineChart :optionData="optionData" v-if="optionData"></LineChart> 37 <LineChart :optionData="optionData" v-if="optionData"></LineChart>
27 -  
28 -<!-- <div class="detail_linechart" id="indentKpiLineChart"></div>-->  
29 - <!-- <div class="detail_linechart" id="warningKpiLineChart" style="margin-top:35px;"></div>-->  
30 - <!-- <div class="detail_linechart" id="line-tingyun-trendKpiLineChart" style="margin-top:35px;"></div>-->  
31 -  
32 -  
33 </el-col> 38 </el-col>
34 </el-row> 39 </el-row>
35 </div> 40 </div>
@@ -12,6 +12,8 @@ export default { @@ -12,6 +12,8 @@ export default {
12 setup(props, {attrs, slots, emit}) { 12 setup(props, {attrs, slots, emit}) {
13 const {proxy} = Vue.getCurrentInstance(); 13 const {proxy} = Vue.getCurrentInstance();
14 let dateType=Vue.ref('oneDay'); 14 let dateType=Vue.ref('oneDay');
  15 + let customDate=Vue.ref('');//选择日期
  16 + let customTime=Vue.ref([]);//时间范围
15 let optionData=Vue.ref(''); 17 let optionData=Vue.ref('');
16 //series接口无数据时默认数据 18 //series接口无数据时默认数据
17 let seriesData = Vue.ref([{ 19 let seriesData = Vue.ref([{
@@ -111,6 +113,8 @@ export default { @@ -111,6 +113,8 @@ export default {
111 ]) 113 ])
112 114
113 const changeInterval=(val)=>{ 115 const changeInterval=(val)=>{
  116 + customDate.value='';
  117 + customTime.value=[];
114 dateType.value=val; 118 dateType.value=val;
115 if(val=='custom'){ 119 if(val=='custom'){
116 }else{ 120 }else{
@@ -138,8 +142,15 @@ export default { @@ -138,8 +142,15 @@ export default {
138 idStr=kpiId; 142 idStr=kpiId;
139 } 143 }
140 kpiName.value = params.name;//指标名称 144 kpiName.value = params.name;//指标名称
  145 + let startTime='';
  146 + let endTime='';
  147 + if(customTime.value && customTime.value.length>0){
  148 + startTime=customTime.value[0];
  149 + endTime=customTime.value[1];
  150 + }
141 let url = '/api-web/scatter/getByResId?dateType=' + dateType.value + 151 let url = '/api-web/scatter/getByResId?dateType=' + dateType.value +
142 - '&resId=' + resourceId + '&kpiId=' + idStr + '&resType=' + resType; 152 + '&resId=' + resourceId + '&kpiId=' + idStr + '&resType=' + resType+'&customDate='+customDate.value+
  153 + '&startTime=' +startTime +'&endTime=' + endTime;
143 proxy.$http.get(url, {},function (res){ 154 proxy.$http.get(url, {},function (res){
144 kpiUnit.value = (!res.data || res.data.kpiUnit == null) ? "" : res.data.kpiUnit; 155 kpiUnit.value = (!res.data || res.data.kpiUnit == null) ? "" : res.data.kpiUnit;
145 if (res.data && res.data.length == 0) { 156 if (res.data && res.data.length == 0) {
@@ -251,7 +262,18 @@ export default { @@ -251,7 +262,18 @@ export default {
251 boundaryGap: ['10%', '10%'], 262 boundaryGap: ['10%', '10%'],
252 axisLabel: { 263 axisLabel: {
253 interval:59,//label无间隔 264 interval:59,//label无间隔
254 - formatter: '{value} 时' 265 + // formatter: '{value} 时'
  266 + formatter: function (param) {
  267 + let newParamsName='';
  268 + let arr=param?param.split(":"):[];
  269 + if(arr[0]){
  270 + let strFirst=arr[0].substring(0,1);
  271 + let strSecond=arr[0].substring(1);
  272 + strFirst=strFirst.replace('0', "");
  273 + newParamsName=strFirst + strSecond+' 时';
  274 + }
  275 + return newParamsName
  276 + }
255 277
256 }, 278 },
257 axisLine: { 279 axisLine: {
@@ -356,6 +378,18 @@ export default { @@ -356,6 +378,18 @@ export default {
356 } 378 }
357 YAxisData.value=arr1; 379 YAxisData.value=arr1;
358 } 380 }
  381 + //查询自定义时间段的数据
  382 + let search=()=>{
  383 + if(!customDate.value){
  384 + proxy.$global.showMsg('请选择日期','warning');
  385 + return;
  386 + }
  387 + if(!customTime.value || customTime.value.length==0){
  388 + proxy.$global.showMsg('请选择时间范围','warning');
  389 + return;
  390 + }
  391 + getLineChart();
  392 + }
359 // 挂载完 393 // 挂载完
360 Vue.onMounted(() => { 394 Vue.onMounted(() => {
361 getYAxisData(); 395 getYAxisData();
@@ -376,7 +410,10 @@ export default { @@ -376,7 +410,10 @@ export default {
376 kpiName, 410 kpiName,
377 optionDataInit, 411 optionDataInit,
378 getLineChart, 412 getLineChart,
379 - changeInterval 413 + changeInterval,
  414 + customDate,
  415 + customTime,
  416 + search
380 } 417 }
381 } 418 }
382 } 419 }