empty.vue 812 B

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556
  1. <template>
  2. <view class="empty-content">
  3. <image class="emptyImg" src="@/static/empty.png"></image>
  4. <p class="tip">{{text}}</p>
  5. <button type="primary" class="addBtn" v-if="showBtn" @click="handleAdd">新增</button>
  6. </view>
  7. </template>
  8. <script>
  9. export default {
  10. name: "empty",
  11. props: {
  12. text: {
  13. default: '暂无数据',
  14. type: String,
  15. },
  16. showBtn: {
  17. default: false,
  18. type: Boolean,
  19. },
  20. },
  21. data() {
  22. return {
  23. };
  24. },
  25. methods: {
  26. handleAdd() {
  27. this.$emit('onAdd')
  28. },
  29. },
  30. }
  31. </script>
  32. <style lang="scss" scoped>
  33. .empty-content {
  34. width: 70%;
  35. margin-left: 15%;
  36. margin-top: 40%;
  37. text-align: center;
  38. .emptyImg {
  39. width: 100%;
  40. }
  41. .tip {
  42. font-size: 36rpx;
  43. color: #666;
  44. }
  45. .addBtn {
  46. width: 40%;
  47. margin-top: 32rpx;
  48. }
  49. }
  50. </style>