<template>
  <div>
    <button @click="showToast">点击显示 Toast</button>
    <button @click="showToast2">点击显示 Loading Toast</button>
    <button @click="showToast3">点击显示 success Toast</button>
    <button @click="showToast4">点击显示 error Toast</button>
    <div @click="test">点击测试</div> 

    <br/><br/><br/>
    <br/><br/><br/>
    <button @click="showSdkToast">点击显示 sdk public Toast</button>
    <button @click="showSdkToast2">点击显示 sdk public Alert</button>
    <button @click="hideSdkToast2">隐藏</button>
    <button @click="showSdkToast3">点击显示 sdk public toast</button>
  </div>
</template>

<script lang="ts">
import Vue from 'vue'
import { Toast, SdkShow } from '../../tunas'

Vue.use(Toast)
Vue.use(SdkShow)

export default Vue.extend({
  components: {},

  methods: {
    test() {
      
    },
    showToast(v) {
      this.$toast({
        text: '发现新版本，点击右上角设置按扭前往升级',
        duration: '3000'
      })
      // setTimeout(() => {
      //   this.$toast({ clean: true })
      // }, 2000)
    },
    showToast2(v) {
      this.$toast({
        type: 'loading',
        cover: true,
        text: '正在修改中...',
        duration: 2500
      })
    },
    showToast3(v) {
      this.$toast({
        type: 'success',
        text: '修改成功',
        duration: 2500
      })
    },
    showToast4(v) {
      this.$toast({
        type: 'error',
        text: '定时修改失败<br/>请检查设备是否在线',
        duration: 2500
      })
    },
    showSdkToast() {
      this.$sdkShow.open({
        text: '展示的信息呀',
        type: 'success',
        submit: '知道了呢2',
        duration: '3000'
      })
    },
    showSdkToast2() {
      this.$sdkShow.open({
        func: 'alert',
        textAlign: 'left',
        title: '蓝牙连接失败',
        hint: '尝试连接设备中...',
        submit: '知道了',
        text: `
          请检查：<br/>
          • 设备是否断电了？<br/>
          • 设备是否距离太远了？<br/>
          • 设备是否并不支持蓝牙链路控制？<br/>
          • 设备的蓝牙是否已经与别的设备连接了？<br/>
        `
        // button: '确定'
      })
    },
    showSdkToast3() {
      this.$sdkShow.open({
        text: '蓝牙正在连接设备中...'
      })
    },
    hideSdkToast2() {
      this.$sdkShow.close()
    }
  }
})
</script>
