Skip to content

bdc / bdcdj-web

Go to a project
Toggle navigation
Toggle navigation pinning
e358c272 by yuanbo
Options

增加注释

1 parent ecb27d8c
Inline Side-by-side
Showing 18 changed files with 794 additions and 20 deletions
......@@ -6,6 +6,11 @@ import afterLeave from 'element-ui/src/utils/after-leave';
const Mask = Vue.extend(Loading);
const loadingDirective = {};
/**
* @description: install
* @author: renchao
*/
loadingDirective.install = Vue => {
if (Vue.prototype.$isServer) return;
const toggleLoading = (el, binding) => {
......@@ -110,14 +115,24 @@ loadingDirective.install = Vue => {
binding.value && toggleLoading(el, binding);
},
/**
* @description: update
* @param {*} el
* @param {*} binding
* @author: renchao
*/
update: function (el, binding) {
el.instance.setText(el.getAttribute('element-loading-text'));
if (binding.oldValue !== binding.value) {
toggleLoading(el, binding);
}
},
/**
* @description: unbind
* @param {*} el
* @param {*} binding
* @author: renchao
*/
unbind: function (el, binding) {
if (el.domInserted) {
el.mask &&
......
......@@ -20,6 +20,10 @@ let fullscreenLoading;
LoadingConstructor.prototype.originalPosition = '';
LoadingConstructor.prototype.originalOverflow = '';
/**
* @description: close
* @author: renchao
*/
LoadingConstructor.prototype.close = function() {
if (this.fullscreen) {
fullscreenLoading = undefined;
......@@ -38,6 +42,13 @@ LoadingConstructor.prototype.close = function() {
this.visible = false;
};
/**
* @description: addStyle
* @param {*} options
* @param {*} parent
* @param {*} instance
* @author: renchao
*/
const addStyle = (options, parent, instance) => {
let maskStyle = {};
if (options.fullscreen) {
......@@ -64,6 +75,10 @@ const addStyle = (options, parent, instance) => {
});
};
/**
* @description: Loading
* @author: renchao
*/
const Loading = (options = {}) => {
if (Vue.prototype.$isServer) return;
options = merge({}, defaults, options);
......
......@@ -43,6 +43,11 @@ const MessageBoxConstructor = Vue.extend(msgboxVue);
let currentMsg, instance;
let msgQueue = [];
/**
* @description: defaultCallback
* @author: renchao
*/
const defaultCallback = action => {
if (currentMsg) {
let callback = currentMsg.callback;
......@@ -56,6 +61,10 @@ const defaultCallback = action => {
}
};
/**
* @description: initInstance
* @author: renchao
*/
const initInstance = () => {
instance = new MessageBoxConstructor({
el: document.createElement('div')
......@@ -64,6 +73,10 @@ const initInstance = () => {
instance.callback = defaultCallback;
};
/**
* @description: showNextMsg
* @author: renchao
*/
const showNextMsg = () => {
if (!instance) {
initInstance();
......@@ -109,6 +122,10 @@ const showNextMsg = () => {
}
};
/**
* @description: MessageBox
* @author: renchao
*/
const MessageBox = function (options, callback) {
if (Vue.prototype.$isServer) return;
if (typeof options === 'string' || isVNode(options)) {
......@@ -143,10 +160,18 @@ const MessageBox = function (options, callback) {
}
};
/**
* @description: setDefaults
* @author: renchao
*/
MessageBox.setDefaults = defaults => {
MessageBox.defaults = defaults;
};
/**
* @description: alert
* @author: renchao
*/
MessageBox.alert = (title, message, options) => {
if (typeof title === 'object') {
options = title;
......@@ -163,6 +188,10 @@ MessageBox.alert = (title, message, options) => {
}, options));
};
/**
* @description: close
* @author: renchao
*/
MessageBox.close = () => {
instance.doClose();
instance.visible = false;
......
......@@ -97,6 +97,10 @@ export default {
},
methods: {
/**
* @description: getSafeClose
* @author: renchao
*/
getSafeClose () {
const currentId = this.uid;
return () => {
......@@ -105,6 +109,10 @@ export default {
});
};
},
/**
* @description: doClose
* @author: renchao
*/
doClose () {
if (!this.visible) return;
this.visible = false;
......@@ -122,18 +130,31 @@ export default {
});
},
/**
* @description: handleWrapperClick
* @author: renchao
*/
handleWrapperClick () {
if (this.closeOnClickModal) {
this.handleAction(this.distinguishCancelAndClose ? 'close' : 'cancel');
}
},
/**
* @description: handleInputEnter
* @author: renchao
*/
handleInputEnter () {
if (this.inputType !== 'textarea') {
return this.handleAction('confirm');
}
},
/**
* @description: handleAction
* @param {*} action
* @author: renchao
*/
handleAction (action) {
if (this.$type === 'prompt' && action === 'confirm' && !this.validate()) {
return;
......@@ -147,6 +168,10 @@ export default {
}
},
/**
* @description: validate
* @author: renchao
*/
validate () {
if (this.$type === 'prompt') {
const inputPattern = this.inputPattern;
......@@ -174,15 +199,27 @@ export default {
removeClass(this.getInputElement(), 'invalid');
return true;
},
/**
* @description: getFirstFocus
* @author: renchao
*/
getFirstFocus () {
const btn = this.$el.querySelector('.el-message-box__btns .el-button');
const title = this.$el.querySelector('.el-message-box__btns .el-message-box__title');
return btn || title;
},
/**
* @description: getInputElement
* @author: renchao
*/
getInputElement () {
const inputRefs = this.$refs.input.$refs;
return inputRefs.input || inputRefs.textarea;
},
/**
* @description: handleClose
* @author: renchao
*/
handleClose () {
this.handleAction('close');
}
......@@ -200,6 +237,11 @@ export default {
}
},
/**
* @description: visible
* @param {*} val
* @author: renchao
*/
visible (val) {
if (val) {
this.uid++;
......@@ -222,6 +264,10 @@ export default {
}
},
/**
* @description: mounted
* @author: renchao
*/
mounted () {
this.$nextTick(() => {
if (this.closeOnHashChange) {
......@@ -230,6 +276,10 @@ export default {
});
},
/**
* @description: beforeDestroy
* @author: renchao
*/
beforeDestroy () {
if (this.closeOnHashChange) {
window.removeEventListener('hashchange', this.close);
......
......@@ -49,10 +49,18 @@ export default {
}
},
methods: {
/**
* @description: handleNotice
* @param {*} item
* @author: renchao
*/
handleNotice (item) {
this.$alertMes(item.noticeTitle, item.noticeContent)
},
// 获取数据
/**
* @description: 获取数据
* @author: renchao
*/
getData () {
let style = document.styleSheets[0];
let text = this.$refs.text;
......@@ -72,13 +80,19 @@ export default {
this.changeState();
}, 300);
},
// 用速度计算时间（想要保持速度一样，2种状态时间不同需算出）
/**
* @description: 用速度计算时间（想要保持速度一样，2种状态时间不同需算出）
* @author: renchao
*/
ComputationTime () {
this.firstAnimationTime = this.wordLength / this.speed;
this.secondAnimationTime =
(this.wordLength + this.backWidth) / this.speed;
},
// 根据状态切换动画
/**
* @description: 根据状态切换动画
* @author: renchao
*/
changeState () {
let text = this.$refs.text;
if (this.state == 1) {
......@@ -88,6 +102,10 @@ export default {
text.style.animation = `secondAnimation ${this.secondAnimationTime}s linear infinite`;
}
},
/**
* @description: Listener
* @author: renchao
*/
Listener () {
let text = this.$refs.text;
text.addEventListener(
......@@ -98,10 +116,18 @@ export default {
false
)
},
/**
* @description: mouseOver
* @author: renchao
*/
mouseOver () {
let text = this.$refs.text;
text.style.animationPlayState = 'paused'
},
/**
* @description: mouseLeave
* @author: renchao
*/
mouseLeave () {
let text = this.$refs.text;
text.style.animationPlayState = ''
......
......@@ -188,6 +188,10 @@
this.$img = this.$refs["img"];
},
methods: {
/**
* @description: imgLoaded
* @author: renchao
*/
imgLoaded () {
let imgInfo = this.$img.getBoundingClientRect();
if (JSON.stringify(this.imgInfo) != JSON.stringify(imgInfo)) {
......@@ -200,6 +204,10 @@
this.$emit("created", imgInfo);
}
},
/**
* @description: mouseMove
* @author: renchao
*/
mouseMove (e) {
if (!this.hideZoom && this.imgLoadedFlag) {
this.imgLoaded();
......@@ -225,6 +233,11 @@
selector.bgTop = addWidth - y * scale;
}
},
/**
* @description: initSelectorProperty
* @param {*} selectorWidth
* @author: renchao
*/
initSelectorProperty (selectorWidth) {
const selectorHalfWidth = selectorWidth / 2;
const selector = this.selector;
......@@ -236,12 +249,20 @@
selector.absoluteLeft = left + selectorHalfWidth + scrollLeft;
selector.absoluteTop = top + selectorHalfWidth + scrollTop;
},
/**
* @description: mouseLeave
* @author: renchao
*/
mouseLeave () {
this.hideSelector = true;
if (this.outShow) {
this.hideOutShow = true;
}
},
/**
* @description: reset
* @author: renchao
*/
reset () {
Object.assign(this.selector, {
top: 0,
......@@ -251,9 +272,18 @@
});
this.resetOutShowInitPosition();
},
/**
* @description: resetOutShowInitPosition
* @author: renchao
*/
resetOutShowInitPosition () {
this.outShowInitTop = 0;
},
/**
* @description: resetOutShowInitPosition
* @param {*} e
* @author: renchao
*/
imgerrorfun (e) {
// let img = require('@/assets/vehicle_img/blank_vehicle.jpg')
// this.url = img
......
......@@ -2,6 +2,15 @@ import Vue from 'vue'
import Popup from './index.vue'
const PopupBox = Vue.extend(Popup)
/**
* @description: install
* @param {*} title
* @param {*} editItem
* @param {*} data
* @param {*} formData
* @author: renchao
*/
Popup.install = function (title, editItem, data, formData) {
data.title = title
data.editItem = editItem
......
......@@ -55,7 +55,10 @@ export default {
}
},
mounted () {
// 计算滚动条高度
/**
* @description: 计算滚动条高度
* @author: renchao
*/
setTimeout(() => {
if (this.btnShow) {
if (this.height == 'auto') {
......@@ -73,10 +76,18 @@ export default {
}, 300)
},
methods: {
/**
* @description: onCancel
* @author: renchao
*/
onCancel () {
this.isShow = false
this.cancel()
},
/**
* @description: onConfirm
* @author: renchao
*/
onConfirm () {
this.loading = true
let res = new Promise((resolve, reject) => {
......@@ -87,9 +98,19 @@ export default {
this.isShow = false
}
},
/**
* @description: loadingFn
* @param {*} e
* @author: renchao
*/
loadingFn (e) { //加载状态
this.loading = e
},
/**
* @description: loadViewFn
* @param {*} view
* @author: renchao
*/
loadViewFn (view) {
return (r) =>
require.ensure([], () =>
......
......@@ -8,6 +8,10 @@ import Popup from './index.vue'
const PopupBox = Vue.extend(Popup)
let popuping = undefined
/**
* @description: close
* @author: renchao
*/
PopupBox.prototype.close = function () {
// 如果Popup 有引用，则去掉引用
if (popuping) {
......@@ -23,7 +27,14 @@ PopupBox.prototype.close = function () {
}
}, 300)
}
/**
* @description: Popup1
* @param {*} title
* @param {*} editItem
* @param {*} data
* @param {*} formData
* @author: renchao
*/
const Popup1 = (title, editItem, data, formData) => {
// 如果组件已渲染，则返回即可
if (popuping) {
......
......@@ -56,7 +56,10 @@
}
},
mounted () {
// 计算滚动条高度
/**
* @description: 计算滚动条高度
* @author: renchao
*/
setTimeout(() => {
if (this.btnShow) {
if (this.height == 'auto') {
......@@ -74,9 +77,17 @@
}, 300)
},
methods: {
/**
* @description: onCancel
* @author: renchao
*/
onCancel () {
Popup1().close()
},
/**
* @description: onConfirm
* @author: renchao
*/
onConfirm () {
let res = new Promise((resolve, reject) => {
this.confirm()
......@@ -86,6 +97,11 @@
this.isShow = false
}
},
/**
* @description: loadViewFn
* @param {*} view
* @author: renchao
*/
loadViewFn (view) {
return (r) =>
require.ensure([], () =>
......@@ -185,4 +201,3 @@
opacity: 0;
}
</style>
\ No newline at end of file
......
......@@ -84,6 +84,13 @@ export default {
},
methods: {
/**
* @description: updateStyle
* @param {*} style
* @param {*} oldCluster
* @param {*} newCluster
* @author: renchao
*/
updateStyle (style, oldCluster, newCluster) {
let newStyle = style
oldCluster.forEach((color, index) => {
......@@ -92,6 +99,12 @@ export default {
return newStyle
},
/**
* @description: getCSSString
* @param {*} url
* @param {*} variable
* @author: renchao
*/
getCSSString (url, variable) {
return new Promise(resolve => {
const xhr = new XMLHttpRequest()
......@@ -106,6 +119,11 @@ export default {
})
},
/**
* @description: getThemeCluster
* @param {*} theme
* @author: renchao
*/
getThemeCluster (theme) {
const tintColor = (color, tint) => {
let red = parseInt(color.slice(0, 2), 16)
......
......@@ -2,6 +2,10 @@ import objectAssign from 'element-ui/src/utils/merge';
import { markNodeData, NODE_KEY } from './util';
import { arrayFindIndex } from 'element-ui/src/utils/util';
/**
* @description: getChildState
* @author: renchao
*/
export const getChildState = node => {
let all = true;
let none = true;
......@@ -22,6 +26,11 @@ export const getChildState = node => {
return { all, none, allWithoutDisable, half: !all && !none };
};
/**
* @description: reInitChecked
* @param {*} node
* @author: renchao
*/
const reInitChecked = function(node) {
if (node.childNodes.length === 0 || node.loading) return;
......@@ -45,6 +54,12 @@ const reInitChecked = function(node) {
}
};
/**
* @description: getPropertyFromData
* @param {*} node
* @param {*} prop
* @author: renchao
*/
const getPropertyFromData = function(node, prop) {
const props = node.store.props;
const data = node.data || {};
......@@ -63,6 +78,11 @@ const getPropertyFromData = function(node, prop) {
let nodeIdSeed = 0;
export default class Node {
/**
* @description: constructor
* @param {*} options
* @author: renchao
*/
constructor(options) {
this.id = nodeIdSeed++;
this.text = null;
......@@ -135,6 +155,11 @@ export default class Node {
this.updateLeafState();
}
/**
* @description: setData
* @param {*} data
* @author: renchao
*/
setData(data) {
if (!Array.isArray(data)) {
markNodeData(this, data);
......@@ -155,20 +180,36 @@ export default class Node {
}
}
/**
* @description: label
* @author: renchao
*/
get label() {
return getPropertyFromData(this, 'label');
}
/**
* @description: key
* @author: renchao
*/
get key() {
const nodeKey = this.store.key;
if (this.data) return this.data[nodeKey];
return null;
}
/**
* @description: disabled
* @author: renchao
*/
get disabled() {
return getPropertyFromData(this, 'disabled');
}
/**
* @description: nextSibling
* @author: renchao
*/
get nextSibling() {
const parent = this.parent;
if (parent) {
......@@ -180,6 +221,10 @@ export default class Node {
return null;
}
/**
* @description: previousSibling
* @author: renchao
*/
get previousSibling() {
const parent = this.parent;
if (parent) {
......@@ -191,6 +236,12 @@ export default class Node {
return null;
}
/**
* @description: contains
* @param {*} target
* @param {*} deep
* @author: renchao
*/
contains(target, deep = true) {
const walk = function(parent) {
const children = parent.childNodes || [];
......@@ -208,6 +259,10 @@ export default class Node {
return walk(this);
}
/**
* @description: remove
* @author: renchao
*/
remove() {
const parent = this.parent;
if (parent) {
......@@ -215,6 +270,13 @@ export default class Node {
}
}
/**
* @description: insertChild
* @param {*} child
* @param {*} index
* @param {*} batch
* @author: renchao
*/
insertChild(child, index, batch) {
if (!child) throw new Error('insertChild error: child is required.');
......@@ -247,6 +309,12 @@ export default class Node {
this.updateLeafState();
}
/**
* @description: insertBefore
* @param {*} child
* @param {*} ref
* @author: renchao
*/
insertBefore(child, ref) {
let index;
if (ref) {
......@@ -255,6 +323,12 @@ export default class Node {
this.insertChild(child, index);
}
/**
* @description: insertAfter
* @param {*} child
* @param {*} ref
* @author: renchao
*/
insertAfter(child, ref) {
let index;
if (ref) {
......@@ -264,6 +338,11 @@ export default class Node {
this.insertChild(child, index);
}
/**
* @description: removeChild
* @param {*} child
* @author: renchao
*/
removeChild(child) {
const children = this.getChildren() || [];
const dataIndex = children.indexOf(child.data);
......@@ -282,6 +361,11 @@ export default class Node {
this.updateLeafState();
}
/**
* @description: removeChildByData
* @param {*} data
* @author: renchao
*/
removeChildByData(data) {
let targetNode = null;
......@@ -297,6 +381,12 @@ export default class Node {
}
}
/**
* @description: expand
* @param {*} callback
* @param {*} expandParent
* @author: renchao
*/
expand(callback, expandParent) {
const done = () => {
if (expandParent) {
......@@ -326,20 +416,38 @@ export default class Node {
}
}
/**
* @description: doCreateChildren
* @param {*} array
* @param {*} defaultProps
* @author: renchao
*/
doCreateChildren(array, defaultProps = {}) {
array.forEach((item) => {
this.insertChild(objectAssign({ data: item }, defaultProps), undefined, true);
});
}
/**
* @description: collapse
* @author: renchao
*/
collapse() {
this.expanded = false;
}
/**
* @description: shouldLoadData
* @author: renchao
*/
shouldLoadData() {
return this.store.lazy === true && this.store.load && !this.loaded;
}
/**
* @description: updateLeafState
* @author: renchao
*/
updateLeafState() {
if (this.store.lazy === true && this.loaded !== true && typeof this.isLeafByUser !== 'undefined') {
this.isLeaf = this.isLeafByUser;
......@@ -353,6 +461,14 @@ export default class Node {
this.isLeaf = false;
}
/**
* @description: setChecked
* @param {*} value
* @param {*} deep
* @param {*} recursion
* @param {*} passValue
* @author: renchao
*/
setChecked(value, deep, recursion, passValue) {
this.indeterminate = value === 'half';
this.checked = value === true;
......@@ -406,6 +522,11 @@ export default class Node {
}
}
/**
* @description: getChildren
* @param {*} forceInit
* @author: renchao
*/
getChildren(forceInit = false) { // this is data
if (this.level === 0) return this.data;
const data = this.data;
......@@ -428,6 +549,10 @@ export default class Node {
return data[children];
}
/**
* @description: updateChildren
* @author: renchao
*/
updateChildren() {
const newData = this.getChildren() || [];
const oldData = this.childNodes.map((node) => node.data);
......@@ -458,6 +583,12 @@ export default class Node {
this.updateLeafState();
}
/**
* @description: loadData
* @param {*} callback
* @param {*} defaultProps
* @author: renchao
*/
loadData(callback, defaultProps = {}) {
if (this.store.lazy === true && this.store.load && !this.loaded && (!this.loading || Object.keys(defaultProps).length)) {
this.loading = true;
......
......@@ -2,6 +2,11 @@ import Node from './node';
import { getNodeKey } from './util';
export default class TreeStore {
/**
* @description: constructor
* @param {*} options
* @author: renchao
*/
constructor(options) {
this.currentNode = null;
this.currentNodeKey = null;
......@@ -30,6 +35,11 @@ export default class TreeStore {
}
}
/**
* @description: filter
* @param {*} value
* @author: renchao
*/
filter(value) {
const filterNodeMethod = this.filterNodeMethod;
const lazy = this.lazy;
......@@ -60,6 +70,11 @@ export default class TreeStore {
traverse(this);
}
/**
* @description: setData
* @param {*} newVal
* @author: renchao
*/
setData(newVal) {
const instanceChanged = newVal !== this.root.data;
if (instanceChanged) {
......@@ -70,22 +85,44 @@ export default class TreeStore {
}
}
/**
* @description: getNode
* @param {*} data
* @author: renchao
*/
getNode(data) {
if (data instanceof Node) return data;
const key = typeof data !== 'object' ? data : getNodeKey(this.key, data);
return this.nodesMap[key] || null;
}
/**
* @description: insertBefore
* @param {*} data
* @param {*} refData
* @author: renchao
*/
insertBefore(data, refData) {
const refNode = this.getNode(refData);
refNode.parent.insertBefore({ data }, refNode);
}
/**
* @description: insertAfter
* @param {*} data
* @param {*} refData
* @author: renchao
*/
insertAfter(data, refData) {
const refNode = this.getNode(refData);
refNode.parent.insertAfter({ data }, refNode);
}
/**
* @description: remove
* @param {*} data
* @author: renchao
*/
remove(data) {
const node = this.getNode(data);
......@@ -97,6 +134,12 @@ export default class TreeStore {
}
}
/**
* @description: append
* @param {*} data
* @param {*} parentData
* @author: renchao
*/
append(data, parentData) {
const parentNode = parentData ? this.getNode(parentData) : this.root;
......@@ -105,6 +148,10 @@ export default class TreeStore {
}
}
/**
* @description: _initDefaultCheckedNodes
* @author: renchao
*/
_initDefaultCheckedNodes() {
const defaultCheckedKeys = this.defaultCheckedKeys || [];
const nodesMap = this.nodesMap;
......@@ -118,6 +165,11 @@ export default class TreeStore {
});
}
/**
* @description: _initDefaultCheckedNode
* @param {*} node
* @author: renchao
*/
_initDefaultCheckedNode(node) {
const defaultCheckedKeys = this.defaultCheckedKeys || [];
......@@ -126,6 +178,11 @@ export default class TreeStore {
}
}
/**
* @description: setDefaultCheckedKey
* @param {*} newVal
* @author: renchao
*/
setDefaultCheckedKey(newVal) {
if (newVal !== this.defaultCheckedKeys) {
this.defaultCheckedKeys = newVal;
......@@ -133,6 +190,11 @@ export default class TreeStore {
}
}
/**
* @description: registerNode
* @param {*} node
* @author: renchao
*/
registerNode(node) {
const key = this.key;
if (!key || !node || !node.data) return;
......@@ -141,6 +203,11 @@ export default class TreeStore {
if (nodeKey !== undefined) this.nodesMap[node.key] = node;
}
/**
* @description: deregisterNode
* @param {*} node
* @author: renchao
*/
deregisterNode(node) {
const key = this.key;
if (!key || !node || !node.data) return;
......@@ -152,6 +219,12 @@ export default class TreeStore {
delete this.nodesMap[node.key];
}
/**
* @description: getCheckedNodes
* @param {*} leafOnly
* @param {*} includeHalfChecked
* @author: renchao
*/
getCheckedNodes(leafOnly = false, includeHalfChecked = false) {
const checkedNodes = [];
const traverse = function(node) {
......@@ -171,10 +244,19 @@ export default class TreeStore {
return checkedNodes;
}
/**
* @description: getCheckedKeys
* @param {*} leafOnly
* @author: renchao
*/
getCheckedKeys(leafOnly = false) {
return this.getCheckedNodes(leafOnly).map((data) => (data || {})[this.key]);
}
/**
* @description: getHalfCheckedNodes
* @author: renchao
*/
getHalfCheckedNodes() {
const nodes = [];
const traverse = function(node) {
......@@ -194,10 +276,18 @@ export default class TreeStore {
return nodes;
}
/**
* @description: getHalfCheckedKeys
* @author: renchao
*/
getHalfCheckedKeys() {
return this.getHalfCheckedNodes().map((data) => (data || {})[this.key]);
}
/**
* @description: _getAllNodes
* @author: renchao
*/
_getAllNodes() {
const allNodes = [];
const nodesMap = this.nodesMap;
......@@ -210,6 +300,12 @@ export default class TreeStore {
return allNodes;
}
/**
* @description: updateChildren
* @param {*} key
* @param {*} data
* @author: renchao
*/
updateChildren(key, data) {
const node = this.nodesMap[key];
if (!node) return;
......@@ -224,6 +320,13 @@ export default class TreeStore {
}
}
/**
* @description: _setCheckedKeys
* @param {*} key
* @param {*} leafOnly
* @param {*} checkedKeys
* @author: renchao
*/
_setCheckedKeys(key, leafOnly = false, checkedKeys) {
const allNodes = this._getAllNodes().sort((a, b) => b.level - a.level);
const cache = Object.create(null);
......@@ -268,6 +371,12 @@ export default class TreeStore {
}
}
/**
* @description: setCheckedNodes
* @param {*} array
* @param {*} leafOnly
* @author: renchao
*/
setCheckedNodes(array, leafOnly = false) {
const key = this.key;
const checkedKeys = {};
......@@ -278,6 +387,12 @@ export default class TreeStore {
this._setCheckedKeys(key, leafOnly, checkedKeys);
}
/**
* @description: setCheckedKeys
* @param {*} array
* @param {*} leafOnly
* @author: renchao
*/
setCheckedKeys(keys, leafOnly = false) {
this.defaultCheckedKeys = keys;
const key = this.key;
......@@ -289,6 +404,11 @@ export default class TreeStore {
this._setCheckedKeys(key, leafOnly, checkedKeys);
}
/**
* @description: setDefaultExpandedKeys
* @param {*} keys
* @author: renchao
*/
setDefaultExpandedKeys(keys) {
keys = keys || [];
this.defaultExpandedKeys = keys;
......@@ -299,6 +419,13 @@ export default class TreeStore {
});
}
/**
* @description: setChecked
* @param {*} data
* @param {*} checked
* @param {*} deep
* @author: renchao
*/
setChecked(data, checked, deep) {
const node = this.getNode(data);
......@@ -307,10 +434,19 @@ export default class TreeStore {
}
}
/**
* @description: getCurrentNode
* @author: renchao
*/
getCurrentNode() {
return this.currentNode;
}
/**
* @description: setCurrentNode
* @param {*} currentNode
* @author: renchao
*/
setCurrentNode(currentNode) {
const prevCurrentNode = this.currentNode;
if (prevCurrentNode) {
......@@ -320,12 +456,22 @@ export default class TreeStore {
this.currentNode.isCurrent = true;
}
/**
* @description: setUserCurrentNode
* @param {*} node
* @author: renchao
*/
setUserCurrentNode(node) {
const key = node[this.key];
const currNode = this.nodesMap[key];
this.setCurrentNode(currNode);
}
/**
* @description: setCurrentNodeKey
* @param {*} key
* @author: renchao
*/
setCurrentNodeKey(key) {
if (key === null || key === undefined) {
this.currentNode && (this.currentNode.isCurrent = false);
......
export const NODE_KEY = '$treeNodeId';
/**
* @description: markNodeData
* @param {*} node
* @param {*} data
* @author: renchao
*/
export const markNodeData = function(node, data) {
if (!data || data[NODE_KEY]) return;
Object.defineProperty(data, NODE_KEY, {
......@@ -10,11 +16,23 @@ export const markNodeData = function(node, data) {
});
};
/**
* @description: getNodeKey
* @param {*} key
* @param {*} data
* @author: renchao
*/
export const getNodeKey = function(key, data) {
if (!key) return data[NODE_KEY];
return data[key];
};
/**
* @description: findNearestComponent
* @param {*} element
* @param {*} componentName
* @author: renchao
*/
export const findNearestComponent = (element, componentName) => {
let target = element;
while (target && target.tagName !== 'BODY') {
......
......@@ -116,10 +116,21 @@ export default {
},
methods: {
/**
* @description: getNodeKey
* @param {*} node
* @author: renchao
*/
getNodeKey (node) {
return getNodeKey(this.tree.nodeKey, node.data);
},
/**
* @description: handleSelectChange
* @param {*} checked
* @param {*} indeterminate
* @author: renchao
*/
handleSelectChange (checked, indeterminate) {
if (this.oldChecked !== checked && this.oldIndeterminate !== indeterminate) {
this.tree.$emit('check-change', this.node.data, checked, indeterminate);
......@@ -128,6 +139,10 @@ export default {
this.indeterminate = indeterminate;
},
/**
* @description: handleClick
* @author: renchao
*/
handleClick () {
const store = this.tree.store;
store.setCurrentNode(this.node);
......@@ -144,6 +159,11 @@ export default {
this.tree.$emit('node-click', this.node.data, this.node, this);
},
/**
* @description: handleContextMenu
* @param {*} event
* @author: renchao
*/
handleContextMenu (event) {
if (this.tree._events['node-contextmenu'] && this.tree._events['node-contextmenu'].length > 0) {
event.stopPropagation();
......@@ -152,6 +172,10 @@ export default {
this.tree.$emit('node-contextmenu', event, this.node.data, this.node, this);
},
/**
* @description: handleExpandIconClick
* @author: renchao
*/
handleExpandIconClick () {
if (this.node.isLeaf) return;
if (this.expanded) {
......@@ -163,6 +187,12 @@ export default {
}
},
/**
* @description: handleCheckChange
* @param {*} value
* @param {*} ev
* @author: renchao
*/
handleCheckChange (value, ev) {
this.node.setChecked(ev.target.checked, !this.tree.checkStrictly);
this.$nextTick(() => {
......@@ -176,26 +206,53 @@ export default {
});
},
/**
* @description: handleChildNodeExpand
* @param {*} nodeData
* @param {*} node
* @param {*} instance
* @author: renchao
*/
handleChildNodeExpand (nodeData, node, instance) {
this.broadcast('ElTreeNode', 'tree-node-expand', node);
this.tree.$emit('node-expand', nodeData, node, instance);
},
/**
* @description: handleDragStart
* @param {*} event
* @author: renchao
*/
handleDragStart (event) {
if (!this.tree.draggable) return;
this.tree.$emit('tree-node-drag-start', event, this);
},
/**
* @description: handleDragOver
* @param {*} event
* @author: renchao
*/
handleDragOver (event) {
if (!this.tree.draggable) return;
this.tree.$emit('tree-node-drag-over', event, this);
event.preventDefault();
},
/**
* @description: handleDrop
* @param {*} event
* @author: renchao
*/
handleDrop (event) {
event.preventDefault();
},
/**
* @description: handleDragEnd
* @param {*} event
* @author: renchao
*/
handleDragEnd (event) {
if (!this.tree.draggable) return;
this.tree.$emit('tree-node-drag-end', event, this);
......
......@@ -177,15 +177,30 @@
},
methods: {
/**
* @description: filter
* @param {*} value
* @author: renchao
*/
filter(value) {
if (!this.filterNodeMethod) throw new Error('[Tree] filterNodeMethod is required when filter');
this.store.filter(value);
},
/**
* @description: getNodeKey
* @param {*} node
* @author: renchao
*/
getNodeKey(node) {
return getNodeKey(this.nodeKey, node.data);
},
/**
* @description: getNodePath
* @param {*} data
* @author: renchao
*/
getNodePath(data) {
if (!this.nodeKey) throw new Error('[Tree] nodeKey is required in getNodePath');
const node = this.store.getNode(data);
......@@ -199,87 +214,188 @@
return path.reverse();
},
/**
* @description: getCheckedNodes
* @param {*} leafOnly
* @param {*} includeHalfChecked
* @author: renchao
*/
getCheckedNodes(leafOnly, includeHalfChecked) {
return this.store.getCheckedNodes(leafOnly, includeHalfChecked);
},
/**
* @description: getCheckedKeys
* @param {*} leafOnly
* @author: renchao
*/
getCheckedKeys(leafOnly) {
return this.store.getCheckedKeys(leafOnly);
},
/**
* @description: getCurrentNode
* @author: renchao
*/
getCurrentNode() {
const currentNode = this.store.getCurrentNode();
return currentNode ? currentNode.data : null;
},
/**
* @description: getCurrentKey
* @author: renchao
*/
getCurrentKey() {
if (!this.nodeKey) throw new Error('[Tree] nodeKey is required in getCurrentKey');
const currentNode = this.getCurrentNode();
return currentNode ? currentNode[this.nodeKey] : null;
},
/**
* @description: setCheckedNodes
* @param {*} nodes
* @param {*} leafOnly
* @author: renchao
*/
setCheckedNodes(nodes, leafOnly) {
if (!this.nodeKey) throw new Error('[Tree] nodeKey is required in setCheckedNodes');
this.store.setCheckedNodes(nodes, leafOnly);
},
/**
* @description: setCheckedKeys
* @param {*} keys
* @param {*} leafOnly
* @author: renchao
*/
setCheckedKeys(keys, leafOnly) {
if (!this.nodeKey) throw new Error('[Tree] nodeKey is required in setCheckedKeys');
this.store.setCheckedKeys(keys, leafOnly);
},
/**
* @description: setChecked
* @param {*} data
* @param {*} checked
* @param {*} deep
* @author: renchao
*/
setChecked(data, checked, deep) {
this.store.setChecked(data, checked, deep);
},
/**
* @description: getHalfCheckedNodes
* @author: renchao
*/
getHalfCheckedNodes() {
return this.store.getHalfCheckedNodes();
},
/**
* @description: getHalfCheckedKeys
* @author: renchao
*/
getHalfCheckedKeys() {
return this.store.getHalfCheckedKeys();
},
/**
* @description: setCurrentNode
* @param {*} node
* @author: renchao
*/
setCurrentNode(node) {
if (!this.nodeKey) throw new Error('[Tree] nodeKey is required in setCurrentNode');
this.store.setUserCurrentNode(node);
},
/**
* @description: setCurrentKey
* @param {*} key
* @author: renchao
*/
setCurrentKey(key) {
if (!this.nodeKey) throw new Error('[Tree] nodeKey is required in setCurrentKey');
this.store.setCurrentNodeKey(key);
},
/**
* @description: getNode
* @param {*} data
* @author: renchao
*/
getNode(data) {
return this.store.getNode(data);
},
/**
* @description: remove
* @param {*} data
* @author: renchao
*/
remove(data) {
this.store.remove(data);
},
/**
* @description: append
* @param {*} data
* @param {*} parentNode
* @author: renchao
*/
append(data, parentNode) {
this.store.append(data, parentNode);
},
/**
* @description: insertBefore
* @param {*} data
* @param {*} refNode
* @author: renchao
*/
insertBefore(data, refNode) {
this.store.insertBefore(data, refNode);
},
/**
* @description: insertAfter
* @param {*} data
* @param {*} refNode
* @author: renchao
*/
insertAfter(data, refNode) {
this.store.insertAfter(data, refNode);
},
/**
* @description: handleNodeExpand
* @param {*} nodeData
* @param {*} node
* @param {*} instance
* @author: renchao
*/
handleNodeExpand(nodeData, node, instance) {
this.broadcast('ElTreeNode', 'tree-node-expand', node);
this.$emit('node-expand', nodeData, node, instance);
},
/**
* @description: updateKeyChildren
* @param {*} key
* @param {*} data
* @author: renchao
*/
updateKeyChildren(key, data) {
if (!this.nodeKey) throw new Error('[Tree] nodeKey is required in updateKeyChild');
this.store.updateChildren(key, data);
},
/**
* @description: initTabIndex
* @author: renchao
*/
initTabIndex() {
this.treeItems = this.$el.querySelectorAll('.is-focusable[role=treeitem]');
this.checkboxItems = this.$el.querySelectorAll('input[type=checkbox]');
......@@ -291,6 +407,11 @@
this.treeItems[0] && this.treeItems[0].setAttribute('tabindex', 0);
},
/**
* @description: handleKeydown
* @param {*} ev
* @author: renchao
*/
handleKeydown(ev) {
const currentItem = ev.target;
if (currentItem.className.indexOf('el-tree-node') === -1) return;
......@@ -319,6 +440,10 @@
}
},
/**
* @description: created
* @author: renchao
*/
created() {
this.isTree = true;
......
......@@ -36,9 +36,18 @@ export default {
})
},
methods: {
/**
* @description: closeViewer
* @author: renchao
*/
closeViewer () {
this.$emit('close-viewer')
},
/**
* @description: hideCusBtn
* @param {*} e
* @author: renchao
*/
hideCusBtn (e) {
let className = e.target.className
if (className === 'el-icon-download') {
......@@ -48,6 +57,11 @@ export default {
this.downloadImage(imgUrl)
}
},
/**
* @description: downloadImage
* @param {*} imgUrl
* @author: renchao
*/
downloadImage (imgUrl) {
let tmpArr = imgUrl.split('/')
let fileName = tmpArr[tmpArr.length - 1]
......
......@@ -77,7 +77,11 @@
this.autoCurrentLabel()
},
methods: {
//表格显示隐藏回调
/**
* @description: 表格显示隐藏回调
* @param {*} visible
* @author: renchao
*/
visibleChange (visible) {
if (visible) {
this.formData = {}
......@@ -86,7 +90,10 @@
this.autoCurrentLabel()
}
},
//获取表格数据
/**
* @description: 获取表格数据
* @author: renchao
*/
async getData () {
//表格默认赋值
if (this.multiple) {
......@@ -104,11 +111,17 @@
}
// this.$refs.table.setScrollTop(0)
},
//插糟表单提交
/**
* @description: 插糟表单提交
* @author: renchao
*/
formSubmit () {
this.getData()
},
//自动模拟options赋值
/**
* @description: 自动模拟options赋值
* @author: renchao
*/
autoCurrentLabel () {
this.$nextTick(() => {
if (this.multiple) {
......@@ -122,7 +135,12 @@
}
})
},
//表格勾选事件
/**
* @description: 表格勾选事件
* @param {*} rows
* @param {*} row
* @author: renchao
*/
select (rows, row) {
var isSelect = rows.length && rows.indexOf(row) !== -1
if (isSelect) {
......@@ -134,7 +152,11 @@
this.$emit('update:modelValue', this.defaultValue);
this.$emit('change', this.defaultValue);
},
//表格全选事件
/**
* @description: 表格全选事件
* @param {*} rows
* @author: renchao
*/
selectAll (rows) {
var isAllSelect = rows.length > 0
if (isAllSelect) {
......@@ -156,6 +178,11 @@
this.$emit('update:modelValue', this.defaultValue);
this.$emit('change', this.defaultValue);
},
/**
* @description: click
* @param {*} row
* @author: renchao
*/
click (row) {
if (this.multiple) {
//处理多选点击行
......@@ -168,25 +195,42 @@
this.$emit('change', this.defaultValue);
}
},
//tags删除后回调
/**
* @description: tags删除后回调
* @param {*} tag
* @author: renchao
*/
removeTag (tag) {
var row = this.findRowByKey(tag[this.defaultProps.value])
this.$refs.table.toggleRowSelection(row, false);
this.$emit('update:modelValue', this.defaultValue);
},
//清空后的回调
/**
* @description: 清空后的回调
* @author: renchao
*/
clear () {
this.$emit('update:modelValue', this.defaultValue);
},
// 关键值查询表格数据行
/**
* @description: 关键值查询表格数据行
* @param {*} value
* @author: renchao
*/
findRowByKey (value) {
return this.tableData.find(item => item[this.defaultProps.value] === value)
},
// 触发select隐藏
/**
* @description: 触发select隐藏
* @author: renchao
*/
blur () {
this.$refs.select.blur();
},
// 触发select显示
/**
* @description: 触发select显示
* @author: renchao
*/
focus () {
this.$refs.select.focus();
}
......