imatrix-ui 2.9.15-dw-tmp2 → 2.9.16-boe10

package/packages/dynamic-source-select/src/dynamic-source-select.vue

@@ -1,440 +0,0 @@
-<template>
-  <span class="select-top-span">
-    <el-select
-      v-if="isLoaded"
-      ref="dynamicDataSourceRef"
-      :value="value"
-      v-bind="myProps"
-      filterable
-      :remote="remote"
-      :remote-method="remoteMethod"
-      :value-key="valueAttribute"
-      :loading="loading"
-      :reserve-keyword="true"
-      clearable
-      style="width:100%;height:100%"
-      @input="inputValue"
-      @change="change"
-      @visible-change="visibleChange"
-      @remove-tag="removeTag(remote,$event)"
-      @clear="clear"
-      @blur="blur"
-      @focus="focus"
-    >
-      <el-option
-        v-for="item in optionItems"
-        :key="item.value"
-        :label="item._label_"
-        :value="item[valueAttribute]"
-      />
-    </el-select>
-  </span>
-</template>
-<style>
-.select-top-span {
-  width: 100%;
-}
-</style>
-<script>
-import dynamicSourceSelectService from './dynamic-source-select-service'
-import events from './events'
-import {
-  setEntityFieldValue,
-  getPropNameWhenJoinTable
-} from '../../../src/utils/util'
-export default {
-  name: 'DynamicSourceSelect',
-  components: {},
-  model: {
-    prop: 'value',
-    event: 'input'
-  },
-  props: {
-    // 字段配置
-    column: {
-      type: Object,
-      default: null
-    },
-    value: {
-      type: [String, Boolean, Number, Array],
-      default: null
-    },
-    baseProps: {
-      type: Object,
-      default: null
-    },
-    entity: {
-      type: Object,
-      default: null
-    },
-    // dynamicDataSourceCode、valueSetOptions、isSql（默认是false，在配置系统中使用时需要是true）、additionalParameter（ json字符串）
-    options: {
-      type: Object,
-      default: null
-    },
-    // 列表组件行编辑使用，sql查询时数据表名称，用于自定义系统中列表组件中字段多表查询带有别名时，将点"."改成两个下划线"__"时使用
-    tableName: {
-      type: String,
-      default: null
-    },
-    // 列表组件行编辑使用，是否是关联表，用于确定属性名是否需要拼接tableName
-    isJoinTable: {
-      type: Boolean,
-      default: false
-    },
-    // 子表行编辑时，父表单数据
-    parent: {
-      type: Object,
-      default: null
-    },
-    // 所在的列表编码
-    listCode: {
-      type: String,
-      default: null
-    },
-    // 所在的表单编码
-    formCode: {
-      type: String,
-      default: null
-    }
-  },
-  data() {
-    const myProps = Object.assign({}, this.baseProps)
-    let markValue
-    if (this.entity) {
-      markValue = JSON.stringify(this.entity)
-    }
-    return {
-      /**
-       *  用于回显动态数据源选择的默认值，因为初始进入编辑状态时，没有获取映射关系，
-       *  如果当前字段是保存的label值则无法确定当前选项组的值对应哪一个,导致row中的对应字段变成了空值，所以备份一份
-       * 然后在获取动态数据源选项组后，给上默认值
-       */
-      markValue,
-      optionItems: [],
-      myProps,
-      valueSetOptions: [], // 字段映射集合配置
-      dynamicDataSourceCode: '', // 动态数据源编码
-      loading: false, // 是否在加载
-      valueAttribute: null, // 选项值字段，即控制下拉框组件的value-key属性的
-      remote: false, // 是否是远程搜索
-      additionalParameterStr: this.options.additionalParameter, // 附加参数json字符串
-      isLoaded: false,
-      watchAttr: null, // 监控的entity属性名,多个属性名逗号分隔。即当该属性修改时，需要走后台重新获得当前下拉选的选项集合
-      backendUrl: null // 后台访问路径
-    }
-  },
-  watch: {
-    baseProps: {
-      deep: true,
-      handler(newModels) {
-        this.myProps = Object.assign({}, newModels)
-      }
-    }
-  },
-  created() {
-    if (this.options && this.options.dynamicDataSourceCode) {
-      this.dynamicDataSourceCode = this.options.dynamicDataSourceCode.trim()
-      const param = {
-        _listCode: this.listCode,
-        _formCode: this.formCode,
-        _tableName: this.tableName
-      }
-      if (this.parent) {
-        param.parent = this.parent
-      }
-      this.packageDynamicDataSourceInfo(this.dynamicDataSourceCode, param)
-        .then(dynamicDataSourceDto => {
-          if (dynamicDataSourceDto.backendUrl) {
-            this.backendUrl = dynamicDataSourceDto.backendUrl
-          }
-          if (
-            dynamicDataSourceDto.fuzzyQuery !== undefined &&
-            dynamicDataSourceDto.fuzzyQuery === true
-          ) {
-            // 是否启用远程搜索
-            this.remote = true
-          }
-          if (this.options && this.options.valueSetOptions) {
-            this.valueSetOptions = this.options.valueSetOptions
-          }
-          if (
-            this.options &&
-            this.options.isSql !== undefined &&
-            this.options.isSql !== null
-          ) {
-            this.isSql = this.options.isSql
-          }
-          if (this.watchAttr) {
-            let initWatchValue
-            const watchAttrs = this.watchAttr.split(',')
-            watchAttrs.forEach((attr) => {
-              // 初始化下拉选内容
-              if (this.entity) {
-                initWatchValue = this.entity[attr]
-              }
-              this.$watch('entity.' + attr, function(newValue, oldValue) {
-                this.watchAttrValueChange(newValue)
-                // this.inputValue('')
-                const items = this.optionItems.filter(
-                  item => item[this.valueAttribute] === newValue
-                )
-                if (!items) {
-                  this.inputValue('')
-                }
-              })
-            })
-            this.watchAttrValueChange(initWatchValue)
-          }
-          this.isLoaded = true
-        })
-        .catch(error => {
-          console.log(error)
-          this.isLoaded = true
-        })
-    } else {
-      this.isLoaded = true
-    }
-  },
-  methods: {
-    ...dynamicSourceSelectService,
-    ...events,
-    // 必须有该方法，否则无法给字段赋值
-    inputValue(newValue) {
-      this.$emit('input', newValue)
-      if (newValue === null || newValue === undefined || newValue === '') {
-        this.remoteQueryMethod(newValue)
-      }
-      this.setValues(newValue)
-    },
-    packageDynamicDataSourceInfo(dynamicDataSourceCode, param) {
-      return new Promise((resolve, reject) => {
-        this.findDynamicDataSourceByCode(
-          dynamicDataSourceCode,
-          this.entity,
-          param,
-          this.additionalParameterStr,
-          this.backendUrl
-        )
-          .then(dynamicDataSourceDto => {
-            if (dynamicDataSourceDto) {
-              if (dynamicDataSourceDto.options) {
-                this.optionItems = dynamicDataSourceDto.options
-                if (this.watchAttr) {
-                  // 解决当监控值变化时，数据源重新加载后select输入框中显示的值和下拉中的值不一致问题
-                  if (this.baseProps.multiple !== undefined && this.baseProps.multiple === true) {
-                    this.$nextTick(() => {
-                      this.$refs['dynamicDataSourceRef'].setSelected()
-                    })
-                  }
-                }
-                //
-                if (this.column) { // 只有行编辑时处理
-                  // 设置选项组数据、 选项组值字段、 映射关系
-                  if (this.column.prop !== dynamicDataSourceDto.valueAttribute) {
-                    this.$set(this.column, '_dynamic-source-data-' + this.column.prop,
-                      {
-                        valueSetOptions: this.options.valueSetOptions,
-                        optionItems: this.optionItems,
-                        valueAttribute: dynamicDataSourceDto.valueAttribute
-                      })
-                  }
-                  for (let i = 0; i < this.options.valueSetOptions.length; i++) {
-                    const valueSetOption = this.options.valueSetOptions[i]
-                    if (dynamicDataSourceDto.valueAttribute === valueSetOption.columnName) {
-                      if (this.markValue) {
-                        const muMarkValue = JSON.parse(this.markValue)
-                        if (muMarkValue && muMarkValue[valueSetOption.valueColumn.dbColumnName]) {
-                          let targeValue = muMarkValue[valueSetOption.valueColumn.dbColumnName].split(',')
-                          if (this.column.componentType === 'select') {
-                          // 如果是单选
-                            targeValue = targeValue[0]
-                          }
-                          this.$emit('set-value', {
-                            value: targeValue,
-                            targetColumnName: this.column.prop
-                          })
-                        }
-                      }
-                      break
-                    }
-                  }
-                }
-              } else {
-                this.optionItems = []
-              }
-              if (dynamicDataSourceDto.valueAttribute) {
-                this.valueAttribute = dynamicDataSourceDto.valueAttribute
-              }
-              this.valueAttribute = this.getValueAttribute()
-              this.watchAttr = dynamicDataSourceDto.watchAttr
-              resolve(dynamicDataSourceDto)
-            } else {
-              resolve()
-            }
-          })
-          .catch(error => {
-            reject(error)
-          })
-      })
-    },
-    // 远程搜索方法
-    remoteQuery(searchText, watchAttrValue) {
-      if (
-        (searchText !== null && searchText !== undefined) ||
-        (watchAttrValue !== null && watchAttrValue !== undefined)
-      ) {
-        const param = {
-          _listCode: this.listCode,
-          _formCode: this.formCode,
-          _tableName: this.tableName }
-        if (searchText !== null && searchText !== undefined) {
-          param.searchText = searchText
-        }
-        if (watchAttrValue !== null && watchAttrValue !== undefined) {
-          // 监控的属性值改变了远程搜索方法
-          if (Object.prototype.toString.apply(watchAttrValue) === '[object Array]') {
-            param.watchAttrValue = watchAttrValue.join(',')
-          } else {
-            param.watchAttrValue = watchAttrValue + ''
-          }
-        } else if (this.entity) {
-          // 搜索时下拉选项的集合
-          const watchValue = this.entity[this.watchAttr]
-          if (watchValue !== null && watchValue !== undefined) {
-            if (Object.prototype.toString.apply(watchValue) === '[object Array]') {
-              param.watchAttrValue = watchValue.join(',')
-            } else {
-              param.watchAttrValue = watchValue + ''
-            }
-          }
-        }
-        if (this.parent) {
-          param.parent = this.parent
-        }
-        this.loading = true
-        this.packageDynamicDataSourceInfo(this.dynamicDataSourceCode, param)
-          .then(dynamicDataSourceDto => {
-            this.loading = false
-          })
-          .catch(error => {
-            console.log(error)
-            this.loading = false
-          })
-      }
-    },
-    // 远程搜索方法
-    remoteQueryMethod(searchText) {
-      if (Array.isArray(this.value)) {
-        if (this.value.length === 0) {
-          this.remoteQuery(searchText, null)
-        }
-      } else {
-        this.remoteQuery(searchText, null)
-      }
-    },
-    /**
-     * 输入框输入查询值时搜索方法，
-     * 不使用remoteQueryMethod， 解决输入框第一次输入时可查询，第二次输入时没有触发查询方法问题
-     * @param {*} searchText
-     */
-    remoteMethod(searchText) {
-      this.remoteQuery(searchText, null)
-    },
-    // 监控的属性值改变了远程搜索方法
-    watchAttrValueChange(watchAttrValues) {
-      this.remoteQuery(null, watchAttrValues)
-    },
-    getValueAttribute() {
-      return !this.valueAttribute || this.valueAttribute === '[label]'
-        ? '_label_'
-        : this.valueAttribute
-    },
-    setValues(newValue) {
-      if (this.valueSetOptions && this.valueSetOptions.length > 0) {
-        this.valueSetOptions.forEach(columnInfo => {
-          const sourceColumnName = columnInfo.columnName
-          let value
-          if (this.optionItems && sourceColumnName) {
-            value = this.getTargetColumnValue(newValue, sourceColumnName)
-          }
-          let targetColumnName = null
-          const targetColumnInfo = columnInfo.valueColumn
-          if (targetColumnInfo) {
-            targetColumnName = targetColumnInfo.name
-            if (this.isSql === true) {
-              targetColumnName = targetColumnInfo.dbColumnName
-              targetColumnName = getPropNameWhenJoinTable(
-                targetColumnName,
-                this.isJoinTable,
-                this.tableName
-              )
-            }
-          }
-          if (
-            this.entity &&
-            targetColumnName &&
-            targetColumnName !== null &&
-            targetColumnName !== ''
-          ) {
-            setEntityFieldValue(this.entity, targetColumnName, value)
-          }
-          this.$emit('set-value', {
-            value: value,
-            sourceColumnName: sourceColumnName,
-            targetColumnName: targetColumnName,
-            options: this.optionItems
-          })
-        })
-      }
-    },
-    // 获得目的字段的值
-    getTargetColumnValue(newValue, sourceColumnName) {
-      if (newValue) {
-        let value = ''
-        if (
-          this.baseProps.multiple !== undefined &&
-          this.baseProps.multiple === true &&
-          Array.isArray(newValue)
-        ) {
-          // 多选值处理，数组信息，使用逗号分开的格式设置其它字段的值
-          let i = 0
-          newValue.forEach(itemValue => {
-            const items = this.optionItems.filter(
-              item => item[this.valueAttribute] === itemValue
-            )
-            if (items && items.length > 0) {
-              value += items[0][sourceColumnName]
-              if (i < newValue.length - 1) {
-                // 最后一个元素不加逗号
-                value += ','
-              }
-              i++
-            }
-          })
-        } else {
-          // 单选
-          const items = this.optionItems.filter(
-            item => item[this.valueAttribute] === newValue
-          )
-          if (items && items.length > 0) {
-            value = items[0][sourceColumnName]
-          }
-        }
-        return value
-      }
-    },
-    // 移除所有tag和clear时候清除markValue的值解决清除选项时关联字段清空了但是当前动态数据源控件仍然有值问题
-    clearMarkValue() {
-      if (this.markValue && this.entity) {
-        const muMarkValue = JSON.parse(this.markValue)
-        for (let i = 0; i < this.options.valueSetOptions.length; i++) {
-          const valueSetOption = this.options.valueSetOptions[i]
-          muMarkValue[valueSetOption.valueColumn.dbColumnName] = null
-        }
-        this.markValue = JSON.stringify(muMarkValue)
-      }
-    }
-  }
-}
-</script>

