blankPage.vue 1.4 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768
  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 = [];
  37. if (this.dataConfig.fillet.type) {
  38. for (let i = 0; i < this.dataConfig.fillet.valList.length; i++) {
  39. borderRadius.push(`${this.dataConfig.fillet.valList[i].val * 2}rpx`);
  40. }
  41. } else {
  42. borderRadius = [`${this.dataConfig.fillet.val * 2}rpx`];
  43. }
  44. return {
  45. 'height': `${this.dataConfig.heightConfig.val * 2}rpx`,
  46. 'border-radius': borderRadius.join(' '),
  47. 'background': this.dataConfig.bgColor.color[0].item,
  48. };
  49. },
  50. },
  51. created() {},
  52. methods: {
  53. }
  54. }
  55. </script>
  56. <style lang="scss">
  57. .blankPage {
  58. .bankCon {
  59. width: 100%;
  60. height: 100%;
  61. background-color: blue;
  62. }
  63. }
  64. </style>