<template>
  <layout>
    <uv-navbar
      :fixed="false"
      title="我的收藏"
      left-arrow
      @leftClick="$onClickLeft"
    />

    <blank size="15"></blank>

    <container>
      <uv-swipe-action>

        <space
          direction="vertical"
          fill
        >

          <card v-for="(item, index) in dataList">
            <uv-swipe-action-item
              :options="options"
              @click="handleClick($event, item)"
            >
              <goods
                list
                :data="item"
                :storeName="item.storeName"
                :price="item.price"
                :stock="item.stock"
                interval="true"
                desc="3"
                showAction="true"
                surplus="200"
                priceMode="primary"
              >
              </goods>
            </uv-swipe-action-item>
          </card>
        </space>
      </uv-swipe-action>
    </container>
  </layout>
</template>

<script setup>
import { ref } from 'vue'
import { getProductList } from '@/api/product'
import { onLoad } from '@dcloudio/uni-app'
import { getProductDelCollect } from '@/api/product'
import { relationCollectUser } from '@/api/user'

import { usePage } from '@/hooks'

const { type, refresh, dataList } = usePage(relationCollectUser)


const options = ref([{
  text: '删除',
  style: {
    backgroundColor: '#f56c6c'
  }
}])

const handleClick = async (e, good) => {
  await getProductDelCollect({
    id: good.id,
    category: 'category'
  })
  refresh()
  console.log("--> % handleClick % e:\n", e)
}

onLoad((option) => {
  type.value = 'collect'
  refresh()
})



</script>

<style lang="less">
</style>
