| @@ -148,6 +148,38 @@ Component({ | |||||
| } | } | ||||
| }, | }, | ||||
| methods: { | methods: { | ||||
| getList: function () { | |||||
| let that = this; | |||||
| let data = { | |||||
| pageNum: page, | |||||
| pageSize: 8 | |||||
| }; | |||||
| Http.get({ | |||||
| url: config.api.merchantList, | |||||
| data: data | |||||
| }).then(res => { | |||||
| wx.hideLoading(); | |||||
| if (page == 1) { | |||||
| that.setData({ | |||||
| merchantVoList: [], | |||||
| }) | |||||
| } | |||||
| var tmpArr = that.data.merchantVoList; | |||||
| tmpArr.push.apply(tmpArr, res.data.list); | |||||
| that.setData({ | |||||
| merchantVoList: tmpArr | |||||
| }) | |||||
| }) | |||||
| .catch(err => { | |||||
| wx.hideLoading(); | |||||
| wx.showToast({ | |||||
| title: err.errMsg, | |||||
| icon: 'none', | |||||
| duration: 2000, | |||||
| mask: false | |||||
| }); | |||||
| }) | |||||
| }, | |||||
| bindMultiPickerChange(e){ | bindMultiPickerChange(e){ | ||||
| this.setData({ | this.setData({ | ||||
| value: this.data.multiArray[0][e.detail.value[0]] + this.data.multiArray[1][e.detail.value[1]] | value: this.data.multiArray[0][e.detail.value[0]] + this.data.multiArray[1][e.detail.value[1]] | ||||
| @@ -3,10 +3,10 @@ | |||||
| <view class="weui-search-bar__form"> | <view class="weui-search-bar__form"> | ||||
| <view class="weui-search-bar__box" style="position:relative;"> | <view class="weui-search-bar__box" style="position:relative;"> | ||||
| <icon class="weui-icon-search_in-box" type="search" size="12"></icon> | <icon class="weui-icon-search_in-box" type="search" size="12"></icon> | ||||
| <input type="text" class="weui-search-bar__input" placeholder="{{placeholder}}" value="{{value}}" bindblur="inputBlur" bindfocus="inputFocus" bindinput="inputChange" /> | |||||
| <input type="text" class="weui-search-bar__input" placeholder="{{placeholder}}" value="{{value}}" bindfocus="inputFocus" bindinput="inputChange" disabled /> | |||||
| <picker class="pickers" mode="multiSelector" bindchange="bindMultiPickerChange" bindcolumnchange="bindMultiPickerColumnChange" value="{{multiIndex}}" range="{{multiArray}}"> | <picker class="pickers" mode="multiSelector" bindchange="bindMultiPickerChange" bindcolumnchange="bindMultiPickerColumnChange" value="{{multiIndex}}" range="{{multiArray}}"> | ||||
| <view class="picker"> | <view class="picker"> | ||||
| 搜索 | |||||
| 搜索搜索搜索搜索搜索搜索搜索搜索搜索搜索 | |||||
| </view> | </view> | ||||
| </picker> | </picker> | ||||
| <view class="weui-icon-clear" wx:if="{{value.length > 0}}" bindtap="clearInput" style="z-index:500000;"> | <view class="weui-icon-clear" wx:if="{{value.length > 0}}" bindtap="clearInput" style="z-index:500000;"> | ||||
| @@ -20,8 +20,31 @@ | |||||
| </view> | </view> | ||||
| <view wx:if="{{cancel && searchState}}" class="weui-search-bar__cancel-btn" bindtap="hideInput">{{cancelText}}</view> | <view wx:if="{{cancel && searchState}}" class="weui-search-bar__cancel-btn" bindtap="hideInput">{{cancelText}}</view> | ||||
| </view> | </view> | ||||
| <mp-cells class="searchbar-result {{extClass}}" wx:if="{{searchState && result.length > 0}}"> | |||||
| <!-- <mp-cells class="searchbar-result {{extClass}}" wx:if="{{searchState && result.length > 0}}"> | |||||
| <mp-cell bindtap="selectResult" data-index="{{index}}" wx:for="{{result}}" hover> | <mp-cell bindtap="selectResult" data-index="{{index}}" wx:for="{{result}}" hover> | ||||
| <view>{{item.text}}</view> | <view>{{item.text}}</view> | ||||
| </mp-cell> | </mp-cell> | ||||
| </mp-cells> | |||||
| </mp-cells> --> | |||||
| <view class='lists'> | |||||
| <view class='posi' wx:if="{{merchantVoList.length>0}}" style="padding-bottom:100rpx;"> | |||||
| <view class='posi_logo' wx:for="{{merchantVoList}}" wx:key="index"> | |||||
| <view class='merchants' bindtap='gotoDetail' data-id='{{item.id}}'> | |||||
| <view style=' margin-left: 24rpx;margin-top: 24rpx;'> | |||||
| <image src='{{item.merchantImgUrl}}'></image> | |||||
| </view> | |||||
| <view class='leftBox'> | |||||
| <view class='merchantName'>{{item.merchantName}}</view> | |||||
| <view class='shopVo'> | |||||
| <view class='shopVoList' > | |||||
| <text wx:for="{{item.shopVoList}}" wx:key="{{index}}" wx:for-item="itemName">{{itemName.buildingName}}{{itemName.floorName}}--{{itemName.shopNumber}}</text> | |||||
| </view> | |||||
| </view> | |||||
| </view> | |||||
| </view> | |||||
| <image wx:if="{{item.linkLinePhone}}" bindtap='phone' data-merchantLinkPhone='{{item.linkLinePhone}}' class="tel" src="{{teljpgUrl}}" mode="widthFix" /> | |||||
| </view> | |||||
| </view> | |||||
| <view class='position' wx:if="{{merchantVoList.length==0}}"> | |||||
| 暂无数据 | |||||
| </view> | |||||
| </view> | |||||
| @@ -1,7 +1,7 @@ | |||||
| @import "../../weui.wxss"; | @import "../../weui.wxss"; | ||||
| .weui-search-bar{position:relative;padding:8px;display:flex;box-sizing:border-box;background-color:#EDEDED;-webkit-text-size-adjust:100%;align-items:center}.weui-icon-search{margin-right:8px;font-size:14px;vertical-align:top;margin-top:.64em;height:1em;line-height:1em}.weui-icon-search_in-box{position:absolute;left:12px;top:50%;margin-top:-8px}.weui-search-bar__text{display:inline-block;font-size:14px;vertical-align:top}.weui-search-bar__form{position:relative;flex:auto;border-radius:4px;background:#FFFFFF}.weui-search-bar__box{position:relative;padding-left:32px;padding-right:32px;width:100%;box-sizing:border-box;z-index:1}.weui-search-bar__input{height:32px;line-height:32px;font-size:14px;caret-color:#07C160}.weui-icon-clear{position:absolute;top:0;right:0;bottom:0;padding:0 12px;font-size:0}.weui-icon-clear:after{content:"";height:100%;vertical-align:middle;display:inline-block;width:0;overflow:hidden}.weui-search-bar__label{position:absolute;top:0;right:0;bottom:0;left:0;z-index:2;border-radius:4px;text-align:center;color:rgba(0,0,0,0.5);background:#FFFFFF;line-height:32px}.weui-search-bar__cancel-btn{margin-left:8px;line-height:32px;color:#576B95;white-space:nowrap} | .weui-search-bar{position:relative;padding:8px;display:flex;box-sizing:border-box;background-color:#EDEDED;-webkit-text-size-adjust:100%;align-items:center}.weui-icon-search{margin-right:8px;font-size:14px;vertical-align:top;margin-top:.64em;height:1em;line-height:1em}.weui-icon-search_in-box{position:absolute;left:12px;top:50%;margin-top:-8px}.weui-search-bar__text{display:inline-block;font-size:14px;vertical-align:top}.weui-search-bar__form{position:relative;flex:auto;border-radius:4px;background:#FFFFFF}.weui-search-bar__box{position:relative;padding-left:32px;padding-right:32px;width:100%;box-sizing:border-box;z-index:1}.weui-search-bar__input{height:32px;line-height:32px;font-size:14px;caret-color:#07C160}.weui-icon-clear{position:absolute;top:0;right:0;bottom:0;padding:0 12px;font-size:0}.weui-icon-clear:after{content:"";height:100%;vertical-align:middle;display:inline-block;width:0;overflow:hidden}.weui-search-bar__label{position:absolute;top:0;right:0;bottom:0;left:0;z-index:2;border-radius:4px;text-align:center;color:rgba(0,0,0,0.5);background:#FFFFFF;line-height:32px}.weui-search-bar__cancel-btn{margin-left:8px;line-height:32px;color:#576B95;white-space:nowrap} | ||||
| .pickers{ | .pickers{ | ||||
| width:100%; | |||||
| width:560rpx; | |||||
| height: 64rpx; | height: 64rpx; | ||||
| position: absolute; | position: absolute; | ||||
| left: 0; | left: 0; | ||||
| @@ -9,4 +9,45 @@ | |||||
| bottom: 0; | bottom: 0; | ||||
| margin: auto; | margin: auto; | ||||
| color: transparent; | color: transparent; | ||||
| } | |||||
| .picker{ | |||||
| position: relative; | |||||
| z-index: 10000; | |||||
| width:496rpx; | |||||
| height: 64rpx; | |||||
| overflow: hidden; | |||||
| } | |||||
| .posi { | |||||
| position: relative; | |||||
| width: 616rpx; | |||||
| float: right; | |||||
| } | |||||
| .posi>view:nth-child(2) { | |||||
| width: 100%; | |||||
| display: flex; | |||||
| justify-content: space-between; | |||||
| box-sizing: border-box; | |||||
| } | |||||
| .posi>view:nth-child(2) text:nth-child(1) { | |||||
| font-size: 30rpx; | |||||
| color: #a9a9a9; | |||||
| } | |||||
| .posi>view:nth-child(2) text:nth-child(2) { | |||||
| font-size: 30rpx; | |||||
| color: #a9a9a9; | |||||
| } | |||||
| .posi_logo { | |||||
| position: relative; | |||||
| width:576rpx!important; | |||||
| height:176rpx; | |||||
| background:rgba(255,255,255,1); | |||||
| box-shadow:0px 4rpx 8rpx 0px rgba(0,0,0,0.04); | |||||
| border-radius:16rpx; | |||||
| margin: 20rpx; | |||||
| overflow: hidden; | |||||
| } | } | ||||