index.vue 1.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566
  1. <template>
  2. <view class="container">
  3. <!-- <view :style="{height: statusBarHeight + 'px'}"></view> -->
  4. <!-- <view :style="{height: navBarHeight + 'px'}"></view> -->
  5. <u-navbar :is-back="false" title="" :background="{ background: '#f7f7f7' }" :border-bottom="false">
  6. <view class="slot-wrap">
  7. <image src="/static/images/login-icon.png" mode="aspectFit" style="width: 200rpx;"></image>
  8. </view>
  9. </u-navbar>
  10. <view class="page-content">
  11. <button @click="toPage">是否登录</button>
  12. </view>
  13. </view>
  14. </template>
  15. <script setup>
  16. import {
  17. ref
  18. } from 'vue'
  19. import {
  20. onReady,
  21. onLoad
  22. } from '@dcloudio/uni-app'
  23. import { useAuthStore } from '@/store/authStore'
  24. const authStore = useAuthStore()
  25. // 屏幕状态栏高度
  26. const statusBarHeight = ref(0)
  27. // 顶部导航栏高度
  28. const navBarHeight = ref(0)
  29. const toPage = () => {
  30. if(!authStore.isAuthenticated){
  31. uni.navigateTo({
  32. url: "/pages/login/login"
  33. })
  34. return
  35. }
  36. console.log("登陆了")
  37. }
  38. onReady(() => {
  39. uni.getSystemInfo({
  40. success(e) {
  41. statusBarHeight.value = e.statusBarHeight;
  42. let custom = uni.getMenuButtonBoundingClientRect();
  43. navBarHeight.value = custom.height + (custom.top - e.statusBarHeight) * 2;
  44. }
  45. })
  46. })
  47. onLoad(() => {
  48. uni.setTabBarBadge({ //显示数字
  49. index: 1, //tabbar下标
  50. text: '999' //数字
  51. })
  52. })
  53. </script>
  54. <style lang="scss" scoped>
  55. .container {
  56. height: 100vh;
  57. width: 100vw;
  58. background-color: $uni-bg-color;
  59. padding: 0 20rpx;
  60. }
  61. .slot-wrap{
  62. padding-left: 20rpx;
  63. }
  64. </style>