~liuwh/gzDyh.git

New file
			@@ -0,0 +1,90 @@
			/*
			* @Author: dminyi 1301963064@qq.com
			* @Date: 2024-08-09 09:59:43
			* @LastEditors: dminyi 1301963064@qq.com
			* @LastEditTime: 2024-08-28 14:38:20
			* @FilePath: \gzDyh\gz-customerSystem\src\views\basicInformation\organization\index.jsx
			* @Description: 来访登记
			*/

			import React, { useState, useRef, Fragment } from "react";
			import NewPage from '@/components/NewPage';
			import * as $$ from '@/utils/utility';
			import "@arco-themes/react-gzzz/css/arco.css";
			import '../index.less';
			import { Button, Steps, Tabs, Message } from '@arco-design/web-react';
			import { question, register, Matter, transfer } from '@/assets/images'
			import EventFlow from './component/EventFlow';
			import MatterDetali from '../matterDetail';

			const Step = Steps.Step;
			const TabPane = Tabs.TabPane;


			const Organization = () => {
			const [current, setCurrent] = useState(2);
			const [tabsActive, setTabsActive] = useState('1');
			const [tabsList, setTabList] = useState([
			{
			img: Matter,
			label: '事项详情',
			key: '1'
			},
			{
			img: transfer,
			label: '流转办理',
			key: '2',
			isNeedStep: true,//加上这个就有进度条
			},
			])


			return (
			<div style={{ position: 'relative' }}>
			<NewPage
			pageHead={
			{ breadcrumbData: [{ title: '工作台' }, { title: '事件中心' }], title: '办理反馈' }
			}
			>
			<Tabs
			defaultActiveTab='1'
			onChange={(v) => setTabsActive(v)}
			className='myTabContent'
			>
			{tabsList?.map(item => {
			return <TabPane
			key={item.key}
			title={
			<span>
			{tabsActive === item.key && <img src={item.img} alt="" style={{ width: '16px', height: '16px', margin: '-5px 12px 0px 0px' }} />}
			<span style={{ fontSize: '16px' }}>{item.label}</span>
			</span>
			}
			>
			{
			item.isNeedStep && <div style={{ backgroundColor: '#fff', margin: '12px 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' &&
			<MatterDetali />
			}
			{
			(tabsActive === '2' && current === 2) && <EventFlow />
			}
			</TabPane>
			})}
			</Tabs>
			</NewPage>
			</div>
			)
			}

			export default Organization;