xfrontend/web/pages/attribute.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-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 analysis-navigation-bar-right-img-baobiao" title="报表">
                <img src="./static/img/baobiao2.png">
            </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">
                        <!-- <div class="participate-box">事件</div> -->
                        <div class="analysis-con-left-screen-list">
                            <!-- 指标选择 -->
                            <div class="analysis-con-left-screen-list-left-box">
                                <div class="analysis-con-left-screen-list-left-zhibiaoname">
                                    <input type="text" placeholder="请输入指标名" class="analysis-con-left-screen-list-left-zhibiaoname-txt"/>
                                </div>
                                <div class="analysis-con-left-screen-list-left" style="margin-left: 23px;">
                                    <div class="analysis-zhibiao-list">
                                        <div class="ant-dropdown-trigger analysis-zhibiao-list-type1 analysis-background"></div>
                                        <div class="analysis-choicetypename analysis-zhibiao-list-type1 analysis-background"></div>
                                    </div>
                                </div> 
                            </div>
                            <div class="analysis-con-left-screen-list-right-box">
                                <div class="analysis-con-left-screen-list-right">
                                    <div class="analysis-chongmingming" title="重命名指标"></div>
                                    <div class="analysis-chongmingming-del" title="取消重命名"></div>
                                </div>
                            </div>
                        </div>
                    </div>

                    <div class="eventsplit-box">
                        

                    </div>

                </div>

                <div class="block___2n0We">
                    <div class="analysis-con-left-title"> <span>分组项</span> <span class="eventsplit"> 人群对比</span> </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 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>

            <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="attribute-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="attribute-echarts" style="height: 400px;"></div>

                    <div class="table-div-box" style="height: 100%; margin-top: 16px;">
                        <table class="table-fenxi-box">
                            <thead>
                            <tr class="table-attrbute-th">
                                
                            </tr> 
                            </thead>
                            <tbody class="table-attrbute-td">
                            
                               
                            </tbody>
                        </table>
                    </div>
                </div>

            </div>
        </div>
    </div>

</div>

<!-- <script id="eventsplit-box-dot" type="text/html">
    {{#  layui.each(d, function(index, item){ }}
        <div class="action-row">
            <div class="action-left">
                <div class="ant-select-selector2 route-ant-select-selector1" data-index="{{index}}"> {{item.eventDesc}} </div>
                <span class="word___2ZSA5"> 按 </span>
                <div class="ant-select-selector2 route-ant-select-selector2" data-index="{{index}}"> {{item.fieDesc}} </div>
                <div class="analysis-ta-property-range analysis-granularity userevent-granularity" data-index="{{index}}"> <img src="./static/img/shezhi2.png"> </div>
                <span class="word___2ZSA5">拆分</span>
            </div>
            <div class="action-right route-action-right" data-index="{{index}}">
                <img src="./static/img/del.png">
            </div>
        </div>
    {{#  }); }}
</script> -->

<script id="table-attrbute-th-dot" type="text/html">
    {{#  layui.each(d, function(index, item){ }}
        <th>{{item}}</th>
    {{#  }); }}
</script>

<script id="table-attrbute-td-dot" type="text/html">
    {{#  layui.each(d, function(index, item){ }}
    <tr >
        <td>{{index}}</td>
        <td>{{item}}</td>
    </tr>
    {{#  }); }}
</script>