Dive into secure and efficient coding practices with our curated list of the top 10 examples showcasing 'xe-utils' in functional components in JavaScript. Our advanced machine learning engine meticulously scans each line of code, cross-referencing millions of open source libraries to ensure your implementation is not just functional, but also robust and secure. Elevate your React applications to new heights by mastering the art of handling side effects, API calls, and asynchronous operations with confidence and precision.
formatterDate (row, column, cellValue, index) {
return XEUtils.toDateString(cellValue, 'yyyy-MM-dd HH:mm:ss')
},
// 单元格失焦后实时保存数据
filterMethod ({ option, row, column }) {
let { data } = option
let cellValue = XEUtils.get(row, column.property)
/* eslint-disable eqeqeq */
return cellValue == data
}
})
this.visibleColumn.forEach(column => {
if (column.property && !XEUtils.has(recordItem, column.property)) {
XEUtils.set(recordItem, column.property, null)
}
// 如果设置了 Key 就必须要唯一,可以自行设置;如果为空,则默认生成一个随机数
if (rowKey && !XEUtils.get(recordItem, rowKey)) {
XEUtils.set(recordItem, rowKey, ++rowUniqueId + Date.now())
}
})
return recordItem
// 如果配置了右键菜单;支持方向键操作、回车
evnt.preventDefault()
evnt.stopPropagation()
if (ctxMenuStore.showChild && this._hasCtxChilds(ctxMenuStore.selected)) {
this._handleCtxMenu(evnt, keyCode, ctxMenuStore, 'selectChild', 37, false, ctxMenuStore.selected.children)
} else {
this._handleCtxMenu(evnt, keyCode, ctxMenuStore, 'selected', 39, true, this.ctxMenuList)
}
return
} else if (isTab || (keyCode >= 37 && keyCode <= 40)) {
// 方向键、Tab 键处理
if ((this.configs.isTabKey && isTab) || this.configs.isArrowKey) {
let rowIndex = XEUtils.findIndexOf(tableData, isTab ? row => row.editActive || row.checked : row => row.checked)
let row = tableData[rowIndex]
if (row) {
let columnIndex = XEUtils.findIndexOf(columns, isTab ? column => column.property === row.editActive || column.property === row.checked : column => column.property === row.checked)
let column = columns[columnIndex]
if (column) {
switch (keyCode) {
case 9:
let offsetColumn = columns.find((column, index) => index > columnIndex && column.property)
// 从当前行中查找下一个可编辑列
// 如果找不到则从下一行开始找
if (offsetColumn && offsetColumn.property) {
if (this.configs.mode === 'cell' && row.editActive) {
let { cell } = this._getColumnByRowIndex(row.data, column.property)
this._validCellRules('blur', row, column)
.then(() => {
this._restoreTooltip()
this._clearActiveData()
this._tabActiveCell(row, offsetColumn)
}).catch(rule => this._toValidError(rule, row, column, cell))
_getRowIndex (row) {
return XEUtils.findIndexOf(this._getTDatas(), item => item === row)
},
// 获取列的索引
if (rowIndex > 0) {
this._moveUpAndDown(tableData, row, column, rowIndex - 1)
}
break
case 40:
if (rowIndex < tableData.length - 1) {
this._moveUpAndDown(tableData, row, column, rowIndex + 1)
}
break
}
}
}
}
} else if (this.configs.isCheckedEdit && ((keyCode >= 48 && keyCode <= 57) || (keyCode >= 65 && keyCode <= 90) || (keyCode >= 96 && keyCode <= 111) || (keyCode >= 186 && keyCode <= 192) || (keyCode >= 219 && keyCode <= 222) || keyCode === 32)) {
// 如果是选中状态,按任意键进入编辑
let rowIndex = XEUtils.findIndexOf(tableData, row => !row.editActive && row.checked)
let row = tableData[rowIndex]
if (row) {
let columnIndex = XEUtils.findIndexOf(columns, column => column.property === row.checked)
let column = columns[columnIndex]
if (column) {
let { cell } = this._getColumnByRowIndex(row.data, column.property)
this._triggerActive(row, column, cell, event)
.then(() => {
if (this.configs.checkedEditMethod ? this.configs.checkedEditMethod({ row: row.data, rowIndex, column, columnIndex, cell }, evnt) !== false : true) {
XEUtils.set(row.data, column.property, null)
}
})
}
}
} else if (this.configs.isDelKey && (keyCode === 8 || keyCode === 46)) {
// 如果是删除键
checkValid () {
// 查找是否存在校验不通过的列
let matchObj = XEUtils.findTree(this.datas, row => row.validActive, this.elTreeOpts)
if (matchObj) {
let row = matchObj.item
let column = XEUtils.findIndexOf(this.getColumns(), column => column.property === row.validActive)
return {
error: true,
row: row.data,
rowIndex: this._getRowIndex(row),
column,
columnIndex: this._getColumnIndex(column),
rule: row.validRule
}
}
return {
error: false
}
},
/**
let rowIndex = this._getRowIndex(row)
let type = 'out'
let isClearActive = true
let trElem, cellElem
target = evnt.target
while (target && target.nodeType && target !== document) {
if (UtilHandle.hasClass(target, 'elx-editable-row')) {
trElem = target
} else if (UtilHandle.hasClass(target, 'elx-editable-column')) {
cellElem = target
} else if (UtilHandle.hasClass(target, 'elx-editable')) {
// 如果是同表格
if (trElem && cellElem && target === this.$el) {
if (this.configs.mode === 'row') {
// 并且是同一行
if (XEUtils.findIndexOf(Array.from(trElem.parentNode.children), item => item === trElem) === rowIndex) {
return
}
} else {
// 并且是同一单元格
if (cellElem === cell) {
return
}
}
type = 'in'
}
break
}
target = target.parentNode
}
if (clearActiveMethod) {
let param = {
break
case 40:
if (rowIndex < tableData.length - 1) {
this._moveUpAndDown(tableData, row, column, rowIndex + 1)
}
break
}
}
}
}
} else if (this.configs.isCheckedEdit && ((keyCode >= 48 && keyCode <= 57) || (keyCode >= 65 && keyCode <= 90) || (keyCode >= 96 && keyCode <= 111) || (keyCode >= 186 && keyCode <= 192) || (keyCode >= 219 && keyCode <= 222) || keyCode === 32)) {
// 如果是选中状态,按任意键进入编辑
let rowIndex = XEUtils.findIndexOf(tableData, row => !row.editActive && row.checked)
let row = tableData[rowIndex]
if (row) {
let columnIndex = XEUtils.findIndexOf(columns, column => column.property === row.checked)
let column = columns[columnIndex]
if (column) {
let { cell } = this._getColumnByRowIndex(row.data, column.property)
this._triggerActive(row, column, cell, event)
.then(() => {
if (this.configs.checkedEditMethod ? this.configs.checkedEditMethod({ row: row.data, rowIndex, column, columnIndex, cell }, evnt) !== false : true) {
XEUtils.set(row.data, column.property, null)
}
})
}
}
} else if (this.configs.isDelKey && (keyCode === 8 || keyCode === 46)) {
// 如果是删除键
let rowIndex = XEUtils.findIndexOf(tableData, row => !row.editActive && row.checked)
let row = tableData[rowIndex]
if (row) {
list.forEach((item, index) => {
if (XEUtils.isDate(item.date)) {
item.date = item.date.getTime()
}
// 重新生成排序后的序号
item.seq = index
})
this.loading = true