window.vue 1.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778
  1. <template>
  2. <view class="diy-window" :style="diyitem.base.bgstyle">
  3. <!-- display -->
  4. <view class="display">
  5. <!-- 1 -->
  6. <view class="display-left">
  7. <image @tap="navigateTo" :data-url="diyitem.list[0].link"
  8. :src="diyitem.list[0].img">
  9. </image>
  10. </view>
  11. <!-- 2 -->
  12. <view v-if="diyitem.base.style == 'style3'" class="display-right">
  13. <image @tap="navigateTo" :data-url="diyitem.list[1].link"
  14. :src="diyitem.list[1].img">
  15. </image>
  16. </view>
  17. <!-- 3 -->
  18. <view v-if="diyitem.base.style == 'style2'" class="display-right">
  19. <view class="display-right1">
  20. <image @tap="navigateTo" :data-url="diyitem.list[1].link"
  21. :src="diyitem.list[1].img">
  22. </image>
  23. </view>
  24. <view class="display-right2">
  25. <image @tap="navigateTo" :data-url="diyitem.list[2].link"
  26. :src="diyitem.list[2].img">
  27. </image>
  28. </view>
  29. </view>
  30. <!-- 4 -->
  31. <view v-if="diyitem.base.style == 'style1'" class="display-right">
  32. <view class="display-right1">
  33. <image @tap="navigateTo" :data-url="diyitem.list[1].link"
  34. :src="diyitem.list[1].img">
  35. </image>
  36. </view>
  37. <view class="display-right2">
  38. <view class="left">
  39. <image @tap="navigateTo" :data-url="diyitem.list[2].link"
  40. :src="diyitem.list[2].img"></image>
  41. </view>
  42. <view class="right">
  43. <image @tap="navigateTo" :data-url="diyitem.list[3].link"
  44. :src="diyitem.list[3].img"></image>
  45. </view>
  46. </view>
  47. </view>
  48. </view>
  49. </view>
  50. </template>
  51. <script>
  52. export default {
  53. name: 'window',
  54. props: {
  55. diyitem: {
  56. type: Object,
  57. default () {
  58. return {};
  59. }
  60. }
  61. },
  62. computed: {
  63. },
  64. data() {
  65. return {};
  66. },
  67. methods: {
  68. navigateTo: function(e) {
  69. this.sam.diynavigateTo(e)
  70. }
  71. }
  72. };
  73. </script>
  74. <style>
  75. @import './diyapge.css';
  76. </style>