Commit 39360033 authored by 皮倩雯's avatar 皮倩雯

优化事件管理界面UI

parent 5946c5ef
Pipeline #36071 skipped with stages
import React, { useState, useEffect} from 'react'; import React, { useState, useEffect} from 'react';
import { Modal, Form, Input, notification, Row, Col, Select, Button, Dropdown, Menu } from 'antd'; import { Drawer, Form, Input, notification, Row, Col, Select, Button, Dropdown, Menu, Space } from 'antd';
import styles from './maintenance.less' import styles from './maintenance.less'
import ModalDrag from './ModalDrag'; import ModalDrag from './ModalDrag';
import { CM_XWBPlan_AccountTable, CM_XWBPlan_feedbackTable, CM_XWBPlan_DataEditORAdd, CM_XWBPlan_DataList } from '@/services/maintenance/api' import { CM_XWBPlan_AccountTable, CM_XWBPlan_feedbackTable, CM_XWBPlan_DataEditORAdd, CM_XWBPlan_DataList } from '@/services/maintenance/api'
...@@ -254,22 +254,24 @@ const AddModal = props => { ...@@ -254,22 +254,24 @@ const AddModal = props => {
setCheckedList1(prop.checkedList) setCheckedList1(prop.checkedList)
setInputValue(inputText) setInputValue(inputText)
} }
const title = <ModalDrag title="巡维保计划配置" /> // const title = <ModalDrag title="巡维保计划配置" />
return ( return (
<Modal <Drawer
title={title} title="巡维保计划配置"
visible={visible} visible={visible}
maskClosable={false}
mask={false}
destroyOnClose destroyOnClose
width="800px" width="800px"
destroyOnClose destroyOnClose
okText="确认"
cancelText="取消"
{...props} {...props}
onOk={() => onSubmit()} footer={
<Space>
<Button onClick={onSubmit} type="primary" >
确定
</Button>
</Space>
}
> >
<Form form={form} labelCol={{ span: 7 }} style={{ height: '33rem', overflowY: 'scroll' }}> <Form form={form} labelCol={{ span: 7 }} style={{overflowY: 'scroll' }}>
<Row> <Row>
<Col span={23}> <Col span={23}>
<Item <Item
...@@ -502,21 +504,9 @@ const AddModal = props => { ...@@ -502,21 +504,9 @@ const AddModal = props => {
</Col> </Col>
</Row> </Row>
</Form> </Form>
{/* <ChangeAdd
visible={isVisible}
onCancel={() => setIsVisible(false)}
callBackSubmit={onOK}
newCheckedList={checkedList1}
isType={types}
filed={filed}
filed1={filed1}
ff={ff}
pickItem={pickItem}
characterValue={characterValue}
/> */}
<ChangeAdd <ChangeAdd
visible={isVisible} visible={isVisible}
onClose={() => setIsVisible(false)} onCancel={() => setIsVisible(false)}
callBackSubmit={onOK} callBackSubmit={onOK}
newCheckedList={checkedList1} newCheckedList={checkedList1}
isType={types} isType={types}
...@@ -525,9 +515,8 @@ const AddModal = props => { ...@@ -525,9 +515,8 @@ const AddModal = props => {
ff={ff} ff={ff}
pickItem={pickItem} pickItem={pickItem}
characterValue={characterValue} characterValue={characterValue}
placement="right"
/> />
</Modal> </Drawer>
) )
}; };
export default AddModal export default AddModal
\ No newline at end of file
import React, { useState, useEffect, PureComponent } from 'react'; import React, { useState, useEffect, PureComponent } from 'react';
import {Drawer, Divider, Checkbox, Space, Button} from 'antd'; import { Modal, Divider, Checkbox, Space, Button } from 'antd';
import styles from './maintenance.less' import styles from './maintenance.less'
const CheckboxGroup = Checkbox.Group; const CheckboxGroup = Checkbox.Group;
...@@ -96,20 +96,19 @@ const ChangeAdd = props => { ...@@ -96,20 +96,19 @@ const ChangeAdd = props => {
if (isType != 'app') { if (isType != 'app') {
return ( return (
<div className={styles.ChangeAddContainer}> <div className={styles.ChangeAddContainer}>
<Drawer <Modal
title="反馈名称" title="反馈名称"
bodyStyle={{ width: '100%', minHeight: '100px' }} bodyStyle={{ width: '100%', minHeight: '100px' }}
style={{ top: '10px' }} style={{ top: '10px' }}
width="450px" width="450px"
destroyOnClose destroyOnClose
centered={true}
cancelText="取消"
okText="确认"
{...props} {...props}
footer={ onOk={() => onSubmit()}
<Space> forceRender={true}
<Button onClick={onSubmit} type="primary"> getContainer={false}
确定
</Button>
</Space>
}
> >
{visible && ( {visible && (
<div className={styles.listCard}> <div className={styles.listCard}>
...@@ -133,25 +132,24 @@ const ChangeAdd = props => { ...@@ -133,25 +132,24 @@ const ChangeAdd = props => {
</div> </div>
) )
} }
</Drawer> </Modal>
</div> </div>
); );
} else if (isType === 'app') { } else if (isType === 'app') {
return ( return (
<Drawer <Modal
title="角色" title="角色"
bodyStyle={{ width: '100%', minHeight: '100px' }} bodyStyle={{ width: '100%', minHeight: '100px' }}
style={{ top: '10px' }} style={{ top: '10px' }}
width="450px" width="450px"
destroyOnClose destroyOnClose
centered={true}
cancelText="取消"
okText="确认"
{...props} {...props}
footer={ onOk={() => onSubmit()}
<Space> forceRender={true}
<Button onClick={onSubmit} type="primary"> getContainer={false}
确定
</Button>
</Space>
}
> >
{visible && ( {visible && (
<div className={styles.listCard}> <div className={styles.listCard}>
...@@ -165,7 +163,7 @@ const ChangeAdd = props => { ...@@ -165,7 +163,7 @@ const ChangeAdd = props => {
</div> </div>
) )
} }
</Drawer> </Modal>
); );
} }
}; };
......
...@@ -220,9 +220,10 @@ const maintenance = () => { ...@@ -220,9 +220,10 @@ const maintenance = () => {
<AddModal <AddModal
visible={addVisible} visible={addVisible}
type={type} type={type}
onCancel={() => setAddVisible(false)} onClose={() => setAddVisible(false)}
callBackSubmit={onSubmit} callBackSubmit={onSubmit}
formObj={formObj} formObj={formObj}
placement="right"
/> />
</div> </div>
</div> </div>
......
...@@ -63,8 +63,8 @@ ...@@ -63,8 +63,8 @@
padding: 0.5rem; padding: 0.5rem;
} }
.cardContent{ .cardContent{
// height: 30rem; height: 30rem;
// overflow-y: scroll; overflow-y: scroll;
width: 100%; width: 100%;
} }
.cardItemData{ .cardItemData{
...@@ -82,3 +82,6 @@ ...@@ -82,3 +82,6 @@
.ant-modal-footer { .ant-modal-footer {
padding: 0px 48px 10px 40px; padding: 0px 48px 10px 40px;
} }
.ant-table-pagination.ant-pagination {
margin: 5px 0;
}
...@@ -13,7 +13,7 @@ import { ...@@ -13,7 +13,7 @@ import {
Tooltip, Tooltip,
Badge, Spac Badge, Spac
} from 'antd'; } from 'antd';
import { EditOutlined, DeleteOutlined, FontColorsOutlined, PlusSquareOutlined, SortDescendingOutlined ,PlusOutlined,BorderInnerOutlined } from '@ant-design/icons'; import { EditOutlined, DeleteOutlined, FontColorsOutlined, PlusSquareOutlined, SortDescendingOutlined, PlusOutlined, BorderInnerOutlined } from '@ant-design/icons';
import PageContainer from '@/components/BasePageContainer'; import PageContainer from '@/components/BasePageContainer';
import { CM_Table_LoadTable, removeTable, loadUnattachedTables } from '@/services/platform/bs' import { CM_Table_LoadTable, removeTable, loadUnattachedTables } from '@/services/platform/bs'
import styles from './index.less' import styles from './index.less'
...@@ -191,8 +191,10 @@ const TableManager = (props) => { ...@@ -191,8 +191,10 @@ const TableManager = (props) => {
} }
return tempObj return tempObj
} }
const setRowClassName = record => // const setRowClassName = record => {
Object.entries(record).toString() === Object.entries(selectTableName).toString() ? styles.clickRowStyle : ''; // Object.entries(record).toString() === Object.entries(selectTableName).toString() ? styles.clickRowStyle : '';
// }
const expandedRowRender = (item) => { const expandedRowRender = (item) => {
const columns1 = [ const columns1 = [
{ {
...@@ -228,7 +230,7 @@ const TableManager = (props) => { ...@@ -228,7 +230,7 @@ const TableManager = (props) => {
align: 'center', align: 'center',
render: text => { render: text => {
return (<div className={classnames({ return (<div className={classnames({
[styles.lack]:text!=='(无)' , [styles.lack]: text !== '(无)',
})} >{text}</div>) })} >{text}</div>)
} }
}, },
...@@ -309,7 +311,7 @@ const TableManager = (props) => { ...@@ -309,7 +311,7 @@ const TableManager = (props) => {
}, // 点击行 }, // 点击行
} }
}} }}
rowClassName={setRowClassName} // rowClassName={setRowClassName}
showHeader={false} dataSource={allData[item.type]} pagination={false} />; showHeader={false} dataSource={allData[item.type]} pagination={false} />;
}; };
...@@ -317,7 +319,7 @@ const TableManager = (props) => { ...@@ -317,7 +319,7 @@ const TableManager = (props) => {
{ {
title: '名称', dataIndex: 'type', key: 'type', title: '名称', dataIndex: 'type', key: 'type',
render: text => { render: text => {
return (<a style={{ fontWeight:'bold' }}>{text}({allData && allData[text] ? allData[text].length : 0}个)</a>) return (<a style={{ fontWeight: 'bold' }}>{text}({allData && allData[text] ? allData[text].length : 0}个)</a>)
}, },
width: 260, width: 260,
}, },
...@@ -398,8 +400,8 @@ const TableManager = (props) => { ...@@ -398,8 +400,8 @@ const TableManager = (props) => {
/> />
</div> </div>
<Button type="primary" style={{ marginLeft: "10px" }} icon={<BorderInnerOutlined />} onClick={AddTable}>建表</Button> <Button type="primary" style={{ marginLeft: "10px" }} icon={<BorderInnerOutlined />} onClick={AddTable}>建表</Button>
<Button type="primary" style={{ marginLeft: "10px" }} icon={<PlusOutlined />} onClick={AffiliateAddTable}>附加表</Button> <Button type="primary" style={{ marginLeft: "10px" }} icon={<PlusOutlined />} onClick={AffiliateAddTable}>附加表</Button>
</div> </div>
<div style={{ width: '100vm', height: 'calc(100vh - 150px) ', background: '#ffffff' }}> <div style={{ width: '100vm', height: 'calc(100vh - 150px) ', background: '#ffffff' }}>
......
...@@ -293,8 +293,18 @@ const incident = () => { ...@@ -293,8 +293,18 @@ const incident = () => {
let arrr = formateArrDataA(zz, 'businessType') let arrr = formateArrDataA(zz, 'businessType')
console.log(arrr) console.log(arrr)
setTableData(arrr) setTableData(arrr)
setPickItem(newArr[rember]) if(history.location.state){
setRember1(newArr[0]) console.log(history)
console.log(history.location.state.rember)
setPickItem(newArr[history.location.state.rember])
setRember(history.location.state.rember)
setRember1(newArr[history.location.state.rember])
}else{
setPickItem(newArr[rember])
setRember1(newArr[0])
}
console.log(rember)
console.log(newArr[rember])
console.log(newArr, 'newArr'); console.log(newArr, 'newArr');
setTreeData(newArr) setTreeData(newArr)
} }
...@@ -396,7 +406,7 @@ const incident = () => { ...@@ -396,7 +406,7 @@ const incident = () => {
const process1 = record =>{ const process1 = record =>{
history.push({ history.push({
pathname: '/platformCenter/bsmanger/incidentFlow', pathname: '/platformCenter/bsmanger/incidentFlow',
state: { formObj:record, title1:record.name }, state: { formObj:record, title1:record.name, rember },
}); });
} }
// const auxiliaryView = record => { // const auxiliaryView = record => {
...@@ -407,7 +417,7 @@ const incident = () => { ...@@ -407,7 +417,7 @@ const incident = () => {
const auxiliaryView1 = record => { const auxiliaryView1 = record => {
history.push({ history.push({
pathname: '/platformCenter/bsmanger/incidentView', pathname: '/platformCenter/bsmanger/incidentView',
state: { formObj:record, title2:record.name }, state: { formObj:record, title2:record.name, rember },
}); });
} }
const onSubmit = () => { const onSubmit = () => {
...@@ -514,7 +524,6 @@ const incident = () => { ...@@ -514,7 +524,6 @@ const incident = () => {
</div> </div>
<Table <Table
// rowClassName={setRowClassName}
size="small" size="small"
rowKey='ID' rowKey='ID'
bordered bordered
......
...@@ -234,12 +234,13 @@ ...@@ -234,12 +234,13 @@
} }
.btn{ .btn{
display: flex; display: flex;
justify-content: space-around; justify-content: flex-end;
width: 20rem; width: 20rem;
} }
.ant-btn{ .ant-btn{
display: flex; display: flex;
align-items: center; align-items: center;
margin-left: 20px;
} }
} }
.containerBox { .containerBox {
......
...@@ -96,10 +96,10 @@ const incidentFlow = (props) => { ...@@ -96,10 +96,10 @@ const incidentFlow = (props) => {
setAddVisible(true) setAddVisible(true)
} }
const back = () => { const back = () => {
let formObj = props.location.state.formObj; let rember = props.location.state.rember;
history.push({ history.push({
pathname: '/platformCenter/bsmanger/incident', pathname: '/platformCenter/bsmanger/incident',
state: { formObj }, state: { rember },
}); });
}; };
const deleteEventType = record => { const deleteEventType = record => {
......
...@@ -207,10 +207,10 @@ const incidentView = props => { ...@@ -207,10 +207,10 @@ const incidentView = props => {
setFlag(flag+1) setFlag(flag+1)
} }
const back = () => { const back = () => {
let formObj = props.location.state.formObj; let rember = props.location.state.rember;
history.push({ history.push({
pathname: '/platformCenter/bsmanger/incident', pathname: '/platformCenter/bsmanger/incident',
state: { formObj }, state: { rember },
}); });
}; };
return( return(
...@@ -243,7 +243,7 @@ const incidentView = props => { ...@@ -243,7 +243,7 @@ const incidentView = props => {
}; };
}} }}
columns={columns} columns={columns}
style={{ height: '15rem', overflowY: 'scroll', marginLeft: '25px', marginRight: '25px' }} style={{overflowY: 'scroll'}}
dataSource={tableData} dataSource={tableData}
pagination={false} pagination={false}
scroll={{ x: 'max-content'}} scroll={{ x: 'max-content'}}
......
...@@ -279,6 +279,7 @@ const AddModal = props => { ...@@ -279,6 +279,7 @@ const AddModal = props => {
}, },
]; ];
useEffect(() => { useEffect(() => {
console.log(props)
if (props.match.params.id) { if (props.match.params.id) {
setFormObj(props.match.params.id); setFormObj(props.match.params.id);
setTreeLoading(true); setTreeLoading(true);
...@@ -377,13 +378,13 @@ const AddModal = props => { ...@@ -377,13 +378,13 @@ const AddModal = props => {
}; };
//附加 //附加
const add = record => { const add = record => {
setPramFormObj(props.history.location.state.template); setPramFormObj(props.location.state.template);
setType('affiliateAdd'); setType('affiliateAdd');
setVisible(true); setVisible(true);
}; };
//分组与排序 //分组与排序
const sort = record => { const sort = record => {
setPramFormObj(props.history.location.state.template); setPramFormObj(props.location.state.template);
setType('sort'); setType('sort');
setVisible(true); setVisible(true);
}; };
......
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