<template>
  <view class="ezy-xbb-page">
    <view class="icon-title-navBar-box">
      <view class="nav-bar-icon" @click="handleBack"></view>
      <view class="nav-bar-title">选择版本</view>
    </view>

    <view class="xbb-list-box">
      <template v-if="data.banbenList.length">
        <ezyActiveVue class="ezy-list-item-active xbb-item-box" v-for="item in data.banbenList" :key="item.id"
                      @aclick="handleSelect(item)">
          <!-- 封面 -->
          <image class="item-img-box" :src="item.cover" mode=""></image>
          <view class="item-content-box">
            <!-- 名称+等级 -->
            <view class="item-name">{{ item.chanpinName }} {{ item.dengjiName }}</view>
            <!-- 版本名称 -->
            <view class="item-bb">{{ item.name }}</view>
          </view>
          <view class="item-play-btn"></view>
        </ezyActiveVue>
		<view class="ezy-no-more">没有更多</view>
      </template>
      <template v-else>
        <view class="shiti-frame-box">
          <view class="ezy-no-sj">
            <icon></icon>
            <text>暂无数据</text>
          </view>
        </view>
      </template>
    </view>
  </view>
</template>

<script setup>
import {reactive} from "vue";
import {onLoad} from "@dcloudio/uni-app"
import * as pinduHttp from "@/api/chanpinZiRanPinDu.js"
import cacheManager from "@/utils/cacheManager.js";
import ezyActiveVue from "@/components/ezyActive/ezyActive.vue";

const data = reactive({
  dengjiId: null,
  banbenList: []
})

function getBanbenList() {
  pinduHttp.getPinduChanpinBanbenList({dengjiId: data.dengjiId}).then(res => {
    data.banbenList = res.data;
  })
}

function handleBack() {
  uni.switchTab({
    url: `/pages/chanpinXuanze/index`
  })
}

function handleSelect(item) {
  const opt = {
    banbenId: item.id,
  }
  pinduHttp.getPinduChanpinBanbenSave(opt).then(res => {
    if (!res.data) { return;}
    cacheManager.get('contentInfo') && cacheManager.remove('contentInfo');
    // 跳转
    uni.switchTab({
      url: "/pages/chanpinneirong/index"
    })
  })
}

onLoad((options) => {
  data.dengjiId = options.dengjiId;
  getBanbenList();
})


</script>

<style>

</style>
