zhiyu_uni_duanju/pages/zhuiju/index.vue

<template>
  <view>
    <view class="body">
      <view class="pd16_15" style="box-shadow: 0px 0px 20upx 0px rgba(0,0,0,0.2);  border-radius: 20upx;">
        <view>
          <view class="flex alcenter space top-show">
            <view class="flex alcenter">
              <text class="ft16 ftw600 cl-main">最近观看</text>
            </view>

            <navigator url="/pages/zhuiju/zjgk">
              <view class="ft14 cl-notice" v-show="historyList.length > 3">更多</view>
              <!-- <view class="ft14 cl-notice" >更多</view> -->
            </navigator>
          </view>
        </view>
        <view class="mt16 history-box ">
          <block v-for="(value, key) in historyList" :key="key" v-if="key < 3">
            <view class="history-item-box" @click="detail(value.video_id, value.watch_episode_num)">
              <image class="history-item-image" :src="value.cover_image"></image>
              <label class="history-item-title">{{ value.name }}</label>
            </view>
          </block>
          <view class="box pb10 history-item-box  history-add-box" @click="goToJuYuan">
            <image class="add-icon" src="/static/img/zhuiju/add.png"></image>
          </view>

        </view>
      </view>
      <view class="mt24 pd16_15">
        <view class="flex alcenter space">
          <view class="flex alcenter">
            <text class="ft16 ftw600 cl-main">我的追剧</text>
          </view>
        </view>
        <view class="mt16 zuiju-box">
          <block v-if="zhuijuList.length > 0" v-for="(value, key) in zhuijuList" :key="key">
            <view class="box pd16_15  mb16 zuiju-box-item">
              <image @click="detail(value.video_id, value.watch_episode_num)" class="zuiju-box-item-cover"
                :src="value.cover_image"></image>
              <view class="zuiju-box-item-info" @click="detail(value.video_id, value.watch_episode_num)">
                <label class="zuiju-box-item-info-title">{{ value.name }}</label>
                <label class="zuiju-box-item-info-juji">看到<span class="guankan">{{ value.watch_episode_num
                }}集</span></label>
                <label class="zuiju-box-item-info-gx">更新至<span class="update-ji">{{ value.updated_episode_num
                }}集</span></label>
              </view>
              <view class="zuiju-box-item-del-box" @click="delzj(value.video_id)">
                <image class="del-icon" src="../../static/img/zhuiju/delete.png"></image>
              </view>
            </view>

          </block>
        </view>
        <view v-if="is_show" class="mt16 zuiju-box-kong">
          <image src="../../static/img/zhuiju/kong.png"></image>
          <text class="ft14">暂无追剧</text>
          <label class="ft16" @click="goToJuYuan()">去追剧</label>
        </view>
      </view>
    </view>

  </view>
</view></template>
<script>
import {
  watchRecord,
  shelfList,
  delShelf
} from "@/common/apis/zju.js";
export default {
  data() {
    return {
      more_text: "查看全部",
      qdjl: 0,
      tdsy: 0,
      navLock: false,
      datasa: [],
      showdyxx: true,
      dataconfig: [],
      banners: [],
      datainfo: [],
      dataindex: [],
      newsa: [],
      record: [],
      historyList: [],
      zhuijuList: [],
      mbgColor: this.$mbgColor,
      is_show_more: false,
      is_show: false
    }
  },
  computed: {

  },
  onPageScroll(e) {

  },
  onShareAppMessage(e) {

  },
  onShareTimeline(e) {

  },
  onLoad(e) { },
  onShow() {
    this.getList();
  },
  methods: {
    changeList() {
      if (this.is_show_more) {
        this.more_text = "查看全部";
      } else {
        this.more_text = "收起"
      }
      this.is_show_more = !this.is_show_more;
    },
    async getList() {
      let historyRes = await watchRecord();
      this.historyList = historyRes.data;
      let zhuijuRes = await shelfList();
      this.zhuijuList = zhuijuRes.data;
      if (this.zhuijuList.length < 1) {
        this.is_show = 1;
      } else {
        this.is_show = 0;
      }
    },
    saoma() {
      //#ifdef APP-PLUS  
      uni.scanCode({
        success: function (res) {
          if (res.result.indexOf("uid") != -1) {
            var obj = JSON.parse(res.result);
            if (obj.uid) {
              uni.navigateTo({
                url: '/pages/login/reg?uid=' + obj.uid
              })
            }
          } else {
            uni.showToast({
              title: res.result,
              icon: "none"
            });
          }
        }
      });
      //#endif

    },
    detail(video_id, item_id) {
      // console.log(value);
      uni.navigateTo({ url: '/pages/video/index?video_id=' + video_id + "&sequence=" + item_id + "&ranse_id=3" })
      // uni.navigateTo({
      // 	url: '/pages/video/index?video_id=' + value.video_id 
      // })
    },
    linkTo(e) {
      if (this.isLogin == false) {
        this.showLogin = true;
      } else {
        let link = e.currentTarget.dataset.link;
        uni.navigateTo({
          url: link
        })
      }
    },
    async delzj(id) {
      let res = await delShelf(id);
      uni.showToast({
        title: "删除成功",
        icon: "none"
      });
      // 更新最近列表数据
      let zhuijuRes = await shelfList();
      this.zhuijuList = zhuijuRes.data;
      console.log(res);
    },
    exchange(e) {
      if (this.isLogin == false) {
        this.showLogin = true;
      } else {
        let id = e.currentTarget.dataset.id;
        uni.navigateTo({
          url: '/pages/client/integral/exchange?id=' + id
        })
      }
    },
    goToJuYuan() {
      uni.switchTab({
        url: '/pages/index/index'
      })
    }
  },
}
</script>

<style>
@import url("style/index.css");
</style>