<template>
  <view class="sparePartsInventory" style="width: 100%; height: 100vh">
    <zj-page-container>
      <view class="pv30" style="background: #fff">
        <search-input @search="search" />
      </view>
      <view class="pv30 picker-view-bock">
        <view class="picker-view">
          <picker class="picker-select" @change="bindPickerChange" :value="index" :range="websitList" range-key="name">
            <view class="picker-select-input">{{ websitList[index] ? websitList[index].name : '请选择' }}</view>
          </picker>
          <image class="icon_next" src="/static/images/fittingsManagement/icon_next.png" mode="aspectFill"></image>
        </view>
      </view>
      <view class="type_switching" v-if="showTypeSwitching">
        <view :class="{ new_left_type: true, selected: selected === 1 }" @tap.stop="selected = 1">
          <text>新件库存</text>
        </view>
        <view :class="{ old_right_type: true, selected: selected === 0 }" @tap.stop="selected = 0">
          <text>旧件库存</text>
        </view>
      </view>
      <zj-page-fill :scroll="false">
        <zj-page-container direction="row">
          <view style="width: 180rpx; height: 100%">
            <zj-page-container>
              <zj-page-fill>
                <view
                  v-for="(item, index) in accessoriesList"
                  :key="index"
                  :class="{ accessories_type_a: true, accessories_selected: accessoriesIndex === index }"
                  @tap.stop="accessoriesIndex = index"
                >
                  <view class="accessories_type_text">
                    {{ item }}
                  </view>
                </view>
              </zj-page-fill>
            </zj-page-container>
          </view>
          <zj-page-fill
            zjPageFillClass="zjPageFillClass"
            @scrolltolower="carScrolltolower"
            @refresherrefresh="carRefresherrefresh"
            @refresherrestore="carRefresherrestore"
            :scrollAttribute="{
              'refresher-enabled': false,
              'refresher-triggered': refresherTriggered
            }"
          >
            <view class="scroll_list_view">
              <block v-for="(item, index) in list" :key="index">
                <accessoriesItem :item="item" :type="selected" />
              </block>
            </view>
          </zj-page-fill>
        </zj-page-container>
      </zj-page-fill>
      <!-- <bt-container>
				<view class="btcon pv30 ph10">
					<view class="confirm-btn" @tap="buyAccessories">购买配件</view>
				</view>
			</bt-container> -->
    </zj-page-container>
  </view>
</template>

<script>
import searchInput from '@/components/searchInput.vue'
import zjPageContainer from '@/components/zj-page-container/zj-page-container.vue'
import zjPageFill from '@/components/zj-page-container/zj-page-fill.vue'
import accessoriesItem from './accessoriesItem.vue'
import getData from './mixins/getData.js'
export default {
  components: {
    searchInput,
    zjPageContainer,
    zjPageFill,
    accessoriesItem
  },
  mixins: [getData],
  data() {
    return {}
  },
  methods: {}
}
</script>

<style scoped lang="scss">
@import './style/style.scss';
</style>
