Browse Source

增加悬浮按钮-大党委

release
ZhaoTongYao 3 years ago
parent
commit
48c9f10539
  1. 47
      components/moveButton/moveButton.js
  2. 3
      components/moveButton/moveButton.json
  3. 8
      components/moveButton/moveButton.wxml
  4. 34
      components/moveButton/moveButton.wxss
  5. 5
      components/project/project.js
  6. 30
      pages/index/index.js
  7. 1
      pages/index/index.json
  8. 5
      pages/index/index.wxml
  9. 10
      pages/project/project.js
  10. 10
      project.private.config.json

47
components/moveButton/moveButton.js

@ -0,0 +1,47 @@
Component({
data: {
},
properties: {
areaTop: {
type: Number,
value: 0
},
areaLeft: {
type: Number,
value: 0
},
areaWidth: {
type: String,
value: '100%'
},
areaHeight: {
type: String,
value: '100%'
},
buttonWidth: {
type: Number,
value: 178
},
buttonHeight: {
type: Number,
value: 178
},
buttonTop: {
type: Number,
value: 1000
},
buttonLeft: {
type: Number,
value: 580
},
imgUrl: {
type: String,
value: ''
}
},
methods: {
onClickButton () {
this.triggerEvent('movebtnCallBack')
}
}
})

3
components/moveButton/moveButton.json

@ -0,0 +1,3 @@
{
"component": true
}

8
components/moveButton/moveButton.wxml

@ -0,0 +1,8 @@
<movable-area class="movable-area" style="top:{{areaTop}}rpx;left:{{areaLeft}}rpx;width:{{areaWidth}};height:{{areaHeight}};">
<movable-view class="movable-view" direction="all" inertia="true" friction="10"
style="width:{{buttonWidth}}rpx;height:{{buttonHeight}}rpx;top:{{buttonTop}}rpx;left:{{buttonLeft}}rpx;">
<view class="img-box" bindtap="onClickButton">
<image src="{{imgUrl}}" />
</view>
</movable-view>
</movable-area>

34
components/moveButton/moveButton.wxss

@ -0,0 +1,34 @@
/* 悬浮按钮 -start- */
.movable-area{
pointer-events:none;
z-index: 999;
width: 100%;
height: 90%;
position: fixed;
top: 60px;
left: 0;
right: 0;
bottom: 0;
}
.movable-view{
pointer-events:auto;
width: 178rpx;
height: 178rpx;
transform: translateX(0rpx) translateY(0rpx) translateZ(0rpx) scale(1);
transform-origin: center center;
will-change: auto;
position: absolute;
top: 0rpx;
left: 0rpx;
}
.img-box {
width: 100%;
height: 100%;
}
.img-box image {
width: 100%;
height: 100%;
object-fit: cover;
}
/* 悬浮按钮 -end- */

5
components/project/project.js

