epx-frame 3.5.0-shpgy.1

package/src/frame/views/match/fieldMatch.vue

@@ -0,0 +1,518 @@
+
+<script>
+import EntitySubList from '@/frame/packages/entity-sub-list'
+import { ADD_META } from '@/store/actions'
+export default {
+  name: 'epx-field-match',
+  extends: EntitySubList,
+  data () {
+    return {
+      matchMode: [],
+      sourceField: [],
+      sourceEntity: '',
+      targetEntity: '',
+      entityMatchIds: ''
+    }
+  },
+  methods: {
+    addTargetField () {
+      this.$createPage({
+        component: 'match-add-target-field',
+        metaId: 'FM_ATTRIBUTE',
+        entityMeta: this.$metaId,
+        // metaId: this.targetEntity,
+        openType: '2',
+        parentId: this.parentId,
+        targetEntity: this.targetEntity,
+        title: '添加目标字段'
+      })
+    },
+    setMarchRule (config, row) {
+      const mode = row.MODE
+      const targetFieldId = row.TARGET_FIELD
+      const sourceFieldId = row.SOURCE_FIELD
+      // const targetC = row['TARGET_FIELD#']
+      if (mode !== 'customize' && !sourceFieldId) {
+        this.$message.error('未选择源对象字段')
+        return
+      }
+      // const sourceC = row['SOURCE_FIELD#']
+      // const sourceC = this.getSourceName(row.SOURCE_FIELD)
+      if (mode === 'conversion') { // 映射转换
+        this.$createPage({
+          component: 'match-conversion',
+          metaId: this.$metaId,
+          openType: '2',
+          title: '映射转换',
+          sourceEntity: this.sourceEntity,
+          targetEntity: this.targetEntity,
+          targetFieldId,
+          entityFieldMatchId: row.ID,
+          // targetC,
+          sourceFieldId
+          // sourceC
+        })
+      } else if (mode === 'customize') { // 自定义规则
+        this.$createPage({
+          component: 'match-customize',
+          metaId: this.$metaId,
+          openType: '2',
+          title: '自定义规则',
+          sourceEntity: this.sourceEntity,
+          entityFieldMatchId: row.ID,
+          targetFieldId,
+          // targetC,
+          sourceFieldId
+          // sourceC
+        })
+      } else if (mode === 'direct') {
+        this.$message.info('直接匹配不需要操作')
+      } else {
+        this.$message.info('暂未设置匹配规则')
+      }
+    },
+    // getSourceName (sourceFieldId) {
+    //   const item = this.sourceField.find(item => {
+    //     return item.attribute.id === sourceFieldId
+    //   })
+    //   return item.attriLabel || item.attriName
+    // },
+    // 获取关联关系
+    async getLinkAttr  () {
+      const defaultMetaId = this.upPage.$metaId
+      const { parentMetaId = defaultMetaId, relationId = '' } = this.$configs
+      let relation = null
+      let linkAttr = ''
+      let relationFlag = relationId
+      // 获取父对象
+      let parentMeta = this.metas[parentMetaId]
+      if (!parentMeta) {
+        parentMeta = await this.$store.dispatch({
+          type: 'ADD_META',
+          metaId: parentMetaId
+        })
+      }
+      this.parentMeta = parentMeta
+      if (relationId.includes('#')) {
+        relationFlag = relationId.split('#')[0]
+        relation = parentMeta.getRelationByFlag(relationFlag)
+        const metaId = relation.entityA
+        linkAttr = parentMeta.getLinkAttr(metaId)
+        const field = Object.values(parentMeta.attributes).find(item => item.id === linkAttr)
+        if (field) this.parentField = field.name
+        relationFlag = relationId.split('#')[1]
+        // 获取关联父对象
+        parentMeta = this.metas[metaId]
+        if (!parentMeta) {
+          parentMeta = await this.$store.dispatch({
+            type: 'ADD_META',
+            metaId: metaId
+          })
+        }
+      }
+      relation = parentMeta.getRelationByFlag(relationFlag)
+      const metaId = relation.entityA
+      linkAttr = parentMeta.getLinkAttr(metaId)
+      // 获取当前对象
+      let meta = this.metas[metaId]
+      if (!meta) {
+        meta = await this.$store.dispatch({
+          type: 'ADD_META',
+          metaId: metaId
+        })
+      }
+      this.$set(this.$configs, 'metaId', metaId)
+      const attribute = Object.values(meta.attributes).find(item => item.id === linkAttr) || {}
+      this.linkAttrData = attribute.name
+      this.getMatchMode()
+    },
+    getMatchMode () {
+      this.$http.getCodes({
+        key: this.$meta.getAttribute('MODE').codeKey || 'FM_FIELD_TRANSFER_MODE',
+        status: 'on'
+      })
+        .then(data => {
+          this.matchMode = data
+        })
+    },
+    getSourceField () {
+      const meta = this.getMeta(this.sourceEntity)
+      if (!meta) {
+        this.$store.dispatch({ // 加回调
+          type: ADD_META,
+          metaId: this.sourceEntity
+        })
+          .then(data => {
+            if (data) {
+              this.$FieldFactory.createFields({
+                meta: data
+              })
+                .then(fields => {
+                  this.sourceField = fields
+                })
+            }
+          })
+      } else {
+        this.$FieldFactory.createFields({
+          meta: meta
+        })
+          .then(fields => {
+            this.sourceField = fields
+          })
+      }
+    },
+    selectionChange (selection, row) {
+      this.selectionIds = [...selection.map(item => item.ID)]
+    },
+    updateFieldRow (field, id, value) {
+      const params = {
+        entityId: this.$metaId,
+        'bean.ID': id
+      }
+      params[`bean.${field}`] = value
+      this.$http.update(params)
+    },
+    renderTargetField (field) {
+      return {
+        scopedSlots: {
+          default: ({ row }) => {
+            return (
+              <span>{row.TARGET_FIELD_NAME || row['TARGET_FIELD#']}</span>
+            )
+          }
+        }
+      }
+    },
+    renderSourceField (field) {
+      return {
+        scopedSlots: {
+          default: ({ row }) => {
+            return (
+              <el-select v-model={row.SOURCE_FIELD} placeholder="请选择" onChange={this.updateFieldRow.bind(this, 'SOURCE_FIELD', row.ID)}>
+                {
+                  this.sourceField.map((source) => {
+                    return (
+                      <el-option label={source.attriLabel} key={source.attriName} value={source.attribute.id}></el-option>
+                    )
+                  })
+                }
+              </el-select>
+            )
+          }
+        }
+      }
+    },
+    renderMode (field) {
+      return {
+        scopedSlots: {
+          default: ({ row }) => {
+            return (
+              <el-select v-model={row.MODE} placeholder="请选择" onChange={this.updateFieldRow.bind(this, 'MODE', row.ID)}>
+                {
+                  this.matchMode.map((mode) => {
+                    return (
+                      <el-option label={mode.name} key={mode.id} value={mode.code}></el-option>
+                    )
+                  })
+                }
+              </el-select>
+            )
+          }
+        }
+      }
+    },
+    renderField (field) {
+      return {
+        scopedSlots: {
+          default: ({ row }) => {
+            return (
+              <font color={field.color}>
+                { row[field.attriName + '#'] || row[field.attriName] }
+              </font>
+            )
+          }
+        }
+      }
+    },
+    /**
+     * 重新加载数据
+     */
+    reloadData () {
+      this.getData(null, data => {
+        // 如果selection里没有 旧删除
+        const existSelection = []
+        const dataMap = {}
+        data.forEach(dataItem => {
+          dataMap[dataItem[this.$metaKey]] = dataItem
+        })
+        this.selection.forEach(item => {
+          if (dataMap[item[this.$metaKey]]) existSelection.push(dataMap[item[this.$metaKey]])
+        })
+        if (!this.$_.isEqual(this.selection, existSelection)) {
+          this.$refs.table.clearSelection()
+          existSelection.forEach(item => {
+            this.$refs.table.toggleRowSelection(item, true)
+          })
+          this.selection = existSelection
+        }
+      })
+    },
+    renderTable () {
+      const { pageFlag, operateColumnFlag, operateColumnWidth, operateColumnPosition, operateColumnLocked, multiSelectColumnFlag, serialColumnFlag, columnOperates = [], sortable } = this.$configs
+      return (
+        <div>
+          <el-table
+            class="list-table"
+            ref="table"
+            rowKey={this.$metaKey}
+            border={true}
+            data={this.data}
+            onSelection-change={this.selectionChange}
+            onRow-dblclick={v => this.viewEntity({}, v)}
+            onSort-change={this.sortChange}
+          >
+            {/* 选择列 */}
+            {
+              multiSelectColumnFlag && (
+                <el-table-column
+                  type="selection"
+                  width="55"
+                  reserve-selection={true}
+                  fixed={true}
+                >
+                </el-table-column>
+              )
+            }
+            {/* 序号列 */}
+            {
+              serialColumnFlag && (
+                <el-table-column
+                  width="55"
+                  label="序号"
+                  type="index"
+                  index={index => (this.currentPage - 1) * this.pageSize + index + 1}
+                  fixed={this.lockedIndex !== -1}
+                >
+                </el-table-column>
+              )
+            }
+            {/* 操作列 */}
+            {
+              operateColumnFlag !== false && columnOperates.length > 0 && operateColumnPosition !== 'end' && (
+                <el-table-column width={operateColumnWidth} fixed={operateColumnLocked || this.lockedIndex !== -1 ? 'left' : false} label="操作" { ...this.renderColumnOperates() }></el-table-column>
+              )
+            }
+            {
+              this.listFields.map((field, index) => {
+                if (field.attriName === 'TARGET_FIELD') {
+                  return (
+                    <el-table-column prop={field.attriName} {...field} min-width={field.width || 120} sortable={sortable} resizable show-overflow-tooltip label={field.attriLabel} fixed={index <= this.lockedIndex} { ...this.renderTargetField(field) }>
+                    </el-table-column>
+                  )
+                } else if (field.attriName === 'SOURCE_FIELD') {
+                  return (
+                    <el-table-column prop={field.attriName} {...field} min-width={field.width || 120} sortable={sortable} resizable show-overflow-tooltip label={field.attriLabel} fixed={index <= this.lockedIndex} { ...this.renderSourceField(field) }>
+                    </el-table-column>
+                  )
+                } else if (field.attriName === 'MODE') {
+                  return (
+                    <el-table-column prop={field.attriName} {...field} min-width={field.width || 120} sortable={sortable} resizable show-overflow-tooltip label={field.attriLabel} fixed={index <= this.lockedIndex} { ...this.renderMode(field) }>
+                    </el-table-column>
+                  )
+                } else if (field.state !== 'HIDDEN') {
+                  return (
+                    <el-table-column prop={field.attriName} {...field} min-width={field.width || 120} sortable={sortable} resizable show-overflow-tooltip label={field.attriLabel} fixed={index <= this.lockedIndex} { ...this.renderField(field) }>
+                    </el-table-column>
+                  )
+                }
+              })
+            }
+            {/* 操作列 */}
+            {
+              operateColumnFlag !== false && columnOperates.length > 0 && operateColumnPosition === 'end' && (
+                <el-table-column width={operateColumnWidth} fixed={operateColumnLocked ? 'right' : false} label="操作" { ...this.renderColumnOperates() }></el-table-column>
+              )
+            }
+          </el-table>
+          {/* 分页 */}
+          {
+            pageFlag && (
+              <div class="pagination">
+                <el-pagination
+                  v-loading={this.loading}
+                  currentPage={this.currentPage}
+                  pageSizes={[10, 15, 20, 30, 50, 100, 200]}
+                  pageSize={this.pageSize}
+                  layout="prev, pager, next, jumper, sizes,total"
+                  total={this.total}
+                  onSize-change={this.sizeChange}
+                  onCurrent-change={this.currentChange}
+                >
+                </el-pagination>
+              </div>
+            )
+          }
+        </div>
+      )
+    }
+  },
+  created () {
+    this.entityMatchIds = this.$query.id
+    const { SOURCE_ENTITY, TARGET_ENTITY } = this.formData
+    this.sourceEntity = SOURCE_ENTITY || this.$query.SOURCE_ENTITY
+    this.targetEntity = TARGET_ENTITY || this.$query.TARGET_ENTITY
+    this.renderComponents.unshift(this.renderSubAdd)
+    // this.getMatchMode()
+    this.getSourceField()
+    // this.getEntityFields()
+  }
+}
+</script>
+
+<style scoped lang="scss">
+$paddingSize: 16px;
+.list-container {
+  background: #fff;
+  padding:10px;
+  &.fold {
+    .list-operates {
+      display: none;
+    }
+    .list-table {
+      display: none;
+    }
+    .form-title-fold__icon {
+      transform: rotate(180deg);
+    }
+  }
+}
+.list-table {
+   // 无边框
+  &.no-border {
+     border: 0;
+    border-top: dashed 1px #e3e3e3;
+    &::after {
+      display: none
+    }
+    ::v-deep {
+      th.is-leaf, td {
+       border-right: 0
+      }
+    }
+  }
+}
+.list-operates {
+  padding: $paddingSize 0;
+  display: flex;
+  justify-content: space-between;
+}
+.more-table-operates {
+  margin-left: 10px
+}
+.column-operates {
+  display: flex;
+  align-items: center;
+  white-space: nowrap;
+  button:not(:last-child) {
+    &::after {
+      content: '';
+      position: relative;
+      right: -6px;
+      top:0 ;
+      height: 14px;
+      border-right:  1px solid #e3e3e3;
+    }
+  }
+}
+
+.el-dropdown-link {
+  cursor: pointer;
+  float: left;
+  width: 30px;
+  height: 30px;
+  border-radius: 4px;
+  text-align: center;
+  line-height: 30px;
+  overflow: hidden;
+   border: 0;
+  outline: none;
+  margin-left: 6px;
+  &.active {
+    @include bg_color_primary( 0.1);
+  }
+}
+
+.column-operate-btn {
+  font-size: 14px;
+}
+.pagination {
+  padding: $paddingSize 0;
+  ::v-deep{
+    .el-select  {
+      margin-left: 24px;
+    }
+    .el-pagination__total {
+      float: right;
+    }
+  }
+}
+.form-title {
+  padding: 6px 24px;
+  position: relative;
+  overflow: hidden;
+  font-size: 16px;
+  line-height: 36px;
+  white-space: pre-wrap;
+  background: #fff;
+  &::after {
+    content: '';
+    position: absolute;
+    left: -24px;
+    bottom: 0;
+    width: calc(100% + 48px);
+    height: 1px;
+    background: #e3e3e3;
+  }
+  .form-title-fold__icon {
+    @include font_color_primary;
+    font-size: 20px;
+    cursor: pointer;
+    transition: all .5s;
+    line-height: 36px;
+    margin-left: 10px;
+  }
+}
+
+.form-tilte__simple {
+  margin-bottom: -20px;
+  padding: 6px 12px 0;
+  &::after {
+    display: none;
+  }
+  .form-title-border {
+    border: 0;
+    padding-left: 0;
+  }
+  .form-title__operate {
+    display: none;
+  }
+  .form-title-fold__icon {
+    display: none;
+  }
+}
+.form-title-border{
+  border-left: 3px solid;
+  @include border_color_primary;
+  padding-left: 6px;
+}
+
+.form-title-edit {
+  font-size: 14px;
+  line-height: 36px;
+  cursor: pointer;
+  @include font_color_primary;
+  i {
+    margin-right: 4px;
+  }
+}
+</style>

