<html>
<head>
    <meta charset="utf-8">
    <title>关注的公众号</title>
    <link rel="stylesheet" href="../../assest/plugins/bootstrap/css/bootstrap.css"/>
    <link rel="stylesheet" type="text/css" href="../../assest/css/win.css"/>
    <link rel="stylesheet" type="text/css" href="../../assest/plugins/font-awesome/css/font-awesome.min.css">
    <link rel="stylesheet" type="text/css" href="./custom_follow.css">
</head>
<body>
<div class="page-container">
    <div class="page-border">
        <div id="my-follow">
            <div class="layout-left">
                <div class="my-follow-left-menu" v-sticky="{trigger: 0, bottom: 0}">
                    <div class="my-follow-left-menu-tit">关注的公众号文章 <i title="刷新" v-on="click:refreshPage()" class="fa fa-refresh"></i> </div>
                    <div class="my-follow-left-menu-search">
                        <div class="my-follow-left-menu-search-input">
                            <input type="text" placeholder="公众号名称" v-model="leftKey"/>

                            <div class="del" v-on="click:searchPublicNumHide()"></div>
                            <div class="icon-search" v-on="click:searchPublicNum()"></div>
                        </div>
                    </div>
                    <div class="" style="position:relative;">
                        <div class="my-follow-left-menu-list-all js-menu-list-all" style="display: none;" v-repeat="puclic_all_this:puclic_all" v-on="click:showAll()">
                            <div class="tit ">全部公众号(<span v-text="puclic_all_this.num"></span>)</div>
                        </div>
                        <div class="my-follow-left-menu-list" id="list_menu">
                            <ul class="my-follow-left-menu-list-public-group-ul">
                                <li class="my-follow-left-menu-list-public-group-li " id="{{data_i.group_id}}" v-repeat="data_i:leftData">
                                    <div class="tit {{data_i.open ? 'active' : ''}}" v-on="click: data_i.open = !data_i.open,click:data_i.arrow =!data_i.arrow,click:menuListShow(data_i)"><span v-text="data_i.group_name"></span>(<span v-text="data_i.gzh_num"></span>)</div>
                                    <ul class="my-follow-left-menu-list-public-ul {{data_i.open ? 'open' : ''}}">
                                        <li class="my-follow-left-menu-list-public-li clearfix" id="{{account_i.id}}" v-on="click:artilceOneShow(account_i)" v-repeat="account_i : data_i.accounts">
                                            <img v-attr="src:account_i.avatar" alt=""/>
                                            <div class="" v-text="account_i.name"></div>
                                        </li>
                                    </ul>
                                </li>
                            </ul>
                        </div>
                    </div>
                    <ul class="my-follow-left-menu-list-public-ul " id="list_search">
                        <li class="my-follow-left-menu-list-public-li clearfix" id="{{data_i.id}}" v-on="click:artilceOneShow(data_i)" v-repeat=" data_i: search_data">
                            <img v-attr="src:data_i.avatar" alt=""/>

                            <div class="" v-text="data_i.name"></div>
                        </li>
                    </ul>
                    <p id="resultNO" class="result-no" style="display:none;">没有找到相应的公众号</p>
                </div>
            </div>
            <div class="layout-right">
                <div class="page-title">
                    <h2><em v-text="rightTitle">全部公众号</em></h2>
                    <div class="right-top-btns">
                        <span v-on="click:addFollow()" class="btn btn-primary">添加关注</span>
                        <span v-on="click:followList()" class="btn btn-danger">管理关注的公众号</span>
                    </div>

                </div>

                <!--关注的公众号文章-->
                <div class="my-follow-article-all js-my-follow-article-all" v-if="article_tab">

                    <div class="content-header" v-sticky="{trigger: 57}">
                        <span class="content-header-left pull-left" v-on="click:headerShow()">
                            <span class="pull-left" style="margin-right: 15px;">只显示头条</span>
                            <span class=" switch-button {{is_first? 'on' : 'off'}}"></span>
                        </span>
                        <div class="content-header-right js-content-header-right">
                            <div class="time-choice" v-class="active:date_range==30" v-on="click:latelyTime(30)">最近30天</div>
                            <div class="time-choice" v-class="active:date_range==15" v-on="click:latelyTime(15)">最近15天</div>
                            <div class="time-choice" v-class="active:date_range==7" v-on="click:latelyTime(7)">最近7天</div>
                            <div class="time-choice" v-class="active:date_range==3" style="border-left: 1px solid #dbdbdb" v-on="click:latelyTime(3)">最近3天</div>
                        </div>
                    </div>

                    <table class="my-follow-article-all-table">
                        <thead v-sticky="{trigger: 124}">
                        <tr class="my-follow-article-all-table-header">
                            <th style="padding-left: 102px;">文章标题</th>
                            <th class="text-center" style="width: 100px;">微信名称</th>
                            <th class="text-center" style="width: 100px;">发布时间</th>
                            <th class="text-center" style="width: 100px;">更新时间</th>
                            <th class="text-center" style="width: 100px;"> 阅读数</th>
                            <th class="text-center" style="width: 80px;">类型</th>
                            <th class="text-center" style="width: 100px;">操作</th>
                        </tr>
                        </thead>
                        <tr v-repeat="article_i:article_all" id="{{article_i.id}}">
                            <td style="padding-left: 20px;"><a href="javascript:void(0);" v-on="click:openByOuter(article_i.article_url)" v-html="article_i.article_title"></a></td>
                            <td class="text-center" style="color: #999" ><a href="javascript:;" data-artid={{article_i.id}} class='show_art' >{{article_i.gzh_name}}</a></td>
                            <td class="text-center" style="color: #999" v-text="article_i.publish_time"></td>
                            <td class="text-center" style="color: #999" v-text="article_i.update_time"></td>
                            <td class="text-center" v-text="article_i.read_num"></td>
                            <td class="text-center">
                                <div class="td{{article_i.content_type}} br2"></div>
                            </td>
                            <td class="text-center">
                                <span class="add-btn" title="添加到素材合成器" v-on="click:clickAddMaterial(article_i, $event)">
                                    <i class="fa fa-plus-square"></i>
                                </span>
                                |
                                <span class="add-btn" title="添加到别的公众号" v-on="click:clickAddMaterialElse(article_i, $event)">
                                    <i class="fa fa-external-link-square"></i>
                                </span>
                            </td>
                        </tr>

                    </table>
                    <div class="data-empty-tips" v-if="article_all.length==0">
                        <img src="./img/rank-smile.png">
                        <p>文章更新中，请稍后再来</p>
                    </div>
                    <div class="load-more none-visibility js-loadMoresingle" v-class="page_all.numPages<page_all.page?'':'hide'" v-on="click:loadMoreall()">加载更多</div>
                </div>

                <!--某个公众号关注的文章-->
                <div class="my-follow-article-one js-my-follow-article-one " id="articleOne" v-if="!article_tab">

                    <div class="my-follow-article-one-header clearfix js-my-follow-article-one-header" v-sticky="{trigger:57}"
                         data-id="{{article_header_wx_i.id}}" v-repeat="article_header_wx_i:article_header_wx">
                        <img v-attr="src:article_header_wx_i.avatar_url" alt=""/>

                        <div class="header-content">
                            <div class="wx-name" v-text="article_header_wx_i.wx_name"></div>
                            <div class="wx-id">微信号： <span v-text="article_header_wx_i.wx_account"></span></div>
                            <div class="update-time">更新时间：<span v-text="article_header_wx_i.update_time"></span></div>
                        </div>
                    </div>

                    <table class="my-follow-article-all-table">
                        <thead v-sticky="{trigger: 166}">
                        <tr class="my-follow-article-all-table-header">
                            <th style="padding-left: 102px;">文章标题</th>
                            <th class="text-center" style="width: 100px;">发布时间</th>
                            <th class="text-center" style="width: 100px;">更新时间</th>
                            <th class="text-center" style="width: 100px;"> 阅读数</th>
                            <th class="text-center" style="width: 100px;">类型</th>
                            <th class="text-center" style="width: 100px;">操作</th>
                        </tr>
                        </thead>
                        <tr v-repeat="article_one_i:article_one" data-id="{{article_one_i.id}}">
                            <td style="padding-left: 100px;position:relative">

                                <span><a href="javascript:void(0);" v-on="click:openByOuter(article_one_i.article_url)" v-html="article_one_i.article_title"></a></span>

                                <div class="my-follow-arrow-left-time js-my-follow-arrow-left-time" data-text="{{article_one_i.article_text}}" v-if="article_one_i.idx=='1'" v-text="article_one_i.article_time"></div>
                            </td>
                            <td class="text-center" style="color: #999" v-text="article_one_i.publish_time"></td>
                            <td class="text-center" style="color: #999" v-text="article_one_i.update_time"></td>
                            <td class="text-center" v-text="article_one_i.read_num"></td>
                            <td class="text-center">
                                <div class="td{{article_one_i.content_type}} br2"></div>
                            </td>
                            <td class="text-center">
                                <span class="add-btn" title="添加到素材合成器" v-on="click:clickAddMaterial(article_one_i, $event)">
                                    <i class="fa fa-plus-square"></i>
                                </span>
                                |
                                <span class="add-btn" title="添加到别的公众号" v-on="click:clickAddMaterialElse(article_one_i, $event)">
                                    <i class="fa fa-external-link-square"></i>
                                </span>
                            </td>
                        </tr>
                    </table>
                    <div class="data-empty-tips" v-if="article_one.length==0">
                        <img src="./img/rank-smile.png">
                        <p>文章更新中，请稍后再来</p>
                    </div>
                    <div class="load-more none-visibility js-loadMoresingleOne" v-class="article_one.length==0?'hide':''" v-on="click:loadMoreOne()">加载更多</div>
                </div>
            </div>
            <div class="loading-warp" v-if="loading">
                <div class="loading-content">
                    <div class="spinner">
                        <div class="rect1"></div>
                        <div class="rect2"></div>
                        <div class="rect3"></div>
                        <div class="rect4"></div>
                        <div class="rect5"></div>
                    </div>
                    <p>加载数据中</p>
                </div>
            </div>
        </div>
    </div>
