epx-frame 3.5.0-shpgy.1

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

@@ -0,0 +1,221 @@
+<template>
+  <div class="container">
+      <div class="design-operates" v-if="designOperates.length>0">
+        <div class="button-group">
+            <template v-for="operate in designOperates">
+              <el-dropdown v-if="checkShow(operate)&&operate.children&&operate.children.length>0" :key="operate.text"  trigger="click">
+                <el-button type="primary" size="medium">
+                  {{operate.text}}<i class="el-icon-arrow-down el-icon--right"></i>
+                </el-button>
+                <el-dropdown-menu slot="dropdown">
+                  <template v-for="itemChildren in operate.children">
+                    <el-dropdown-item :key="itemChildren.text" @click.native="handler(itemChildren)">{{itemChildren.text}}</el-dropdown-item>
+                  </template>
+                </el-dropdown-menu>
+              </el-dropdown>
+              <template v-else>
+                <el-button  v-if="checkShow(operate)" size="medium" :key="operate.text" :type="operate.ui" @click="handler(operate)">{{operate.text}}</el-button>
+              </template>
+            </template>
+        </div>
+      </div>
+      <div class="design-content" ref="imageDom">
+        <epx-page style="width:100%" v-if="component" :metaId="$metaId" :inline="true" :component="component" :init-config='initConfig'></epx-page>
+      </div>
+  </div>
+</template>
+
+<script>
+import html2canvas from 'html2canvas'
+import { ADD_META } from '@/store/actions'
+export default {
+  name: 'epx-report-look',
+  designOperates: [
+    {
+      text: '设计',
+      ui: 'primary',
+      pageFlag: 'v_report_design',
+      handler: 'designReport',
+      check: false
+    },
+    {
+      text: '导出',
+      ui: 'primary',
+      // handler: 'reportExport',
+      check: true,
+      children: [{
+        text: '导出Excel',
+        handler: 'reportExport'
+      }, {
+        text: '导出图片',
+        handler: 'reportExportPic'
+      }]
+    },
+    {
+      text: '返回',
+      handler: 'backPage'
+    }
+  ],
+  data () {
+    return {
+      component: '',
+      initConfig: {}
+    }
+  },
+  computed: {
+    designOperates () {
+      const { designOperates = [] } = this.pageConfig
+      return designOperates
+    },
+    checkShow () {
+      return operate => {
+        if (operate.check) {
+          if (this.$query.reportType === '1') {
+            return true
+          } else {
+            return false
+          }
+        } else {
+          return true
+        }
+      }
+    }
+  },
+  methods: {
+    handler (buttonConfigs) {
+      const { handler } = buttonConfigs
+      this[handler](buttonConfigs)
+    },
+    designReport (operate) {
+      const { pageFlag: designPageFlag } = operate
+      const query = { ...this.$query }
+      query.flag = designPageFlag
+      this.$createPage({
+        ...query
+      })
+    },
+    async reportExport () {
+      let meta = null
+      const { staObject = '' } = this.initConfig
+      if (staObject) {
+        meta = this.metas[staObject]
+        if (!meta) {
+          meta = await this.$store.dispatch({
+            type: ADD_META,
+            metaId: staObject
+          })
+        }
+      } else {
+        meta = this.$meta
+      }
+
+      const url = this.$util.getRequestUrl({
+        action: 'getReportData',
+        entityId: staObject,
+        reportId: this.$query.reportId,
+        reportType: 'toExcel'
+      })
+      window.open(encodeURI(url))
+    },
+    reportExportPic () {
+      html2canvas(this.$refs.imageDom, {
+        backgroundColor: '#ffffff'
+      }).then(canvas => {
+        var imgData = canvas.toDataURL('image/jpeg')
+        this.fileDownload(imgData)
+      })
+    },
+    fileDownload (downloadUrl) {
+      const aLink = document.createElement('a')
+      aLink.style.display = 'none'
+      aLink.href = downloadUrl
+      aLink.download = 'table.png'
+      // 触发点击-然后移除
+      document.body.appendChild(aLink)
+      aLink.click()
+      document.body.removeChild(aLink)
+    }
+  },
+  created () {
+    if (this.$query.reportType === '1') {
+      this.component = 'design-report-table'
+      this.initConfig = { ...this.$query }
+    } else if (this.$query.reportType === '2') {
+      if (this.$query.chartType === 'pie' || this.$query.chartType === 'circularPie') {
+        this.initConfig = { ...this.$query }
+        this.component = 'design-chart-pie'
+      }
+      if (this.$query.chartType === 'column' || this.$query.chartType === 'horiColumn') {
+        this.initConfig = { ...this.$query }
+        this.component = 'design-chart-column'
+      }
+      if (this.$query.chartType === 'line') {
+        this.initConfig = { ...this.$query }
+        this.component = 'design-chart-line'
+      }
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.container{
+    background-color: #fff;
+}
+.design-operates{
+    width: 100%;
+    box-sizing: border-box;
+    height: 44px;
+    border-bottom: 1px solid #e3e3e3;
+}
+.button-group{
+    margin: 6px 8px;
+    .el-dropdown{
+      margin-right: 10px;
+      margin-left: 10px;
+    }
+}
+.design-content{
+    width: 100%;
+    height: calc(100% - 44px);
+    box-sizing: border-box;
+    padding: 10px;
+    display: flex;
+}
+.content-left{
+    width: 300px;
+    height: 100%;
+}
+.left-top{
+    width: 100%;
+    height: 50%;
+}
+.left-bottom{
+    width: 100%;
+    height: 50%;
+}
+.left-title{
+    color: #333;
+    // font-size: 16px;
+    height: 23px;
+}
+.left-top-content{
+    border: 1px solid #e3e3e3;
+    height: calc(100% - 30px);
+    overflow: auto;
+}
+.top-button{
+    width: 100%;
+    text-align: center;
+    padding: 5px 0;
+    border-bottom: 2px solid #e3e3e3;
+}
+.tree-content{
+    height: calc(100% - 45px);
+    overflow: auto;
+}
+.content-right{
+    width: calc(100% - 300px);
+    height: 100%;
+}
+</style>

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

@@ -0,0 +1,237 @@
+<script>
+import Add from '../Add'
+export default {
+  name: 'epx-report-single-add',
+  link: '', // 表单关联对象
+  linkAddFlag: false,
+  linkSubs: null,
+  pageType: 'DETAIL', // 页面模式
+  saveSuccessText: '新增成功',
+  updateSuccessText: '编辑成功',
+  saveAction: 'save',
+  updateAction: 'update',
+  backTarget: 'list', // 提交成功返回页面
+  addPage: 'add',
+  submitParams: {}, // 提交参数
+  // 表单区域
+  formConfigs: {
+    titleFlag: false,
+    fieldGroups: [],
+    fieldConfigs: {}, // 字段配置
+    column: '2',
+    operates: [{ // 操作按钮
+      text: '保存',
+      ui: 'primary',
+      handler: 'submitForm',
+      option: 'pageType==="ADD"'
+    }, { // 操作按钮
+      text: '保存',
+      ui: 'primary',
+      handler: 'submitForm',
+      option: 'pageType==="EDIT"'
+    }, {
+      text: '编辑',
+      ui: 'primary',
+      handler: 'editEntity',
+      option: 'pageType==="DETAIL"'
+    },
+    {
+      text: '返回',
+      cls: 'btn_hollow',
+      handler: 'backPage'
+    }
+    ]
+  },
+  extends: Add,
+  // props: ['pageTypes'],
+  provide () {
+    return {
+      reportId: this.reportId,
+      staObject: this.staObject
+    }
+  },
+  props: {
+    pageTypes: String,
+    currentQuery: Object,
+    singleSearchParamCN: String,
+    singleSearchParams: Array,
+    closeDialog: Function,
+    closeDialogRefresh: Function,
+    singleScope: Function,
+    staObject: String
+  },
+  watch: {
+    singleSearchParams (v) {
+      const str = JSON.stringify(v)
+      this.$set(this.$refs.form0.model.data, 'SCOPE', str)
+      this.$set(this.$refs.form0.model.data, 'SCOPE_CN', this.singleSearchParamCN)
+      // this.$set(this.data, 'SCOPE', str)
+      // this.$set(this.data, 'SCOPE_CN', this.singleSearchParamCN)
+    }
+  },
+  computed: {
+    pageType () {
+      const { pageType: defaultPageType } = this.pageConfig
+      // const { pageType = defaultPageType } = this.$query
+      const pageType = this.pageTypes || defaultPageType
+      return pageType
+    }
+  },
+  methods: {
+    submitForm () {
+      const { submitParams: querySumitParams = {} } = this.$query
+      // const { submitParams: pageSubmitParams = {}, saveAction, updateAction } = this.pageConfig
+      const { submitParams: pageSubmitParams = {}, saveSuccessText, updateSuccessText, saveAction, updateAction } = this.pageConfig
+      const params = {
+        action: saveAction,
+        entityId: this.$metaId,
+        staObject: this.staObject
+      }
+      if (this.data[this.$metaKey]) {
+        params[`bean.${this.$metaKey}`] = this.data[this.$metaKey]
+      }
+      // 获取form表单 提交
+      const formParams = this.getFormData()
+      const submitParams = this.$_.assignWith(this.$formatParams(pageSubmitParams), formParams, (pageSubmitValue, formValue) => {
+        return formValue || pageSubmitValue
+      })
+      if (!formParams) return
+      if (this.pageType === 'EDIT') params.action = updateAction
+      this.$http.save({
+        ...params,
+        ...querySumitParams,
+        ...submitParams
+      })
+        .then(data => {
+          this.$message.success(this.pageType === 'EDIT' ? updateSuccessText : saveSuccessText)
+          this.closeDialogRefresh()
+        })
+        .catch(err => {
+          this.$message.error(err.message || '处理失败')
+        })
+    },
+    getFormData () {
+      let submitFlag = true
+      const params = {}
+      const { hiddenFields = [] } = this.pageConfig
+      hiddenFields.forEach(field => {
+        if (field.attriName && field.value) {
+          params[field.attriName] = field.value
+        }
+      })
+      for (let index = 0; index < this.fieldGroups.length; index++) {
+        const fieldItem = this.fieldGroups[index]
+        if (!fieldItem.contentType && fieldItem.children) {
+          const form = this.$refs[`form${index}`]
+          for (let i = 0; i < fieldItem.children.length; i++) {
+            const fieldConfig = fieldItem.children[i]
+            const field = fieldItem.children[i].attriName
+            if (this.pageType === 'ADD' || this.pageType === 'EDIT') {
+              form.validate((valid, err) => {
+                if (!valid) {
+                  for (const key in err) {
+                    const errMessgae = err[key][0]
+                    this.$message.error(errMessgae.message)
+                    submitFlag = false
+                    return
+                  }
+                }
+              })
+            }
+            if (submitFlag === false) {
+              break
+            }
+            const formValue = form.model.data[field]
+            if (!field.includes('#')) {
+              let submitValue = formValue
+              if (Array.isArray(formValue)) {
+                submitValue = formValue[formValue.length - 1]
+              }
+              params[fieldConfig.name || `bean.${field}`] = submitValue || ''
+            }
+          }
+        }
+      }
+      return submitFlag ? params : false
+    },
+    backPage () {
+      this.closeDialog()
+    },
+    getData () {
+      this.data = { ...this.defaultValue }
+      // const params = {
+      //   entityId: this.$metaId
+      // }
+      // this.$http.get({ ...params })
+      //   .then(res => {
+      //     if (res && res.data) {
+      //       this.data = { ...this.data, ...res.data }
+      //     }
+      //     // if (this.defaultValue && this.pageType === 'ADD') {
+      //     this.data = { ...this.defaultValue, ...this.data }
+      //     // }
+      //   })
+      //   .catch(() => {
+      //     this.data = { ...this.defaultValue }
+      //   })
+    },
+    getFieldConfig () {
+      let { fieldGroups } = this.formConfigs
+      if (this.$query.reportType === '2') { // 统计图
+        fieldGroups = [{
+          column: '1',
+          children: ['ID', 'REPORT', 'NAME', 'POSITION', 'STA_FIELD', 'MODE', 'SCOPE', 'SCOPE_CN', 'ORDER_NUM']
+        }]
+      }
+      const { fieldConfigs = {} } = this.formConfigs
+      // const { fieldGroups, fieldConfigs = {} } = this.formConfigs
+      const { fieldConfigs: routeFieldConfigs = {} } = this.$query
+      if (!fieldGroups || fieldGroups.length === 0) {
+        fieldGroups.push({
+          title: '基本信息'
+        })
+      }
+      fieldGroups.forEach((item, index) => {
+        // 生成字段配置
+        if (item.contentType) {
+          this.$set(this.fieldGroups, index, { ...item })
+        } else {
+          this.$FieldFactory.createFields({
+            defaultFieldConfigs: { ...routeFieldConfigs, ...fieldConfigs },
+            meta: this.meta,
+            metaId: this.$metaId,
+            pageType: item.pageType || this.pageType,
+            fields: item.children
+          })
+            .then(data => {
+              data.forEach(item => {
+                if (item.attriName === 'SCOPE') {
+                  item.state = 'HIDDEN'
+                }
+              })
+              this.$set(this.fieldGroups, index, { ...item, children: [...data] })
+            })
+        }
+      })
+    },
+    singleScopeAdd (fieldConfig, value) {
+      if (fieldConfig.attriName === 'SCOPE_CN') {
+        this.singleScope()
+      }
+    },
+    renderForm (fieldItem, index) {
+      return (
+        <epx-table-form ref={`form${index}`} formClick={this.singleScopeAdd} fieldsConfigs={fieldItem.children} v-model={this.data} column={fieldItem.column || this.formConfigs.column}></epx-table-form>
+
+      )
+    }
+  },
+  created () {
+    this.getData()
+  }
+}
+</script>
+
+<style>
+
+</style>

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

@@ -0,0 +1,235 @@
+<script>
+import List from '@/frame/views/List'
+import { ADD_META } from '@/store/actions'
+export default {
+  name: 'epx-report-design-form-list',
+  extends: List,
+  navConfigs: {
+    flag: true
+  },
+  detailFlag: true, // 能否打开详情页
+  // 列表区域
+  listConfigs: {
+    flag: true, // 是否显示
+    titleFlag: true, // 是否需要标题
+    queryParams: {}, // 查询参数
+    listFields: null, // 查询字段
+    fieldConfigs: {}, // 字段配置
+    pageFlag: true, // 是否需要分页
+    pageSize: 20, // 每页记录数
+    operateEllipsis: 1,
+    operateFlag: true,
+    multiSelectColumnFlag: true, // 是否显示多选框列
+    serialColumnFlag: true, // 是否显示序号列
+    operateColumnFlag: true, // 是否显示操作列
+    operateColumnWidth: 100, // 操作列宽度
+    operateColumnPosition: 'start', // 操作列位置
+    operateColumnLocked: false,
+    operateColumnEllipsis: true, // Boolean/ Number
+    columnOperates: [
+      // {
+      //   text: '编辑',
+      //   handler: 'editEntity'
+      // },
+      // {
+      //   text: '删除',
+      //   handler: 'removeEntity'
+      // }
+    ],
+    operates: [// 操作按钮
+      {
+        text: '导出',
+        ui: 'primary',
+        cls: 'btn_hollow',
+        handler: 'entityExport'
+      }
+      // {
+      //   text: '返回',
+      //   cls: 'btn_hollow',
+      //   handler: 'backPage'
+      // }
+    ]
+  },
+  methods: {
+    async getData () {
+      var meta = null
+      if (this.$query.staObject) {
+        meta = this.metas[this.$query.staObject]
+        if (!meta) {
+          meta = await this.$store.dispatch({
+            type: ADD_META,
+            metaId: this.$query.staObject
+          })
+        }
+      } else {
+        meta = this.meta
+      }
+      // const listFields =
+      const { queryParams: queryConfigParams = {}, pageFlag, listFields = meta.getListFields() } = this.listConfigs
+      const { searchMode } = this.searchConfigs
+      const fields = listFields.map(item => (item.attriName || item))
+      const { queryParams = {}, scopeParams: queryScopeParams = {} } = this.$query
+      const scopeParams = JSON.parse(JSON.stringify(queryScopeParams))
+      // eslint-disable-next-line no-unused-vars
+      const that = this
+      for (const scopeKey in scopeParams) {
+        const scope = scopeParams[scopeKey]
+        let values = scope.values
+        if (/#\{(.+)\}/.test(values)) {
+          values = values.replace(/#\{(.+)\}/, (match, key) => {
+            try {
+              // eslint-disable-next-line no-eval
+              return eval(`that.$query.${key}`) || eval(`that.$tab.${key}`) || ''
+            } catch (error) {
+              console.error(error)
+              return scope.values
+            }
+          })
+        }
+        scope.values = values
+      }
+      const params = {
+        action: 'getReportData',
+        type: 'list',
+        reportId: this.$query.reportId,
+        col: this.$query.col,
+        row: this.$query.row,
+        // entityId: this.$metaId,
+        entityId: 'FM_REPORT_BASE',
+        staObject: this.$query.staObject,
+        columnFieldNames: fields.join('#,') + '#',
+        ...queryParams,
+        scopeParams
+      }
+      if (pageFlag) {
+        params.page = this.currentPage
+        params.limit = this.pageSize
+      }
+      if (this.searchParams && searchMode) {
+        params.searchMode = searchMode
+      }
+      this.loading = true
+      this.$http.list({
+        ...params,
+        ...this.$formatParams(queryConfigParams),
+        ...this.queryParams,
+        ...this.searchParams,
+        ...this.searchKeyParams,
+        entityId: 'FM_REPORT_BASE'
+      })
+        .then(data => {
+          this.loading = false
+          this.total = data.total
+          this.tableData = [...data.entitys]
+        })
+        .catch(() => {
+          this.loading = false
+        })
+    },
+    async getFieldConfig () {
+      var meta = null
+      if (this.$query.staObject) {
+        meta = this.metas[this.$query.staObject]
+        if (!meta) {
+          meta = await this.$store.dispatch({
+            type: ADD_META,
+            metaId: this.$query.staObject
+          })
+        }
+      } else {
+        meta = this.meta
+      }
+      if (!this.listConfigs.listFields) {
+        const listConfigs = { ...this.listConfigs }
+        listConfigs.listFields = meta.getListFields()
+        this.$set(this.pageConfig, 'listConfigs', listConfigs)
+      }
+      const { listFields, fieldConfigs = {} } = this.listConfigs
+      const { searchFields = [] } = this.searchConfigs
+      const { filterFields = [] } = this.filterConfigs
+      if (searchFields.length > 0) {
+        this.$FieldFactory.createFields({
+          defaultFieldConfigs: fieldConfigs,
+          fields: searchFields,
+          meta: meta,
+          pageType: 'SEARCH'
+        })
+          .then(data => {
+            this.searchFields = [...data]
+          })
+      }
+
+      if (filterFields.length > 0 && this.filterConfigs.flag) {
+        this.$FieldFactory.createFields({
+          defaultFieldConfigs: fieldConfigs,
+          fields: filterFields,
+          meta: meta,
+          pageType: 'SEARCH'
+        })
+          .then(data => {
+            this.filterFields = [...data]
+          })
+      }
+      this.$FieldFactory.createFields({
+        defaultFieldConfigs: fieldConfigs,
+        fields: listFields,
+        meta: meta,
+        pageType: this.pageType
+      })
+        .then(data => {
+          this.listFields = [...data]
+        })
+    },
+    // 页面导出
+    entityExport () {
+      const reportId = this.$query.reportId
+      const row = this.$query.row
+      const col = this.$query.col
+      const staObject = this.$query.staObject
+      const { CLIENT = '' } = this.appConfig
+
+      // const url = '&action=dataList&reportId=' + reportId + '&row=' + row + '&col=' + col + '&staObject=' + staObject + '&entityId=FM_REPORT_BASE&token=' + this.$cookie.get(CLIENT_ID + '-token')
+      const url = '&action=dataList&reportId=' + reportId + '&row=' + row + '&col=' + col + '&staObject=' + staObject + '&outputType=' + 'excel' + '&entityId=FM_REPORT_BASE&token=' + this.$cookie.get(CLIENT + '-token')
+      window.open(this.$util.getAbsPath('a.do') + encodeURI(url))
+
+      // const params = {
+      //   reportId: reportId,
+      //   row: row,
+      //   col: col,
+      //   staObject: staObject,
+      //   token: this.$cookie.get(CLIENT_ID + '-token')
+      // }
+      // // 首先创建一个form表单
+      // var tempForm = document.createElement('form')
+      // // 制定发送请求的方式为post
+      // tempForm.method = 'post'
+      // // 此为window.open的url，通过表单的action来实现
+      // // tempForm.action = this.$util.getAbsPath('a.do') + '&action=dataList'
+      // tempForm.action = this.$util.getAbsPath('a.do') + '&action=dataList&entityId=FM_REPORT_BASE'
+      // // tempForm.action = this.$util.getAbsPath('a.do') + '&action=dataList&entityId=FM_REPORT_BASE&outputType=excel'
+      // // 利用表单的target属性来绑定window.open的一些参数（如设置窗体属性的参数等）
+      // tempForm.target = '_blank'
+      // for (var param in params) {
+      //   const value = params[param]
+      //   const input = document.createElement('input')
+      //   input.type = 'hidden'
+      //   input.name = param
+      //   input.value = value
+      //   tempForm.appendChild(input)
+      // }
+      // // 将此form表单添加到页面主体body中
+      // document.body.appendChild(tempForm)
+      // // 手动触发，提交表单
+      // tempForm.submit()
+      // // 从body中移除form表单
+      // document.body.removeChild(tempForm)
+    }
+  },
+  created () {
+  }
+}
+</script>
+
+<style>
+
+</style>