| <template> |
| <container if="{{!ds.isHide}}"> |
| <image if={{ds.floorTitle}} class="title" src="{{ds.floorTitle}}"></image> |
| <slider class="slider" show-indicators="true" auto-play="true" interval="3000"> |
| <container class="pannel" repeat="{{ds.bannerItems}}"> |
| <container> |
| <banner style="margin-bottom:4" width="{{NUMBER_251}}" height="{{NUMBER_292}}" |
| src="{{img1}}" |
| href="{{url1}}"></banner> |
| <banner width="{{NUMBER_251}}" height="{{NUMBER_292}}" |
| src="{{img2}}" |
| href="{{url2}}"></banner> |
| </container> |
| <container class="middle-col"> |
| <banner width="{{NUMBER_240}}" height="{{NUMBER_588}}" |
| src="{{img3}}" |
| href="{{url3}}"></banner> |
| </container> |
| <container> |
| <banner style="margin-bottom:4" width="{{NUMBER_251}}" height="{{NUMBER_292}}" |
| src="{{img4}}" |
| href="{{url4}}"></banner> |
| <banner width="{{NUMBER_251}}" height="{{NUMBER_292}}" |
| src="{{img5}}" |
| href="{{url5}}"></banner> |
| </container> |
| </container> |
| <indicator |
| style="position:absolute;width:714;height:200;left:10;bottom:-80;itemSize:20;itemColor:#999999;itemSelectedColor:#000000;"></indicator> |
| </slider> |
| </container> |
| </template> |
| <style> |
| .title { |
| width: 750; |
| height: 100; |
| } |
| |
| .slider { |
| height: 652; |
| } |
| |
| .pannel { |
| width: 750; |
| height: 592; |
| flex-direction: row; |
| } |
| |
| .middle-col { |
| margin-left:4; |
| margin-right:4; |
| width: 240; |
| height: 588; |
| } |
| </style> |
| <script> |
| module.exports = { |
| data: { |
| NUMBER_251: 251, |
| NUMBER_240: 240, |
| NUMBER_292: 292, |
| NUMBER_588: 588 |
| }, |
| methods: { |
| ready: function () { |
| var self = this; |
| var ds = self.ds; |
| if (!ds || !ds.bannerItems) return; |
| var bannerItems = ds.bannerItems; |
| for (var i = 0; i < bannerItems.length; i++) { |
| bannerItems[i].index = i; |
| } |
| } |
| } |
| } |
| </script> |