noDataNet.vue 1.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778
  1. <template>
  2. <view :class="[noDataTips ? 'data_con' : 'con', 'p_flexCenterCol', 'nodata_con']">
  3. <image class="con_img" :src="iconUrl.nothing"></image>
  4. <view :class="[!noDataTips ? 'con_tip p_color_6' : 'con_data_tip p_color_3']">{{ value }}</view>
  5. <view class="no_data_tips" v-if="noDataTips">{{ noDataTips }}</view>
  6. <view class="con_btn p_flexCenter p_bgcolor" @click="toHome" v-if="!showBack">返回首页</view>
  7. <view class="con_btn p_flexCenter p_bgcolor" @click="back" v-else>返回上一页</view>
  8. </view>
  9. </template>
  10. <script lang="ts" setup>
  11. import { ref } from 'vue';
  12. import { common } from '@/utils';
  13. import icon from '@/utils/icon';
  14. const props = withDefaults(defineProps<{
  15. value?: string;
  16. noDataTips?: string;
  17. showBack?: boolean;
  18. }>(), {
  19. value: '',
  20. noDataTips: '',
  21. showBack: false
  22. });
  23. const iconUrl = ref(icon);
  24. const toHome = () => {
  25. common.goToUrl(`/pages/st1/business/tabbar/netHosIndex/netHosIndex`, {
  26. skipWay: "switchTab"
  27. });
  28. };
  29. const back = () => {
  30. common.navigateBack();
  31. };
  32. </script>
  33. <style lang="scss" scoped>
  34. .con {
  35. padding-top: 240upx;
  36. }
  37. .con_img {
  38. width: 402upx;
  39. height: 202upx;
  40. }
  41. .con_tip {
  42. font-size: 28upx;
  43. font-weight: 500;
  44. margin: 24upx 0 34upx;
  45. }
  46. .data_con {
  47. padding-top: 160upx;
  48. }
  49. .con_data_tip {
  50. font-size: 28upx;
  51. font-weight: bold;
  52. margin: 24upx 0 34upx;
  53. }
  54. .no_data_tips {
  55. width: 80%;
  56. font-size: 30upx;
  57. margin-bottom: 60upx;
  58. }
  59. .con_btn {
  60. height: 80upx;
  61. background: #306EFF;
  62. border-radius: 12upx;
  63. padding: 0 54upx;
  64. font-size: 30upx;
  65. }
  66. </style>