index.vue 1.1 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859
  1. <template>
  2. <view class="U000009-template1" :style="wrapper_style">
  3. <!-- style -->
  4. <view :style="border_style"></view>
  5. </view>
  6. </template>
  7. <script>
  8. export default {
  9. props: ['datas', 'styles'],
  10. data() {
  11. return{
  12. }
  13. },
  14. computed: {
  15. /** 样式 */
  16. wrapper_style() {
  17. if(this.datas.preview_color) {
  18. const {
  19. preview_color,
  20. border_padding,
  21. search_height,
  22. } = this.datas;
  23. return `
  24. background-color: ${preview_color.color};
  25. background-image: url(${preview_color.isColor == 2? preview_color.image: ''});
  26. background-size: 100% auto;
  27. bakcground-position: center;
  28. padding: ${search_height/2}px ${border_padding}px;
  29. `;
  30. }
  31. },
  32. border_style() {
  33. const {
  34. line_style,
  35. border_color,
  36. border_weight
  37. } = this.datas;
  38. return `
  39. width: 100%;
  40. border-top: ${border_weight}px ${line_style} ${border_color};
  41. `;
  42. }
  43. },
  44. methods: {
  45. },
  46. };
  47. </script>
  48. <style lang="less" scoped>
  49. // 默认
  50. .component-wrapper {
  51. width: 750rpx;
  52. }
  53. </style>