~liuwh/gzDyh.git

			@@ -1,11 +1,14 @@
			import React, { useState } from 'react';
			import { Steps, Button } from '@arco-design/web-react';
			import { Col, Space, Row, Tooltip } from 'antd';
			import { Steps } from '@arco-design/web-react';
			import { Col, Space, Row, Tooltip, Button } from 'antd';
			import { register, empty } from '../../../../assets/images'
			import { Form, Select, Empty, Tabs, Typography, } from '@arco-design/web-react';
			import { Form, Input, Empty, Tabs, Typography, Modal } from '@arco-design/web-react';
			import { question1, } from '@/assets/images';
			import ProgressStep from '../../../../components/ProgressStep/VisitStep'
			import SelectObjModal from '../../../../components/SelectObjModal/selectPerson'
			import WantUserTag from '../../../../components/WantUserTag/Handling'

			const Option = Select.Option;
			const InputSearch = Input.Search;
			const FormItem = Form.Item;
			const TabPane = Tabs.TabPane;

			@@ -17,6 +20,26 @@


			const Handle = () => {
			const [selectedTab, setSelectedTab] = useState('1'); // 默认选中第一个 tab
			const [wantUser, setWantUser] = useState({});
			const tabs = [
			{ index: '1', label: '承办部门' },
			{ index: '2', label: '配合部门' },
			];

			const [isModalVisible, setIsModalVisible] = useState(false);

			const showModal = () => {
			setIsModalVisible(true);
			};

			const hideModal = () => {
			setIsModalVisible(false);
			};

			const handleTabChange = (newTabIndex) => {
			setSelectedTab(newTabIndex);
			};

			return (
			<>
			@@ -63,7 +86,6 @@
			requiredSymbol={false}
			scrollToFirstError={true}
			>
			<Row>
			<Col span={8}>
			<FormItem label={<div style={{ display: 'flex' }}>
			<span style={{ color: '#86909C' }}>经办人</span>
			@@ -73,15 +95,17 @@
			</div>
			}
			field='level' >
			<Select placeholder='请选择' allowClear>
			{['一级', '二级', '三级', '四级'].map((option, index) => (
			<Option key={option} value={option}>
			{option}
			</Option>
			))}

			</Select>
			<Button type='primary' style={{ position: 'absolute', right: 0 }}>保存</Button>
			{wantUser.wantUserId ?
			<WantUserTag name={wantUser.wantUserName} onClose={() => setWantUser({ wantUserId: null, wantUserName: null })} />
			:
			<InputSearch
			searchButton='选择'
			placeholder='请选择'
			style={{ width: 350 }}
			onClick={() => setIsModalVisible(true)}
			onSearch={() => setIsModalVisible(true)}
			/>
			}
			</FormItem>
			</Col>
			<Col span={24}>
			@@ -101,7 +125,6 @@
			description='暂无数据'
			/>
			</Col>
			</Row>
			</Form>
			<Space>
			<Button type="primary" style={{ backgroundColor: '#1A6FB8' }}>添加办理记录</Button>
			@@ -116,19 +139,40 @@
			key='1'
			title={
			<span style={{ fontSize: '15px' }}>
			Tab 1
			流转进度
			</span>
			}
			>
			<Typography.Paragraph style={style}>

			<Typography.Paragraph>
			<div style={{ display: 'flex', marginLeft: '16px', gap: '16px' }}>
			{tabs.map((tab) => (
			<div
			key={tab.index}
			style={{
			color: selectedTab === tab.index ? 'rgba(26,111,184,1)' : 'rgba(0,0,0,0.45)',
			padding: '6px 12px',
			border: `1px solid ${selectedTab === tab.index ? 'rgba(26,111,184,1)' : 'rgba(229,230,235,1)'}`,
			borderRadius: '4px',
			cursor: 'pointer',
			}}
			onClick={() => handleTabChange(tab.index)}
			>
			{tab.label}
			</div>
			))}
			</div>
			{selectedTab === '1' &&
			<div className='progress'>
			<ProgressStep caseId='202408291012566613' pageFrom="dispatchRecord" />
			</div>
			}
			</Typography.Paragraph>
			</TabPane>
			<TabPane
			key='2'
			title={
			<span style={{ fontSize: '15px' }}>
			Tab 2
			督办信息
			</span>
			}
			>
			@@ -138,6 +182,17 @@

			</div>
			</div>

			{/* 选择经办人*/}
			<SelectObjModal
			visible={isModalVisible}
			checkKeys={wantUser.wantUserId ? [{ label: wantUser.wantUserName, value: wantUser.wantUserId }] : undefined}
			onOk={(value) => {
			setIsModalVisible(false);
			setWantUser({ wantUserId: value.keys[0], wantUserName: value.items[0].name });
			}}
			onClose={() => setIsModalVisible(false)}
			/>
			</div>
			</>
			)