[add] First
This commit is contained in:
179
static/js/EventBus.js
Normal file
179
static/js/EventBus.js
Normal file
@@ -0,0 +1,179 @@
|
||||
/**
|
||||
* 实现发布-订阅模式下的消息传输机制，支持命名空间与离线事件
|
||||
* @param {string} [key] 事件的名称
|
||||
* @param {function} [fn] 事件的回调
|
||||
* @param {string} [last] 是否只执行最后一次绑定的消息 last ==“last”时只执行最后一次绑定的消息，否则执行之前所有绑定的消息
|
||||
*
|
||||
* @example
|
||||
* 1.常规
|
||||
* eventBus.on('click',function(a){
|
||||
* console.log(a) // 输出 :1
|
||||
* })
|
||||
* eventBus.emit('click',1)
|
||||
*
|
||||
* 2. 先发布后订阅
|
||||
* eventBus.emit('click',1)
|
||||
* eventBus.on('click',function(a){
|
||||
* console.log(a) // 输出 :1
|
||||
* })
|
||||
*
|
||||
* 3.使用命名空间
|
||||
* eventBus.create('namespace1').on('click',function(a){
|
||||
* console.log(a) // 输出 :1
|
||||
* })
|
||||
* eventBus.create('namespace1').emit('click',1)
|
||||
*
|
||||
* auth by guoqiang
|
||||
* 注意：支持离线事件可能会带来一些副作用，比如意外的某个页面发布了某个消息，这时如果另一个订阅了这个消息，这个消息的回调会立即执行，而且大多请况下，回调的参数会出问题。在逻辑没理清之前不建议先发布再订阅
|
||||
* 注意：支持离线事件可能会带来一些副作用，比如意外的某个页面发布了某个消息，这时如果另一个订阅了这个消息，这个消息的回调会立即执行，而且大多请况下，回调的参数会出问题。在逻辑没理清之前不建议先发布再订阅
|
||||
* 注意：支持离线事件可能会带来一些副作用，比如意外的某个页面发布了某个消息，这时如果另一个订阅了这个消息，这个消息的回调会立即执行，而且大多请况下，回调的参数会出问题。在逻辑没理清之前不建议先发布再订阅
|
||||
*/
|
||||
(function(window, undefined) {
|
||||
var _subscribe = null,
|
||||
_publish = null,
|
||||
_unsubscribe = null,
|
||||
_shift = Array.prototype.shift, // 删除数组的第一个 元素，并返回这个元素
|
||||
_unshift = Array.prototype.unshift, // 在数组的开头添加一个或者多个元素，并返回数组新的length值
|
||||
namespaceCache = {},
|
||||
_create = null,
|
||||
each = function(ary, fn) {
|
||||
var ret = null;
|
||||
for (var i = 0, len = ary.length; i < len; i++) {
|
||||
var n = ary[i];
|
||||
ret = fn.call(n, i, n);
|
||||
}
|
||||
return ret;
|
||||
};
|
||||
|
||||
// 订阅消息名称为：'+key+'
|
||||
_subscribe = function(key, fn, cache) {
|
||||
if (!cache[key]) {
|
||||
cache[key] = [];
|
||||
}
|
||||
cache[key].push(fn);
|
||||
};
|
||||
|
||||
// 取消订阅（取消全部或者指定消息）
|
||||
_unsubscribe = function(key, cache, fn) {
|
||||
if (cache[key]) {
|
||||
if (fn) {
|
||||
for (var i = cache[key].length; i >= 0; i--) {
|
||||
if (cache[key][i] === fn) {
|
||||
cache[key].splice(i, 1);
|
||||
}
|
||||
}
|
||||
} else {
|
||||
cache[key] = [];
|
||||
}
|
||||
} else if (!key) {
|
||||
for (var key in cache) {
|
||||
delete cache[key];
|
||||
}
|
||||
} else {
|
||||
console.log("不存在该消息的监听:" + key);
|
||||
}
|
||||
};
|
||||
|
||||
// 发布消息
|
||||
_publish = function() {
|
||||
var cache = _shift.call(arguments),
|
||||
key = _shift.call(arguments),
|
||||
args = arguments,
|
||||
_self = this,
|
||||
ret = null,
|
||||
stack = cache[key];
|
||||
|
||||
if (!stack || !stack.length) {
|
||||
return;
|
||||
}
|
||||
|
||||
return each(stack, function() {
|
||||
return this.apply(_self, args);
|
||||
});
|
||||
};
|
||||
|
||||
// 创建命名空间
|
||||
_create = function(namespace) {
|
||||
var namespace = namespace || "default";
|
||||
var cache = {},
|
||||
offlineStack = {}, // 离线事件，用于先发布后订阅，只执行一次
|
||||
ret = {
|
||||
on: function(key, fn, last) {
|
||||
_subscribe(key, fn, cache);
|
||||
if (!offlineStack[key]) {
|
||||
offlineStack[key] = null;
|
||||
return;
|
||||
}
|
||||
if (last === "last") {
|
||||
// 指定执行离线队列的最后一个函数，执行完成之后删除
|
||||
offlineStack[key].length && offlineStack[key].pop()(); // [].pop => 删除一个数组中的最后的一个元素，并且返回这个元素
|
||||
} else {
|
||||
each(offlineStack[key], function() {
|
||||
this();
|
||||
});
|
||||
}
|
||||
offlineStack[key] = null;
|
||||
},
|
||||
one: function(key, fn, last) {
|
||||
_unsubscribe(key, cache);
|
||||
this.on(key, fn, last);
|
||||
},
|
||||
off: function(key, fn) {
|
||||
_unsubscribe(key, cache, fn);
|
||||
},
|
||||
emit: function() {
|
||||
var fn = null,
|
||||
args = null,
|
||||
key = _shift.call(arguments),
|
||||
_self = this;
|
||||
|
||||
_unshift.call(arguments, cache, key);
|
||||
args = arguments;
|
||||
fn = function() {
|
||||
return _publish.apply(_self, args);
|
||||
};
|
||||
|
||||
if (offlineStack && offlineStack[key] === undefined) {
|
||||
offlineStack[key] = [];
|
||||
return offlineStack[key].push(fn);
|
||||
}
|
||||
return fn();
|
||||
}
|
||||
};
|
||||
|
||||
return namespace
|
||||
? namespaceCache[namespace]
|
||||
? namespaceCache[namespace]
|
||||
: (namespaceCache[namespace] = ret)
|
||||
: ret;
|
||||
};
|
||||
|
||||
window.eventBus = {
|
||||
create: _create, // 创建命名空间
|
||||
one: function(key, fn, last) {
|
||||
// 订阅消息，只能单一对象订阅
|
||||
var namespace = "default";
|
||||
var pubsub = this.create(namespace);
|
||||
pubsub.one(key, fn, last);
|
||||
},
|
||||
on: function(key, fn, last) {
|
||||
// 订阅消息，可多对象同时订阅
|
||||
var namespace = "default";
|
||||
var pubsub = this.create(namespace);
|
||||
pubsub.on(key, fn, last);
|
||||
},
|
||||
off: function(key, fn, namespace) {
|
||||
// 取消订阅，（取消全部或指定消息）
|
||||
namespace = "default";
|
||||
var pubsub = this.create(namespace);
|
||||
console.trace("");
|
||||
pubsub.off(key, fn);
|
||||
},
|
||||
emit: function(key, fn) {
|
||||
// 发布消息
|
||||
var namespace = "default";
|
||||
var pubsub = this.create(namespace);
|
||||
pubsub.emit.apply(this, arguments);
|
||||
}
|
||||
};
|
||||
})(window, undefined);
|
||||
141
static/js/common.js
Normal file
141
static/js/common.js
Normal file
@@ -0,0 +1,141 @@
|
||||
// import { rootPath } from '../../src/api/apiConfig'
|
||||
import axios from 'axios'
|
||||
import { Message, Notification } from 'element-ui'
|
||||
/**
|
||||
* post请求
|
||||
* @DateTime 2018-4-10
|
||||
* @param {[string]} url [地址]
|
||||
* @param {[object]} data [数据]
|
||||
* @param {{object}} options 这个参数供扩展使用，暂时没有加
|
||||
*/
|
||||
export const post = (url, data, options = { }) => {
|
||||
if (!url) {
|
||||
console.log(new Error('地址是必须的'))
|
||||
return false
|
||||
}
|
||||
return axios(Object.assign({
|
||||
method: 'POST',
|
||||
url: url,
|
||||
data: data
|
||||
}, options)).then(res => {
|
||||
return Promise.resolve(res)
|
||||
}, res => {
|
||||
return Promise.reject(res)
|
||||
})
|
||||
}
|
||||
/**
|
||||
* get请求
|
||||
* @DateTime 2018-4-10
|
||||
* @param {[string]} url [地址]
|
||||
* @param {[object]} data [数据]
|
||||
*/
|
||||
export const get = (url, data) => {
|
||||
if (!url) {
|
||||
console.log(new Error('地址是必须的'))
|
||||
return false
|
||||
}
|
||||
// const baseUrl = rootPath + url
|
||||
return axios({
|
||||
method: 'GET',
|
||||
url: url,
|
||||
data: data
|
||||
}).then(res => {
|
||||
return Promise.resolve(res)
|
||||
}, res => {
|
||||
return Promise.reject(res)
|
||||
})
|
||||
}
|
||||
/**
|
||||
* 中部的alert
|
||||
* @DateTime 2018-4-10
|
||||
* @param {[string]} msg [要提示的信息]
|
||||
*/
|
||||
export const msgbox = {
|
||||
success (msg) {
|
||||
Message({
|
||||
message: msg,
|
||||
type: 'success'
|
||||
})
|
||||
},
|
||||
warning (msg) {
|
||||
Message({
|
||||
message: msg,
|
||||
type: 'warning'
|
||||
})
|
||||
},
|
||||
error (msg) {
|
||||
Message({
|
||||
message: msg,
|
||||
type: 'error'
|
||||
})
|
||||
}
|
||||
}
|
||||
/**
|
||||
* 右上角提示框
|
||||
* @DateTime 2018-4-10
|
||||
* @param {[string]} msg [要提示的信息]
|
||||
*/
|
||||
export const notice = {
|
||||
success (msg) {
|
||||
Notification({
|
||||
title: '成功',
|
||||
message: msg,
|
||||
type: 'success'
|
||||
})
|
||||
},
|
||||
warning (msg) {
|
||||
Notification({
|
||||
title: '警告',
|
||||
message: msg,
|
||||
type: 'warning'
|
||||
})
|
||||
},
|
||||
error (msg) {
|
||||
Notification({
|
||||
title: '错误',
|
||||
message: msg,
|
||||
type: 'error'
|
||||
// duration: 0
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 时间戳转为格式化时间
|
||||
* @DateTime 2018-4-10
|
||||
* @param {[date]} timestamp [时间戳]
|
||||
* @param {[string]} formats [时间格式]
|
||||
*/
|
||||
export const formatDate = (timestamp, formats) => {
|
||||
/*
|
||||
formats格式包括
|
||||
1. Y-M-D
|
||||
2. Y-M-D h:m:s
|
||||
3. Y年M月D日
|
||||
4. Y年M月D日 h时m分
|
||||
5. Y年M月D日 h时m分s秒
|
||||
示例：console.log(formatDate(1500305226034, 'Y年M月D日 h:m:s')) ==> 2017年07月17日 23:27:06
|
||||
*/
|
||||
formats = formats || 'Y-M-D'
|
||||
var myDate = timestamp ? new Date(timestamp) : new Date()
|
||||
var year = myDate.getFullYear()
|
||||
var month = formatDigit(myDate.getMonth() + 1)
|
||||
var day = formatDigit(myDate.getDate())
|
||||
var hour = formatDigit(myDate.getHours())
|
||||
var minute = formatDigit(myDate.getMinutes())
|
||||
var second = formatDigit(myDate.getSeconds())
|
||||
return formats.replace(/Y|M|D|h|m|s/g, function (matches) {
|
||||
return ({
|
||||
Y: year,
|
||||
M: month,
|
||||
D: day,
|
||||
h: hour,
|
||||
m: minute,
|
||||
s: second
|
||||
})[matches]
|
||||
})
|
||||
// 小于10补0
|
||||
function formatDigit (n) {
|
||||
return n.toString().replace(/^(\d)$/, '0$1')
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user