From 336a519d0481f9f1678e84bd47d46b66942b1ae0 Mon Sep 17 00:00:00 2001
From: zhangyongtian <1181606322@qq.com>
Date: Fri, 06 Sep 2024 10:43:35 +0800
Subject: [PATCH] feat: 事件流转改变
---
gz-customerSystem/src/views/register/matterDetail/index.jsx | 9 +
gz-customerSystem/src/views/register/matterDetail/ApplyInfo.jsx | 9 +
gz-customerSystem/src/assets/images/applyRecord.png | 0
gz-customerSystem/src/views/register/index.less | 11 +-
gz-customerSystem/src/assets/images/index.js | 4
gz-customerSystem/src/views/register/eventFlow/component/EventFlow.jsx | 187 ++++++++++++++++++++-----------------
gz-customerSystem/src/views/register/handleFeedback/index.jsx | 2
gz-customerSystem/src/views/register/eventFlow/index.jsx | 33 ++----
8 files changed, 136 insertions(+), 119 deletions(-)
diff --git a/gz-customerSystem/src/assets/images/applyRecord.png b/gz-customerSystem/src/assets/images/applyRecord.png
new file mode 100644
index 0000000..c7886b8
--- /dev/null
+++ b/gz-customerSystem/src/assets/images/applyRecord.png
Binary files differ
diff --git a/gz-customerSystem/src/assets/images/index.js b/gz-customerSystem/src/assets/images/index.js
index 3d5fb35..219ecbe 100644
--- a/gz-customerSystem/src/assets/images/index.js
+++ b/gz-customerSystem/src/assets/images/index.js
@@ -58,6 +58,7 @@
import examine from "./examine.png";
import knock from "./knock.png";
import edit from "./edit.png";
+import applyRecord from "./applyRecord.png";
export {
ledger_1,
@@ -110,5 +111,6 @@
apply,
examine,
knock,
- edit
+ edit,
+ applyRecord
};
\ No newline at end of file
diff --git a/gz-customerSystem/src/views/register/eventFlow/component/EventFlow.jsx b/gz-customerSystem/src/views/register/eventFlow/component/EventFlow.jsx
index 96ba746..318fd38 100644
--- a/gz-customerSystem/src/views/register/eventFlow/component/EventFlow.jsx
+++ b/gz-customerSystem/src/views/register/eventFlow/component/EventFlow.jsx
@@ -1,5 +1,5 @@
-import React, { useState, useRef, useEffect } from 'react';
-import { Button, Modal, Tabs, Badge } from '@arco-design/web-react';
+import React, { useState, useRef, useEffect, Fragment } from 'react';
+import { Button, Modal, Tabs, Badge, Steps } from '@arco-design/web-react';
import { Space } from 'antd';
import ProgressStep from '@/components/ProgressStep/VisitStep';
import BackModel from "./BackModel";
@@ -7,8 +7,11 @@
import { getOffset, getSize } from '@/utils/utility';
import EscalationModel from './EscalationModel';
import AssignedModel from './AssignedModel';
+import MatterDetail from '../../matterDetail';
+import SupervisingView from "../../matterDetail/Supervising";
const TabPane = Tabs.TabPane;
+const Step = Steps.Step;
const fakeData = [
{
@@ -91,94 +94,106 @@
offsetLeft = getOffset(scrollRef.current.container).left;
offsetTop = getOffset(scrollRef.current.container).top;
}
- setHeight(getSize().windowH - offsetTop - 65)
+ setHeight(getSize().windowH - offsetTop - 16)
};
return (
- <div className='dataSync'>
- <div className='dataSync-hasTabPage' >
- <Tabs defaultActiveTab='1' >
- <TabPane
- key='1'
- title={
- <span style={{ fontSize: '15px' }}>
- 流转进度
- </span>
- }
- >
- <Scrollbars
- style={{ height: height }}
- ref={scrollRef}
- autoHide
- >
- <ProgressStep progressData={fakeData} />
- </Scrollbars>
- </TabPane>
- <TabPane
- key='2'
- title={
- <span style={{ fontSize: '15px' }}>
- 督办信息
- <Badge maxCount={99} count={1000} />
- </span>
- }
- >
- <Scrollbars
- style={{ height: height }}
- ref={scrollRef}
- ></Scrollbars>
- </TabPane>
- </Tabs>
+ <Fragment>
+ <div style={{ backgroundColor: '#fff', margin: '0 16px 0px 16px', paddingTop: '16px', paddingLeft: '91px' }}>
+ <Steps type='navigation' current={2}>
+ <Step title='来访登记' disabled />
+ <Step title='事件流转' disabled />
+ <Step title='办理反馈' disabled />
+ <Step title='结案审核' disabled />
+ <Step title='当事人评价' disabled />
+ <Step title='结案归档' disabled />
+ </Steps>
+ </div>
+ <div className='dataSync' style={{ marginTop: '8px' }}>
+ <Scrollbars
+ style={{ height: height }}
+ ref={scrollRef}
+ autoHide
+ >
+ <MatterDetail />
+ <div className='dataSync-hasTabPage' style={{ marginTop: '-8px' }}>
+ <Tabs defaultActiveTab='1' >
+ <TabPane
+ key='1'
+ title={
+ <span style={{ fontSize: '15px' }}>
+ 流转进度
+ </span>
+ }
+ >
+ <ProgressStep progressData={fakeData} />
+ </TabPane>
+ <TabPane
+ key='2'
+ title={
+ <span style={{ fontSize: '15px' }}>
+ 督办信息
+ <Badge maxCount={99} count={1000} />
+ </span>
+ }
+ >
+ <div style={{ marginBottom: '20px' }}>
+ <SupervisingView id={''} />
+ </div>
+ </TabPane>
+ </Tabs>
+ </div>
+ </Scrollbars>
+ <Modal
+ title='回退'
+ visible={backVisible}
+ onOk={() => setBackVisible(false)}
+ onCancel={() => { setBackVisible(false) }}
+ autoFocus={false}
+ focusLock={true}
+ footer={null}
+ unmountOnExit={true}
+ maskClosable={false}
+ >
+ <BackModel />
+ </Modal>
+ <Modal
+ title='上报'
+ visible={escalationVisible}
+ onOk={() => setEscalationVisible(false)}
+ onCancel={() => { setEscalationVisible(false) }}
+ autoFocus={false}
+ focusLock={true}
+ footer={null}
+ unmountOnExit={true}
+ maskClosable={false}
+ >
+ <EscalationModel />
+ </Modal>
+ <Modal
+ title='交办'
+ visible={assignedVisible}
+ onOk={() => setAssignedVisible(false)}
+ onCancel={() => { setAssignedVisible(false) }}
+ footer={null}
+ unmountOnExit={true}
+ maskClosable={false}
+ >
+ <AssignedModel />
+ </Modal>
+ <div className="dataSync-excel">
+ <Space size="large" style={{ margin: '4px 14px' }}>
+ <Button type="primary" >受理</Button>
+ <Button type="primary" >提交</Button>
+ <Button type="primary" >自行受理</Button>
+ <Button type='outline' status='danger' onClick={() => setBackVisible(true)}>回退</Button>
+ <Button type='outline' onClick={() => setAssignedVisible(true)}>交办</Button>
+ <Button type='outline' onClick={() => setEscalationVisible(true)}>上报</Button>
+ <Button type='secondary' >返回上级页面</Button>
+ </Space>
+ </div>
</div>
- <div className="dataSync-excel">
- <Space size="large" style={{ margin: '4px 14px' }}>
- <Button type="primary" >受理</Button>
- <Button type="primary" >提交</Button>
- <Button type="primary" >自行受理</Button>
- <Button type='outline' status='danger' onClick={() => setBackVisible(true)}>回退</Button>
- <Button type='outline' onClick={() => setAssignedVisible(true)}>交办</Button>
- <Button type='outline' onClick={() => setEscalationVisible(true)}>上报</Button>
- <Button type='secondary' >返回上级页面</Button>
- </Space>
- </div>
- <Modal
- title='回退'
- visible={backVisible}
- onOk={() => setBackVisible(false)}
- onCancel={() => { setBackVisible(false) }}
- autoFocus={false}
- focusLock={true}
- footer={null}
- unmountOnExit={true}
- maskClosable={false}
- >
- <BackModel />
- </Modal>
- <Modal
- title='上报'
- visible={escalationVisible}
- onOk={() => setEscalationVisible(false)}
- onCancel={() => { setEscalationVisible(false) }}
- autoFocus={false}
- focusLock={true}
- footer={null}
- unmountOnExit={true}
- maskClosable={false}
- >
- <EscalationModel />
- </Modal>
- <Modal
- title='交办'
- visible={assignedVisible}
- onOk={() => setAssignedVisible(false)}
- onCancel={() => { setAssignedVisible(false) }}
- footer={null}
- unmountOnExit={true}
- maskClosable={false}
- >
- <AssignedModel />
- </Modal>
- </div>
+ </Fragment>
)
}
diff --git a/gz-customerSystem/src/views/register/eventFlow/index.jsx b/gz-customerSystem/src/views/register/eventFlow/index.jsx
index cc04637..2606507 100644
--- a/gz-customerSystem/src/views/register/eventFlow/index.jsx
+++ b/gz-customerSystem/src/views/register/eventFlow/index.jsx
@@ -13,10 +13,10 @@
import "@arco-themes/react-gzzz/css/arco.css";
import '../index.less';
import { Steps, Tabs } from '@arco-design/web-react';
-import { examine, Matter, transfer } from '@/assets/images'
+import { examine, Matter, transfer, applyRecord } from '@/assets/images'
import EventFlow from './component/EventFlow';
-import MatterDetail from '../matterDetail';
import Examine from "./component/Examine";
+import ApplyInfo from "../matterDetail/ApplyInfo";
const Step = Steps.Step;
const TabPane = Tabs.TabPane;
@@ -28,14 +28,13 @@
const [tabsList, setTabList] = useState([
{
img: Matter,
- label: '事项详情',
+ label: '详情',
key: '1'
},
{
- img: transfer,
- label: '流转办理',
+ img: applyRecord,
+ label: '申请记录',
key: '2',
- isNeedStep: true,//加上这个就有进度条
},
{
img: examine,
@@ -43,6 +42,7 @@
key: '3',
},
])
+ const [disTab, setDisTab] = useState(true)
return (
@@ -52,7 +52,7 @@
{ breadcrumbData: [{ title: '工作台' }, { title: '事件中心' }], title: '处理' }
}
>
- <Tabs
+ {disTab ? <Tabs
defaultActiveTab='1'
onChange={(v) => setTabsActive(v)}
className='myTabContent'
@@ -67,24 +67,13 @@
</span>
}
>
- {
- item.isNeedStep && <div style={{ backgroundColor: '#fff', margin: '0 16px 0px 16px', paddingTop: '16px', paddingLeft: '91px' }}>
- <Steps type='navigation' current={current}>
- <Step title='来访登记' disabled />
- <Step title='事件流转' disabled />
- <Step title='办理反馈' disabled />
- <Step title='结案审核' disabled />
- <Step title='当事人评价' disabled />
- <Step title='结案归档' disabled />
- </Steps>
- </div>
- }
- {tabsActive === '1' && <MatterDetail />}
- {tabsActive === '2' && <EventFlow />}
+ {tabsActive === '1' && <EventFlow />}
+ {tabsActive === '2' && <ApplyInfo />}
{tabsActive === '3' && <Examine />}
</TabPane>
})}
- </Tabs>
+ </Tabs> : <EventFlow />
+ }
</NewPage>
</div>
)
diff --git a/gz-customerSystem/src/views/register/handleFeedback/index.jsx b/gz-customerSystem/src/views/register/handleFeedback/index.jsx
index 00b2ace..eab6de3 100644
--- a/gz-customerSystem/src/views/register/handleFeedback/index.jsx
+++ b/gz-customerSystem/src/views/register/handleFeedback/index.jsx
@@ -78,7 +78,7 @@
</div>
}
{tabsActive === '1' &&
- <MatterDetail />
+ <MatterDetail hasApplet={true} hasEditBtn={true}/>
}
{
tabsActive === '2' && <Typography.Paragraph style={style}>
diff --git a/gz-customerSystem/src/views/register/index.less b/gz-customerSystem/src/views/register/index.less
index 5d26710..b55c45e 100644
--- a/gz-customerSystem/src/views/register/index.less
+++ b/gz-customerSystem/src/views/register/index.less
@@ -108,6 +108,12 @@
overflow-y: scroll;
}
+ &-noScrollPage {
+ background-color: #fff;
+ margin: 0px 16px 0px 16px;
+ padding: 12px 16px 16px 16px;
+ }
+
&-addBtn {
cursor: pointer;
padding: 8px;
@@ -138,14 +144,9 @@
background-color: #fff;
margin: 8px 16px 0px 16px;
padding: 12px 16px 64px 16px;
- height: calc(100vh - 288px);
.arco-tabs-header-nav {
margin-left: 0 !important;
- }
-
- .scrollTabContent {
- overflow-y: scroll;
}
}
diff --git a/gz-customerSystem/src/views/register/matterDetail/ApplyInfo.jsx b/gz-customerSystem/src/views/register/matterDetail/ApplyInfo.jsx
new file mode 100644
index 0000000..6baf619
--- /dev/null
+++ b/gz-customerSystem/src/views/register/matterDetail/ApplyInfo.jsx
@@ -0,0 +1,9 @@
+import React from 'react'
+
+export default function ApplyInfo(props) {
+ return (
+ <div>
+
+ </div>
+ )
+}
diff --git a/gz-customerSystem/src/views/register/matterDetail/index.jsx b/gz-customerSystem/src/views/register/matterDetail/index.jsx
index 8e3cd09..810cb2e 100644
--- a/gz-customerSystem/src/views/register/matterDetail/index.jsx
+++ b/gz-customerSystem/src/views/register/matterDetail/index.jsx
@@ -11,7 +11,7 @@
}
-export default function MatterDetail() {
+export default function MatterDetail(props) {
const [fakeData, setFakeData] = useState([{
"trueName": "王大锤",
"mobile": "13380313412",
@@ -169,15 +169,16 @@
return (
<div style={{ position: 'relative' }}>
<Typography.Paragraph>
- <div className='dataSync-page'>
+ <div className='dataSync-noScrollPage'>
<Col span={24} style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}>
<Space size='small'>
<div className='MediationInfo-subTitle' style={{ marginTop: '-9px' }}></div><h5>当事人信息</h5>
</Space>
- <div>
+ {props.hasApplet && <div>
<Switch checkedChildren="当事人小程序可见" unCheckedChildren="当事人小程序不可见" defaultChecked />
</div>
+ }
</Col>
<div style={{ margin: '16px 0' }}>
<PersonCard
@@ -294,7 +295,7 @@
<div>{infoData.createTime || '-'}</div>
</Col>
</Row>
- <Button type='primary' style={{ marginTop: '20px' }}>修改</Button>
+ {props.hasEditBtn && <Button type='primary' style={{ marginTop: '20px' }}>修改</Button>}
</div>
</Typography.Paragraph>
--
Gitblit v1.8.0