/*
|
* @Author: dminyi 1301963064@qq.com
|
* @Date: 2024-08-27 16:47:12
|
* @LastEditors: dminyi 1301963064@qq.com
|
* @LastEditTime: 2024-09-11 13:35:29
|
* @FilePath: \gzDyh\gz-customerSystem\src\views\register\visit\component\levelDetail.jsx
|
* @Description: 右抽屉提示
|
*/
|
import React, { useEffect, useState } from 'react';
|
import MyDrawer from '@/components/MyDrawer';
|
import { caselogo } from '@/assets/images';
|
import * as $$ from '@/utils/utility';
|
|
|
function getCaseDetailApi(data) {
|
return $$.ax.request({ urlAi: `case-law/get-case-detail`, typeAi: 'get', service: 'mediate', data });
|
}
|
|
|
const EventLevelDrawer = ({ visible, onClose }) => {
|
return (
|
<MyDrawer
|
visible={visible}
|
onClose={onClose}
|
title="事件等级"
|
width={1000}
|
style={{ position: 'absolute' }}
|
bodyStyle={{ marginTop: '-8px' }}
|
titleBefore={true}
|
>
|
<div style={{ marginTop: '-8px' }}>
|
<div>
|
<div style={{ color: '#1A6FB8', fontSize: '15px', lineHeight: '23px', marginBottom: '8px' }}>一级重点事件</div>
|
1、5人（含5人）以上到非接待场所聚集、滞留、静坐、游行或准备上访；<br />
|
2、拉横幅、穿着“状衣”、呼喊口号、呼喊标语、堵塞交通非法占据公其场所、扰乱公共秩序、向他人散发传单等上访材料；<br />
|
3、拖欠工资、劳资纠纷涉及人数5人以上；<br />
|
4、拖欠工资总全额5万元以上，经济合同外涉金额20万元以上；<br />
|
5、扬言到市赴省进京越级上访；
|
6、存在轻生、自残等危险行为，打砸公私财物等极端倾向；<br />
|
7、群体性民事纠纷（5人及5人以上的邻里矛盾纠纷、经济债务纠纷、家庭纠纷等可能导致“民转刑”的民事纠纷）；8、存在重大安全隐患、重大不稳定因索的矛盾；9、涉及政治类，非宗教类的非访宣传（在出租屋内从事涉邪教迷信印刷、存放资料的；在公共场所粘贴类似邪教的符号、图案、标志等）10、县（市、区）职能部门、各镇（街道）分管领导根据应急情况认为有必要启动红色预警机制的其他矛盾纠纷。
|
</div>
|
<div>
|
<div style={{ color: '#1A6FB8', fontSize: '15px', lineHeight: '23px', marginBottom: '8px', marginTop: '20px' }}>二级重点事件</div>
|
1、5人（含5人）以上到非接待场所聚集、滞留、静坐、游行或准备上访；<br />
|
2、拉横幅、穿着“状衣”、呼喊口号、呼喊标语、堵塞交通非法占据公其场所、扰乱公共秩序、向他人散发传单等上访材料；<br />
|
3、拖欠工资、劳资纠纷涉及人数5人以上；<br />
|
4、拖欠工资总全额5万元以上，经济合同外涉金额20万元以上；<br />
|
5、扬言到市赴省进京越级上访；
|
6、存在轻生、自残等危险行为，打砸公私财物等极端倾向；<br />
|
7、群体性民事纠纷（5人及5人以上的邻里矛盾纠纷、经济债务纠纷、家庭纠纷等可能导致“民转刑”的民事纠纷）；8、存在重大安全隐患、重大不稳定因索的矛盾；9、涉及政治类，非宗教类的非访宣传（在出租屋内从事涉邪教迷信印刷、存放资料的；在公共场所粘贴类似邪教的符号、图案、标志等）10、县（市、区）职能部门、各镇（街道）分管领导根据应急情况认为有必要启动红色预警机制的其他矛盾纠纷。
|
</div>
|
<div>
|
<div style={{ color: '#1A6FB8', fontSize: '15px', lineHeight: '23px', marginBottom: '8px', marginTop: '20px' }}>三级普通事件</div>
|
1、5人（含5人）以上到非接待场所聚集、滞留、静坐、游行或准备上访；<br />
|
2、拉横幅、穿着“状衣”、呼喊口号、呼喊标语、堵塞交通非法占据公其场所、扰乱公共秩序、向他人散发传单等上访材料；<br />
|
3、拖欠工资、劳资纠纷涉及人数5人以上；<br />
|
4、拖欠工资总全额5万元以上，经济合同外涉金额20万元以上；<br />
|
5、扬言到市赴省进京越级上访；
|
6、存在轻生、自残等危险行为，打砸公私财物等极端倾向；<br />
|
7、群体性民事纠纷（5人及5人以上的邻里矛盾纠纷、经济债务纠纷、家庭纠纷等可能导致“民转刑”的民事纠纷）；8、存在重大安全隐患、重大不稳定因索的矛盾；9、涉及政治类，非宗教类的非访宣传（在出租屋内从事涉邪教迷信印刷、存放资料的；在公共场所粘贴类似邪教的符号、图案、标志等）10、县（市、区）职能部门、各镇（街道）分管领导根据应急情况认为有必要启动红色预警机制的其他矛盾纠纷。
|
</div>
|
|
</div>
|
</MyDrawer>
|
);
|
};
|
|
const MattersDetail = ({ visible, onClose }) => {
|
return (
|
<MyDrawer
|
visible={visible}
|
onClose={onClose}
|
title="事项概况"
|
width={1000}
|
style={{ position: 'absolute' }}
|
bodyStyle={{ marginTop: '-8px' }}
|
titleBefore={true}
|
>
|
<div style={{ marginTop: '-8px' }}>
|
事项简述应该填写完整，完整的事项简述应具备5要素：发生时间+发生地点+人物情况+事项起因+事项经过。<br />
|
例如：<br />
|
2024年8月13日，张某与女性好友王某在某烧烤档就餐期间发生场盾争执，报警人称女方从今年一月份开始，以各种理由让其帮忙付了外卖费，送金链等首饰，但又不确认关系，女方后期还拉黑了报警人，因此报警人认为女方涉嫌诈骗。
|
</div>
|
</MyDrawer>
|
);
|
}
|
|
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, aiData, aiLawData, caseDetailAi }) => {
|
const [list, setList] = useState([
|
// {
|
// id: '1',
|
// type: '典型案例',
|
// name: '唐某某诉重庆某工业有限公司劳动合同纠纷案'
|
// },
|
// {
|
// id: '2',
|
// type: '相似案例',
|
// name: '曾某某诉某网络科技公司劳动争议案'
|
// },
|
// {
|
// id: '3',
|
// type: '相似案例',
|
// name: '曾某某诉某网络科技公司劳动争议案'
|
// },
|
])
|
const [caseDetailView, setCaseDetailView] = useState({})
|
const [modalType, setModalType] = useState('case')
|
const [lawDetail, setLawDetail] = useState({})
|
const [layerList, setLayerList] = useState([
|
{
|
id: '1',
|
name: '法条一'
|
},
|
{
|
id: '2',
|
name: '法条二'
|
},
|
{
|
id: '3',
|
name: '法条三'
|
},
|
])
|
|
const [caseDetail, setCaseDetail] = useState(false)
|
const toggleView = (type, id, caseType) => {
|
setCaseDetail(true)
|
setModalType(type)
|
|
if (type === 'case') {
|
getCaseDetail(id, caseType);
|
}
|
if (type === 'law') {
|
console.log(id, 'idddddd')
|
|
const lawItem = aiLawData.find(item => item.lawInfoId === id)
|
console.log(lawItem, 'lawItem')
|
setLawDetail(lawItem)
|
}
|
};
|
|
|
const caseDetailOnClose = () => {
|
setCaseDetail(false)
|
}
|
|
const getCaseDetail = async (id, type) => {
|
const res = await getCaseDetailApi({
|
caseId: id,
|
type: type
|
})
|
if (res.type) {
|
setCaseDetailView(res.data)
|
}
|
}
|
|
useEffect(() => {
|
setList(aiData);
|
setLayerList(aiLawData);
|
|
}, [aiData, aiLawData])
|
|
return (
|
<>
|
<MyDrawer
|
visible={visible}
|
onClose={onClose}
|
title="穗调解数智人"
|
width={1200}
|
style={{ position: 'absolute' }}
|
bodyStyle={{ marginTop: '-8px' }}
|
titleBefore={true}
|
>
|
<div style={{ display: 'flex' }}>
|
<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, marginTop: '4px' }}>{caseDetailAi}</div>
|
</div>
|
<div className='marginLeft-tip' >
|
根据当事人的事项概况和事项申请，推荐以下类案和法条参考：
|
</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.caseType === 1 ? '典型案例' : '相似案例'}</div>
|
<div className='aiBox-list-item-name'>{item.caseName}</div>
|
<div className='aiBox-list-item-btn' onClick={() => toggleView('case', item.caseId, item.caseType)} >查看</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.lawTitle}{item.lawIndex}</div>
|
<div className='aiBox-list-item-btn' onClick={() => toggleView('law', item.lawInfoId)} >查看</div>
|
</div>
|
))}
|
</div>
|
</div>
|
|
</div>
|
</div>
|
</MyDrawer>
|
<div className='MyDrawer'>
|
<MyDrawer
|
visible={caseDetail}
|
onClose={caseDetailOnClose}
|
title={modalType === 'case' ? "查看相关案例" : "查看相关法条"}
|
width={400}
|
style={{ position: 'absolute' }}
|
bodyStyle={{ marginTop: '-8px' }}
|
titleBefore={true}
|
>
|
{
|
modalType === 'case' &&
|
<div className='layerDetail'>
|
<div className='layerDetail-title'>参考案例</div>
|
<div className='layerDetail-name'>{caseDetailView?.caseTitle || '-'}</div>
|
<div className='layerDetail-littleTitle'>案件描述</div>
|
<div className='layerDetail-content'>{caseDetailView?.caseDesc || '-'}</div>
|
<div className='layerDetail-littleTitle'>群众诉求</div>
|
<div className='layerDetail-content'>{caseDetailView?.caseClaim || '-'}</div>
|
<div className='layerDetail-littleTitle'>和解协议</div>
|
<div className='layerDetail-content'>{caseDetailView?.agreeContent || '-'}</div>
|
</div>
|
}
|
{
|
modalType === 'law' &&
|
<div className='layerDetail'>
|
<div className='layerDetail-title'>{lawDetail?.lawIndex} {lawDetail?.lawTitle}</div>
|
<div className='layerDetail-littleTitle'>{lawDetail.lawDesc}</div>
|
</div>
|
}
|
</MyDrawer>
|
</div>
|
|
</>
|
|
)
|
}
|
|
|
|
export { EventLevelDrawer, MattersDetail, NoHandleReason, AiQuestion };
|