</div>

<script id="add-my-num" type="text/template">
    <div class="my-follow-pop-getURl">
        <span>公众号文章URL：</span>
        <input type="text" class="js-geturl-input" placeholder="http://mp.weixin.qq.com/s?__biz=XX&mid=XX&idx=X&sn=XX&3rd=XX==&scene=6#rd" value=""/>
        <div class="get-btn js-geturl-btn"><i class="fa"></i> 获取</div>
    </div>
    <div class="my-follow-pop-getURl-intro js-pop-getURl-intro " >
        <h3>获取方法说明：</h3>
        <p>1. 访问 <a href="javascript:void(0);" onclick="window.top.openUrlToBrowser('http://weixin.sogou.com/weixin?type=1&query=Hi%E5%BE%AE%E5%B0%8F%E5%AE%9D')">http://weixin.sogou.com/</a>；</br>
            2. 搜索你要关注的公众号；</br>
            3. 在搜索结果中找到你想要的公众号，并点击打开最近文章；</br>
            4. 查看并复制公众号文章的网址，粘贴到上方的输入框，点击获取；</br>
            <span class="text-muted">（Tips：网址的格式一般是这样的：http://mp.weixin.qq.com/s?__biz=XX&mid=XX&idx=X&sn=XX&3rd=XX==&scene=6#rd）</span>
        </p>
    </div>
    <div class="js-pop-getURl-content" style="display: none;">
        <div class="my-follow-get-wx-num-infor clearfix js-query-wx-num" data-id="" data-url="">
            <img src="" alt="" class="pull-left"/>
            <div class="pull-left">
                <p class="wx-name"></p>
                <p class="wx-num"></p>
            </div>
        </div>
        <div class="list-wrap">
            <label> 选择分组：</label>
            <div class="modal-body-content-list">
                <div class="" style="max-height: 140px;overflow-y:auto;">
                    <ul class="modal-body-content-list-ul js-pop-list-ul">

                        <%_.each(data_group,function(item,index){%>

                        <li class="<%= index==0?'li-checked':''%>" data-id=<%=item.group_id%>>

                            <span class="js-create-group-name"><%=item.group_name%></span>
                            <i class="fa fa-trash js-trash pull-right <%= item.group_id==0?'hide':'' %>"></i>
                            <i class="fa fa-edit js-edit pull-right <%= item.group_id==0?'hide':'' %>"></i>
                            <div class="create-group-input"><input value="<%=item.group_name%>" maxlength="8" placeholder="不超过8个汉字" class="js-create-group-input"/></div>
                        </li>

                        <% })%>
                    </ul>
                </div>
                <div class="modal-body-content-list-footer clearfix">
                    <input type="text" class="js-pop-move-input" placeholder="不超过8个汉字" maxlength="8"/>
                    <div class="add-group pull-right" id="pop-list-add-group">添加</div>
                </div>
            </div>
        </div>

    </div>
</script>

<script type="text/javascript" src="../../assest/plugins/jquery.min.js"></script>
<script type="text/javascript" src="../../assest/plugins/underscore-min.js"></script>
<script type="text/javascript" src="../../assest/plugins/bootstrap/js/bootstrap.min.js"></script>
<script type="text/javascript" src="../../assest/plugins/vue.min.js"></script>
<script type="text/javascript" src="../../assest/plugins/win.js"></script>
<script type="text/javascript" src="./custom_follow.js"></script>
<!--<script src="http://localhost:35729/livereload.js"></script>-->
<script>
    init();
</script>
</body>
</html>