From 5985afbb3372881cf867ed32eed5bec8434e8182 Mon Sep 17 00:00:00 2001
From: dminyi <1301963064@qq.com>
Date: Tue, 13 Aug 2024 09:32:51 +0800
Subject: [PATCH] 来访登记

---
 gz-customerSystem/src/views/basicInformation/organization/index.jsx |  722 ++++++++++++++++++++++++++++---------------------------
 1 files changed, 368 insertions(+), 354 deletions(-)

diff --git a/gz-customerSystem/src/views/basicInformation/organization/index.jsx b/gz-customerSystem/src/views/basicInformation/organization/index.jsx
index 86858dc..67d987c 100644
--- a/gz-customerSystem/src/views/basicInformation/organization/index.jsx
+++ b/gz-customerSystem/src/views/basicInformation/organization/index.jsx
@@ -1,386 +1,400 @@
 /*
- * @Company: hugeInfo
- * @Author: ldh
- * @Date: 2022-02-18 15:04:13
- * @LastEditTime: 2024-08-06 15:57:16
+ * @Author: dminyi 1301963064@qq.com
+ * @Date: 2024-08-09 09:59:43
  * @LastEditors: dminyi 1301963064@qq.com
- * @Version: 1.0.0
- * @Description: 组织架构
+ * @LastEditTime: 2024-08-12 20:30:15
+ * @FilePath: \gzDyh\gz-customerSystem\src\views\basicInformation\organization\index.jsx
+ * @Description: 来访登记
  */
-import React, { useState, useEffect } from 'react';
-import { Input, Menu, Tooltip, Space } from 'antd';
-import { ReloadOutlined } from '@ant-design/icons';
-import Page from '../../../components/Page';
-import { AddOrEditOrganization, DepartmentTable, PersonnelModal, AddOrEditDept } from '../../../components/basicInformation/organization';
-import MyTree from '../../../components/MyTree';
+
+import React, { useState, useEffect } from "react";
+import NewPage from '../../../components/NewPage';
+import RegisterTab from '../../../components/registerTab';
+import PersonCard from '../../../components/personCard';
 import * as $$ from '../../../utils/utility';
+import { add, question1 } from '../../../assets/images';
+import { Row, Col, Space, Tooltip } from 'antd';
+import { Form, Input, Button, Radio, Select, DatePicker, Cascader } from '@arco-design/web-react';
+import "@arco-design/web-react/dist/css/arco.css";
+import TableView from '../../../components/TableView';
 
-const { Search } = Input;
+const RadioGroup = Radio.Group;// 根据调解案号获取纠纷登记信息
+const FormItem = Form.Item;
+const Option = Select.Option;
+const InputSearch = Input.Search;
 
