<template>
  <view class="set-root" @tap="setUp">
    <text>需开启使用通知权限</text>
    <view class="right"
      >去设置<jx-icon icon="gengduo" color="#4eb331"></jx-icon
    ></view>
  </view>

  <!-- 通知展示 -->
  <view class="notify-root">
    <template v-if="step.length > 0">
      <view class="item" v-for="(item, i) in step" :key="i">
        <uni-title type="h2" :title="item.title" />
        <view class="img">
          <image :src="item.img" mode="widthFix" />
        </view>
      </view>

      <!-- 垫底 -->
      <view class="item">
        <uni-title type="h2" title="完、按照以上方法即可成功开通订单提醒" />
        <view class="img-over">
          <image
            src="https://image.jxc4.com/image/ccb1152ff313b1890c4af5ad80449013.png"
            mode="widthFix"
          />
        </view>
      </view>
    </template>

    <!-- 兜底杂牌手机 -->
    <template v-else>
      <uni-section title="商户您好！" type="line" titleFontSize="18px" />
      <view class="title"
        >非常抱歉离线订单通知业务只支持【小米】【vivo】【oppo】【一加】【华为】【荣耀】等手机开通！</view
      >
      <uni-section title="温馨提示" type="line" titleFontSize="18px" />
      <view class="title"
        >如果你也是以上品牌手机，请点击下方对应的品牌进行设置！</view
      >

      <!-- 手动选择 -->
      <view class="myself-setup">
        <view
          class="item"
          v-for="(item, i) in userList"
          :key="i"
          @tap="myselfSetup(i)"
          >我的手机是：<text>{{ item }}</text></view
        >
      </view>
    </template>
  </view>
</template>

<script lang="ts" setup >
import { getStorage } from '@/utils/storage'
import { onLoad } from '@dcloudio/uni-app'
import { ref } from 'vue'
const notify = uni.requireNativePlugin('Ba-Notify')
function setUp() {
  notify.goSetNotify()
}
const step = ref<Array<AnyObject>>([])
onLoad(() => {
  let brand = getStorage('brand')
  switch (brand) {
    case 'xiaomi':
      step.value = XM
      break
    case 'oppo':
      step.value = OP
      break
    case 'pacm00':
      step.value = OP
      break
    case 'oneplus':
      step.value = OP
      break
    case 'vivo':
      step.value = VV
      break
    case 'huawei':
      step.value = HW
      break
    case 'honor':
      step.value = HW
      break
    default:
      step.value = []
      break
  }
})

// 小米
const XM: Array<object> = [
  {
    title: '1、点击本页的去设置按钮↓',
    img: 'https://image.jxc4.com/image/3a1d77214130f1dcb0e4dc250283cf9c.jpg',
  },
  {
    title: '2、将图中全部的开关都打开↓',
    img: 'https://image.jxc4.com/image/71dd33b69d069add95158c35fd0dfcf1.jpg',
  },
  {
    title: '3、点击下面的每一列进入设置↓',
    img: 'https://image.jxc4.com/image/feafdedbb88b1dbd843a976cf7e247cc.jpg',
  },
  {
    title: '4、将图中全部的开关都打开↓',
    img: 'https://image.jxc4.com/image/92ee123000b3fa1314e627c667a9fa06.jpg',
  },
  {
    title: '5、设置允许锁屏通知显示↓',
    img: 'https://image.jxc4.com/image/96ece42b093ea2a9448b102f0b653a8e.jpg',
  },
  {
    title: '6、自定义提示音↓',
    img: 'https://image.jxc4.com/image/54e729c905653ecf62ee79157fe54d78.jpg',
  },
]

// oppo(oppo/oneplus/pacm00)
const OP: Array<object> = [
  {
    title: '1、点击本页的去设置按钮↓',
    img: 'https://image.jxc4.com/image/3a1d77214130f1dcb0e4dc250283cf9c.jpg',
  },
  {
    title: '2、将图中标识的开关打开↓',
    img: 'https://image.jxc4.com/image/09172105196705fd6d0abb276c652968.jpg',
  },
  {
    title: '3、将图中标识的开关打开↓',
    img: 'https://image.jxc4.com/image/e7e1f09d929f7a922d77b41d1446f526.jpg',
  },
  {
    title: '4、点击下面的每一列进入设置↓',
    img: 'https://image.jxc4.com/image/2d9cd3b27677cd464ff6baca2206502d.jpg',
  },
  {
    title: '5、将图中标识的开关打开↓',
    img: 'https://image.jxc4.com/image/00bb1d771b97a098403fef0a75b36a1e.jpg',
  },
  {
    title: '6、自定义提示音↓',
    img: 'https://image.jxc4.com/image/1f56acc11f55ed0b237736e60b7891aa.jpg',
  },
]

// vivo
const VV: Array<object> = [
  {
    title: '1、点击本页的去设置按钮↓',
    img: 'https://image.jxc4.com/image/3a1d77214130f1dcb0e4dc250283cf9c.jpg',
  },
  {
    title: '2、将图中标识的开关打开↓',
    img: 'https://image.jxc4.com/image/561753b963fac75b9e7c2c11838de9e2.jpg',
  },
  {
    title: '3、点击下面的每一列进入设置↓',
    img: 'https://image.jxc4.com/image/d4474070e84823415198de743b54a874.jpg',
  },
  {
    title: '4、将图中标识的开关打开↓',
    img: 'https://image.jxc4.com/image/b4ca841a6ed47a0bbf0e661244034617.jpg',
  },
  {
    title: '5、将重要性设置为最高↓',
    img: 'https://image.jxc4.com/image/2b47f7ff1ca98f63240dc470d571d130.jpg',
  },
  {
    title: '6、自定义提示音↓',
    img: 'https://image.jxc4.com/image/62ba18a719438835b6ee942a4e75986c.jpg',
  },
]

// 华为和荣耀（huawei/honor）
const HW: Array<object> = [
  {
    title: '1、点击本页的去设置按钮↓',
    img: 'https://image.jxc4.com/image/3a1d77214130f1dcb0e4dc250283cf9c.jpg',
  },
  {
    title: '2、将图中标识的开关都打开↓',
    img: 'https://image.jxc4.com/image/b1884408a4f46963dfe25165ec81207a.jpg',
  },
  {
    title: '3、点击下面的每一列进入设置↓',
    img: 'https://image.jxc4.com/image/2814556144e74ea350e275a2db404e57.jpg',
  },
  {
    title: '4、将图中标识的开关都打开↓',
    img: 'https://image.jxc4.com/image/5662508924172c34c5ac1c64da81b4fc.jpg',
  },
  {
    title: '5、将重要性设置为最高↓',
    img: 'https://image.jxc4.com/image/785646d008e1ed34c24d26c8a83555a4.jpg',
  },
  {
    title: '6、设置允许锁屏通知显示↓',
    img: 'https://image.jxc4.com/image/5a52b32c23227e2a76ebf158659657ef.jpg',
  },
  {
    title: '7、自定义提示音↓',
    img: 'https://image.jxc4.com/image/9efb400ae30c10c82966ee9ee2cae53a.jpg',
  },
]

const userList = ref<Array<string>>([
  '小米',
  'oppo',
  '一加',
  'vivo',
  '华为',
  '荣耀',
])

function myselfSetup(i: number) {
  switch (i) {
    case 0:
      step.value = XM
      break
    case 1:
      step.value = OP
      break
    case 2:
      step.value = OP
      break
    case 3:
      step.value = VV
      break
    case 4:
      step.value = HW
      break
    case 5:
      step.value = HW
      break
  }
}
</script>

<style lang="scss" scoped>
@import './setNotice.scss';
</style>

<style>
page {
  background-color: #fff;
}
</style>