<template>
  <van-action-sheet class="action" v-model:show="show" title="异常确认">
    <div class="px-[6px]">
      <SortingDetailsItem :type="SortingDetailsItemType.ABNORMAL" />
      <SortingDetailsItem :type="SortingDetailsItemType.ABNORMAL" />
      <SortingDetailsItem :type="SortingDetailsItemType.ABNORMAL" />
      <SortingDetailsItem :type="SortingDetailsItemType.ABNORMAL" />
      <SortingDetailsItem :type="SortingDetailsItemType.ABNORMAL" />
      <SortingDetailsItem :type="SortingDetailsItemType.ABNORMAL" />
      <SortingDetailsItem :type="SortingDetailsItemType.ABNORMAL" />
      <SortingDetailsItem :type="SortingDetailsItemType.ABNORMAL" />
      <SortingDetailsItem :type="SortingDetailsItemType.ABNORMAL" />
    </div>
    <div class="bottom-actions ">
      <van-button
        class="action-btn reset-btn"
      >
        取消
      </van-button>
      <van-button
        class="action-btn confirm-btn"
        type="primary"
      >
        确定
      </van-button>
    </div>
  </van-action-sheet>
</template>

<style lang="stylus" scoped>
.bottom-actions
  position: fixed
  bottom 0
  left 0
  right 0
  display flex
  z-index 1000
  background: #fff;
  justify-content space-between
  margin-top 30px
  padding 0 20px
  border-top: 1px solid #f0f0f0;
  .action-btn
    flex 1
    margin 10px
:deep(.action)
  .van-action-sheet__content
    padding-bottom: 100px
</style>

// 不生效
:deep(.action)
  .van-action-sheet__content
    padding-bottom: 100px