Skip to content

C
CivManage
Commit 99f2f0ee authored by 皮倩雯's avatar 皮倩雯
Browse files
Options

修改多级模态

parent d5c89a6b
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 189 additions and 152 deletions
package.json
View file @ 99f2f0ee
......@@ -98,6 +98,7 @@
"connected-react-router": "6.4.0",
"copy-webpack-plugin": "5.0.0",
"cross-env": "5.0.0",
"dragm": "^0.0.5",
"express": "4.16.4",
"fontfaceobserver": "2.1.0",
"gojs": "^2.1.37",
......
src/pages/platformCenter/bsmanager/maintenance/AddModal.jsx
View file @ 99f2f0ee
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 styles from './maintenance.less'
import ModalDrag from './ModalDrag';
import { CM_XWBPlan_AccountTable, CM_XWBPlan_feedbackTable, CM_XWBPlan_DataEditORAdd, CM_XWBPlan_DataList } from '@/services/maintenance/api'
import { CM_Event_LoadDepartmentAndRoles } from '@/services/standingBook/api'
import { PlusOutlined, DownOutlined } from '@ant-design/icons'
import { PlusOutlined, DownOutlined, StepForwardFilled } from '@ant-design/icons'
import ChangeAdd from './ChangeAdd'
const { Option } = Select;
......@@ -23,6 +24,7 @@ const AddModal = props => {
const [pickItem, setPickItem] = useState('')//复选框数据填入项
const [checkedList1, setCheckedList1] = useState([])//最新选择数据
const [characterValue, setCharacterValue] = useState('')//打开弹框之前数据
const [ff, setFf] = useState([])
const [form] = Form.useForm();
const { Item } = Form;
......@@ -151,6 +153,10 @@ const AddModal = props => {
CM_Event_LoadDepartmentAndRoles().then(res => {
if (res.msg === 'Ok') {
setFiled1(formateArrDataA1(res.data, 'groupType'))
console.log(filed1)
console.log(filed1['角色'])
setFf(filed1['角色'])
console.log(ff)
console.log(res.data)
}
......@@ -241,54 +247,20 @@ const AddModal = props => {
setSelectValue1(value)
}
const onOK = prop => {
console.log(prop.isType)
if (prop.isType == "app") {
let title = prop.title
let selectData = prop.stt
console.log(prop.stt)
let ff = prop.filed22
let aa = []
let bb = 0
title.map((item, index) => {
console.log(ff[item])
aa = []
selectData.map((item1, index1) => {
console.log(item1)
if (ff[item].indexOf(item1) != -1) {
aa.push(item1)
}
})
console.log(aa)
if (aa.length == 0) {
bb = 1
}
})
console.log(aa)
if (bb == 1) {
notification.error({
message: '提示',
description: '权限角色部门必须都选至少一项',
});
} else {
setIsVisible(false)
let inputText = { ...inputValue }
inputText[prop.pickItem] = prop.str
setCheckedList1(prop.checkedList)
setInputValue(inputText)
}
} else {
console.log(prop.isType)
setIsVisible(false)
let inputText = { ...inputValue }
inputText[prop.pickItem] = prop.str
setCheckedList1(prop.checkedList)
setInputValue(inputText)
}
}
const title = <ModalDrag title="巡维保计划配置" />
return (
<Modal
title='巡维保计划配置'
title={title}
visible={visible}
maskClosable={false}
mask={false}
destroyOnClose
width="800px"
destroyOnClose
......@@ -530,7 +502,7 @@ const AddModal = props => {
</Col>
</Row>
</Form>
<ChangeAdd
{/* <ChangeAdd
visible={isVisible}
onCancel={() => setIsVisible(false)}
callBackSubmit={onOK}
......@@ -538,8 +510,22 @@ const AddModal = props => {
isType={types}
filed={filed}
filed1={filed1}
ff={ff}
pickItem={pickItem}
characterValue={characterValue}
/> */}
<ChangeAdd
visible={isVisible}
onClose={() => setIsVisible(false)}
callBackSubmit={onOK}
newCheckedList={checkedList1}
isType={types}
filed={filed}
filed1={filed1}
ff={ff}
pickItem={pickItem}
characterValue={characterValue}
placement="right"
/>
</Modal>
)
......
src/pages/platformCenter/bsmanager/maintenance/ChangeAdd.less
View file @ 99f2f0ee
......@@ -58,11 +58,8 @@
}
.listCard{
display: flex;
.cardItem{
padding: 0.5rem;
}
.cardContent{
height: 30rem;
overflow-y: scroll;
width: 100%;
}
......@@ -72,3 +69,9 @@
margin-bottom: 1rem;
}
}
.ant-modal-body {
padding: 0px;
}
.ant-modal-footer {
padding: 28px 40px;
}
\ No newline at end of file
src/pages/platformCenter/bsmanager/maintenance/ModalDrag.js 0 → 100644
View file @ 99f2f0ee
/*
* @Description:
* @Author: leizhe
* @Date: 2021-10-09 15:08:18
* @LastEditTime: 2021-10-11 10:21:35
* @LastEditors: leizhe
*/
import React, {PureComponent } from "react";
import DragM from "dragm";
export default class ModalDrag extends PureComponent {
updateTransform = transformStr =>{
this.modalDom.style.transform = transformStr;
};
componentDidMount(){
this.modalDom = document.getElementsByClassName("ant-modal-wrap")[0]
}
render(){
const {title} = this.props;
return (
<DragM updateTransform={this.updateTransform}>
<div>{title}</div>
</DragM>
)
}
}
\ No newline at end of file
src/pages/platformCenter/bsmanager/maintenance/maintenance.jsx
View file @ 99f2f0ee
......@@ -168,10 +168,7 @@ const maintenance = () => {
duration: 3,
description: '删除成功',
});
console.log(111)
setFlag(flag + 1)
console.log(222)
console.log(flag)
} else {
notification.error({
message: '提示',
......@@ -209,7 +206,7 @@ const maintenance = () => {
}}
columns={columns}
dataSource={tableData}
scroll={{ y: 'calc(100vh - 155px)' }}
scroll={{ y: 'calc(100vh - 215px)' }}
pagination={{
showTotal: (total, range) =>
`第${range[0]}-${range[1]} 条/共 ${total} 条`,
......
src/pages/platformCenter/bsmanager/maintenance/maintenance.less
View file @ 99f2f0ee
......@@ -5,6 +5,7 @@
.pickItem{
background-color: #F5F6F9;
}
}
.formData{
height: 38rem;
......@@ -68,20 +69,16 @@
}
.cardItemData{
display:inline-block;
padding: 1rem;
border: 1px solid #b5b8c8;
margin-bottom: 1rem;
width:30.5%;
margin-right:15px;
margin-left:17px;
height: 30rem;
overflow-y: scroll;
}
.cardItemData1{
padding: 1rem;
padding: 0.5rem;
border: 1px solid #b5b8c8;
margin-bottom: 1rem;
height: 30rem;
width:100%;
// height: 30rem;
overflow-y: scroll;
}
}
.ant-modal-body {
padding: 10px 24px 0px 24px;
}
.ant-modal-footer {
padding: 0px 48px 10px 40px;
}
src/pages/platformCenter/bsmanager/workOrder/AddFlowsModal.jsx
View file @ 99f2f0ee
import React, { useState, useEffect } from 'react';
import { Modal, Form, Input, notification, message, Row, Col, Select, Checkbox, Radio, Button } from 'antd';
import { Modal, Form, Input, notification, message, Row, Col, Select, Drawer, Space, Button } from 'antd';
import { PlusOutlined } from '@ant-design/icons';
import ChangeAddFlows from './ChangeAddFlows'
import { CM_Event_ReloadFlows, CM_Event_LoadDepartmentAndRoles, CM_Event_AddEvenFlow, CM_Event_EditEvenFlow } from '@/services/standingBook/api';
......@@ -7,7 +7,7 @@ import styles from './incident.less';
const { Option } = Select;
const AddFlowsModal = props => {
const { callBackSubmit = () => { }, type, visible, onCancel, formObj, obj, maxLength, record } = props;
const { callBackSubmit = () => { }, type, visible, onClose, formObj, obj, maxLength, record } = props;
const [form] = Form.useForm();
const { Item } = Form;
......@@ -161,7 +161,6 @@ const AddFlowsModal = props => {
callBackSubmit();
// setLoading(true);
let aa = form.getFieldsValue().FlowName
console.log(aa)
console.log(inputValue)
console.log(strr)
......@@ -171,7 +170,7 @@ const AddFlowsModal = props => {
CM_Event_AddEvenFlow({
eventTypeId: formObj.ID,
flowName: aa,
roles: strr,
roles: inputValue.Roles,
order: maxLength,
})
.then(res => {
......@@ -205,7 +204,7 @@ const AddFlowsModal = props => {
CM_Event_EditEvenFlow({
eventTypeId: formObj.ID,
eventFlowId: record.ID,
roles: strr
roles: inputValue.Roles
})
.then(res => {
// setLoading(false);
......@@ -300,14 +299,19 @@ const AddFlowsModal = props => {
}
return (
<Modal
<Drawer
title={type === 'add' ? '添加受理流程' : '编辑受理流程'}
visible={visible}
onCancel={onCancel}
width='800px'
onOk={onSumbit}
okText="确认"
cancelText="取消"
onClose={onClose}
destroyOnClose
footer={
<Space>
<Button onClick={onSumbit} type="primary">
确定
</Button>
</Space>
}
>
<Form form={form} labelCol={{ span: 7 }} style={{ height: '8rem', overflowY: 'scroll' }}>
<Row>
......@@ -361,15 +365,16 @@ const AddFlowsModal = props => {
</Form>
<ChangeAddFlows
visible={visible1}
onCancel={() => setVisible1(false)}
onClose={() => setVisible1(false)}
callBackSubmit={onOKk}
newCheckedList={checkedList1}
filed1={filed1}
pickItem={pickItem}
characterValue={characterValue}
formObj={formObj}
placement="right"
/>
</Modal>
</Drawer>
)
}
export default AddFlowsModal
\ No newline at end of file
src/pages/platformCenter/bsmanager/workOrder/AddModal.jsx
View file @ 99f2f0ee
......@@ -4,6 +4,7 @@ import { GetCM_Event_LoadEventTypeTable, LoadEventFields, CM_Event_LoadDepartmen
import styles from './incident.less';
import ChangeAdd from './changeAdd'
import ChangeImage from './ChangeImage'
import ModalDrag from '../maintenance/ModalDrag';
import { PlusOutlined, DownOutlined } from '@ant-design/icons'
import { set } from 'immutable';
import { getRoleGroup } from '@/services/userCenter/roleManage/api';
......@@ -581,13 +582,15 @@ const AddModal = props => {
setIsVisible1(false)
}
const title = <ModalDrag title={type === 'add' ? '添加事件类型' : '编辑事件类型'} />
return (
<Modal
title={type === 'add' ? '添加事件类型' : '编辑事件类型'}
title={title}
maskClosable={false}
width="800px"
destroyOnClose
okText="确认"
mask={false}
cancelText="取消"
{...props}
onOk={() => onSubmit()}
......@@ -961,18 +964,19 @@ const AddModal = props => {
</Col>
</Row>
</Form>
<ChangeAdd
visible={isVisible}
onCancel={onCancel}
callBackSubmit={onOK}
newCheckedList={checkedList1}
isType={types}
filed={filed}
flag={flag}
filed1={filed1}
pickItem={pickItem}
characterValue={characterValue}
formObj={formObj}
<ChangeAdd
visible={isVisible}
onClose={onCancel}
callBackSubmit={onOK}
newCheckedList={checkedList1}
isType={types}
filed={filed}
flag={flag}
filed1={filed1}
pickItem={pickItem}
characterValue={characterValue}
formObj={formObj}
placement="right"
/>
<ChangeImage
visible={isVisible1}
......
src/pages/platformCenter/bsmanager/workOrder/AddViewModal.jsx
View file @ 99f2f0ee
import React, { useEffect, useState } from 'react';
import { Modal, Form, Input, notification, Row, Col} from 'antd';
import { Drawer, Form, Input, notification, Row, Col, Button, Space} from 'antd';
import { CM_Event_OperateEventExtendPage, GetEventExtendPage} from '@/services/standingBook/api';
import { IdcardTwoTone } from '@ant-design/icons';
const AddViewModal = props => {
const { callBackSubmit = () => { }, visible, onCancel, maxLength, title2, obj, type } = props;
const { callBackSubmit = () => { }, visible, onClose, maxLength, title2, obj, type } = props;
const [id, setId]= useState('')
const [form] = Form.useForm();
......@@ -89,12 +89,18 @@ const AddViewModal = props => {
}
}, [visible])
return (
<Modal
<Drawer
visible={visible}
onCancel={onCancel}
onClose={onClose}
width="500px"
title={type=='edit' ? '编辑事件辅助视图配置':'添加事件辅助视图配置'}
onOk={() => onSubmit()}
footer={
<Space>
<Button onClick={onSubmit} type="primary" >
确定
</Button>
</Space>
}
>
<Form form={form} labelCol={{ span: 7 }} style={{ height: '24rem', overflowY: 'scroll' }}>
<Row>
......@@ -161,7 +167,7 @@ const AddViewModal = props => {
</Row>
</Form>
</Modal>
</Drawer>
)
}
export default AddViewModal;
\ No newline at end of file
src/pages/platformCenter/bsmanager/workOrder/ChangeAddFlows.jsx
View file @ 99f2f0ee
import React, { useState, useEffect, useCallback, useRef } from 'react';
import { Form, Modal, Space, Divider, Radio, Checkbox } from 'antd';
import { Form, Drawer, Space, Divider, Radio, Checkbox, Button } from 'antd';
import styles from './incident.less';
import Sortable from 'sortablejs';
......@@ -112,21 +112,19 @@ const ChangeAddFlows = props =>{
return (
<Modal
<Drawer
title='部门或角色'
bodyStyle={{ width: '100%', minHeight: '100px' }}
style={{ top: '10px' }}
width="700px"
destroyOnClose
centered={true}
maskClosable={false}
onOk={onSubmit}
okText="确认"
cancelText="取消"
{...props}
onOk={() => onSubmit()}
forceRender={true}
getContainer={false}
footer={
<Space>
<Button onClick={onSubmit} type="primary" >
确定
</Button>
</Space>
}
>
{visible && (
<div className={styles.listCard}>
......@@ -169,7 +167,7 @@ const ChangeAddFlows = props =>{
)
}
</Modal>
</Drawer>
)
};
......
src/pages/platformCenter/bsmanager/workOrder/ProcessModal.jsx
View file @ 99f2f0ee
......@@ -25,15 +25,15 @@ const ProcessModal = props => {
key: 'FlowName',
width: 150,
ellipsis: true,
render: item => (
<div
ref={r => {
if (r) {
r.innerHTML = item;
}
}}
/>
)
// render: item => (
// <div
// ref={r => {
// if (r) {
// r.innerHTML = item;
// }
// }}
// />
// )
}
,
{
......@@ -42,15 +42,15 @@ const ProcessModal = props => {
key: 'FlowRoles',
width: 400,
ellipsis: true,
render: item => (
<div
ref={r => {
if (r) {
r.innerHTML = item;
}
}}
/>
)
// render: item => (
// <div
// ref={r => {
// if (r) {
// r.innerHTML = item;
// }
// }}
// />
// )
},
{
title: () => (<span style={{fontWeight:'bold'}}>操作</span>),
......@@ -180,8 +180,9 @@ const ProcessModal = props => {
type={isType}
record={record1}
maxLength={maxLength}
onCancel={() => setAddVisible(false)}
onClose={() => setAddVisible(false)}
callBackSubmit={onOK}
placement="right"
/>
</Modal>
)
......
src/pages/platformCenter/bsmanager/workOrder/ViewModal.jsx
View file @ 99f2f0ee
......@@ -238,11 +238,12 @@ const ViewModal = props => {
<AddViewModal
visible={addViewVisible}
title="事件辅助视图配置"
onCancel={()=>setAddViewVisible(false)}
onClose={()=>setAddViewVisible(false)}
title2={title2}
callBackSubmit={okk}
obj={obj}
type={type}
placement="right"
/>
</Modal>
)
......
src/pages/platformCenter/bsmanager/workOrder/changeAdd.jsx
View file @ 99f2f0ee
import React, { useState, useEffect, useCallback, useRef } from 'react';
import { Form, Modal, Space, Divider, Radio, Checkbox, notification } from 'antd';
import { Form, Drawer, Space, Divider, Checkbox, Button } from 'antd';
import styles from './incident.less';
import Sortable from 'sortablejs';
......@@ -143,20 +143,20 @@ const AddModal = props => {
}
if (isType != 'app') {
return (
<Modal
<Drawer
title='字段集选择'
bodyStyle={{ width: '100%', minHeight: '100px' }}
style={{ top: '10px' }}
width="700px"
destroyOnClose
centered={true}
maskClosable={false}
onOk={onSubmit}
okText="确认"
cancelText="取消"
{...props}
forceRender={true}
getContainer={false}
destroyOnClose
{...props}
footer={
<Space>
<Button onClick={onSubmit} type="primary">
确定
</Button>
</Space>
}
>
{visible && (
<div className={styles.listCard}>
......@@ -222,24 +222,24 @@ const AddModal = props => {
)
}
</Modal>
</Drawer>
);
} else if (isType === 'app') {
return (
<Modal
<Drawer
title= '部门或角色'
bodyStyle={{ width: '100%', minHeight: '100px' }}
style={{ top: '10px' }}
width="700px"
destroyOnClose
centered={true}
maskClosable={false}
onOk={onSubmit}
okText="确认"
cancelText="取消"
{...props}
forceRender={true}
getContainer={false}
destroyOnClose
{...props}
footer={
<Space>
<Button onClick={onSubmit} type="primary" >
确定
</Button>
</Space>
}
>
{visible && (
<div className={styles.listCard}>
......@@ -282,7 +282,7 @@ const AddModal = props => {
)
}
</Modal>
</Drawer>
);
}
};
......
src/pages/platformCenter/bsmanager/workOrder/incident.less
View file @ 99f2f0ee
......@@ -184,7 +184,7 @@
padding: 0.5rem;
}
.cardContent{
height: 30rem;
// height: 30rem;
overflow-y: scroll;
width: 19rem;
}
......@@ -214,4 +214,11 @@
}
}
}
}
\ No newline at end of file
}
.ant-checkbox-group-item {
width: 260px;
}
.ant-drawer-footer {
display:flex;
justify-content: flex-end;
}
\ No newline at end of file
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