<template>
  <div>
    <!-- 我的关注 -->
      <div class="tiezhlist" v-if="fenlei==1">
      <div
        class="tieziitem"
        v-for="(item, index) in tiezilist"
        :key="index"
       
      >
        <div class="tiezitop flexone">
          <div class="tieziimg">
            <img :src="item.avatar ? item.avatar : item.to_user.avatar" alt="" />
          </div>
          <div class="tieziright">
            <div class="tiezirighttop flex">
              <div class="timeright">
                <div class="tieziming">
                  {{ item.nickname ? item.nickname : item.to_user.nickname }}
                </div>
                <div class="tiezifen">{{item.to_user.createtime}}</div>
              </div>

              <div>
                <div class="vipimg">
                  <img src="../assets/vip_icon@2x.png" alt="" />
                  <div class="vipname">{{ item.to_user.level.name1 }}</div>
                </div>
                <div class="tiezizhuan" v-for="(item,index) in item.to_user.label" :key="index" >{{item.name_label}}</div>
              </div>
              <img
                :src="item.logo_image"
                class="banggongimg"
                alt=""
                v-for="(item, index) in item.to_user.label"
                :key="index"
              />
              <!-- <img
                src="../assets/peisong_icon@2x.png"
                class="banggongimg"
                alt=""
              /> -->
              <img
                src="../assets/yirenzheng_icon@2x.png"
                class="banggongimg"
                alt=""
                v-if="item.to_user.is_card == 1"
              />
            </div>
            <div class="tiezibto flexone"></div>
          </div>
        </div>
        <div class="tiezicontent">
          <div class="teizicontenttop flextwo">
            <div class="tiezicontentname">{{ item.to_user.title }}</div>
            
          </div>
          <div class="tieziwordbox" v-html="item.to_user.content"></div>

          <div
            class="teiziimgbox flexone"
            v-if="item.video != null"
            @click.stop="govideo(item.to_user.video)"
          >
            <div class="videoimg">
              <img :src="item.to_user.video_image" alt="" />
              <img src="../assets/bofang_icon@2x.png" alt="" class="videobtn" />
            </div>
          </div>
          <div class="teiziimgbox flexone" v-if="item.to_user.images != null">
            <div
              class="tieziimgimg"
              v-for="(item, indexk) in item.to_user.images"
              :key="indexk"
              @click.stop="previewimg(index, indexk, item)"
            >
              <img :src="item" alt="" />
            </div>
          </div>
          
        </div>
      </div>
    </div>
    <!-- 其余三个种类 -->
    <div class="tiezhlist" v-else>
      <div
        class="tieziitem"
        v-for="(item, index) in tiezilist"
        :key="index"
        @click="fenlei != 3 ? luntandetail(item) : ''"
      >
        <div class="tiezitop flexone">
          <div class="tieziimg">
            <img :src="item.avatar ? item.avatar : item.user.avatar" alt="" />
          </div>
          <div class="tieziright">
            <div class="tiezirighttop flex">
              <div class="timeright">
                <div class="tieziming">
                  {{ item.nickname ? item.nickname : item.user.nickname }}
                </div>
                <div class="tiezifen">{{item.createtime}}</div>
              </div>

              <div>
                <div class="vipimg" v-if="item.forum_type == 1">
                  <img src="../assets/vip_icon@2x.png" alt="" />
                  <div class="vipname">{{ item.user.level.name1 }}</div>
                </div>
                <div class="tiezizhuan" v-for="(item,index) in item.user.label" :key="index" >{{item.name_label}}</div>
              </div>
              <img
                :src="item.logo_image"
                class="banggongimg"
                alt=""
                v-for="(item, index) in item.user.label"
                :key="index"
              />
              <!-- <img
                src="../assets/peisong_icon@2x.png"
                class="banggongimg"
                alt=""
              /> -->
              <img
                src="../assets/yirenzheng_icon@2x.png"
                class="banggongimg"
                alt=""
                v-if="item.is_card == 1"
              />
            </div>
            <div class="tiezibto flexone"></div>
          </div>
        </div>
        <div class="tiezicontent">
          <div class="teizicontenttop flextwo">
            <div class="tiezicontentname">{{ item.title }}</div>
            <img
                  src="../assets/xingxing_icon@2x.png"
                  alt=""
                  class="starimg"
                  v-if="item.is_collect==1"
                  @click.stop="collect(index,item.id)"
                />
                <img  src="../assets/weishoucang_icon@2x.png"
                  alt=""
                  class="starimg"
                  v-else
                   @click.stop="collect(index,item.id)"
                />
          </div>
          <div class="tieziwordbox" v-html="item.content"></div>

          <div
            class="teiziimgbox flexone"
            v-if="item.video != null"
            @click.stop="govideo(item.video)"
          >
            <div class="videoimg">
              <img :src="item.video_image" alt="" />
              <img src="../assets/bofang_icon@2x.png" alt="" class="videobtn" />
            </div>
          </div>
          <div class="teiziimgbox flexone" v-if="item.images != null">
            <div
              class="tieziimgimg"
              v-for="(item, indexk) in item.images"
              :key="indexk"
              @click.stop="previewimg(index, indexk, item)"
            >
              <img :src="item" alt="" />
            </div>
          </div>
          <div class="tiezipingbot">
            <div
              class="teizipingitem flexone"
              v-if="item.comment != 0 && fenlei != 3"
            >
              <img src="../assets/pinglun_icon@2x.png" alt="" class="lunimg" />
              {{ item.comment }}
            </div>
            <div
              class="teizipingitem flexone"
              @click.stop="
                fenlei != 3 ? praisedian(item, index) : pingpraise(item, index)
              "
            >
              <img
                src="../assets/zan_icon@2x.png"
                alt=""
                class="lunimg zanimg"
                v-if="item.is_praise == 1"
              />
              <img
                src="../assets/nodianzan.png"
                alt=""
                class="lunimg zanimg"
                v-if="item.is_praise == 2"
              />
              {{ item.praise }}
            </div>
            <div class="teizipingitem flexone">
              <img
                src="../assets/number.png"
                alt=""
                class="lunimg zanimg"
              />
              {{item.view}}
            </div>
             <div class="teizipingitem flexone" v-if="fenlei==0" @click.stop="del(item)">
              <img
                src="../assets/del.png"
                alt=""
                class="lunimg zanimg"
              />
             
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>
<script>
import wx from "weixin-js-sdk";
import Vue from "vue";
import { Toast,Dialog } from "vant";
Vue.use(Toast);
export default {
  props: ["tiezilist", "showpull", "fenlei"],
  dta() {
    return {
      tiezilist: []
    };
  },
  created() {
    this.getappid();
  },
  methods: {
    // 获取appid
    getappid() {
      let that = this;
      console.log(34734894890);
      let urlk = window.location.href;
      var url = "/api/user/get_jssdk";
      let param = {
        url: urlk
      };

      that.$axios
        .post(url, param)
        .then(function (res) {
          console.log(res, "jssdkjsskd");
          wx.config({
            debug: false,
            appId: res.data.appId, // 和获取Ticke的必须一样------必填，公众号的唯一标识
            timestamp: res.data.timestamp, // 必填，生成签名的时间戳
            nonceStr: res.data.nonceStr, // 必填，生成签名的随机串
            signature: res.data.signature, // 必填，签名，见附录1
            //需要分享的列表项:发送给朋友，分享到朋友圈，分享到QQ，分享到QQ空间
            jsApiList: ["previewImage"]
          });
        })
        .catch(function (err) {
          console.log(err);
        });
    },

     // 收藏和取消收藏
    collect(index,id){
      let that = this;
      var url = "/api/forum/collect";
      var params = {
        forum_id: id
      };
      console.log("7766554", params);
      that.$axios
        .post(url, params)
        .then(res => {
          let newtiezilist=that.tiezilist;
          if( newtiezilist[index].is_collect==2){
              newtiezilist[index].is_collect=1;
              Toast("收藏成功")
          }else{
            newtiezilist[index].is_collect=2;
              Toast("取消收藏成功")
          }
         
          that.tiezilist=newtiezilist;
          that.$forceUpdate()
          that.bannertop = res.data;
        })
        .catch(err => {
          console.log(err);
        });
    },
   

    // 点赞和取消点赞
    praisedian(item, index) {
      let that = this;
      if (that.tiezilist[index].is_praise == 2) {
        Toast("点赞成功");
        that.tiezilist[index].is_praise = 1;
        that.tiezilist[index].praise = that.tiezilist[index].praise + 1;
      } else {
        Toast("取消点赞成功");
        that.tiezilist[index].is_praise = 2;
        that.tiezilist[index].praise = that.tiezilist[index].praise - 1;
      }

      that.tiezilist = that.tiezilist;

      var url = "/api/forum/praise";
      var params = {
        forum_id: item.id
      };
      console.log("参数", params);
      that.$axios
        .post(url, params)
        .then(res => {
          console.log(res);
        })
        .catch(err => {
          console.log(err);
        });
    },
    // 我的评论赞

    pingpraise(item, index) {
      let that = this;
      console.log(item, index);
      if (this.tiezilist[index].is_praise == 2) {
        Toast("点赞成功");
        this.tiezilist[index].is_praise = 1;
        this.tiezilist[index].praise = this.tiezilist[index].praise + 1;
      } else {
        this.tiezilist[index].is_praise = 2;
        this.tiezilist[index].praise = this.tiezilist[index].praise - 1;
        Toast("取消点赞成功");
      }
      this.tiezilist = this.tiezilist;
      var url = "/api/comments/praise";
      var params = {
        comments_id: item.id
      };
      console.log("参数", params);
      that.$axios
        .post(url, params)
        .then(res => { })
        .catch(err => {
          console.log(err);
        });
    },
    // 论坛详情
    luntandetail(item) {
      this.$router.push({
        path: "/tiezidetail",
        query: { id: item.id }
      });
    },
    // 进入video
    govideo(src) {
      console.log(src);
      this.$router.push({
        path: "/videoplay",
        query: { url: src }
      });
    },
    // 预览图片
    previewimg(index, indexk, item) {
     
      wx.previewImage({
        current: item, // 当前显示图片的http链接
        urls: this.tiezilist[index].images // 需要预览的图片http链接列表
      });
    },
    del(item) {
				let that = this;
        console.log(3443893489809)
         Dialog.confirm({
        title: "是否撤销帖子"
      })
        .then(res => {
          console.log(3489348);
          let that = this;
          var url = "/api/forum/delete_forum";
          let param = {
           	forum_id: item.id
          };

          that.$axios
            .post(url, param)
            .then(function (res) {
              console.log(res);
             that.tiezilist.forEach(function(value,index,array){
                if(value.id==item.id){
                   that.tiezilist.splice(index,1)
                }
             })
             that.tiezilist=that.tiezilist;
             that.$forceUpdate()
            })
            .catch(function (err) {
              console.log(err);
            });
          // on confirm
        })
        .catch(res => {
          // on cancel
        });
				
			},
  }
};
</script>
<style scoped>
@import "./style/homepage.css";
</style>