<!--packageE/others/case_library/case_detail/caseLibraryDetail.wxml-->
<import src="../../../../wxParse/wxParse.wxml" />
<view id="case-detail-mobile" wx:if="{{view_show}}">
    <headTemplate text="案例详情"></headTemplate>
    <view class="all">
      <view class="list">
        <view class="img">
          <image src="{{datas.img_src}}" alt="" />
        </view>
        <view class="right">
          <view class="one">
            {{ datas.case_name }}
          </view>
          <view class="two">
            <view class='span' wx:for="{{label}}" wx:key="index">
              {{ item.label_name }}
            </view>
          </view>
          <view class="three">
            <view clss="star">
              <van-rate
                value="{{datas.score}}"
                size="{{16}}"
                color="#ffd21e"
                void-icon="star"
                void-color="#eee"
                readonly
                allow-half
              />
            </view>
            <view class="look">
              <icon class="iconfont icon-ht_operation_perview" style="margin-top:-10rpx;"></icon>
              {{ datas.read_num }}
            </view>
          </view>
        </view>
      </view>
      <view class="explain">
        <view class="one">
          <view class='span' class="left">分类：</view>
          <view class='span' class="right">
            <view class='span' wx:for="{{second_category}}" wx:key="index">{{ item.category_name }}</view>
          </view>
        </view>
        <view class="one">
          <view class='span' class="left">区域：</view>
          <view class='span' class="right">
            {{ datas.province ? datas.province.areaname : '' }} {{ datas.city ? datas.city.areaname : '' }}
          </view>
        </view>
        <view class="one">
          <view class='span' class="left">发布者：</view>
          <view class='span' class="right" wx:if="{{datas.member && datas.member != null}}">
            {{ datas.member.nickname }}
          </view>
        </view>
        <view class="one">
          <view class='span' class="left">发布时间：</view>
          <view class='span' class="right">
            {{ datas.created_at }}
          </view>
        </view>
      </view>
      <view class="hr"></view>
      <view class="brief">
        <view class="btitle">简介</view>
        <view class="details">
          <rich-text  nodes="{{datas.content}}">
            
          </rich-text>
        </view>
      </view>
      <view class="image" wx:if="{{screen_shot_src.length > 0}}">
        <view class="btitle" style="margin: 0 0.9375rem">{{datas.case_name}}图片</view>
        <view class="image-li">
          <view class="li" wx:for="{{screen_shot_src}}" data-index='{{index}}' bindtap='previewImage' wx:key="index">
            <image src="{{item}}" alt="" />
          </view>
        </view>
      </view>
      <view class="qr">
        <view class="btitle">立即体验</view>
        <view class="image-li">
          <view class="li">
            <view class="img">
              <image src="{{datas.img_h5_src || emptyImage}}" alt="" />
            </view>
            <view style="padding:0.25rem 0">H5/公众号二维码</view>
          </view>
          <view class="li">
            <view class="img">
              <image src="{{datas.img_mini_src || emptyImage}}" alt="" />
            </view>
            <view style="padding:0.25rem 0">微信小程序二维码</view>
          </view>
        </view>
      </view>
      <view class="adv" wx:if="{{ad3}}">
        <view class="img" wx:if="{{ad3.mobile_img}}">
          <view data-url="{{ad3.url}}" catchtap='tapLink'>
            <image src="{{ad3.mobile_img}}" mode="widthFix" />
          </view>
        </view>
      </view>
      <view class="more">
        <view class="btitle" style="margin: 0 0.9375rem">其他人还看了</view>
        <view class="image-li">
          <view class="li" wx:for="{{hotCase}}" wx:key="index" catchtap="gotoOther" data-id="{{item.id}}">
            <view class="img">
              <image src="{{item.img_src}}" alt="" />
            </view>
            <view class="title">{{ item.case_name }}</view>
          </view>
        </view>
      </view>
      <view class="score">
        <view class="btitle">评分</view>
        <view class="score1">
          <view class="left">
            <view class="number">{{ datas.score }}分</view>
            <view class="total">
              <view clss="star">
                <van-rate
                  value="{{datas.score}}"
                  size="{{16}}"
                  color="#ffd21e"
                  void-icon="star"
                  void-color="#eee"
                  readonly
                  allow-half
                />
              </view>
              <view class="people">{{ datas.total_level }}人评分</view>
            </view>
          </view>
          <view class="right">
            <view clss="star">
              <van-rate value="{{star_value}}" size="{{16}}" color="#ffd21e" void-icon="star" void-color="#eee" />
            </view>
            <view class="tip">请给该案例评分</view>
          </view>
        </view>
        <view class="score2">
          <view style="margin:10px;display:flex">
            <view style="padding-right:10px">5星</view>
            <van-progress
              pivot-text=""
              color="#f5a623"
              stroke-width="8"
              percentage="{{five}}"
              style="flex:1;margin-top:5px"
              show-pivot="{{false}}"
            />
            <view style="padding-left:10px">{{ datas.five_level }}条</view>
          </view>
          <view style="margin:10px;display:flex">
            <view style="padding-right:10px">4星</view>
            <van-progress
              pivot-text=""
              color="#f5a623"
              stroke-width="8"
              percentage="{{four}}"
              style="flex:1;margin-top:5px"
              show-pivot="{{false}}"
            />
            <view style="padding-left:10px">{{ datas.four_level }}条</view>
          </view>
          <view style="margin:10px;display:flex">
            <view style="padding-right:10px">3星</view>
            <van-progress
              pivot-text=""
              color="#f5a623"
              stroke-width="8"
              percentage="{{three}}"
              style="flex:1;margin-top:5px"
              show-pivot="{{false}}"
            />
            <view style="padding-left:10px">{{ datas.three_level }}条</view>
          </view>
          <view style="margin:10px;display:flex">
            <view style="padding-right:10px">2星</view>
            <van-progress
              pivot-text=""
              color="#f5a623"
              stroke-width="8"
              percentage="{{two}}"
              style="flex:1;margin-top:5px"
              show-pivot="{{false}}"
            />
            <view style="padding-left:10px">{{ datas.two_level }}条</view>
          </view>
          <view style="margin:10px;display:flex">
            <view style="padding-right:10px">1星</view>
            <van-progress
              pivot-text=""
              color="#f5a623"
              stroke-width="8"
              percentage="{{one}}"
              style="flex:1;margin-top:5px"
              show-pivot="{{false}}"
            />
            <view style="padding-left:10px">{{ datas.one_level }}条</view>
          </view>
        </view>
      </view>
      <view class="comment">
        <view class="btitle">评价</view>
        <view class="lists" wx:for="{{comment}}" wx:key="index">
          <view class="li">
            <view class="left">
              <view class="img">
                <image src="{{item.member.avatar}}" alt="" />
              </view>
            </view>
            <view class="right">
              <view class="one">
                <view class="nickname">
                  <view class='span'>{{ item.member.nickname }}</view>
                </view>
                <view class="button">
                  <view class='span' catchtap="openReply" data-id="{{item.id}}" data-num='2'>
                    <icon class="iconfont icon-ht_list_line_allmessage"></icon>
                  </view>
                  <view style="margin-left: 20rpx;" class='span' wx:if="{{item.member_id == uid}}" catchtap="delComment" data-str='comment' data-id="{{item.id}}">
                    <icon class="iconfont icon-all_delete_1"></icon>
                  </view>
                </view>
              </view>
              <view class="two">
                <view class="time">{{ item.created_at }}</view>
              </view>
              <view class="three">
                {{ item.content }}
              </view>
            </view>
          </view>
          <view class="child-li" wx:for="{{item.reply}}" wx:for-item="item1" wx:key="index" wx:if="{{item.is_show || index == 0}}">
            <view class="left">
              <view class="img">
                <image src="{{item1.member.avatar}}" alt="" />
              </view>
            </view>
            <view class="right">
              <view class="one">
                <view class="nickname">
                  <view class='span'>{{ item1.member.nickname }}</view>
                  <view class='span' class="reply" wx:if="{{item1.reply_member != null}}">回复</view>
                  <view class='span' wx:if="{{item1.reply_member != null}}">{{ item1.reply_member.nickname }}</view>
                </view>
                <view class="button" style="margin-right:18rpx;">
                  <view class='span' catchtap="openReply" data-id="{{item1.id}}" data-num='1'>
                    <icon class="iconfont icon-ht_list_line_allmessage"></icon>
                  </view>
                  <view class='span' style="margin-left: 20rpx;" wx:if="{{uid == item1.member_id}}" catchtap="delComment" data-id='{{item1.id}}' data-str='reply'>
                    <icon class="iconfont icon-all_delete_1"></icon>
                  </view>
                </view>
              </view>
              <view class="two">
                <view class="time">{{ item1.created_at }}</view>
              </view>
              <view class="three">
                {{ item1.content }}
              </view>
            </view>
          </view>

          <view class="more1" wx:if="{{item.reply.length >= 2}}" catchtap="changeReplyLength" data-ind="{{index}}">
            {{ item.is_show ? '收起' : '展开' + item.reply.length + '条回复' }}
          </view>
        </view>
        <view style="width: 100%;height: 40px;line-height: 40px;text-align: center;">没有更多了~</view>
      </view>
      <!-- 评论 -->
      <view class="send" wx:if="{{message_show}}">
        <view class="left">
          <input type="text" bindinput="messageText" value="{{commit_text}}" placeholder="说点什么吧..." />
        </view>
        <view class="right" catchtap="sendMessage" data-num="2">
          <icon class="iconfont icon-zx_map_local" style="font-size:20px"></icon>
        </view>
      </view>
      <!-- 回复 -->
      <view class="send" wx:if="{{reply_show}}">
        <view class="left">
          <input type="text" bindinput="sendText" value="{{reply_text}}" placeholder="说点什么吧..." />
        </view>
        <view class="right" catchtap="sendMessage" data-num="1">
          <icon class="iconfont icon-zx_map_local" style="font-size:20px"></icon>
        </view>
      </view>
      <view class="commit">
        <view class="commit1" catchtap="openMeaage">
          <view>评论</view>
        </view>
      </view>

      <serviceTemplate></serviceTemplate>
      <shareTemplate title="{{datas.case_name}}" desc="{{datas.desc}}" img="{{datas.img_src}}" kid="{{datas.id}}" type='case'></shareTemplate>
    </view>
  </view>