monitor_v3 / hg-monitor-web · Commits

Go to a project

Authored by wangtao
Commit 6d86d1b0cbf4b3b978ef21c7b443143336c7817c 2 parents 9e21d8a0 45225f0e

Merge branch 'master-500-dev' of http://113.200.75.45:82/monitor_v3/hg-monitor-w… 

…eb into master-500-dev
Inline Side-by-side
Showing 17 changed files with 537 additions and 74 deletions
... ... @@ -33,6 +33,7 @@ layui.define(['form', 'admin', 'laydate', 'common','sessions','reskpilist'], fun
// 获取合并通知开关是否开启
getNoticeMergeFlag();
let NoticeMergeFlag = 'off';
function getNoticeMergeFlag(){
admin.req({
url: common.domainName + '/api-web/manage/ddic/findSucDdics/noticeMergeFlag'
... ... @@ -41,6 +42,7 @@ layui.define(['form', 'admin', 'laydate', 'common','sessions','reskpilist'], fun
, success: function (res) {
$.each(res.data, function (i, v) {
if(v.ddicCode == 'on'){
NoticeMergeFlag= 'on';
$('#noticeMergeTab').show();
}
});
... ... @@ -231,14 +233,17 @@ layui.define(['form', 'admin', 'laydate', 'common','sessions','reskpilist'], fun
return false;
}
if(!data.alarmContentExpr || data.alarmContentExpr == ''){
layer.msg("请先填写告警内容描述表达式！", {
icon: 7
, time: 3000
});
return false;
if(NoticeMergeFlag && NoticeMergeFlag == 'on'){
if(!data.alarmContentExpr || data.alarmContentExpr == ''){
layer.msg("请先填写告警内容描述表达式！", {
icon: 7
, time: 3000
});
return false;
}
}
var importantPolicy = data.seriousPolicy;
var importantExpr = data.importantPolicy;
var commonlyPolicy = data.commonlyPolicy;
... ...
... ... @@ -162,10 +162,7 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele
}
titleStr = valueStr;
}
var tips = '<a class="detail_row_menu hide">\n' +
'<img style="width: 17px;height: 17px;" src="/src/style/img/icon_row_menu.png">\n' +
'</a>'
var tips = '<a class="detail_row_menu hide" data-statusf='+statusF+' data-id='+v.id+' data-flag='+v.flag+
var tips = '<a class="detail_row_menu hide" data-statusf="'+statusF+'" data-id='+v.id+' data-flag='+v.flag+
' data-name='+v.name+' data-kpiname='+v.name+' data-iswarning=1 data-ident=1' +
' data-trend=0 data-unit="" data-hidem="hidem" data-nature="true" ' +
// ' data-restype='+((data && data[0])?data[0].resType:"")+'>\n' +
... ... @@ -239,12 +236,6 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele
}).done(function (res) {
var flags = "";
var kpiIdList= "";
//start lsq 判断当前kpiId是否在状态指标数据列表中 2022-06-08
let status=statusKpiList.indexOf(v.id);
if(status!=-1){
statusF=true;
}
//end lsq 2022-06-08
var data = res.data;
if (data.length > 0) {
var dataArr = common.splieceGroup(data, cols);
... ... @@ -255,6 +246,12 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele
$.each(v, function (j, ar) {
var valueStr = '';
var titleStr = '';
//start lsq 判断当前kpiId是否在状态指标数据列表中 2022-06-08
let status=statusKpiList.indexOf(ar.id);
if(status!=-1){
statusF=true;
}
//end lsq 2022-06-08
if(ar.id == 'KPIE13DD9A3' ) {
valueStr = laytpl($("#linkStateDetailTpl").html()).render({linkStateList: ar.value});
} else if (ar.value != 'null'){
... ... @@ -277,13 +274,10 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele
kpiIdList += ar.id + ",";
}
//start lsq 更改下探图标的属性值 2022-06-08
/* var tips = '<a class="detail_row_menu hide">\n' +
'<img style="width: 17px;height: 17px;" src="/src/style/img/icon_row_menu.png">\n' +
'</a>'*/
var tips = '<a class="detail_row_menu hide" data-statusf='+statusF+' data-id='+v.id+' data-flag='+v.flag+
' data-name='+v.name+' data-kpiname='+v.name+' data-iswarning=1 data-ident=1' +
var tips = '<a class="detail_row_menu hide" data-statusf="'+statusF+'" data-id='+ar.id+' data-flag='+ar.flag+
' data-name='+ar.name+' data-kpiname='+ar.name+' data-iswarning=1 data-ident=1' +
' data-trend=0 data-unit="" data-hidem="hidem" data-nature="true" ' +
' data-restype='+(v.resType?v.resType:"")+'>\n' +
' data-restype='+(ar.resType?ar.resType:"")+'>\n' +
'<img style="width: 17px;height: 17px;" src="/src/style/img/icon_row_menu.png">\n' +
'</a>'
//end lsq 2022-06-08
... ... @@ -1906,6 +1900,9 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele
* @param colWidth 各个列宽度设置，可以只设置前边的，设置百分比
*/
renderTable: function (tableId, page, resId, kpiId, title, flagPrifix, sortBy, order, size,colWidth) {
//start lsq 状态信息的状态也增加下探 202-06-08
let statusF=false;//是否为状态信息
//end lsq 2022-06-08
var editFlag = localStorage.getItem("editFlag");//是否编辑状态
if (!size) {
size = 5;
... ... @@ -2029,9 +2026,14 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele
// }
//
// // End Wang 2021/11/18 15:03 查询字典编辑指标，判断编辑状态
//start lsq 判断当前kpiId是否在状态指标数据列表中 2022-06-08
let status=statusKpiList.indexOf(d[v.id].kpiId);
if(status!=-1){
statusF=true;
}
//end lsq 2022-06-08
//拼接表空间名称、文件系统名称等等,如果是性能指标或者趋势指标，则可以下探 徐毫杰还原
if (value.kpiIdent == '1' || value.isWarning == '1') {
if (value.kpiIdent == '1' || value.isWarning == '1' || status!=-1) {
var chbox = '';
if (editFlag && editFlag == "true" && value.kpiIdent == '1') {
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
}
return chbox + '<a class="link showlinechart_' + tableId + '" style="padding-left:5px;' + resStyle + '" ' + 'data-isWarning="' + value.isWarning + '" data-ident="' + value.kpiIdent + '"' +
'data-trend="' + value.isTrend + '" data-id="' + v.id + '" data-kpiname="' + kpiname + '" data-name="' + v.name + '" data-flag="' + value.flag + '">' + value.kpiValue + '</a>' +
'<a class="detail_row_menu hide" data-isWarning="' + value.isWarning + '" data-ident="' + value.kpiIdent + '" data-trend="' + value.isTrend + '" ' +
'<a class="detail_row_menu hide" data-statusf="'+statusF+'" data-isWarning="' + value.isWarning + '" data-ident="' + value.kpiIdent + '" data-trend="' + value.isTrend + '" ' +
'data-id="' + v.id + '" data-kpiname="' + kpiname + '" data-name="' + v.name + '" data-flag="' + value.flag + '"' +
'data-canca="' + value.canCA + '" data-incaing="' + value.inCAing + '" data-restype="' + resType + '"' +
'>' +
... ... @@ -2439,6 +2441,9 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele
* @param resId
*/
renderActiveAlarms: function (tableId, resId) {
//start lsq 状态信息的状态也增加下探 202-06-08
let statusF=false;//是否为状态信息
//end lsq 2022-06-08
$('#'+tableId).prev().text('实时告警')
var alarmlist = table.render({
elem: '#' + tableId
... ... @@ -2477,11 +2482,25 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele
, {
field: 'kpiName', title: '指标名称', align: 'center', width: '20%',
templet: function (d) {
//start lsq 判断当前kpiId是否在状态指标数据列表中 2022-06-08
let status=statusKpiList.indexOf(d.kpiId);
if(status!=-1){
statusF=true;
}
//end lsq 2022-06-08
var kpiName = d.kpiName == 'TYPE'?'ERRPT':d.kpiName;
let chbox='';
if(status!=-1){
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 + '" ' +
'data-id="' + d.kpiId + '" data-kpiname="' + d.kpiName + '" data-name="' + d.name + '" data-flag="' + d.flag + '"' +
'data-canca="' + d.canCA + '" data-incaing="' + d.inCAing + '" data-restype="' + d.resType + '"' +
'>' +
'<img style="width: 20px;height: 20px;" src="/src/style/img/icon_row_menu.png"></a>';;
}
if (d.kpiIdent != 1 && d.isWarning != 1) {
return '<div>' + kpiName + '</div>';
return '<div>' + kpiName +chbox+ '</div>';
}
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>';
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>';
}
}
, {field: 'updateTime', title: '告警时间', align: 'center', width: '15%'}
... ... @@ -2595,6 +2614,17 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele
'<input type="radio" name="noticeFlag" value="true" title="是">&nbsp;是' +
'<input type="radio" name="noticeFlag" value="false" title="否" checked="" style="margin-left: 20px;">&nbsp;否</div> ');
}
//start lsq 添加状态指标下探 2022-06-09
$("[lay-id='"+tableId+"']").find(".layui-table-cell").hover(function () {
var $that = $(this)
var $btn = $that.find(".detail_row_menu");
if ($btn.length > 0) {
$(".layui-card-body").find(".detail_row_menu:not(.hide)").addClass("hide")
$btn.removeClass("hide");
}
})
filterSuppressMonitor(resId);
//end lsq 2022-06-09
}
})
});
... ... @@ -4213,32 +4243,39 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele
var nature = $menu.data('nature');
//lsq 状态信息无其他下探 2022-06-08
var statusF = $menu.data('statusf');
var one = $menu.data('one');
var menubox = '<div class="detail_menubox" id="detail_menubox_id" style="color:#666;"><ul>';
if (!nature) {
menubox +=
'<li type="w"><i class="layui-icon">&#xe667;</i>告警设置</li>' +
'<li type="s"><i class="layui-icon">&#xe64d;</i>过滤单指标</li>';
}
if (!hideM) {
menubox += '<li type="m"><i class="layui-icon">&#xe64d;</i>过滤多指标</li>';
}
if (!nature) {
menubox += '<li type="t"><i class="layui-icon">&#xe62c;</i>性能趋势</li>';
//lsq 只有状态指标下探的标识
if(one==1){
menubox+='';
}else{
if (!nature) {
menubox +=
'<li type="w"><i class="layui-icon">&#xe667;</i>告警设置</li>' +
'<li type="s"><i class="layui-icon">&#xe64d;</i>过滤单指标</li>';
}
if (!hideM) {
menubox += '<li type="m"><i class="layui-icon">&#xe64d;</i>过滤多指标</li>';
}
if (!nature) {
menubox += '<li type="t"><i class="layui-icon">&#xe62c;</i>性能趋势</li>';
}
// if(!statusF){
menubox += '<li type="n"><i class="layui-icon">&#xe758;</i>压制次数</li>';
// }
// Start Wang 2022/3/28 14:06 833:屏蔽纳入容量预测按钮 https://hgkj.zentaopm.com/task-view-833.html
// 后面计划将功能作为配置项
// if (canCA) {
// if (inCAing) {
// menubox += '<li type="ca-cancel"><i class="layui-icon">&#xe64d;</i>取消容量预测</li>';
// } else {
// menubox += '<li type="ca-add"><i class="layui-icon">&#xe64c;</i>纳入容量预测</li>';
// }
// }
// End Wang 2022/3/28 14:06
}
// if(!statusF){
menubox += '<li type="n"><i class="layui-icon">&#xe758;</i>压制次数</li>';
// }
// Start Wang 2022/3/28 14:06 833:屏蔽纳入容量预测按钮 https://hgkj.zentaopm.com/task-view-833.html
// 后面计划将功能作为配置项
// if (canCA) {
// if (inCAing) {
// menubox += '<li type="ca-cancel"><i class="layui-icon">&#xe64d;</i>取消容量预测</li>';
// } else {
// menubox += '<li type="ca-add"><i class="layui-icon">&#xe64c;</i>纳入容量预测</li>';
// }
// }
// End Wang 2022/3/28 14:06
menubox += '</ul></div>';
var cX = e.clientX + 10;
var cY = e.clientY - 10;
... ... @@ -4259,7 +4296,6 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele
flag = flag.replace(/^\s+|\s+$/g, "");
}
//start lsq 根据kpiid获取是否是指标状态 2022-05-23
//start lsq 根据kpiid获取是否是指标状态 2022-05-23
let idArr=[];
let idStr='';
if(id.indexOf(',')!=-1){
... ...
... ... @@ -12,7 +12,7 @@ layui.extend({
,admin: 'lib/admin' //核心模块
/*,sessions: 'controller/sessions'*/
,view: 'lib/view' //核心模块
}).define(['setter', 'admin'], function(exports){
}).define(['setter', 'admin','pageTips'], function(exports){
var setter = layui.setter
,element = layui.element
,admin = layui.admin
... ...
... ... @@ -242,6 +242,13 @@ layui.define(['laytpl', 'layer'], function(exports){
that.parse(html);
view.removeLoad();
// 弹框
try{
layui.pageTips.init();
}catch (e) {
console.log(e)
}
if(that.done){
that.done(res);
delete that.done;
... ...
//性能曲线图
layui.define(['element', 'admin'], function (exports) {
var $ = layui.$;
var admin = layui.admin;
var domainName = sessionStorage.getItem('domainName');
var obj = {
data: {
contextmenuTips: null,
contextmenus: [],
classNams: []
},
getCurrentHash: function () {
return window.location.hash;
},
init: function () {
var that = this;
if (that.data.contextmenus.length > 0) {
that.bindContextMenuEvent();
return that.data.contextmenus;
}
if('#/user/login/redirect=%2F' == that.getCurrentHash()){
return;
}
// 获取配置的信息
admin.req({
url: domainName + '/api-web/manage/ddic/findSucDdics/contextmenus'
, method: 'POST'
, async: false
, success: function (res) {
$.each(res.data, function (i, v) {
that.data.contextmenus.push(v.ddicCode);
});
that.bindContextMenuEvent();
}
})
},
/**
* 获取当前元素的提示信息
* @param elementName 文本内容
* @param currentEl 当前元素
*/
getTipsDetail(elementName, currentEl) {
var that = this;
admin.req({
url: domainName + '/api-web/bHalt'
, data: {
urlHash: that.getCurrentHash(),
elementName: elementName
}
, async: false
, done: function (res) {
var contextmenuEl = '<ul id="tipContextmenu" class="contextmenu-style" style="color:#fff;">';
if (res.data && res.data.length > 0) {
let tipData = res.data;
tipData.map(item => {
contextmenuEl += '<li>' + item.elementExplain + '</li>';
})
} else {
contextmenuEl += '<li>' + elementName + '</li>';
}
contextmenuEl += '</ul>';
that.data.contextmenuTips = layer.tips(contextmenuEl, currentEl, {
time: 0,
tips: [3, '#1e9fff'],
success() {
}
})
setTimeout(function (){
layer.closeAll('tips');
},5000)
}
})
},
bindContextMenuEvent() {
var that = this;
var contextmenus = that.data.contextmenus;
var bindContextEvent = function (selector, index) {
var el = $(selector);
// 超过30秒
if (index > 60) {
return;
}
if (el == null || el.length == 0) {
setTimeout(function () {
bindContextEvent(selector, ++index);
}, 500)
return;
}
el.attr('title', '点击鼠标右键查看功能点描述信息')
el.contextmenu(function (e) {
e.preventDefault();
let thatItem = $(this);
// 获取当前元素名称正则表达式
var reg = sessionStorage.getItem('regular');
let elementName = thatItem.text().replace(reg, "");
that.getTipsDetail(elementName, thatItem);
})
}
// 循环绑定事件
var bind = function (){
$(contextmenus).each(function (index) {
let val = contextmenus[index];
if (val.indexOf('el::') != -1) {
let elName = val.replace('el::', '');
bindContextEvent(elName, 0);
}
})
}
// 获取当前页面，是否在配置中
var page = that.getCurrentHash();
$(contextmenus).each(function (index) {
let val = contextmenus[index];
if (val.indexOf('page::') != -1 ) {
let elName = val.replace('page::', '');
if(elName == page){
bind();
return;
}
}
})
// 点击关闭所有tips
$(document).on('click', function (event) {
layer.closeAll('tips');
})
}
}
// 页面刷新默认初始化
setTimeout(function () {
obj.init();
}, 1000)
//对外暴露 的接口
exports('pageTips', obj);
});
... ...
<title>登录配置</title>
<iframe src="/vue3/index.html#/vue3/logoConfig" class="layadmin-iframe" style="height: 99.5%!important;"/>
... ...
... ... @@ -9,6 +9,8 @@
@import "../css/esData.css";
/*cmdb数据同步*/
@import "../css/cmdbdatasync.css";
/*登录logo配置*/
@import "../css/logoConfig.css";
.d-flex {
display: flex;
... ...
.logoConfig-container{
padding:10px;
height: 100%;
overflow: auto;
background: #ffffff;
}
.logoConfig-item{
padding:0 20px;
margin-bottom: 10px;
display: flex;
align-items: center;
}
.logoConfig-item-content{
margin-bottom:10px;
padding-bottom: 20px;
}
.config-login{
display: flex;
align-items: center;
justify-content: space-around;
}
.config-name{
width:110px;
}
.config-tip{
text-align: left;
font-size: 12px;
margin-left:6px;
width:200px;
}
.upload-demo{
margin-left:20px;
}
.logo-img{
width:400px;
/*flex:1;*/
}
\ No newline at end of file
... ...
... ... @@ -137,6 +137,12 @@ const routes = [{
name: 'orgBustype',
component: () => myImport('views/orgBustype/index')
},
//登录logo配置
{
path: '/vue3/logoConfig',
name: 'logoConfig',
component: () => myImport('views/logoConfig/index')
},
];
// hash模式： createWebHashHistory
... ...
... ... @@ -3,33 +3,38 @@
<div class="pie-detail-content">
<el-row class="detail-content-title">
<el-col :span="8"></el-col>
<el-col :span="16" class="pie-flex-end">
<div class="pie-date-range">
<!-- <cm-date-range-influx v-if="dateType=='custom'" :keys="keys" @callbackinflux="getInfluxOption" @callbacksure="getOptionData" @callbacktime="callbacktime" @callbackrate="callbackrate"></cm-date-range-influx>-->
</div>
<el-col :span="16" class="pie-flex-end" style="justify-content: flex-end;">
<div class="line-filter pie-line-filter">
<div class="linechartfrequency line-filter-content">
<div v-if="dateType!='custom'" @click="changeInterval('oneDay')" :class="['line-filter-item', {'active':dateType=='oneDay'}]" data-value="oneDay" >近24小时</div>
<div v-if="dateType!='custom'" @click="changeInterval('week')" :class="['line-filter-item', {'active':dateType=='week'}]" data-value="week">一周</div>
<div v-if="dateType!='custom'" @click="changeInterval('month')" :class="['line-filter-item', {'active':dateType=='month'}]" data-value="month">一月</div>
<!-- <div v-if="dateType!='custom'" @click="changeInterval('YEAR')" :class="['line-filter-item', {'active':dateType=='YEAR'}]" data-value="YEAR">一年</div>-->
<!-- <div v-if="dateType!='custom'" @click="changeInterval('custom')" :class="['line-filter-item', {'active':dateType=='custom'}]" data-value="custom">自定义</div>-->
<!-- <div v-if="dateType=='custom'" @click="changeInterval('DAY')" :class="['line-filter-item', {'active':dateType=='custom'}]" data-value="custom">返 回</div>-->
<el-date-picker
v-model="customDate"
type="date"
placeholder="请选择日期"
size="small"
format="YYYY-MM-DD"
value-format="YYYY-MM-DD"
style="margin-left:6px;"
/>
<el-time-picker
v-model="customTime"
is-range
range-separator="-"
start-placeholder="开始时间"
end-placeholder="结束时间"
size="small"
format="HH:mm:ss"
value-format="HH:mm:ss"
style="margin-left:6px;"
/>
<el-button style="margin-left:6px;" type="primary" size="small" @click="search"> 查询</el-button>
</div>
</div>
</el-col>
</el-row>
<el-row class="detail-content">
<el-col :span="24" class="detail_linechart">
<el-col :span="24" class="detail_linechart" style="height:550px !important;">
<LineChart :optionData="optionData" v-if="optionData"></LineChart>
<!-- <div class="detail_linechart" id="indentKpiLineChart"></div>-->
<!-- <div class="detail_linechart" id="warningKpiLineChart" style="margin-top:35px;"></div>-->
<!-- <div class="detail_linechart" id="line-tingyun-trendKpiLineChart" style="margin-top:35px;"></div>-->
</el-col>
</el-row>
</div>
... ...
... ... @@ -12,6 +12,8 @@ export default {
setup(props, {attrs, slots, emit}) {
const {proxy} = Vue.getCurrentInstance();
let dateType=Vue.ref('oneDay');
let customDate=Vue.ref('');//选择日期
let customTime=Vue.ref([]);//时间范围
let optionData=Vue.ref('');
//series接口无数据时默认数据
let seriesData = Vue.ref([{
... ... @@ -111,6 +113,8 @@ export default {
])
const changeInterval=(val)=>{
customDate.value='';
customTime.value=[];
dateType.value=val;
if(val=='custom'){
}else{
... ... @@ -138,8 +142,15 @@ export default {
idStr=kpiId;
}
kpiName.value = params.name;//指标名称
let startTime='';
let endTime='';
if(customTime.value && customTime.value.length>0){
startTime=customTime.value[0];
endTime=customTime.value[1];
}
let url = '/api-web/scatter/getByResId?dateType=' + dateType.value +
'&resId=' + resourceId + '&kpiId=' + idStr + '&resType=' + resType;
'&resId=' + resourceId + '&kpiId=' + idStr + '&resType=' + resType+'&customDate='+customDate.value+
'&startTime=' +startTime +'&endTime=' + endTime;
proxy.$http.get(url, {},function (res){
kpiUnit.value = (!res.data || res.data.kpiUnit == null) ? "" : res.data.kpiUnit;
if (res.data && res.data.length == 0) {
... ... @@ -251,7 +262,18 @@ export default {
boundaryGap: ['10%', '10%'],
axisLabel: {
interval:59,//label无间隔
formatter: '{value} 时'
// formatter: '{value} 时'
formatter: function (param) {
let newParamsName='';
let arr=param?param.split(":"):[];
if(arr[0]){
let strFirst=arr[0].substring(0,1);
let strSecond=arr[0].substring(1);
strFirst=strFirst.replace('0', "");
newParamsName=strFirst + strSecond+' 时';
}
return newParamsName
}
},
axisLine: {
... ... @@ -356,6 +378,18 @@ export default {
}
YAxisData.value=arr1;
}
//查询自定义时间段的数据
let search=()=>{
if(!customDate.value){
proxy.$global.showMsg('请选择日期','warning');
return;
}
if(!customTime.value || customTime.value.length==0){
proxy.$global.showMsg('请选择时间范围','warning');
return;
}
getLineChart();
}
// 挂载完
Vue.onMounted(() => {
getYAxisData();
... ... @@ -376,7 +410,10 @@ export default {
kpiName,
optionDataInit,
getLineChart,
changeInterval
changeInterval,
customDate,
customTime,
search
}
}
}
... ...
<div class="logoConfig-container" >
<el-tabs v-model="activeName" class="demo-tabs" @tab-click="handleClick">
<el-tab-pane v-for="(item,index) in skinData" :key="index" :label="item.name+'布局'" :name="item.name">
<el-row class="logoConfig-item" >
<!--<el-col :span="4" >
个性化布局-{{item.name}}
</el-col>-->
<el-col :span="24">
<el-row class="logoConfig-item-content" v-if="item.imageUrl">
<el-col :span="24">
<div class="config-login">
<span class="config-name">登录logo：</span>
<img :src="item.imageUrl" class="logo-img" alt="">
<el-upload
class="upload-demo"
:show-file-list="false"
:before-upload="beforeAvatarUpload"
:data="item"
:multiple="false"
:http-request="getFile"
:auto-upload="true">
<el-button size="mini" type="primary">上传照片</el-button>
</el-upload>
<dev class="config-tip">
(备注说明：登录表单上方展示的logo)
</dev>
</div>
</el-col>
</el-row>
<el-row class="logoConfig-item-content" v-if="item.imageUrlBg">
<el-col :span="24">
<div class="config-login">
<span class="config-name">登录背景：</span>
<img :src="item.imageUrlBg" class="logo-img" alt="">
<el-upload
class="upload-demo"
:show-file-list="false"
:before-upload="beforeAvatarUpload"
:data="item"
:multiple="false"
:http-request="getFile"
:auto-upload="true">
<el-button size="mini" type="primary">上传照片</el-button>
</el-upload>
<dev class="config-tip">
(备注说明：登录表单下的背景图片)
</dev>
</div>
</el-col>
</el-row>
<el-row class="logoConfig-item-content" v-if="item.imageUrlSkin">
<el-col :span="24">
<div class="config-login">
<span class="config-name">登录皮肤：</span>
<img :src="item.imageUrlSkin" class="logo-img" alt="">
<el-upload
class="upload-demo"
:show-file-list="false"
:before-upload="beforeAvatarUpload"
:data="item"
:multiple="false"
:http-request="getFile"
:auto-upload="true">
<el-button size="mini" type="primary">上传照片</el-button>
</el-upload>
<dev class="config-tip">
(备注说明：登录页面的皮肤图片)
</dev>
</div>
</el-col>
</el-row>
<el-row class="logoConfig-item-content" v-if="item.imageUrlIndex">
<el-col :span="24">
<div class="config-login">
<span class="config-name">首页logo：</span>
<img :src="item.imageUrlIndex" class="logo-img" alt="">
<el-upload
class="upload-demo"
:show-file-list="false"
:before-upload="beforeAvatarUpload"
:data="item"
:multiple="false"
:http-request="getFile"
:auto-upload="true">
<el-button size="mini" type="primary">上传照片</el-button>
</el-upload>
<dev class="config-tip">
(备注说明：首页上方展示的logo)
</dev>
</div>
</el-col>
</el-row>
</el-col>
</el-row>
</el-tab-pane>
</el-tabs>
</div>
... ...
export default {
name: 'logoConfig',
template: '',
components: {
},
data() {
},
props: {
},
setup: function (props, {attrs, slots, emit}) {
const {proxy} = Vue.getCurrentInstance();
let activeName=Vue.ref('default');
//imageUrl:登录logo，imageUrlSkin：登录皮肤，imageUrlBg：登录背景，imageUrlIndex：首页logo
let skinData=Vue.ref([
{name:"default",imageUrl:'/src/style/img/logo.png',imageUrlSkin:'',
imageUrlBg:'/src/style/img/login-form.png',imageUrlIndex:'/src/style/img/logo.png'},
{name:"skin1",imageUrl:'/src/style/img/login/skin/1/mingcheng.png',imageUrlSkin:'/src/style/img/login/skin/1/beijing.png',
imageUrlBg:'',imageUrlIndex:'/src/style/img/logo.png'},
{name:"skin2",imageUrl:'/src/style/img/login/skin/2/mingcheng2.png',imageUrlSkin:'/src/style/img/login/skin/2/beijng.png',
imageUrlBg:'',imageUrlIndex:'/src/style/img/logo.png'}
])
let imageUrl=Vue.ref('/src/style/img/logo.png');
let imageUrlSkin=Vue.ref('/src/style/img/login/skin/1/beijing.png');
let imageUrlBg=Vue.ref('/src/style/img/login-form.png');
let imageUrlIndex=Vue.ref('/src/style/img/logo.png');
let fit='contain';
let beforeAvatarUpload = (file) => {
const isJPG = file.type.indexOf('image/') != -1
if (!isJPG) {
proxy.$global.showMsg('您上传的不是图片文件,请选择图片！', 'error');
}
return isJPG
}
let getFile = (param) => {
let fileObj = param.file
console.log("param.data",param.data)
let params = {
file: fileObj,
id: props.parentNode.id
}
// 上传文件
proxy.$http.uploadFile("/api-web/bOpsPerson/uploadFile", params, function (res) {
if (res && res.success) {
proxy.$global.showMsg("上传成功！");
}
})
imageUrl.value = URL.createObjectURL(fileObj);
}
//tabs标签点击事件
let handleClick=(tab,event)=>{}
// 挂载完
Vue.onMounted(() => {
})
return {
activeName,
handleClick,
fit,
imageUrlSkin,
imageUrlIndex,
imageUrlBg,
beforeAvatarUpload,
imageUrl,
getFile,
skinData
}
}
}
... ...
... ... @@ -68,7 +68,7 @@
:pageSize="search.limitUn"
:showPage="true"
:showTools="false"
:height="height - 300">
:height="'360'">
<template #default="{row,prop,column}">
<div v-if="prop=='showType'">
<el-select v-model="row.showType" placeholder="">
... ...
... ... @@ -227,6 +227,17 @@ const routes = [{
name: 'orgBustype',
component: () => myImport('views/orgBustype/index')
},
{
path: '/vue3/batchChangeLeaders',
name: 'batchChangeLeaders',
component: () => myImport('views/batchChangeLeaders/index')
},
//登录logo配置
{
path: '/vue3/logoConfig',
name: 'logoConfig',
component: () => myImport('views/logoConfig/index')
},
];
// hash模式： createWebHashHistory
... ...