blankPage.vue 1.4 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364
  1. <template>
  2. <!-- 辅助空白 -->
  3. <view v-show="!isSortType">
  4. <view class="blankPage" :style="[blankWrapStyle]">
  5. <view class="bankCon" :style="[blankStyle]"></view>
  6. </view>
  7. </view>
  8. </template>
  9. <script>
  10. export default {
  11. name: 'blankPage',
  12. props: {
  13. dataConfig: {
  14. type: Object,
  15. default: () => {}
  16. },
  17. isSortType: {
  18. type: String | Number,
  19. default: 0
  20. }
  21. },
  22. data() {
  23. return {
  24. bgColor: '',
  25. heightConfig: 0
  26. };
  27. },
  28. computed: {
  29. blankWrapStyle() {
  30. return {
  31. 'padding': `${this.dataConfig.topConfig.val * 2}rpx ${this.dataConfig.lrEdge.val * 2}rpx ${this.dataConfig.bottomConfig.val * 2}rpx`,
  32. 'background': this.dataConfig.bottomBgColor.color[0].item,
  33. };
  34. },
  35. blankStyle() {
  36. let borderRadius = `${this.dataConfig.fillet.val * 2}rpx`;
  37. if (this.dataConfig.fillet.type) {
  38. borderRadius = `${this.dataConfig.fillet.valList[0].val * 2}rpx ${this.dataConfig.fillet.valList[1].val * 2}rpx ${this.dataConfig.fillet.valList[3].val * 2}rpx ${this.dataConfig.fillet.valList[2].val * 2}rpx`;
  39. }
  40. return {
  41. 'height': `${this.dataConfig.heightConfig.val * 2}rpx`,
  42. 'border-radius': borderRadius,
  43. 'background': this.dataConfig.bgColor.color[0].item
  44. };
  45. },
  46. },
  47. created() {},
  48. methods: {
  49. }
  50. }
  51. </script>
  52. <style lang="scss">
  53. .blankPage {
  54. .bankCon {
  55. width: 100%;
  56. height: 100%;
  57. background-color: blue;
  58. }
  59. }
  60. </style>