agilebuilder-ui 1.0.0

package/packages/super-grid/src/custom-formatter.js

@@ -0,0 +1,430 @@
+import {$emit} from '../../utils/gogocodeTransfer'
+import {doFormat} from './formatter'
+import store from './store'
+import {initialization, jumpToPage} from '../../../src/utils/jump-page-utils'
+import {analysisFileSetObj, otherFilesToStandard} from './utils'
+import {isPromise} from '../../../src/utils/common-util'
+
+const customFormatter = {
+    /**
+     * 自定义格式化值
+     * @param {prop} 属性名
+     * @param {formatValue} 格式化后的值
+     * @param {format} 格式化方法
+     * @param {componentName} 组件名
+     */
+    customFormatValue(row, prop, format, rowIndex) {
+        // const start = new Date().getTime()
+        // console.log('---super-grid--customFormatValue--')
+        if (this.customFormat) {
+            let originalValue = row[prop]
+            if (this.isObjectProp(prop)) {
+                originalValue = this.objectPropOriginalValue(row, prop)
+            }
+            const formatValue = doFormat(this.column, originalValue)
+            const component = format.call(
+                this,
+                originalValue,
+                formatValue,
+                row,
+                this.column,
+                rowIndex
+            )
+            if (typeof component === 'undefined') {
+                return false
+            } else {
+                // const aa = defineCustomElement(component)
+                // window.customElements.define(prop + rowIndex , aa)
+                window.$vueApp.component(prop + rowIndex, component)
+            }
+            
+            // const end = new Date().getTime()
+            // console.log('---super-grid--customFormatValue--time1=', (end - start))
+            return true
+        } else {
+            // const end = new Date().getTime()
+            // console.log('---super-grid--customFormatValue--time2=', (end - start))
+            return false
+        }
+    },
+    
+    isObjectProp(prop) {
+        // const start = new Date().getTime()
+        // console.log('---super-grid--isObjectProp--')
+        if (prop && prop.indexOf('.') > 0) {
+            // const end = new Date().getTime()
+            // console.log('---super-grid--isObjectProp--time1=', (end - start))
+            return true
+        } else {
+            // const end = new Date().getTime()
+            // console.log('---super-grid--isObjectProp--time2=', (end - start))
+            return false
+        }
+    },
+    
+    objectPropOriginalValue(row, prop) {
+        try {
+            // console.log('---super-grid--objectPropOriginalValue--')
+            let objValue = row
+            if (prop && prop.indexOf('.') > 0) {
+                const props = prop.split('.')
+                props.forEach((subProp) => {
+                    if (objValue) {
+                        objValue = objValue[subProp]
+                    } else {
+                        objValue = ''
+                        throw objValue
+                    }
+                })
+                return objValue
+            } else {
+                return row[prop]
+            }
+        } catch (e) {
+            // console.log(e)
+            return ''
+        }
+    },
+    
+    objectPropValue(row, prop) {
+        return this.formatter(row, prop, this.column)
+    },
+    // 获取显示的值
+    // 附件类型，显示值与实际值不相同。如果时子表多选，需要单独判断
+    objectPropValueTwo(row, column) {
+        if (
+            (column.componentType === 'annex' ||
+                column.componentType === 'multipartUpload') && column.fileSet
+        ) {
+            // 判断是否是对象集合（子表存储）
+            const fileSetObj = JSON.parse(column.fileSet)
+            if (fileSetObj.childAnnexDataTableCode) {
+                // 获取存好的json并解析
+                const keyValueParam = analysisFileSetObj(fileSetObj, this.isSql)
+                // 子表存储。返回最后一个对象的展示名称
+                const fileArr = this.objectPropValue(row, column.prop)
+                if (fileArr && fileArr.length > 0) {
+                    const fileList = otherFilesToStandard(
+                        fileSetObj,
+                        keyValueParam,
+                        fileArr,
+                        null
+                    )
+                    return fileList[fileList.length - 1].showName
+                }
+            } else {
+                return this.objectPropValue(row, column.prop)
+            }
+        } else if (column.formatter && column.formatter.type === 'files') {
+            // 判断是否是对象集合（子表存储）
+            const fileSetObj = JSON.parse(column.formatter.options.fileSet)
+            if (fileSetObj.childAnnexDataTableCode) {
+                // 获取存好的json并解析
+                const keyValueParam = analysisFileSetObj(fileSetObj, this.isSql)
+                // 子表存储。返回最后一个对象的展示名称
+                const fileArr = this.objectPropValue(row, column.prop)
+                if (fileArr && fileArr.length > 0) {
+                    const fileList = otherFilesToStandard(
+                        fileSetObj,
+                        keyValueParam,
+                        fileArr,
+                        null
+                    )
+                    return fileList[fileList.length - 1].showName
+                }
+            } else {
+                return this.objectPropValue(row, column.prop)
+            }
+        } else {
+            return this.objectPropValue(row, column.prop)
+        }
+    },
+    formatter(row, prop, column) {
+        const cellValue = this.objectPropOriginalValue(row, prop)
+        if (
+            this.columnFormatter !== undefined &&
+            this.columnFormatter.type === 'custom'
+        ) {
+            // 自定义事件
+            let funName
+            if (this.columnFormatter.options && this.columnFormatter.options.format) {
+                funName = this.columnFormatter.options.format
+            }
+            if (funName && funName !== null && funName !== '') {
+                const gridParams = store.get(this.listCode)
+                if (
+                    gridParams.options &&
+                    gridParams.options['eventCallBack'] &&
+                    gridParams.options['eventCallBack'][funName] &&
+                    typeof gridParams.options['eventCallBack'][funName] === 'function'
+                ) {
+                    const param = {
+                        value: cellValue,
+                        row: row,
+                        column: this.column,
+                        prop: prop,
+                        additionalParamMap: gridParams.additionalParamMap,
+                    }
+                    return gridParams.options['eventCallBack'][funName].call(this, param)
+                } else {
+                    return doFormat(column, cellValue)
+                }
+            } else {
+                return doFormat(column, cellValue)
+            }
+        } else {
+            return doFormat(column, cellValue)
+        }
+    },
+    getColumnValue(row, column) {
+        const prop = column.prop
+        let originalValue = row[prop]
+        if (this.isObjectProp(prop)) {
+            originalValue = this.objectPropOriginalValue(row, prop)
+        }
+        const formatValue = doFormat(column, originalValue)
+        return {
+            originalValue,
+            formatValue,
+        }
+    },
+    onClickFun(row, column, onClick, rowIndex, button) {
+        const values = this.getColumnValue(row, column)
+        onClick.call(
+            this,
+            values.originalValue,
+            values.formatValue,
+            row,
+            column,
+            rowIndex,
+            button
+        )
+    },
+    isShowButtonFun(row, column, isShowFun, rowIndex) {
+        if (isShowFun === undefined) {
+            return true
+        }
+        if (typeof isShowFun === 'function') {
+            const values = this.getColumnValue(row, column)
+            let isShow = isShowFun.call(
+                this,
+                values.originalValue,
+                values.formatValue,
+                row,
+                column,
+                rowIndex
+            )
+            if (isShow === undefined) {
+                isShow = true
+            }
+            return isShow
+        } else {
+            return isShowFun
+        }
+    },
+    // 超链接解析
+    getHyperLinkSetting(
+        column,
+        row,
+        isSql,
+        additionalParamerter,
+        contextParameter,
+        tableName,
+        listCode
+    ) {
+        const gridParams = store.get(listCode)
+        let parentFormData = null
+        if (
+            gridParams.options.extraParam &&
+            gridParams.options.extraParam.entityMap
+        ) {
+            parentFormData = gridParams.options.extraParam.entityMap
+        }
+        let hyperLinkResult = {}
+        let jumpPageJson
+        if (
+            column &&
+            column.formatter &&
+            column.formatter.options &&
+            column.formatter.options.format
+        ) {
+            jumpPageJson = column.formatter.options.format
+        }
+        if (jumpPageJson && jumpPageJson !== '') {
+            // 解析是否需要显示该超链接
+            const result = initialization(
+                JSON.parse(jumpPageJson),
+                row,
+                isSql,
+                additionalParamerter,
+                contextParameter,
+                tableName,
+                parentFormData
+            )
+            // console.log('getHyperLinkSetting--resut=', result)
+            if (result && result.label && result.label !== '') {
+                console.log('label存在')
+            } else {
+                result.label = this.objectPropValueTwo(row, column)
+            }
+            if (result && result.title && result.title !== '') {
+                console.log('title存在')
+            } else {
+                result.title = result.label
+            }
+            hyperLinkResult = result
+        } else {
+            // 表示显示超链接
+            hyperLinkResult.visible = true
+            hyperLinkResult.label = this.objectPropValueTwo(row, column)
+            hyperLinkResult.title = hyperLinkResult.label
+        }
+        return hyperLinkResult
+    },
+    // 点击超链接
+    clickHyperLink(column, row, listCode, rowIndex) {
+        let jumpPageJson
+        if (
+            column &&
+            column.formatter &&
+            column.formatter.options &&
+            column.formatter.options.format
+        ) {
+            jumpPageJson = column.formatter.options.format
+        }
+        if (jumpPageJson && jumpPageJson !== '') {
+            // 解析是否需要显示该超链接
+            let canClick = true
+            const gridParams = store.get(listCode)
+            const jumpPageSetting = JSON.parse(jumpPageJson)
+            console.log(
+                'gupre-grid---clickHyperLink--jumpPageSetting=',
+                jumpPageSetting
+            )
+            if (jumpPageSetting.beforeClick) {
+                const funName = jumpPageSetting.beforeClick
+                console.log(
+                    'gupre-grid---clickHyperLink--jumpPageSetting.beforeClick=',
+                    funName
+                )
+                console.log(
+                    'gupre-grid---clickHyperLink--gridParams.options[eventCallBack]=',
+                    gridParams.options['eventCallBack']
+                )
+                if (
+                    gridParams.options &&
+                    gridParams.options['eventCallBack'] &&
+                    gridParams.options['eventCallBack'][funName] &&
+                    typeof gridParams.options['eventCallBack'][funName] === 'function'
+                ) {
+                    const param = {
+                        row: row,
+                        column: column,
+                        rowIndex: rowIndex,
+                        listCode,
+                        additionalParamMap: gridParams.additionalParamMap,
+                    }
+                    canClick = gridParams.options['eventCallBack'][funName].call(
+                        this,
+                        param
+                    )
+                }
+            }
+            if (isPromise(canClick)) {
+                canClick.then((result) => {
+                    this.doClickHyperLink(
+                        row,
+                        listCode,
+                        rowIndex,
+                        jumpPageSetting,
+                        gridParams
+                    )
+                })
+            } else {
+                this.doClickHyperLink(
+                    row,
+                    listCode,
+                    rowIndex,
+                    jumpPageSetting,
+                    gridParams
+                )
+            }
+        }
+    },
+    doClickHyperLink(row, listCode, rowIndex, jumpPageSetting, gridParams) {
+        let parentFormData = null
+        if (
+            gridParams.options.extraParam &&
+            gridParams.options.extraParam.entityMap
+        ) {
+            parentFormData = gridParams.options.extraParam.entityMap
+        }
+        console.log(
+            'ridParams.options.extraParam.entityMap',
+            gridParams.options.extraParam
+        )
+        jumpToPage(
+            jumpPageSetting,
+            gridParams.system,
+            row.id ? row.id : row.ID,
+            row,
+            gridParams.additionalParamMap,
+            null,
+            null,
+            parentFormData
+        ).then((openPageParams) => {
+            console.log('clickHyperLink--openPageParams===', openPageParams)
+            if (openPageParams) {
+                // 点击列表组件中某元素弹出的页面
+                openPageParams._position = 'list'
+                openPageParams._listCode = listCode
+                openPageParams._rowIndex = rowIndex
+                // 行编辑的记录
+                openPageParams.row = row
+                // 通知父页面弹出页面
+                $emit(this, 'open-page', openPageParams)
+            }
+        })
+	},
+  // 图标解析
+  getIconSetting(column, row, isSql, gridParams, listCode) {
+    let tableName
+    const additionalParamerter = gridParams.additionalParamMap
+    const contextParameter = gridParams.contextParameter
+    if (gridParams && gridParams.basicInfo && gridParams.basicInfo.tableName) {
+      tableName = gridParams.basicInfo.tableName
+    }
+    let parentFormData = null
+    if (gridParams.options.extraParam && gridParams.options.extraParam.entityMap) {
+      parentFormData = gridParams.options.extraParam.entityMap
+    }
+    let formatResult = {}
+    let formatJson
+    if (column && column.formatter && column.formatter.options && column.formatter.options.format) {
+      formatJson = column.formatter.options.format
+    }
+    if (formatJson && formatJson !== '') {
+      // 解析是否需要显示该超链接
+      const result = initialization(JSON.parse(formatJson), row, isSql, additionalParamerter, contextParameter, tableName, parentFormData)
+      // console.log('getHyperLinkSetting--resut=', result)
+      if (result && result.label && result.label !== '') {
+        console.log('label存在')
+      } else {
+        result.label = this.objectPropValueTwo(row, column)
+      }
+      if (result && result.title && result.title !== '') {
+        console.log('title存在')
+      } else {
+        result.title = result.label
+      }
+      formatResult = result
+    } else {
+      // 表示显示超链接
+      formatResult.visible = true
+      formatResult.label = this.objectPropValueTwo(row, column)
+      formatResult.title = formatResult.label
+    }
+    return formatResult
+  }
+}
+export default customFormatter