package/packages/dynamic-source-select/src/events.js

@@ -1,55 +0,0 @@
-const events = {
-  /**
-   * 选中值发生变化时触发
-   * @param {*} newValue
-   */
-  change: function(newValue) {
-    this.$emit('change', newValue)
-  },
-  /**
-   * 下拉框出现/隐藏时触发
-   * @param {*} visible 出现则为 true，隐藏则为 false
-   */
-  visibleChange: function(visible) {
-    this.$emit('visible-change', visible)
-  },
-  /**
-   * 多选模式下移除tag时触发
-   * @param {*} remote 是否启用了远程搜索
-   * @param {*} tag 移除的tag值
-   */
-  removeTag: function(remote, tag) {
-    this.$emit('remove-tag', tag)
-    if (Array.isArray(this.value)) {
-      if (this.value.length === 1 && remote) {
-        this.clearMarkValue()
-        this.remoteQuery('', null)
-      }
-    }
-  },
-  /**
-   * 可清空的单选模式下用户点击清空按钮时触发
-   */
-  clear: function() {
-    this.clearMarkValue()
-    this.$emit('clear')
-  },
-  /**
-   * 当 input 失去焦点时触发
-   * @param {*} event
-   */
-  blur: function(event) {
-    this.$emit('blur', event)
-  },
-  /**
-   * 当 input 获得焦点时触发
-   * @param {*} event
-   */
-  focus: function(event) {
-    this.$emit('focus', event)
-  },
-  input(newValue) {
-    this.$emit('input', newValue)
-  }
-}
-export default events

package/packages/fs-preview/index.js

@@ -1,6 +0,0 @@
-import FsPreview from './src/fs-preview.vue'
-FsPreview.install = function(Vue) {
-  Vue.component(FsPreview.name, FsPreview)
-}
-
-export default FsPreview