<template>
  <view class="home">
    <swiper
      class="scroll"
      vertical
      :current="current"
      @change="handleScrollChange"
    >
      <swiper-item>
        <home-page1 class="scroll-item"></home-page1>
      </swiper-item>
      <swiper-item>
        <home-page2 class="scroll-item"></home-page2>
      </swiper-item>
      <swiper-item>
        <home-page3 class="scroll-item"></home-page3>
      </swiper-item>
      <swiper-item>
        <home-page4 class="scroll-item"></home-page4>
      </swiper-item>
    </swiper>
    <!-- 底部导航 -->
    <view class="footer">
      <view class="footer-item blur-bg" @click="gofeihe()">
        <view>
          <image
            style="width: 59rpx; height: 59rpx"
            src="@/assets/reservation-images/twitter.png"
            mode="widthFix"
          >
          </image>
        </view>
        <view>了解飞鹤</view>
      </view>
      <view
        class="footer-item blur-bg"
        @click="goToPage('/reservation/subscribe/index')"
      >
        <view>
          <image
            src="@/assets/reservation-images/briefcase.png"
            mode="widthFix"
          ></image>
        </view>
        <view>现在预约</view>
      </view>
      <view
        class="footer-item blur-bg"
        @click="goToPage('/reservation/record/index')"
      >
        <view>
          <image
            src="@/assets/reservation-images/calendar.png"
            mode="widthFix"
          ></image>
        </view>
        <view>预约记录</view>
      </view>
    </view>
    <!-- 底部箭头 -->
    <view class="footer-down" @click="changeCurrent" v-if="current < 3">
      <image
        src="@/assets/reservation-images/icon-down.svg"
        mode="widthFix"
      ></image>
    </view>
  </view>
</template>

<script setup>
import { useUserStore } from '@/stores/user.js'
import { fetchUserInfo } from '@/api/user.js'
import homePage1 from './page1.vue'
import homePage2 from './page2.vue'
import homePage3 from './page3.vue'
import homePage4 from './page4.vue'
import { ref, onMounted } from 'vue'
import { linkmember } from '@/api/reservation'

const current = ref(0) // 当前页码
const userStore = useUserStore()
onMounted(() => {
  let cuk = uni.getStorageSync('cuk')
  let memberId = uni.getStorageSync('memberId')
  // 如果本地没有缓存登录信息，则需要登录
  if (!cuk || !memberId) {
    userStore.wxAutoLogin()
  }
})

const changeCurrent = () => {
  if (current.value >= 3) {
    current.value = 0
  } else {
    current.value++
  }
}

const handleScrollChange = (e) => {
  console.log(e)
  console.log(123)
  current.value = e.detail.current
}

const goToPage = (path) => {
  if (!path) return
  uni.navigateTo({
    url: path,
  })
}

const gofeihe = () => {
  getUserInfo()
}
const getUserInfo = () => {
  fetchUserInfo({}).then((res) => {
    let data = res.data
    if (data?.memberId !== 'not_login') {
      let requestBody = {
        gradeName: data.gradeName,
        memberId: data.memberId,
        memberName: data.memberName,
        mobile: data.mobile,
        points: data.points,
      }

      linkmember(requestBody).then((res) => {
        console.log(res, 'res')
        console.log('444')
        if (res.code == 0) {
          uni.navigateTo({
            url: '/pages/index/index?pageType=brand',
          })
        } else {
          uni.showToast({
            title: res.msg,
            icon: 'none',
          })
        }
      })
    }
  })
}
</script>

<style lang="less" scoped>
@import './index.less';
</style>
