<template>
  <view class="iconBox">
    <view class="iconItem">
      <view @tap="goDevice">
        <view class="icon">
          <image src="../static/iconfont/boundDevice.svg" mode="scaleToFill" />
        </view>
        <view class="text">设备绑定</view>
      </view>
    </view>
    <view class="iconItem">
      <view @tap="goInventory">
        <view class="icon">
          <image src="../static/iconfont/inventory.svg" mode="scaleToFill" />
        </view>
        <view class="text">仓库盘点</view>
      </view>
    </view>
    <!-- <view class="iconItem">
      <view @tap="goHistory">
        <view class="icon">
          <image src="../../static/iconfont/history.svg" mode="scaleToFill" />
        </view>
        <view class="text">盘点清单</view>
      </view>
    </view> -->
  </view>
</template>

<script setup>
import { ref } from "vue";
import { onLoad } from "@dcloudio/uni-app";


onLoad(() => {
})

const goDevice = () => {
  uni.navigateTo({
    url: '/pagesInventory/boundDevice',
  })
}

const goInventory = () => {
  if (uni.getStorageSync("deviceInfo") && Object.keys(uni.getStorageSync("deviceInfo")).length > 0) {
    uni.navigateTo({
      url: '/pagesInventory/autoInventory',
    })
    console.log("有数据")
  } else {
    console.log("无数据")
    uni.showToast({
      title: '请先去绑定设备',
      icon: 'none'
    })
  }
}

const goHistory = () => {
  uni.navigateTo({
    url: '/pagesInventory/history',
  })
}
</script>

<style scoped lang="scss">
.iconBox {
  display: flex;
  align-items: center;
  flex-wrap: wrap;

  .iconItem {
    width: 25%;
    display: flex;
    align-items: center;
    justify-items: center;
    flex-direction: column;
    margin: 20rpx 0;

    .icon {
      width: 110rpx;
      height: 110rpx;
      display: flex;
      align-items: center;
      justify-content: center;
      // background: #199793;
      // border-radius: 50%;

      image {
        width: 60rpx;
        height: 60rpx;
      }
    }

    .text {
      margin-top: 14rpx;
      font-size: 28rpx;
    }
  }
}
</style>
