<!--components/app/device/device-list/device-list.wxml-->

<scroll-view scroll-y="{{true}}" type="custom" style="height: calc(100vh -  {{navbarHeight}}px)">

  <grid-view type="aligned" padding="{{[20,12,20,12]}}" cross-axis-count="{{  columns}}" cross-axis-gap="16" main-axis-gap="24">

    <block wx:for="{{devices}}" wx:key="id">

      <tap-gesture-handler data-index="{{index}}" worklet:ongesture="onTap">

        <long-press-gesture-handler data-index="{{index}}" tag="{{item.id}}" worklet:ongesture="onLongTap">

          <view class="app-device-item" id="{{item.id}}" data-index="{{index}}">

            <image src="../../../../static/png/pat.png" class="app-device-item_image" />

            <view style="margin-top: 16rpx;">{{item.title}}</view>

          </view>

        </long-press-gesture-handler>

      </tap-gesture-handler>

      <!-- <view class="app-device-item" data-index="{{index}}" catch:touchend="onTouchEnd" bind:touchstart="onTouchStart">

        <image src="../../../../static/png/pat.png" class="app-device-item_image" />

        <view style="margin-top: 16rpx;">{{item.title}}</view>

      </view> -->

    </block>

    <view wx:if="{{showAdd}}" class="app-device-search" catch:tap="onAddTap">

      <bingo-icon name="plus" size="48"></bingo-icon>

    </view>

  </grid-view>

</scroll-view>