/**
* vcFramework
*
* @author kevin law
*
* @version 0.3
*
* @description 完成组件化编程思想
*
* @time 2020-03-04
*
* @qq 58957118
*
* @mail 58957118@qq.com
*
*/
/**
构建vcFramework对象
**/
(function (window) {
"use strict";
let vcFramework = window.vcFramework || {};
window.vcFramework = vcFramework;
//为了兼容 0.1版本的vc 框架
window.vc = vcFramework;
let _vmOptions = {};
let _initMethod = [];
let _initEvent = [];
let _component = {};
let _destroyedMethod = [];
let _timers = [];//定时器
let _map = [];// 共享数据存储
let _namespace = [];
let _vueCache = {};
_vmOptions = {
el: '#component',
data: {},
watch: {},
methods: {},
destroyed: function () {
window.vcFramework.destroyedMethod.forEach(function (eventMethod) {
eventMethod();
});
//清理所有定时器
window.vcFramework.timers.forEach(function (timer) {
clearInterval(timer);
});
_timers = [];
}
};
vcFramework = {
version: "v0.0.3",
name: "vcFramework",
author: 'Kevin Law',
email: '58957118@qq.com',
qq: '58957118',
description: 'vcFramework 是自研的一套组件开发套件',
vueCache: _vueCache,
vmOptions: _vmOptions,
namespace: _namespace,
initMethod: _initMethod,
initEvent: _initEvent,
component: _component,
destroyedMethod: _destroyedMethod,
debug: false,
timers: _timers,
_map: {}
};
//通知window对象
window.vcFramework = vcFramework;
window.vc = vcFramework;
})(window);
(function (vcFramework) {
let componentCache = {};
/**
* 树
* @param {*} _vcCreate 自定义组件
* @param {*} _html 组件内容
* @param {*} _nodeLocation 组件位置 1 开始节点 -1 结束节点
*/
let VcTree = function (_vcCreate, _html, _nodeLocation) {
let o = new Object();
o.treeId = vcFramework.uuid();
o.vcCreate = _vcCreate;
o.html = _html;
o.js = "";
o.css = "";
o.vcSubTree = [];
o.nodeLocation = _nodeLocation;
o.putSubTree = function (_vcSubTree) {
o.vcSubTree.push(_vcSubTree);
};
o.setHtml = function (_html) {
o.html = _html;
};
o.setJs = function (_js) {
o.js = _js;
};
o.setCss = function (_css) {
o.css = _css;
};
o.setLocation = function (_location) {
o.nodeLocation = _location;
};
return o;
};
/**
* 构建 树
*/
vcFramework.builderVcTree = async function () {
let _componentUrl = location.hash;
//判断是否为组件页面
if (vcFramework.notNull(_componentUrl)) {
let _vcComponent = document.getElementById('component');
let vcComponentChilds = _vcComponent.childNodes;
for (let vcIndex = vcComponentChilds.length - 1; vcIndex >= 0; vcIndex--) {
_vcComponent.removeChild(vcComponentChilds[vcIndex]);
}
if (_componentUrl.lastIndexOf('#') > -1) {
let endPos = _componentUrl.length;
if (_componentUrl.indexOf('?') > -1) {
endPos = _componentUrl.indexOf('?');
}
_componentUrl = _componentUrl.substring(_componentUrl.lastIndexOf('#') + 1, endPos);
}
let _tmpVcCreate = document.createElement("vc:create");
let _divComponentAttr = document.createAttribute('path');
_divComponentAttr.value = _componentUrl;
_tmpVcCreate.setAttributeNode(_divComponentAttr);
_vcComponent.appendChild(_tmpVcCreate);
let _commonPath = _vcComponent.getAttribute('vc-path');
if (vc.isNotEmpty(_commonPath)) {
let _pathVcCreate = document.createElement("vc:create");
let _pathDivComponentAttr = document.createAttribute('path');
_pathDivComponentAttr.value = _commonPath;
_pathVcCreate.setAttributeNode(_pathDivComponentAttr);
_vcComponent.appendChild(_pathVcCreate);
}
} else {
let _vcComponent = document.getElementById('component');
let _commonPath = _vcComponent.getAttribute('vc-path');
if (vc.isNotEmpty(_commonPath)) {
let _pathVcCreate = document.createElement("vc:create");
let _pathDivComponentAttr = document.createAttribute('path');
_pathDivComponentAttr.value = _commonPath;
_pathVcCreate.setAttributeNode(_pathDivComponentAttr);
_vcComponent.appendChild(_pathVcCreate);
}
}
let vcElements = document.getElementsByTagName('vc:create');
let treeList = [];
let _componentScript = [];
for (let _vcElementIndex = 0; _vcElementIndex < vcElements.length; _vcElementIndex++) {
let _vcElement = vcElements[_vcElementIndex];
let _tree = new VcTree(_vcElement, '', 1);
let _vcCreateAttr = document.createAttribute('id');
_vcCreateAttr.value = _tree.treeId;
_vcElement.setAttributeNode(_vcCreateAttr);
treeList.push(_tree);
//创建div
await findVcLabel(_tree, _vcElement);
let _res = _tree.html;
}
//渲染组件html
reader(treeList, _componentScript);
//执行组件js
execScript(treeList, _componentScript);
};
/**
* 页面内 组件跳转
*/
vcFramework.reBuilderVcTree = async function () {
let _componentUrl = location.hash;
//判断是否为组件页面
if (!vcFramework.notNull(_componentUrl)) {
vcFramework.toast('程序异常,url没有包含组件');
return;
}
if (_componentUrl.lastIndexOf('#') < 0) {
vcFramework.toast('程序异常,url包含组件错误');
return;
}
let _vcComponent = document.getElementById('component');
let vcComponentChilds = _vcComponent.childNodes;
for (let vcIndex = vcComponentChilds.length - 1; vcIndex >= 0; vcIndex--) {
_vcComponent.removeChild(vcComponentChilds[vcIndex]);
}
let endPos = _componentUrl.length;
if (_componentUrl.indexOf('?') > -1) {
endPos = _componentUrl.indexOf('?');
}
_componentUrl = _componentUrl.substring(_componentUrl.lastIndexOf('#') + 1, endPos);
let _tmpVcCreate = document.createElement("vc:create");
let _divComponentAttr = document.createAttribute('path');
_divComponentAttr.value = _componentUrl;
_tmpVcCreate.setAttributeNode(_divComponentAttr);
_vcComponent.appendChild(_tmpVcCreate);
let _commonPath = _vcComponent.getAttribute('vc-path');
if (vc.isNotEmpty(_commonPath)) {
let _pathVcCreate = document.createElement("vc:create");
let _pathDivComponentAttr = document.createAttribute('path');
_pathDivComponentAttr.value = _commonPath;
_pathVcCreate.setAttributeNode(_pathDivComponentAttr);
_vcComponent.appendChild(_pathVcCreate);
}
let treeList = [];
let _componentScript = [];
let _vcElement = _tmpVcCreate;
let vcElements = _vcComponent.getElementsByTagName('vc:create');
for (let _vcElementIndex = 0; _vcElementIndex < vcElements.length; _vcElementIndex++) {
let _vcElement = vcElements[_vcElementIndex];
let _tree = new VcTree(_vcElement, '', 1);
let _vcCreateAttr = document.createAttribute('id');
_vcCreateAttr.value = _tree.treeId;
_vcElement.setAttributeNode(_vcCreateAttr);
treeList.push(_tree);
//创建div
await findVcLabel(_tree, _vcElement);
}
//渲染组件html
reader(treeList, _componentScript);
//执行组件js
execScript(treeList, _componentScript);
};
/**
* 从当前 HTML中找是否存在 标签
*/
findVcLabel = async function (_tree) {
//查看是否存在子 vc:create
let _componentName = _tree.vcCreate.getAttribute('path');
//console.log('_componentName', _componentName, _tree);
if (!vcFramework.isNotEmpty(_componentName)) {
throw '组件未包含path 属性' + _tree.vcCreate.outerHTML;
}
//开始加载组件
let _componentElement = await loadComponent(_componentName, _tree);
//_tree.setHtml(_componentElement);
//console.log('_componentElement>>', _componentElement)
if (vcFramework.isNotNull(_componentElement)) {
let vcChildElements = _componentElement.getElementsByTagName('vc:create');
if (vcChildElements.length > 0) {
let _vcDiv = document.createElement('div');
for (let _vcChildIndex = 0; _vcChildIndex < vcChildElements.length; _vcChildIndex++) {
//console.log('vcChildElements', vcChildElements);
let _tmpChildElement = vcChildElements[_vcChildIndex];
let _subtree = new VcTree(_tmpChildElement, '', 2);
let _vcCreateAttr = document.createAttribute('id');
_vcCreateAttr.value = _subtree.treeId;
_tmpChildElement.setAttributeNode(_vcCreateAttr);
_tree.putSubTree(_subtree);
await findVcLabel(_subtree);
}
}
}
};
/**
* 渲染组件 html 页面
*/
reader = function (_treeList, _componentScript) {
//console.log('_treeList', _treeList);
let _header = document.getElementsByTagName('head');
for (let _treeIndex = 0; _treeIndex < _treeList.length; _treeIndex++) {
let _tree = _treeList[_treeIndex];
let _vcCreateEl = document.getElementById(_tree.treeId);
let _componentHeader = _tree.html.getElementsByTagName('head');
let _componentBody = _tree.html.getElementsByTagName('body');
if (_vcCreateEl.hasAttribute("location") && 'head' == _vcCreateEl.getAttribute('location')) {
let _componentHs = _componentHeader[0].childNodes;
_header[0].appendChild(_componentHeader[0]);
} else if (_vcCreateEl.hasAttribute("location") && 'body' == _vcCreateEl.getAttribute('location')) {
_vcCreateEl.parentNode.replaceChild(_componentHeader[0].childNodes[0], _vcCreateEl);
let _bodyComponentHs = _componentHeader[0].childNodes;
for (let _bsIndex = 0; _bsIndex < _bodyComponentHs.length; _bsIndex++) {
let _bComponentScript = _bodyComponentHs[_bsIndex];
if (_bComponentScript.tagName == 'SCRIPT') {
let scriptObj = document.createElement("script");
scriptObj.src = _bComponentScript.src;
scriptObj.type = "text/javascript";
document.getElementsByTagName("body")[0].appendChild(scriptObj);
} else {
_header[0].appendChild(_bodyComponentHs[_bsIndex]);
}
}
} else {
//_vcCreateEl.innerHTML = _componentBody[0].innerHTML;
//_vcCreateEl.parentNode.replaceChild(_componentBody[0], _vcCreateEl);
for (let _comBodyIndex = 0; _comBodyIndex < _componentBody.length; _comBodyIndex++) {
let _childNodes = _componentBody[_comBodyIndex].childNodes;
for (let _tmpChildIndex = 0; _tmpChildIndex < _childNodes.length; _tmpChildIndex++) {
_vcCreateEl.parentNode.insertBefore(_childNodes[_tmpChildIndex], _vcCreateEl)
}
}
}
//将js 脚本放到 组件 脚本中
if (vcFramework.isNotEmpty(_tree.js)) {
_componentScript.push(_tree.js);
}
let _tmpSubTrees = _tree.vcSubTree;
if (_tmpSubTrees != null && _tmpSubTrees.length > 0) {
reader(_tmpSubTrees, _componentScript);
}
}
/**
* 执行 页面上的js 文件
*/
let _tmpScripts = document.head.getElementsByTagName("script");
let _tmpBody = document.getElementsByTagName('body');
for (let _scriptsIndex = 0; _scriptsIndex < _tmpScripts.length; _scriptsIndex++) {
let _tmpScript = _tmpScripts[_scriptsIndex];
//console.log('_head 中 script', _tmpScript.outerHTML)
let scriptObj = document.createElement("script");
scriptObj.src = _tmpScript.src;
//_tmpScript.parentNode.removeChild(_tmpScript);
scriptObj.type = "text/javascript";
_tmpBody[0].appendChild(scriptObj);
}
};
/**
* 手工执行js 脚本
*/
execScript = function (_tree, _componentScript) {
//console.log('_componentScript', _componentScript);
for (let i = 0; i < _componentScript.length; i++) {
//一段一段执行script
try {
eval(_componentScript[i]);
} catch (e) {
console.log('js脚本错误', _componentScript[i]);
console.error(e);
}
}
//初始化vue 对象
vcFramework.initVue();
vcFramework.initVcComponent();
}
/**
* 加载组件
* 异步去服务端 拉去HTML 和 js
*/
loadComponent = async function (_componentName, _tree) {
if (vcFramework.isNotEmpty(_componentName) && _componentName.lastIndexOf('/') > 0) {
_componentName = _componentName + '/' + _componentName.substring(_componentName.lastIndexOf('/') + 1, _componentName.length);
}
//从缓存查询
let _cacheComponent = vcFramework.getComponent(_componentName);
//console.log('加载组件名称', _componentName);
let _htmlBody = '';
let _jsBody = '';
if (!vcFramework.isNotNull(_cacheComponent)) {
let _domain = 'components';
let filePath = '';
if (_tree.vcCreate.hasAttribute("domain")) {
_domain = _tree.vcCreate.getAttribute("domain");
}
if (_componentName.startsWith('/pages')) { //这里是为了处理 pages 页面
filePath = _componentName;
} else { //这里是为了处理组件
filePath = '/' + _domain + '/' + _componentName;
}
let htmlFilePath = filePath + ".html";
let jsFilePath = filePath + ".js";
//加载html 页面
[_htmlBody, _jsBody] = await Promise.all([vcFramework.httpGet(htmlFilePath), vcFramework.httpGet(jsFilePath)]);
let _componentObj = {
html: _htmlBody,
js: _jsBody
};
vcFramework.putComponent(_componentName, _componentObj);
} else {
_htmlBody = _cacheComponent.html;
_jsBody = _cacheComponent.js;
}
//处理命名空间
_htmlBody = dealHtmlNamespace(_tree, _htmlBody);
//处理 js
_jsBody = dealJs(_tree, _jsBody);
_jsBody = dealJsAddComponentCode(_tree, _jsBody);
//处理命名空间
_jsBody = dealJsNamespace(_tree, _jsBody);
//处理侦听
_jsBody = dealHtmlJs(_tree, _jsBody);
_tmpJsBody = '';
let parser = new DOMParser();
//let htmlComponentDoc = parser.parseFromString(_htmlBody + _tmpJsBody, 'text/html').documentElement;
let htmlComponentDoc = parser.parseFromString(_htmlBody, 'text/html').documentElement;
//创建div
let vcDiv = document.createElement('div');
let _divComponentAttr = document.createAttribute('data-component');
_divComponentAttr.value = _componentName;
vcDiv.setAttributeNode(_divComponentAttr);
vcDiv.appendChild(htmlComponentDoc);
//vcDiv.appendChild(jsComponentDoc);
_tree.setHtml(vcDiv);
_tree.setJs(_jsBody);
return vcDiv;
};
/**
* 处理 命名空间html
*/
dealHtmlNamespace = function (_tree, _html) {
let _componentVcCreate = _tree.vcCreate;
if (!_componentVcCreate.hasAttribute('namespace')) {
return _html;
}
let _namespaceValue = _componentVcCreate.getAttribute("namespace");
_html = _html.replace(/this./g, _namespaceValue + "_");
_html = _html.replace(/(id)( )*=( )*'/g, "id='" + _namespaceValue + "_");
_html = _html.replace(/(id)( )*=( )*"/g, 'id="' + _namespaceValue + '_');
return _html;
};
/**
* 处理js
*/
dealJs = function (_tree, _js) {
//在js 中检测propTypes 属性
if (_js.indexOf("propTypes") < 0) {
return _js;
}
let _componentVcCreate = _tree.vcCreate;
//解析propTypes信息
let tmpProTypes = _js.substring(_js.indexOf("propTypes"), _js.length);
tmpProTypes = tmpProTypes.substring(tmpProTypes.indexOf("{") + 1, tmpProTypes.indexOf("}")).trim();
if (!vcFramework.notNull(tmpProTypes)) {
return _js;
}
tmpProTypes = tmpProTypes.indexOf("\r") > 0 ? tmpProTypes.replace("\r/g", "") : tmpProTypes;
let tmpType = tmpProTypes.indexOf("\n") > 0
? tmpProTypes.split("\n")
: tmpProTypes.split(",");
let propsJs = "\nlet $props = {};\n";
for (let typeIndex = 0; typeIndex < tmpType.length; typeIndex++) {
let type = tmpType[typeIndex];
if (!vcFramework.notNull(type) || type.indexOf(":") < 0) {
continue;
}
let types = type.split(":");
let attrKey = "";
if (types[0].indexOf("//") > 0) {
attrKey = types[0].substring(0, types[0].indexOf("//"));
}
attrKey = types[0].replace(" ", "");
attrKey = attrKey.replace("\n", "")
attrKey = attrKey.replace("\r", "").trim();
if (!_componentVcCreate.hasAttribute(attrKey) && types[1].indexOf("=") < 0) {
let componentName = _componentVcCreate.getAttribute("path");
throw "组件[" + componentName + "]未配置组件属性" + attrKey;
}
let vcType = _componentVcCreate.getAttribute(attrKey);
if (!_componentVcCreate.hasAttribute(attrKey) && types[1].indexOf("=") > 0) {
vcType = dealJsPropTypesDefault(types[1]);
} else if (types[1].indexOf("vc.propTypes.string") >= 0) {
vcType = "'" + vcType + "'";
}
propsJs = propsJs + "$props." + attrKey + "=" + vcType + ";\n";
}
//将propsJs 插入到 第一个 { 之后
let position = _js.indexOf("{");
if (position < 0) {
let componentName = _componentVcCreate.getAttribute("name");
throw "组件" + componentName + "对应js 未包含 {} ";
}
let newJs = _js.substring(0, position + 1);
newJs = newJs + propsJs;
newJs = newJs + _js.substring(position + 1, _js.length);
return newJs;
};
dealJsPropTypesDefault = function (typeValue) {
let startPos = typeValue.indexOf("=") + 1;
let endPos = typeValue.length;
if (typeValue.indexOf(",") > 0) {
endPos = typeValue.indexOf(",");
} else if (typeValue.indexOf("//") > 0) {
endPos = typeValue.indexOf("//");
}
return typeValue.substring(startPos, endPos);
};
/**
* js 处理命名
*/
dealJsNamespace = function (_tree, _js) {
//在js 中检测propTypes 属性
let _componentVcCreate = _tree.vcCreate;
if (_js.indexOf("vc.extends") < 0) {
return _js;
}
let namespace = "";
if (!_componentVcCreate.hasAttribute("namespace")) {
namespace = 'default';
} else {
namespace = _componentVcCreate.getAttribute("namespace");
}
//js对象中插入namespace 值
let extPos = _js.indexOf("vc.extends");
let tmpProTypes = _js.substring(extPos, _js.length);
let pos = tmpProTypes.indexOf("{") + 1;
_js = _js.substring(0, extPos) + tmpProTypes.substring(0, pos).trim()
+ "\nnamespace:'" + namespace.trim() + "',\n" + tmpProTypes.substring(pos, tmpProTypes.length);
let position = _js.indexOf("{");
let propsJs = "\nlet $namespace='" + namespace.trim() + "';\n";
let newJs = _js.substring(0, position + 1);
newJs = newJs + propsJs;
newJs = newJs + _js.substring(position + 1, _js.length);
return newJs;
};
/**
* 处理js 变量和 方法都加入 组件编码
*
* @param tag 页面元素
* @param js js文件内容
* @return js 文件内容
*/
dealJsAddComponentCode = function (_tree, _js) {
let _componentVcCreate = _tree.vcCreate;
if (!_componentVcCreate.hasAttribute("code")) {
return _js;
}
let code = _componentVcCreate.getAttribute("code");
return _js.replace("@vc_/g", code);
}
/**
* 处理命名空间js
*/
dealHtmlJs = function (_tree, _js) {
let _componentVcCreate = _tree.vcCreate;
if (!_componentVcCreate.hasAttribute('namespace')) {
return _js;
}
let _namespaceValue = _componentVcCreate.getAttribute("namespace");
_js = _js.replace(/this./g, "vc.component." + _namespaceValue + "_");
_js = _js.replace(/(\$)( )*(\()( )*'#/g, "\$('#" + _namespaceValue + "_");
_js = _js.replace(/(\$)( )*(\()( )*"#/g, "\$(\"#" + _namespaceValue + "_");
//将 监听也做优化
_js = _js.replace(/(vc.on)\('/g, "vc.on('" + _namespaceValue + "','");
_js = _js.replace(/(vc.on)\("/g, "vc.on(\"" + _namespaceValue + "\",\"");
return _js;
}
})(window.vcFramework);
/**
* vc-event 事件处理
*
*/
(function (vcFramework) {
_initVcFrameworkEvent = function () {
let vcFrameworkEvent = document.createEvent('Event');
// 定义事件名为'build'.
vcFrameworkEvent.initEvent('initVcFrameworkFinish', true, true);
vcFramework.vcFrameworkEvent = vcFrameworkEvent;
};
/**
* 初始化 vue 事件
*/
_initVueEvent = function () {
vcFramework.$event = new Vue();
}
_initVcFrameworkEvent();
_initVueEvent();
})(window.vcFramework);
/**
* vc-util
*/
(function (vcFramework) {
//空判断 true 为非空 false 为空
vcFramework.isNotNull = function (_paramObj) {
if (_paramObj == null || _paramObj == undefined) {
return false;
}
return true;
};
//空判断 true 为非空 false 为空
vcFramework.isNotEmpty = function (_paramObj) {
if (_paramObj == null || _paramObj == undefined || _paramObj.trim() == '') {
return false;
}
return true;
};
vcFramework.uuid = function () {
let s = [];
let hexDigits = "0123456789abcdef";
for (let i = 0; i < 36; i++) {
s[i] = hexDigits.substr(Math.floor(Math.random() * 0x10), 1);
}
s[14] = "4"; // bits 12-15 of the time_hi_and_version field to 0010
s[19] = hexDigits.substr((s[19] & 0x3) | 0x8, 1); // bits 6-7 of the clock_seq_hi_and_reserved to 01
s[8] = s[13] = s[18] = s[23] = "-";
let uuid = s.join("");
return uuid;
};
/**
* 深度拷贝对象
*/
vcFramework.deepClone = function (obj) {
return JSON.stringify(JSON.stringify(obj));
}
})(window.vcFramework);
/**
* 封装 后端请求 代码
*/
(function (vcFramework) {
vcFramework.httpGet = function (url) {
// XMLHttpRequest对象用于在后台与服务器交换数据
return new Promise((resolve, reject) => {
let xhr = new XMLHttpRequest();
xhr.open('GET', url, true);
xhr.onreadystatechange = function () {
// readyState == 4说明请求已完成
if (xhr.readyState == 4 && xhr.status == 200 || xhr.status == 304) {
// 从服务器获得数据
// fn.call(this, xhr.responseText);
resolve(xhr.responseText);
}
};
xhr.send();
});
};
vcFramework.httpPost = function (url, data, fn) {
let xhr = new XMLHttpRequest();
xhr.open("POST", url, true);
// 添加http头,发送信息至服务器时内容编码类型
xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
xhr.onreadystatechange = function () {
if (xhr.readyState == 4 && (xhr.status == 200 || xhr.status == 304)) {
fn.call(xhr.responseText);
}
};
xhr.send(data);
};
})(window.vcFramework);
/**
* vc-cache
*
* 组件缓存
*/
(function (vcFramework) {
/**
* 组件缓存
*/
vcFramework.putComponent = function (_componentName, _component) {
let _componentCache = vcFramework.vueCache;
_componentCache[_componentName] = _component;
};
/**
* 组件提取
*/
vcFramework.getComponent = function (_componentName) {
let _componentCache = vcFramework.vueCache;
return _componentCache[_componentName];
}
})(window.vcFramework);
/***
* vc- constant 内容
*/
/**
常量
**/
(function (vcFramework) {
let constant = {
REQUIRED_MSG: "不能为空",
GET_CACHE_URL: ["/nav/getUserInfo"]
}
vcFramework.constant = constant;
})(window.vcFramework);
/***
* vc component 0.1 版本代码合并过来-----------------------------------------------------------------------
*
*
*/
/**
vc 函数初始化
add by Kevin
**/
(function (vcFramework) {
let DEFAULT_NAMESPACE = "default";
vcFramework.http = {
post: function (componentCode, componentMethod, param, options, successCallback, errorCallback) {
vcFramework.loading('open');
Vue.http.post('/callComponent/' + componentCode + "/" + componentMethod, param, options)
.then(function (res) {
try {
let _header = res.headers.map;
//console.log('res', res);
if (vcFramework.notNull(_header['location'])) {
window.location.href = _header['location'];
return;
};
successCallback(res.bodyText, res);
} catch (e) {
console.error(e);
} finally {
vcFramework.loading('close');
}
}, function (res) {
try {
if (res.status == 401 && res.headers.map["location"]) {
let _header = res.headers.map;
//console.log('res', res);
window.location.href = _header['location'];
return;
}
if (res.status == 404) {
window.location.href = '/user.html#/pages/frame/login';
return;
}
errorCallback(res.bodyText, res);
} catch (e) {
console.error(e);
} finally {
vcFramework.loading('close');
}
});
},
get: function (componentCode, componentMethod, param, successCallback, errorCallback) {
//加入缓存机制
let _getPath = '/' + componentCode + '/' + componentMethod;
if (vcFramework.constant.GET_CACHE_URL.includes(_getPath)) {
let _cacheData = vcFramework.getData(_getPath);
//浏览器缓存中能获取到
if (_cacheData != null && _cacheData != undefined) {
successCallback(JSON.stringify(_cacheData), { status: 200 });
return;
}
}
vcFramework.loading('open');
Vue.http.get('/callComponent/' + componentCode + "/" + componentMethod, param)
.then(function (res) {
try {
successCallback(res.bodyText, res);
if (vcFramework.constant.GET_CACHE_URL.includes(_getPath) && res.status == 200) {
vcFramework.saveData(_getPath, JSON.parse(res.bodyText));
}
} catch (e) {
console.error(e);
} finally {
vcFramework.loading('close');
}
}, function (res) {
try {
if (res.status == 401 && res.headers.map["location"]) {
let _header = res.headers.map;
//console.log('res', res);
window.location.href = _header['location'];
return;
}
if (res.status == 404) {
window.location.href = '/user.html#/pages/frame/login';
return;
}
errorCallback(res.bodyText, res);
} catch (e) {
console.error(e);
} finally {
vcFramework.loading('close');
}
});
},
apiPost: function (api, param, options, successCallback, errorCallback) {
let _api = '';
if (api.indexOf('/') >= 0) {
_api = '/app' + api;
Vue.http.headers.common['APP-ID'] = '8000418004';
Vue.http.headers.common['TRANSACTION-ID'] = vcFramework.uuid();
Vue.http.headers.common['REQ-TIME'] = vcFramework.getDateYYYYMMDDHHMISS();
Vue.http.headers.common['SIGN'] = '';
} else {
_api = '/callComponent/' + api;
}
vcFramework.loading('open');
Vue.http.post(_api, param, options)
.then(function (res) {
try {
let _header = res.headers.map;
//console.log('res', res);
if (vcFramework.notNull(_header['location'])) {
window.location.href = _header['location'];
return;
};
successCallback(res.bodyText, res);
} catch (e) {
console.error(e);
} finally {
vcFramework.loading('close');
}
}, function (res) {
try {
if (res.status == 401 && res.headers.map["location"]) {
let _header = res.headers.map;
//console.log('res', res);
window.location.href = _header['location'];
return;
}
if (res.status == 404) {
window.location.href = '/user.html#/pages/frame/login';
return;
}
errorCallback(res.bodyText, res);
} catch (e) {
console.error(e);
} finally {
vcFramework.loading('close');
}
});
},
apiGet: function (api, param, successCallback, errorCallback) {
//加入缓存机制
let _getPath = '';
if (api.indexOf('/') != 0) {
_getPath = '/' + api;
}
if (vcFramework.constant.GET_CACHE_URL.includes(_getPath)) {
let _cacheData = vcFramework.getData(_getPath);
//浏览器缓存中能获取到
if (_cacheData != null && _cacheData != undefined) {
successCallback(JSON.stringify(_cacheData), { status: 200 });
return;
}
}
let _api = '';
if (api.indexOf('/') >= 0) {
_api = '/app' + api;
Vue.http.headers.common['APP-ID'] = '8000418004';
Vue.http.headers.common['TRANSACTION-ID'] = vcFramework.uuid();
Vue.http.headers.common['REQ-TIME'] = vcFramework.getDateYYYYMMDDHHMISS();
Vue.http.headers.common['SIGN'] = '';
} else {
_api = '/callComponent/' + api;
}
if(vcFramework.hasOwnProperty('loading')){
vcFramework.loading('open');
}
Vue.http.get(_api, param)
.then(function (res) {
try {
successCallback(res.bodyText, res);
if (vcFramework.constant.GET_CACHE_URL.includes(_getPath) && res.status == 200) {
vcFramework.saveData(_getPath, JSON.parse(res.bodyText));
}
} catch (e) {
console.error(e);
} finally {
if(vcFramework.hasOwnProperty('loading')){
vcFramework.loading('close');
}
}
}, function (res) {
try {
if (res.status == 401 && res.headers.map["location"]) {
let _header = res.headers.map;
//console.log('res', res);
window.location.href = _header['location'];
return;
}
if (res.status == 404) {
window.location.href = '/user.html#/pages/frame/login';
return;
}
errorCallback(res.bodyText, res);
} catch (e) {
console.error(e);
} finally {
vcFramework.loading('close');
}
});
},
upload: function (componentCode, componentMethod, param, options, successCallback, errorCallback) {
vcFramework.loading('open');
Vue.http.post('/callComponent/upload/' + componentCode + "/" + componentMethod, param, options)
.then(function (res) {
try {
successCallback(res.bodyText, res);
} catch (e) {
console.error(e);
} finally {
vcFramework.loading('close');
}
}, function (error) {
try {
errorCallback(error.bodyText, error);
} catch (e) {
console.error(e);
} finally {
vcFramework.loading('close');
}
});
},
};
//let vmOptions = vcFramework.vmOptions;
//继承方法,合并 _vmOptions 的数据到 vmOptions中
vcFramework.extends = function (_vmOptions) {
let vmOptions = vcFramework.vmOptions;
if (typeof _vmOptions !== "object") {
throw "_vmOptions is not Object";
}
//console.log('vmOptions',vmOptions);
let nameSpace = DEFAULT_NAMESPACE;
if (_vmOptions.hasOwnProperty("namespace")) {
nameSpace = _vmOptions.namespace;
vcFramework.namespace.push({
namespace: _vmOptions.namespace,
})
}
//处理 data 对象
if (_vmOptions.hasOwnProperty('data')) {
for (let dataAttr in _vmOptions.data) {
if (nameSpace == DEFAULT_NAMESPACE) {
vmOptions.data[dataAttr] = _vmOptions.data[dataAttr];
} else {
vmOptions.data[nameSpace + "_" + dataAttr] = _vmOptions.data[dataAttr];
}
}
}
//处理methods 对象
if (_vmOptions.hasOwnProperty('methods')) {
for (let methodAttr in _vmOptions.methods) {
if (nameSpace == DEFAULT_NAMESPACE) {
vmOptions.methods[methodAttr] = _vmOptions.methods[methodAttr];
} else {
vmOptions.methods[nameSpace + "_" + methodAttr] = _vmOptions.methods[methodAttr];
}
}
}
//处理methods 对象
if (_vmOptions.hasOwnProperty('watch')) {
for (let watchAttr in _vmOptions.watch) {
if (nameSpace == DEFAULT_NAMESPACE) {
vmOptions.watch[watchAttr] = _vmOptions.watch[watchAttr];
} else {
vmOptions.watch[nameSpace + "_" + watchAttr] = _vmOptions.watch[watchAttr];
}
}
}
//处理_initMethod 初始化执行函数
if (_vmOptions.hasOwnProperty('_initMethod')) {
vcFramework.initMethod.push(_vmOptions._initMethod);
}
//处理_initEvent
if (_vmOptions.hasOwnProperty('_initEvent')) {
vcFramework.initEvent.push(_vmOptions._initEvent);
}
//处理_initEvent_destroyedMethod
if (_vmOptions.hasOwnProperty('_destroyedMethod')) {
vcFramework.destroyedMethod.push(_vmOptions._destroyedMethod);
}
};
//绑定跳转函数
vcFramework.jumpToPage = function (url) {
//判断 url 的模板是否 和当前url 模板一个
console.log('jumpToPage', url);
if (url.indexOf('#') < 0) {
window.location.href = url;
return;
}
let _targetUrl = url.substring(0, url.indexOf('#'));
if (location.pathname != _targetUrl) {
window.location.href = url;
return;
}
//刷新框架参数
//refreshVcFramework();
//修改锚点
location.hash = url.substring(url.indexOf("#") + 1, url.length);
//vcFramework.reBuilderVcTree();
};
refreshVcFramework = function () {
$that.$destroy();
let _vmOptions = {
el: '#component',
data: {},
watch: {},
methods: {},
destroyed: function () {
window.vcFramework.destroyedMethod.forEach(function (eventMethod) {
eventMethod();
});
//清理所有定时器
window.vcFramework.timers.forEach(function (timer) {
clearInterval(timer);
});
_timers = [];
}
};
vcFramework.vmOptions = _vmOptions;
vcFramework.initMethod = [];
vcFramework.initEvent = [];
vcFramework.component = {};
vcFramework.destroyedMethod = [];
vcFramework.namespace = [];
};
//保存菜单
vcFramework.setCurrentMenu = function (_menuId) {
window.localStorage.setItem('hc_menuId', _menuId);
};
//获取菜单
vcFramework.getCurrentMenu = function () {
return window.localStorage.getItem('hc_menuId');
};
//保存用户菜单
vcFramework.setMenus = function (_menus) {
window.localStorage.setItem('hc_menus', JSON.stringify(_menus));
};
//获取用户菜单
vcFramework.getMenus = function () {
return JSON.parse(window.localStorage.getItem('hc_menus'));
};
//保存菜单状态
vcFramework.setMenuState = function (_menuState) {
window.localStorage.setItem('hc_menu_state', _menuState);
};
//获取菜单状态
vcFramework.getMenuState = function () {
return window.localStorage.getItem('hc_menu_state');
};
//保存用户菜单
vcFramework.saveData = function (_key, _value) {
window.localStorage.setItem(_key, JSON.stringify(_value));
};
//获取用户菜单
vcFramework.getData = function (_key) {
return JSON.parse(window.localStorage.getItem(_key));
};
//保存当前小区信息 _communityInfo : {"communityId":"123213","name":"测试小区"}
vcFramework.setCurrentCommunity = function (_currentCommunityInfo) {
window.localStorage.setItem('hc_currentCommunityInfo', JSON.stringify(_currentCommunityInfo));
};
//获取当前小区信息
// @return {"communityId":"123213","name":"测试小区"}
vcFramework.getCurrentCommunity = function () {
return JSON.parse(window.localStorage.getItem('hc_currentCommunityInfo'));
};
//保存当前小区信息 _communityInfos : [{"communityId":"123213","name":"测试小区"}]
vcFramework.setCommunitys = function (_communityInfos) {
window.localStorage.setItem('hc_communityInfos', JSON.stringify(_communityInfos));
};
//获取当前小区信息
// @return {"communityId":"123213","name":"测试小区"}
vcFramework.getCommunitys = function () {
return JSON.parse(window.localStorage.getItem('hc_communityInfos'));
};
//删除缓存数据
vcFramework.clearCacheData = function () {
window.localStorage.clear();
};
//将org 对象的属性值赋值给dst 属性名为一直的属性
vcFramework.copyObject = function (org, dst) {
//for(key in Object.getOwnPropertyNames(dst)){
for (let key in dst) {
if (org.hasOwnProperty(key)) {
dst[key] = org[key]
}
}
};
//扩展 现有的对象 没有的属性扩充上去
vcFramework.extendObject = function (org, dst) {
for (let key in dst) {
if (!org.hasOwnProperty(key)) {
dst[key] = org[key]
}
}
};
//获取url参数
vcFramework.getParam = function (_key) {
//返回当前 URL 的查询部分(问号 ? 之后的部分)。
let urlParameters = location.search;
if (!vcFramework.notNull(urlParameters)) {
urlParameters = location.hash;
if (urlParameters.indexOf('?') != -1) {
urlParameters = urlParameters.substring(urlParameters.indexOf('?'), urlParameters.length);
}
}
//如果该求青中有请求的参数,则获取请求的参数,否则打印提示此请求没有请求的参数
if (urlParameters.indexOf('?') != -1) {
//获取请求参数的字符串
let parameters = decodeURI(urlParameters.substr(1));
//将请求的参数以&分割中字符串数组
parameterArray = parameters.split('&');
//循环遍历,将请求的参数封装到请求参数的对象之中
for (let i = 0; i < parameterArray.length; i++) {
if (_key == parameterArray[i].split('=')[0]) {
return parameterArray[i].split('=')[1];
}
}
}
return "";
};
//查询url
vcFramework.getUrl = function () {
//返回当前 URL 的查询部分(问号 ? 之后的部分)。
let urlParameters = location.pathname;
return urlParameters;
};
vcFramework.getBack = function () {
window.location.href = document.referrer;
window.history.back(-1);
}
vcFramework.goBack = function () {
window.location.href = document.referrer;
window.history.back(-1);
}
//对象转get参数
vcFramework.objToGetParam = function (obj) {
let str = [];
for (let p in obj)
if (obj.hasOwnProperty(p)) {
str.push(encodeURIComponent(p) + "=" + encodeURIComponent(obj[p]));
}
return str.join("&");
};
//空判断 true 为非空 false 为空
vcFramework.notNull = function (_paramObj) {
if (_paramObj == null || _paramObj == undefined || _paramObj.trim() == '') {
return false;
}
return true;
};
vcFramework.isEmpty = function (_paramObj) {
if (_paramObj == null || _paramObj == undefined) {
return true;
}
return false;
};
//设置debug 模式
vcFramework.setDebug = function (_param) {
vcFramework.debug = _param;
};
//数据共享存放 主要为了组件间传递数据
vcFramework.put = function (_key, _value) {
vcFramework.map[_key] = _value;
};
//数据共享 获取 主要为了组件间传递数据
vcFramework.get = function (_key) {
return vcFramework.map[_key];
};
vcFramework.getDict = function (_name, _type, _callFun) {
let param = {
params: {
name: _name,
type: _type
}
};
//发送get请求
vcFramework.http.get('core', 'list', param,
function (json, res) {
if (res.status == 200) {
let _dictInfo = JSON.parse(json);
_callFun(_dictInfo);
return;
}
},
function (errInfo, error) {
console.log('请求失败处理');
});
}
vcFramework.getAttrSpec = function (_tableName,_callFun) {
let param = {
params: {
tableName: _tableName,
page:1,
row:100
}
};
//发送get请求
vcFramework.http.apiGet('/attrSpec/queryAttrSpec', param,
function (json, res) {
let _attrSpecInfo = JSON.parse(json);
if (_attrSpecInfo.code == 0) {
_callFun(_attrSpecInfo.data);
return;
}
},
function (errInfo, error) {
console.log('请求失败处理');
});
}
vcFramework.getAttrValue = function (_specCd,_callFun) {
let param = {
params: {
specCd: _specCd,
page:1,
row:100
}
};
//发送get请求
vcFramework.http.apiGet('/attrValue/queryAttrValue', param,
function (json, res) {
let _attrSpecInfo = JSON.parse(json);
if (_attrSpecInfo.code == 0) {
_callFun(_attrSpecInfo.data);
return;
}
},
function (errInfo, error) {
console.log('请求失败处理');
});
}
})(window.vcFramework);
/**
vc 定时器处理
**/
(function (w, vcFramework) {
/**
创建定时器
**/
vcFramework.createTimer = function (func, sec) {
let _timer = w.setInterval(func, sec);
vcFramework.timers.push(_timer); //这里将所有的定时器保存起来,页面退出时清理
return _timer;
};
//清理定时器
vcFramework.clearTimer = function (timer) {
clearInterval(timer);
}
})(window, window.vcFramework);
/**
* vcFramework.toast("");
时间处理工具类
**/
(function (vcFramework) {
function add0(m) {
return m < 10 ? '0' + m : m
}
vcFramework.dateFormat = function (shijianchuo) {
//shijianchuo是整数,否则要parseInt转换
let time = new Date(parseInt(shijianchuo));
let y = time.getFullYear();
let m = time.getMonth() + 1;
let d = time.getDate();
let h = time.getHours();
let mm = time.getMinutes();
let s = time.getSeconds();
return y + '-' + add0(m) + '-' + add0(d) + ' ' + add0(h) + ':' + add0(mm) + ':' + add0(s);
}
vcFramework.dateTimeFormat = function (_time) {
let y = _time.getFullYear();
let m = _time.getMonth() + 1;
let d = _time.getDate();
let h = _time.getHours();
let mm = _time.getMinutes();
let s = _time.getSeconds();
return y + '-' + add0(m) + '-' + add0(d) + ' ' + add0(h) + ':' + add0(mm) + ':' + add0(s);
}
vcFramework.getDateYYYYMMDDHHMISS = function () {
let date = new Date();
let year = date.getFullYear();
let month = date.getMonth() + 1;
let day = date.getDate();
let hour = date.getHours();
let minute = date.getMinutes();
let second = date.getSeconds();
if (month < 10) {
month = '0' + month;
}
if (day < 10) {
day = '0' + day;
}
if (hour < 10) {
hour = '0' + hour;
}
if (minute < 10) {
minute = '0' + minute;
}
if (second < 10) {
second = '0' + second;
}
return year + "" + month + "" + day + "" + hour + "" + minute + "" + second;
};
})(window.vcFramework);
(function (vcFramework) {
vcFramework.propTypes = {
string: "string",//字符串类型
array: "array",
object: "object",
number: "number"
}
})(window.vcFramework);
/**
toast
**/
(function (vcFramework) {
vcFramework.toast = function Toast(msg, duration) {
duration = isNaN(duration) ? 3000 : duration;
let m = document.createElement('div');
m.innerHTML = msg;
m.style.cssText = "max-width:60%;min-width: 150px;padding:0 14px;height: 40px;color: rgb(255, 255, 255);line-height: 40px;text-align: center;border-radius: 4px;position: fixed;top: 30%;left: 50%;transform: translate(-50%, -50%);z-index: 999999;background: rgba(0, 0, 0,.7);font-size: 16px;";
document.body.appendChild(m);
setTimeout(function () {
let d = 0.5;
m.style.webkitTransition = '-webkit-transform ' + d + 's ease-in, opacity ' + d + 's ease-in';
m.style.opacity = '0';
setTimeout(function () {
document.body.removeChild(m)
}, d * 1000);
}, duration);
}
})(window.vcFramework);
/**
toast
**/
(function (vcFramework) {
vcFramework.urlToBase64 = function urlToBase64(_url, _callFun) {
let imgData;
let reader = new FileReader();
getImageBlob(_url, function (blob) {
reader.readAsDataURL(blob);
});
reader.onload = function (e) {
imgData = e.target.result;
_callFun(imgData);
};
function getImageBlob(_url, cb) {
let xhr = new XMLHttpRequest();
xhr.open("get", _url, true);
xhr.responseType = "blob";
xhr.onload = function () {
if (this.status == 200) {
if (cb) cb(this.response);
}
};
xhr.send();
}
}
})(window.vcFramework);
/***
* vc component 0.1 版本代码合并过来(end)-----------------------------------------------------------------------
*/
/**
初始化vue 对象
@param vc vue component对象
@param vmOptions Vue参数
**/
(function (vcFramework) {
vcFramework.initVue = function () {
let vmOptions = vcFramework.vmOptions;
//console.log("vmOptions:", vmOptions);
vcFramework.vue = new Vue(vmOptions);
vcFramework.component = vcFramework.vue;
//方便二次开发
window.$that = vcFramework.vue;
//发布vue 创建完成 事件
document.dispatchEvent(vcFramework.vcFrameworkEvent);
}
})(window.vcFramework);
/**
* vcFramwork init
* 框架开始初始化
*/
(function (vcFramework) {
//启动 框架
vcFramework.builderVcTree();
})(window.vcFramework);
/**
vc监听事件
**/
(function (vcFramework) {
/**
事件监听
**/
vcFramework.on = function () {
let _namespace = "";
let _componentName = "";
let _value = "";
let _callback = undefined;
if (arguments.length == 4) {
_namespace = arguments[0];
_componentName = arguments[1];
_value = arguments[2];
_callback = arguments[3];
} else if (arguments.length == 3) {
_componentName = arguments[0];
_value = arguments[1];
_callback = arguments[2];
} else {
console.error("执行on 异常,vcFramework.on 参数只能是3个 或4个");
return;
}
if (vcFramework.notNull(_namespace)) {
vcFramework.vue.$on(_namespace + "_" + _componentName + '_' + _value,
function (param) {
if (vcFramework.debug) {
console.log("监听ON事件", _namespace, _componentName, _value, param);
}
_callback(param);
}
);
return;
}
vcFramework.vue.$on(_componentName + '_' + _value,
function (param) {
if (vcFramework.debug) {
console.log("监听ON事件", _componentName, _value, param);
}
_callback(param);
}
);
};
/**
事件触发
**/
vcFramework.emit = function () {
let _namespace = "";
let _componentName = "";
let _value = "";
let _param = undefined;
if (arguments.length == 4) {
_namespace = arguments[0];
_componentName = arguments[1];
_value = arguments[2];
_param = arguments[3];
} else if (arguments.length == 3) {
_componentName = arguments[0];
_value = arguments[1];
_param = arguments[2];
} else {
console.error("执行on 异常,vcFramework.on 参数只能是3个 或4个");
return;
}
if (vcFramework.debug) {
console.log("监听emit事件", _namespace, _componentName, _value, _param);
}
if (vcFramework.notNull(_namespace)) {
vcFramework.vue.$emit(_namespace + "_" + _componentName + '_' + _value, _param);
return;
}
vcFramework.vue.$emit(_componentName + '_' + _value, _param);
};
})(window.vcFramework);
/**
* vue对象 执行初始化方法
*/
(function (vcFramework) {
vcFramework.initVcComponent = function () {
vcFramework.initEvent.forEach(function (eventMethod) {
eventMethod();
});
vcFramework.initMethod.forEach(function (callback) {
callback();
});
vcFramework.namespace.forEach(function (_param) {
vcFramework[_param.namespace] = vcFramework.vue[_param.namespace];
});
}
})(window.vcFramework);
/**
* 锚点变化监听
*/
(function (vcFramework) {
window.addEventListener("hashchange", function (e) {
let _componentUrl = location.hash;
//判断是否为组件页面
if (!vcFramework.notNull(_componentUrl)) {
return;
}
refreshVcFramework();
vcFramework.reBuilderVcTree();
}, false);
})(window.vcFramework);
/**
vc 校验 工具类 -method
(1)、required:true 必输字段
(2)、remote:"remote-valid.jsp" 使用ajax方法调用remote-valid.jsp验证输入值
(3)、email:true 必须输入正确格式的电子邮件
(4)、url:true 必须输入正确格式的网址
(5)、date:true 必须输入正确格式的日期,日期校验ie6出错,慎用
(6)、dateISO:true 必须输入正确格式的日期(ISO),例如:2009-06-23,1998/01/22 只验证格式,不验证有效性
(7)、number:true 必须输入合法的数字(负数,小数)
(8)、digits:true 必须输入整数
(9)、creditcard:true 必须输入合法的信用卡号
(10)、equalTo:"#password" 输入值必须和#password相同
(11)、accept: 输入拥有合法后缀名的字符串(上传文件的后缀)
(12)、maxlength:5 输入长度最多是5的字符串(汉字算一个字符)
(13)、minlength:10 输入长度最小是10的字符串(汉字算一个字符)
(14)、rangelength:[5,10] 输入长度必须介于 5 和 10 之间的字符串")(汉字算一个字符)
(15)、range:[5,10] 输入值必须介于 5 和 10 之间
(16)、max:5 输入值不能大于5
(17)、min:10 输入值不能小于10
**/
(function (vcFramework) {
let validate = {
state: true,
errInfo: '',
setState: function (_state, _errInfo) {
this.state = _state;
if (!this.state) {
this.errInfo = _errInfo
throw "校验失败:" + _errInfo;
}
},
/**
校验手机号
**/
phone: function (text) {
let regPhone = /^0?1[3|4|5|6|7|8|9][0-9]\d{8}$/;
return regPhone.test(text);
},
/**
校验邮箱
**/
email: function (text) {
let regEmail = new RegExp("^[a-z0-9]+([._\\-]*[a-z0-9])*@([a-z0-9]+[-a-z0-9]*[a-z0-9]+.){1,63}[a-z0-9]+$"); //正则表达式
return regEmail.test(text);
},
/**
* 必填
* @param {参数} text
*/
required: function (text) {
if (text == undefined || text == null || text == "") {
return false;
}
return true;
},
/**
* 校验长度
* @param {校验文本} text
* @param {最小长度} minLength
* @param {最大长度} maxLength
*/
maxin: function (text, minLength, maxLength) {
if (text.length < minLength || text.length > maxLength) {
return false;
}
return true;
},
/**
* 校验长度
* @param {校验文本} text
* @param {最大长度} maxLength
*/
maxLength: function (text, maxLength) {
if (text.length > maxLength) {
return false;
}
return true;
},
/**
* 校验最小长度
* @param {校验文本} text
* @param {最小长度} minLength
*/
minLength: function (text, minLength) {
if (text.length < minLength) {
return false;
}
return true;
},
/**
* 全是数字
* @param {校验文本} text
*/
num: function (text) {
if (text == null || text == undefined) {
return true;
}
let regNum = /^[0-9][0-9]*$/;
return regNum.test(text);
},
date: function (str) {
if (str == null || str == undefined) {
return true;
}
let regDate = /^(\d{4})-(\d{2})-(\d{2})$/;
return regDate.test(str);
},
dateTime: function (str) {
if (str == null || str == undefined) {
return true;
}
let reDateTime = /^[1-9]\d{3}-(0[1-9]|1[0-2])-(0[1-9]|[1-2][0-9]|3[0-1])\s+(20|21|22|23|[0-1]\d):[0-5]\d:[0-5]\d$/;
return reDateTime.test(str);
},
/**
金额校验
**/
money: function (text) {
if (text == null || text == undefined) {
return true;
}
let regMoney = /^\d+\.?\d{0,2}$/;
return regMoney.test(text);
},
idCard: function (num) {
if (num == null || num == undefined) {
return true;
}
num = num.toUpperCase();
//身份证号码为15位或者18位,15位时全为数字,18位前17位为数字,最后一位是校验位,可能为数字或字符X。
if (!(/(^\d{15}$)|(^\d{17}([0-9]|X)$)/.test(num))) {
return false;
}
//校验位按照ISO 7064:1983.MOD 11-2的规定生成,X可以认为是数字10。
//下面分别分析出生日期和校验位
let len, re;
len = num.length;
if (len == 15) {
re = new RegExp(/^(\d{6})(\d{2})(\d{2})(\d{2})(\d{3})$/);
let arrSplit = num.match(re);
//检查生日日期是否正确
let dtmBirth = new Date('19' + arrSplit[2] + '/' + arrSplit[3] + '/' + arrSplit[4]);
let bGoodDay;
bGoodDay = (dtmBirth.getYear() == Number(arrSplit[2])) && ((dtmBirth.getMonth() + 1) == Number(arrSplit[3])) && (dtmBirth.getDate() == Number(arrSplit[4]));
if (!bGoodDay) {
return false;
}
else {
//将15位身份证转成18位
//校验位按照ISO 7064:1983.MOD 11-2的规定生成,X可以认为是数字10。
let arrInt = new Array(7, 9, 10, 5, 8, 4, 2, 1, 6, 3, 7, 9, 10, 5, 8, 4, 2);
let arrCh = new Array('1', '0', 'X', '9', '8', '7', '6', '5', '4', '3', '2');
let nTemp = 0, i;
num = num.substr(0, 6) + '19' + num.substr(6, num.length - 6);
for (i = 0; i < 17; i++) {
nTemp += num.substr(i, 1) * arrInt[i];
}
num += arrCh[nTemp % 11];
return true;
}
}
if (len == 18) {
re = new RegExp(/^(\d{6})(\d{4})(\d{2})(\d{2})(\d{3})([0-9]|X)$/);
let arrSplit = num.match(re);
//检查生日日期是否正确
let dtmBirth = new Date(arrSplit[2] + "/" + arrSplit[3] + "/" + arrSplit[4]);
let bGoodDay;
bGoodDay = (dtmBirth.getFullYear() == Number(arrSplit[2])) && ((dtmBirth.getMonth() + 1) == Number(arrSplit[3])) && (dtmBirth.getDate() == Number(arrSplit[4]));
if (!bGoodDay) {
// alert(dtmBirth.getYear());
// alert(arrSplit[2]);
return false;
}
else {
//检验18位身份证的校验码是否正确。
//校验位按照ISO 7064:1983.MOD 11-2的规定生成,X可以认为是数字10。
let valnum;
let arrInt = new Array(7, 9, 10, 5, 8, 4, 2, 1, 6, 3, 7, 9, 10, 5, 8, 4, 2);
let arrCh = new Array('1', '0', 'X', '9', '8', '7', '6', '5', '4', '3', '2');
let nTemp = 0, i;
for (i = 0; i < 17; i++) {
nTemp += num.substr(i, 1) * arrInt[i];
}
valnum = arrCh[nTemp % 11];
if (valnum != num.substr(17, 1)) {
return false;
}
return true;
}
}
return false;
}
};
vc.validate = validate;
})(window.vcFramework);
/**
* 校验 -core
*/
(function (validate) {
/**
* 根据配置校验
*
* eg:
* dataObj:
* {
* name:"Kevin",
* age:"19",
* emailInfo:{
* email:"58957118@qq.com"
* }
* }
*
* dataConfig:
* {
* "name":[
{
limit:"required",
param:"",
errInfo:'用户名为必填'
},
{
limit:"maxin",
param:"1,10",
errInfo:'用户名必须为1到10个字之间'
}]
* }
*
*/
validate.validate = function (dataObj, dataConfig) {
try {
// 循环配置(每个字段)
for (let key in dataConfig) {
//配置信息
let tmpDataConfigValue = dataConfig[key];
//对key进行处理
let keys = key.split(".");
console.log("keys :", keys);
let tmpDataObj = dataObj;
//根据配置获取 数据值
keys.forEach(function (tmpKey) {
console.log('tmpDataObj:', tmpDataObj);
tmpDataObj = tmpDataObj[tmpKey]
});
// for(let tmpKey in keys){
// console.log('tmpDataObj:',tmpDataObj);
// tmpDataObj = tmpDataObj[tmpKey]
// }
tmpDataConfigValue.forEach(function (configObj) {
if (configObj.limit == "required") {
validate.setState(validate.required(tmpDataObj), configObj.errInfo);
}
if (configObj.limit == 'phone') {
validate.setState(validate.phone(tmpDataObj), configObj.errInfo);
}
if (configObj.limit == 'email') {
validate.setState(validate.email(tmpDataObj), configObj.errInfo);
}
if (configObj.limit == 'maxin') {
let tmpParam = configObj.param.split(",")
validate.setState(validate.maxin(tmpDataObj, tmpParam[0], tmpParam[1]), configObj.errInfo);
}
if (configObj.limit == 'maxLength') {
validate.setState(validate.maxLength(tmpDataObj, configObj.param), configObj.errInfo);
}
if (configObj.limit == 'minLength') {
validate.setState(validate.minLength(tmpDataObj, configObj.param), configObj.errInfo);
7
}
if (configObj.limit == 'num') {
validate.setState(validate.num(tmpDataObj), configObj.errInfo);
}
if (configObj.limit == 'date') {
validate.setState(validate.date(tmpDataObj), configObj.errInfo);
}
if (configObj.limit == 'dateTime') {
validate.setState(validate.dateTime(tmpDataObj), configObj.errInfo);
}
if (configObj.limit == 'money') {
validate.setState(validate.money(tmpDataObj), configObj.errInfo);
}
if (configObj.limit == 'idCard') {
validate.setState(validate.idCard(tmpDataObj), configObj.errInfo);
}
});
}
} catch (error) {
console.log("数据校验失败", validate.state, validate.errInfo, error);
return false;
}
return true;
}
})(window.vcFramework.validate);
/**
对 validate 进行二次封装
**/
(function (vcFramework) {
vcFramework.check = function (dataObj, dataConfig) {
return vcFramework.validate.validate(dataObj, dataConfig);
}
})(window.vcFramework);
/**
* 监听div 大小
*/
(function (vcFramework) {
vcFramework.eleResize = {
_handleResize: function (e) {
let ele = e.target || e.srcElement;
let trigger = ele.__resizeTrigger__;
if (trigger) {
let handlers = trigger.__z_resizeListeners;
if (handlers) {
let size = handlers.length;
for (let i = 0; i < size; i++) {
let h = handlers[i];
let handler = h.handler;
let context = h.context;
handler.apply(context, [e]);
}
}
}
},
_removeHandler: function (ele, handler, context) {
let handlers = ele.__z_resizeListeners;
if (handlers) {
let size = handlers.length;
for (let i = 0; i < size; i++) {
let h = handlers[i];
if (h.handler === handler && h.context === context) {
handlers.splice(i, 1);
return;
}
}
}
},
_createResizeTrigger: function (ele) {
let obj = document.createElement('object');
obj.setAttribute('style',
'display: block; position: absolute; top: 0; left: 0; height: 100%; width: 100%; overflow: hidden;opacity: 0; pointer-events: none; z-index: -1;');
obj.onload = vcFramework.eleResize._handleObjectLoad;
obj.type = 'text/html';
ele.appendChild(obj);
obj.data = 'about:blank';
return obj;
},
_handleObjectLoad: function (evt) {
this.contentDocument.defaultView.__resizeTrigger__ = this.__resizeElement__;
this.contentDocument.defaultView.addEventListener('resize', vcFramework.eleResize._handleResize);
}
};
if (document.attachEvent) {//ie9-10
vcFramework.eleResize.on = function (ele, handler, context) {
let handlers = ele.__z_resizeListeners;
if (!handlers) {
handlers = [];
ele.__z_resizeListeners = handlers;
ele.__resizeTrigger__ = ele;
ele.attachEvent('onresize', EleResize._handleResize);
}
handlers.push({
handler: handler,
context: context
});
};
vcFramework.eleResize.off = function (ele, handler, context) {
let handlers = ele.__z_resizeListeners;
if (handlers) {
EleResize._removeHandler(ele, handler, context);
if (handlers.length === 0) {
ele.detachEvent('onresize', EleResize._handleResize);
delete ele.__z_resizeListeners;
}
}
}
} else {
vcFramework.eleResize.on = function (ele, handler, context) {
let handlers = ele.__z_resizeListeners;
if (!handlers) {
handlers = [];
ele.__z_resizeListeners = handlers;
if (getComputedStyle(ele, null).position === 'static') {
ele.style.position = 'relative';
}
let obj = vcFramework.eleResize._createResizeTrigger(ele);
ele.__resizeTrigger__ = obj;
obj.__resizeElement__ = ele;
}
handlers.push({
handler: handler,
context: context
});
};
vcFramework.eleResize.off = function (ele, handler, context) {
let handlers = ele.__z_resizeListeners;
if (handlers) {
vcFramework.eleResize._removeHandler(ele, handler, context);
if (handlers.length === 0) {
let trigger = ele.__resizeTrigger__;
if (trigger) {
trigger.contentDocument.defaultView.removeEventListener('resize', EleResize._handleResize);
ele.removeChild(trigger);
delete ele.__resizeTrigger__;
}
delete ele.__z_resizeListeners;
}
}
}
}
})(window.vcFramework);
//全屏处理 这个后面可以关掉
(function (vcFramework) {
vcFramework._fix_height = (_targetDiv) => {
//只要窗口高度发生变化,就会进入这里面,在这里就可以写,回到聊天最底部的逻辑
let _vcPageHeight = document.getElementsByClassName('vc-page-height')[0];
//浏览器可见高度
let _minHeight = document.documentElement.clientHeight;
let _scollHeight = _targetDiv.scrollHeight;
if (_scollHeight < _minHeight) {
_scollHeight = _minHeight
}
_vcPageHeight.style.minHeight = _scollHeight + 'px';
//console.log('是否设置高度', _vcPageHeight.style.minHeight);
}
})(window.vcFramework);