<script setup>
import PrivacyModal from '@/components/PrivacyModel.vue'

const tabbar = ref('index')
const menu = reactive([{ title: '首页', icon: 'home', name: 'index' }, { title: '代理', icon: 'share', name: 'agent' }, { title: 'AI律师', icon: 'user-avatar', name: 'ai' }, { title: '我的', icon: 'user', name: 'me' }])


function tabChange({ value }) {
  uni.switchTab({
    url: `/pages/${value}`,
  })
}
onShow(() => {
  const currentPage = getCurrentPages()[getCurrentPages().length - 1].route
  const pageName = currentPage.split('/').pop()
  tabbar.value = pageName
})

onMounted(() => {
  uni.hideTabBar()

  const currentPage = getCurrentPages()[getCurrentPages().length - 1].route
  const pageName = currentPage.split('/').pop()
  tabbar.value = pageName
})

function toComplaint() {
  // 直接使用plus.runtime.openURL在系统浏览器中打开链接
  // #ifdef APP-PLUS
  plus.runtime.openURL('https://work.weixin.qq.com/kfid/kfc5c19b2b93a5e73b9');
  // #endif

  // #ifdef H5
  window.location.href = 'https://work.weixin.qq.com/kfid/kfc5c19b2b93a5e73b9';
  // #endif
}
</script>

<script>
export default {
  options: {
    styleIsolation: 'shared',
  },
}
</script>

<template>
  <view class=" min-h-screen from-blue-100 to-white bg-gradient-to-b min-h-screen flex flex-col flex-1 pb-16 box-border">
    <slot />
  </view>
  <view>
    <wd-tabbar v-model="tabbar" custom-class="qnc-tabbar" shape="round" safe-area-inset-bottom fixed
      @change="tabChange">
      <wd-tabbar-item v-for="(item, index) in menu" :key="index" :name="item.name" :title="item.title"
        :icon="item.icon" />
    </wd-tabbar>
  </view>
  <view
    class="fixed bottom-24 right-4 z-1000 flex items-center rounded-3xl from-red-500 to-red-400 bg-gradient-to-b px-2 py-1 text-center text-white shadow-2xl">
    <wd-icon name="warning" class="mr-1" size="18px" />
    <view class="text-xs" @click="toComplaint">
      投诉
    </view>
  </view>
  <PrivacyModal />
</template>

<style scoped>
:deep(.qnc-tabbar) {
  bottom: 16px !important;
}


</style>
