Skip to content

Commit

Permalink
添加发起修改功能,联系方式修改等一系列功能
Browse files Browse the repository at this point in the history
  • Loading branch information
dmego committed Dec 3, 2017
1 parent 43e797a commit 8870730
Show file tree
Hide file tree
Showing 45 changed files with 3,098 additions and 667 deletions.
2 changes: 1 addition & 1 deletion app.js
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ var common = require("utils/common.js");
const __utils = require('utils/util')
Bmob.initialize("9f1068e931203bfa908f26353f9d8080", "396e699e6cda7e452ef36e9effe5ef35");
App({
version: 'v2.1.0', //版本号
version: 'v2.2.0', //版本号
onLaunch: function () {
var that = this;
//调用系统API获取设备的信息
Expand Down
1 change: 1 addition & 0 deletions app.json
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,7 @@
"pages/showinmap/showinmap",
"pages/message/message",
"pages/logs/logs",
"pages/updAct/updAct",
"pages/my/projectbrief/projectbrief",
"pages/my/aboutus/aboutus",
"pages/my/myjoin/myjoin",
Expand Down
2 changes: 2 additions & 0 deletions app.wxss
Original file line number Diff line number Diff line change
@@ -1,4 +1,6 @@
/**app.wxss**/
@import 'components/wux.wxss';

page{
font-family: -apple-system-font, Helvetica Neue, Helvetica, sans-serif;
font-size: 10pt;
Expand Down
135 changes: 135 additions & 0 deletions components/button/button.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,135 @@
import Component from '../component'

export default {
/**
* 默认参数
*/
setDefaults() {
return {
className: undefined,
position: `bottomRight`,
backdrop: !1,
buttons: [],
buttonClicked() {},
callback() {},
}
},
/**
* 默认数据
*/
data() {
return [
{
type: `topLeft`,
className: `speed-dial-top-left`,
},
{
type: `topRight`,
className: `speed-dial-top-right`,
},
{
type: `bottomLeft`,
className: `speed-dial-bottom-left`,
},
{
type: `bottomRight`,
className: `speed-dial-bottom-right`,
}
]
},
/**
* 浮动按钮组件
* @param {Object} opts 配置项
* @param {String} id 唯一标识
* @param {String} opts.className 自定义类名
* @param {String} opts.position 按钮的位置,可选值 topLeft、topRight、bottomLeft、bottomRight
* @param {Boolean} opts.backdrop 是否显示透明蒙层
* @param {Array} opts.buttons 按钮
* @param {String} opts.buttons.className 按钮的类名
* @param {String} opts.buttons.label 按钮的文字
* @param {String} opts.buttons.icon 按钮的图标
* @param {Function} opts.buttonClicked 按钮点击事件
* @param {Function} opts.callback 监听状态变化的回调函数
*/
init(id, opts = {}) {
const options = Object.assign({
animateCss: undefined,
visible: !1,
}, this.setDefaults(), opts)

const BUTTON_TYPES = this.data()

// 判断提示类型,显示对应的位置
BUTTON_TYPES.forEach((value, key) => {
if (value.type === options.position) {
options.className = options.className ? `${value.className} ${options.className}` : value.className
}
})

// 切换状态
const toggle = (vm, opened = !1) => {
vm.setData({
[`$wux.button.${id}.opened`]: opened
})
if (typeof options.callback === `function`) {
options.callback(vm, opened)
}
}

// 实例化组件
const component = new Component({
scope: `$wux.button.${id}`,
data: options,
methods: {
/**
* 隐藏
*/
hide() {
if (this.removed) return !1
this.removed = !0
this.setHidden()
},
/**
* 显示
*/
show() {
if (this.removed) return !1
this.setVisible()
},
/**
* 关闭
*/
close () {
if (!this.opened) return !1
this.opened = !1
toggle(this, !1)
},
/**
* 打开
*/
open () {
if (this.opened) return !1
this.opened = !0
toggle(this, !0)
},
/**
* 按钮点击事件
*/
buttonClicked (e) {
const index = e.currentTarget.dataset.index
if (options.buttonClicked(index, options.buttons[index]) === true) {
this.close()
}
},
/**
* 切换状态
*/
toggle (e) {
!this.opened ? this.open() : this.close()
},
},
})
component.show()
return component
},
}
15 changes: 15 additions & 0 deletions components/button/button.wxml
Original file line number Diff line number Diff line change
@@ -0,0 +1,15 @@
<template name="button">
<view class="weui-mask_transparent" wx:if="{{ backdrop && opened }}"></view>
<view class="speed-dial {{ className }} {{ animateCss }} {{ opened ? 'speed-dial-opened' : '' }}" data-opened="{{ opened }}" bindtap="{{ toggle }}" wx:if="{{ visible }}">
<view class="floating-button" hover-class="active-state">
<text class="speed-dial-icon"></text>
</view>
<view class="speed-dial-buttons" wx:if="{{ buttons.length }}">
<block wx:for="{{ buttons }}" wx:key="">
<view class="speed-dial-button {{ item.className }}" data-index="{{ index }}" data-label="{{ item.label }}" catchtap="{{ buttonClicked }}" hover-class="active-state">
<image class="speed-dial-icon" src="{{ item.icon }}" />
</view>
</block>
</view>
</view>
</template>
164 changes: 164 additions & 0 deletions components/component.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,164 @@
/**
* 模块化组件
* @param {Object} options 配置项
* @param {String} options.scope 组件的命名空间
* @param {Object} options.data 组件的动态数据
* @param {Object} options.methods 组件的事件函数
*/
class Component {
constructor(options = {}) {
Object.assign(this, {
options,
})
this.__init()
}

/**
* 初始化
*/
__init() {
this.page = getCurrentPages()[getCurrentPages().length - 1]
const setData = this.page.setData.bind(this.page)

// 检查版本库是否高于或等于 1.5.0,setData 方法才有回调函数,否则采用 setTimeout 模拟
const checkSDKVersion = () => {
let has = false

try {
const res = wx.getSystemInfoSync()
const SDKVersion = res.SDKVersion.split('.')
has = Number(SDKVersion[0]) > 1 || Number(SDKVersion[1]) >= 5
} catch (e) {}

return has
}

// 重写 setData 方法,支持回调,兼容低版本
this.setData = (obj = {}, cb = () => ({})) => {
const fn = () => {
if (typeof cb === 'function') {
cb()
}
}

if (checkSDKVersion()) {
setData(obj, fn)
} else {
setData(obj)
setTimeout(fn, 0)
}
}

this.__initState()
}

/**
* 初始化组件状态
*/
__initState() {
this.options.data && this.__initData()
this.options.methods && this.__initMethods()
}

/**
* 绑定组件动态数据
*/
__initData() {
const scope = this.options.scope
const data = this.options.data

this._data = {}

// 筛选非函数类型,更改参数中函数的 this 指向
if (!this.isEmptyObject(data)) {
for (let key in data) {
if (data.hasOwnProperty(key)) {
if (typeof data[key] === `function`) {
data[key] = data[key].bind(this)
} else {
this._data[key] = data[key]
}
}
}
}

// 将数据同步到 page.data 上面方便渲染组件
this.page.setData({
[`${scope}`]: this._data,
})
}

/**
* 绑定组件事件函数
*/
__initMethods() {
const scope = this.options.scope
const methods = this.options.methods

// 筛选函数类型
if (!this.isEmptyObject(methods)) {
for (let key in methods) {
if (methods.hasOwnProperty(key) && typeof methods[key] === `function`) {
this[key] = methods[key] = methods[key].bind(this)

// 将 methods 内的方法重命名并挂载到 page 上面,否则 template 内找不到事件
this.page[`${scope}.${key}`] = methods[key]

// 将方法名同步至 page.data 上面,方便在模板内使用 {{ method }} 方式绑定事件
this.setData({
[`${scope}.${key}`]: `${scope}.${key}`,
})
}
}
}
}

/**
* 获取组件的 data 数据
*/
getComponentData() {
let data = this.page.data
let name = this.options.scope && this.options.scope.split(`.`)

name.forEach((n, i) => {
data = data[n]
})

return data
}

/**
* 判断 object 是否为空
*/
isEmptyObject(e) {
for (let t in e)
return !1
return !0
}

/**
* 设置元素显示
*/
setVisible(className = `weui-animate-fade-in`) {
this.setData({
[`${this.options.scope}.animateCss`]: className,
[`${this.options.scope}.visible`]: !0,
})
}

/**
* 设置元素隐藏
*/
setHidden(className = `weui-animate-fade-out`, timer = 300) {
this.setData({
[`${this.options.scope}.animateCss`]: className,
})
setTimeout(() => {
this.setData({
[`${this.options.scope}.visible`]: !1,
})
}, timer)
}
}

export default Component
Loading

0 comments on commit 8870730

Please sign in to comment.