sh-view 1.7.5 → 2.0.0

package/packages/components/global-components/{sh-vxe-table → sh-table}/js/methods.js

@@ -7,10 +7,9 @@ const vxeEvents = {
 	},
 	// 单选框变化
 	onRadioChange(params) {
-		const that = this
 		var { row } = params
-		that.selectionRows = [row]
-		that.$emit('radio-change', that.selectionRows, params)
+		this.selectionRows = [row]
+		this.$emit('radio-change', this.selectionRows, params)
 	},
 	// 复选框变化
 	onSelectionChange(params) {
@@ -63,15 +62,14 @@ const vxeEvents = {
 	},
 	// 只对 edit-config 配置时有效，单元格编辑状态下被关闭时会触发该事件
 	async onEditClosed(params) {
-		const that = this
 		let { row, column } = params
 		let { property, model, rname, rprops } = column
 		if ((model.update || model.change) && rname) {
-			let { rvalue, rtext } = that.$vUtils.formatRender(model.value, property, row, rname, rprops, that, true)
-			that.$vUtils.set(row, column.property, rvalue)
+			let { rvalue, rtext } = this.$vUtils.formatRender(model.value, property, row, rname, rprops, this, true)
+			this.$vUtils.set(row, column.property, rvalue)
 			model.change = false
 		}
-		that.$emit('edit-closed', params)
+		this.$emit('edit-closed', params)
 	},
 	// 只对 edit-config 配置时有效，单元格被激活编辑时会触发该事件
 	async onEditActived(params) {
@@ -87,10 +85,7 @@ const vxeEvents = {
 	},
 	// 分页变化触发
 	onPageChange(params) {
-		let { currentPage, pageSize } = params
 		this.selectionRows = []
-		this.tablePagerConfig.currentPage = currentPage
-		this.tablePagerConfig.pageSize = pageSize
 		this.$emit('page-change', params)
 	},
 
@@ -108,12 +103,10 @@ const vxeEvents = {
 const vxeFormEvents = {
 	// 表单展开全部/收起切换事件
 	onFormCollapsed(value) {
-		const that = this
-		if (that.tableVitualScroll) {
-			setTimeout(() => {
-				that.tableRef().recalculate(true)
-			}, 200)
-		}
+		const { tableRef } = this
+		setTimeout(() => {
+			tableRef().recalculate(true)
+		})
 	},
 	// -------- 搜索
 	onFormSubmit() {
@@ -137,10 +130,9 @@ const vxeMethods = {
 	// // vxe组件方法可通过 this.tableRef() 调用
 	// 表格全选
 	setSelectionAll() {
-		const that = this
-		that.isAllChecked = !that.isAllChecked
-		that.tableRef().setAllCheckboxRow(that.isAllChecked)
-		that.selectionRows = that.tableRef().getCheckboxRecords()
+		this.isAllChecked = !this.isAllChecked
+		this.tableRef().setAllCheckboxRow(this.isAllChecked)
+		this.selectionRows = this.tableRef().getCheckboxRecords()
 	},
 	// 表格打印、导出统一过滤列
 	columnDefaultFilterMethod({ column, $columnIndex }) {
@@ -164,14 +156,14 @@ const vxeMethods = {
 				data = this.getSelectionData()
 			} else {
 				data = this.$vUtils.clone(this.tableRef().getTableData().fullData, true)
-				let rnameColumns = columns.map(col => col.rname)
+				let rnameColumns = columns.filter(col => col.rname)
 				rnameColumns.forEach(col => {
 					let { property, rname, rprops } = col
 					data.forEach(row => {
 						let cellValue = this.$vUtils.get(row, property)
 						if (!this.$vUtils.isNone(cellValue)) {
-							let formatValue = this.$vUtils.formatRender(cellValue, property, row, rname, rprops, this)
-							this.$vUtils.set(row, property, formatValue)
+							let { rvalue, rtext } = this.$vUtils.formatRender(cellValue, property, row, rname, rprops, this)
+							this.$vUtils.set(row, property, rtext)
 						}
 					})
 				})
@@ -188,11 +180,11 @@ const vxeMethods = {
 	},
 	// 默认求底部绑定方法vxe
 	tableFooterMethod({ columns, data }) {
-		let that = this
+		const { footerCalculate, tableFooterCompute } = this
 		let footerData = []
-		let footerCalculateList = that.footerCalculate.calculate || []
+		let footerCalculateList = footerCalculate.calculate || []
 		footerCalculateList.forEach(key => {
-			footerData.push(that.tableFooterCompute(columns, data, key, that.footerCalculate[key]))
+			footerData.push(tableFooterCompute(columns, data, key, footerCalculate[key]))
 		})
 		return footerData
 	},
@@ -230,8 +222,8 @@ const vxeMethods = {
 		})
 	},
 	tableFooterSpanMethod({ $rowIndex, column, $columnIndex, data }) {
-		let that = this
-		let defaultColumns = that.columnsConfigDefault.filter(item => that.tableGlobalConfig[item.type])
+		const { columnsConfigDefault, tableGlobalConfig } = this
+		let defaultColumns = columnsConfigDefault.filter(item => tableGlobalConfig[item.type])
 		let colspan = defaultColumns.length || 1
 		if (column.type === 'seq') {
 			return { rowspan: 1, colspan: colspan }
@@ -246,125 +238,57 @@ const vxeMethods = {
 const shMethods = {
 	// 初始化
 	initCreated() {},
-	// 初始化分页配置
-	initPagerConfig() {
-		if (this.pagerConfig === false || this.reverse) {
-			this.tablePagerConfig = { enabled: false }
-		} else {
-			this.tablePagerConfig = Object.assign({}, this.pagerConfigDefault, this.pagerConfig)
-		}
-	},
 	// 初始化生成新表头数据
 	initTableColumns(columns = []) {
-		let that = this
-		let { columnsArr, columnsFlatArr, formItemsArr, rules } = that.getTransfarColumn(columns)
-		that.tableColumnsFlat = columnsFlatArr
-		that.tableFormItems = formItemsArr
-		that.initEditRules(rules)
-		if (!that.tableReverse) {
-			that.tableColumnsFixed = that.$vUtils.clone(columnsArr, true)
-		} else {
-			that.tableColumnsFixed = that.getReverseColumn(that.columns)
-		}
+		let { columnsArr, columnsFlatArr, formItemsArr, rules } = this.getTransfarColumn(columns)
+		this.tableColumnsFlat = columnsFlatArr
+		this.tableFormItems = formItemsArr
+		this.initEditRules(rules)
+		this.tableColumnsFixed = this.$vUtils.clone(columnsArr, true)
 	},
 	// 初始化验证规则
 	initEditRules(rules) {
-		const that = this
-		if (rules && that.$vUtils.isPlainObject(rules)) {
+		const { $vUtils } = this
+		if (rules && $vUtils.isPlainObject(rules)) {
 			Object.keys(rules).forEach(key => {
-				if (that.tableEditRules[key]) {
-					that.tableEditRules[key] = Array.from(new Set(that.tableEditRules[key].concat(rules[key])))
+				if (this.tableEditRules[key]) {
+					this.tableEditRules[key] = Array.from(new Set(this.tableEditRules[key].concat(rules[key])))
 				} else {
-					that.tableEditRules[key] = rules[key]
+					this.tableEditRules[key] = rules[key]
 				}
 			})
 		}
 	},
 	// 初始化表头配置默认值
 	initColsDefaultValue() {
-		const that = this
+		const { tableColumnsFlat, dataSourse, $vUtils } = this
 		let colsDefaultValue = {}
-		that.$vUtils.eachTree(that.tableColumnsFlat, item => {
+		$vUtils.eachTree(tableColumnsFlat, item => {
 			let renderObj = item.editRender || item.cellRender || {}
 			let noRenderArr = ['$vGlobalOption']
-			if (!noRenderArr.includes(renderObj.name) && !that.$vUtils.isNone(renderObj.props?.defaultValue)) {
-				that.$vUtils.set(colsDefaultValue, item.field, renderObj.props?.defaultValue)
+			if (!noRenderArr.includes(renderObj.name) && !$vUtils.isNone(renderObj.props?.defaultValue)) {
+				$vUtils.set(colsDefaultValue, item.field, renderObj.props?.defaultValue)
 			}
 		})
-		that.tableRowDefaultData = colsDefaultValue
-		if (Array.isArray(that.dataSourse) && Object.keys(colsDefaultValue).length > 0) {
-			that.dataSourse.forEach(row => {
+		this.tableRowDefaultData = colsDefaultValue
+		if (Array.isArray(dataSourse) && Object.keys(colsDefaultValue).length > 0) {
+			dataSourse.forEach(row => {
 				Object.keys(colsDefaultValue).forEach(field => {
-					if (that.$vUtils.isNone(that.$vUtils.get(row, field))) {
-						that.$vUtils.set(row, field, that.$vUtils.get(colsDefaultValue, field))
+					if ($vUtils.isNone($vUtils.get(row, field))) {
+						$vUtils.set(row, field, $vUtils.get(colsDefaultValue, field))
 					}
 				})
 			})
 		}
 	},
-	// 反转表格-反转表头及数据
-	getReverseColumn(oriColumns) {
-		const that = this
-		let columns = []
-		let columnsNum = that.reverseConfig.num
-		let keyPrefix = that.reverseConfig.keyPrefix || 'reversePre'
-		let titPrefix = that.reverseConfig.titPrefix || ''
-		let valueRenderObj = that.disabled ? { cellRender: { name: '$vRowCell' } } : { editRender: { name: '$vRowCell' } }
-		if (columnsNum) {
-			for (let i = 1; i <= columnsNum; i++) {
-				columns.push(
-					Object.assign({ field: `${keyPrefix}title${i}`, title: `名称${i}` }, that.columnObjDefault),
-					Object.assign({ field: `${keyPrefix}value${i}`, title: `数值${i}` }, that.columnObjDefault, valueRenderObj)
-				)
-			}
-		} else {
-			columns.push(Object.assign({ field: `${keyPrefix}title`, title: '名称', fixed: 'left' }, that.columnObjDefault))
-			that.dataSourse.forEach((item, index) => {
-				columns.push(Object.assign({ field: `${keyPrefix}value${index + 1}`, title: `${titPrefix}${index + 1}` }, that.columnObjDefault, valueRenderObj))
-			})
-		}
-		return columns
-	},
-	// 反转表格-反转配置生成数据
-	getReverseData(oriData = []) {
-		const that = this
-		let data = []
-		let columnsNum = that.reverseConfig.num
-		let keyPrefix = that.reverseConfig.keyPrefix || 'reversePre'
-		if (columnsNum) {
-			// 将表头平均分组
-			let chunkColumns = that.$vUtils.chunk(that.columns, columnsNum)
-			chunkColumns.forEach((colGroup, colGroupIndex) => {
-				let item = {}
-				colGroup.forEach((column, columnIndex) => {
-					item[`${keyPrefix}title${columnIndex + 1}`] = column.title
-					item[`${keyPrefix}value${columnIndex + 1}`] = oriData[colGroupIndex][column.field] || ''
-					item[`${keyPrefix}value${columnIndex + 1}field`] = column.field || ''
-					column.field ? (item[`${column.field}RenderName`] = column.renderName || '') : ''
-				})
-				data.push(item)
-			})
-		} else {
-			data = that.columns.map(column => {
-				const item = { [`${keyPrefix}title`]: column.title }
-				oriData.forEach((row, index) => {
-					item[`${keyPrefix}value${index + 1}`] = row[column.field] || ''
-					item[`${keyPrefix}value${index + 1}field`] = column.field || ''
-					column.field ? (item[`${column.field}RenderName`] = column.renderName || '') : ''
-				})
-				return item
-			})
-		}
-		return data
-	},
 	// 转换生成新表头数据
 	getTransfarColumn(oriArr = []) {
-		let that = this
+		const { columnObjDefault, columnObj, tableGlobalConfig, isTrue, getDefaultMessage, turnColumnItemFilters, $vUtils } = this
 		let columnsFlatArr = []
 		let formItemsArr = []
 		let rules = {}
-		let columnsArr = that.$vUtils.mapTree(oriArr, ori => {
-			let tar = Object.assign({}, that.columnObjDefault, that.columnObj, ori)
+		let columnsArr = $vUtils.mapTree(oriArr, ori => {
+			let tar = Object.assign({}, columnObjDefault, columnObj, ori)
 			if (ori.children && ori.children.length > 0) {
 				tar.sortable = false
 				tar.filter = false
@@ -374,17 +298,17 @@ const shMethods = {
 					props: Object.assign({}, ori.renderProps || {})
 				}
 				// 首先提取校验配置
-				if (that.isTrue(tar['renderRequire'])) {
+				if (isTrue(tar['renderRequire'])) {
 					// 若配置了校验参数则走校验参数，没配置则给默认校验条件
 					if (tar['requireProps'] && Array.isArray(tar['requireProps']) && tar['requireProps'].length > 0) {
 						rules[tar['field']] = tar['requireProps']
 					} else {
 						let dataType = 'string'
 						let arrayType = ['$vCheckgroup', '$vUpload', '$vTable']
-						if (arrayType.includes(ori['renderName']) || ((ori['renderName'] === '$vSelect' || ori['renderName'] === '$vTree') && that.isTrue(renderConfig.props.multiple))) {
+						if (arrayType.includes(ori['renderName']) || ((ori['renderName'] === '$vSelect' || ori['renderName'] === '$vTree') && isTrue(renderConfig.props.multiple))) {
 							dataType = 'array'
 						}
-						rules[tar['field']] = [{ required: true, message: that.getDefaultMessage(tar['renderName'], tar['title']), type: dataType }]
+						rules[tar['field']] = [{ required: true, message: getDefaultMessage(tar['renderName'], tar['title']), type: dataType }]
 					}
 				}
 				// 个性化设置
@@ -413,7 +337,7 @@ const shMethods = {
 					tar.editRender = Object.assign({}, renderConfig, tar.editRender || {})
 				}
 				// 初始化表单查询配置
-				if (that.tableGlobalConfig.search) {
+				if (tableGlobalConfig.search) {
 					let editFixedNames = ['$vImg', '$vHref', '$vUpload']
 					let formItem = Object.assign({}, tar)
 					formItem.itemRender = Object.assign({}, renderConfig, tar.editRender || {}, tar.itemRender || {})
@@ -427,7 +351,7 @@ const shMethods = {
 				}
 				// 初始化过滤条件
 				if (tar.filter === true || Number(tar.filter) === 1) {
-					that.turnColumnItemFilters(tar, renderConfig.props)
+					turnColumnItemFilters(tar, renderConfig.props)
 				}
 			}
 			columnsFlatArr.push(tar)
@@ -519,6 +443,26 @@ const shMethods = {
 	refreshRender() {
 		this.renderKey++
 	},
+	// 表格工具按钮点击
+	handleTableTool({ code }) {
+		switch (code) {
+			case 'addRow':
+				this.handleTableAddRow(null, undefined, true)
+				break
+			case 'deleteRow':
+				this.handleTableDeleteRow(null, true)
+				break
+			case 'import':
+				this.handleTableImportBtn()
+				break
+			case 'export':
+				this.handleTableExportBtn()
+				break
+			case 'print':
+				this.handleTablePrintBtn()
+				break
+		}
+	},
 	// 表格导出按钮
 	handleTableExportBtn(options) {
 		if (typeof this.onExportMethod === 'function') {
@@ -547,28 +491,21 @@ const shMethods = {
 		}
 	},
 	// 自定义操作列点击事件
-	handleGoptionClick(btnObj, dataObj) {
-		const that = this
+	async handleGoptionClick(btnObj, dataObj) {
 		if (btnObj.code === 'delete' || btnObj.idConfirm) {
-			that.msgconfirm({
-				content: btnObj.ConfirmContent || `确定${btnObj.content}吗？`
-			}).then(() => {
-				that.$emit('globaloption', btnObj, dataObj)
-			})
-		} else {
-			that.$emit('globaloption', btnObj, dataObj)
+			await this.msgconfirm({ content: btnObj.ConfirmContent || `确定${btnObj.content}吗？` })
 		}
+		this.$emit('globaloption', btnObj, dataObj)
 	},
 	// 新增行按钮
 	async handleTableAddRow(rows, index = -1, isTool = false) {
-		const that = this
-		let tableRowDefaultData = Object.assign({}, that.tableRowDefaultData)
-		let addRows = rows ? that.$vUtils.clone(rows, true) : tableRowDefaultData
-		if (typeof that.onToolbarBtnAddBefore === 'function') {
-			addRows = await that.onToolbarBtnAddBefore(addRows)
+		const { tableRowDefaultData, onToolbarBtnAddBefore, rowConfig, $vUtils, tableRef } = this
+		let addRows = rows ? $vUtils.clone(rows, true) : tableRowDefaultData
+		if (!isTool && typeof onToolbarBtnAddBefore === 'function') {
+			addRows = await onToolbarBtnAddBefore(addRows)
 		}
 		// 删除主键，以防排序冲突
-		let mainKeyField = that.rowConfig?.keyField || '_XID'
+		let mainKeyField = rowConfig?.keyField || '_XID'
 		if (Array.isArray(addRows)) {
 			addRows.forEach(item => {
 				delete item[mainKeyField]
@@ -576,30 +513,31 @@ const shMethods = {
 		} else {
 			delete addRows[mainKeyField]
 		}
-		let { row: newRow } = await that.tableRef().insertAt(addRows, index)
-		await that.tableRef().setActiveRow(newRow)
-		if (!isTool) that.$emit('toolbaroption', 'add', newRow, that.tableRef())
+		let { row: newRow } = await tableRef().insertAt(addRows, index)
+		await tableRef().setActiveRow(newRow)
+		if (!isTool) this.$emit('toolbaroption', 'add', newRow, tableRef())
 	},
 	// 删除行按钮
 	async handleTableDeleteRow(rows, isTool = false) {
-		const that = this
 		let deleteRows = rows
 		if (isTool) {
-			let selectedRows = that.getSelectionData()
-			if (selectedRows.length < 1) return that.msgwarning('请选择要删除的行！')
+			let selectedRows = this.getSelectionData()
+			if (selectedRows.length < 1) {
+				this.msgwarning('请选择要删除的行！')
+				return
+			}
 			deleteRows = selectedRows
-			await that.msgconfirm({ content: `确定删除吗？` })
-		}
-		if (typeof that.onToolbarBtnDeleteBefore === 'function') {
-			let result = await that.onToolbarBtnDeleteBefore(deleteRows)
+			await this.msgconfirm({ content: `确定删除吗？` })
+		} else if (typeof this.onToolbarBtnDeleteBefore === 'function') {
+			let result = await this.onToolbarBtnDeleteBefore(deleteRows)
 			if (!result) return
 		}
-		await that.tableRef().remove(deleteRows)
-		if (that.selectionRows && that.selectionRows.length > 0) {
-			let keyField = that.rowConfig.keyField || that.$vTableSetup.table.rowConfig.keyField
-			that.selectionRows = that.selectionRows.filter(sr => !deleteRows.find(dr => dr[keyField] === sr[keyField]))
+		await this.tableRef().remove(deleteRows)
+		if (this.selectionRows && this.selectionRows.length > 0) {
+			let keyField = this.rowConfig.keyField || this.$vTableSetup.table.rowConfig.keyField
+			this.selectionRows = this.selectionRows.filter(sr => !deleteRows.find(dr => dr[keyField] === sr[keyField]))
 		}
-		if (!isTool) that.$emit('toolbaroption', 'delete', deleteRows, that.tableRef())
+		if (!isTool) this.$emit('toolbaroption', 'delete', deleteRows, this.tableRef())
 	}
 }