Skip to content

C
CivManage
Commit ca6a0439 authored by 涂伟's avatar 涂伟
Browse files
Options

fix: '代码回滚'

parent b82570fc
Show whitespace changes
Inline Side-by-side
Showing with 62 additions and 236 deletions
src/pages/bsmanager/base/tablemanager/filedConfig/filedConfig.jsx
View file @ ca6a0439
/* eslint-disable no-shadow */
/* eslint-disable react/jsx-boolean-value */
import React, { useState, useEffect, useRef } from 'react';
import React, { useState, useEffect } from 'react';
import {
Form,
Modal,
......@@ -25,8 +25,6 @@ import {
RollbackOutlined,
ConsoleSqlOutlined,
EyeOutlined,
ArrowLeftOutlined,
UploadOutlined,
} from '@ant-design/icons';
import {
reloadTableFields,
......@@ -40,8 +38,7 @@ import FieldEditor from './fieldEditor';
import AffiliateAdd from '../components/Field/affiliateAdd';
import LoadGroup from '../components/Field/loadGroupNew';
import styles from './index.less';
import clearSvg from '@/assets/font/omsfont/clear.svg';
// import PerviewPrase from './PerviewPrase';
import PerviewPrase from './PerviewPrase';
import { LayerSetting } from '@/services/gis/gis';
const AddModal = props => {
const history = useHistory();
......@@ -52,7 +49,6 @@ const AddModal = props => {
const [tableData, setTableData] = useState([]);
const [treeLoading, setTreeLoading] = useState(false);
const [formObj, setFormObj] = useState('');
const [formName, setFormName] = useState('');
const [flag, setFlag] = useState(0); // 弹窗类型
const [isVisible, setIsVisible] = useState(false); // 弹窗
const [isType, setIsType] = useState(''); // 弹窗类型
......@@ -78,8 +74,6 @@ const AddModal = props => {
const [perviewPrase, setPerViewPrase] = useState(false);
const [tablesSchema, setTablesSchema] = useState(null); // 存储parseForm组件需要的数据格式
const formRef = useRef(null);
const getField = () => {
loadUnattachedTables().then(res => {
if (res.data.root && res.data.root.length) {
......@@ -121,7 +115,6 @@ const AddModal = props => {
if (treeSelectValue) {
let ss = treeSelectValue.substring(0, treeSelectValue.lastIndexOf('@'));
setFormObj(treeSelectValue.substring(0, treeSelectValue.lastIndexOf('@')));
setFormName(treeSelectValue.substring(0, treeSelectValue.lastIndexOf('@')));
reloadTableFields({
tableName: treeSelectValue.substring(0, treeSelectValue.lastIndexOf('@')),
}).then(res => {
......@@ -196,7 +189,6 @@ const AddModal = props => {
} else {
let ss = props.location.state.id;
setFormObj(props.location.state.id);
setFormName(props.location.state.name);
reloadTableFields({
tableName: props.location.state.id,
}).then(res => {
......@@ -459,13 +451,13 @@ const AddModal = props => {
setVisible(false);
setFlag(flag + 1);
};
return (
<>
{/* <Spin tip="loading..." spinning={treeLoading}> */}
<Spin tip="loading..." spinning={treeLoading}>
<div className={styles.containerBox}>
<div className={styles.config}>
<ArrowLeftOutlined onClick={back} className={styles.goBack} />
<div className={styles.title}> 展示名称 【{formName}】</div>
<div className={styles.title}> 字段配置 【{formObj}】</div>
<div style={{ display: 'flex', justifyContent: 'flex-end' }}>
{/* <div style={{ lineHeight: '32px', marginRight: '5px' }}>快速切换表:</div>
<div style={{ width: '350px', marginRight: '10px' }}>
......@@ -488,51 +480,25 @@ const AddModal = props => {
</TreeSelect>
</div> */}
<div className={styles.btn}>
<Button
type="primary"
// icon={<PlusSquareOutlined />}
ghost
onClick={() => formRef.current.clear()}
>
<img src={clearSvg} style={{ marginRight: '6px' }} alt="" />
清空
</Button>
<Button
type="primary"
ghost
icon={<EyeOutlined />}
onClick={() => formRef.current.preview()}
style={{ marginLeft: '10px' }}
>
预览
<Button type="primary" icon={<PlusSquareOutlined />} onClick={add}>
附加
</Button>
<Button
type="primary"
icon={<UploadOutlined />}
onClick={() => formRef.current.submit()}
style={{ marginLeft: '10px' }}
>
提交
</Button>
{/* <Button type="primary" icon={<PlusSquareOutlined />} onClick={add}>
附加
</Button> */}
{/* <Button
type="primary"
icon={<RollbackOutlined />}
onClick={back}
style={{ marginLeft: '30px' }}
>
返回
</Button> */}
</Button>
</div>
</div>
</div>
<div style={{ width: '100%', height: 'calc(100% - 63px)', padding: '10px' }}>
{formObj && <FormDesigner ref={formRef} tableName={formObj} extra={true} />}
{formObj && <FormDesigner tableName={formObj} extra />}
</div>
</div>
{/* </Spin> */}
</Spin>
{visible && type === 'affiliateAdd' && (
<AffiliateAdd
visible={visible}
......
src/pages/bsmanager/base/tablemanager/filedConfig/index.less
View file @ ca6a0439
......@@ -119,8 +119,8 @@
padding: 1rem 0 0.5rem 0.5rem;
justify-content: space-between;
width: calc(100% - 10px);
// position: relative;
// padding-left: 50px;
position: relative;
padding-left: 50px;
.goBack {
position: absolute;
......
src/pages/bsmanager/base/tablemanager/index.jsx
View file @ ca6a0439
......@@ -50,7 +50,6 @@ import {
import { useHistory } from 'react-router-dom';
import { Ellipse } from 'bizcharts/lib/g-components';
import { number } from 'prop-types';
import Editor from './components/Field/editor';
// import AddTablelList from './components/Field/addTable';
import AddTablelList from './components/TableView';
......@@ -58,12 +57,8 @@ import AffiliateAdd from './components/Field/affiliateAdd';
import LoadGroup from './components/Field/loadGroup';
import LoadGroupNew from './components/Field/loadGroupNew';
import ChooseTableType from './components/ChooseTableType';
import AddModal from './filedConfig/filedConfig';
// import { defaultFields } from './components/defaultFields';
import styles from './index.less';
import formDesign from '@/assets/font/omsfont/formDesign.svg';
import tableDesign from '@/assets/font/omsfont/tableDesign.svg';
import deleteSvg from '@/assets/font/omsfont/delete.svg';
const { Search } = Input;
const { Option } = Select;
const placeholder = '请输入表名';
......@@ -97,8 +92,6 @@ const TableManager = props => {
const [tableType, setTableType] = useState(defaultFields[0]);
const [groupPopVisible, setgGroupPopVisible] = useState(false);
const [checkMsg, setCheckMsg] = useState();
const [fieldConfigShow, setFieldConfigShow] = useState(false);
const [tableInfo, setTableInfo] = useState({});
const initNum = useRef(0);
useEffect(() => {
GetDefaultTableFields().then(res => {
......@@ -119,9 +112,9 @@ const TableManager = props => {
useEffect(
record => {
if (props.location.query && initNum.current == 0) {
loadTable(props.location.query.searchV);
setSearchValue(props.location.query.searchV);
if (props.history.location.query && initNum.current == 0) {
loadTable(props.history.location.query.searchV);
setSearchValue(props.history.location.query.searchV);
} else {
loadTable(searchValue);
}
......@@ -217,11 +210,9 @@ const TableManager = props => {
const fieldsConfig = (record, e) => {
e.stopPropagation();
setFormObj(record);
// pushFieldConfig(record);
history.push({
pathname: `/biz/account/fieldConfig`,
state: {
name: record.tableAlias || record.tableName,
id: record.tableName,
template: record,
tableScroll: document.querySelector('.ant-table-body').scrollTop,
......@@ -275,19 +266,6 @@ const TableManager = props => {
setTreeLoading(false);
if (res.msg === 'Ok') {
// setTableData(res.data.root);
let arr = res.data.root;
arr.forEach(item => {
item.tableStyle =
item.tableStyle === '大'
? `一行三列/${item.labelStyle ? `${item.labelStyle}布局` : '左右布局'}`
: item.tableStyle;
let fieldCount = Number(item.fieldCount);
let extraFieldCount = Number(
item.extraFieldCount === '(无)' ? 0 : item.extraFieldCount,
);
// item.fieldCount extraFieldCount
item.fieldRatio = `${fieldCount}/${fieldCount + extraFieldCount}`;
});
let groupData = formateArrDataA(res.data.root, 'groupName');
let newArr = [];
let aa = [];
......@@ -378,41 +356,6 @@ const TableManager = props => {
return <div dangerouslySetInnerHTML={{ __html: n }} />;
};
const pushFieldConfig = record => {
history.push({
pathname: `/biz/account/fieldConfig`,
state: {
name: record.tableAlias || record.tableName,
id: record.tableName,
template: record,
tableScroll: document.querySelector('.ant-table-body').scrollTop,
groupArr: groupArr,
pickIndex: pickIndex,
searchValue: searchValue,
select: select,
keepValue: keepValue,
keepTreeSelect: keepTreeSelect,
keepTreeFirst: keepTreeFirst,
keepData: keepData,
},
});
// setTableInfo({
// name: record.tableAlias || record.tableName,
// id: record.tableName,
// template: record,
// tableScroll: document.querySelector('.ant-table-body').scrollTop,
// groupArr: groupArr,
// pickIndex: pickIndex,
// searchValue: searchValue,
// select: select,
// keepValue: keepValue,
// keepTreeSelect: keepTreeSelect,
// keepTreeFirst: keepTreeFirst,
// keepData: keepData,
// });
// setFieldConfigShow(true);
};
const columns = [
{
title: '名称',
......@@ -424,76 +367,50 @@ const TableManager = props => {
),
},
{
title: '展示名称',
title: '别名',
dataIndex: 'tableAlias',
key: 'tableAlias',
align: 'center',
render: text => <div>{text || <span style={{ color: 'grey' }}>（无）</span>}</div>,
render: text => <div>{text || '(无)'}</div>,
},
{
title: '表单布局',
title: '表格样式',
dataIndex: 'tableStyle',
key: 'tableStyle',
align: 'center',
width: 80,
render: text => <div>{!text ? <span style={{ color: 'grey' }}>（无）</span> : text}</div>,
render: text => <div>{text}</div>,
},
// {
// title: '附加字段',
// dataIndex: 'fieldCount',
// key: 'fieldCount',
// align: 'center',
// width: 80,
// },
{
title: '已附加/全部字段',
dataIndex: 'fieldRatio',
key: 'fieldRatio',
title: '附加字段',
dataIndex: 'fieldCount',
key: 'fieldCount',
align: 'center',
width: 240,
render: (text, record) => {
if (record.missingFieldCount === '(无)') {
return <Tag color="processing">{text}</Tag>;
}
return <Tag color="error">{text}</Tag>;
},
width: 80,
},
{
title: '异常字段',
title: '缺少字段',
dataIndex: 'missingFieldCount',
key: 'missingFieldCount',
align: 'center',
width: 80,
render: record => {
if (record === '(无)') {
return <div style={{ color: 'grey' }}>{record}</div>;
}
return <div style={{ color: 'red' }}>{record}</div>;
render: text => (
<div
className={classnames({
[styles.lack]: text !== '(无)',
})}
>
{text}
</div>
),
},
{
title: '未附加',
dataIndex: 'extraFieldCount',
key: 'extraFieldCount',
align: 'center',
width: 80,
},
// {
// title: '缺少字段',
// dataIndex: 'missingFieldCount',
// key: 'missingFieldCount',
// align: 'center',
// width: 80,
// render: text => (
// <div
// className={classnames({
// [styles.lack]: text !== '(无)',
// })}
// >
// {text}
// </div>
// ),
// },
// {
// title: '未附加',
// dataIndex: 'extraFieldCount',
// key: 'extraFieldCount',
// align: 'center',
// width: 80,
// },
{
title: '分组数量',
dataIndex: 'groupCount',
......@@ -523,50 +440,23 @@ const TableManager = props => {
ellipsis: true,
key: 'tableID',
align: 'center',
width: 120,
width: 100,
render: (text, record) => (
<Space>
<Tooltip title="表结构设计">
{/* <EditOutlined
<Tooltip title="修改">
<EditOutlined
onClick={() => changeDesc(record)}
style={{ fontSize: '20px', color: '#1890FF' }}
/> */}
<img
className={styles.btnImg}
src={formDesign}
alt=""
// onClick={() => changeDesc(record)}
onClick={() => {
setType('tableEdit');
setVisible(true);
setFormObj(record);
}}
style={{ width: '16px', color: '#1890FF' }}
/>
</Tooltip>
<Tooltip title="表单设计">
{/* <MenuOutlined
<Tooltip title="表配置">
<MenuOutlined
onClick={() => {
setType('tableEdit');
setVisible(true);
setFormObj(record);
}}
style={{ fontSize: '20px', color: '#1890FF' }}
/> */}
<img
className={styles.btnImg}
src={tableDesign}
alt=""
// onClick={() => {
// setType('tableEdit');
// setVisible(true);
// setFormObj(record);
// }}
onClick={e => {
e.stopPropagation();
pushFieldConfig(record);
}}
style={{ width: '16px', color: '#1890FF' }}
/>
</Tooltip>
{/* <Tooltip title="字段配置">
......@@ -597,13 +487,7 @@ const TableManager = props => {
}}
>
<Tooltip title="删除">
{/* <DeleteOutlined style={{ fontSize: '16px', color: '#e86060' }} /> */}
<img
className={styles.btnImg}
src={deleteSvg}
alt=""
style={{ width: '16px', color: '#1890FF' }}
/>
<DeleteOutlined style={{ fontSize: '16px', color: '#e86060' }} />
</Tooltip>
</Popconfirm>
</div>
......@@ -611,10 +495,6 @@ const TableManager = props => {
),
},
];
const tableListCancel = () => {
setVisible(false);
};
const pageChage = (page, pageSize) => {
const list = JSON.parse(JSON.stringify(groupArr));
list[pickIndex].page = page;
......@@ -786,23 +666,22 @@ const TableManager = props => {
onRow={record => ({
onDoubleClick: event => {
event.stopPropagation();
// history.push({
// pathname: `/biz/account/fieldConfig`,
// state: {
// id: record.tableName,
// template: record,
// tableScroll: document.querySelector('.ant-table-body').scrollTop,
// groupArr: groupArr,
// pickIndex: pickIndex,
// searchValue: searchValue,
// select: select,
// keepValue: keepValue,
// keepTreeSelect: keepTreeSelect,
// keepTreeFirst: keepTreeFirst,
// keepData: keepData,
// },
// });
pushFieldConfig(record);
history.push({
pathname: `/biz/account/fieldConfig`,
state: {
id: record.tableName,
template: record,
tableScroll: document.querySelector('.ant-table-body').scrollTop,
groupArr: groupArr,
pickIndex: pickIndex,
searchValue: searchValue,
select: select,
keepValue: keepValue,
keepTreeSelect: keepTreeSelect,
keepTreeFirst: keepTreeFirst,
keepData: keepData,
},
});
},
onClick: event => {
event.stopPropagation();
......@@ -838,7 +717,7 @@ const TableManager = props => {
<AddTablelList
visible={visible && (type === 'add' || type === 'tableEdit')}
type={type}
onCancel={() => tableListCancel()}
onCancel={() => setVisible(false)}
formObj={formObj}
callBackSubmit={onSubmit}
defaultFieldsList={defaultFieldsList}
......@@ -890,25 +769,6 @@ const TableManager = props => {
>
<div style={{ whiteSpace: 'pre-line', textAlign: 'justify' }}>{checkMsg}</div>
</Modal>
<Modal
title="表单设计"
visible={fieldConfigShow}
// onOk={getNewGroup}
onCancel={() => setFieldConfigShow(false)}
footer={null}
width="100vw"
style={{
maxWidth: '100vw',
top: 0,
paddingBottom: 0,
}}
bodyStyle={{
height: 'calc(100vh - 55px)',
}}
getContainer={false}
>
<AddModal tableInfo={tableInfo} show={fieldConfigShow} />
</Modal>
</PageContainer>
</Spin>
);
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment