Skip to content

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

修改多级模态

parent d5c89a6b
Hide whitespace changes
Inline Side-by-side
Showing with 355 additions and 363 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.jsx
View file @ 99f2f0ee
import React, { useState, useEffect } from 'react';
import { Modal, Divider, Checkbox } from 'antd';
import React, { useState, useEffect, PureComponent } from 'react';
import {Drawer, Divider, Checkbox, Space, Button} from 'antd';
import styles from './maintenance.less'
const CheckboxGroup = Checkbox.Group;
const ChangeAdd = props => {
const { callBackSubmit = () => { }, isType, visible, newCheckedList, filed1, filed, pickItem, characterValue } = props;
const [title, setTitle] = useState([])//分组名
const { callBackSubmit = () => { }, isType, visible, newCheckedList, filed1, filed, pickItem, characterValue, ff } = props;
const [checkedList, setCheckedList] = useState([]);//选中的复选框内容
const [indeterminate, setIndeterminate] = useState([]);//全选样式控制
const [checkAll, setCheckAll] = useState([]);//全选
const [indeterminate, setIndeterminate] = useState(true);//全选样式控制
const [checkAll, setCheckAll] = useState(false);//全选
const [selectData, setSelectData] = useState([])//选中复选框的值集合
let objArr = []
const onChangeList = (list) => {
let arr= []
list.map((item, index)=>{
let arr = []
list.map((item, index) => {
arr.push(item)
})
console.log(list)
console.log(arr)
setCheckedList(arr)
// const checkedListArr = [...checkedList]
// checkedListArr[index] = list
// setCheckedList(checkedListArr);
// const indeterminateArr = [...indeterminate]
// const checkAllArr = [...checkAll]
// indeterminateArr[index] = !!list.length && list.length < filed[title].length
// checkAllArr[index] = list.length === filed[title].length
// setIndeterminate(indeterminateArr)
// setCheckAll(checkAllArr);
setIndeterminate(!!list.length && list.length < filed.length)
setCheckAll(list.length === filed.length)
};
const onChangeList1 = (list, index, title) => {
const checkedListArr = [...checkedList]
checkedListArr[index] = list
setCheckedList(checkedListArr);
console.log(checkedListArr)
const indeterminateArr = [...indeterminate]
const checkAllArr = [...checkAll]
indeterminateArr[index] = !!list.length && list.length < filed1[title].length
checkAllArr[index] = list.length === filed1[title].length
setIndeterminate(indeterminateArr)
setCheckAll(checkAllArr);
const onChangeList1 = (list) => {
let arr = []
list.map((item, index) => {
arr.push(item)
})
console.log(list)
console.log(arr)
setCheckedList(arr)
setIndeterminate(!!list.length && list.length < ff.length)
setCheckAll(list.length === ff.length)
};
const onSubmit = () => {
isType === 'rule' ? callBackSubmit(`${value === '无' || value === '' ? '' : value + ','}${checkValue.join(',')}`) : callBackSubmit({ checkedList, str: selectData.join(","), pickItem, stt:selectData, title:title, filed22:filed1, isType:isType });
isType === 'rule' ? callBackSubmit(`${value === '无' || value === '' ? '' : value + ','}${checkValue.join(',')}`) : callBackSubmit({ checkedList, str: selectData.join(","), pickItem, stt: selectData, filed22: filed1, isType: isType });
}
const onCheckAllChange = e => {
const indeterminateArr = [...indeterminate]
const checkAllArr = [...checkAll]
const checkedListArr = [...checkedList]
checkAllArr[e.target.index] = e.target.checked
indeterminateArr[e.target.index] = false
e.target.checked ? checkedListArr[e.target.index] = e.target.checkvalue : checkedListArr[e.target.index] = []
setCheckedList(checkedListArr);
setIndeterminate(indeterminateArr);
setCheckAll(checkAllArr);
setCheckedList(e.target.checked ? filed : [])
setIndeterminate(false)
setCheckAll(e.target.checked)
};
const onCheckAllChange1 = e => {
setCheckedList(e.target.checked ? ff : [])
setIndeterminate(false)
setCheckAll(e.target.checked)
}
useEffect(() => {
selectAll()
}, [checkedList]);
......@@ -72,134 +62,110 @@ const ChangeAdd = props => {
}
useEffect(() => {
console.log(indeterminate)
if (isType != '' && isType === 'add') {
// console.log(filed)
// let arr = Object.keys(filed)
// console.log(arr, 'arr')
// setTitle(arr)
let checkArr = []
// let indeterminateArr = []
// let checkAllArr = []
console.log(newCheckedList);
// arr.map((item, index) => {
// checkArr[index] = []
newCheckedList.map(checkItem => {
if (filed.includes(checkItem)) {
checkArr.push(checkItem)
}
// })
// indeterminateArr.push(!!checkArr[index].length && checkArr[index].length < filed[item].length)
// checkAllArr.push(checkArr[index].length === filed[item].length)
newCheckedList.map(checkItem => {
if (filed.includes(checkItem)) {
checkArr.push(checkItem)
}
})
setCheckedList(checkArr)
// setIndeterminate(indeterminateArr)
// setCheckAll(checkAllArr)
setIndeterminate(!!newCheckedList.length && newCheckedList.length < filed.length)
setCheckAll(newCheckedList.length === filed.length)
let newArr = characterValue.length ? characterValue.split(",") : []
setSelectData(newArr)
} else if (isType === 'app') {
console.log(filed1)
let arr = Object.keys(filed1)
console.log(arr, 'arr')
setTitle(arr)
let checkArr = []
let indeterminateArr = []
let checkAllArr = []
console.log(newCheckedList);
console.log(characterValue)
arr.map((item, index) => {
checkArr[index] = []
newCheckedList.map(checkItem => {
if (filed1[item].includes(checkItem)) {
checkArr[index].push(checkItem)
}
})
indeterminateArr.push(!!checkArr[index].length && checkArr[index].length < filed1[item].length)
checkAllArr.push(checkArr[index].length === filed1[item].length)
newCheckedList.map(checkItem => {
if (ff.includes(checkItem)) {
checkArr.push(checkItem)
}
})
setCheckedList(checkArr)
setIndeterminate(indeterminateArr)
setCheckAll(checkAllArr)
setCheckedList(checkArr)
setIndeterminate(!!newCheckedList.length && newCheckedList.length < ff.length)
setCheckAll(newCheckedList.length === ff.length)
let newArr = characterValue.length ? characterValue.split(",") : []
setSelectData(newArr)
}
}, [visible]);
if (isType != 'app') {
return (
<div className={styles.ChangeAddContainer}>
<Modal
title='反馈名称'
bodyStyle={{ width: '100%', minHeight: '100px' }}
style={{ top: '10px' }}
width="500px"
destroyOnClose
centered={true}
maskClosable={false}
onOk={onSubmit}
okText="确认"
cancelText="取消"
{...props}
forceRender={true}
getContainer={false}
>
{visible && (
<div className={styles.listCard}>
<div className={styles.cardItem}>
<Drawer
title="反馈名称"
bodyStyle={{ width: '100%', minHeight: '100px' }}
style={{ top: '10px' }}
width="450px"
destroyOnClose
{...props}
footer={
<Space>
<Button onClick={onSubmit} type="primary">
确定
</Button>
</Space>
}
>
{visible && (
<div className={styles.listCard}>
<div className={styles.cardItem}>
{JSON.stringify(filed) == "{}" ?
<>
<>
<div className={styles.cardContent}>
<span style={{color: 'red',fontSize: '1rem', marginLeft: '25px'}}>暂无数据请先配置台账管理台账名称为反馈</span>
<span style={{ color: 'red', fontSize: '1rem', marginLeft: '25px' }}>暂无数据请先配置台账管理台账名称为反馈</span>
</div>
</>
:
<>
<div className={styles.cardContent}>
<div className={styles.cardItemData1}>
{/* <Checkbox indeterminate={indeterminate} onChange={onCheckAllChange} checked={checkAll}></Checkbox> */}
<CheckboxGroup options={filed} value={checkedList} onChange={(e) => onChangeList(e)} style={{width:'400px'}} /></div>
</div>
</>
}
</>
:
<>
<div className={styles.cardContent}>
<div className={styles.cardItemData}>
<Divider orientation="left" style={{ margin: '0 0 5px 0', color: '#15428b', borderTopColor: '#99bbe8' }}>全选<Checkbox style={{ marginLeft: '10px' }} indeterminate={indeterminate} onChange={onCheckAllChange} checkvalue={filed} checked={checkAll}> </Checkbox></Divider>
<CheckboxGroup options={filed} value={checkedList} onChange={(e) => onChangeList(e)} /></div>
</div>
</>
}
</div>
</div>
</div>
)
}
</Modal>
)
}
</Drawer>
</div>
);
} else if (isType === 'app') {
return (
<Modal
title= '角色'
<Drawer
title="角色"
bodyStyle={{ width: '100%', minHeight: '100px' }}
style={{ top: '10px' }}
width="1200px"
width="450px"
destroyOnClose
centered={true}
maskClosable={false}
onOk={onSubmit}
okText="确认"
cancelText="取消"
{...props}
forceRender={true}
getContainer={false}
footer={
<Space>
<Button onClick={onSubmit} type="primary">
确定
</Button>
</Space>
}
>
{visible && (
<div className={styles.listCard}>
<div className={styles.cardItem}>
<div className={styles.cardContent}>
{title.map((item, index) => {
return <div className={styles.cardItemData} key={index}>
<Divider orientation="left" style={{ margin: '0 0 10px 0', color: '#15428b', borderTopColor: '#99bbe8' }}>{item} <Checkbox indeterminate={indeterminate[index]} onChange={onCheckAllChange} index={index} checkvalue={filed1[item]} checked={checkAll[index]}> </Checkbox></Divider>
<CheckboxGroup options={filed1[item]} value={checkedList[index]} onChange={(e) => onChangeList1(e, index, item)} /></div>
})}
</div>
<div className={styles.cardContent}>
<div className={styles.cardItemData} >
<Divider orientation="left" style={{ margin: '0 0 5px 0', color: '#15428b', borderTopColor: '#99bbe8' }}>全选<Checkbox style={{ marginLeft: '10px' }} indeterminate={indeterminate} onChange={onCheckAllChange1} checkvalue={ff} checked={checkAll}> </Checkbox></Divider>
<CheckboxGroup options={ff} value={checkedList} onChange={(e) => onChangeList1(e)} /></div>
</div>
</div>
</div>
)
}
</Modal>
</Drawer>
);
}
};
......
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.jsx
View file @ 99f2f0ee
......@@ -24,7 +24,7 @@ import {
ApartmentOutlined,
DesktopOutlined
} from '@ant-design/icons';
import {GetCM_Event_LoadEventTable, CM_Event_RemoveEventTable, CM_Event_ReOrder, GetCM_Event_LoadEventTypeTable} from '@/services/standingBook/api';
import { GetCM_Event_LoadEventTable, CM_Event_RemoveEventTable, CM_Event_ReOrder, GetCM_Event_LoadEventTypeTable } from '@/services/standingBook/api';
import classnames from 'classnames';
import AddModal from './AddModal'
import ProcessModal from './ProcessModal'
......@@ -43,14 +43,14 @@ const incident = () => {
const [viewVisible, setViewVisible] = useState(false)
const [isType, setIsType] = useState(''); // 弹窗类型
const [formObj, setFormObj] = useState('');
const [flag, setFlag] = useState(0);
const [flag, setFlag] = useState(0);
const [title1, setTitle1] = useState('')
const [title2, setTitle2] = useState('')
const [select, setSelect] = useState('')
const [sortData,setSortData] = useState([])
const [sortData, setSortData] = useState([])
const [rember, setRember] = useState(0)
const [rember1, setRember1] = useState()
......@@ -110,18 +110,14 @@ const incident = () => {
,
{
title: '上报字段',
dataIndex: 'reportPage',
key: 'reportPage',
dataIndex: 'reportFields',
key: 'reportFields',
width: 100,
render: item => (
<div
ref={r => {
if (r) {
r.innerHTML = item;
}
}}
/>
),
<span style={{ color: 'grey' }} key={item}>
{item}
</span>
),
}
,
{
......@@ -130,14 +126,10 @@ const incident = () => {
key: 'displayFields',
width: 100,
render: item => (
<div
ref={r => {
if (r) {
r.innerHTML = item;
}
}}
/>
),
<span style={{ color: 'grey' }} key={item}>
{item}
</span>
),
}
,
......@@ -146,15 +138,11 @@ const incident = () => {
dataIndex: 'editable',
key: 'editable',
width: 50,
render: item =>(
<div
ref={r => {
if (r) {
r.innerHTML = item;
}
}}
/>
)
render: item => (
<span style={{ color: 'grey' }} key={item}>
{item}
</span>
),
}
,
{
......@@ -162,15 +150,15 @@ const incident = () => {
dataIndex: 'editableFields',
key: 'editableFields',
width: 100,
render: item =>(
render: item => (
<div
ref={r => {
if (r) {
r.innerHTML = item;
}
}}
ref={r => {
if (r) {
r.innerHTML = item;
}
}}
/>
)
)
}
,
{
......@@ -217,7 +205,7 @@ const incident = () => {
align: 'center',
render: record => (
<Space size="middle">
<Tooltip title="编辑事件类型">
<EditTwoTone
onClick={() => editEventType(record)}
......@@ -248,7 +236,7 @@ const incident = () => {
<Tooltip title="辅助视图">
<DesktopOutlined
onClick={() => auxiliaryView(record)}
style={{ fontSize: '16px', color: '#1890FF' }}
style={{ fontSize: '16px', color: '#1890FF' }}
/>
</Tooltip>
</Space>
......@@ -257,11 +245,11 @@ const incident = () => {
}
]
useEffect(()=>{
useEffect(() => {
setTreeLoading(true);
GetCM_Event_LoadEventTable().then(res =>{
GetCM_Event_LoadEventTable().then(res => {
setTreeLoading(false);
if(res.msg==='Ok'){
if (res.msg === 'Ok') {
console.log(res.data)
// setMaxLength(res.data.root.length + 1)
let arr = formateArrDataA(res.data, 'businessType')
......@@ -269,7 +257,7 @@ const incident = () => {
let newArr = []
let newapp = []
let newabb = []
let aa= []
let aa = []
let zz = []
Object.keys(arr).map((item, index) => {
newArr.push(item)
......@@ -279,25 +267,25 @@ const incident = () => {
newapp.push(item)
})
console.log(newapp)
newapp.map((item, index)=>{
newapp.map((item, index) => {
console.log(item)
item.map((item1, index)=>{
item.map((item1, index) => {
newabb.push(item1.root)
console.log(item1.root)
})
})
console.log(newabb)
newabb.map((item, index)=>{
newabb.map((item, index) => {
console.log(item)
aa.push(item)
})
console.log(aa)
aa.map((item, index)=>{
aa.map((item, index) => {
console.log(item)
item.map((item1, index)=>{
item.map((item1, index) => {
console.log(item1)
zz.push({...item1})
})
zz.push({ ...item1 })
})
})
console.log(zz)
let arrr = formateArrDataA(zz, 'businessType')
......@@ -309,18 +297,18 @@ const incident = () => {
setTreeData(newArr)
}
})
},[flag])
useEffect(()=>{
}, [flag])
useEffect(() => {
GetCM_Event_LoadEventTypeTable().then(res => {
if (res.msg === 'Ok') {
let arr = []
res.data.map((item, index)=>{
res.data.map((item, index) => {
arr.push(item.text)
})
setSelect(arr)
}
})
},[])
}, [])
const formateArrDataA = (initialArr, name) => {
console.log(initialArr)
console.log(name)
......@@ -373,7 +361,7 @@ const incident = () => {
}
//删除事件类型
const deleteEventType = record => {
CM_Event_RemoveEventTable(record.ID).then(res =>{
CM_Event_RemoveEventTable(record.ID).then(res => {
if (res.msg === '') {
notification.success({
message: '提示',
......@@ -407,15 +395,15 @@ const incident = () => {
setViewVisible(true)
setTitle2(record.name)
}
const onSubmit =()=>{
setAddvisible(false)
setFlag(flag + 1)
const onSubmit = () => {
setAddvisible(false)
setFlag(flag + 1)
}
const onOK = prop =>{
setSortVisible(false)
let aa= (prop.str).toString()
const onOK = prop => {
setSortVisible(false)
let aa = (prop.str).toString()
console.log(aa)
CM_Event_ReOrder(aa).then(res =>{
CM_Event_ReOrder(aa).then(res => {
if (res.msg === 'Ok') {
notification.success({
message: '提示',
......@@ -432,10 +420,11 @@ const incident = () => {
}
})
}
const onOK1 =()=>{
const onOK1 = () => {
setProcessVisible(false)
setFlag(flag + 1)
}
const onOK11 =()=>{
const onOK11 = () => {
setViewVisible(false)
}
return (
......@@ -454,7 +443,7 @@ const incident = () => {
style={{
fontSize: '15px ',
fontWeight: 'bold',
}}
>
事件列表
......@@ -471,14 +460,14 @@ const incident = () => {
/>
</Tooltip>
<hr style={{ width: '100%', color: '#eeecec' }} />
{
treeData.length>0 && (treeData.map((item, index) => {
return <div className={classnames({
[styles.listItem]: true,
[styles.pickItem]: item === pickItem,
})} onClick={e => {setPickItem(item);setRember(index);setRember1(item)}} key={index}>{item}（{tableData[item] ? tableData[item].length : ''}） {item === pickItem ? <RightOutlined /> : ''} </div>
})
)}
{
treeData.length > 0 && (treeData.map((item, index) => {
return <div className={classnames({
[styles.listItem]: true,
[styles.pickItem]: item === pickItem,
})} onClick={e => { setPickItem(item); setRember(index); setRember1(item) }} key={index}>{item}（{tableData[item] ? tableData[item].length : ''}） {item === pickItem ? <RightOutlined /> : ''} </div>
})
)}
</div>
<div className={styles.switcher}>
{treeVisible && (
......@@ -508,17 +497,17 @@ const incident = () => {
</Button>
</span>
</div>
<Table
<Table
// rowClassName={setRowClassName}
size="small"
rowKey='ID'
bordered
onRow={record => {
return {
onDoubleClick: event => {event.stopPropagation(); editEventType(record)}, //双击
onDoubleClick: event => { event.stopPropagation(); editEventType(record) }, //双击
};
}}
}}
columns={columns}
dataSource={tableData[pickItem]}
scroll={{ y: 'calc(100vh - 155px)' }}
......@@ -531,14 +520,14 @@ const incident = () => {
showSizeChanger: true,
}}
/>
</div>
{/* Modal弹框 */}
{/* 添加事件 */}
<AddModal
visible={addVisible}
type={isType}
formObj={formObj}
type={isType}
formObj={formObj}
rember1={rember1}
maxLength={maxLength}
onCancel={() => setAddvisible(false)}
......
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