agilebuilder-ui 1.0.84 → 1.0.85-temp2

package/packages/super-grid/src/row-detail.vue

@@ -0,0 +1,50 @@
+<template>
+  <el-table-column
+      align="center"
+      :class-name="column.prop"
+      fixed="left"
+      header-align="center"
+      :prop="column.prop"
+      :width="80"
+      :label="column.label"
+    >
+    <template v-slot="scope">
+    <el-icon @click="showDetail(scope.$index)"><ElView /></el-icon>
+    </template>
+  </el-table-column>
+</template>
+
+<script>
+import { View as ElView } from '@element-plus/icons-vue'
+export default {
+  name: 'RowDetail',
+  components: {
+    ElView
+  },
+  props: {
+    column: {
+      type: Object,
+      default: null
+    },
+    listCode: {
+      type: String,
+      default: null
+    }
+  },
+  data() {
+  },
+  computed: {
+  },
+  created() {
+  },
+  methods: {
+    showDetail(rowIndex) {
+      this.$emit('show-detail',  rowIndex)
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+
+</style>

package/packages/super-grid/src/search-form-advancedQuery.vue

@@ -462,10 +462,15 @@ export default {
 		...searchMethods,
 		getDynamicDataSourceOptions(column) {
 			const gridParams = store.get(this.code)
+			let baseURL = gridParams.options.backendUrl
+			if (!baseURL) {
+				baseURL = window.$vueApp.config.globalProperties.baseURL
+			}
 			return getDynamicDataSourceOptions(
 					column,
 					this.isSql,
-					gridParams.additionalParamMap
+					gridParams.additionalParamMap,
+					baseURL
 			)
 		},
 		// 值设置是否是动态数据源类型的数据源

package/packages/super-grid/src/search-form-item.vue

@@ -321,10 +321,15 @@ export default {
 		...searchMethods,
 		getDynamicDataSourceOptions(column) {
 			const gridParams = store.get(this.code)
+			let baseURL = gridParams.options.backendUrl
+			if (!baseURL) {
+				baseURL = window.$vueApp.config.globalProperties.baseURL
+			}
 			return getDynamicDataSourceOptions(
 					column,
 					this.isSql,
-					gridParams.additionalParamMap
+					gridParams.additionalParamMap,
+					baseURL
 			)
 		},
 		// 值设置是否是动态数据源类型的数据源

package/packages/super-grid/src/super-grid-service.js

@@ -192,6 +192,7 @@ const superGridService = {
                   ? this.isShowPage
                   : false
                 gridParams.isSubTableShowPage = this.isSubTableShowPage
+                this.getDetailColumn()
                 this.hasLoadedColumns = true
                 let canFetchData = true
                 if (isHasOptionFunction('loadBeforeSend', this.code)) {
@@ -249,6 +250,45 @@ const superGridService = {
       console.log('初始化所耗时间', a1 - a)
     })
   },
+  getDetailColumn() {
+    if (this.isFormSubTable && this.options.showRowForm) {
+      // 显示详情列
+      const detailColumn = {
+        "prop": "$detail",
+        "orgProp": "$detail",
+        "label": "详情",
+        "dataType": "TEXT",
+        "width": 80,
+        "show": true,
+        "exportable": false,
+        "sortable": "false",
+        "filterable": false,
+        "fixed": "left",
+        "span": false,
+        "queryType": "no",
+        "querySetting": "{}",
+        "editable": false,
+        "componentType": "input",
+        "titleAlign": "center",
+        "contAlign": "center",
+        "showType": "default",
+        "exportType": "default",
+        "displayOrderType": "default",
+        "displayOrder": 5,
+        "widthType": "default",
+        "ifMultiData": true,
+        "dynamic": false,
+        "total": false,
+        "custom": true,
+        "remoteEnum": false,
+        "fuzzy": true,
+        "groupHeader": false
+      }
+      detailColumn.label = this.$t('superGrid.detail')
+      this.detailColumn = detailColumn
+      console.log('getDetailColumn----this.detailColumn=', this.detailColumn)
+    }
+  },
   getListViewSetting(additionalParams) {
     return new Promise((resolve, reject) => {
       console.log('getListViewSetting--this.settings====', this.settings)

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

@@ -75,6 +75,11 @@
         @cell-click="selectCell"
         @cell-dblclick="cellDblClick"
       >
+        <row-detail v-if="detailColumn"
+          :column="detailColumn"
+          :list-code="code"
+          @show-detail="openRowForm"
+        />
         <template v-if="myCustomFormatter">
           <component
             :is="getComponentType(column)"
@@ -205,14 +210,34 @@
       :column="rightClickColumn"
       @clearHeaderContextmenu="clearHeaderContextmenu"
     />
-    <!-- <super-page-dialog
-      v-if="isShowPageDialog"
-      :dev-mode="pageDevMode"
-      :jump-page-setting="jumpPageSetting"
-      :source-page-code="pageCode"
-      @close="closePageDialog"
-      @update-value="updateValues"
-    /> -->
+    <row-form
+      v-if="showRowForm"
+      :parent-form-data="parentFormData"
+      :columns="visibleColumns"
+      :row-index="currentEditRowIndex"
+      :list-code="code"
+      :drag-column-prop="dragColumnProp"
+      :is-sql="isSql"
+      :base-url="baseURL"
+      :options="options"
+      :table-name="tableName"
+      :page-code="pageCode"
+      :list-toolbar-form-data="listToolbarFormData"
+      :list-name="listName"
+      :current-page="currentPage"
+      :grid-data="isSubTableShowPage ? subTableData : gridData"
+      :page-grid-data="
+        isSubTableShowPage ? getSubTableGridData(subTableData) : gridData
+      "
+      :line-edit="lineEdit"
+      @close="closeRowForm"
+      @refresData="refresData"
+      @refresPortData="refresPortData"
+      @refresPortsData="refresPortsData"
+      @refresMainTableFields="refresMainTableFields"
+      @open-page="openPageDialog"
+      @prohibitToEdit="prohibitToEdit"
+    />
   </div>
 </template>
 
@@ -226,6 +251,7 @@ import GroupColumn from './group-column.vue'
 import ColumnsConfig from './columns-config.vue'
 import SearchForm from './search-form.vue'
 import searchFormDialog from './search-form-dialog.vue'
+import RowDetail from './row-detail.vue'
 import {getEntityFieldValueWithOutCase, setEntityFieldValue} from '../../../src/utils/util'
 import eventBus from './eventBus'
 import {
@@ -266,6 +292,7 @@ export default {
     searchFormDialog,
     ElIconSetting,
     ElIconRefresh,
+    RowDetail
   },
   name: 'SuperGrid',
   props: {
@@ -461,7 +488,11 @@ export default {
       configureObj, // 表格配置信息
       isMobile, // 是否是移动端
       isShowMobileSearch: false, // 是否显示移动端查询区域
-      subTableStyle: {}
+      subTableStyle: {},
+      detailColumn: null, // 详情列。子表展开表单 配置使用。
+      currentEditRowIndex: null, // 当前查看的行记录号
+      showRowForm: false, // 是否显示行记录详情
+      baseURL: null
     }
   },
   computed: {
@@ -976,20 +1007,27 @@ export default {
             gridParams.options.formSetHeight
           ) {
             tempMaxHeight = gridParams.options.formSetHeight
-          } else if (
-            !this.basicInfo.displayEffect ||
-            this.basicInfo.displayEffect === '' ||
-            this.basicInfo.displayEffect === 'default'
-          ) {
-            tempMaxHeight = null
           }
+          //  else if (
+          //   !this.basicInfo.displayEffect ||
+          //   this.basicInfo.displayEffect === '' ||
+          //   this.basicInfo.displayEffect === 'default'
+          // ) {
+          //   tempMaxHeight = null
+          // }
           // if(tempHeight !== undefined && tempHeight !== null){
           //   // el-table的height和maxHeight不能同时设值，会导致列表渲染失败，报脚本错.设置height不起作用,都使用maxHeight控制列表高度吧,暂时不知道原因
             // this.tableHeight = tempHeight
           // }
         }
-         if(tempMaxHeight !== undefined && tempMaxHeight !== null){
+         if(!this.basicInfo.displayEffect ||
+            this.basicInfo.displayEffect === '' ||
+            this.basicInfo.displayEffect === 'default'){
+              // default默认不铺满
           this.maxHeight = tempMaxHeight
+        } else {
+          // 表示需要cover铺满
+          this.tableHeight = tempMaxHeight
         }
         console.log('resizeTableHeight-----tempMaxHeight=',tempMaxHeight,'this.tableHeight=',this.tableHeight,'this.maxHeight=', this.maxHeight ,'gridParams.options=', gridParams.options)
       })
@@ -1341,6 +1379,15 @@ export default {
       ) {
         gridParams.additionalParamMap = this.options.additionalParamMap
       }
+      
+      let baseURL
+      if (gridParams.options && gridParams.options.backendUrl) {
+        baseURL = gridParams.options.backendUrl
+      }
+      if (!baseURL) {
+        baseURL = window.$vueApp.config.globalProperties.baseURL
+      }
+      this.baseURL = baseURL
     },
     changeRowStyle(param) {
       // param的格式：{row, rowIndex}
@@ -2303,7 +2350,8 @@ export default {
       }
       if (
         gridParams.query &&
-        typeof gridParams.query.defaultQueryCriteria !== 'undefined'
+        typeof gridParams.query.defaultQueryCriteria !== 'undefined' &&
+        gridParams.query.defaultQueryCriteria !== ''
       ) {
         // json字符串转数组
         searchParam.defaultQueryCriteria = JSON.parse(
@@ -2323,15 +2371,10 @@ export default {
       }
       const additionalParamMap = gridParams.additionalParamMap
       if (additionalParamMap) {
-        console.log('getSearchParam---additionalParamMap=', additionalParamMap)
         if (additionalParamMap && typeof additionalParamMap === 'object') {
           searchParam.additionalParamMap = additionalParamMap
         } else if (additionalParamMap && additionalParamMap !== '') {
-          try {
-            searchParam.additionalParamMap = JSON.parse(additionalParamMap)
-          } catch (error) {
-            console.error('error=', error)
-          }
+          searchParam.additionalParamMap = JSON.parse(additionalParamMap)
         }
       }
       return searchParam
@@ -3256,6 +3299,13 @@ export default {
       if (data && data.componentId) {
         eventBus.$emit(data.componentId + '-scanDone', data)
       }
+    },
+    openRowForm (rowIndex) {
+      this.currentEditRowIndex = rowIndex
+      this.showRowForm = true
+    },
+    closeRowForm () {
+      this.showRowForm = false
     }
   },
   emits: [

package/packages/super-grid/src/utils.js

@@ -2,6 +2,7 @@ import * as Vue from 'vue'
 import { getToken } from '../../../src/utils/auth'
 import { isPlateSys, isShowMenuRoute } from '../../../src/utils/common-util'
 import { getEntityFieldValue } from '../../../src/utils/util'
+import { doFormatWithValueSet } from './formatter'
 import store from './store'
 export function getColumnValues(data, prop) {
   const values = []
@@ -550,64 +551,45 @@ export function addDynamicPropDateSection(target, prop, propValue) {
 }
 
 export function getTableHeight(superGrid, listCode, pageHeight) {
-  let topDivHeight = 120
-  const boxCard = document.querySelector('.box-card')
-  if (boxCard && boxCard !== null) {
-    // 表示是配置系统的列表页面
-    //  16 .gray .app-container .box-card，
-    // 20为内容区域的padding 20
-    // 34 + 5为翻页 height 和margin-top
-    topDivHeight = 16 * 2 + 20 + 34 + 5
-  }
-
-  if (isShowMenuRoute() === true) {
-    // 如果显示菜单层级，列表高度需要减少50
-    topDivHeight = topDivHeight + 50
-  }
-
-  const listGrid = document.querySelector('.el-tabs__content .' + listCode)
-  if (listGrid) {
-    // 表示当前列表在tab页签内容，需要减去tab的高度
-    topDivHeight = topDivHeight + 80
-  }
-  if (pageHeight === undefined || pageHeight === null || pageHeight === '') {
-    pageHeight = window.innerHeight
-  } else {
-    // 表示弹框页面的高度
-    topDivHeight = 0
-  }
-  let totalHeight = pageHeight - topDivHeight
+  let rect
   if (superGrid) {
-    totalHeight = pageHeight - superGrid.$el.offsetTop - topDivHeight
+    rect = superGrid.$el.getBoundingClientRect()
   }
-  // const cur = document.querySelectorAll("div[class='grid-area']")
-  // if (cur.length === 1) {
-  // 表示只有一个表格
+  const totalHeight = window.innerHeight - rect.y - 90
+  console.log('rect=', rect, 'window.innerHeight=', window.innerHeight, 'totalHeight=', totalHeight)
   return totalHeight
-  // } else if (cur.length > 1) {
-  //   // 表示有多个表格
-  //   // TODO 主子表的表格高度自适应待实现
-  //   const gridParams = store.get(listCode)
-  //   let addHeight = 0
-  //   if (gridParams.options.addHeight) {
-  //     addHeight = gridParams.options.addHeight
-  //   }
-  //   const hasLoadMainTable = store.hasLoadMainTable
-  //   if (typeof (hasLoadMainTable) !== 'undefined' && hasLoadMainTable === true) {
-  //     // 表示主表已加载完成
-  //     const gridHeight = store.gridTableHeight + addHeight
-  //     store.hasLoadMainTable = false
-  //     return gridHeight
-  //   } else {
-  //     let gridHeight = totalHeight / cur.length - 5 + addHeight
-  //     if (gridHeight <= 0) {
-  //       gridHeight = 200
-  //     }
-  //     store.hasLoadMainTable = true
-  //     store.gridTableHeight = gridHeight
-  //     return gridHeight
-  //   }
+
+  // let topDivHeight = 120
+  // const boxCard = document.querySelector('.box-card')
+  // if (boxCard && boxCard !== null) {
+  //   // 表示是配置系统的列表页面
+  //   //  16 .gray .app-container .box-card，
+  //   // 20为内容区域的padding 20
+  //   // 34 + 5为翻页 height 和margin-top
+  //   topDivHeight = 16 * 2 + 20 + 34 + 5
+  // }
+
+  // if (isShowMenuRoute() === true) {
+  //   // 如果显示菜单层级，列表高度需要减少50
+  //   topDivHeight = topDivHeight + 50
+  // }
+
+  // const listGrid = document.querySelector('.el-tabs__content .' + listCode)
+  // if (listGrid) {
+  //   // 表示当前列表在tab页签内容，需要减去tab的高度
+  //   topDivHeight = topDivHeight + 80
+  // }
+  // if (pageHeight === undefined || pageHeight === null || pageHeight === '') {
+  //   pageHeight = window.innerHeight
+  // } else {
+  //   // 表示弹框页面的高度
+  //   topDivHeight = 0
+  // }
+  // let totalHeight = pageHeight - topDivHeight
+  // if (superGrid) {
+  //   totalHeight = pageHeight - superGrid.$el.offsetTop - topDivHeight
   // }
+  // return totalHeight
 }
 
 export function getExtraParam(searchParam, gridParams) {
@@ -734,7 +716,7 @@ export function getFileList(row, column, isSql) {
   return fileList
 }
 
-export function getDynamicDataSourceOptions(column, isSql, additionalParamMap) {
+export function getDynamicDataSourceOptions(column, isSql, additionalParamMap, baseURL) {
   let additionalParameter
   if (additionalParamMap) {
     console.log('getDynamicDataSourceOptions--additionalParamMap=', additionalParamMap)
@@ -746,7 +728,8 @@ export function getDynamicDataSourceOptions(column, isSql, additionalParamMap) {
   }
   const options = {
     isSql: isSql,
-    additionalParameter: additionalParameter
+    additionalParameter: additionalParameter,
+    backendUrl: baseURL
   }
   // 如果是多选文件类型，需要解析（需要设置临时字段，判断文件还是图片，图片需要预览）
   if (column.valueSetOptions) {
@@ -808,3 +791,39 @@ export function getControlConfig(column) {
   }
   return controlConfig
 }
+
+export function getContentAlign(column, gridParams){
+  let align
+  if (typeof gridParams.options.align !== 'undefined') {
+    align = gridParams.options.align
+  } else if (column.contAlign && column.contAlign !== '') {
+    align = column.contAlign
+  }
+  return align
+}
+
+export function getHeaderAlign(column, gridParams){
+  let headerAlign
+  if (typeof gridParams.options.headerAlign !== 'undefined') {
+    headerAlign = gridParams.options.headerAlign
+  } else if (column.titleAlign && column.titleAlign !== '') {
+    headerAlign = column.titleAlign
+  } else {
+    // 如果没有配置表头对齐方式，默认使用内容对齐方式
+    headerAlign = 'left'
+  }
+  return headerAlign
+}
+
+
+export function getHeaderLable(column) {
+  if (!column.titleValueSet) {
+    return column.label.replace(/\\n/g, '</br>')
+  } else {
+    return formatHeader(column)
+  }
+}
+
+function formatHeader(column) {
+  return doFormatWithValueSet(column.titleValueSetValue, column.label)
+}

package/src/i18n/langs/cn.js

@@ -125,7 +125,10 @@ const cn = {
         previewTitleWhenNotImg: '非图片格式，使用其它方式预览',
         refresh: '刷新',
         open: '展开',
-        fold: '收起'
+        fold: '收起',
+        prevRow: '上一行',
+        nextRow: '下一行',
+        detail: '详情'
     },
     // 部门树组件
     departmentTree: {},

package/src/i18n/langs/en.js

@@ -130,6 +130,9 @@ const en = {
         refresh: 'Refresh',
         open: 'Open',
         fold: 'Fold',
+        prevRow: 'Prev Row',
+        nextRow: 'Next Row',
+        detail: 'Detail'
     },
     departmentTree: {},
     departmentTreeInline: {