-// 查询人员信息
-function getPersonsApi(data) {
-	return $$.ax.request({ url: 'ctUser/pageQuery', type: 'get', data, service: 'cust' });
+
+
+function getCaseDataApi(submitData) {
+	return $$.ax.request({ url: `caseInfo/getCaseInfo?id=${submitData}`, type: 'get', service: 'mediate' });
 }
 
-// 获取组织结构
-function getOrganizationApi() {
-	return $$.ax.request({ url: 'ctUnit/listUnitTree', type: 'get', service: 'cust' });
-}
 
-// 新增 or 修改组织
-function setOrganizationApi(data) {
-	return $$.ax.request({ url: 'ctUnit/saveCtUnit', type: 'post', data, service: 'cust' });
-}
-
-// 删除组织
-function delOrganizationApi(id) {
-	return $$.ax.request({ url: `ctUnit/removeByIds?ids=${id}`, type: 'get', service: 'cust' });
-}
-
-// 获取部门详情
-function getDepartmentDataApi(organizationId) {
-	return $$.ax.request({ url: `ctUnit/getUnitAndDept?id=${organizationId}`, type: 'get', service: 'cust' });
-}
-
-// 新增 or 修改部门
-function setDeptApi(data) {
-	return $$.ax.request({ url: 'ctDept/saveCtDept', type: 'post', data, service: 'cust' });
-}
-
-// 删除部门
-function delDeptApi(deptId) {
-	return $$.ax.request({ url: `ctDept/removeByIds?ids=${deptId}`, type: 'get', service: 'cust' });
-}
 
 const Organization = () => {
-	// 是否是新增 or 修改组织
-	const [isAddOrEdit, setIsAddOrEdit] = useState(false);
 
-	// 是否新增 or 修改部门
-	const [isAddOrEditDept, setIsAddOrEditDept] = useState(false);
 
-	// 查看人员modal
-	const [modalData, setModalData] = useState({ visible: false, title: '', data: [], total: 0 });
+	// tabs当前选择的标签信息
+	const [tabsActive, setTabsActive] = useState('1');
+	const [visible, setVisible] = useState(false);
+	const [selectedCity, setSelectedCity] = useState('Beijing');
 
-	// 组织数据
-	const [organizationData, setOrganizationData] = useState([]);
+	const tabs = [
+		{ label: '事件登记', key: '1' },
+		{ label: '事件流转', key: '2' },
+		{ label: '办理反馈', key: '3' },
+		{ label: '申请结案', key: '4' },
+		{ label: '当事人评价', key: '5' },
+		{ label: '结案归档', key: '6', img1: true },
 
-	// 当前选择组织
-	const [organizationActive, setOrganizationActive] = useState({});
+	];
 
-	// 新增 or 修改组织数据
-	const [organizationEditData, setOrganizationEditData] = useState({ active: {} });
 
-	// 新增 or 修改部门数据
-	const [deptEditData, setDeptEditData] = useState({});
+	const fakeData = [
+		{
+			id: 3,
+			perClassName: '申请方当事人',
+			trueName: '蓝海科技有限公司',
+			mobile: '13800000002',
+			agentStatus: '1', // 无代理人
+			company: true
+		},
+		{
+			id: 1,
+			perClassName: '申请方代理人',
+			trueName: '王小明',
+			mobile: '13800000001',
+			agentStatus: '2', // 有代理人
+			person: true
+		},
+		{
+			id: 2,
+			perClassName: '被申请方当事人',
+			trueName: '蓝海科技有限公司',
+			mobile: '13800000002',
+			agentStatus: '1', // 无代理人
+			person: true,
+			Respondent: true
+		},
 
-	// 组织查询
-	const [organizationSearch, setOrganizationSearch] = useState({ value: '', searchValue: '' });
+	];
 
-	// 当前选择组织下的部门数据
-	const [departmentData, setDepartmentData] = useState([]);
+	const fakeData1 = [
+		{
+			id: 1,
+			caseNo: 'A20230101',
+			judicNo: 'J20230101',
+			perClassName: '自然人',
+			inputUserName: '张三',
+			mediateUserName: '李四',
+			judgeName: '王五',
+			mediator: '赵六',
+			handlerUserName: '钱七',
+			returnUserName: '孙八',
+			expireTime: '2023-08-10T08:00:00.000Z',
+			processName: '进行中',
+			otherMediator: '周九',
+			canalName: '网络',
+			judicResult: '通过',
+			assistName: '吴十',
+			mediTypeName: '民事调解',
+			serieStatus: '1', // 1 表示非系列案,2 表示系列案
+			// 更多字段...
+		},
+		// 更多数据...
+	];
 
-	// 选择组织
-	function handleOrganization(value) {
-		getDepartmentData({ organizationId: value.id });
-	}
+	// 列配置
+	const fakeColumns = [
+		{
+			title: '序号',
+			dataIndex: 'caseNo',
+			key: 'caseNo',
+		},
+		{
+			title: '材料类型',
+			dataIndex: 'judicNo',
+			key: 'judicNo',
+		},
+		{
+			title: '材料数量',
+			dataIndex: 'perClassName',
+			key: 'perClassName',
+		},
+		{
+			title: '材料名称',
+			dataIndex: 'perClassName',
+			key: 'perClassName',
+		},
+		{
+			title: '上传时间',
+			dataIndex: 'perClassName',
+			key: 'perClassName',
+		},
+		{
+			title: '操作',
+			dataIndex: 'perClassName',
+			key: 'perClassName',
+			render: (text) => (
+				<div style={{ display: 'flex', color: '#1A6FB8', gap: '16px' }}>
+					<div>查看</div>
+					<div>删除</div>
+					<div>下载</div>
+					<div>上传</div>
+				</div>
+			)
+		},
+		// 更多列配置...
+	];
 
-	// 组织查询
-	function handleSearchOrganization(value) {
-		setOrganizationSearch({ ...organizationSearch, searchValue: value });
-	}
-
-	// 点击删除组织
-	async function handleDelOrganization(value) {
-		if (value.children && value.children.length > 0) {
-			$$.info({ type: 'warning', content: '该组织下存在下级组织, 不支持删除! 请先清空下级组织' });
-			return false;
-		}
-		let visible = false;
-		const res = await getDepartmentDataApi(value.id);
-		if (res.type) {
-			if (res.data.countCtDept) {
-				$$.info({ type: 'warning', content: '该组织下存在部门, 不支持删除! 请先清空部门' });
-				visible = true;
-			}
-		}
-		if (!visible) {
-			$$.modalInfo({
-				content: `确认删除${value.name}吗?`,
-				onOk: () => delOrganization({ organizationId: value.id }),
-			});
-		}
-	}
-
-	// 查看部门人员 or 关闭modal
-	function handlePersonnelModal(record, visible) {
-		if (visible) {
-			getPersons({ unitId: record.unitId, deptId: record.id, page: 1, size: 10 }, record.name);
-		} else {
-			setModalData({ visible });
-		}
-	}
-
-	// 获取人员信息
-	async function getPersons(submitData, title) {
-		global.setSpinning(true);
-		const res = await getPersonsApi(submitData);
-		global.setSpinning(false);
-		if (res.type) {
-			let resData = res.data || {};
-			setModalData({
-				visible: true,
-				title: title || modalData.title,
-				data: resData.ctUserPage?.content,
-				total: resData.ctUserPage?.totalElements,
-				search: { page: submitData.page, size: submitData.size, unitId: submitData.unitId, deptId: submitData.deptId },
-			});
-		}
-	}
-
-	// 获取组织数据
-	async function getOrganization(firstLoading, reset) {
-		global.setSpinning(true);
-		const res = await getOrganizationApi();
-		global.setSpinning(false);
-		if (res.type) {
-			let data = res.data || [],
-				active = {};
-				console.log(data, 'data');
-			if (data.length > 0 && (firstLoading || reset)) {
-				active = data[0];
-			}
-			setOrganizationData(data);
-			if (data.length > 0) {
-				if (firstLoading || reset) {
-					setOrganizationSearch({ value: '', searchValue: '' });
-				}
-				getDepartmentData({ organizationId: active.id ? active.id : organizationActive.id });
-			}
-		}
-	}
-
-	// 新增 or 修改组织
-	async function setOrganization(submitType, values, form) {
-		global.setSpinning(true);
-		let data = {
-			...organizationEditData.active,
-			...values,
-			id: organizationEditData.type === 'change' ? organizationEditData.active.id : '',
-			parentId:
-				organizationEditData.type === 'change'
-					? organizationEditData.active.parentId
-					: organizationEditData.type === 'upAdd'
-					? ''
-					: organizationEditData.active.id,
-			childId: organizationEditData.type === 'upAdd' ? organizationEditData.active.id : '',
-		};
-		let submitData = data.id ? { ...organizationActive.active, ...data } : data;
-		const res = await setOrganizationApi(submitData);
-		global.setSpinning(false);
-		if (res.type) {
-			$$.infoSuccess({ content: '操作成功' });
-			if (submitType === '1') {
-				setIsAddOrEdit(false);
-			} else {
-				form.resetFields();
-			}
-			getOrganization();
-		}
-	}
-
-	// 删除组织
-	async function delOrganization({ organizationId }) {
-		global.setSpinning(true);
-		const res = await delOrganizationApi(organizationId);
-		global.setSpinning(false);
-		if (res.type) {
-			$$.infoSuccess({ content: '删除成功!' });
-			if (organizationId === organizationActive.id) {
-				getOrganization('', 'reset');
-			} else {
-				getOrganization();
-			}
-		}
-	}
-
-	// 获取部门详情
-	async function getDepartmentData({ organizationId }) {
-		global.setSpinning(true);
-		const res = await getDepartmentDataApi(organizationId);
-		global.setSpinning(false);
-		if (res.type) {
-			setOrganizationActive(res.data);
-			setDepartmentData(res.data.ctDepts || []);
-		}
-	}
-
-	// 新增 or 修改部门
-	async function setDept(submitType, values, form) {
-		let submitData = {
-			...deptEditData,
-			...values,
-			unitId: organizationActive.id,
-			id: deptEditData.id === 'addOneDept' || deptEditData.id === 'addSubordinateDept' ? '' : deptEditData.id,
-			parentId: deptEditData.id === 'addOneDept' ? '' : deptEditData.parentId,
-		};
-    global.setSpinning(true);
-		const res = await setDeptApi(submitData);
-		global.setSpinning(false);
-		if (res.type) {
-			$$.infoSuccess({ content: '操作成功' });
-			if (submitType === '1') {
-				setIsAddOrEditDept(false);
-			} else {
-				form.resetFields();
-			}
-			getDepartmentData({ organizationId: organizationActive.id });
-		}
-	}
-
-	// 删除部门
-	async function delDept({ deptId }) {
-		global.setSpinning(true);
-		const res = await delDeptApi(deptId);
-		global.setSpinning(false);
-		if (res.type) {
-			$$.infoSuccess({ content: '删除成功' });
-			getDepartmentData({ organizationId: organizationActive.id });
-		}
-	}
-
-	useEffect(() => {
-		getOrganization('firstLoading');
-	}, []);
-
-	// 组织操作
-	const dropdownOptions = ({ num, value }) => (
-		<Menu
-			onClick={({ key }) => {
-				console.log(key, value,'key','value')
-				if (key === 'delete') {
-					handleDelOrganization(value);
-				} else {
-					setOrganizationEditData({ type: key, active: value });
-					setIsAddOrEdit(true);
-				}
-			}}
-		>
-			{num === 1 && <Menu.Item key="upAdd">新增上级组织</Menu.Item>}
-			<Menu.Item key="downAdd">新增下级组织</Menu.Item>
-			<Menu.Item key="change">修改</Menu.Item>
-			{num !== 1 && <Menu.Item key="delete">删除</Menu.Item>}
-		</Menu>
-	);
-
-	function addOrEditBreadcrumb() {
-		console.log('111111')
-		let obj = isAddOrEdit
-			? {
-					title: organizationEditData.type === 'change' ? '修改组织' : organizationEditData.type === 'upAdd' ? '新增上级组织' : '新增下级组织',
-			  }
-			: {
-					title: isAddOrEditDept === 'changeDept' ? '修改部门' : isAddOrEditDept === 'addOneDept' ? '新增部门' : '新增下级部门',
-			  };
-		return {
-			breadcrumbData: [
-				{ title: '基础信息管理' },
+	const options = [
+		{
+			value: 'beijing',
+			label: 'Beijing',
+			children: [
 				{
-					title: '组织架构',
-					click: () => {
-						setIsAddOrEdit(false);
-						setIsAddOrEditDept(false);
-					},
+					value: 'Beijing',
+					label: 'Beijing',
+					children: [
+						{
+							value: 'chaoyang',
+							label: 'Chaoyang',
+						},
+					],
 				},
-				obj,
 			],
-			title:
-				isAddOrEditDept === 'addSubordinateDept' || isAddOrEditDept === 'changeDept'
-					? deptEditData.name
-					: isAddOrEditDept
-					? organizationActive.name
-					: organizationEditData.active.name,
-			handleReturn: () => {
-				setIsAddOrEdit(false);
-				setIsAddOrEditDept(false);
-			},
-		};
+		},
+		{
+			value: 'shanghai',
+			label: 'Shanghai',
+			children: [
+				{
+					value: 'shanghaishi',
+					label: 'Shanghai',
+					children: [
+						{
+							value: 'huangpu',
+							label: 'Huangpu',
+						},
+					],
+				},
+			],
+		},
+	];
+
+	function onSelect(dateString, date) {
+		console.log('onSelect', dateString, date);
 	}
+
+	function onChange(dateString, date) {
+		console.log('onChange: ', dateString, date);
+	}
+
+	function onOk(dateString, date) {
+		console.log('onOk: ', dateString, date);
+	}
+
+
+	function handleCheckParty() {
+		console.log('check party');
+	}
+
+
+	const onReload = () => {
+		console.log('表格数据刷新');
+	};
+
 
 	return (
-		<Page
-			pageHead={
-				isAddOrEdit || isAddOrEditDept
-					? addOrEditBreadcrumb()
-					: { breadcrumbData: [{ title: '基础信息管理' }, { title: '组织架构' }], title: '组织架构' }
-			}
-		>
-			<div style={{ display: isAddOrEdit || isAddOrEditDept ? 'none' : '' }} className="organization">
-				<div className="organization-bg">
-					<div className="organization-side">
-						<Space size="middle" className="organization-side-search">
-							<Search
-								placeholder="请搜索组织"
-								value={organizationSearch.value}
-								onChange={(e) => setOrganizationSearch({ ...organizationSearch, value: e.target.value })}
-								onSearch={handleSearchOrganization}
-							/>
-							<Tooltip title="刷新">
-								<ReloadOutlined style={{ fontSize: 16 }} className="public-a" onClick={() => getOrganization('', 'reset')} />
-							</Tooltip>
-						</Space>
-						<div className="organization-side-tree">
-							{organizationData.length > 0 ? (
-								<MyTree
-									active={organizationActive.id}
-									keyStr="id"
-									nameStr="name"
-									data={organizationData}
-									searchValue={organizationSearch.searchValue}
-									dropdownOption={dropdownOptions}
-									isChildren={true}
-									handleClickTreeNode={handleOrganization}
+		<div style={{ position: 'relative' }}>
+			<NewPage
+				pageHead={
+					{ breadcrumbData: [{ title: '工作台' }, { title: '来访登记' }], title: '来访登记' }
+				}
+			>
+				<RegisterTab tabs={tabs} activeKey={tabsActive} onChange={(activeKey) => setTabsActive(activeKey)} style={{ background: '#fff' }} />
+				{tabsActive === '1' &&
+					<div style={{ backgroundColor: '#fff', margin: '8px 16px 0px 16px', padding: '12px 16px 16px 16px' }}>
+						<Col span={24} style={{ display: 'flex', alignItems: 'center' }}>
+							<Space size='small'>
+								<div className='MediationInfo-subTitle' style={{ marginTop: '-6px' }}></div><h5>当事人信息</h5>
+							</Space>
+						</Col>
+						<div style={{ display: 'flex' }}>
+							<div style={{ flex: 3 }}>
+								<PersonCard
+									isCheck={true}
+									partyType={'applicant'} // 这里设定为申请人
+									data={fakeData}
+									handleCheckParty={handleCheckParty}
 								/>
-							) : (
-								$$.MyEmpty({ description: '抱歉!暂无组织数据,请先添加组织', style: { margin: '50px auto' } })
-							)}
+							</div>
+							<div style={{ flex: 1, }}>
+								<Tooltip
+									title={(<Space direction='vertical '><div style={{ backgroundColor: '#1A6FB8', padding: '5px 12px', display: 'flex', justifyContent: 'center' }}>申请方</div><div style={{ backgroundColor: '#FA8C16', padding: '5px 12px', display: 'flex', justifyContent: 'center' }}>被申请方</div><div style={{ backgroundColor: '#3491FA', padding: '5px 12px', display: 'flex', justifyContent: 'center' }}>代理人</div></Space>)}
+									placement="right" color='#ffff' overlayStyle={{}}>
+									<div onClick={() => setVisible(true)} style={{ backgroundColor: '#E5E6EB', borderRadius: '50%', width: '64px', height: '64px' }}>
+										<img src={add} alt="添加" style={{ width: '32px', margin: '16px' }} />
+									</div>
+								</Tooltip>
+							</div>
+						</div>
+						<Col span={24} style={{ display: 'flex', alignItems: 'center', marginBottom: '8px' }}>
+							<Space size='small'>
+								<div className='MediationInfo-subTitle' style={{ marginTop: '-6px' }}></div><h5>纠纷基本情况</h5>
+							</Space>
+						</Col>
+						<Form
+							layout='vertical'
+						>
+							<Row gutter={[32, 0]}>
+								<Col span={8}>
+									<FormItem label='事项等级' field='username' tooltip={<div className='question'>Username is required </div>} >
+										<Select defaultValue='三级' placeholder='Select city' allowClear>
+											{['一级', '二级', '三级', '四级'].map((option, index) => (
+												<Option key={option} value={option}>
+													{option}
+												</Option>
+											))}
+										</Select>
+									</FormItem>
+								</Col>
+								<Col span={8}>
+									<FormItem label='来访时间' >
+										<DatePicker
+											style={{ width: '100%' }}
+											format='YYYY-MM-DD HH:mm'
+											onChange={onChange}
+											onSelect={onSelect}
+											onOk={onOk}
+										/>
+									</FormItem>
+								</Col>
+								<Col span={8}>
+									<FormItem label='来访人数(人)'>
+										<Input placeholder='请填写' />
+									</FormItem>
+								</Col>
+								<Col span={8}>
+									<FormItem
+										label={(<div style={{ display: 'flex' }}>纠纷类型<div className="must">必填</div></div>)}>
+										<Select initialValue='Beijing' placeholder='请选择' allowClear>
+											{['邻里纠纷', '劳动争议纠纷', '劳动纠纷', '经济纠纷'].map((option, index) => (
+												<Option key={option} value={option}>
+													{option}
+												</Option>
+											))}
+										</Select>
+									</FormItem>
+								</Col>
+								<Col span={8}>
+									<FormItem label={(<div style={{ display: 'flex' }}>纠纷发生时间<div className="must">必填</div></div>)}>
+										<DatePicker
+											style={{ width: '100%' }}
+											placeholder='请选择'
+											format='YYYY-MM-DD HH:mm'
+											onChange={onChange}
+											onSelect={onSelect}
+											onOk={onOk}
+										/>
+									</FormItem>
+								</Col>
+								<Col span={8}>
+									<FormItem label={(<div style={{ display: 'flex' }}>纠纷发生地点<div className="must">必填</div></div>)}>
+										<InputSearch
+											searchButton='选择'
+											defaultValue='Search content'
+											placeholder='选择纠纷发生地的详细地址'
+										/>
+									</FormItem>
+								</Col>
+								<Col span={8}>
+									<FormItem label='问题属地'>
+										<Cascader
+											placeholder='Please select ...'
+											options={options}
+											onChange={(value, option) => {
+												console.log(value, option);
+											}}
+											defaultValue={['shanghai', 'shanghaishi', 'huangpu']}
+											allowClear
+										/>
+									</FormItem>
+								</Col>
+								<Col span={8}>
+									<FormItem label='涉及人数(人)'>
+										<Input placeholder='请填写' />
+									</FormItem>
+								</Col>
+
+								<Col span={8}>
+									<FormItem label='涉及金额(元)'>
+										<Input placeholder='请填写' />
+									</FormItem>
+								</Col>
+								<Col span={24}>
+									<FormItem
+										label={<div style={{ display: 'flex' }}>事项概况<Tooltip title='1111'><img src={question1} alt="" style={{ width: '13px', height: '13px', marginTop: '4px', marginLeft: '4px' }} /></Tooltip><div className="must">必填</div><div style={{ marginLeft: '8px', color: '#1A6FB8', fontSize: '14px' }}>识别上传材料</div></div>}
+									>
+										<Input.TextArea
+											maxLength={2000}
+											showWordLimit
+											rows={5}
+											placeholder='请填写问题发生的起因、过程和结果'
+											wrapperStyle={{ width: '100%' }}
+										/>
+									</FormItem>
+								</Col>
+								<Col span={24}>
+									<FormItem
+										label={<div style={{ display: 'flex' }}>申请请求<Tooltip title='1111'><img src={question1} alt="" style={{ width: '13px', height: '13px', marginTop: '4px', marginLeft: '4px' }} /></Tooltip><div className="must">必填</div><div style={{ marginLeft: '8px', color: '#1A6FB8', fontSize: '14px' }}>识别上传材料</div></div>}
+									>
+										<Input.TextArea
+											maxLength={2000}
+											showWordLimit
+											rows={5}
+											placeholder='希望相关部门如何处理,建议分条描述,如请求1,请求2...'
+											wrapperStyle={{ width: '100%' }}
+										/>
+									</FormItem>
+								</Col>
+								<div style={{ marginLeft: '16px', padding: '12px 16px', backgroundColor: '#EFF8FF', borderRadius: '2px' }}>
+									<FormItem label='是否重大矛盾纠纷' style={{ marginBottom: '-20px' }}>
+										<RadioGroup options={['A', 'B']} style={{ marginBottom: 20 }} />
+									</FormItem>
+								</div>
+							</Row>
+
+						</Form>
+						<Col span={24} style={{ display: 'flex', alignItems: 'center', marginBottom: '8px', marginTop: '20px' }}>
+							<Space size='small'>
+								<div className='MediationInfo-subTitle' style={{ marginTop: '-6px' }}></div><h5>事件材料</h5>
+							</Space>
+						</Col>
+						<TableView
+							columns={fakeColumns}
+							dataSource={fakeData1}
+							size="small"
+							rowKey="id"
+							bordered={true}
+							style={{ marginBottom: '60px' }}
+						/>
+						<div className="dataSync-excel">
+							<Space size="large" style={{ margin: '4px 14px' }}>
+								<Button type="primary" style={{ backgroundColor: '#1A6FB8' }}>保存信息</Button>
+								<Button type='outline' style={{ color: '#1A6FB8', border: '1px solid #1A6FB8' }}>预览信息</Button>
+								<Button type='outline' style={{ color: '#1A6FB8', border: '1px solid #1A6FB8' }}>提交信息</Button>
+								<Button type='outline' style={{ color: '#1A6FB8', border: '1px solid #1A6FB8' }}>自行受理</Button>
+								<Button type='secondary'>返回上级页面</Button>
+							</Space>
 						</div>
 					</div>
-					<div className="organization-divider"></div>
-					{organizationData.length > 0 ? (
-						<DepartmentTable
-							organizationActive={organizationActive}
-							departmentData={departmentData}
-							handlePersonnelModal={handlePersonnelModal}
-							handleChangeIsAddOrEdit={(type, record) => {
-								setIsAddOrEditDept(type);
-								setDeptEditData(record || {});
-							}}
-							handleDelDept={delDept}
-						/>
-					) : (
-						$$.MyEmpty({ description: '抱歉!暂无组织数据,请先添加组织', style: { margin: '100px auto' } })
-					)}
-				</div>
-			</div>
-			{/* 新增 or 修改组织page */}
-			<AddOrEditOrganization
-				isAddOrEdit={isAddOrEdit}
-				type={organizationEditData.type}
-				organizationActive={organizationEditData.active}
-				handleFinishForm={setOrganization}
-			/>
-			{/* 新增 or 修改部门page */}
-			<AddOrEditDept
-				isAddOrEditDept={isAddOrEditDept}
-				deptActive={deptEditData}
-				unMatchUsers={organizationActive.unMatchUsers || []}
-				handleFinishForm={setDept}
-			/>
-			{/*  查看人员Modal */}
-			{modalData.visible && <PersonnelModal modalData={modalData} handlePersonnelModal={handlePersonnelModal} handleSearch={getPersons} />}
-		</Page>
-	);
-};
+
+				}
+			</NewPage>
+
+		</div>
+	)
+}
 
 export default Organization;

--
Gitblit v1.8.0