列表组件 formList 中的showDiv 没得值的bug

one_stop_public/libs/TableList.js

@@ -7,10 +7,8 @@
  * @FilePath: \one_stop_front\src\components\libs\TableList.js
  */
 import React from 'react';
-import { Tree, Table, Spin } from 'antd';
 import FormList from './formList';
 import TreeList from './formList/TreeList';
-import { connect } from 'dva';
 
 export default class TableList extends React.Component {
 	constructor(props) {
@@ -32,16 +30,35 @@ export default class TableList extends React.Component {
 			onChange(Object.assign({}, this.state, changedValue));
 		}
 	};
-	componentWillReceiveProps(nextProps) {
-		// Should be a controlled component.
-		if ('value' in nextProps) {
-			const value = nextProps.value;
-			this.setState(value);
+
+  static getDerivedStateFromProps(nextProps, prevState) {
+    // ...
+    if('value' in nextProps){
+      return {...nextProps.value};
+    }
+    return null;
+  }
+
+  componentDidUpdate(prevProps, prevState) {
+    if(prevState?.columns !== this.state.columns){
+      this.setState({
+        showNo: true,
+      }, () => {
+        setTimeout(()=>{
+          this.setState({
+            showNo: false,
+          });
+        }, 1000);
+      });
     }
   }
 
   render() {
 		const { isTree, json } = this.props;
+		const { showNo } = this.state;
+    if(showNo){
+		  return null;
+    }
 		return isTree ? (
 			<TreeList
 				json={json}
@@ -69,7 +86,7 @@ export default class TableList extends React.Component {
 				isHiddenPage={this.props.isHiddenPage != null ? this.props.isHiddenPage : false}
 				loading={this.props.loading}
 				pageSize={this.props.pageSize || 10}
-				value={this.state}
+				value={{...this.state}}
 				notShowBack={true}
 				rights={this.props.rights || []}
 				objCode={this.props.objCode}

one_stop_public/libs/formList/StandardTable/index.js

@@ -63,7 +63,6 @@ class StandardTable extends Component {
 
 	render() {
 		const { selectedRowKeys, needTotalList } = this.state;
-
 		const {
 			data: { list, pagination },
 			loading,

one_stop_public/libs/formList/index.js

@@ -323,6 +323,9 @@ class FormList extends React.Component {
 		}
 	};
 
+
+
+
 	//渲染值
 	componentDidMount() {
 		const { dispatch, isFormCom, isSelect, callback, valueName } = this.props;
@@ -330,7 +333,7 @@ class FormList extends React.Component {
 		if (this.props.objCode) {
 			const { dispatch, objCode, sql } = this.props;
 
-			if (objCode == 1 || objCode == '1') {
+			if (Number(objCode) === 1) {
 				this.initColumn();
 			} else {
 				dispatch({
@@ -396,10 +399,22 @@ class FormList extends React.Component {
 
 	custom = this.props.value ? Base16Encode(JSON.stringify(this.props.value)) : null;
 
+
+  // componentDidUpdate(prevProps, prevState) {
+  //   console.log(this.props?.value?.columns, prevProps?.props?.value?.columns);
+  //   if(this.props?.value && this.props?.value?.columns !== prevProps?.props?.value?.columns){
+  //     if (Number(this.props.objCode) === 1) {
+  //       this.initColumn();
+  //     }
+  //   }
+  //   return null;
+  // }
+
 	componentWillReceiveProps(nextProps) {
 		const b = nextProps.value || {};
 
 		const a = this.props.value || {};
+
 		const jsonb = JSON.stringify(b);
 		const jsona = JSON.stringify(a);
 
@@ -429,16 +444,15 @@ class FormList extends React.Component {
 	}
 
 	initColumn = () => {
-		const { dispatch, isFormCom, isSelect, callback, valueName } = this.props;
-
+		const { dispatch, value, objCode} = this.props;
 		const { rights, columnRights } = this.state;
-		if (this.props.value && this.props.value.columns) {
-			this.columns = this.props.value.columns;
+		if (value && value.columns) {
+			this.columns = value.columns;
 			let cacheList = [];
 			let cacheChecked = [];
 			// 表头筛选逻辑
-			Array.isArray(this.props.value.columns) &&
-				this.props.value.columns.map((item) => {
+			Array.isArray(value.columns) &&
+      value.columns.map((item) => {
 					if (item.dataIndex != null) {
 						cacheList.push({
 							label: item.title,
@@ -451,9 +465,9 @@ class FormList extends React.Component {
 
 			this.setState({
 				checkedList: cacheChecked,
-				cacheColumns: cloneDeep(this.props.value.columns),
+				cacheColumns: cloneDeep(value.columns),
 			});
-			if (this.props.objCode == 1 || this.props.objCode == '1') {
+			if (Number(objCode) === 1) {
 				this.getPage();
 			} else {
 				dispatch({
@@ -502,7 +516,7 @@ class FormList extends React.Component {
 			return;
 		}
 
-		if (this.props.objCode == 1 || this.props.objCode == '1') {
+		if (Number(objCode) === 1) {
 		} else {
 			dispatch({
 				type: 'formList/getHead',
@@ -646,6 +660,7 @@ class FormList extends React.Component {
 
 
 	getPage = (params, values, callPage, pageNo) => {
+	  const { objCode } = this.props;
 		if (this.columns == null || this.columns.length == 0) {
 			return;
 		}
@@ -662,7 +677,7 @@ class FormList extends React.Component {
 			if (params.pageNo == null && callPage == null && this.props.value.getPage == null) return;
 		}
 
-		if (this.props.objCode && (this.props.objCode == '1' || this.props.objCode == 1)) {
+		if (Number(objCode) === 1) {
 			if (callPage) {
 				callPage(params, (data) => {
 					if (!this.state.isReady) {
@@ -878,7 +893,6 @@ class FormList extends React.Component {
 	};
 	getItem = (isQuery, form, item, isAdd, formData, labelCol, wrapperCol) => {
 		const { groups, isView } = this.state;
-		// console.log(item);
 		//如果隐藏的话 就用隐藏域放置
 		if (item.isHidden) {
 			return (
@@ -1168,7 +1182,6 @@ class FormList extends React.Component {
 			value: { btns },
 			loading,
 		} = this.props;
-
 		const { showMobileDiv, isView } = this.state;
 
 		let scrollWidth = document.documentElement.clientWidth || document.body.clientWidth; //可使宽度
@@ -1176,11 +1189,20 @@ class FormList extends React.Component {
 		if (document.querySelector('#previewDiv')) {
 			isMobile = true;
 		}
+    // console.log(json);
+    let showDiv = 500;
+		if(document.getElementsByClassName('ant-layout-content')?.length){ // 这是大学工项目 容器元素的宽度
+		  showDiv = document.getElementsByClassName('ant-layout-content')[0].clientWidth - 100;
+    }
+		if(json.twidth){ // 列表宽度配置项 在 组件的 扩展的配置里面
+		  showDiv = json.twidth;
+    }
+		if(document.querySelector('#mobelDiv')){ // 这个是一站式的元素的宽度
+      showDiv = document.querySelector('#mobelDiv')?.parentNode.clientWidth;
+    }
+		console.log(showDiv);
+
 
-		let showDiv = json.twidth
-			? json.twidth
-			: document.querySelector('#mobelDiv') &&
-			  document.querySelector('#mobelDiv')?.parentNode.clientWidth;
 		const parentMethods = {
 			handleAdd: this.handleAdd,
 			handleModalVisible: this.handleModalVisible,
@@ -1198,7 +1220,9 @@ class FormList extends React.Component {
 			!rights.includes('view') &&
 			!rights.includes('viewProcess')
 		) {
-		} else {
+		}
+		else
+		{
 			let width = 0;
 			if (rights && rights.includes('viewProcess')) {
 				width = width + 120;
@@ -1269,7 +1293,7 @@ class FormList extends React.Component {
 				this.columns.push(column);
 			}
 		}
-
+		// console.log(this.columns);
 		if (this.columns) {
 			/**
 			 * 计算总长度

one_stop_public/tableCompon/index.jsx

@@ -1320,6 +1320,7 @@ export default class tableCom extends Component {
     const { getFieldDecorator, getFieldError, getFieldProps } = this.props.form;
     const disabled = json != null ? json.disabled : false;
     const permRank = json != null ? (json.permRank != null ? json.permRank : 0) : 0;
+    // console.log(json.comName);
     if (json == null) {
       return <></>;
     }
@@ -1810,6 +1811,8 @@ export default class tableCom extends Component {
           dataColumn.base52 = this.props.uuid;
         }
       }
+
+      // console.log(json.comName);
       switch (json.comName) {
         // 电子签章展示
         // case 'Signature':
@@ -2652,7 +2655,7 @@ export default class tableCom extends Component {
             />,
           );
           if (get === 'mobile') {
-            console.log(json.vlds);
+            // console.log(json.vlds);
             cm = getFieldDecorator(dataColumn.base52, {
               initialValue: initValue,
               rules: