diff --git a/web/pages/retained.html b/web/pages/retained.html index 31deead..31f0cae 100644 --- a/web/pages/retained.html +++ b/web/pages/retained.html @@ -24,6 +24,11 @@
+ +
+ +
+ @@ -116,8 +121,8 @@
- + +
显示设置
@@ -129,7 +134,7 @@ -
+
@@ -152,6 +157,35 @@ +
+
+
+
+
+ +
+
+ +
+ 编辑 + 完成 + +
+
+ +
+
+ +
+
+ +
+
+ + +
+
+ \ No newline at end of file + + + + diff --git a/web/src/x.min.js b/web/src/x.min.js index dc1897e..4bc2adc 100644 --- a/web/src/x.min.js +++ b/web/src/x.min.js @@ -700,7 +700,7 @@ var X = window.X || { }; X.eventsmall = function(data,callback){ - var date,num,wowtype,chain_ratiotype; //时间,当天数量 + var date,num,wowtype="",chain_ratiotype=""; //时间,当天数量 // console.log(data); // for(let i in data){ // if(data[i]['groups']['length'] == 0){ @@ -711,16 +711,20 @@ var X = window.X || { var length = data[0]['date_range'].length - 1; date = data[0]['date_range'][length]; num = data[0]['values'][0][length]; - if(data[0]['wow'] >= 0){ - wowtype = '+' - }else{ - wowtype = '-' + if(data[0]['wow']){ + if(data[0]['wow'] >= 0){ + wowtype = '+' + }else{ + wowtype = '-' + } } - if(data[0]['chain_ratio'] >= 0){ - chain_ratiotype = '+' - }else{ - chain_ratiotype = '-' + if(data[0]['chain_ratio']){ + if(data[0]['chain_ratio'] >= 0){ + chain_ratiotype = '+' + }else{ + chain_ratiotype = '-' + } } var dataArr = { @@ -741,6 +745,21 @@ var X = window.X || { nname = 'n_outflow'; pname = 'p_outflow'; } + console.log() + if(data['filter_item_type'] != "all" && data['filter_item_type'] != "" && data['filter_item_type']){ + var filteritem = data['filter_item']; + if(data['days'].length >= 7){ + var filterarr = []; + for(let i in data['days']){ + for(let j in filteritem){ + if(data['days'][i] == filteritem[j]){ + filterarr.push(i); + } + } + } + } + } + var tabledata=[]; for(let i in data['summary_values']){ var arr = { @@ -753,19 +772,51 @@ var X = window.X || { n:0, p:0 } - nrr["n"] = data['summary_values'][i][nname][j]; - nrr["p"] = data['summary_values'][i][pname][j] - arr['data'].push(nrr); + if(data['filter_item_type'] != "all" && data['filter_item_type'] != "" && data['filter_item_type']){ + for(let a in filterarr){ + var index = Number(filterarr[a]); + if(j == index){ + nrr["n"] = data['summary_values'][i][nname][j]; + nrr["p"] = data['summary_values'][i][pname][j] + arr['data'].push(nrr); + } + } + }else { + nrr["n"] = data['summary_values'][i][nname][j]; + nrr["p"] = data['summary_values'][i][pname][j] + arr['data'].push(nrr); + } + // nrr["n"] = data['summary_values'][i][nname][j]; + // nrr["p"] = data['summary_values'][i][pname][j] + // arr['data'].push(nrr); } tabledata.push(arr); } var titdata = []; - for(let i in data['days']){ - var tit = "第" + i + "日"; - titdata.push(tit); + // for(let i in data['days']){ + // var tit = "第" + i + "日"; + // titdata.push(tit); + // } + if(data['filter_item_type'] != "all" && data['filter_item_type'] != "" && data['filter_item_type']){ + var titarr = []; + for(let j in filterarr){ + var index = Number(filterarr[j]); + titarr.push(data['days'][index]); + } + for(let i in titarr){ + var tit = "第" + titarr[i] + "日"; + titdata.push(tit); + } + }else { + for(let i in data['days']){ + var tit = "第" + i + "日"; + titdata.push(tit); + } } titdata.unshift("日期",data.title); + console.log(titdata); + console.log(tabledata); var dataArr = { titledata:titdata, condata:tabledata, @@ -775,7 +826,7 @@ var X = window.X || { }; X.retentionchart = function(d,callback){ - var nname,pname + var nname,pname,wowtype="",chain_ratiotype=""; if(d.retentiontype == 0) { nname = 'n'; pname = 'p'; @@ -846,6 +897,22 @@ var X = window.X || { } } + + if(d['wow']){ + if(d['wow'] >= 0){ + wowtype = '+' + }else{ + wowtype = '-' + } + } + + if(d['chain_ratio']){ + if(d['chain_ratio'] >= 0){ + chain_ratiotype = '+' + }else{ + chain_ratiotype = '-' + } + } var dataArr = { xAxisData:xAxisData, @@ -855,6 +922,8 @@ var X = window.X || { sum:sum.toFixed(2), mean:mean, sameday: sameday, + wowtype:wowtype, + chain_ratiotype:chain_ratiotype, retentiontype:d.retentiontype } // console.log(dataArr); @@ -8125,6 +8194,7 @@ var X = window.X || { X.template("grouped","shushi"); // X.template("toptab","analysis-zhanwei",X.DATA['projectarr']); + var data ={ "eventView":{ "cksql":"retention", @@ -8137,7 +8207,9 @@ var X = window.X || { "startTime":"2021-05-09 00:00:00", "statType":"retention", "timeParticleSize":"P1D", - "unitNum":7 + "unitNum":7, + "filter_item_type":'all', + "filter_item":[] }, "events":[ @@ -8152,6 +8224,9 @@ var X = window.X || { } }; + // 重新渲染控件 + layui.form.render(); + // 日期渲染 X.daterender("#retained-condition-date",function(start, end, label){ var startTime = start.format('YYYY-MM-DD')+ " "+ "00:00:00"; @@ -8687,6 +8762,29 @@ var X = window.X || { //数据报表渲染 function retainedtable(d){ var nname,pname + + if(data['eventView']['filter_item_type'] != "all"){ + var filteritem = data['eventView']['filter_item']; + if(d['days'].length >= 7){ + var filterarr = []; + for(let i in d['days']){ + for(let j in filteritem){ + if(d['days'][i] == filteritem[j]){ + filterarr.push(i); + } + } + } + } + // var titarr = []; + // var tablearr = []; + // for(let i in filterarr){ + // var index = Number(filterarr[i]) + 2; + // titarr.push(titdata[index]); + // } + // titarr.unshift(titdata[0],titdata[1]); + // console.log(titarr); + } + if(retentiontype == 0) { nname = 'n'; pname = 'p'; @@ -8706,20 +8804,48 @@ var X = window.X || { n:0, p:0 } - nrr["n"] = d['summary_values'][i][nname][j]; - nrr["p"] = d['summary_values'][i][pname][j] - arr['data'].push(nrr); + if(data['eventView']['filter_item_type'] != "all"){ + for(let a in filterarr){ + var index = Number(filterarr[a]); + if(j == index){ + nrr["n"] = d['summary_values'][i][nname][j]; + nrr["p"] = d['summary_values'][i][pname][j] + arr['data'].push(nrr); + } + } + }else { + nrr["n"] = d['summary_values'][i][nname][j]; + nrr["p"] = d['summary_values'][i][pname][j] + arr['data'].push(nrr); + } } tabledata.push(arr) } var titdata = []; - for(let i in d['days']){ - var tit = "第" + i + "日"; - titdata.push(tit); + if(data['eventView']['filter_item_type'] != "all"){ + var titarr = []; + for(let j in filterarr){ + var index = Number(filterarr[j]); + titarr.push(d['days'][index]); + } + for(let i in titarr){ + var tit = "第" + titarr[i] + "日"; + titdata.push(tit); + } + }else { + for(let i in d['days']){ + var tit = "第" + i + "日"; + titdata.push(tit); + } } titdata.unshift("日期",d.title); - // X.fixedTable=function(id,type,classname,headdata){ + console.log(titdata); + + + // X.fixedTable('table-div-box','row-col-fixed','',headdata); + + X.laytpldata("#table-fenxi-th-dot",titdata,".table-fenxi-th"); X.laytpldata("#table-fenxi-td-dot",tabledata,".table-fenxi-td"); }; @@ -8947,6 +9073,70 @@ var X = window.X || { } }); + //显示设置 + $(document).off('click','.analtsis-condition').on('click','.analtsis-condition',function(){ + var obj = $(this); + var offset = obj.offset(); + // offset.left,offset.top+obj.height() + $(".showsetup-box").show(); + $(".showsetup-down-box").css('top',offset.top+obj.height()); + $(".showsetup-down-box").css('left',offset.left-211); + }); + + $(document).off('click','.showsetup-box-zz').on('click','.showsetup-box-zz',function(){ + $(".showsetup-box").hide(); + }); + + layui.form.on('radio(showsetup)', function(val){ + if(val.value == 'date'){ + $(".showsetup-edit").show(); + $(".showsetup-bianji-show-box-type").show(); + var value = $(".showsetup-bianji-input-box textarea").val(); + var valarr = value.split(','); + valarr.sort(function(a, b){return a - b}); + var listarr = unique(valarr); + data['eventView']['filter_item'] = listarr; + X.laytpldata("#showsetup-bianji-show-box-dot",listarr,".showsetup-bianji-show-box"); + }else { + $(".showsetup-edit").hide(); + $(".showsetup-wancheng").hide(); + $(".showsetup-bianji-show-box-type").hide(); + $(".showsetup-bianji-input-box-type").hide(); + + } + data['eventView']['filter_item_type'] = val.value; + if(querydata){ + retainedtable(querydata) + } + }); + + $(document).off('click','.showsetup-edit').on('click','.showsetup-edit',function(){ + $(".showsetup-edit").hide(); + $(".showsetup-wancheng").show(); + $(".showsetup-bianji-show-box-type").hide(); + $(".showsetup-bianji-input-box-type").show(); + }); + + $(document).off('click','.showsetup-wancheng').on('click','.showsetup-wancheng',function(){ + $(".showsetup-edit").show(); + $(".showsetup-wancheng").hide(); + $(".showsetup-bianji-show-box-type").show(); + $(".showsetup-bianji-input-box-type").hide(); + var value = $(".showsetup-bianji-input-box textarea").val(); + var valarr = value.split(','); + valarr.sort(function(a, b){return a - b}); + var listarr = unique(valarr); + data['eventView']['filter_item'] = listarr; + X.laytpldata("#showsetup-bianji-show-box-dot",listarr,".showsetup-bianji-show-box"); + if(querydata){ + retainedtable(querydata) + } + }); + + function unique (arr) { + return Array.from(new Set(arr)) + } + } }; })(); @@ -9676,8 +9866,6 @@ var X = window.X || { desc:tabval['desc'], query:data['query'], report_id:data['_id'] - // project_id:X.DATA.projectid, - // cat: data['query']['eventView']['cksql'] } X.api('report/edit','post',arr,function(d){ layer.msg(d); diff --git a/web/srczip/common.js b/web/srczip/common.js index d320d2a..3a23eaa 100644 --- a/web/srczip/common.js +++ b/web/srczip/common.js @@ -699,7 +699,7 @@ var X = window.X || { }; X.eventsmall = function(data,callback){ - var date,num,wowtype,chain_ratiotype; //时间,当天数量 + var date,num,wowtype="",chain_ratiotype=""; //时间,当天数量 // console.log(data); // for(let i in data){ // if(data[i]['groups']['length'] == 0){ @@ -710,16 +710,20 @@ var X = window.X || { var length = data[0]['date_range'].length - 1; date = data[0]['date_range'][length]; num = data[0]['values'][0][length]; - if(data[0]['wow'] >= 0){ - wowtype = '+' - }else{ - wowtype = '-' + if(data[0]['wow']){ + if(data[0]['wow'] >= 0){ + wowtype = '+' + }else{ + wowtype = '-' + } } - if(data[0]['chain_ratio'] >= 0){ - chain_ratiotype = '+' - }else{ - chain_ratiotype = '-' + if(data[0]['chain_ratio']){ + if(data[0]['chain_ratio'] >= 0){ + chain_ratiotype = '+' + }else{ + chain_ratiotype = '-' + } } var dataArr = { @@ -740,6 +744,21 @@ var X = window.X || { nname = 'n_outflow'; pname = 'p_outflow'; } + console.log() + if(data['filter_item_type'] != "all" && data['filter_item_type'] != "" && data['filter_item_type']){ + var filteritem = data['filter_item']; + if(data['days'].length >= 7){ + var filterarr = []; + for(let i in data['days']){ + for(let j in filteritem){ + if(data['days'][i] == filteritem[j]){ + filterarr.push(i); + } + } + } + } + } + var tabledata=[]; for(let i in data['summary_values']){ var arr = { @@ -752,19 +771,51 @@ var X = window.X || { n:0, p:0 } - nrr["n"] = data['summary_values'][i][nname][j]; - nrr["p"] = data['summary_values'][i][pname][j] - arr['data'].push(nrr); + if(data['filter_item_type'] != "all" && data['filter_item_type'] != "" && data['filter_item_type']){ + for(let a in filterarr){ + var index = Number(filterarr[a]); + if(j == index){ + nrr["n"] = data['summary_values'][i][nname][j]; + nrr["p"] = data['summary_values'][i][pname][j] + arr['data'].push(nrr); + } + } + }else { + nrr["n"] = data['summary_values'][i][nname][j]; + nrr["p"] = data['summary_values'][i][pname][j] + arr['data'].push(nrr); + } + // nrr["n"] = data['summary_values'][i][nname][j]; + // nrr["p"] = data['summary_values'][i][pname][j] + // arr['data'].push(nrr); } tabledata.push(arr); } var titdata = []; - for(let i in data['days']){ - var tit = "第" + i + "日"; - titdata.push(tit); + // for(let i in data['days']){ + // var tit = "第" + i + "日"; + // titdata.push(tit); + // } + if(data['filter_item_type'] != "all" && data['filter_item_type'] != "" && data['filter_item_type']){ + var titarr = []; + for(let j in filterarr){ + var index = Number(filterarr[j]); + titarr.push(data['days'][index]); + } + for(let i in titarr){ + var tit = "第" + titarr[i] + "日"; + titdata.push(tit); + } + }else { + for(let i in data['days']){ + var tit = "第" + i + "日"; + titdata.push(tit); + } } titdata.unshift("日期",data.title); + console.log(titdata); + console.log(tabledata); var dataArr = { titledata:titdata, condata:tabledata, @@ -774,7 +825,7 @@ var X = window.X || { }; X.retentionchart = function(d,callback){ - var nname,pname + var nname,pname,wowtype="",chain_ratiotype=""; if(d.retentiontype == 0) { nname = 'n'; pname = 'p'; @@ -845,6 +896,22 @@ var X = window.X || { } } + + if(d['wow']){ + if(d['wow'] >= 0){ + wowtype = '+' + }else{ + wowtype = '-' + } + } + + if(d['chain_ratio']){ + if(d['chain_ratio'] >= 0){ + chain_ratiotype = '+' + }else{ + chain_ratiotype = '-' + } + } var dataArr = { xAxisData:xAxisData, @@ -854,6 +921,8 @@ var X = window.X || { sum:sum.toFixed(2), mean:mean, sameday: sameday, + wowtype:wowtype, + chain_ratiotype:chain_ratiotype, retentiontype:d.retentiontype } // console.log(dataArr); diff --git a/web/srczip/logic/retained.js b/web/srczip/logic/retained.js index 6f73b9e..c477137 100644 --- a/web/srczip/logic/retained.js +++ b/web/srczip/logic/retained.js @@ -4,6 +4,7 @@ X.template("grouped","shushi"); // X.template("toptab","analysis-zhanwei",X.DATA['projectarr']); + var data ={ "eventView":{ "cksql":"retention", @@ -16,7 +17,9 @@ "startTime":"2021-05-09 00:00:00", "statType":"retention", "timeParticleSize":"P1D", - "unitNum":7 + "unitNum":7, + "filter_item_type":'all', + "filter_item":[] }, "events":[ @@ -31,6 +34,9 @@ } }; + // 重新渲染控件 + layui.form.render(); + // 日期渲染 X.daterender("#retained-condition-date",function(start, end, label){ var startTime = start.format('YYYY-MM-DD')+ " "+ "00:00:00"; @@ -566,6 +572,29 @@ //数据报表渲染 function retainedtable(d){ var nname,pname + + if(data['eventView']['filter_item_type'] != "all"){ + var filteritem = data['eventView']['filter_item']; + if(d['days'].length >= 7){ + var filterarr = []; + for(let i in d['days']){ + for(let j in filteritem){ + if(d['days'][i] == filteritem[j]){ + filterarr.push(i); + } + } + } + } + // var titarr = []; + // var tablearr = []; + // for(let i in filterarr){ + // var index = Number(filterarr[i]) + 2; + // titarr.push(titdata[index]); + // } + // titarr.unshift(titdata[0],titdata[1]); + // console.log(titarr); + } + if(retentiontype == 0) { nname = 'n'; pname = 'p'; @@ -585,20 +614,48 @@ n:0, p:0 } - nrr["n"] = d['summary_values'][i][nname][j]; - nrr["p"] = d['summary_values'][i][pname][j] - arr['data'].push(nrr); + if(data['eventView']['filter_item_type'] != "all"){ + for(let a in filterarr){ + var index = Number(filterarr[a]); + if(j == index){ + nrr["n"] = d['summary_values'][i][nname][j]; + nrr["p"] = d['summary_values'][i][pname][j] + arr['data'].push(nrr); + } + } + }else { + nrr["n"] = d['summary_values'][i][nname][j]; + nrr["p"] = d['summary_values'][i][pname][j] + arr['data'].push(nrr); + } } tabledata.push(arr) } var titdata = []; - for(let i in d['days']){ - var tit = "第" + i + "日"; - titdata.push(tit); + if(data['eventView']['filter_item_type'] != "all"){ + var titarr = []; + for(let j in filterarr){ + var index = Number(filterarr[j]); + titarr.push(d['days'][index]); + } + for(let i in titarr){ + var tit = "第" + titarr[i] + "日"; + titdata.push(tit); + } + }else { + for(let i in d['days']){ + var tit = "第" + i + "日"; + titdata.push(tit); + } } titdata.unshift("日期",d.title); - // X.fixedTable=function(id,type,classname,headdata){ + console.log(titdata); + + + // X.fixedTable('table-div-box','row-col-fixed','',headdata); + + X.laytpldata("#table-fenxi-th-dot",titdata,".table-fenxi-th"); X.laytpldata("#table-fenxi-td-dot",tabledata,".table-fenxi-td"); }; @@ -826,6 +883,70 @@ } }); + //显示设置 + $(document).off('click','.analtsis-condition').on('click','.analtsis-condition',function(){ + var obj = $(this); + var offset = obj.offset(); + // offset.left,offset.top+obj.height() + $(".showsetup-box").show(); + $(".showsetup-down-box").css('top',offset.top+obj.height()); + $(".showsetup-down-box").css('left',offset.left-211); + }); + + $(document).off('click','.showsetup-box-zz').on('click','.showsetup-box-zz',function(){ + $(".showsetup-box").hide(); + }); + + layui.form.on('radio(showsetup)', function(val){ + if(val.value == 'date'){ + $(".showsetup-edit").show(); + $(".showsetup-bianji-show-box-type").show(); + var value = $(".showsetup-bianji-input-box textarea").val(); + var valarr = value.split(','); + valarr.sort(function(a, b){return a - b}); + var listarr = unique(valarr); + data['eventView']['filter_item'] = listarr; + X.laytpldata("#showsetup-bianji-show-box-dot",listarr,".showsetup-bianji-show-box"); + }else { + $(".showsetup-edit").hide(); + $(".showsetup-wancheng").hide(); + $(".showsetup-bianji-show-box-type").hide(); + $(".showsetup-bianji-input-box-type").hide(); + + } + data['eventView']['filter_item_type'] = val.value; + if(querydata){ + retainedtable(querydata) + } + }); + + $(document).off('click','.showsetup-edit').on('click','.showsetup-edit',function(){ + $(".showsetup-edit").hide(); + $(".showsetup-wancheng").show(); + $(".showsetup-bianji-show-box-type").hide(); + $(".showsetup-bianji-input-box-type").show(); + }); + + $(document).off('click','.showsetup-wancheng').on('click','.showsetup-wancheng',function(){ + $(".showsetup-edit").show(); + $(".showsetup-wancheng").hide(); + $(".showsetup-bianji-show-box-type").show(); + $(".showsetup-bianji-input-box-type").hide(); + var value = $(".showsetup-bianji-input-box textarea").val(); + var valarr = value.split(','); + valarr.sort(function(a, b){return a - b}); + var listarr = unique(valarr); + data['eventView']['filter_item'] = listarr; + X.laytpldata("#showsetup-bianji-show-box-dot",listarr,".showsetup-bianji-show-box"); + if(querydata){ + retainedtable(querydata) + } + }); + + function unique (arr) { + return Array.from(new Set(arr)) + } + } }; })(); \ No newline at end of file diff --git a/web/srczip/logic/savereport.js b/web/srczip/logic/savereport.js index 792afdb..8b899bd 100644 --- a/web/srczip/logic/savereport.js +++ b/web/srczip/logic/savereport.js @@ -28,8 +28,6 @@ desc:tabval['desc'], query:data['query'], report_id:data['_id'] - // project_id:X.DATA.projectid, - // cat: data['query']['eventView']['cksql'] } X.api('report/edit','post',arr,function(d){ layer.msg(d); diff --git a/web/static/css/analysis.css b/web/static/css/analysis.css index dac057e..2ace947 100644 --- a/web/static/css/analysis.css +++ b/web/static/css/analysis.css @@ -324,3 +324,19 @@ .to-added-baobiao { height: calc(100% - 65px); padding: 4px; overflow-x: hidden; overflow-y: auto; } +/* 显示设置 */ +.showsetup-box { display: none; } +.showsetup-box-zz { width: 100%; height: 100%; position: fixed; left: 0; top: 0; background-color: rgba(255,255,255,0); } +.showsetup-down-box { width: 280px; padding: 8px 0; overflow: auto; position: fixed; background-color: #fff; border-radius: 2px; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15); } +.showsetup-radio-box { padding: 0 16px; } +.showsetup-radio-box i{ font-size: 13px !important; } +.showsetup-bianji { position: absolute; right: 20px; top: 50px; color:#3d90ff; font-size: 14px; cursor: pointer; } +.showsetup-bianji-show-box { display: flex; flex-wrap: wrap; padding: 16px 0 0 10px; border-top: 1px solid #eef1f7; } +.showsetup-bianji-show-box div { display: flex; align-items: center; justify-content: center; min-width: 72px; height: 24px; margin-right: 16px; margin-bottom: 16px; color: #96989b; border: 1px solid #e0e3e7; border-radius: 2px; } +.showsetup-bianji-show-box-type { display: none; } +.showsetup-bianji-input-box-type { display: none; } +.showsetup-bianji-input-box { padding: 10px 16px 0; border-top: 1px solid #eef1f7; } +.showsetup-bianji-input-box textarea { max-width: calc(100% - 16px); height: auto; width: calc(100% - 16px); min-height: 32px; padding: 0 8px; color: #42546d; font-size: 14px; line-height: 24px; border: 1px solid #f0f0f0; border-radius: 2px; resize: none; } +.showsetup-wancheng { display: none; } +.showsetup-edit { display: none; } +