Commit b3983c67268135bdc9972c5d0d485af2d0034a60
1 parent
24300617
悬浮集组件
Showing
4 changed files
with
100 additions
and
0 deletions
components/diy_floatingBox/diy_floatingBox.js
0 → 100644
| 1 | +// components/div_floatingBox/div_floatingBox.js | ||
| 2 | +Component({ | ||
| 3 | + /** | ||
| 4 | + * 组件的属性列表 | ||
| 5 | + */ | ||
| 6 | + properties: { | ||
| 7 | + farr:{ | ||
| 8 | + type: Object, | ||
| 9 | + value:null | ||
| 10 | + }, | ||
| 11 | + loaction_index: { | ||
| 12 | + type: Number, | ||
| 13 | + value: 0, | ||
| 14 | + }, | ||
| 15 | + is_show_top: { | ||
| 16 | + type: Number, | ||
| 17 | + value: 0, | ||
| 18 | + }, | ||
| 19 | + }, | ||
| 20 | + | ||
| 21 | + /** | ||
| 22 | + * 组件的初始数据 | ||
| 23 | + */ | ||
| 24 | + data: { | ||
| 25 | + | ||
| 26 | + }, | ||
| 27 | + | ||
| 28 | + /** | ||
| 29 | + * 组件的方法列表 | ||
| 30 | + */ | ||
| 31 | + methods: { | ||
| 32 | + scrollfn(){ | ||
| 33 | + wx.pageScrollTo({ | ||
| 34 | + scrollTop: 0, | ||
| 35 | + duration: 300 | ||
| 36 | + }) | ||
| 37 | + } | ||
| 38 | + } | ||
| 39 | +}) |
components/diy_floatingBox/diy_floatingBox.json
0 → 100644
components/diy_floatingBox/diy_floatingBox.wxml
0 → 100644
| 1 | +<!--components/div_floatingBox/div_floatingBox.wxml--> | ||
| 2 | +<view class="floatingBox" style="{{loaction_index==1 ? 'right: 0;padding-right:2rpx' :'left: 0;padding-left:2rpx;'}}"> | ||
| 3 | + <block wx:for="{{farr}}"> | ||
| 4 | + <!--悬浮窗口--> | ||
| 5 | + <block wx:if="{{item.ename=='floatingWindow'}}" > | ||
| 6 | + <view wx:for="{{item.content.data}}" wx:for-item="ite" style="margin: 10rpx 0;"> | ||
| 7 | + <floatingWindow object="{{ite}}"></floatingWindow> | ||
| 8 | + </view> | ||
| 9 | + </block> | ||
| 10 | + <!--在线上客服--> | ||
| 11 | + <view wx:if="{{item.ename=='onlineService'}}" style="margin: 10rpx 0;"> | ||
| 12 | + <service object="{{item.content}}"></service> | ||
| 13 | + </view> | ||
| 14 | + <!--扫一扫--> | ||
| 15 | + <view wx:if="{{item.ename=='scan'}}" style="margin: 10rpx 0;"> | ||
| 16 | + <scan object="{{item.content}}"></scan> | ||
| 17 | + </view> | ||
| 18 | + <!--返回顶部--> | ||
| 19 | + <view wx:if="{{item.ename=='backTop' && is_show_top==1}}" catchtap="scrollfn" class="backTop" style="margin: 10rpx 0;"> | ||
| 20 | + <!-- <scan object="{{item.content}}"></scan> --> | ||
| 21 | + <image src="{{item.content.img}}" style="width: 50rpx;height: 50rpx;"></image> | ||
| 22 | + </view> | ||
| 23 | + </block> | ||
| 24 | +</view> | ||
| 0 | \ No newline at end of file | 25 | \ No newline at end of file |
components/diy_floatingBox/diy_floatingBox.wxss
0 → 100644
| 1 | +/* components/div_floatingBox/div_floatingBox.wxss */ | ||
| 2 | + | ||
| 3 | +.floatingBox { | ||
| 4 | + /* width: 100rpx; */ | ||
| 5 | + height: 750rpx; | ||
| 6 | + position: fixed; | ||
| 7 | + /* top:0; */ | ||
| 8 | + bottom: 300rpx; | ||
| 9 | + /* margin: auto; */ | ||
| 10 | + /* background-color: red; */ | ||
| 11 | + display: flex; | ||
| 12 | + align-items: center; | ||
| 13 | + flex-direction: column; | ||
| 14 | + justify-content: flex-end; | ||
| 15 | + /* justify-content: space-around; */ | ||
| 16 | +} | ||
| 17 | + | ||
| 18 | +.backTop { | ||
| 19 | + width: 80rpx; | ||
| 20 | + height: 80rpx; | ||
| 21 | + border-radius: 50%; | ||
| 22 | + z-index: 100; | ||
| 23 | + background-color: #fff; | ||
| 24 | + border: 1px solid #adadad; | ||
| 25 | + box-shadow: 0 0 10px 2px #adadad; | ||
| 26 | + display: flex; | ||
| 27 | + align-items: center; | ||
| 28 | + justify-content: center; | ||
| 29 | +} | ||
| 0 | \ No newline at end of file | 30 | \ No newline at end of file |