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 | 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 | 30 | \ No newline at end of file | ... | ... |