friendlist.html 9.7 KB
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
    <title>圈子动态</title>
    <link rel="stylesheet" href="__TMPL__/public/assets/css/init.css">
    <link rel="stylesheet" href="__TMPL__/public/assets/css/swiper-3.4.2.min.css">
    <link rel="stylesheet" href="http://at.alicdn.com/t/font_793738_qfwba85vcdf.css">
    <link rel="stylesheet" href="__TMPL__/public/assets/css/diseaseColumn.css">
    <link rel="stylesheet" href="__TMPL__/public/assets/css/ChatCircle.css">
    <link rel="stylesheet" href="__TMPL__/public/assets/css/chat.css">
    <script src="http://res.wx.qq.com/open/js/jweixin-1.4.0.js"></script>
</head>
<body>
<div>
    <div class="banner_box">
        <img src="{:cmf_get_image_url($group.banner)}" alt="">
    </div>
    <div class="tab_box circle_box">
        <div class="tab_title tab_active">圈子简介</div>
        <div class="tab_title">圈子动态</div>
        <div class="tab_title">圈子资讯</div>
    </div>
</div>


<!--内容部分-->
<div>
    <div class="content_box">
        <div class="circle_title">{$group.name}</div>
        <div style="font-size: 0.28rem;">{$group.descripe}</div>
    </div>
    <div class='content_box' hidden>
        <if condition="$silence==0">
            <div class="top_btn">
                <div class='collect_box'>发动态</div>
            </div>
        </if>
        <volist name="$info" id="v">
        <div class='content_item' >
            <div class='left_box'>
                <div class='head_portrait'>
                    <img src="{$v.avatar}">
                </div>
            </div>


            <div class='item_list'  data-id="1">
                <div class='list_head_box'>
                    <div class='user_name'>{$v.user_login}</div>
                </div>

            <php>
                $pic='';
               $pic=json_decode($v['more'],true);

            </php>
                <div>
                    <div class='list_content'>{$v.content}</div>
                <switch name="v.pic_num">

                    <case value="1">
                        <div class='list_img_box'>
                            <volist name="pic.photos" id="vo">
                                <img class="one preview" src='{:cmf_get_domain()}/upload/friend/{$vo}'>
                            </volist>
                        </div>
                    </case>

                    <case value="4">
                        <div class='list_img_box'>
                            <volist name="pic.photos" id="vo">
                                <img class="four preview" src='{:cmf_get_domain()}/upload/friend/{$vo}'>
                            </volist>
                        </div>
                    </case>

                    <case value="2|3|5|6|7|8|9">
                        <div class='list_img_box'>
                            <volist name="pic.photos" id="vo">
                                <img  class="preview" src='{:cmf_get_domain()}/upload/friend/{$vo}'>
                            </volist>
                        </div>
                    </case>

                </switch>

                </div>
                <div class='list_state_box'>
                    <div class='time'>{:date('Y-m-d H:i',$v.add_time)}</div>
                    <div>
                        <text data-id="{$v.id}" class='iconfont <if condition='$v.is_like==0'>icon-xin3 <else />icon-xin1 </if>'></text>
                        <text data-id="{$v.id}" class='iconfont icon-liaotian2 '></text>
                    </div>
                </div>
                <div class='list_comment_box'>
                    <if condition="!empty($v.like)">
                    <div class='comment_list'>
                        <text class='iconfont icon-xin xin'></text>
                        <text>

                            <volist name="v.like" id="user" key="num">
                                <if condition="$num==1">{$user.user_name}<else />、{$user.user_name}
                                </if>
                            </volist>

                        </text>
                    </div>
                    </if>
                    <div class='comment_list comment{$v.id}'>
                       <volist name="$v.comment" id="comment">
                           <div>
                               <text class="comment_name">{$comment.user_name} :</text>
                               <text>{$comment.content}</text>
                           </div>
                       </volist>
                    </div>
                </div>
            </div>
        </div>
            </volist>
        <!-- 底部信息-->
        <div class="null_box"></div>
        <div class="bottom_box">
            <textarea placeholder="写评论..." class="content" maxlength="200"></textarea>
            <div class="tijiao">
                <text class="iconfont icon-tijiao"></text>
                <text>提交</text>
            </div>
        </div>
    </div>
    <div class="content_box" hidden ">
        <div>
            <volist name="article" id="v1">
                <a href="{:url('portal/article/index',['id'=>$v1.id])}">
                <div class="item_box circle">
                    <div>
                        <img src="{$v1.pic}" alt="">
                    </div>
                    <div>
                        <div class="item_title">{$v1.post_title}</div>
                        <div class="item_content">
                            {:getDescirpe(getSaveContent($v1.post_content),0,50)}...
                        </div>
                        <div>{:date('Y.m.d',$v1.create_time)}</div>
                    </div>
                </div>
                </a>
            </volist>


        </div>
    </div>

