import {View} from '@tarojs/components'
import Swiper from '@/components/swiper'
import Search from '@/components/search'
import SideBar from '@/components/sideBar'
import Product from '@/components/product'
import MoveBtn from '@/components/moveBtn'
import ShopCart from '@/components/shopCart'
import styles  from './index.module.scss'
import { goLink } from '@/common/common'
import { useState } from 'react'
import Taro from '@tarojs/taro'

export default () => {
  const tabs_list = [
      {title:'平纹系列', value: 1},
      {title:'平纹系列', value: 2},
      {title:'平纹系列', value: 3},
      {title:'平纹系列', value: 4},
      {title:'平纹系列', value: 5},
      {title:'平纹系列', value: 6},
      {title:'平纹系列', value: 7},
      {title:'平纹系列', value: 8},
      {title:'平纹系列', value: 9},
      {title:'平纹系列', value: 10},
      {title:'平纹系列', value: 11},
      {title:'平纹系列', value: 12},
      {title:'平纹系列', value: 13},
      {title:'平纹系列', value: 14},
      {title:'平纹系列', value: 15},
      {title:'平纹系列', value: 16},
      {title:'平纹系列', value: 17},
  ]

  const [showShopCart, setShowShopCart] = useState(false)

  return (
    <MoveBtn onClick={() => setShowShopCart(!showShopCart)}>
      <View className={styles.main}>
        <Swiper/>
        <View className={styles.search}>
          <View className={styles.search_collect}>我的收藏</View>
          <View className={styles.search_input}>
            <Search disabled={true} style={{width: '263rpx'}} clickOnSearch={() => goLink('/pages/searchList/search')}/>
          </View>
        </View>
        <View className={styles.products}>
          <SideBar list={tabs_list} height="100%" heightItem={150}>
            <Product/>
          </SideBar>
        </View>
        <View className='common_safe_area_y'></View>
        <ShopCart show={showShopCart} onClose={() => setShowShopCart(false)}/>
      </View>
    </MoveBtn>
  )
}