MEmpty.vue 819 B

123456789101112131415161718192021222324252627282930313233343536373839404142
  1. <template>
  2. <div class="mempty" :class="full?'full':null">
  3. <div :class="[icon ? icon : 'icon_nodata', 'icon']"></div>
  4. <div class="msg">{{ msg ? msg : '暂无内容' }}</div>
  5. </div>
  6. </template>
  7. <script>
  8. export default {
  9. name: 'mempty',
  10. props: {
  11. icon: String, // icon名称
  12. msg: String,
  13. full:Boolean
  14. }
  15. }
  16. </script>
  17. <style lang="less" scoped>
  18. @import url('../assets/commonLess/variable');
  19. .icon {
  20. width: 2rem;
  21. height: 1.26rem;
  22. margin: 0.5rem auto 0.1rem;
  23. }
  24. .icon_nodata {
  25. background: url('../assets/images/icon_nodata.png') no-repeat center;
  26. background-size: contain;
  27. }
  28. .msg {
  29. color: @sFontColor;
  30. font-size: .16rem;
  31. text-align: center;
  32. line-height: .22rem;
  33. position: relative;
  34. }
  35. .full {
  36. height: 100vh;
  37. }
  38. </style>