~liuwh/gzDyh.git

			@@ -1,5 +1,15 @@
			import React from 'react';
			/*
			* @Author: dminyi 1301963064@qq.com
			* @Date: 2024-08-27 16:47:12
			* @LastEditors: dminyi 1301963064@qq.com
			* @LastEditTime: 2024-09-07 15:35:53
			* @FilePath: \gzDyh\gz-customerSystem\src\views\register\visit\component\levelDetail.jsx
			* @Description: 右抽屉提示
			*/
			import React, { useState } from 'react';
			import MyDrawer from '@/components/MyDrawer';
			import { caselogo } from '@/assets/images';


			const EventLevelDrawer = ({ visible, onClose }) => {
			return (
			@@ -14,7 +24,7 @@
			>
			<div style={{ marginTop: '-8px' }}>
			<div>
			<div style={{ color: '#1A6FB8', fontSize: '15px', lineHeight: '23px', marginBottom: '8px' }}>一类重点事件</div>
			<div style={{ color: '#1A6FB8', fontSize: '15px', lineHeight: '23px', marginBottom: '8px' }}>一级重点事件</div>
			1、5人（含5人）以上到非接待场所聚集、滞留、静坐、游行或准备上访；<br />
			2、拉横幅、穿着“状衣”、呼喊口号、呼喊标语、堵塞交通非法占据公其场所、扰乱公共秩序、向他人散发传单等上访材料；<br />
			3、拖欠工资、劳资纠纷涉及人数5人以上；<br />
			@@ -24,7 +34,7 @@
			7、群体性民事纠纷（5人及5人以上的邻里矛盾纠纷、经济债务纠纷、家庭纠纷等可能导致“民转刑”的民事纠纷）；8、存在重大安全隐患、重大不稳定因索的矛盾；9、涉及政治类，非宗教类的非访宣传（在出租屋内从事涉邪教迷信印刷、存放资料的；在公共场所粘贴类似邪教的符号、图案、标志等）10、县（市、区）职能部门、各镇（街道）分管领导根据应急情况认为有必要启动红色预警机制的其他矛盾纠纷。
			</div>
			<div>
			<div style={{ color: '#1A6FB8', fontSize: '15px', lineHeight: '23px', marginBottom: '8px', marginTop: '20px' }}>二类重点事件</div>
			<div style={{ color: '#1A6FB8', fontSize: '15px', lineHeight: '23px', marginBottom: '8px', marginTop: '20px' }}>二级重点事件</div>
			1、5人（含5人）以上到非接待场所聚集、滞留、静坐、游行或准备上访；<br />
			2、拉横幅、穿着“状衣”、呼喊口号、呼喊标语、堵塞交通非法占据公其场所、扰乱公共秩序、向他人散发传单等上访材料；<br />
			3、拖欠工资、劳资纠纷涉及人数5人以上；<br />
			@@ -34,7 +44,7 @@
			7、群体性民事纠纷（5人及5人以上的邻里矛盾纠纷、经济债务纠纷、家庭纠纷等可能导致“民转刑”的民事纠纷）；8、存在重大安全隐患、重大不稳定因索的矛盾；9、涉及政治类，非宗教类的非访宣传（在出租屋内从事涉邪教迷信印刷、存放资料的；在公共场所粘贴类似邪教的符号、图案、标志等）10、县（市、区）职能部门、各镇（街道）分管领导根据应急情况认为有必要启动红色预警机制的其他矛盾纠纷。
			</div>
			<div>
			<div style={{ color: '#1A6FB8', fontSize: '15px', lineHeight: '23px', marginBottom: '8px', marginTop: '20px' }}>三类普通事件</div>
			<div style={{ color: '#1A6FB8', fontSize: '15px', lineHeight: '23px', marginBottom: '8px', marginTop: '20px' }}>三级普通事件</div>
			1、5人（含5人）以上到非接待场所聚集、滞留、静坐、游行或准备上访；<br />
			2、拉横幅、穿着“状衣”、呼喊口号、呼喊标语、堵塞交通非法占据公其场所、扰乱公共秩序、向他人散发传单等上访材料；<br />
			3、拖欠工资、劳资纠纷涉及人数5人以上；<br />
			@@ -69,4 +79,157 @@
			);
			}

			export { EventLevelDrawer, MattersDetail };
			const NoHandleReason = ({ visible, onClose }) => {
			return (
			<div className='MyDrawer'>
			<MyDrawer
			visible={visible}
			onClose={onClose}
			title="无法化解理由"
			width={1000}
			style={{ position: 'absolute' }}
			bodyStyle={{ marginTop: '-8px' }}
			titleBefore={true}
			>
			<div style={{ marginTop: '-8px' }}>
			完整的无法化解理由至少应具备3要素：调解过程中提供的解决方案+调解过程中的主要分歧点+最终难以调和的原因
			例如：
			调解工作于2024年1月10日在某街道人民调解委员会进行，双方当事人均到场参与。调解员首先听取了双方当事人的陈述，随后进行了多次单独会谈，根据被申请方的实际情况提出分期支付欠款的解决方案。在调解过程中，双方就具体支付方式进行了反复讨论，但未能达成一致意见。双方的主要分歧点在与被申请方不想一次性支付欠款。双方在沟通过程中情绪激动，互不相让。尽管调解员尝试缓和气氛，并引导双方从利益出发寻求解决方案，但双方仍坚持各自的立场，不愿妥协。
			</div>
			</MyDrawer>

			</div>

			)

			}

			const AiQuestion = ({ visible, onClose }) => {
			const [list, setList] = useState([
			{
			id: '1',
			type: '典型案例',
			name: '唐某某诉重庆某工业有限公司劳动合同纠纷案'
			},
			{
			id: '2',
			type: '相似案例',
			name: '曾某某诉某网络科技公司劳动争议案'
			},
			{
			id: '3',
			type: '相似案例',
			name: '曾某某诉某网络科技公司劳动争议案'
			},
			])

			const [layerList, setLayerList] = useState([
			{
			id: '1',
			name: '法条一'
			},
			{
			id: '2',
			name: '法条二'
			},
			{
			id: '3',
			name: '法条三'
			},
			])

			const [caseDetail,setCaseDetail] = useState(false)
			const toggleView = (id) => {
			console.log(id, 'iddddddd')
			setCaseDetail(true)
			aiCaseDetail(id)
			};

			const caseDetailOnClose = () => {
			setCaseDetail(false)
			}

			const aiCaseDetail = () => {

			}



			return (
			<>
			<MyDrawer
			visible={visible}
			onClose={onClose}
			title="智能调解助理"
			width={1000}
			style={{ position: 'absolute' }}
			bodyStyle={{ marginTop: '-8px' }}
			titleBefore={true}
			>
			<div style={{ display: 'flex' }}>
			<div style={{ width: '100px' }}></div>
			<div className='aiBox'>
			<div className='aiBox-case'>
			<div className='aiBox-case-logo'>
			<img src={caselogo} alt='' className='aiBox-case-logo-img' />
			</div>
			<div style={{ flex: 1 }}>刘家健入职吴昆物流公司工作6天，因不适应工作内容、环境等，向吴昆物流公司提出离职申请，但公司称入职1周内因个人原因辞职不予支付工资。刘家健因此向社区调委会申请调解。刘家健希望吴昆物流公司支付6天的工资。经调解，双方达成一致意见，吴昆物流公司同意支付刘家健6天的工资共计1575元。基于这个案件生成合理的调解策略.</div>
			</div>
			<div className='marginLeft'>
			<div className='marginLeft-title'>相关案例：</div>
			<div className='aiBox-list'>
			{list?.map((item, index) => (
			<div className='aiBox-list-item'>
			<div className='aiBox-list-item-type'>{item.type}</div>
			<div className='aiBox-list-item-name'>{item.name}</div>
			<div className='aiBox-list-item-btn' onClick={() => toggleView(item.id)}>查看</div>
			</div>
			))}
			</div>


			</div>
			<div className='marginLeft'>
			<div className='marginLeft-title'>相关法条：</div>
			<div className='aiBox-list'>
			{layerList?.map((item, index) => (
			<div className='aiBox-list-item'>
			<div className='aiBox-list-item-type'>相关法条</div>
			<div className='aiBox-list-item-name'>{item.name}</div>
			<div className='aiBox-list-item-btn' onClick={() => toggleView(item.id)}>查看</div>
			</div>
			))}
			</div>
			</div>

			</div>
			</div>
			</MyDrawer>
			<div className='MyDrawer'>
			<MyDrawer
			visible={caseDetail}
			onClose={caseDetailOnClose}
			title="查看相关案例"
			width={400}
			style={{ position: 'absolute' }}
			bodyStyle={{ marginTop: '-8px' }}
			titleBefore={true}
			>
			<div className='layerDetail'>
			<div className='layerDetail-title'>参考案例</div>
			<div className='layerDetail-name'>唐某某诉重庆某工业有限公司劳动合同纠纷案</div>
			<div className='layerDetail-littleTitle'>智能摘要</div>
			<div className='layerDetail-content'>法院生效裁判认为，本案是肖某某要求某工业公司支付经济补偿金，原审法院已经确认某工业公司存在未足额支付肖某某工资、未休年休假工资情形，故依照《中华人民共和国劳动合同法》（以下简称劳动合同法）第三十八条第一款的规定，某工业公司应当支付解除合同的经济补偿金。</div>
			</div>
			</MyDrawer>

			</div>

			</>

			)
			}



			export { EventLevelDrawer, MattersDetail, NoHandleReason, AiQuestion };