package/src/frame/views/report/AddFormItem.vue

@@ -0,0 +1,67 @@
+
+<script>
+import AddFormItem from '@/frame/packages/add-form-item/AddFormItem'
+export default {
+  name: 'epx-report-add-form-item',
+  extends: AddFormItem,
+  watch: {
+    'data.OBJECT' (v) {
+      if (v) {
+        this.changeObject(v)
+      }
+    }
+  },
+  methods: {
+    changeObject (v) {
+      const index = this.fieldsConfigs.findIndex(item => {
+        return item.attriName === 'SCOPE'
+      })
+      if (index > 0) {
+        const obj = this.fieldsConfigs[index]
+        obj.scopeEntity = v
+        this.fieldsConfigs.splice(index, 1, obj)
+      }
+    },
+    getFieldsConfigs (pageType = this.componentType) {
+      const { fieldConfigs: formFieldConfigs = {} } = this.formConfigs
+      const { fields, fieldConfigs = {} } = this.$configs
+      const { fieldConfigs: routeFieldConfigs = {} } = this.$query
+      this.$FieldFactory.createFields({
+        defaultFieldConfigs: { ...formFieldConfigs, ...routeFieldConfigs, ...fieldConfigs },
+        meta: this.$meta,
+        metaId: this.$metaId,
+        pageType,
+        fields: fields
+      })
+        .then(data => {
+          if (this.onAfterFieldsConfigs) this.onAfterFieldsConfigs()
+          data && data.forEach(item => {
+            if ((!this.formData[item.attriName] || this.componentType === 'ADD') && item.value) {
+              // eslint-disable-next-line no-unused-vars
+              const _this = this
+              // 设置字段默认值
+              const value = item.value.replace(/\$\[(.+)\]/, (match, key) => {
+                try {
+                  // eslint-disable-next-line no-eval
+                  return eval(`_this.${key}`) || eval(`_this.$query.${key}`) || eval(`_this.$tab.${key}`) || eval(`_this.$route.query.${key}`) || ''
+                } catch (error) {
+                  return item.value
+                }
+              })
+              this.$set(this.formData, item.attriName, value)
+            }
+            if (item.attriName === 'SCOPE' && this.formData.OBJECT) {
+              item.scopeEntity = this.formData.OBJECT
+            }
+          })
+          this.fieldsConfigs = [...data]
+        })
+    }
+  }
+
+}
+</script>
+
+<style>
+
+</style>