xfrontend/web/pages/retained.html

<!-- 留存分析 -->
<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 download-table" 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">
            <!-- 伸缩按钮 -->
            <div class="analysis-con-left-shrink"></div>

            <div class="root___2a4tb">

                <div class="block___2n0We">
                    <div class="analysis-con-left-title">初始事件</div>
                    <div class="analysis-con-left-screen-list-box" id="initial-event">
                        
                    </div>
                </div>

                <div class="block___2n0We">
                    <div class="analysis-con-left-title">回访事件</div>
                    <div class="analysis-con-left-screen-list-box" id="returnvisit-event">
                        
                    </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">
                            <img src="./static/img/fenzu.png">
                            添加分组项
                        </span>
                    </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 class="analtsis-condition analtsis-timeParticleSize">7天</div> -->
                            <div class="analtsis-condition retention-loss">留存</div>
                        </div>

                        <div class="analtsis-condition-right-box">
                            <!-- <div class="analtsis-condition">指标</div> -->
                            <div class="analtsis-condition analtsis-condition-xssz" >显示设置</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="第N日留存"> <i class="iconfont" style="font-size: 18px; ">&#xe601;</i> </div>
                                <!-- <div class="analtsis-chart-switch" title="每日留存"> <i class="iconfont" style="font-size: 18px; ">&#xe601;</i> </div> -->
                            </div>
                        </div>

                    </div>

                    <div class="chawushuj" style="display: none;">
                        <img src="./static/img/wushujv3.png">
                    </div>
                    <!-- 统计图 -->
                    <div class="analysis-echarts" id="analysis-echarts" style="display: none;"></div>

                    <div class="table-div-box" id="table-div-box">
                        <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>

<div class="showsetup-box">
    <div class="showsetup-box-zz"></div>
    <div class="showsetup-down-box">
        <form class="layui-form" action="" lay-filter="showsetupexample">
            <div class="showsetup-radio-box">
                <input type="radio" name="showsetup" value="all" title="全部显示" checked="" lay-filter="showsetup">
            </div>
            <div class="showsetup-radio-box">
                <input type="radio" name="showsetup" value="date" title="仅显示关键日期" lay-filter="showsetup">
            </div>
            <span class="showsetup-bianji showsetup-edit">编辑</span>
            <span class="showsetup-bianji showsetup-wancheng">完成</span>
            
            <div class="showsetup-bianji-show-box-type">
                <div class="showsetup-bianji-show-box">
                    
                </div>
            </div>
            
            <div class="showsetup-bianji-input-box-type">
                <div class="showsetup-bianji-input-box">
                    <textarea rows="2" placeholder="多数值之间请用逗号分隔,当日输入0">0,1,7,14,30</textarea>
                </div>
            </div>

        </form>
    </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.date}}</td>
        <td>{{item.d0}}</td>
        {{#  layui.each(item.data, function(indexs, items){ }}
        <td>
            <p>{{items.n}}</p>
            <p>{{items.p}}%</p>
        </td>
        {{#  }); }}
    </tr>
    {{#  }); }}
</script>

<script id="showsetup-bianji-show-box-dot" type="text/html">
    {{#  layui.each(d, function(index, item){ }}
        {{#  if(item == "0"){ }}
            <div>当日</div>
        {{#  } else { }}
            <div> {{item}}日 </div>
        {{#  } }}
    {{#  }); }}
</script>