<template>
  <!-- #ifdef APP -->
  <scroll-view style="flex: 1">
  <!-- #endif -->
    <view class="uni-padding-wrap">
      <page-head title="onLoad 生命周期调用 uni api 测试" />
      <text v-if="isTrue">v-if with true</text>
      <text v-if="isFalse">v-if with false</text>
      <text v-show="isTrue">v-show with true</text>
      <text v-show="isFalse">v-show with false</text>
      <text>msg: {{ msg }}</text>
    </view>
  <!-- #ifdef APP -->
  </scroll-view>
  <!-- #endif -->
</template>

<script lang="uts">
  export default {
    data() {
      return {
        isTrue: false,
        isFalse: true,
        msg: 'default msg'
      }
    },
    onLoad(options : OnLoadOptions) {
      const type = options['type']
      switch (type) {
        case 'adjustData':
          this.adjustData()
          break;
        case 'navigateTo':
          this.navigateTo()
          break;
        case 'navigateBack':
          this.navigateBack()
          break;
        case 'redirectTo':
          this.redirectTo()
          break;
        case 'reLaunch':
          this.reLaunch()
          break;
        case 'switchTab':
          this.switchTab()
          break;
        case 'showToast':
          this.showToast()
          break;
        case 'showLoading':
          this.showLoading()
          break;
        case 'showModal':
          this.showModal()
          break;
        case 'showActionSheet':
          this.showActionSheet()
          break;
      }
    },
    // #ifdef WEB
    onUnload() {
      // web 端页面销毁前,关闭 modal 和 actionsheet
      // @ts-ignore
      const modalBtn = document.querySelector('.uni-modal__btn')
      if (modalBtn) {
        modalBtn.click()
      }
      // @ts-ignore
      const actionSheetBtn = document.querySelector('.uni-actionsheet__action .uni-actionsheet__cell')
      if (actionSheetBtn) {
        actionSheetBtn.click()
      }
    },
    // #endif
    methods: {
      adjustData() {
        this.isTrue = true
        this.isFalse = false
        this.msg = 'new msg'
      },
      navigateTo() {
        uni.navigateTo({
          url: '/pages/API/navigator/new-page/new-page-3'
        })
      },
      navigateBack() {
        uni.navigateBack()
      },
      redirectTo() {
        uni.redirectTo({
          url: '/pages/API/navigator/new-page/new-page-3'
        })
      },
      reLaunch() {
        uni.reLaunch({
          url: '/pages/API/navigator/new-page/new-page-3'
        })
      },
      switchTab() {
        uni.switchTab({
          url: '/pages/tabBar/component'
        })
      },
      showToast() {
        uni.showToast({
          title: 'test title',
          icon: 'success',
          duration: 2000
        })
      },
      showLoading() {
        uni.showLoading({
          title: 'test title',
        })
        setTimeout(() => {
          uni.hideLoading()
        }, 2000)
      },
      showModal() {
        uni.showModal({
          title: 'test title',
          content: 'test content'
        })
      },
      showActionSheet() {
        uni.showActionSheet({
          title: 'test title',
          itemList: ['1', '2', '3']
        })
      }
    }
  }
</script>