</div>

<!--JS部分-->
<script src="__TMPL__/public/assets/js/jquery-2.1.0.js"></script>
<script src="__TMPL__/public/assets/js/swiper-3.4.2.min.js"></script>
<script src="__TMPL__/public/assets/js/fontsize.js"></script>
<script>
    var mySwiper = new Swiper('.swiper-container', {
        direction: 'horizontal', // 垂直切换选项
        loop: true, // 循环模式选项

        // 如果需要分页器
        pagination: '.swiper-pagination',
    })
    $(document).ready(function () {
        $('.bottom_box').hide()
        $('.join_btn').click(function () {
            window.location.href = 'orderSubmit.html'
        })
        $('.tab_title').click(function () {
            var index=$(this).index()
            $(this).addClass('tab_active').siblings().removeClass('tab_active')
            $('.content_box').eq(index).show().siblings().hide()
        })
        $('.collect_box').click(function () {
            window.location.href='{:url('addTalk',['gid'=>$group.id])}'
        })

        $('.icon-xin3').click(function () {
            var id= $(this).attr('data-id');
            $.ajax({
                url:'{:url('postLike')}',
                data:{
                    text_id:id
                },
                type:'POST',
                success:function (res) {
                   console.log(res);
                }
            })
            // $(this).addClass('icon-xin1').parents('.list_state_box').parents('.item_list').siblings('.item_list').children('.list_state_box').children('.icon-xin3').removeClass('icon-xin1')
            $(this).toggleClass('icon-xin1').toggleClass('icon-xin3')
        })
        //取消点赞
        $('.icon-xin1').click(function () {
            var id= $(this).attr('data-id');
            $.ajax({
                url:'{:url('postLike')}',
                data:{
                    text_id:id
                },
                type:'POST',
                success:function (res) {
                   console.log(res);
                }
            })
            $(this).toggleClass('icon-xin3').toggleClass('icon-xin1')
        })

        $('.icon-liaotian2').click(function () {
           // var id=$(this).parents('.list_state_box').parents('.item_list').attr('data-id')
            var id= $(this).attr('data-id');
            $('.bottom_box').show().attr('id',id)
        })

        $('.tijiao').click(function (res) {
            var id=$('.bottom_box').attr('id');
            var content=$('.content').val();
            console.log(id);
            console.log(content);
            if (!content){
                alert('提交内容不能为空!');
                return;
            }
            $.ajax({
                url:'{:url('postContent')}',
                type:'POST',
                data: {
                    content:content,
                    id:id,
                },
                success:function (res) {
                  if(res.code==1){
                      $('.bottom_box').hide().attr('id','');
                      $('.'+'comment'+id).append("<div>" +
                          "                               <text class=\"comment_name\">{$userinfo.user_login} :</text>" +
                          "                               <text>"+content+"</text>" +
                          "                           </div>")
                      alert('评论成功');
                  }
                }
            })

        })


    })
</script>
<script type="application/javascript">
    wx.config({$sdk});
    $('.preview').click(function () {
     var onepic= $(this).attr('src');
     var pic=$(this).parent().children();
     console.log(pic);
     var picnum=new Array();
        for (var i=0;i<pic.length;i++)
        {
            picnum[i]=pic[i].currentSrc;
        }
        console.log(onepic);
        console.log(picnum);
        wx.previewImage({
            current: onepic, // 当前显示图片的http链接
            urls: picnum // 需要预览的图片http链接列表
        });
    })

    </script>
</body>
</html>