xfrontend/web/pages/funnelanalysis.html
2022-08-18 23:27:06 +08:00

251 lines
9.9 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!-- 留存分析 -->
<div class="analysis-zhanwei">
</div>
<div class="analysis-navigation-bar-box">
<div class="analysis-navigation-bar">
<div class="analysis-navigation-bar-left">
<span>漏斗分析</span><img src="./static/img/capytishi.png" title="分析某段时间内,某个事件或事件属性的整体趋势情况" />
</div>
<div class="analysis-navigation-bar-right">
<div class="analysis-navigation-bar-right-jisuan">
<!-- <span>TA用户ID</span> -->
</div>
<div class="analysis-navigation-bar-right-img" title="最后更新时间2021-04-29 14:44:39">
<img src="./static/img/gengxin.png">
</div>
<div class="analysis-navigation-bar-right-img sqlquery" title="查看条件代码">
<i class="iconfont" style="font-size: 18px; color: #67729d;">&#xe727;</i>
</div>
<div class="analysis-navigation-bar-right-img" title="以页面格式下载全量数据">
<img src="./static/img/xiazai.png">
</div>
<div class="analysis-navigation-bar-right-img analysis-navigation-bar-right-img-baobiao" title="报表">
<img src="./static/img/baobiao2.png">
</div>
<div class="analysis-navigation-bar-right-img analysis-fanhui" title="返回">
<img src="./static/img/fanhui.png">
<span>返回</span>
</div>
</div>
</div>
<div class="analysis-bg">
<!-- 左侧条件筛选区域 -->
<div class="analysis-con-left" style=" position: relative; ">
<!-- 伸缩按钮 -->
<div class="analysis-con-left-shrink"></div>
<form class="layui-form" action="" lay-filter="funnelanalysis-example">
<div class="layui-form-item" style=" position: absolute; right: 10px; top: 10px;">
<label class="layui-form-label" style="padding: 0 15px;">开关</label>
<div class="layui-input-block">
<input type="checkbox" checked="" name="open" lay-skin="switch" lay-filter="switchTest">
</div>
</div>
</form>
<div class="root___2a4tb ">
<div class="funnelanalysis-screen-box">
<div class="block___2n0We">
<div class="analysis-con-left-title">
漏斗步骤
</div>
<div class="analysis-con-left-screen-list-box" id="funnel-event">
</div>
<div class="analysis-foot___P797w">
<span class="funnel-updataevent">
<img src="./static/img/fenzu.png">
添加步骤指标
</span>
</div>
</div>
<div class="block___2n0We analysis-overall" style="display: block;">
<div class="analysis-con-left-title">全局筛选</div>
<div class="analysis-con-left-screen-box">
<div class="analysis-overall-situation-box">
<div class="analysis-overall-situation-left-box">
<div class="analysis-overall-situation-left-xian"></div>
<div class="analysis-overall-situation-left-guanxi"></div>
</div>
<div class="analysis-overall-situation-list-box" id="xinwei-whole">
</div>
</div>
<div class="analysis-foot___P797w">
<span class="analysis-overall-situation-add">
<img src="./static/img/fenzu.png">
添加条件
</span>
</div>
</div>
</div>
<div class="block___2n0We">
<div class="analysis-con-left-title">分组项</div>
<div class="analysis-con-left-screen-box" id="shushi">
</div>
<div class="analysis-foot___P797w">
<span class="analysis-footadd___2D4YB group-updata">
<img src="./static/img/fenzu.png">
添加分组项
</span>
</div>
</div>
<div class="block___2n0We">
<div class="analysis-con-left-title">分析窗口期</div>
<div class="analysis-con-left-screen-box">
<div class="analtsis-condition analtsis-timeParticleSize windows_gap">7天</div>
</div>
</div>
</div>
<div class="single-box" style="display: none;">
<div class="block___2n0We ">
<div class="analysis-con-left-title">
漏斗步骤
</div>
<div class="analysis-con-left-screen-list-box">
<div class="analysis-con-left-screen-list">
<div class="analysis-con-left-screen-list-left-box">
<div class="analysis-con-left-screen-list-left">
<div class="analysis-num">0</div>
<div class="analysis-zhibiao-list">
<div class="ant-dropdown-trigger analysis-zhibiao-list-type1 analysis-background single-eventName"
data-index="0"> </div>
</div>
<span style="margin-left: 6px;"></span>
<div
class="analysis-zhibiao-list-type2 analysis-background single-analysisDesc">
总次数
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="analysis-but-box">
<div class="analysis-savereport">保存报表</div>
<div class="analysis-calculation">计 算</div>
</div>
</div>
<!-- 右边图表显示区域 -->
<div class="analysis-con-right">
<div class="analtsis-con-box">
<div class="analtsis-con-right-box">
<div class="analtsis-con-right-top-title">
玩法参与情况
</div>
<div class="analtsis-condition-box">
<div class="analtsis-time-box">
<div class="analtsis-condition"> <input id="retained-condition-date"
readonly="readonly"></input> </div>
</div>
<div class="analtsis-condition-right-box">
<!-- <div class="analtsis-condition">指标</div>
<div class="analtsis-condition">分组</div> -->
<div class="analtsis-chart-switch-box">
<div class="analtsis-chart-switch select-chart" title="转化图"> <i class="iconfont"
style="font-size: 18px; ">&#xe670;</i> </div>
<div class="analtsis-chart-switch " title="趋势图"> <i class="iconfont"
style="font-size: 18px; ">&#xe601;</i> </div>
</div>
</div>
</div>
<!-- 统计图 -->
<div class="analysis-echarts" id="funnel-echarts"></div>
<div class="table-div-box" style="height: 100%; margin-top: 16px;">
<table class="table-fenxi-box">
<thead>
<tr class="table-fenxi-th">
</tr>
</thead>
<tbody class="table-fenxi-td">
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</div>
<script id="table-fenxi-th-dot" type="text/html">
{{# layui.each(d, function(index, item){ }}
{{# if(item == "第0日"){ }}
<th>当日</th>
{{# } else { }}
<th>{{item}}</th>
{{# } }}
{{# }); }}
</script>
<script id="table-fenxi-td-dot" type="text/html">
{{# layui.each(d, function(index, item){ }}
<tr >
<td>{{item.title}}</td>
{{# layui.each(item.data, function(indexs, items){ }}
<td>
<p>{{items.n}}</p>
<p>{{items.p}}%</p>
</td>
{{# }); }}
</tr>
{{# }); }}
</script>
<script id="table-fenxi-th-single-dot" type="text/html">
{{# layui.each(d, function(index, item){ }}
<th>{{item}}</th>
{{# }); }}
</script>
<script id="table-fenxi-td-single-dot" type="text/html">
{{# layui.each(d, function(index, item){ }}
<tr >
{{# layui.each(item, function(indexs, items){ }}
<td>
<p>{{items}}</p>
</td>
{{# }); }}
</tr>
{{# }); }}
</script>