src/utils/index.js

@@ -98,3 +98,19 @@ export function treeDataTranslate (data, id = 'id', pid = 'pid') {
   }
   return res
 }
+
+/** 计算表格的最大高 */
+export function calcMaxHeight(num) {
+  const FIXED_HEIGHT = 220
+  let clientHeight = 0
+  const bodyHeight = document.body.clientHeight || null
+  const documentHeight = document.documentElement.clientHeight || null
+  if (bodyHeight && documentHeight) {
+    clientHeight = Math.max(bodyHeight, documentHeight)
+  } else {
+    clientHeight = documentHeight ? documentHeight : bodyHeight
+  }
+
+  const finalHeight = clientHeight - num - FIXED_HEIGHT
+  return finalHeight > 0 ? finalHeight : -finalHeight
+}

src/views/modules/monitoring/equipment.vue

@@ -27,7 +27,7 @@
 		<base-table
 			:data="dataList"
 			:table-head-configs="tableConfigs"
-			:max-height="500"
+			:max-height="calcMaxHeight(8)"
 			@operate-event="handleOperations"
 			@refreshDataList="getDataList"
 		/>
@@ -60,6 +60,7 @@ import TableOperateComponent from '@/components/base-table/components/operationC
 import TableTextComponent from '@/components/base-table/components/detailComponent'
 import moment from 'moment'
 import CKEditor from 'ckeditor4-vue'
+import { calcMaxHeight } from '@/utils'
 
 const tableConfigs = [
 	{
@@ -278,6 +279,7 @@ export default {
 	i18n: i18nLocal,
 	data() {
 		return {
+			calcMaxHeight,
 			tableConfigs,
 			addOrUpdateConfigs,
 			dataForm: {
@@ -358,7 +360,9 @@ export default {
 				})
 			}).then(({ data }) => {
 				if (data && data.code === 0) {
-					this.dataList = data.data.list
+					// this.dataList = data.data.list
+					this.dataList = new Array(20).fill('1')
+					console.log('data list', this.dataList)
 					this.totalPage = data.data.total
 				} else {
 					this.dataList = []