西藏巴青项目

guest-view.vue 923B

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253
  1. <template>
  2. <view class="guest-view">
  3. <text class="guest-view__hint">{{ hint }}</text>
  4. <view class="guest-view__btn" @tap="$emit('login')">
  5. <text class="guest-view__btn-txt">去登录</text>
  6. </view>
  7. </view>
  8. </template>
  9. <script>
  10. export default {
  11. props: {
  12. hint: {
  13. type: String,
  14. default: '登录后查看业务数据'
  15. }
  16. },
  17. emits: ['login']
  18. }
  19. </script>
  20. <style lang="scss" scoped>
  21. @import '@/styles/morandi.scss';
  22. @import '@/styles/scroll-fill.scss';
  23. .guest-view {
  24. @include tab-panel-root;
  25. width: 100%;
  26. align-items: center;
  27. justify-content: center;
  28. padding: 48rpx 40rpx;
  29. gap: 24rpx;
  30. }
  31. .guest-view__hint {
  32. font-size: 28rpx;
  33. color: $morandi-text-muted;
  34. text-align: center;
  35. }
  36. .guest-view__btn {
  37. padding: 24rpx 48rpx;
  38. border-radius: 48rpx;
  39. background: #22c55e;
  40. }
  41. .guest-view__btn-txt {
  42. color: #ffffff;
  43. font-size: 28rpx;
  44. font-weight: 600;
  45. }
  46. </style>