表格样式修改

FormInsertDiy/ListWithAddEditTemplate/index.js

@@ -20,11 +20,11 @@ import {
 } from '@/webPublic/Services';
 import { ModalConfirm } from '@/baseComponent/Modal';
 
-const dateRender = val => val && moment(val).format('YYYY-MM-DD HH:mm:ss');
+const dateRender = (val) => val && moment(val).format('YYYY-MM-DD HH:mm:ss');
 
-const getValue = obj =>
+const getValue = (obj) =>
 	Object.keys(obj)
-    .map(key => obj[key])
+		.map((key) => obj[key])
 		.join(',');
 
 /**
@@ -71,20 +71,22 @@ class ListWithAddEditTemplate extends React.Component {
 	// 渲染值
 	componentDidMount() {
 		const { objId } = this.props;
-    fetchTableHeader(objId).then(headerList => {
+		fetchTableHeader(objId).then((headerList) => {
 			if (!headerList) return;
 			this.setState({ headerList });
 
 			this.columns = headerList
-        .filter(i => !i.isHidden)
+				.filter((i) => !i.isHidden)
 				.slice(0, 10)
-        .map(item => ({
+				.map((item) => ({
 					title: item.title,
 					dataIndex: item.name,
 					render: date.includes(item.type) && dateRender,
 				}));
 			const operation = {
         title: '操作',
+        fixed: 'right',
+        width: 120,
 				render: (_, record) => {
 					return (
 						<Fragment>
@@ -97,11 +99,11 @@ class ListWithAddEditTemplate extends React.Component {
 			};
 			this.columns.push(operation);
 
-      const primaryKey = (headerList.find(i => i.isPrimaryKey) || {}).name;
+			const primaryKey = (headerList.find((i) => i.isPrimaryKey) || {}).name;
 
 			this.setState({ primaryKey });
 
-      const searchConfig = headerList.filter(i => i.isShowQuery).map(item => {
+			const searchConfig = headerList.filter((i) => i.isShowQuery).map((item) => {
 				const sear = getFormArrayConfig([item]);
 				const { required, placeHolder, ...config } = sear[0];
 				return config;
@@ -124,19 +126,16 @@ class ListWithAddEditTemplate extends React.Component {
 	};
 
 	// 修改按钮事件
-  modify = record => {
+	modify = (record) => {
 		const recordTemp = { ...record, update_time: Date.now() };
 		const { headerList } = this.state;
 		// const showEdit = headerList.length >= 10;
 		// 把record里明文key改成转换后的key，用于在模板表单中回显
 		const headerMap = headerList.reduce((acc, header) => ({ ...acc, [header.name]: header }), {});
-    const formData = Object.keys(recordTemp).reduce(
-      (acc, key) => {
+		const formData = Object.keys(recordTemp).reduce((acc, key) => {
 			if (!headerMap[key]) return acc;
 			return { ...acc, [headerMap[key].base52]: recordTemp[key] };
-      },
-      {}
-    );
+		}, {});
 		this.setState({
 			formData,
 			modalVisible: true,
@@ -145,7 +144,7 @@ class ListWithAddEditTemplate extends React.Component {
 		});
 	};
 
-  delete = record => {
+	delete = (record) => {
 		ModalConfirm('确定删除？', {
 			onOk: () => {
 				const { objId } = this.props;
@@ -154,7 +153,7 @@ class ListWithAddEditTemplate extends React.Component {
 				const Keys = {};
 
 				Keys[primaryKey] = record[primaryKey];
-        deleteTableItem(objId, primaryKey, record[primaryKey]).then(res => {
+				deleteTableItem(objId, primaryKey, record[primaryKey]).then((res) => {
 					this.getPage();
 				});
 			},
@@ -175,7 +174,7 @@ class ListWithAddEditTemplate extends React.Component {
 		const pageNo = pagination.current ? pagination.current : 1;
 		const pageSize = pagination.pageSize ? pagination.pageSize : 10;
 
-    fetchTableData({ dataObjId: objId, query, pageSize, pageNo }).then(res => {
+		fetchTableData({ dataObjId: objId, query, pageSize, pageNo }).then((res) => {
 			if (!res.rows) {
 				console.log('分页接口rows返回null报错');
 			}
@@ -197,7 +196,7 @@ class ListWithAddEditTemplate extends React.Component {
 			({ pageData }) => ({
 				pageData: { ...pageData, pagination },
 			}),
-      this.getPage
+			this.getPage,
 		);
 	};
 
@@ -210,7 +209,7 @@ class ListWithAddEditTemplate extends React.Component {
 		validateFields((err, values) => {
 			if (err) return;
 			this.setState({ confirmLoading: true });
-      addOrEditTableItem({ objId, data: values, isAdd }).then(res => {
+			addOrEditTableItem({ objId, data: values, isAdd }).then((res) => {
 				this.setState({ confirmLoading: false });
 				if (res === true) {
 					message.success('操作成功');
@@ -232,13 +231,13 @@ class ListWithAddEditTemplate extends React.Component {
 		});
 	};
 
-  handleSelectRows = rows => {
+	handleSelectRows = (rows) => {
 		this.setState({
 			selectedRows: rows,
 		});
 	};
 
-  batchDelete = e => {
+	batchDelete = (e) => {
 		const { selectedRows, primaryKey } = this.state;
 		const { objId } = this.props;
 
@@ -246,12 +245,14 @@ class ListWithAddEditTemplate extends React.Component {
 
 		ModalConfirm('确定删除？', {
 			onOk: () => {
-        deleteTableItem(objId, primaryKey, selectedRows.map(row => row[primaryKey])).then(res => {
+				deleteTableItem(objId, primaryKey, selectedRows.map((row) => row[primaryKey])).then(
+					(res) => {
 						this.setState({
 							selectedRows: [],
 						});
 						this.getPage();
-        });
+					},
+				);
 			},
 		});
 	};
@@ -298,20 +299,6 @@ class ListWithAddEditTemplate extends React.Component {
 		};
 		return (
 			<>
-        {showEdit ? (
-          <Edit
-            id={objId}
-            recordId={formData[primaryKey]}
-            recordKey={primaryKey}
-            returnThis={() => {
-              this.setState({
-                showEdit: false,
-              });
-              this.getPage();
-            }}
-          />
-        ) : (
-          <Fragment>
 				{searchConfig.length > 0 ? (
 					<SearchDom
 						formStateChange={this.formStateChange}
@@ -335,11 +322,10 @@ class ListWithAddEditTemplate extends React.Component {
 						selectedRows={selectedRows}
 						onSelectRow={this.handleSelectRows}
 						onChange={this.handleStandardTableChange}
-                scroll={{ x: 1200 }}
+						scroll={{ x: true }}
 					/>
 				</Shell>
-          </Fragment>
-        )}
+
 				<AddOrEditModal {...addOrEditModalProps} />
 			</>
 		);