leguadmin/xfrontend
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

修改样式问题，添加超大图展示

Browse Source
This commit is contained in:
罗松柏 2022-05-31 20:06:53 +08:00
parent 19a660067e
commit a0f960628f
7 changed files with 153 additions and 53 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
web/pages/dashboard.html
View File

@ -660,7 +660,7 @@
{{# if(d.graph_type === "table"){ }} {{# if(d.graph_type === "table"){ }}
{{# if(d.graph_size === "large"){ }} {{# if(d.graph_size === "large" || d.graph_size === "oversize"){ }}
<div class="layui-col-md12 layui-col" id="model{{d.report_id}}"> <div class="layui-col-md12 layui-col" id="model{{d.report_id}}">
{{# } else { }} {{# } else { }}
<div class="layui-col-md6 layui-col" id="model{{d.report_id}}"> <div class="layui-col-md6 layui-col" id="model{{d.report_id}}">
@ -698,7 +698,7 @@
</div> </div>
{{# } else { }} {{# } else { }}
{{# if(d.graph_size === "large"){ }} {{# if(d.graph_size === "large" || d.graph_size === "oversize"){ }}
<div class="layui-col-md12 layui-col" id="model{{d.report_id}}"> <div class="layui-col-md12 layui-col" id="model{{d.report_id}}">
{{# } else { }} {{# } else { }}
<div class="layui-col-md6 layui-col" id="model{{d.report_id}}"> <div class="layui-col-md6 layui-col" id="model{{d.report_id}}">

170
web/pages/modeltable.html
View File

@ -30,7 +30,7 @@
{{# } else { }} {{# } else { }}
{{# if(d.modeltype === "table"){ }} {{# if(d.modeltype === "table" && d.modelsize !== "oversize"){ }}
<div class="table-box"> <div class="table-box">
<div class="table-tbody-box" id="table-tbody-box-{{d.id}}"> <div class="table-tbody-box" id="table-tbody-box-{{d.id}}">
@ -201,61 +201,145 @@
</div> </div>
{{# } else { }} {{# } else if(d.modeltype === "table" && d.modelsize === "oversize") { }}
{{# if(d.cat != "user_property" && d.cat != "scatter" && d.cat != "trace"){ }} <div class="table-box" style="height: 690px;">
<div class="table-tbody-box" id="table-tbody-box-{{d.id}}" style="height: 690px;">
<div class="data-box"> <div class="table_box_big" style="height: 690px;">
<div style="display: flex; align-items: center;"> <div class="table_box">
{{# if(d.daydata != false ){ }} <div class="table_tbody_box big_table_tbody_box" style="height: 690px;">
<div class="data-num">{{d.sameday}}<span></span></div>
{{# } }} <table id="dataTableMul{{d.id}}" class="table table-bordered table-fenxi-box">
<div class="proportion"> <thead>
{{# if(d.chain_ratiotype != ''){ }} <tr>
{{# if(d.chain_ratiotype == '+'){ }} {{# layui.each(d.titledata, function(indexs, items) { }}
<div class="proportion-data">较环比 <div class="sanjiao"></div><span>{{d.chain_ratio}}%</span></div> <th>{{items}}</th>
{{# } else { }} {{# }); }}
<div class="proportion-data">较环比 <div class="sanjiao fu"></div><span class="funum">{{d.chain_ratio}}%</span></div> </tr>
{{# } }} </thead>
{{# } }}
{{# if(d.wowtype != ''){ }} <tbody class="table-fenxi-td">
{{# if(d.wowtype == "+"){ }} {{# if(d.cat === "event"){ }}
<div class="proportion-data">较同比 <div class="sanjiao"></div><span>{{d.wow}}%</span></div> {{# layui.each(d.condata, function(indexs, items) { }}
{{# } else { }} <tr>
<div class="proportion-data">较同比 <div class="sanjiao fu"></div><span class="funum">{{d.wow}}%</span></div> {{# layui.each(items, function(indexss, itemss) { }}
{{# } }} <td title="{{itemss}}">{{itemss}}</td>
{{# } }} {{# }); }}
</tr>
{{# }); }}
{{# } else if( d.cat == "scatter"){ }}
{{# layui.each(d.condata, function(indexs, items) { }}
<tr >
<td>{{items.date}}</td>
<td>{{items.d0}}</td>
{{# layui.each(items.data, function(indexss, itemss){ }}
<td>
<p>{{itemss.n}}</p>
<p>{{itemss.p}}</p>
</td>
{{# }); }}
</tr>
{{# }); }}
{{# } else if(d.cat === "retention"){ }}
{{# layui.each(d.condata, function(indexs, items) { }}
<tr >
<td>{{items.date}}</td>
<td>{{items.d0}}</td>
{{# layui.each(items.data, function(indexss, itemss){ }}
<td>
{{# if(itemss.p == '-'){ }}
<p>{{itemss.p}}</p>
{{# } else { }}
<p>{{itemss.p}}%</p>
{{# } }}
</td>
{{# }); }}
</tr>
{{# }); }}
{{# } else if(d.cat === "ltv"){ }}
{{# layui.each(d.condata, function(indexs, items) { }}
<tr >
{{# layui.each(items, function(indexss, itemss){ }}
<td title="{{itemss}}">{{itemss}}</td>
{{# }); }}
</tr>
{{# }); }}
{{# } else if(d.cat === "user_property"){ }}
{{# layui.each(d.condata, function(indexs, items) { }}
<tr>
<td>{{indexs}}</td>
<td>{{items}}</td>
</tr>
{{# }); }}
{{# } }}
</tbody>
</table>
</div>
</div>
</div> </div>
</div> </div>
{{# if(d.avesumdata != false ){ }}
<div class="thesum"> </div>
<div class="thesum-box">
{{# if(d.sum != -1){ }} {{# } else { }}
<div class="thesum-data">总和 <span>{{d.sum}}</span></div> {{# if(d.cat != "user_property" && d.cat != "scatter" && d.cat != "trace"){ }}
<div class="data-box">
<div style="display: flex; align-items: center;">
{{# if(d.daydata != false ){ }}
<div class="data-num">{{d.sameday}}<span></span></div>
{{# } }}
<div class="proportion">
{{# if(d.chain_ratiotype != ''){ }}
{{# if(d.chain_ratiotype == '+'){ }}
<div class="proportion-data">较环比 <div class="sanjiao"></div><span>{{d.chain_ratio}}%</span></div>
{{# } else { }}
<div class="proportion-data">较环比 <div class="sanjiao fu"></div><span class="funum">{{d.chain_ratio}}%</span></div>
{{# } }}
{{# } }} {{# } }}
{{# if(d.mean != -1){ }} {{# if(d.wowtype != ''){ }}
<div class="thesum-data">均值 <span>{{d.mean}}</span></div> {{# if(d.wowtype == "+"){ }}
<div class="proportion-data">较同比 <div class="sanjiao"></div><span>{{d.wow}}%</span></div>
{{# } else { }}
<div class="proportion-data">较同比 <div class="sanjiao fu"></div><span class="funum">{{d.wow}}%</span></div>
{{# } }}
{{# } }} {{# } }}
</div> </div>
</div> </div>
{{# if(d.avesumdata != false ){ }}
<div class="thesum">
<div class="thesum-box">
{{# if(d.sum != -1){ }}
<div class="thesum-data">总和 <span>{{d.sum}}</span></div>
{{# } }}
{{# if(d.mean != -1){ }}
<div class="thesum-data">均值 <span>{{d.mean}}</span></div>
{{# } }}
</div>
</div>
{{# } }}
</div>
{{# } }} {{# } }}
</div>
{{# } }}
<div class="echarts-box">
{{# if(d.daydata != false && d.avesumdata != false){ }}
<div id="{{d.id}}" class="echarts"></div>
{{# } else { }}
<div id="{{d.id}}" class="echarts2"></div>
{{# } }}
</div>
<div class="echarts-box">
{{# if(d.daydata != false && d.avesumdata != false){ }}
<div id="{{d.id}}" class="echarts"></div>
{{# } else { }}
<div id="{{d.id}}" class="echarts2"></div>
{{# } }}
</div>
{{# } }} {{# } }}
{{# } }} {{# } }}
</script> </script>

4
web/pages/setupbaobiao.html
View File

@ -167,6 +167,9 @@
<div style="margin-left: 20px;"> <div style="margin-left: 20px;">
<input type="radio" name="modelsize" value="large" id="setupbaobiao-large">大图 <input type="radio" name="modelsize" value="large" id="setupbaobiao-large">大图
</div> </div>
<div style="margin-left: 20px;">
<input type="radio" name="modelsize" value="oversize" id="setupbaobiao-oversize">超大图
</div>
</div> </div>
</div> </div>
</div> </div>
@ -174,6 +177,7 @@
<p class="setupbaobiao-zs">小图：只展示最核心数据，适用于定位核心数据数值</p> <p class="setupbaobiao-zs">小图：只展示最核心数据，适用于定位核心数据数值</p>
<p class="setupbaobiao-zs">中图：根据图表类型展示，使用于快速浏览图表信息</p> <p class="setupbaobiao-zs">中图：根据图表类型展示，使用于快速浏览图表信息</p>
<p class="setupbaobiao-zs">大图：根据图表类型展示，适用于细致观察图表信息</p> <p class="setupbaobiao-zs">大图：根据图表类型展示，适用于细致观察图表信息</p>
<p class="setupbaobiao-zs">超大图：根据图表类型展示，适用于细致观察图表信息</p>
</div> </div>
</div> </div>

8
web/src/x.min.js vendored
View File

@ -143,8 +143,8 @@ var X = window.X || {
// var ipurl = "http://10.0.0.94:7899/api/v1/"; // var ipurl = "http://10.0.0.94:7899/api/v1/";
// 线上 // 线上
var ipurl = "http://139.159.159.3:9865/api/v1/"; var ipurl = "http://139.159.159.3:9865/api/v1/";
//线上测试 //线上测试
// var ipurl = "http://139.159.159.3:7889/api/v1/"; // var ipurl = "http://139.159.159.3:7889/api/v1/";
//设置或读取登录缓存，需要保存到localStorage，防止刷新时候登录数据丢失 //设置或读取登录缓存，需要保存到localStorage，防止刷新时候登录数据丢失
X.loginCache = function(data){ X.loginCache = function(data){
@ -14796,8 +14796,10 @@ var X = window.X || {
$("#setupbaobiao-in").prop("checked",true); $("#setupbaobiao-in").prop("checked",true);
}else if( data.modelsize == 'small' ){//小图 }else if( data.modelsize == 'small' ){//小图
$("#setupbaobiao-small").prop("checked",true); $("#setupbaobiao-small").prop("checked",true);
}else{//大图 }else if( data.modelsize == 'large' ){//大图
$("#setupbaobiao-large").prop("checked",true); $("#setupbaobiao-large").prop("checked",true);
}else {
$("#setupbaobiao-oversize").prop("checked",true);
} }
//初始化xy轴切换 //初始化xy轴切换
if(data.modelswitch && data.modelswitch != "undefined" && data.modelswitch == "true"){ if(data.modelswitch && data.modelswitch != "undefined" && data.modelswitch == "true"){

4
web/srczip/logic/setupbaobiao.js
View File

@ -32,8 +32,10 @@
$("#setupbaobiao-in").prop("checked",true); $("#setupbaobiao-in").prop("checked",true);
}else if( data.modelsize == 'small' ){//小图 }else if( data.modelsize == 'small' ){//小图
$("#setupbaobiao-small").prop("checked",true); $("#setupbaobiao-small").prop("checked",true);
}else{//大图 }else if( data.modelsize == 'large' ){//大图
$("#setupbaobiao-large").prop("checked",true); $("#setupbaobiao-large").prop("checked",true);
}else {
$("#setupbaobiao-oversize").prop("checked",true);
} }
//初始化xy轴切换 //初始化xy轴切换
if(data.modelswitch && data.modelswitch != "undefined" && data.modelswitch == "true"){ if(data.modelswitch && data.modelswitch != "undefined" && data.modelswitch == "true"){

2
web/static/css/analysis.css
View File

@ -305,7 +305,7 @@
.table-fenxi-box { width: 100%; } .table-fenxi-box { width: 100%; }
.table-fenxi-box th { background-color: #f0f2f5; min-width: 100px; max-width: 200px; padding: 10px 16px; color: #202d3f; font-size: 13px; font-weight: 400; border-right: 1px solid #e6e6e6; border-bottom: 1px solid #f0f2f5; } .table-fenxi-box th { background-color: #f0f2f5; min-width: 100px; max-width: 200px; padding: 10px 16px; color: #202d3f; font-size: 13px; font-weight: 400; border-right: 1px solid #e6e6e6; border-bottom: 1px solid #f0f2f5; }
.table-fenxi-box tr { text-align: center; border-left: 1px solid #e6e6e6; } .table-fenxi-box tr { text-align: center; border-left: 1px solid #e6e6e6; }
.table-fenxi-box tr td{ min-width: 120px; max-height: 200px; width: 150px; max-width: 120px; padding: 10px 16px; color: #202d3f; font-size: 13px; font-weight: 400; border: 1px solid #e6e6e6; word-wrap:break-word; .table-fenxi-box tr td{ min-width: 120px; max-height: 200px; width: 150px; max-width: 120px; padding: 7px 16px; color: #202d3f; font-size: 13px; font-weight: 400; border: 1px solid #e6e6e6; word-wrap:break-word;
/* white-space:pre-wrap; */ /* white-space:pre-wrap; */
} }

10
web/static/css/style.css
View File

@ -24,7 +24,7 @@
.controlhover:hover > .control { display: block; } .controlhover:hover > .control { display: block; }
/* .layui-card { min-height: 388px; } */ /* .layui-card { min-height: 388px; } */
.modify-layui-card-small { height: 186px; } .modify-layui-card-small { height: 186px; }
.modify-layui-card { height: 388px; } .modify-layui-card { min-height: 388px; }
.layui-laydate .layui-this { background-color: rgba(89, 120, 249, 1) !important; } .layui-laydate .layui-this { background-color: rgba(89, 120, 249, 1) !important; }
.layui-laypage-em { background-color: #3d90ff !important; } .layui-laypage-em { background-color: #3d90ff !important; }
.layui-table-cell { height: auto; } .layui-table-cell { height: auto; }
@ -875,6 +875,13 @@ label:not(.form-check-label):not(.custom-file-label) { font-weight: 400; }
max-height: 300px; max-height: 300px;
max-width: 100%; max-width: 100%;
} }
.big_table_tbody_box .table-view {
position: relative;
overflow: auto;
box-shadow: 0px 1px 1px #dad8d8;
max-height: 690px;
max-width: 100%;
}
.table-head-fixed { .table-head-fixed {
position: absolute; position: absolute;
@ -1080,6 +1087,7 @@ input.editable-select {
} }
.table-view .table-striped th, .table-view .table-striped td { .table-view .table-striped th, .table-view .table-striped td {
height: 45px !important; height: 45px !important;
max-width: 157px;
} }
.userinfo-left-box { .userinfo-left-box {
width: 270px; width: 270px;