| | |
| | | * @Author: dminyi 1301963064@qq.com |
| | | * @Date: 2024-09-02 14:49:13 |
| | | * @LastEditors: dminyi 1301963064@qq.com |
| | | * @LastEditTime: 2024-09-11 11:34:07 |
| | | * @LastEditTime: 2024-09-12 12:03:56 |
| | | * @FilePath: \gzDyh\gz-customerSystem\src\views\register\handleFeedback\component\CaseResult.jsx |
| | | * @Description: 结案申请 |
| | | */ |
| | |
| | | |
| | | const CaseResult = ({ visible = false, handleOnCancel, caseResultId, caseId, caseTaskId }) => { |
| | | const formRef = useRef(); |
| | | const [selectedTemplate, setSelectedTemplate] = useState(); |
| | | const [selectedTemplate1, setSelectedTemplate1] = useState(); |
| | | const [selectedTemplate2, setSelectedTemplate2] = useState(); |
| | | const navigate = useNavigate(); |
| | | const formRefWrite = useRef(); |
| | | const failRef = useRef(); |
| | | const [selectedTab, setSelectedTab] = useState('1'); // 默认选中第一个 tab |
| | | const [scanFile, setScanFile] = useState(false); |
| | | const [selectedTab1, setSelectedTab1] = useState('1'); // 默认选中第一个 tab |
| | | const [fileTip, setFileTip] = useState('0'); |
| | | const [value, setValue] = useState(1) |
| | | const [value, setValue] = useState(2) |
| | | const [noHandleReason, setNoHandleReason] = useState(false); |
| | | const [radioValue, setRadioValue] = useState(1); |
| | | const [mode, setMode] = useState(false) |
| | | |
| | | const tabs = [ |
| | | { index: '1', label: '化解成功' }, |
| | | { index: '2', label: '化解不成功' }, |
| | | ]; |
| | | |
| | | const tabs1 = [ |
| | | { index: '1', label: '公共模板1:化解成功结案意见范本' }, |
| | | { index: '2', label: '个人模板1:化解成功结案意见范本(完整版)' } |
| | | ] |
| | | |
| | | const agreement = [ |
| | | { value: 1, label: '口头协议' }, |
| | |
| | | |
| | | const handleTabChange = (newTabIndex) => { |
| | | setSelectedTab(newTabIndex); |
| | | }; |
| | | |
| | | const handleTabChange1 = (newTabIndex) => { |
| | | setSelectedTab1(newTabIndex); |
| | | }; |
| | | |
| | | const handleConfirm = (scanContent) => { |
| | |
| | | }; |
| | | |
| | | const handleTemplate = (type) => { |
| | | setSelectedTemplate(type); |
| | | if (type === 1) { |
| | | formRef.current.setFieldValue('windupContent', '鉴于以上协议内容已经双方确认,并认为该协议内容公平合理,能够妥善解决双方的纠纷。建议双方当事人按照协议内容执行,以实现纠纷的最终解决。') |
| | | formRef.current.setFieldValue('windupContent', '双方当事人于xx时间xx地址已达成xx协议,纠纷已化解。') |
| | | } else { |
| | | formRef.current.setFieldValue('windupContent', '') |
| | | } |
| | | } |
| | | |
| | | const handleTemplate1 = (type) => { |
| | | setSelectedTemplate1(type); |
| | | if (type === 1) { |
| | | formRef.current.setFieldValue('agreeContent', '根据纠纷化解人员的协调,当事人双方同意如下调解协议:[简要说明协议第一条][简要说明协议第二条][……]本口头调解协议由纠纷化解人员记录,并已告知双方当事人。双方当事人确认无误。') |
| | | } |
| | | } |
| | | |
| | | const handleTemplate2 = (type) => { |
| | | setSelectedTemplate2(type); |
| | | if (type === 1) { |
| | | formRefWrite.current.setFieldValue('windupContent', '鉴于以上协议内容已经双方确认,并认为该协议内容公平合理,能够妥善解决双方的纠纷。建议双方当事人按照协议内容执行,以实现纠纷的最终解决。') |
| | | formRefWrite.current.setFieldValue('windupContent', '双方当事人于xx时间xx地址已达成xx协议,纠纷已化解。') |
| | | } else { |
| | | formRefWrite.current.setFieldValue('windupContent', '') |
| | | } |
| | |
| | | } |
| | | } |
| | | |
| | | //化解成功的提交处理 |
| | | const handleSubmit = () => { |
| | | //口头协议 |
| | | if (value === 1) { |
| | | const data = formRef?.current.getFields() |
| | | console.log(data, 'handleSubmit') |
| | | windupApply(data) |
| | | } |
| | | //书面协议 |
| | | if (value === 2) { |
| | | const data = formRefWrite?.current.getFields() |
| | | console.log(data, 'handleSubmit') |
| | | windupApply(data) |
| | | } |
| | | if (selectedTab === '2') { |
| | | const data = failRef?.current.getFields() |
| | | console.log(data, 'handleSubmit') |
| | | // windupApply(data) |
| | | |
| | | |
| | | } |
| | | |
| | | } |
| | | |
| | | //化解不成功的提交处理 |
| | | const handleSubmit1 = () => { |
| | | if (selectedTab === '2') { |
| | | const data = failRef?.current.getFields() |
| | | console.log(data, 'handleSubmit') |
| | | windupApply(data) |
| | | } |
| | | |
| | | } |
| | | |
| | | //结案申请请求 |
| | | const windupApply = async (submitData) => { |
| | | console.log( |
| | | { |
| | | mediResultName: selectedTab === '1' ? '化解成功' : '化解不成功', |
| | | mediResult: selectedTab === '1' ? '22_00025-1' : '22_00025-2', |
| | | agreeType: selectedTab === '1' ? '24_00003-1' : '24_00003-2', |
| | | agreeTypeName: value === 1 ? '口头协议' : '书面协议', |
| | | caseTaskId: caseTaskId, |
| | | caseId: caseId, |
| | | caseResultId: caseResultId, |
| | | ...submitData |
| | | }, 'windupApplyData' |
| | | ) |
| | | const res = await windupApplyApi({ |
| | | mediResultName: selectedTab === '1' ? '化解成功' : '化解不成功', |
| | | mediResult: selectedTab === '1' ? '22_00025-1' : '22_00025-2', |
| | | agreeType: selectedTab === '1' ? '24_00003-1' : '24_00003-2', |
| | | agreeType: value === 1 ? '24_00003-1' : '24_00003-2', |
| | | agreeTypeName: value === 1 ? '口头协议' : '书面协议', |
| | | caseTaskId: caseTaskId, |
| | | caseId: caseId, |
| | |
| | | scrollToFirstError={true} |
| | | requiredSymbol={false} |
| | | initialValues={{ |
| | | agreeType: 1, |
| | | agreeType: value, |
| | | }} //默认值 |
| | | > |
| | | <Col span={8}> |
| | |
| | | } |
| | | field='agreeType' |
| | | > |
| | | <Select options={agreement} onChange={(v) => { setValue(v); console.log(typeof v, 'vvv') }}> |
| | | <Select options={agreement} onChange={(v) => { setValue(v); }}> |
| | | </Select> |
| | | </FormItem> |
| | | </Col> |
| | |
| | | <div className="must">必填</div> |
| | | </div> |
| | | <div className='caseResult-tips'> |
| | | <img src={tip} alt='' style={{ width: '16px', marginRight: '8px' }} /> |
| | | <img src={tip} alt='' style={{ width: '16px', marginRight: '8px',marginTop: '-5px' }} /> |
| | | <span>协议要点应尽量简洁,当事人大厅来访或小程序线上反映问题时,可在小程序中查看到填写的协议要点内容</span> |
| | | </div> |
| | | <div style={{ position: 'absolute', display: 'flex ', top: '79px', zIndex: 1 }}> |
| | | <div className='myTag' style={{ marginRight: '22px' }} onClick={() => { handleTemplate1(1) }}>公共模板:调解成功口头协议</div> |
| | | <div |
| | | className={`myTag ${selectedTemplate1 === 1 ? 'highlighted' : ''}`} // 条件样式 |
| | | style={{ marginRight: '22px' }} |
| | | onClick={() => handleTemplate1(1)} |
| | | > |
| | | 公共模板:调解成功口头协议 |
| | | </div> |
| | | </div> |
| | | </> |
| | | )} |
| | |
| | | </FormItem> |
| | | </Col> |
| | | <Col span={24} style={{ position: 'relative' }}> |
| | | <div style={{ position: 'absolute', display: 'flex ', top: '28px', zIndex: 1 }}> |
| | | <div className='myTag' style={{ marginRight: '22px' }} onClick={() => { handleTemplate(1) }}>公共模板:化解成功结案意见范本</div> |
| | | <div className='myTag' onClick={() => { handleTemplate(2) }}>个人模板:化解成功结案意见范本(完整版)</div> |
| | | <div style={{ position: 'absolute', display: 'flex', top: '28px', zIndex: 1 }}> |
| | | <div |
| | | className={`myTag ${selectedTemplate === 1 ? 'highlighted' : ''}`} // 条件样式 |
| | | style={{ marginRight: '22px' }} |
| | | onClick={() => handleTemplate(1)} |
| | | > |
| | | 公共模板:化解成功结案意见范本 |
| | | </div> |
| | | <div |
| | | className={`myTag ${selectedTemplate === 2 ? 'highlighted' : ''}`} // 条件样式 |
| | | onClick={() => handleTemplate(2)} |
| | | > |
| | | 个人模板:化解成功结案意见范本(完整版) |
| | | </div> |
| | | </div> |
| | | <FormItem |
| | | label={(<div style={{ display: 'flex' }}>结案意见<div className="must">必填</div></div>)} |
| | |
| | | <TextArea |
| | | autoSize={{ minRows: 4, maxRows: 8 }} |
| | | placeholder='请填写' |
| | | style={{ marginTop: '40px' }} |
| | | style={{ marginTop: '35px' }} |
| | | /> |
| | | </FormItem> |
| | | </Col> |
| | | |
| | | {/* <Col span={24}> |
| | | <FormItem |
| | | label={ |
| | | <> |
| | | <div style={{ display: 'flex' }}> |
| | | 结案意见 |
| | | <div className="must" style={{ marginLeft: '4px' }}>必填</div> |
| | | </div> |
| | | <div className='modeMore'> |
| | | <div className='tabs1' > |
| | | {tabs1.map((tab) => ( |
| | | <div |
| | | key={tab.index} |
| | | style={{ |
| | | color: selectedTab1 === tab.index ? 'rgba(26,111,184,1)' : 'rgba(0,0,0,0.45)', |
| | | border: `1px solid ${selectedTab1 === tab.index ? 'rgba(26,111,184,1)' : 'rgba(229,230,235,1)'}`, |
| | | borderRadius: '2px', |
| | | cursor: 'pointer', |
| | | padding: '0px 8px', |
| | | }} |
| | | onClick={() => handleTabChange1(tab.index)} |
| | | > |
| | | {tab.label} |
| | | </div> |
| | | ))} |
| | | </div> |
| | | <div style={{ color: '#1A6FB8' }} onClick={() => setMode(!mode)}>更多模板</div> |
| | | |
| | | </div> |
| | | </> |
| | | } |
| | | field='windupContent' |
| | | > |
| | | <Input.TextArea |
| | | rows={5} |
| | | wrapperStyle={{ width: '100%' }} |
| | | /> |
| | | </FormItem> |
| | | </Col> */} |
| | | </Row> |
| | | </Form> |
| | | </> |
| | |
| | | </FormItem> |
| | | </Col> |
| | | <Col span={24} style={{ position: 'relative' }}> |
| | | <div style={{ position: 'absolute', display: 'flex ', top: '28px', zIndex: 1 }}> |
| | | <div className='myTag' style={{ marginRight: '22px' }} onClick={() => { handleTemplate2(1) }}>公共模板:化解成功结案意见范本</div> |
| | | <div className='myTag' onClick={() => { handleTemplate2(2) }}>个人模板:化解成功结案意见范本(完整版)</div> |
| | | <div style={{ position: 'absolute', display: 'flex', top: '28px', zIndex: 1 }}> |
| | | <div |
| | | className={`myTag ${selectedTemplate2 === 1 ? 'highlighted' : ''}`} // 条件样式 |
| | | style={{ marginRight: '22px' }} |
| | | onClick={() => handleTemplate2(1)} |
| | | > |
| | | 公共模板:化解成功结案意见范本 |
| | | </div> |
| | | <div |
| | | className={`myTag ${selectedTemplate2 === 2 ? 'highlighted' : ''}`} // 条件样式 |
| | | onClick={() => handleTemplate2(2)} |
| | | > |
| | | 个人模板:化解成功结案意见范本(完整版) |
| | | </div> |
| | | </div> |
| | | |
| | | <FormItem |
| | | label={(<div style={{ display: 'flex' }}>结案意见<div className="must">必填</div></div>)} |
| | | field='windupContent' |
| | |
| | | <TextArea |
| | | autoSize={{ minRows: 4, maxRows: 8 }} |
| | | placeholder='请填写' |
| | | style={{ marginTop: '40px' }} |
| | | style={{ marginTop: '35px' }} |
| | | /> |
| | | </FormItem> |
| | | </Col> |
| | |
| | | <TextArea |
| | | autoSize={{ minRows: 4, maxRows: 8 }} |
| | | placeholder='请填写' |
| | | style={{ marginTop: '40px' }} |
| | | style={{ marginTop: '35px' }} |
| | | /> |
| | | </FormItem> |
| | | </Col> |