@ -28,7 +28,7 @@ Component({
},
methods: {
getItemList: function (page, index, clear) {
getItemList: function (page, index, clear, isPartyFlag=0) {
// wx.showLoading({
// title: '加载中',
// })
@ -55,7 +55,8 @@ Component({
"pageIndex": page,
"pageSize": app.globalData.pageSize,
"timestamp": utils.formatTimeOpen(new Date(), '-', ':'),
"itemState": itemState
"itemState": itemState,
"isPartyFlag": isPartyFlag
}
console.log("params:" + JSON.stringify(params))
api.getItemList(params).then(function (res) {

30
pages/index/index.js

@ -20,6 +20,7 @@ Page({
joinFlag: true,
buttonName:'', // 获取点击按钮的名字
qrCodeId: '',
floatButton: {}
},
onLoad: function() {
// this.checkUpdateAvatar()
@ -48,8 +49,18 @@ Page({
getIndexPanel: function() {
let that = this
api.indexPanel().then(function(res) {
res.data.forEach(item => {
if (item.templateInfo.templateCode == 'dadangwei') {
that.data.floatButton.icon = item.childNav[0].icon,
that.data.floatButton.code = item.childNav[0].navCode,
that.data.floatButton.label = item.childNav[0].label
} else {
that.data.panel.push(item)
}
})
that.setData({
panel: res.data
floatButton: that.data.floatButton,
panel: that.data.panel
})
console.log('panel', res.data)
that.getIndexStatistics()
@ -584,4 +595,21 @@ Page({
}
})
},
// 点击悬浮按钮 大党委
clickMoveButton () {
const tabMenu = [
{
label: '待处理'
},
{
label: '已结案'
},
{
label: '已关闭'
}
]
wx.navigateTo({
url: '/pages/project/project?state=0&childNav=' + JSON.stringify(tabMenu) + '&isPartyFlag=1'
})
}
})

1
pages/index/index.json

@ -3,6 +3,7 @@
"navigationBarBackgroundColor": "#BB0300",
"navigationBarTextStyle": "white",
"usingComponents": {
"move-btn": "/components/moveButton/moveButton",
"wux-icon": "../../dist/icon/index",
"wux-grids": "../../dist/grids/index",
"wux-grid": "../../dist/grid/index",

5
pages/index/index.wxml

@ -91,4 +91,7 @@
</block>
</view>
</view>
</view>
<!-- 悬浮按钮 -->
<move-btn wx:if="{{floatButton}}" button-width="142" button-height="142" button-left="620" area-top="120" area-height="85%" img-url="{{floatButton.icon}}" bindmovebtnCallBack="clickMoveButton"></move-btn>

10
pages/project/project.js

@ -24,6 +24,7 @@ Page({
title: 'Tab 4',
},
],
isPartyFlag: 0
},
onLoad: function (options) {
const temp = Number(options.state) + 1
@ -31,26 +32,27 @@ Page({
key: 'tab' + temp,
index: options.state,
childNav: JSON.parse(options.childNav),
isPartyFlag: options.isPartyFlag ? options.isPartyFlag : 0
})
},
onShow: function (options) {
this.setData({
indexPage:1
})
this.selectComponent("#state-" + this.data.index).getItemList(1, this.data.index, 0)
this.selectComponent("#state-" + this.data.index).getItemList(1, this.data.index, 0, this.data.isPartyFlag)
},
onReachBottom: function () {
this.setData({
indexPage: this.data.indexPage + 1
})
this.selectComponent("#state-" + this.data.index).getItemList(this.data.indexPage,this.data.index,1)
this.selectComponent("#state-" + this.data.index).getItemList(this.data.indexPage, this.data.index, 1, this.data.isPartyFlag)
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function (options) {
this.selectComponent("#state-" + this.data.index).getItemList(1, this.data.index, 0)
this.selectComponent("#state-" + this.data.index).getItemList(1, this.data.index, 0, this.data.isPartyFlag)
wx.stopPullDownRefresh();
},
onChange(e) {
@ -67,7 +69,7 @@ Page({
index,
indexPage: 1
})
this.selectComponent("#state-" + this.data.index).getItemList(this.data.indexPage,this.data.index,0)
this.selectComponent("#state-" + this.data.index).getItemList(this.data.indexPage, this.data.index, 0, this.data.isPartyFlag)
},
onSwiperChange(e) {
console.log('onSwiperChange', e)

10
project.private.config.json

@ -1,7 +1,7 @@
{
"projectname": "epdc-office-mp-yushan",
"setting": {
"compileHotReLoad": true
},
"description": "项目私有配置文件。此文件中的内容将覆盖 project.config.json 中的相同字段。项目的改动优先同步到此文件中。详见文档:https://developers.weixin.qq.com/miniprogram/dev/devtools/projectconfig.html"
"projectname": "榆山工作端",
"setting": {
"compileHotReLoad": true
},
"description": "项目私有配置文件。此文件中的内容将覆盖 project.config.json 中的相同字段。项目的改动优先同步到此文件中。详见文档:https://developers.weixin.qq.com/miniprogram/dev/devtools/projectconfig.html"
}
Loading…
Cancel
Save