cwg-empty-state.vue 1.1 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061
  1. <template>
  2. <view class="empty-state">
  3. <image class="img" src="/static/images/undraw.png" alt="" />
  4. <view class="r">
  5. <view class="title">{{ t('Documentary.tradingCenter.item131') }}</view>
  6. </view>
  7. </view>
  8. </template>
  9. <script setup lang="ts">
  10. import { useI18n } from 'vue-i18n';
  11. const { t } = useI18n();
  12. withDefaults(
  13. defineProps<{
  14. text?: string;
  15. }>(),
  16. {
  17. text: "",
  18. }
  19. );
  20. </script>
  21. <style scoped lang="scss">
  22. @import "@/uni.scss";
  23. .empty-state {
  24. display: flex;
  25. padding: px2rpx(31) px2rpx(24);
  26. justify-content: center;
  27. align-items: center;
  28. border-radius: 12px;
  29. gap: px2rpx(24);
  30. .img {
  31. width: px2rpx(100) !important;
  32. height: px2rpx(98) !important;
  33. flex-shrink: 0;
  34. }
  35. .title {
  36. color: #1a1a1a;
  37. font-family: Roboto;
  38. font-size: px2rpx(31);
  39. font-style: normal;
  40. font-weight: 600;
  41. line-height: px2rpx(44);
  42. margin-bottom: px2rpx(8);
  43. }
  44. .text {
  45. color: #474747;
  46. font-family: Roboto;
  47. font-size: px2rpx(14);
  48. font-style: normal;
  49. font-weight: 400;
  50. line-height: px2rpx(20);
  51. letter-spacing: px2rpx(0.07);
  52. }
  53. }
  54. </style>