imatrix-ui 2.8.21 → 2.8.22-boe10

package/packages/super-grid/src/columns-config.vue

@@ -1,335 +0,0 @@
-<template>
-  <el-dialog
-    :title="$t('superGrid.columnConfig')"
-    width="50%"
-    top="5vh"
-    append-to-body
-    :close-on-click-modal="false"
-    :visible="true"
-    :show-close="true"
-    @open="$emit('open')"
-    @opend="$emit('opend')"
-    @close="$emit('close')"
-    @closed="$emit('closed')"
-  >
-    <div
-      class="operation-area"
-    >
-      <el-button type="primary" size="small" @click="saveConfig">
-        {{ $t('imatrixUIPublicModel.sure') }}
-      </el-button>
-      <el-button size="small" @click="resetConfig">
-        {{ $t('imatrixUIPublicModel.reset') }}
-      </el-button>
-      <el-button size="small" @click="$emit('close')">
-        {{ $t('imatrixUIPublicModel.cancel') }}
-      </el-button>
-      <span v-if="isDragColumn" style="padding-left:10px;color:red">({{ $t('superGrid.dragColumnOrderMessage') }})</span>
-    </div>
-    <el-table v-if="hasLoaded" :data="columns" max-height="450" class="custom-config-elTable">
-      <el-table-column property="label" :label="$t('superGrid.label')" width="220">
-        <template slot-scope="scope">
-          <span class="ellipsis cell--span" :title="scope.row.label">{{ scope.row.label }}</span>
-        </template>
-      </el-table-column>
-      <el-table-column property="showType" :label="$t('superGrid.isShow')" width="120">
-        <template slot-scope="scope">
-          <el-select v-model="scope.row.showType" :disabled="isDisabledShow(scope.row)" @change="changeShow(scope.row, $event)">
-            <el-option
-              :label="isDisabledShow(scope.row)?$t('superGrid.default'):$t('superGrid.show')"
-              value="default"
-            />
-            <el-option
-              :label="$t('superGrid.hidden')"
-              value="false"
-            />
-          </el-select>
-        </template>
-      </el-table-column>
-      <el-table-column property="exportType" :label="$t('superGrid.isExportable')" width="120">
-        <template slot-scope="scope">
-          <el-select v-model="scope.row.exportType" :disabled="isDisabledExport(scope.row)" @change="changeExport(scope.row, $event)">
-            <el-option
-              :label="isDisabledExport(scope.row)?$t('superGrid.default'):$t('superGrid.export')"
-              value="default"
-            />
-            <el-option
-              :label="$t('superGrid.unExport')"
-              value="false"
-            />
-          </el-select>
-        </template>
-      </el-table-column>
-      <el-table-column v-if="isDragColumn" property="displayOrderType" :label="$t('superGrid.displayOrder')" width="120">
-        <template slot-scope="scope">
-          <el-input v-if="scope.row.displayOrderType && scope.row.displayOrderType === 'custom'" v-model="scope.row.displayOrder" clearable size="mini" @clear="clearDisplayOrder(scope.row)" />
-          <el-select v-else v-model="scope.row.displayOrderType">
-            <el-option
-              :label="$t('superGrid.default')"
-              value="default"
-            />
-            <el-option
-              :label="$t('superGrid.custom')"
-              value="custom"
-            />
-          </el-select>
-        </template>
-      </el-table-column>
-      <el-table-column property="widthType" :label="$t('superGrid.width')" width="120">
-        <template slot-scope="scope">
-          <el-input v-if="scope.row.widthType && scope.row.widthType === 'custom'" v-model="scope.row.width" size="mini" clearable @clear="clearWidth(scope.row)" />
-          <el-select v-else v-model="scope.row.widthType">
-            <el-option
-              :label="$t('superGrid.default')"
-              value="default"
-            />
-            <el-option
-              :label="$t('superGrid.custom')"
-              value="custom"
-            />
-          </el-select>
-        </template>
-      </el-table-column>
-    </el-table>
-  </el-dialog>
-</template>
-<script>
-import Vue from 'vue'
-import store from './store'
-import Sortable from 'sortablejs'
-export default {
-  name: 'ColumnsConfig',
-  props: {
-    listCode: {
-      type: String,
-      default: ''
-    }
-  },
-  data() {
-    return {
-      columns: [],
-      hasLoaded: false
-    }
-  },
-  created() {
-
-  },
-  mounted() {
-    this.listAllColumns().then((columns) => {
-      this.columns = columns
-      this.hasLoaded = true
-      this.$nextTick(() => {
-        this.dragColumnDisplayOrder()
-      })
-    })
-  },
-  methods: {
-    isDisabledShow(row) {
-      // 序号、复选框列不可以配置是否显示；占位符列不可以设置是否显示；当不是自定义的显示状态为false时，不可配置是否显示
-      return (row.prop && (row.prop === '$index' || row.prop === '$selection')) ||
-      row.custom === true || (row.showType && row.showType !== 'false' && row.show === false)
-    },
-    isDisabledExport(row) {
-      // 序号、复选框列不可以配置是否导出；占位符列不可以设置是否导出；当不是自定义的导出状态为false时，不可配置是否导出
-      return (row.prop && (row.prop === '$index' || row.prop === '$selection')) ||
-      row.custom === true || (row.exportType && row.exportType !== 'false' && row.exportable === false)
-    },
-    changeShow(row, value) {
-      if (value !== undefined && value === 'false') {
-        row.show = false
-      } else {
-        row.show = true
-      }
-    },
-    changeExport(row, value) {
-      if (value !== undefined && value === 'false') {
-        row.exportable = false
-      } else {
-        row.exportable = true
-      }
-    },
-    saveConfig() {
-      const params = {
-        'settingColumns': this.columns,
-        'listCode': this.listCode
-      }
-      this.$http.post(Vue.prototype.baseAPI + '/component/super-grids/setting-columns', params).then(data => {
-        this.$message({
-          type: 'success',
-          message: this.$t('imatrixUIMessage.saveSuccessfully'),
-          showClose: true
-        })
-        this.$emit('close', true)
-      })
-    },
-    resetConfig() {
-      this.$confirm(this.$t('superGrid.whetherToConfirmReset'), this.$t('imatrixUIMessage.tips'), {
-        confirmButtonText: this.$t('imatrixUIPublicModel.sure'),
-        cancelButtonText: this.$t('imatrixUIPublicModel.cancel'),
-        type: 'warning'
-      }).then(() => {
-        const url = Vue.prototype.baseAPI + '/component/super-grids/reset-columns/' + this.listCode
-        this.$http.delete(url).then(() => {
-          this.$message({
-            type: 'success',
-            message: this.$t('superGrid.resetSuccessful'),
-            showClose: true
-          })
-          this.listAllColumns().then((columns) => {
-            this.columns = columns
-            this.$emit('reset', true)
-          })
-        })
-      })
-    },
-    listAllColumns() {
-      return new Promise((resolve, reject) => {
-        const url = Vue.prototype.baseAPI + '/component/super-grids/all-list-columns/' + this.listCode
-        const gridParams = store.get(this.listCode)
-        const params = {}
-        const isSql = gridParams.isSql
-        this.isDragColumn = gridParams.colSetting.isDragColumn
-        if (typeof (isSql) !== 'undefined') {
-          params.isSql = isSql + ''
-        }
-        this.$http.post(url, params).then(columns => {
-          resolve(columns)
-        }).catch(error => {
-          reject(error)
-        })
-      })
-    },
-    clearDisplayOrder(row) {
-      row.displayOrderType = 'default'
-    },
-    clearWidth(row) {
-      row.widthType = 'default'
-    },
-    // 移动完成后的displayOrder设置
-    indexAfterTheChangeUpdateDisplayOrder(dataList, oldIndex, newIndex, prop) {
-      if (dataList && dataList.length > 0) {
-        if (oldIndex != null && oldIndex !== undefined && oldIndex !== -1) {
-          if (newIndex !== null && newIndex !== undefined && newIndex !== -1) {
-            if (prop && prop !== '') {
-              const selectCol = dataList[newIndex]
-              selectCol.displayOrderType = 'custom'
-              if (newIndex > oldIndex) {
-              // 表示向后移动
-              // 位置已经移动，所以参数要赋值给原始位置的下一个
-                const afProp = dataList[newIndex - 1][prop]
-                const arr = dataList.slice(oldIndex, newIndex)
-                if (arr && arr.length > 0) {
-                  for (let i = arr.length - 1; i > -1; i--) {
-                    const col = arr[i]
-                    col.displayOrderType = 'custom'
-                    if (i === 0) {
-                    // 紧靠原始位置的上一个
-                      col[prop] = selectCol[prop]
-                    } else {
-                      col[prop] = arr[i - 1][prop]
-                    }
-                  }
-                }
-                selectCol[prop] = afProp
-              } else {
-                const befProp = dataList[newIndex + 1][prop]
-                // 表示向前移动
-                // 位置已经移动，所以参数要赋值给原始位置的上一个
-                const arr = dataList.slice(newIndex + 1, oldIndex + 1)
-                if (arr && arr.length > 0) {
-                  for (let i = 0; i < arr.length; i++) {
-                    const col = arr[i]
-                    col.displayOrderType = 'custom'
-                    if (i === arr.length - 1) {
-                    // 紧靠原始位置的上一个
-                      col[prop] = selectCol[prop]
-                    } else {
-                      col[prop] = arr[i + 1][prop]
-                    }
-                  }
-                }
-                selectCol[prop] = befProp
-              }
-            }
-          }
-        }
-      }
-    },
-    // 拖动列顺序
-    dragColumnDisplayOrder() {
-      if (!this.isDragColumn) {
-        return
-      }
-      return new Promise((resolve, reject) => {
-        const tbody = document.querySelector('.custom-config-elTable .el-table__body-wrapper tbody')
-        if (tbody != null) {
-          const vm = this
-          Sortable.create(tbody, {
-            onEnd({ newIndex, oldIndex }) {
-              if (oldIndex !== null && oldIndex !== undefined && oldIndex !== -1 && newIndex !== null && newIndex !== undefined && newIndex !== -1) {
-                if (oldIndex > newIndex) {
-                // 从后往前
-                  if (vm.columns && vm.columns.length > 0) {
-                    const item = vm.columns[oldIndex]
-                    for (var i = oldIndex - 1; i >= newIndex; i--) {
-                      const col = vm.columns[i]
-                      col.displayOrderType = 'custom'
-                      vm.columns[i + 1] = col
-                    }
-                    vm.columns[newIndex] = item
-                  }
-                } else {
-                // 从前往后
-                  if (vm.columns && vm.columns.length > 0) {
-                    const item = vm.columns[oldIndex]
-                    for (var k = oldIndex + 1; k <= newIndex; k++) {
-                      const col = vm.columns[k]
-                      col.displayOrderType = 'custom'
-                      vm.columns[k - 1] = col
-                    }
-                    vm.columns[newIndex] = item
-                  }
-                }
-              }
-              console.log('config拖动字段', vm.columns)
-              console.log('config拖动字段oldIndex', oldIndex)
-              console.log('config拖动字段newIndex', newIndex)
-              vm.hasLoaded = false
-              setTimeout(function() {
-                vm.hasLoaded = true
-                vm.$nextTick(() => {
-                  vm.indexAfterTheChangeUpdateDisplayOrder(vm.columns, oldIndex, newIndex, 'displayOrder')
-                  vm.dragColumnDisplayOrder()
-                })
-              }, 100)
-
-              // vm.hasLoaded = false
-              // // 添加setTimeout是解决拖动顺序后数组columns值改变了，但是列表没有重新渲染问题
-              // setTimeout(function() {
-              //   vm.hasLoaded = true
-              //   vm.$nextTick(() => {
-              //     vm.dragColumnDisplayOrder()
-              //   })
-              //   const currentColumn = vm.columns[oldIndex]
-              //   const targetColumn = vm.columns[newIndex]
-              //   const currentDisplayOrder = currentColumn.displayOrder
-              //   const targetDisplayOrder = targetColumn.displayOrder
-              //   vm.columns.splice(oldIndex, 1)
-              //   vm.columns.splice(newIndex, 0, currentColumn)
-              //   vm.$set(currentColumn, 'displayOrder', targetDisplayOrder)
-              //   vm.$set(currentColumn, 'displayOrderType', 'custom')
-              //   vm.$set(targetColumn, 'displayOrder', currentDisplayOrder)
-              //   vm.$set(targetColumn, 'displayOrderType', 'custom')
-              //   vm.hasLoaded = true
-              //   vm.$nextTick(() => {
-              //     vm.dragColumnDisplayOrder()
-              //   })
-              // }, 100)
-            }
-          })
-        }
-      })
-    }
-  }
-}
-</script>

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

@@ -1,250 +0,0 @@
-import Vue from 'vue'
-import {
-  doFormat
-} from './formatter'
-import store from './store'
-import {
-  initialization,
-  jumpToPage
-} from '../../../src/utils/jump-page-utils'
-import {
-  analysisFileSetObj, otherFilesToStandard
-} from './utils'
-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 {
-        Vue.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') {
-      // 判断是否是对象集合（子表存储）
-      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
-          }
-          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) {
-    const values = this.getColumnValue(row, column)
-    onClick.call(this, values.originalValue, values.formatValue, row, column, rowIndex)
-  },
-  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 !== '') {
-      // 解析是否需要显示该超链接
-      const gridParams = store.get(listCode)
-      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(JSON.parse(jumpPageJson), 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
-          // 通知父页面弹出页面
-          this.$emit('open-page', openPageParams)
-        }
-      })
-    }
-  }
-}
-export default customFormatter